:root{
  --bg:#08111f;
  --bg-deep:#06101b;
  --surface:#0e1b2b;
  --surface-2:#122438;
  --surface-3:#162b42;
  --line:#25405c;
  --text:#edf6ff;
  --muted:#9bb0c5;
  --blue:#5bc0ff;
  --blue-strong:#238bff;
  --blue-soft:rgba(91,192,255,.14);
  --cyan:#7be6ff;
  --warning:#ff9f7f;
  --warning-soft:rgba(255,159,127,.12);
  --coin:#8bd7ff;
  --shadow:0 18px 55px rgba(0,0,0,.3);
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 84% 2%,rgba(47,123,193,.22),transparent 26%),radial-gradient(circle at 25% 0%,rgba(43,88,152,.12),transparent 28%),linear-gradient(135deg,var(--bg-deep),var(--bg) 56%,#07131f);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,textarea{font:inherit}
button{cursor:pointer}
.app-shell{min-height:100vh;display:flex}
.sidebar{width:270px;position:fixed;inset:0 auto 0 0;padding:20px 18px;border-right:1px solid var(--line);background:rgba(6,15,26,.88);backdrop-filter:blur(18px);display:flex;flex-direction:column;z-index:5;overflow:hidden}
.brand{display:flex;align-items:center;gap:12px;padding:3px 10px 22px;flex:0 0 auto}
.brand-symbol{width:42px;height:42px;border-radius:12px;position:relative;display:grid;place-items:center;background:linear-gradient(145deg,rgba(91,192,255,.18),rgba(35,139,255,.08));border:1px solid rgba(123,230,255,.45);box-shadow:0 8px 22px rgba(35,139,255,.25),inset 0 0 18px rgba(123,230,255,.08);overflow:hidden}
.brand-symbol:before{content:"";width:24px;height:24px;clip-path:polygon(50% 0,100% 88%,50% 68%,0 88%);background:linear-gradient(180deg,var(--cyan),var(--blue-strong));filter:drop-shadow(0 0 10px rgba(123,230,255,.55))}
.brand-symbol:after{content:"";position:absolute;left:9px;right:9px;bottom:8px;height:2px;border-radius:999px;background:rgba(123,230,255,.72);box-shadow:0 -8px 18px rgba(123,230,255,.24)}
.brand strong{display:block;font-size:15px}
.brand span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.nav{display:flex;flex-direction:column;gap:5px;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 4px 10px 0;scrollbar-width:thin;scrollbar-color:rgba(123,230,255,.35) transparent}
.nav::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb{background:rgba(123,230,255,.28);border-radius:999px}
.nav-item{border:0;background:transparent;color:var(--muted);display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;text-align:left;font-size:12px;font-weight:700;min-height:40px;flex:0 0 auto}
.nav-item span{font-size:16px}
.nav-item:hover{color:var(--text);background:rgba(255,255,255,.04)}
.nav-item.active{color:var(--cyan);background:var(--blue-soft)}
.sidebar-footer{margin-top:12px;flex:0 0 auto}
.identity-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(18,36,56,.95),rgba(10,22,35,.95));padding:15px;border-radius:14px;margin-bottom:12px}
.eyebrow{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.11em;color:var(--muted)}
.warning-text{color:var(--warning)}
.identity-card strong{display:block;font-size:12px;margin:7px 0}
.identity-card p{font-size:10px;color:var(--muted);line-height:1.55;margin:0}
.quiet-btn,.text-btn{border:0;background:none;color:var(--muted);font-size:11px;padding:7px 2px}
.quiet-btn:hover,.text-btn:hover{color:var(--cyan)}
.file-label{display:block}
.hidden{display:none!important}
.storage-status{margin-top:12px;border:1px solid rgba(104,243,255,.14);background:rgba(8,19,31,.78);border-radius:8px;padding:10px}
.storage-status span{display:block;color:var(--muted);font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}
.storage-status strong{display:block;color:var(--cyan);font-size:11px;margin-top:5px}
.storage-status small{display:block;color:var(--muted);font-size:10px;margin-top:5px}
.storage-status small.online{color:var(--cyan)}
.storage-status small.error{color:var(--apex-amber)}
.main{margin-left:270px;width:calc(100% - 270px);padding:30px 38px 56px;max-width:1720px}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}
.topbar h1{font-size:29px;letter-spacing:-.05em;margin:7px 0 0}
.top-actions{display:flex;align-items:center;gap:8px}
.header-stat{min-width:75px;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:rgba(14,27,43,.88)}
.header-stat span{display:block;color:var(--muted);font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}
.header-stat strong{display:block;color:var(--coin);font-size:16px;margin-top:2px}
.header-stat.blue strong{color:var(--cyan)}
.primary-btn,.secondary-btn{border-radius:10px;padding:11px 14px;border:1px solid transparent;font-size:12px;font-weight:800}
.primary-btn{background:linear-gradient(135deg,var(--blue),var(--blue-strong));color:#06111b;box-shadow:0 8px 22px rgba(35,139,255,.18)}
.primary-btn:hover{filter:brightness(1.07)}
.secondary-btn{background:transparent;border-color:var(--line);color:var(--text)}
.secondary-btn:hover{border-color:var(--blue);color:var(--cyan)}
.primary-btn.small{padding:9px 12px}
.view{display:none}.view.active{display:block}
.launch-panel{display:grid;grid-template-columns:minmax(280px,.82fr) 1.18fr;gap:16px;align-items:stretch;margin-bottom:16px;border:1px solid var(--apex-line-strong);background:linear-gradient(120deg,rgba(104,243,255,.12),rgba(47,140,255,.035)),rgba(7,17,30,.94);border-radius:8px;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.launch-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(104,243,255,.06),transparent);pointer-events:none}
.launch-copy{position:relative}
.launch-copy h2{font-size:25px;letter-spacing:-.035em;text-transform:uppercase;margin:9px 0 10px}
.launch-copy p{margin:0;color:var(--muted);font-size:12px;line-height:1.65;max-width:520px}
.launch-actions{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.launch-card{border:1px solid rgba(104,243,255,.18);background:rgba(5,14,24,.72);color:var(--text);border-radius:7px;padding:13px;text-align:left;min-height:128px;clip-path:polygon(0 0,92% 0,100% 16%,100% 100%,0 100%);transition:.18s ease}
.launch-card:hover{border-color:var(--apex-line-strong);transform:translateY(-2px);background:rgba(11,30,49,.88)}
.launch-card span{display:block;color:var(--apex-cyan);font:10px ui-monospace,SFMono-Regular,Menlo,monospace}
.launch-card strong{display:block;font-size:14px;margin:19px 0 7px;text-transform:uppercase}
.launch-card small{display:block;color:var(--muted);font-size:10px;line-height:1.45}
.hero-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(255px,.78fr);gap:16px}
.campaign-hero,.level-card,.panel{border:1px solid var(--line);background:rgba(14,27,43,.88);border-radius:18px;padding:22px;box-shadow:var(--shadow)}
.campaign-hero{background:linear-gradient(135deg,rgba(19,47,73,.95),rgba(11,24,39,.97))}
.hero-meta{display:flex;align-items:center;gap:8px}
.live-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan)}
.campaign-hero h2{font-size:27px;letter-spacing:-.05em;margin:16px 0 8px}
.campaign-hero p{font-size:13px;color:var(--muted);line-height:1.65;max-width:720px;margin:0 0 23px}
.progress-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:8px}
.progress-label strong{color:var(--text)}
.progress-track{height:7px;background:#1d3853;border-radius:999px;overflow:hidden}
.progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:inherit;transition:width .3s ease}
.progress-track.thin{height:6px;margin-top:14px}
.hero-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:19px;font-size:11px;color:var(--muted)}
.hero-footer strong{color:var(--text)}
.level-card{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,rgba(17,38,59,.96),rgba(10,22,36,.96))}
.level-number{font-size:64px;line-height:1;color:var(--cyan);font-weight:900;letter-spacing:-.09em;margin:12px 0 4px}
.level-card strong{font-size:14px}
.level-card p{font-size:11px;color:var(--muted);line-height:1.5;margin:7px 0 0}
.dashboard-grid,.two-column{display:grid;grid-template-columns:1.35fr .85fr;gap:16px;margin-top:16px}
.panel{margin-top:16px}
.dashboard-grid .panel,.two-column .panel{margin-top:0}
.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.section-head h3{font-size:17px;letter-spacing:-.03em;margin:4px 0 0}
.counter{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);border:1px solid var(--line);padding:6px 8px;border-radius:8px}
.mission-list{display:flex;flex-direction:column;gap:9px}
.mission{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid transparent;border-radius:11px;background:var(--surface-2)}
.mission:hover{border-color:#356083}
.mission.done{opacity:.56}
.mission input{appearance:none;width:17px;height:17px;border:1px solid #52799c;border-radius:5px;background:transparent;flex:0 0 auto}
.mission input:checked{background:var(--cyan);border-color:var(--cyan);position:relative}
.mission input:checked:after{content:"✓";position:absolute;left:2px;top:-1px;color:#06111c;font-size:12px;font-weight:900}
.mission-copy{flex:1}
.mission-copy strong{display:block;font-size:12px}
.mission-copy span{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.mission-xp{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan)}
.mission-delete{border:0;background:none;color:#6f8da8;font-size:17px}.mission-delete:hover{color:var(--warning)}
.footer-link{margin-top:13px}
.boss-card{background:linear-gradient(145deg,rgba(34,31,43,.98),rgba(17,24,35,.98))}
.boss-card p{font-size:12px;color:var(--muted);line-height:1.65}
.boss-symbol{font-size:23px;color:var(--warning)}
.boss-weakness{border:1px solid rgba(255,159,127,.2);background:var(--warning-soft);padding:12px;border-radius:11px;margin:16px 0}
.boss-weakness span{display:block;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--warning);letter-spacing:.08em;margin-bottom:5px}
.boss-weakness strong{font-size:12px}
.checkin-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.micro-label{display:block;font-size:10px;color:var(--muted);margin-bottom:7px}
.scale{display:flex;gap:5px}
.scale button{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);font-size:11px}
.scale button.active{background:var(--blue-soft);border-color:var(--blue);color:var(--cyan)}
.input{width:100%;border:1px solid var(--line);background:#091725;color:var(--text);border-radius:10px;padding:10px;font-size:12px;outline:none;margin:7px 0 12px}
.input:focus{border-color:var(--blue)}
textarea.input{min-height:78px;resize:vertical}
.textarea-short{min-height:58px}
.next-action{border:1px solid rgba(91,192,255,.24);background:linear-gradient(135deg,rgba(91,192,255,.13),rgba(91,192,255,.035));border-radius:12px;padding:16px}
.action-tag{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;color:var(--cyan)}
.next-action strong{display:block;font-size:15px;line-height:1.45;margin:9px 0}
.next-action p{font-size:11px;color:var(--muted);margin:0 0 14px}
.attribute-bars{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.attribute-mini{text-align:center}
.attribute-mini .bar-bg{height:82px;width:24px;margin:auto;background:#1c3751;border-radius:99px;overflow:hidden;display:flex;align-items:flex-end}
.attribute-mini .bar{width:100%;border-radius:inherit;background:linear-gradient(180deg,var(--cyan),var(--blue-strong))}
.attribute-mini b{display:block;font-size:10px;color:var(--muted);line-height:1.45;margin-top:7px}
.page-intro{margin-bottom:25px}
.page-intro h2{font-size:28px;letter-spacing:-.05em;margin:7px 0}
.page-intro p{max-width:750px;color:var(--muted);font-size:13px;line-height:1.65;margin:0}
.form-label{display:block;color:var(--muted);font:10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;margin:11px 0 0}
.space-top{margin-top:16px}
.objective-list,.protocol-list{display:flex;flex-direction:column;gap:8px}
.objective,.protocol-step{display:flex;align-items:center;gap:10px;padding:11px;background:var(--surface-2);border-radius:10px;font-size:12px}
.objective input{accent-color:var(--cyan)}
.objective span{flex:1}
.side-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.side-quest{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:14px}
.side-quest.active{background:var(--blue-soft);border-color:rgba(91,192,255,.55)}
.side-quest span{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
.side-quest strong{display:block;font-size:13px;margin:7px 0}
.side-quest p{margin:0;color:var(--muted);font-size:11px;line-height:1.55}
.side-quest .text-btn{margin-top:10px}
.maintenance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.maintenance-card{border:1px solid var(--line);background:var(--surface-2);border-radius:11px;padding:13px}
.maintenance-card strong{display:block;font-size:12px}
.maintenance-card span{display:block;font-size:10px;color:var(--muted);margin-top:5px;line-height:1.45}
.focus-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:16px}
.timer-card{text-align:center;background:linear-gradient(145deg,rgba(24,61,91,.7),rgba(12,27,43,.98))}
.timer-card h3{font-size:21px;letter-spacing:-.04em;margin:10px 0}
.timer{font:59px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.08em;color:var(--cyan);margin:26px 0 18px}
.time-options{display:flex;justify-content:center;gap:7px}
.time-options button{border:1px solid var(--line);background:transparent;color:var(--muted);padding:8px 9px;border-radius:9px;font-size:11px}
.time-options button.selected{border-color:var(--blue);color:var(--cyan)}
.timer-actions{display:flex;justify-content:center;gap:8px;align-items:center;margin-top:15px}
.timer-card p{font-size:10px;color:var(--muted);margin:16px 0 0}
.protocol-step span{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:var(--blue-soft);color:var(--cyan);font:10px ui-monospace,SFMono-Regular,Menlo,monospace;flex:0 0 auto}
.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.metric-card{border:1px solid var(--line);background:var(--surface);border-radius:13px;padding:16px}
.metric-card span{display:block;font-size:10px;color:var(--muted)}
.metric-card strong{display:block;color:var(--cyan);font:27px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.08em;margin-top:8px}
.calendar-grid{display:grid;grid-template-columns:repeat(14,1fr);gap:7px}
.calendar-day{height:43px;border-radius:8px;background:#142a40;border:1px solid transparent;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--muted);position:relative}
.calendar-day.l1{background:rgba(91,192,255,.16)}
.calendar-day.l2{background:rgba(91,192,255,.32)}
.calendar-day.l3{background:rgba(123,230,255,.54);color:#052032}
.calendar-day.today{border-color:var(--cyan)}
.calendar-day small{position:absolute;right:4px;bottom:3px;font-size:7px}
.xp-chart{height:180px;display:flex;align-items:flex-end;gap:8px;padding-bottom:21px}
.chart-item{height:155px;flex:1;display:flex;justify-content:center;align-items:flex-end;position:relative}
.chart-bar{width:min(29px,100%);border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,var(--cyan),var(--blue-strong));min-height:3px}
.chart-item small{position:absolute;bottom:-19px;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
.attribute-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}
.attribute-card{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:15px}
.attribute-card-top{display:flex;justify-content:space-between;align-items:center}
.attribute-card h3{margin:0;font-size:15px}
.attribute-score{font:18px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan)}
.attribute-card p{font-size:11px;color:var(--muted);line-height:1.55;margin:9px 0 12px}
.attribute-card small{display:block;font-size:10px;color:var(--muted);margin-top:8px}
.achievement-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.achievement{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:14px;opacity:.42}
.achievement.unlocked{opacity:1;border-color:rgba(91,192,255,.5);background:linear-gradient(145deg,rgba(91,192,255,.15),rgba(15,34,52,.82))}
.achievement .achievement-icon{font-size:23px;color:var(--cyan)}
.achievement strong{display:block;font-size:12px;margin:8px 0 4px}
.achievement p{margin:0;font-size:10px;color:var(--muted);line-height:1.45}
.coin-summary{border:1px solid rgba(123,230,255,.28);background:linear-gradient(135deg,rgba(91,192,255,.15),rgba(13,31,48,.9));border-radius:17px;padding:23px;text-align:center}
.coin-summary strong{display:block;font:56px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.09em;color:var(--cyan);margin:7px 0}
.coin-summary>span:last-child{color:var(--muted);font-size:11px}
.reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:16px}
.reward-card{border:1px solid var(--line);background:var(--surface);border-radius:13px;padding:15px}
.reward-card strong{display:block;font-size:14px}
.reward-cost{display:block;color:var(--cyan);font-size:11px;margin:7px 0 12px}
.reward-card button{width:100%}
.new-reward-form{display:grid;grid-template-columns:1fr 150px auto;gap:9px}
.review-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.review-history{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.review-entry{border-left:2px solid var(--cyan);background:var(--surface-2);padding:10px 12px}
.review-entry span{display:block;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);margin-bottom:5px}
.review-entry p{margin:0;font-size:11px;line-height:1.6;color:#ccdae7}
.modal{position:fixed;inset:0;z-index:10;background:rgba(2,8,15,.8);backdrop-filter:blur(7px);display:grid;place-items:center;padding:20px}
.modal.hidden{display:none}
.modal-card{position:relative;width:min(520px,100%);border:1px solid #365674;background:#0e1b2b;border-radius:18px;padding:25px;box-shadow:0 30px 70px rgba(0,0,0,.56)}
.modal-card h2{font-size:25px;letter-spacing:-.05em;margin:7px 0}
.modal-card>p{font-size:12px;color:var(--muted);line-height:1.65}
.modal-card .primary-btn{margin-top:17px}
.modal-close{position:absolute;right:13px;top:10px;border:0;background:none;color:var(--muted);font-size:25px}
@media(max-width:1050px){
  .sidebar{width:72px;padding:16px 10px}.brand{padding:3px 6px 16px}.nav{gap:4px;padding:0 0 8px}.brand>div:last-child,.nav-item{font-size:0}.nav-item{justify-content:center;padding:10px;min-height:39px}.nav-item span{font-size:18px}.sidebar-footer{display:none}
  .main{margin-left:72px;width:calc(100% - 72px);padding:25px}
  .hero-grid,.dashboard-grid,.two-column,.focus-grid{grid-template-columns:1fr}.side-grid,.reward-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .sidebar{display:none}.main{margin:0;width:100%;padding:18px}.topbar{align-items:flex-start;gap:12px}.topbar h1{font-size:24px}.top-actions{flex-wrap:wrap;justify-content:flex-end}
  .hero-footer{flex-direction:column;align-items:flex-start}.attribute-bars{grid-template-columns:repeat(6,1fr);gap:7px}
  .metrics-grid,.attribute-detail-grid,.achievement-grid,.reward-grid,.side-grid,.maintenance-grid,.review-grid{grid-template-columns:1fr}
  .calendar-grid{grid-template-columns:repeat(7,1fr)}.new-reward-form{grid-template-columns:1fr}
}

/* V5 — Áreas da vida */
.areas-snapshot{margin-top:16px}
.micro-summary{font-size:10px;color:var(--muted)}
.area-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.area-summary-card{border:1px solid var(--line);background:linear-gradient(145deg,var(--surface-2),rgba(10,25,39,.95));border-radius:13px;padding:15px;text-align:left;color:var(--text);transition:.18s ease}
.area-summary-card:hover{border-color:var(--blue);transform:translateY(-2px);background:linear-gradient(145deg,rgba(22,53,79,.98),rgba(11,31,48,.98))}
.area-icon{display:block;color:var(--cyan);font-size:20px;margin-bottom:9px}
.area-label{display:block;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);letter-spacing:.1em}
.area-summary-card strong{display:block;font-size:18px;margin:6px 0 3px}
.area-summary-card small{display:block;color:var(--muted);font-size:10px}

.finance-metrics .metric-card strong{font-size:20px;letter-spacing:-.05em}
.finance-columns{grid-template-columns:1fr 1fr}
.finance-goal-box{margin-top:12px;padding:12px;border-radius:11px;background:rgba(91,192,255,.07);border:1px solid rgba(91,192,255,.14)}
.finance-insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.finance-insight{padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2)}
.finance-insight span{display:block;font-size:10px;color:var(--muted);line-height:1.35}
.finance-insight strong{display:block;color:var(--cyan);font-size:15px;margin-top:6px}
.finance-note{color:var(--muted);font-size:10px;line-height:1.55;margin:14px 0 0}
.installment-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.subscription-form{display:grid;grid-template-columns:1.3fr .7fr .8fr .45fr auto;gap:9px;align-items:end}
.subscription-form .input{margin-bottom:0}
.finance-list{display:flex;flex-direction:column;gap:9px}
.finance-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);background:var(--surface-2);padding:12px;border-radius:11px}
.finance-row-main{flex:1}
.finance-row-main strong{display:block;font-size:12px}
.finance-row-main span{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.finance-amount{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan);white-space:nowrap}
.finance-actions{display:flex;gap:6px;align-items:center}
.finance-small-btn{border:1px solid var(--line);background:transparent;color:var(--muted);font-size:10px;border-radius:8px;padding:6px 8px}
.finance-small-btn:hover{border-color:var(--blue);color:var(--cyan)}
.finance-small-btn.warn:hover{border-color:var(--warning);color:var(--warning)}
.finance-row.muted-row{opacity:.58}
.empty-state{padding:18px;border:1px dashed var(--line);border-radius:11px;color:var(--muted);font-size:11px;text-align:center}

.project-command{margin-top:0}
.project-summary-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.project-summary-row div{border:1px solid var(--line);background:var(--surface-2);border-radius:11px;padding:12px}
.project-summary-row span{display:block;color:var(--muted);font-size:10px}
.project-summary-row strong{display:block;color:var(--cyan);font-size:21px;margin-top:5px}
.project-rule-list{display:flex;flex-direction:column;gap:10px}
.project-rule-list div{display:flex;gap:10px;padding:10px;border-left:2px solid var(--blue);background:rgba(91,192,255,.06)}
.project-rule-list span{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan)}
.project-rule-list p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}
.project-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.project-card{border:1px solid var(--line);background:var(--surface-2);border-radius:13px;padding:15px}
.project-card.paused{opacity:.72}
.project-card.done{border-color:rgba(123,230,255,.4);background:linear-gradient(145deg,rgba(91,192,255,.12),var(--surface-2))}
.project-card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.project-card .project-area{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan)}
.project-card h4{font-size:15px;margin:6px 0}
.project-card p{font-size:11px;color:var(--muted);line-height:1.55;margin:0 0 12px}
.project-next{padding:10px;border-radius:10px;background:rgba(91,192,255,.08);border:1px solid rgba(91,192,255,.14);margin-bottom:11px}
.project-next span{display:block;font-size:9px;color:var(--cyan);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.project-next strong{display:block;font-size:11px;margin-top:5px}
.project-task-list{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.project-task{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:10px}
.project-task.done{text-decoration:line-through;opacity:.65}
.project-task input{accent-color:var(--cyan)}
.project-card-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.project-card-actions button{border:1px solid var(--line);background:transparent;color:var(--muted);font-size:10px;padding:6px 8px;border-radius:8px}
.project-card-actions button:hover{border-color:var(--blue);color:var(--cyan)}

.reading-metrics .metric-card strong{font-size:23px}
.book-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.book-card{border:1px solid var(--line);background:var(--surface-2);border-radius:13px;padding:15px}
.book-card.done{border-color:rgba(123,230,255,.42);background:linear-gradient(145deg,rgba(91,192,255,.1),var(--surface-2))}
.book-card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.book-type{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan)}
.book-card h4{font-size:15px;margin:6px 0 3px}
.book-author{font-size:10px;color:var(--muted)}
.book-pages{margin:13px 0 7px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px}
.book-card-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.book-card-actions button{border:1px solid var(--line);background:transparent;color:var(--muted);font-size:10px;padding:6px 8px;border-radius:8px}
.book-card-actions button:hover{border-color:var(--blue);color:var(--cyan)}
.reading-history{display:flex;flex-direction:column;gap:9px}
.reading-history-item{border-left:2px solid var(--cyan);background:var(--surface-2);padding:10px 12px}
.reading-history-item span{display:block;color:var(--muted);font:9px ui-monospace,SFMono-Regular,Menlo,monospace;margin-bottom:4px}
.reading-history-item strong{font-size:11px}
.reading-history-item p{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.5}

.goal-metrics .metric-card strong{font-size:23px}
.goal-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.goal-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.goal-card{border:1px solid var(--line);background:var(--surface-2);border-radius:13px;padding:15px}
.goal-card.paused{opacity:.72}
.goal-card.done{border-color:rgba(123,230,255,.42);background:linear-gradient(145deg,rgba(91,192,255,.11),var(--surface-2))}
.goal-card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.goal-period{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan);letter-spacing:.08em}
.goal-card h4{font-size:15px;margin:6px 0 4px}
.goal-progress-row{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:10px;margin:13px 0 7px}
.goal-progress-row strong{color:var(--cyan);font:14px ui-monospace,SFMono-Regular,Menlo,monospace}
.goal-meta-line{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.goal-meta-line span{border:1px solid var(--line);border-radius:999px;padding:5px 7px;color:var(--muted);font-size:9px}
.goal-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.goal-actions button{border:1px solid var(--line);background:transparent;color:var(--muted);font-size:10px;padding:6px 8px;border-radius:8px}
.goal-actions button:hover{border-color:var(--blue);color:var(--cyan)}

@media(max-width:1050px){
  .area-summary-grid,.project-list,.book-list,.goal-list{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .area-summary-grid,.project-list,.book-list,.goal-list,.project-summary-row,.finance-insight-grid,.installment-input-grid,.subscription-form,.goal-input-grid{grid-template-columns:1fr}
  .finance-row{align-items:flex-start;flex-direction:column}
}

/* Plus */
.mobile-menu-btn{display:none;border:1px solid var(--line);background:var(--surface-2);color:var(--cyan);border-radius:10px;width:40px;height:40px;font-size:18px}
.command-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid rgba(91,192,255,.2);background:linear-gradient(135deg,rgba(91,192,255,.12),rgba(14,27,43,.78));border-radius:16px;padding:14px 16px;margin:-12px 0 22px}
.command-strip strong{display:block;font-size:13px;margin-top:5px;color:var(--text);line-height:1.45}
.command-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.secondary-btn.small{padding:8px 10px;font-size:11px}
.plus-alerts{margin-top:16px}
.areas-snapshot .area-summary-grid{grid-template-columns:repeat(4,1fr)}
.attention-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.attention-card{border:1px solid var(--line);background:var(--surface-2);border-radius:13px;padding:13px;text-align:left;color:var(--text);min-height:118px}
.attention-card:hover{border-color:var(--blue);transform:translateY(-1px)}
.attention-card span{display:block;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);letter-spacing:.1em}
.attention-card strong{display:block;font-size:13px;line-height:1.35;margin:9px 0 7px}
.attention-card small{display:block;color:var(--muted);font-size:10px;line-height:1.45}
.attention-card.blue{background:linear-gradient(145deg,rgba(91,192,255,.16),var(--surface-2));border-color:rgba(91,192,255,.34)}
.attention-card.warning{background:linear-gradient(145deg,rgba(255,159,127,.14),var(--surface-2));border-color:rgba(255,159,127,.28)}
.attention-card.warning span{color:var(--warning)}
.toast{position:fixed;right:22px;bottom:22px;z-index:20;max-width:360px;border:1px solid rgba(123,230,255,.32);background:#0d1b2a;color:var(--text);box-shadow:0 18px 45px rgba(0,0,0,.38);border-radius:13px;padding:12px 14px;font-size:12px;line-height:1.45}
.toast.hidden{display:none}

@media(max-width:1050px){
  .attention-grid{grid-template-columns:repeat(2,1fr)}
  .areas-snapshot .area-summary-grid{grid-template-columns:repeat(2,1fr)}
  .launch-panel{grid-template-columns:1fr}
  .launch-actions{grid-template-columns:repeat(2,1fr)}
  .command-strip{align-items:flex-start;flex-direction:column}
  .command-actions{justify-content:flex-start}
}
@media(max-width:700px){
  .mobile-menu-btn{display:grid;place-items:center;flex:0 0 auto}
  .topbar{position:sticky;top:0;z-index:6;background:rgba(8,17,31,.88);backdrop-filter:blur(12px);padding:8px 0;margin:-8px 0 18px}
  .sidebar{display:flex;transform:translateX(-105%);transition:transform .2s ease;width:min(295px,86vw);padding:20px 16px}
  body.sidebar-open .sidebar{transform:translateX(0)}
  .brand>div:last-child,.nav-item{font-size:12px}
  .nav{gap:6px;padding:0 4px 12px 0}
  .nav-item{justify-content:flex-start;padding:11px 12px;min-height:42px}
  .sidebar-footer{display:block}
  .attention-grid{grid-template-columns:1fr}
  .areas-snapshot .area-summary-grid{grid-template-columns:1fr}
  .launch-actions{grid-template-columns:1fr}
  .launch-copy h2{font-size:21px}
  .command-strip{margin:0 0 18px}
  .toast{left:16px;right:16px;bottom:16px;max-width:none}
}

/* APEX identity layer */
:root{
  --apex-cyan:#68f3ff;
  --apex-blue:#2f8cff;
  --apex-ink:#050a12;
  --apex-panel:rgba(8,18,31,.92);
  --apex-panel-2:rgba(12,27,44,.94);
  --apex-line:rgba(104,243,255,.24);
  --apex-line-strong:rgba(104,243,255,.48);
  --apex-amber:#ffcf6a;
  --shadow:0 22px 70px rgba(0,0,0,.42);
}
body{
  background:
    linear-gradient(90deg,rgba(104,243,255,.035) 1px,transparent 1px),
    linear-gradient(180deg,rgba(104,243,255,.028) 1px,transparent 1px),
    radial-gradient(circle at 78% -8%,rgba(47,140,255,.24),transparent 28%),
    radial-gradient(circle at 8% 8%,rgba(104,243,255,.12),transparent 24%),
    linear-gradient(135deg,#040912 0%,#07111f 48%,#050b13 100%);
  background-size:42px 42px,42px 42px,auto,auto,auto;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 18%,transparent 82%,rgba(104,243,255,.035));
  mix-blend-mode:screen;
  opacity:.55;
  z-index:-1;
}
.sidebar{
  background:linear-gradient(180deg,rgba(5,10,18,.96),rgba(7,17,30,.94));
  border-right:1px solid var(--apex-line);
  box-shadow:12px 0 36px rgba(0,0,0,.22);
}
.brand{
  border-bottom:1px solid rgba(104,243,255,.12);
  margin-bottom:10px;
}
.brand-symbol{
  border-radius:8px;
  background:
    linear-gradient(135deg,rgba(104,243,255,.19),rgba(47,140,255,.08)),
    #07111d;
  clip-path:polygon(10% 0,100% 0,100% 78%,78% 100%,0 100%,0 10%);
}
.brand-symbol:before{
  width:27px;
  height:27px;
  clip-path:polygon(50% 0,100% 100%,73% 100%,50% 48%,27% 100%,0 100%);
}
.brand strong{
  letter-spacing:.08em;
  font-size:14px;
}
.brand span{
  letter-spacing:.12em;
  text-transform:uppercase;
}
.nav-item{
  border-radius:7px;
  position:relative;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:11px;
}
.nav-item:before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  bottom:9px;
  width:2px;
  background:transparent;
}
.nav-item:hover{
  background:rgba(104,243,255,.055);
}
.nav-item.active{
  color:var(--apex-cyan);
  background:linear-gradient(90deg,rgba(104,243,255,.16),rgba(47,140,255,.055));
  box-shadow:inset 0 0 0 1px rgba(104,243,255,.08);
}
.nav-item.active:before{
  background:var(--apex-cyan);
  box-shadow:0 0 14px var(--apex-cyan);
}
.identity-card,.campaign-hero,.level-card,.panel,.metric-card,.reward-card,.project-card,.book-card,.goal-card,.side-quest,.maintenance-card,.attribute-card,.achievement,.finance-row,.area-summary-card,.attention-card,.modal-card{
  border-radius:8px;
  border-color:var(--apex-line);
  background:
    linear-gradient(135deg,rgba(255,255,255,.035),transparent 28%),
    var(--apex-panel);
  box-shadow:var(--shadow);
}
.panel,.campaign-hero,.level-card{
  position:relative;
  overflow:hidden;
}
.panel:before,.campaign-hero:before,.level-card:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--apex-cyan),transparent);
  opacity:.5;
}
.topbar{
  padding-bottom:18px;
  border-bottom:1px solid rgba(104,243,255,.12);
}
.topbar h1{
  letter-spacing:-.03em;
  text-transform:uppercase;
}
.header-stat{
  min-width:92px;
  border-radius:8px;
  border-color:var(--apex-line);
  background:linear-gradient(145deg,rgba(10,24,39,.95),rgba(5,12,21,.95));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}
.header-stat strong,.metric-card strong,.level-number,.coin-summary strong{
  color:var(--apex-cyan);
  text-shadow:0 0 18px rgba(104,243,255,.28);
}
.primary-btn{
  border-radius:8px;
  background:linear-gradient(135deg,var(--apex-cyan),var(--apex-blue));
  box-shadow:0 10px 28px rgba(47,140,255,.22),inset 0 1px 0 rgba(255,255,255,.45);
}
.secondary-btn,.finance-small-btn,.project-card-actions button,.book-card-actions button,.goal-actions button,.time-options button{
  border-radius:7px;
}
.command-strip{
  border-radius:8px;
  border-color:var(--apex-line-strong);
  background:
    linear-gradient(90deg,rgba(104,243,255,.14),rgba(47,140,255,.04)),
    rgba(7,17,30,.92);
  box-shadow:0 16px 48px rgba(0,0,0,.25);
}
.command-strip .eyebrow{
  color:var(--apex-cyan);
}
.campaign-hero{
  background:
    linear-gradient(120deg,rgba(104,243,255,.12),transparent 34%),
    linear-gradient(145deg,rgba(10,31,50,.96),rgba(5,12,21,.98));
  clip-path:polygon(0 0,97% 0,100% 12%,100% 100%,0 100%);
}
.campaign-hero h2{
  text-transform:uppercase;
  letter-spacing:-.025em;
}
.level-card{
  background:
    linear-gradient(160deg,rgba(104,243,255,.12),rgba(47,140,255,.04) 38%,rgba(5,12,21,.96)),
    var(--apex-panel);
}
.progress-track{
  height:6px;
  background:rgba(104,243,255,.12);
  border-radius:0;
}
.progress-fill{
  border-radius:0;
  background:linear-gradient(90deg,var(--apex-blue),var(--apex-cyan),var(--apex-amber));
}
.mission,.objective,.protocol-step,.finance-insight,.project-summary-row div,.next-action,.boss-weakness{
  border-radius:7px;
  border:1px solid rgba(104,243,255,.12);
  background:rgba(9,22,36,.84);
}
.mission input{
  border-radius:3px;
}
.area-summary-card,.attention-card{
  min-height:124px;
  clip-path:polygon(0 0,94% 0,100% 14%,100% 100%,0 100%);
}
.area-summary-card:hover,.attention-card:hover{
  border-color:var(--apex-line-strong);
  transform:translateY(-2px);
  box-shadow:0 24px 70px rgba(0,0,0,.42),0 0 0 1px rgba(104,243,255,.08);
}
.boss-card{
  border-color:rgba(255,207,106,.32);
  background:linear-gradient(145deg,rgba(38,27,18,.92),rgba(8,16,27,.96));
}
.warning-text,.boss-symbol,.attention-card.warning span{
  color:var(--apex-amber);
}
.timer-card{
  background:
    radial-gradient(circle at 50% 25%,rgba(104,243,255,.15),transparent 38%),
    linear-gradient(145deg,rgba(8,28,47,.95),rgba(5,11,19,.98));
}
.timer{
  color:var(--apex-cyan);
  text-shadow:0 0 28px rgba(104,243,255,.33);
}
.calendar-day,.chart-bar,.attribute-mini .bar-bg{
  border-radius:4px;
}
.chart-bar,.attribute-mini .bar{
  background:linear-gradient(180deg,var(--apex-cyan),var(--apex-blue));
}
.input{
  border-radius:7px;
  border-color:rgba(104,243,255,.18);
  background:rgba(5,13,23,.9);
}
.input:focus{
  border-color:var(--apex-cyan);
  box-shadow:0 0 0 3px rgba(104,243,255,.08);
}
.eyebrow,.form-label,.counter,.area-label,.goal-period,.book-type,.project-card .project-area{
  letter-spacing:.12em;
}
.toast{
  border-radius:8px;
  border-color:var(--apex-line-strong);
  background:linear-gradient(145deg,rgba(7,18,31,.98),rgba(5,10,18,.98));
}

/* Login */
.login-body{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
}
.login-shell{
  width:min(470px,100%);
}
.login-card{
  border:1px solid var(--apex-line-strong);
  background:
    linear-gradient(135deg,rgba(104,243,255,.12),transparent 34%),
    rgba(7,17,30,.96);
  border-radius:8px;
  padding:26px;
  box-shadow:var(--shadow);
  clip-path:polygon(0 0,96% 0,100% 8%,100% 100%,0 100%);
}
.login-brand{
  padding:0 0 18px;
  margin-bottom:18px;
}
.login-card h1{
  margin:10px 0 8px;
  font-size:30px;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.login-card p{
  margin:0 0 20px;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}
.login-card .primary-btn{
  width:100%;
  margin-top:4px;
}
.login-error{
  margin-top:14px;
  border:1px solid rgba(255,207,106,.32);
  background:rgba(255,207,106,.09);
  color:var(--apex-amber);
  border-radius:7px;
  padding:10px 12px;
  font-size:12px;
}
