:root{
  --bg:#08111e; --panel:#101c2e; --panel2:#162641; --text:#e8f4ff; --muted:#92a7bd;
  --accent:#55ef98; --blue:#61c9ff; --gold:#ffd166; --orange:#ffad66; --red:#ff7081;
  --border:#2a3d59; --deep:#091423; --shadow:0 16px 42px rgba(0,0,0,.3);
  --gridline:rgba(255,255,255,.024); --speech:#edf8ff; --speechText:#0c1828;
}
body[data-theme="light"]{
  --bg:#eef4f8; --panel:#ffffff; --panel2:#f5f9fc; --text:#122033; --muted:#5f7185;
  --accent:#14854d; --blue:#1673b8; --gold:#a66a00; --orange:#c76b1e; --red:#c93a52;
  --border:#cbd8e5; --deep:#e8f0f6; --shadow:0 14px 36px rgba(31,56,83,.12);
  --gridline:rgba(17,32,51,.05); --speech:#16324f; --speechText:#f5fbff;
}
body[data-theme="neon"]{
  --bg:#080013; --panel:#160521; --panel2:#210734; --text:#f8ecff; --muted:#b99aca;
  --accent:#59ffb2; --blue:#52e8ff; --gold:#fff36a; --orange:#ff9d3f; --red:#ff4da6;
  --border:#5b2574; --deep:#10011b; --shadow:0 0 34px rgba(218,66,255,.18);
  --gridline:rgba(255,77,166,.06); --speech:#fff3ff; --speechText:#25002d;
}
body[data-theme="retro"]{
  --bg:#17120d; --panel:#2b2218; --panel2:#3b2e20; --text:#ffecc7; --muted:#c9ad82;
  --accent:#8ee36b; --blue:#7dd8d3; --gold:#ffd15d; --orange:#ff9a59; --red:#ff6b6b;
  --border:#6b5236; --deep:#20170f; --shadow:0 12px 0 rgba(0,0,0,.22);
  --gridline:rgba(255,209,93,.05); --speech:#ffe3a5; --speechText:#321f0e;
}
body[data-theme="coffee"]{
  --bg:#1a100b; --panel:#2c1b12; --panel2:#3a2418; --text:#f5e7d8; --muted:#c2a58f;
  --accent:#e1a66e; --blue:#96bec1; --gold:#f0c36e; --orange:#d9814e; --red:#e57979;
  --border:#6b4934; --deep:#21140e; --shadow:0 16px 40px rgba(19,9,4,.38);
  --gridline:rgba(238,196,148,.045); --speech:#ead4be; --speechText:#3c2416;
}
*{box-sizing:border-box}
body{
  margin:0; min-height:100vh; color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at 8% 0%,rgba(97,201,255,.10),transparent 28%),
    radial-gradient(circle at 92% 90%,rgba(85,239,152,.08),transparent 25%), var(--bg);
}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.wrap{width:min(1220px,95vw);margin:24px auto 48px}
.topbar{display:flex;gap:14px;align-items:center;justify-content:space-between;margin-bottom:16px}
.brand h1{margin:0;font-size:clamp(1.7rem,3vw,2.5rem)}
.brand p{margin:5px 0 0;color:var(--muted)}
.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.pill,.mini-btn{
  border:1px solid var(--border);background:rgba(16,28,46,.9);color:var(--text);
  border-radius:999px;padding:9px 12px;font-weight:800
}
.pill{color:var(--accent)}
.mini-btn:hover{border-color:#4b678f}
.layout{display:grid;grid-template-columns:1.05fr .95fr;gap:18px}
.card{
  background:linear-gradient(180deg,rgba(22,38,65,.97),rgba(14,25,43,.98));
  border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow)
}
.pet-card{padding:22px}
.pet-stage{
  min-height:360px;border:1px solid #233855;border-radius:18px;display:grid;place-items:center;
  position:relative;overflow:hidden;background:
  linear-gradient(rgba(255,255,255,.024) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px),#0a1627;
  background-size:24px 24px;
}
.pet{font-size:108px;user-select:none;filter:drop-shadow(0 15px 12px rgba(0,0,0,.35));transition:.15s}
.pet-stage.aura-0{box-shadow:inset 0 0 0 transparent}
.pet-stage.aura-1{box-shadow:inset 0 0 55px rgba(97,201,255,.12)}
.pet-stage.aura-2{box-shadow:inset 0 0 75px rgba(85,239,152,.15)}
.pet-stage.aura-3{box-shadow:inset 0 0 95px rgba(255,209,102,.16),0 0 22px rgba(255,209,102,.08)}
.pet-stage.aura-4{box-shadow:inset 0 0 110px rgba(190,100,255,.19),0 0 26px rgba(190,100,255,.10)}
.pet-stage.aura-5{box-shadow:inset 0 0 130px rgba(97,201,255,.22),0 0 30px rgba(85,239,152,.12)}
.info-box{border:1px solid var(--border);border-radius:13px;padding:12px;background:var(--deep);margin-top:12px}
.info-box h3{margin:0 0 6px;font-size:.95rem}.info-box p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.45}
.pet:hover{transform:scale(1.04)}
.pet.bounce{animation:bounce .55s ease}
@keyframes bounce{0%,100%{transform:translateY(0)}35%{transform:translateY(-24px) scale(1.08)}65%{transform:translateY(4px) scale(.98)}}
.speech{
  position:absolute;top:18px;left:20px;right:20px;margin:auto;max-width:480px;text-align:center;
  background:var(--speech);color:var(--speechText);padding:10px 14px;border-radius:14px;font-weight:800;
  box-shadow:0 8px 22px rgba(0,0,0,.25)
}
.accessory{position:absolute;font-size:36px;transform:translate(44px,-44px);pointer-events:none}
.meta{display:flex;justify-content:space-between;gap:12px;margin-top:14px;flex-wrap:wrap}
.meta strong{display:block;font-size:1.18rem}.meta span{color:var(--muted);font-size:.88rem}
.bar{height:10px;background:var(--deep);border:1px solid #23344d;border-radius:999px;overflow:hidden;margin-top:8px}
.bar>div{height:100%;background:linear-gradient(90deg,var(--blue),var(--accent));transition:.3s}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:14px}
.stat{padding:11px;border:1px solid var(--border);border-radius:13px;background:rgba(7,14,24,.35)}
.stat .label{font-size:.72rem;color:var(--muted);font-weight:700}.stat .value{font-size:1.05rem;font-weight:900;margin-top:3px}
.need-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.need{border:1px solid var(--border);border-radius:13px;padding:10px;background:var(--deep)}
.need-row{display:flex;justify-content:space-between;font-size:.8rem;color:#c0d0df}
.need .bar{margin-top:6px;height:8px}
.leftstack,.rightstack{display:grid;gap:18px}.section{padding:18px}
.section h2{margin:0 0 5px;font-size:1.12rem}.section p{margin:0 0 14px;color:var(--muted);font-size:.88rem}
label{display:block;color:#c0cfdd;font-weight:750;font-size:.8rem;margin:0 0 6px}
input,select,textarea{
  width:100%;border:1px solid #2d4263;background:var(--deep);color:var(--text);border-radius:11px;
  padding:10px 11px;outline:none
}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(97,201,255,.1)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.btn{border:0;border-radius:11px;padding:10px 13px;font-weight:900}
.primary{background:linear-gradient(90deg,#4ce08a,#74ffc1);color:#04140a}
.secondary{background:#1e3250;border:1px solid #304c72;color:var(--text)}
.ghost{background:transparent;border:1px solid #30445f;color:#a8bad0}
.warn{background:#4a3418;border:1px solid #725023;color:#ffe0a2}
.actions{display:flex;gap:9px;margin-top:11px}.actions>*{flex:1}
.quest-grid,.ach-grid{display:grid;gap:9px}
.quest,.achievement{
  border:1px solid #2a3e5c;border-radius:12px;padding:11px;background:var(--deep)
}
.quest.done,.achievement.unlocked{border-color:#326f55;background:#0b201b}
.quest-top,.ach-top,.entry-top,.rank-row{display:flex;justify-content:space-between;gap:10px;align-items:center}
.quest small,.achievement small,.entry small,.rank-row small{color:var(--muted)}
.progressline{font-size:.76rem;color:#b4c6d7;margin-top:5px}
.history{display:grid;gap:8px;max-height:300px;overflow:auto}
.entry{border:1px solid #2a3e5c;border-radius:12px;padding:10px 11px;background:var(--deep)}
.sev{padding:4px 7px;border-radius:999px;font-size:.68rem;font-weight:900;text-transform:uppercase}
.low{background:#163b31;color:#83f0be}.medium{background:#3a3519;color:#ffe28a}
.high{background:#493019;color:#ffc081}.critical{background:#49212b;color:#ff9dac}
.tabs{display:flex;gap:7px;margin-bottom:12px;flex-wrap:wrap}
.tab{border:1px solid #30455f;background:var(--deep);color:#a9bad0;padding:8px 10px;border-radius:10px;font-weight:800}
.tab.active{background:#1c3658;color:white;border-color:#4571a0}
.tabpane{display:none}.tabpane.active{display:block}
.rank-row{
  padding:10px 11px;border:1px solid #2b405e;border-radius:12px;background:var(--deep);margin-bottom:8px
}
.rank-left{display:flex;gap:10px;align-items:center}.rank-num{width:28px;text-align:center;font-weight:950;color:var(--gold)}
.you{border-color:#3d735d;background:#0c211b}
.codebox{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.76rem;min-height:92px}
.empty{color:var(--muted);border:1px dashed #324760;border-radius:12px;padding:18px;text-align:center}
.honor{
  border:1px solid #36536e;background:#0c1a2b;border-radius:12px;padding:10px 12px;color:#bad0e4;font-size:.82rem;margin-bottom:12px
}
.honor b{color:#eaf7ff}
.modal{
  position:fixed;inset:0;background:rgba(0,0,0,.67);display:none;place-items:center;padding:18px;z-index:10
}
.modal.show{display:grid}
.modal-card{width:min(520px,95vw);padding:20px}
.modal-card h2{margin-top:0}
.danger-zone{margin-top:22px;padding-top:16px;border-top:1px solid #4a2b32}
.danger-zone h3{color:#ff9aa8}
.hidden-reset{opacity:.42;font-size:.82rem}
.hidden-reset:hover{opacity:1}
.toast{
  position:fixed;right:18px;bottom:18px;background:#ebfff4;color:#0b2c1d;border-radius:12px;padding:11px 14px;
  font-weight:850;box-shadow:0 14px 32px rgba(0,0,0,.32);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;z-index:20
}
.toast.show{opacity:1;transform:translateY(0)}

.team-guardian{
  display:grid;grid-template-columns:180px 1fr;gap:16px;align-items:center;
  border:1px solid #2f496a;border-radius:16px;padding:14px;background:
  radial-gradient(circle at 25% 25%,rgba(97,201,255,.10),transparent 35%),#0a1627
}
.team-pet-box{
  min-height:170px;border-radius:14px;border:1px solid #29405f;display:grid;place-items:center;
  position:relative;background:
  linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),#081321;
  background-size:20px 20px
}
.team-pet{font-size:76px;filter:drop-shadow(0 10px 10px rgba(0,0,0,.35))}
.team-aura{position:absolute;font-size:22px;top:12px;right:12px}
.team-info h3{margin:0 0 3px;font-size:1.15rem}.team-info p{margin:0;color:var(--muted);font-size:.84rem}
.contrib{
  display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;
  border:1px solid #2b405e;border-radius:12px;padding:10px 11px;background:var(--deep);margin-top:8px
}
.contrib .num{font-weight:950;color:var(--gold);text-align:center}
.contrib .amount{text-align:right;font-weight:900}
.team-note{font-size:.8rem;color:#9fb4c8;margin-top:9px}
.goal-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.goal-filter{border:1px solid var(--border);background:var(--deep);color:var(--muted);padding:8px 10px;border-radius:10px;font-weight:800}
.goal-filter.active{color:var(--text);border-color:var(--blue);background:var(--panel2)}
.goal-card{border:1px solid var(--border);background:var(--deep);border-radius:13px;padding:11px;margin-bottom:9px}
.goal-card.done{border-color:#3a7d5b}
.goal-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.goal-title{font-weight:900}.goal-meta{color:var(--muted);font-size:.77rem;margin-top:3px}
.goal-progress{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:8px}
.goal-actions{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.tiny{padding:6px 8px;border-radius:8px;font-size:.74rem}
.manager-box{border:1px dashed var(--border);border-radius:13px;padding:12px;margin-top:12px}
.theme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(95px,1fr));gap:8px}
.theme-btn{border:1px solid var(--border);background:var(--deep);color:var(--text);border-radius:11px;padding:10px;font-weight:850}
.theme-btn.active{outline:2px solid var(--blue)}
footer{text-align:center;color:#647d96;font-size:.78rem;margin-top:18px}

/* Comprehensive light-mode overrides */
body[data-theme="light"]{
  background:
    radial-gradient(circle at 8% 0%,rgba(22,115,184,.08),transparent 28%),
    radial-gradient(circle at 92% 90%,rgba(20,133,77,.06),transparent 25%),var(--bg);
}
body[data-theme="light"] .card{background:linear-gradient(180deg,#ffffff,#f7fafc)}
body[data-theme="light"] .pill,
body[data-theme="light"] .mini-btn{background:#ffffff;border-color:#cad7e3}
body[data-theme="light"] .pet-stage{border-color:#c9d7e4;background:
  linear-gradient(var(--gridline) 1px,transparent 1px),
  linear-gradient(90deg,var(--gridline) 1px,transparent 1px),#f7fbfe;background-size:24px 24px}
body[data-theme="light"] .stat,
body[data-theme="light"] .need,
body[data-theme="light"] .info-box,
body[data-theme="light"] .quest,
body[data-theme="light"] .achievement,
body[data-theme="light"] .entry,
body[data-theme="light"] .rank-row,
body[data-theme="light"] .contrib,
body[data-theme="light"] .goal-card,
body[data-theme="light"] .manager-box,
body[data-theme="light"] .empty{background:#f8fbfd;border-color:#cad8e5}
body[data-theme="light"] .quest.done,
body[data-theme="light"] .achievement.unlocked,
body[data-theme="light"] .goal-card.done,
body[data-theme="light"] .you{background:#eef9f3;border-color:#8bc8a8}
body[data-theme="light"] input,
body[data-theme="light"] select,
body[data-theme="light"] textarea{background:#ffffff;border-color:#bdcddd;color:#122033}
body[data-theme="light"] label,
body[data-theme="light"] .need-row{color:#42586e}
body[data-theme="light"] .bar{background:#e2eaf1;border-color:#c6d4e0}
body[data-theme="light"] .secondary{background:#e8f1f8;border-color:#b8cadd;color:#17304a}
body[data-theme="light"] .ghost{background:#ffffff;border-color:#bdcddd;color:#52677b}
body[data-theme="light"] .tab,
body[data-theme="light"] .goal-filter,
body[data-theme="light"] .theme-btn{background:#f1f6fa;border-color:#c4d3e0;color:#536a80}
body[data-theme="light"] .tab.active,
body[data-theme="light"] .goal-filter.active{background:#dcecf8;color:#173b59;border-color:#7daed0}
body[data-theme="light"] .honor{background:#eef6fc;border-color:#b8d1e4;color:#405f78}
body[data-theme="light"] .honor b{color:#17324a}
body[data-theme="light"] .team-guardian{border-color:#c8d8e5;background:
  radial-gradient(circle at 25% 25%,rgba(22,115,184,.07),transparent 35%),#f7fbfe}
body[data-theme="light"] .team-pet-box{border-color:#c9d9e6;background:
  linear-gradient(var(--gridline) 1px,transparent 1px),
  linear-gradient(90deg,var(--gridline) 1px,transparent 1px),#ffffff;background-size:20px 20px}
body[data-theme="light"] .team-note{color:#5e7488}
body[data-theme="light"] .danger-zone{border-top-color:#dcc8cd}
body[data-theme="light"] .danger-zone h3{color:#b43a4f}
body[data-theme="light"] footer{color:#718496}
body[data-theme="light"] .toast{background:#e6f7ee;color:#153d2b}



/* v1.2 unified theming: every major surface is driven by theme tokens. */
body,body[data-theme="dark"]{
  --theme-bg-1:#08111e;--theme-bg-2:#0b2030;--theme-card-1:#162641;--theme-card-2:#0e192b;
  --theme-surface:#091423;--theme-surface-2:#12243a;--theme-stage:#0a1627;--theme-input:#091423;
  --theme-button:#1e3250;--theme-active:#1c3658;--theme-success:#0b201b;--theme-selected:#0c211b;
  --theme-honor:#0c1a2b;--theme-bar:#07101c;--theme-primary-1:#4ce08a;--theme-primary-2:#74ffc1;--theme-primary-text:#04140a;
  --theme-toast:#ebfff4;--theme-toast-text:#0b2c1d;--theme-overlay:rgba(0,0,0,.67);
}
body[data-theme="light"]{
  --theme-bg-1:#edf4f8;--theme-bg-2:#dcecf5;--theme-card-1:#ffffff;--theme-card-2:#f5f9fc;
  --theme-surface:#f7fafc;--theme-surface-2:#eef4f8;--theme-stage:#f8fcff;--theme-input:#ffffff;
  --theme-button:#e3eef6;--theme-active:#d6eaf7;--theme-success:#e9f7ef;--theme-selected:#e8f5ee;
  --theme-honor:#eef6fc;--theme-bar:#dfe9f0;--theme-primary-1:#24985d;--theme-primary-2:#61c98c;--theme-primary-text:#ffffff;
  --theme-toast:#e5f7ed;--theme-toast-text:#153d2b;--theme-overlay:rgba(34,49,63,.38);
}
body[data-theme="neon"]{
  --theme-bg-1:#07000f;--theme-bg-2:#1a002c;--theme-card-1:#23053a;--theme-card-2:#11001d;
  --theme-surface:#12001e;--theme-surface-2:#26063c;--theme-stage:#0e0018;--theme-input:#12001e;
  --theme-button:#39105a;--theme-active:#4b126f;--theme-success:#0b2d26;--theme-selected:#14283a;
  --theme-honor:#1e0630;--theme-bar:#090011;--theme-primary-1:#ff4da6;--theme-primary-2:#52e8ff;--theme-primary-text:#16001c;
  --theme-toast:#2b0736;--theme-toast-text:#ffe8ff;--theme-overlay:rgba(4,0,9,.78);
}
body[data-theme="retro"]{
  --theme-bg-1:#17120d;--theme-bg-2:#302313;--theme-card-1:#3b2e20;--theme-card-2:#241a12;
  --theme-surface:#20170f;--theme-surface-2:#39291a;--theme-stage:#1b140d;--theme-input:#21170f;
  --theme-button:#4b3824;--theme-active:#594126;--theme-success:#24351b;--theme-selected:#28391e;
  --theme-honor:#2d2115;--theme-bar:#140f0a;--theme-primary-1:#86ca61;--theme-primary-2:#d8d66a;--theme-primary-text:#1c170c;
  --theme-toast:#f0d995;--theme-toast-text:#35240d;--theme-overlay:rgba(16,10,6,.72);
}
body[data-theme="coffee"]{
  --theme-bg-1:#160c08;--theme-bg-2:#382116;--theme-card-1:#3b2418;--theme-card-2:#24150e;
  --theme-surface:#21140e;--theme-surface-2:#4a2d1d;--theme-stage:#1b100b;--theme-input:#27170f;
  --theme-button:#583724;--theme-active:#6a432b;--theme-success:#29351e;--theme-selected:#334024;
  --theme-honor:#302016;--theme-bar:#120a07;--theme-primary-1:#b97143;--theme-primary-2:#e2b07c;--theme-primary-text:#26150c;
  --theme-toast:#ead5bd;--theme-toast-text:#3a2417;--theme-overlay:rgba(19,10,6,.76);
}
body{
  background:radial-gradient(circle at 8% 0%,color-mix(in srgb,var(--blue) 18%,transparent),transparent 28%),radial-gradient(circle at 92% 90%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 25%),linear-gradient(145deg,var(--theme-bg-1),var(--theme-bg-2))!important;
}
.card{background:linear-gradient(180deg,var(--theme-card-1),var(--theme-card-2))!important;border-color:var(--border)!important}
.pill,.mini-btn,.view-popover{background:var(--theme-surface-2)!important;border-color:var(--border)!important;color:var(--text)!important}
.pet-stage{background:linear-gradient(var(--gridline) 1px,transparent 1px),linear-gradient(90deg,var(--gridline) 1px,transparent 1px),var(--theme-stage)!important;border-color:var(--border)!important;background-size:24px 24px!important}
.stat,.need,.info-box,.quest,.achievement,.entry,.rank-row,.contrib,.goal-card,.manager-box,.empty,.team-pet-box{background:var(--theme-surface)!important;border-color:var(--border)!important}
.quest.done,.achievement.unlocked,.goal-card.done,.you{background:var(--theme-success)!important}
input,select,textarea{background:var(--theme-input)!important;color:var(--text)!important;border-color:var(--border)!important}
label,.need-row{color:var(--text)!important}.bar{background:var(--theme-bar)!important;border-color:var(--border)!important}
.primary{background:linear-gradient(90deg,var(--theme-primary-1),var(--theme-primary-2))!important;color:var(--theme-primary-text)!important}
.secondary{background:var(--theme-button)!important;border-color:var(--border)!important;color:var(--text)!important}
.ghost{background:transparent!important;border-color:var(--border)!important;color:var(--muted)!important}
.tab,.goal-filter,.theme-btn{background:var(--theme-surface)!important;border-color:var(--border)!important;color:var(--muted)!important}
.tab.active,.goal-filter.active,.theme-btn.active{background:var(--theme-active)!important;color:var(--text)!important;border-color:var(--blue)!important}
.honor{background:var(--theme-honor)!important;border-color:var(--border)!important;color:var(--text)!important}.honor b{color:var(--text)!important}
.team-guardian{background:radial-gradient(circle at 25% 25%,color-mix(in srgb,var(--blue) 16%,transparent),transparent 35%),var(--theme-stage)!important;border-color:var(--border)!important}
.team-pet-box{background:linear-gradient(var(--gridline) 1px,transparent 1px),linear-gradient(90deg,var(--gridline) 1px,transparent 1px),var(--theme-surface)!important;background-size:20px 20px!important}
.team-note,footer{color:var(--muted)!important}.toast{background:var(--theme-toast)!important;color:var(--theme-toast-text)!important}.modal{background:var(--theme-overlay)!important}
.warn{background:color-mix(in srgb,var(--red) 25%,var(--theme-surface))!important;border-color:var(--red)!important;color:var(--text)!important}

/* Compact panel visibility menu */
.view-menu{position:relative}.view-menu summary{list-style:none;user-select:none}.view-menu summary::-webkit-details-marker{display:none}
.view-menu[open] summary{border-color:var(--blue)!important}
.view-popover{position:absolute;right:0;top:calc(100% + 9px);width:min(290px,88vw);z-index:30;border:1px solid var(--border);border-radius:15px;padding:12px;box-shadow:var(--shadow)}
.view-popover>strong{display:block;margin-bottom:2px}.view-help{display:block;color:var(--muted);font-size:.75rem;margin-bottom:9px}
.view-option{display:flex!important;align-items:center;gap:9px;padding:8px;border-radius:9px;margin:1px 0!important;color:var(--text)!important;cursor:pointer}
.view-option:hover{background:var(--theme-active)}.view-option input{width:auto!important;accent-color:var(--accent)}
.view-quick-actions{display:flex;gap:7px;margin-top:9px;padding-top:9px;border-top:1px solid var(--border)}.view-quick-actions>*{flex:1}
.panel-hidden,.stack-hidden{display:none!important}.layout.single-column{grid-template-columns:minmax(0,1fr)}

/* Rank aura system: every tier spins, with progressive speed / glow / layering. */
.pet-visual{position:relative;width:190px;height:190px;display:grid;place-items:center;isolation:isolate}
.pet-visual .pet{position:relative;z-index:3}
.rank-aura{position:absolute;border-radius:50%;z-index:1;pointer-events:none;animation:rankSpin var(--aura-speed) linear infinite;box-shadow:0 0 var(--aura-glow) var(--aura-color);opacity:var(--aura-opacity)}
.rank-aura::before,.rank-aura::after{content:"";position:absolute;border-radius:50%;inset:0;animation:auraPulse var(--pulse-speed) ease-in-out infinite;background:var(--aura-gradient);-webkit-mask:radial-gradient(circle,transparent 52%,#000 55%,#000 64%,transparent 68%);mask:radial-gradient(circle,transparent 52%,#000 55%,#000 64%,transparent 68%);filter:blur(var(--aura-blur))}
.rank-aura::after{inset:13%;animation-duration:calc(var(--pulse-speed) * .72);animation-direction:reverse;opacity:var(--inner-opacity)}
.rank-aura-1{inset:29px;--aura-speed:18s;--pulse-speed:4s;--aura-glow:12px;--aura-color:rgba(97,201,255,.25);--aura-opacity:.58;--aura-blur:.3px;--inner-opacity:.15;--aura-gradient:conic-gradient(from 0deg,transparent,#61c9ff,transparent,#61c9ff,transparent)}
.rank-aura-2{inset:23px;--aura-speed:13s;--pulse-speed:3.3s;--aura-glow:20px;--aura-color:rgba(85,239,152,.34);--aura-opacity:.7;--aura-blur:.6px;--inner-opacity:.32;--aura-gradient:conic-gradient(from 0deg,#61c9ff,transparent,#55ef98,transparent,#61c9ff)}
.rank-aura-3{inset:16px;--aura-speed:9s;--pulse-speed:2.7s;--aura-glow:29px;--aura-color:rgba(255,209,102,.38);--aura-opacity:.8;--aura-blur:.9px;--inner-opacity:.48;--aura-gradient:conic-gradient(from 0deg,#ffd166,#61c9ff,#55ef98,#ffd166,#61c9ff)}
.rank-aura-4{inset:8px;--aura-speed:6s;--pulse-speed:2.2s;--aura-glow:40px;--aura-color:rgba(190,100,255,.46);--aura-opacity:.9;--aura-blur:1.2px;--inner-opacity:.65;--aura-gradient:conic-gradient(from 0deg,#bd69ff,#61c9ff,#ff4da6,#55ef98,#bd69ff)}
.rank-aura-5{inset:-2px;--aura-speed:3.5s;--pulse-speed:1.65s;--aura-glow:55px;--aura-color:rgba(97,232,255,.55);--aura-opacity:1;--aura-blur:1.5px;--inner-opacity:.88;--aura-gradient:conic-gradient(from 0deg,#61c9ff,#55ef98,#ffd166,#ff4da6,#bd69ff,#61c9ff)}
.rank-aura-5::after{inset:20%;-webkit-mask:radial-gradient(circle,transparent 43%,#000 47%,#000 61%,transparent 66%);mask:radial-gradient(circle,transparent 43%,#000 47%,#000 61%,transparent 66%)}
@keyframes rankSpin{to{transform:rotate(360deg)}}
@keyframes auraPulse{0%,100%{opacity:.55;filter:blur(var(--aura-blur)) brightness(1)}50%{opacity:1;filter:blur(calc(var(--aura-blur) + 1px)) brightness(1.35)}}

@media(max-width:900px){.layout{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}}

/* v1.2.1 pet-life + incident completion polish */
.complete-btn{
  width:100%;
  margin-top:14px;
  min-height:56px;
  padding:15px 18px;
  font-size:1.06rem;
  letter-spacing:.01em;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.complete-btn.success-pop{animation:completePop .62s cubic-bezier(.2,.8,.2,1)}
@keyframes completePop{
  0%{transform:scale(1)}
  22%{transform:scale(.97)}
  48%{transform:scale(1.045)}
  72%{transform:scale(.995)}
  100%{transform:scale(1)}
}

.celebration-layer{
  position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:9999;
}
.celebration-particle{
  position:fixed;
  left:var(--start-x);top:var(--start-y);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-weight:950;
  font-size:var(--particle-size);
  color:var(--accent);
  text-shadow:0 0 12px color-mix(in srgb,var(--accent) 60%,transparent);
  animation:incidentFly var(--particle-duration) cubic-bezier(.15,.75,.25,1) forwards;
}
@keyframes incidentFly{
  0%{opacity:0;transform:translate(-50%,-20%) scale(.45) rotate(0deg)}
  12%{opacity:1}
  68%{opacity:1}
  100%{opacity:0;transform:translate(calc(-50% + var(--drift-x)),var(--rise-y)) scale(1.18) rotate(var(--spin))}
}

.pet-status{
  position:absolute;
  left:16px;bottom:14px;
  z-index:5;
  border:1px solid var(--border);
  background:color-mix(in srgb,var(--theme-card-1) 88%,transparent);
  color:var(--text);
  border-radius:999px;
  padding:6px 10px;
  font-size:.74rem;
  font-weight:850;
  backdrop-filter:blur(6px);
  box-shadow:0 5px 16px rgba(0,0,0,.12);
}

/* Default pet idle: subtle breathing / floating. Interaction bounce temporarily overrides this. */
.pet:not(.bounce){animation:petIdle 3.7s ease-in-out infinite;transform-origin:50% 85%}
.pet.hungry:not(.bounce){animation:petHungryIdle 2.8s ease-in-out infinite}
.pet.sad:not(.bounce){animation:petSadIdle 4.5s ease-in-out infinite;filter:grayscale(.35) saturate(.72) drop-shadow(0 10px 10px rgba(0,0,0,.28))}
.pet.very-sad:not(.bounce){animation:petSadIdle 5.2s ease-in-out infinite;filter:grayscale(.62) saturate(.48) drop-shadow(0 8px 9px rgba(0,0,0,.25))}
@keyframes petIdle{
  0%,100%{transform:translateY(0) rotate(-1deg) scale(1)}
  45%{transform:translateY(-7px) rotate(1deg) scale(1.025)}
  60%{transform:translateY(-5px) rotate(.4deg) scale(1.015)}
}
@keyframes petHungryIdle{
  0%,100%{transform:translateY(0) rotate(-1.4deg) scale(1)}
  35%{transform:translateY(-5px) rotate(1.6deg) scale(1.015)}
  50%{transform:translateY(-3px) rotate(-1deg) scale(.985)}
  68%{transform:translateY(-6px) rotate(1deg) scale(1.01)}
}
@keyframes petSadIdle{
  0%,100%{transform:translateY(4px) rotate(-1deg) scale(.98)}
  50%{transform:translateY(0) rotate(1deg) scale(.99)}
}

/* Keep the interaction bounce crisp and then return to idle. */
.pet.bounce{animation:bounce .62s cubic-bezier(.2,.8,.2,1)!important}

@media(max-width:560px){.row,.need-grid,.team-guardian{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr 1fr}.pet{font-size:86px}.pet-visual{width:165px;height:165px}.pet-stage{min-height:310px}.team-pet-box{min-height:150px}}
