:root{
  --bg:#07111d; --card:#101a2b; --card2:#16243a; --text:#eef6ff; --muted:#99abc4;
  --line:#26364f; --accent:#5bd5ff; --accent2:#a7f3d0; --warn:#fbbf24; --bad:#fb7185; --good:#34d399;
  --shadow:0 20px 60px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:radial-gradient(circle at top,#16243d 0,#07111d 52%,#040812 100%);color:var(--text)}
body{padding:env(safe-area-inset-top) 14px env(safe-area-inset-bottom)}
button,input,select,textarea{font:inherit}
button{border:0;border-radius:16px;padding:13px 16px;background:linear-gradient(135deg,var(--accent),#7c3aed);color:#04111f;font-weight:900;box-shadow:var(--shadow)}
button.secondary,.ghost,.small{background:#202e46;color:var(--text);box-shadow:none;border:1px solid var(--line)}
button.small{padding:8px 11px;border-radius:12px;font-size:13px}
button:active{transform:translateY(1px)}
b{color:var(--text)}
#appShell{max-width:900px;margin:0 auto;padding-bottom:36px}
.app-header{display:flex;align-items:center;justify-content:space-between;padding:18px 4px 12px}
h1,h2,h3,p{margin:0}
h1{font-size:30px;letter-spacing:-.03em}
h2{font-size:26px;line-height:1.08;letter-spacing:-.03em}
h3{font-size:18px;margin-bottom:12px}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--accent2);font-weight:900;margin-bottom:6px}
.muted{color:var(--muted);line-height:1.45}
.card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:24px;padding:18px;margin:12px 0;box-shadow:var(--shadow);backdrop-filter:blur(10px)}
.live-card{display:grid;grid-template-columns:1fr 1.15fr;gap:14px;background:linear-gradient(135deg,#14233d,#0f1829 58%,#091220)}
.clock{font-size:42px;line-height:1;font-weight:950;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.date-line{margin-top:8px;color:var(--muted);font-size:14px}
.live-right{border-left:1px solid var(--line);padding-left:16px}
.now-card{background:linear-gradient(135deg,rgba(91,213,255,.13),rgba(124,58,237,.08))}
.now-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.now-grid strong{display:block;font-size:26px;letter-spacing:-.03em}
.now-grid span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.progress-wrap{margin-top:14px}
.progress-bar{height:14px;border-radius:999px;background:#25344e;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.progress-bar div{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .4s ease}
.progress-caption{display:flex;justify-content:space-between;margin-top:7px;color:var(--muted);font-size:12px}
.grid{display:grid;gap:12px}.grid.two{grid-template-columns:1fr 1fr}
.metric span{color:var(--muted);font-size:13px}.metric strong{display:block;font-size:28px;margin:6px 0}.metric small{color:var(--muted)}
.tabs{position:sticky;top:0;z-index:4;display:flex;gap:8px;overflow:auto;padding:10px 0;background:linear-gradient(180deg,var(--bg),rgba(7,17,29,.88));backdrop-filter:blur(12px)}
.tab{white-space:nowrap;background:#162238;color:var(--muted);border:1px solid var(--line);box-shadow:none;padding:10px 13px;border-radius:999px;font-size:14px}
.tab.active{background:var(--accent);color:#04111f}
.panel{display:none}.panel.active{display:block}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;border:1px solid var(--line);background:#111d31;color:var(--accent2);font-weight:800;font-size:12px;padding:7px 10px}
.timeline{display:grid;gap:10px;margin-top:14px}
.time-item{display:grid;grid-template-columns:92px 1fr 110px;gap:12px;padding:13px;border:1px solid var(--line);background:#0d1728;border-radius:18px;position:relative;overflow:hidden}
.time-item.now{border-color:var(--accent);background:linear-gradient(90deg,rgba(91,213,255,.16),rgba(13,23,40,.75));box-shadow:0 0 0 2px rgba(91,213,255,.13)}
.time-item.next{border-color:rgba(167,243,208,.42)}
.time-item time{color:var(--accent2);font-weight:950;font-variant-numeric:tabular-nums}.time-item b{display:block}.time-item span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.status-side{text-align:right;font-size:12px;color:var(--muted);font-weight:800;line-height:1.3}
.status-side .now-dot{color:var(--accent);font-size:13px}
.advice-list,.coach-text{display:grid;gap:10px}
.tip,.ai-output{padding:13px;border-radius:17px;background:#0d1728;border:1px solid var(--line);line-height:1.52;color:var(--text)}
.tip.primary{border-color:rgba(91,213,255,.6);background:rgba(91,213,255,.09)}
.checklist{display:grid;gap:12px}.checklist label,.inline{display:flex;gap:10px;align-items:center;color:var(--text)}
input[type="checkbox"]{width:20px;height:20px;accent-color:#5bd5ff}
.bars{display:flex;align-items:end;gap:8px;height:130px;padding-top:12px}
.bar{flex:1;background:#22304a;border-radius:12px 12px 6px 6px;position:relative;min-height:8px}
.bar.good{background:linear-gradient(#5bd5ff,#2563eb)}.bar.warn{background:linear-gradient(#fbbf24,#b45309)}.bar small{position:absolute;bottom:-24px;left:50%;transform:translateX(-50%);color:var(--muted);font-size:11px}
.form-card label{display:grid;gap:6px;color:var(--muted);font-size:13px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
input,select,textarea{width:100%;background:#0b1423;border:1px solid var(--line);color:var(--text);border-radius:14px;padding:12px}
textarea{resize:vertical;line-height:1.45;margin-top:12px}
.row,.stack,.quick-row{display:flex;gap:10px;flex-wrap:wrap}.stack{flex-direction:column}.quick-row{margin-bottom:12px}
.entries{display:grid;gap:8px;margin-top:12px}
.entry{display:flex;justify-content:space-between;gap:10px;background:#0b1423;border:1px solid var(--line);border-radius:14px;padding:10px;color:var(--muted);font-size:13px}
.entry button{padding:6px 9px;border-radius:10px;font-size:12px}
.warning{border-color:rgba(251,191,36,.4)}
.file-label{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;padding:13px 16px;background:#202e46;color:var(--text);font-weight:900;border:1px solid var(--line)}
.file-label input{display:none}
pre{white-space:pre-wrap;background:#0b1423;border:1px solid var(--line);padding:12px;border-radius:14px;color:var(--muted);max-height:220px;overflow:auto}
.toast{position:fixed;left:14px;right:14px;bottom:22px;max-width:680px;margin:auto;background:#eaf7ff;color:#06101d;border-radius:18px;padding:14px 16px;font-weight:900;box-shadow:var(--shadow);z-index:10}
@media (max-width:640px){
  body{padding-left:12px;padding-right:12px}
  .live-card{grid-template-columns:1fr}
  .live-right{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:14px}
  .clock{font-size:38px}
  .grid.two,.form-grid,.now-grid{grid-template-columns:1fr}
  .time-item{grid-template-columns:72px 1fr;gap:10px}
  .status-side{grid-column:2;text-align:left}
}

.tz-row{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:16px;background:#0b1423;display:grid;gap:3px}
.tz-row span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}
.tz-row b{font-size:20px;font-variant-numeric:tabular-nums}
.tz-row small{color:var(--muted)}
.work-status{margin-top:10px;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:#0b1423;color:var(--accent2);font-weight:800;line-height:1.35}
.work-status.off{color:var(--warn)}
.work-status.work{color:var(--accent)}

.alert-schedule{display:grid;gap:8px;margin:14px 0}
.alert-item{display:grid;grid-template-columns:92px 1fr;gap:10px;padding:11px;border:1px solid var(--line);border-radius:15px;background:#0b1423}
.alert-item b{display:block}
.alert-item span{color:var(--muted);font-size:12px;line-height:1.35}
.alert-item time{font-weight:950;color:var(--accent2);font-variant-numeric:tabular-nums}
@media (max-width:640px){.alert-item{grid-template-columns:76px 1fr}}

.daily-brief-card{border-color:rgba(91,213,255,.42);background:linear-gradient(135deg,rgba(91,213,255,.11),rgba(167,243,208,.04))}
.brief-output{display:grid;gap:10px;margin-top:12px}
.brief-card{border:1px solid var(--line);background:#0b1423;border-radius:16px;padding:12px;line-height:1.45}
.brief-card.primary{border-color:rgba(91,213,255,.55);background:rgba(91,213,255,.08)}
.brief-card h4{margin:0 0 6px 0;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent2)}
.brief-card p{margin:0;color:var(--text)}
.brief-card ul{margin:6px 0 0 18px;padding:0;color:var(--text)}
.brief-meta{color:var(--muted);font-size:12px;margin-top:8px}
.in-app-toast-card{position:fixed;left:14px;right:14px;top:calc(env(safe-area-inset-top) + 14px);z-index:20;max-width:760px;margin:auto;border:1px solid rgba(91,213,255,.55);background:#0b1423;border-radius:20px;padding:14px;box-shadow:var(--shadow)}
.in-app-toast-card b{display:block;margin-bottom:4px}
.in-app-toast-card span{color:var(--muted);font-size:13px}

.push-panel{display:grid;gap:10px;margin:12px 0}

.sleep-action-card{border-color:rgba(167,243,208,.42);background:linear-gradient(135deg,rgba(167,243,208,.08),rgba(91,213,255,.05))}
