:root{
  color-scheme: dark;
  --bg:#081118;
  --card:#0e1c25;
  --card2:#132630;
  --text:#f4f7f8;
  --muted:#9fb0ba;
  --line:#29404b;
  --accent:#8ed081;
  --accent2:#d7f2d1;
  --danger:#ff8e8e;
  --warning:#ffd27a;
  --shadow:0 10px 30px rgba(0,0,0,.22);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#071017,#0a161e 42%,#071017);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app-shell{max-width:760px;margin:0 auto;padding:0 16px 110px}
.topbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:18px 4px 14px;background:linear-gradient(180deg,rgba(8,17,24,.98),rgba(8,17,24,.90),rgba(8,17,24,0));backdrop-filter:blur(8px)}
h1{font-size:1.65rem;margin:.15rem 0 0}
.eyebrow{font-size:.72rem;letter-spacing:.18em;color:var(--accent);font-weight:800}
.card{background:rgba(14,28,37,.96);border:1px solid var(--line);border-radius:20px;padding:18px;margin:12px 0;box-shadow:var(--shadow)}
.hero{padding:20px}
.hero-row{display:flex;justify-content:space-between;gap:16px;align-items:center}
.muted{color:var(--muted);font-size:.91rem;line-height:1.35}
.date-button{border:0;background:transparent;color:var(--text);font-weight:800;font-size:1.13rem;padding:6px 0;text-align:left}
.countdown{text-align:center;min-width:94px;background:var(--card2);padding:12px;border-radius:16px}
.countdown-number{font-size:2rem;font-weight:900;line-height:1}
.countdown-label{font-size:.75rem;color:var(--muted);margin-top:4px}
.progress-block{margin-top:18px}
.progress-copy{display:flex;justify-content:space-between;font-size:.88rem;margin-bottom:8px}
.progress-track{height:10px;background:#081118;border-radius:20px;overflow:hidden;border:1px solid var(--line)}
.progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .25s ease}
.chips{display:flex;gap:8px;overflow:auto;padding-top:14px}
.chip{border:1px solid var(--line);background:#0a171f;color:var(--muted);padding:8px 12px;border-radius:999px;white-space:nowrap}
.chip.active{background:var(--accent);color:#0b1b13;border-color:var(--accent);font-weight:800}
.section-title{font-weight:850;font-size:1.02rem}
.quick-add-row{display:flex;gap:10px;margin-top:14px}
input,select,textarea{width:100%;background:#09141b;color:var(--text);border:1px solid var(--line);border-radius:12px;padding:12px}
textarea{resize:vertical}
.primary,.secondary,.danger{border-radius:12px;padding:12px 15px;font-weight:800;border:1px solid transparent}
.primary{background:var(--accent);color:#0a1a10}
.secondary{background:#10232d;color:var(--text);border-color:var(--line)}
.danger{background:var(--danger);color:#261010}
.ghost{background:transparent;color:var(--danger);border-color:#5f3030}
.wide{width:100%;margin-top:14px}
.icon-btn{background:transparent;border:1px solid var(--line);color:var(--text);width:42px;height:42px;border-radius:12px}
.section-header{display:flex;justify-content:space-between;gap:12px;align-items:center}
.task-list{margin-top:12px}
.stage-heading{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:800;padding:14px 4px 8px}
.task-item{display:flex;align-items:stretch;border-top:1px solid var(--line)}
.check-btn{width:50px;min-width:50px;background:transparent;color:var(--muted);border:0;font-size:1.25rem}
.task-main{flex:1;background:transparent;color:var(--text);border:0;text-align:left;padding:14px 4px}
.task-title-row{display:flex;align-items:center;gap:8px}
.task-title{font-weight:750;line-height:1.25}
.task-meta{font-size:.78rem;color:var(--muted);margin-top:5px}
.task-notes{font-size:.82rem;color:#c8d4d9;margin-top:5px}
.task-item.completed .task-title{text-decoration:line-through;color:#78909b}
.task-item.completed .check-btn{color:var(--accent)}
.critical-mark{font-size:.62rem;font-weight:900;color:#241700;background:var(--warning);padding:3px 6px;border-radius:999px}
.hidden{display:none!important}
.status-badge{padding:7px 10px;border-radius:999px;background:#442929;color:#ffc5c5;font-size:.78rem;font-weight:850}
.status-badge.ready{background:#173b22;color:#c8f8d1}
.sync-grid{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin-top:12px}
.small-label{font-size:.75rem;color:var(--muted);margin:0 0 6px 3px}
.sync-state{display:flex;gap:7px;align-items:center;padding-bottom:12px;font-size:.83rem}
.dot{width:9px;height:9px;border-radius:50%}
.dot.offline{background:#82919a}.dot.online{background:var(--accent)}
.fab{position:fixed;right:max(20px,calc((100vw - 760px)/2 + 20px));bottom:24px;width:62px;height:62px;border-radius:50%;border:0;background:var(--accent);color:#0a1a10;font-size:2rem;font-weight:900;box-shadow:0 10px 25px rgba(0,0,0,.35)}
dialog{border:0;background:transparent;padding:0;max-width:min(94vw,640px);width:100%}
dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}
.dialog-card{background:#0d1b24;border:1px solid var(--line);border-radius:20px;padding:18px;color:var(--text);width:100%}
.dialog-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.dialog-header h2{margin:0;font-size:1.25rem}
label{display:block;color:#dce6ea;font-size:.82rem;font-weight:700;margin:12px 0}
label input,label select,label textarea{margin-top:6px;font-weight:500}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.switch-row{display:flex;gap:18px;flex-wrap:wrap}
.switch-label{display:flex;gap:8px;align-items:center}
.switch-label input{width:auto;margin:0}
.dialog-actions{display:flex;gap:10px;align-items:center;margin-top:18px}
.spacer{flex:1}
.tip{margin-top:14px;padding:12px;border-radius:12px;background:#10232d;color:#c9d5da;font-size:.83rem;line-height:1.4}
@media(max-width:560px){
  .quick-add-row{flex-direction:column}
  .two-col{grid-template-columns:1fr}
  .section-header{align-items:flex-start;flex-direction:column}
  .section-header select{width:100%}
}