/* V5: acabamento refinado, mascote 2D e temas independentes. */
:root { --bg: #fcf8f7; --panel: #fffefa; --ink: #5c4753; --muted: #a18795; --rose: #d77b99; --rose-dark:#a95477; --line:#efdee4; --shadow:0 10px 32px rgba(120,66,90,.075); }
body { background:radial-gradient(ellipse at 9% 3%,#ffe7ed,transparent 32%),radial-gradient(ellipse at 90% 20%,#f9eef5,transparent 35%),var(--bg); }
.box { border-color:var(--line); }
.page { animation:float-in .38s ease both; }
@keyframes float-in { from { opacity:.4; transform:translateY(12px) } to {opacity:1;transform:translateY(0)} }
/* The cat is an original vector character with idle movement, blinking and actions. */
.pet-card { background:var(--panel); border:1px solid var(--line); overflow:hidden; }
.cat-hub { grid-template-columns:minmax(250px,1fr) minmax(280px,1fr); gap:17px; }
.cat-profile { background:linear-gradient(153deg,#fff9f7,#fff1ed);border:1px solid #f0dbd8;border-radius:24px;padding:16px 19px 20px; }
.cat-scene { min-height:285px;border-radius:23px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate;background:radial-gradient(circle at 49% 32%,#fffaf5 0%,#ffe8df 58%,#f7d8d7 100%);overflow:hidden; }
.cat-scene::before {content:'';position:absolute;inset:9px;border:1px solid #fff9;border-radius:18px;pointer-events:none}
.cat-scene::after {content:'';position:absolute;bottom:5px;left:12%;width:76%;height:44px;border-radius:50%;background:#bd71852a;filter:blur(11px);z-index:-1}
.cat-state { position:absolute;left:13px;top:13px;background:#fff9;border:1px solid #fff;border-radius:99px;font-size:11px;font-weight:900;color:#986677;padding:8px 12px;z-index:4;box-shadow:0 4px 13px #85465a17 }
.cat-stars { top:18px;left:auto;right:20px;opacity:.45;transform:rotate(15deg);z-index:1 }
.cat-paw {position:absolute;right:11px;bottom:17px;font-size:25px;opacity:.36}
.pet-character { position:relative;display:block;border:0;background:none;padding:0;width:min(92%,360px);min-height:0;aspect-ratio:420/360;cursor:pointer;outline-offset:-6px;filter:drop-shadow(0 10px 14px #984f5d26);z-index:2;touch-action:manipulation;animation:cat-idle 3.9s ease-in-out infinite;transform-origin:center 85%; }
.pet-character svg { display:block;width:100%;height:100%;overflow:visible; }
.pet-character:active {transform:scale(.96)}
.cat-tail { animation:tail-flick 3.5s ease-in-out infinite;transform-box:fill-box;transform-origin:left bottom; }
.cat-head { animation:cat-head-tilt 6s ease-in-out infinite;transform-origin:center 80%;transform-box:fill-box; }
.cat-eye { transform-origin:center;transform-box:fill-box; animation:cat-blink 6.7s infinite; }
.cat-ears .ear-left,.cat-ears .ear-right {transform-box:fill-box;transform-origin:bottom center;animation:cat-ear 5s ease-in-out infinite}
.cat-ears .ear-right {animation-delay:1.1s}
.cat-paw-wave {transform-origin:275px 249px}
.toy-ball {opacity:0;transform:translateX(60px)}
@keyframes cat-idle {0%,100%{transform:translateY(2px) rotate(-.8deg)}50%{transform:translateY(-5px) rotate(.8deg)}}
@keyframes tail-flick {0%,100%{transform:rotate(3deg)}24%{transform:rotate(-9deg)}62%{transform:rotate(11deg)}}
@keyframes cat-head-tilt {0%,100%{transform:rotate(0)}45%{transform:rotate(3deg)}65%{transform:rotate(-2deg)}}
@keyframes cat-ear {0%,80%,100%{transform:rotate(0)}85%{transform:rotate(-5deg)}90%{transform:rotate(4deg)}}
@keyframes cat-blink {0%,43%,45%,100%{transform:scaleY(1)}44%{transform:scaleY(.07)}}
@keyframes cat-bounce-art {0%,100%{transform:translateY(0) rotate(0)}22%{transform:translateY(-26px) rotate(-5deg)}47%{transform:translateY(0) rotate(5deg)}70%{transform:translateY(-10px)}}
@keyframes cat-purr {0%,100%{transform:rotate(-2deg)}30%{transform:rotate(3deg)}65%{transform:rotate(-4deg)}}
@keyframes cat-wave {0%,100%{transform:rotate(0)}35%{transform:rotate(-31deg)}60%{transform:rotate(17deg)}}
@keyframes ball-roll {0%{opacity:0;transform:translateX(82px) rotate(0)}20%{opacity:1}70%{opacity:1;transform:translateX(0) rotate(-290deg)}100%{opacity:0;transform:translateX(-40px) rotate(-390deg)}}
.pet-character.pet-react {animation:cat-bounce-art .9s ease 1}
.pet-character.pet-react .cat-paw-wave {animation:cat-wave .55s ease-in-out 2}
.pet-character.pet-react[data-motion="carinho"],.pet-character.pet-react[data-motion="escovar"] {animation:cat-purr .44s ease-in-out 3}
.pet-character.pet-react[data-motion="brincar"] .toy-ball {animation:ball-roll 1.3s ease 1}
.pet-character.pet-react[data-motion="descanso"] .cat-eye {animation:blink-sleep 1.6s ease 1}
@keyframes blink-sleep {0%,100%{transform:scaleY(1)}25%,85%{transform:scaleY(.08)}}
.cat-sparkles {position:absolute;inset:0;pointer-events:none;z-index:3}
.cat-sparkle {position:absolute;font-size:25px;animation:fly-heart 1.3s ease forwards;opacity:0;left:calc(47% + var(--off));top:56%;}
@keyframes fly-heart {0%{transform:translateY(0) scale(.6);opacity:0}22%{opacity:1}100%{transform:translateY(-128px) rotate(16deg) scale(1.3);opacity:0}}
.cat-profile h3 {font-size:29px;margin:14px 0 3px;letter-spacing:-.9px}
.cat-profile>p {font-size:12px}
.cat-speech {background:#fffaf8!important;border:1px solid #edd9dc;border-radius:16px;min-height:48px;padding:13px!important;color:#9c5876!important;line-height:1.5}
.cat-meters {display:grid;gap:9px;text-align:left;margin:17px 2px 12px}
.cat-meters>div {display:grid;grid-template-columns:100px 1fr;align-items:center;gap:8px;font-size:11px;color:#8d7581;font-weight:800}
.meter {height:8px;border-radius:20px;background:#f1dbe0;overflow:hidden}
.meter i {display:block;height:100%;width:35%;background:linear-gradient(90deg,#ee9eb3,#d86d91);border-radius:inherit;transition:width .6s ease}
.cat-meters>div:nth-child(2) .meter i {background:linear-gradient(90deg,#d7abdd,#aa79b9)}
.cat-meters>div:nth-child(3) .meter i {background:linear-gradient(90deg,#edc69b,#d9a468)}
.cat-activities {background:#fffefd;border:1px solid #f2e2e6;border-radius:20px;padding:19px}
.cat-care-grid {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
.cat-care-grid button {min-height:91px;display:grid!important;align-items:center;grid-template-columns:46px 1fr;grid-template-rows:1fr 1fr;column-gap:10px;gap:0!important;padding:12px!important;text-align:left!important;border-radius:16px!important;background:linear-gradient(160deg,#fff,#fff9fa)!important;border:1px solid #efdee5!important;transition:transform .2s,box-shadow .2s,border-color .2s}
.cat-care-grid button:hover {transform:translateY(-3px);box-shadow:0 10px 18px #8a4d7212;border-color:#e2a5b9!important}
.cat-care-grid button>span {grid-row:1/3;display:grid;place-items:center;background:#faedf0;border-radius:14px;width:46px;height:47px;font-size:24px!important}
.cat-care-grid button strong {font-size:12px!important;color:#7f576f;white-space:normal}
.cat-care-grid button small {font-size:10px!important;color:#b18d9d}
.cat-care-grid button.done {border-color:#ecc2d0!important;background:#fff7f9!important}
.cat-bottom {margin-top:18px}
/* Voice notes and notifications */
.voice-box {background:linear-gradient(160deg,var(--panel),#fff8fa)}
.voice-tools {display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0}
.voice-tools button {min-width:155px}
.voice-timer {font-weight:900;color:var(--rose-dark);font-size:12px}
.voice-feed {display:grid;gap:11px;margin-top:17px}
.voice-message {padding:13px;border-radius:16px;border:1px solid var(--line);background:#fffafc}
.voice-message.mine {background:#fff0f4}
.voice-meta {display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;color:var(--muted)}
.voice-meta strong {color:var(--ink)}
.voice-message audio {width:100%;max-width:500px;margin:9px 0 0;display:block}
.voice-caption {font-size:13px;line-height:1.5;white-space:pre-wrap;margin:6px 0 0}
#voice-preview {max-width:100%;width:100%}
.theme-picker {display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}
.theme-card {display:grid;text-align:left;gap:6px;border:2px solid var(--line);background:var(--panel);padding:12px;border-radius:18px;color:var(--ink)}
.theme-card.active {border-color:var(--rose);box-shadow:0 0 0 3px #d9779533}
.theme-card strong {font-size:13px}.theme-card small {font-size:11px;color:var(--muted)}
.theme-preview {display:grid;place-items:center;height:92px;border-radius:13px;font-size:23px}
.theme-preview-day {background:linear-gradient(120deg,#fffdf8,#fce7ed);color:#be6687}
.theme-preview-night {background:linear-gradient(120deg,#382232,#62435f);color:#ecd095}
.notification-tools {display:flex;flex-wrap:wrap;gap:8px;margin:19px 0 9px}
.notification-feed {display:grid;gap:7px;max-height:250px;overflow:auto;margin-top:12px}
.notification-item {padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);display:flex;flex-direction:column;gap:4px;font-size:12px;cursor:pointer}
.notification-item.unread {border-left:4px solid var(--rose)}
.notification-item small {color:var(--muted)}
.header-notify {border:1px solid var(--line);border-radius:13px;background:var(--panel);font-size:19px;position:relative;min-width:39px;min-height:39px}
.notify-badge {position:absolute;right:-5px;top:-5px;color:white;font-weight:bold;font-size:10px;padding:3px 5px;background:#dc628f;border-radius:99px}
.meeting-box {background:linear-gradient(135deg,#fffefa,#fff4f6)}
.meeting-title {font-size:17px!important;font-weight:900;color:var(--ink)}
.meeting-emoji {font-size:33px}
.meeting-clock {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:18px 0}
.meeting-clock>span {padding:14px 5px;border:1px solid var(--line);border-radius:15px;background:var(--panel);text-align:center;font-size:24px;font-weight:900;color:var(--rose-dark);font-variant-numeric:tabular-nums}
.meeting-clock small {display:block;font-size:11px;font-weight:800;color:var(--muted)}
/* Night theme: deep plum, mauve and small muted golden accents. */
html[data-theme="night"] {color-scheme:dark;--bg:#241b27;--panel:#352738;--ink:#f3e5eb;--muted:#c4adbc;--rose:#dc8dad;--rose-dark:#f0b5cb;--softrose:#503448;--line:#654c62;--shadow:0 15px 28px #120e1748}
html[data-theme="night"] body {background:radial-gradient(ellipse at 0% 0%,#553449,transparent 33%),radial-gradient(ellipse at 95% 15%,#4d345b,transparent 40%),var(--bg);color:var(--ink)}
html[data-theme="night"] .box,html[data-theme="night"] .auth-panel,html[data-theme="night"] .event,html[data-theme="night"] .memory-tile,html[data-theme="night"] .tile,html[data-theme="night"] .letter-tile,html[data-theme="night"] .wish-tile,html[data-theme="night"] .quiz-tile,html[data-theme="night"] .list-line,html[data-theme="night"] .note-card,html[data-theme="night"] .empty {background:#392b3c!important;color:var(--ink)!important;border-color:#59445b!important}
html[data-theme="night"] .sidebar {background:#2b202e!important;border-right-color:#58425c!important}
html[data-theme="night"] .topbar {border-bottom-color:#5c485c!important}
html[data-theme="night"] .page-intro h2,html[data-theme="night"] .box h3,html[data-theme="night"] .cal-nav strong,html[data-theme="night"] .event strong {color:var(--ink)!important}
html[data-theme="night"] .sub,html[data-theme="night"] .hint,html[data-theme="night"] .event small,html[data-theme="night"] .tile small {color:#c5aebd!important}
html[data-theme="night"] input,html[data-theme="night"] select,html[data-theme="night"] textarea,html[data-theme="night"] .compact-form input,html[data-theme="night"] .stack input,html[data-theme="night"] .stack select,html[data-theme="night"] .stack textarea {background:#2c222f!important;color:#fae8f0!important;border-color:#6d5369!important}
html[data-theme="night"] .btn.pale,html[data-theme="night"] .btn.outline,html[data-theme="night"] .btn.frost {background:#574057!important;color:#fae7ec!important;border-color:#775c70!important}
html[data-theme="night"] .btn.solid {background:linear-gradient(130deg,#af607e,#805171)!important}
html[data-theme="night"] .cat-profile,html[data-theme="night"] .cat-activities {background:#3d2e3e!important;border-color:#6a4e60!important}
html[data-theme="night"] .cat-scene {background:radial-gradient(circle at 48% 39%,#72546f,#4d344c 75%,#37243e 100%)}
html[data-theme="night"] .cat-speech,html[data-theme="night"] .cat-care-grid button,html[data-theme="night"] .cat-care-grid button.done {background:#463347!important;color:#f4d7e2!important;border-color:#785368!important}
html[data-theme="night"] .cat-care-grid button strong {color:#f5d9e5}
html[data-theme="night"] .cat-care-grid button>span {background:#594051}
html[data-theme="night"] .cat-state {background:#523c52;color:#f7d4e3;border-color:#795f70}
html[data-theme="night"] .meter {background:#664c64}
html[data-theme="night"] .voice-message,html[data-theme="night"] .voice-message.mine,html[data-theme="night"] .theme-card,html[data-theme="night"] .notification-item {background:#463447!important;border-color:#73556b!important;color:#f1dfeb!important}
html[data-theme="night"] .cal-day {background:#3a2c3c!important;border-color:#655168!important;color:#f0dfeb!important}
html[data-theme="night"] .cal-day.selected {border-color:#e1a4ba!important;background:#533b50!important}
html[data-theme="night"] .mobile-nav {background:#322337f5!important;border-top-color:#76596d!important}
html[data-theme="night"] .mobile-nav a.active {background:#5d4159!important;color:#f5d2df!important}
html[data-theme="night"] .meeting-box {background:linear-gradient(140deg,#38293b,#50354c)!important}
html[data-theme="night"] .meeting-clock>span {background:#2d2230}
html[data-theme="night"] .intro-icon,html[data-theme="night"] .chip-emoji,html[data-theme="night"] .header-notify {background:#49354d;color:#efc58b}
html[data-theme="night"] .overline {color:#e9c18b}
@media(max-width:850px) { .cat-hub {grid-template-columns:1fr} .cat-scene {min-height:290px} }
@media(max-width:590px) { .cat-care-grid button {min-height:83px;padding:9px!important;grid-template-columns:39px 1fr;column-gap:7px} .cat-care-grid button>span{width:38px;height:40px;font-size:20px!important}.cat-care-grid button strong{font-size:11px!important} .cat-scene{min-height:230px} .pet-character{width:min(94%,305px)} .theme-picker{gap:8px} .theme-card{padding:9px} .theme-preview{height:67px} .meeting-clock{gap:5px} .meeting-clock>span{padding:11px 4px;font-size:20px} }
@media(prefers-reduced-motion:reduce) { .pet-character,.cat-tail,.cat-head,.cat-eye,.ear-left,.ear-right {animation:none!important} }
.pet-mini{width:150px;height:130px;border-radius:20px;background:radial-gradient(circle at 50% 45%,#fff8f2,#ffe5e5);margin:8px auto 13px;display:grid;place-items:center;overflow:hidden}
.pet-mini svg{width:92%;height:100%;animation:cat-idle 4s ease-in-out infinite}
html[data-theme="night"] .pet-mini{background:radial-gradient(circle at 50% 45%,#654b63,#3d2d43)}
@media (min-width:591px) and (max-width:850px) {.cat-profile{display:block;text-align:center}.cat-scene{min-height:290px}}
.cat-profile>h3{color:var(--ink)}
html[data-theme="night"] .cat-profile>h3,html[data-theme="night"] .cat-activities h4,html[data-theme="night"] .cat-bottom h4{color:var(--ink)!important}
html[data-theme="night"] .app-frame {background:#2e2231b0}
html[data-theme="night"] .welcome-hero {background:linear-gradient(118deg,#69384e 0%,#74435e 59%,#594068 100%);box-shadow:0 16px 29px #170e204a;color:#fff1ed}
html[data-theme="night"] .stat-card,html[data-theme="night"] .invite-box {background:#3c2b40!important;border-color:#694f67!important}
html[data-theme="night"] .calendar-box,html[data-theme="night"] .cal-filters button,html[data-theme="night"] .cal-filters .active,html[data-theme="night"] .cal-legend span,html[data-theme="night"] .cal-selected,html[data-theme="night"] .square-btn {background:#382b3b!important;color:#f1dce9!important;border-color:#70576c!important}
html[data-theme="night"] .cal-filters .active {outline:2px solid #e6a9c4!important}
html[data-theme="night"] .sidebar a,html[data-theme="night"] .sidebar p {color:#efd9e7}
html[data-theme="night"] .cat-care-chip,html[data-theme="night"] .cat-care-chip.done,html[data-theme="night"] .note-card {background:#533b4b!important;color:#f4deea!important;border-color:#7c586e!important}
html[data-theme="night"] .page-intro .intro-icon{border:1px solid #725b68}
