:root{
  --ink:#19293F; --ink-2:#5C6B82; --paper:#FAF8F4; --card:#FFFFFF;
  --line:#E5E0D7; --line-2:#EFEBE3; --teal:#1F7A8C; --teal-soft:#E4F0F1;
  --amber:#C0902B; --rust:#A14A37;
  --shadow:0 1px 2px rgba(25,41,63,.05), 0 8px 24px rgba(25,41,63,.05);
  --sans:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","SFMono-Regular",Menlo,Consolas,monospace;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;font-feature-settings:"palt" 1;}
.brand{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--ink-2);text-transform:uppercase;}
.brand b{color:var(--ink);font-weight:700;}
.muted{color:var(--ink-2);}
.fl{display:block;font-family:var(--mono);font-size:12px;color:var(--ink-2);margin:0 0 5px;letter-spacing:.02em;}

/* ---- inputs ---- */
input[type=text],input[type=number],input[type=password],textarea{
  width:100%;font-family:var(--sans);font-size:15px;color:var(--ink);
  background:#FCFBF8;border:1px solid var(--line);border-radius:10px;padding:10px 12px;
  transition:border-color .15s,background .15s;}
textarea{resize:vertical;min-height:64px;line-height:1.55;margin-bottom:12px;}
input:focus,textarea:focus{outline:none;border-color:var(--teal);background:#fff;}

button{font-family:var(--sans);cursor:pointer;}
.primary{background:var(--teal);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:15px;font-weight:700;}
.primary:hover{background:#1a6b7b;}
.ghost{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:10px 16px;font-size:14px;}
.ghost:hover{border-color:var(--teal);}
.ghost.small{padding:6px 12px;font-size:13px;}
button:focus-visible,.tab:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}

/* ---- login ---- */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;}
.login-card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:32px;max-width:360px;width:100%;}
.login-card h1{font-size:22px;margin:10px 0 4px;}
.login-card p{margin:0 0 20px;font-size:14px;}
.login-card .primary{width:100%;margin-top:14px;}
.err{color:var(--rust);font-size:13px;margin:8px 0 0;}

/* ---- topbar ---- */
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:rgba(250,248,244,.9);backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid var(--line);padding:12px 20px;}
.tabs{display:flex;gap:4px;margin:0 auto;}
.tab{background:none;border:1px solid transparent;border-radius:9px;padding:7px 14px;font-size:14px;color:var(--ink-2);}
.tab.is-active{background:#fff;border-color:var(--line);color:var(--ink);font-weight:700;}
.logout{font-family:var(--mono);font-size:12px;color:var(--ink-2);text-decoration:none;}
.logout:hover{color:var(--teal);}

.wrap{max-width:760px;margin:0 auto;padding:24px 20px 96px;}
.view{display:none;}
.view.is-active{display:block;animation:fade .35s ease;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---- cards ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:20px;margin-bottom:16px;}
.card h3{margin:0 0 14px;font-size:16px;}
.card-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.card-head h3{margin:0;}
.datechip{margin-left:auto;font-family:var(--mono);font-size:13px;color:var(--ink-2);}

/* ---- dashboard ---- */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;}
.stat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center;box-shadow:var(--shadow);}
.stat-num{display:block;font-family:var(--mono);font-size:24px;font-weight:700;color:var(--teal);line-height:1.2;}
.stat-lab{display:block;font-size:11px;color:var(--ink-2);margin-top:4px;}
.spark-label{font-family:var(--mono);font-size:11px;color:var(--ink-2);margin:12px 0 6px;}
.spark{display:flex;align-items:flex-end;gap:4px;height:56px;}
.spark .b{flex:1;background:var(--teal-soft);border-radius:3px 3px 0 0;min-height:3px;position:relative;}
.spark .b.fill{background:var(--teal);}
.spark .b span{position:absolute;bottom:-17px;left:0;right:0;text-align:center;font-family:var(--mono);font-size:9px;color:var(--ink-2);}
.empty{text-align:center;color:var(--ink-2);font-size:14px;padding:24px;}

/* ---- today quick ---- */
.quick{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:14px;}
.stepper{display:flex;align-items:center;gap:10px;background:#FCFBF8;border:1px solid var(--line);border-radius:10px;padding:6px;}
.stepper button{width:34px;height:34px;border:1px solid var(--line);background:#fff;border-radius:8px;font-size:18px;line-height:1;color:var(--ink);}
.stepper span{flex:1;text-align:center;font-family:var(--mono);font-size:17px;font-weight:700;}
.toggles{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
.toggle{display:inline-flex;align-items:center;gap:8px;background:#FCFBF8;border:1px solid var(--line);border-radius:10px;padding:9px 14px;font-size:14px;color:var(--ink-2);}
.toggle .dot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--line);}
.toggle.on{background:var(--teal-soft);border-color:var(--teal);color:var(--ink);}
.toggle.on .dot{background:var(--teal);border-color:var(--teal);}

.pips{display:flex;gap:8px;margin-bottom:14px;}
.pip{width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:#FCFBF8;font-family:var(--mono);font-size:14px;color:var(--ink-2);display:flex;align-items:center;justify-content:center;}
.pip[aria-checked=true]{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:700;}

.link-detail{background:none;border:none;color:var(--teal);font-size:13px;padding:0;margin:0 0 12px;}
.detail{border-top:1px dashed var(--line);padding-top:14px;}

.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;}
.savestate{font-family:var(--mono);font-size:12px;color:var(--ink-2);}

/* ---- AI output ---- */
.ai-box,#latest-ai,#weekly-ai{border-left:3px solid var(--teal);}
.ai-body{white-space:pre-wrap;font-size:14.5px;line-height:1.7;color:var(--ink);}
.ai-box{background:var(--teal-soft);border-radius:0 10px 10px 0;padding:14px 16px;margin-top:14px;}
.thinking{color:var(--ink-2);font-style:italic;}

/* ---- weekly ---- */
.weeknav{align-items:center;}
.weeknav button{width:36px;height:36px;border:1px solid var(--line);background:#fff;border-radius:9px;font-size:16px;color:var(--ink);}
.weeknav .small{width:auto;height:auto;}
.weeklabel{font-family:var(--mono);font-weight:700;font-size:16px;min-width:96px;text-align:center;}
.wk-agg{font-family:var(--mono);font-size:13px;color:var(--ink-2);line-height:1.9;}
.wk-agg b{color:var(--ink);}

@media (max-width:600px){
  .stat-row{grid-template-columns:repeat(2,1fr);}
  .quick{grid-template-columns:1fr;}
  .tabs{order:3;width:100%;margin:6px 0 0;}
  .logout{margin-left:auto;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}

/* ===== v2: tasks / banner / progress ===== */
.banner{display:flex;gap:10px;align-items:flex-start;background:#FBF3E2;border:1px solid #EAD9B4;
  border-radius:12px;padding:14px 16px;margin-bottom:16px;}
.banner-tag{font-family:var(--mono);font-size:11px;color:var(--amber);border:1px solid #EAD9B4;
  border-radius:6px;padding:2px 7px;white-space:nowrap;}
#msg-banner-text{font-size:14.5px;line-height:1.6;}

.task-add{display:flex;gap:8px;margin-bottom:14px;}
.task-add input[type=time]{width:96px;flex:none;}
.task-add input[type=text]{flex:1;}
.task-add .primary{padding:10px 16px;}

.progress-wrap{height:8px;background:var(--line-2);border-radius:99px;overflow:hidden;margin-bottom:6px;}
.progress{height:100%;width:0;background:linear-gradient(90deg,var(--teal),#2FA0B4);border-radius:99px;transition:width .35s;}
.progress-lab{font-family:var(--mono);font-size:12px;color:var(--ink-2);margin-bottom:12px;}

.tasklist{list-style:none;margin:0;padding:0;}
.task{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line-2);}
.task:first-child{border-top:none;}
.taskcheck{width:26px;height:26px;flex:none;border:1.5px solid var(--line);background:#fff;border-radius:7px;
  color:#fff;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;}
.task.done .taskcheck{background:var(--teal);border-color:var(--teal);}
.task-meta{flex:1;display:flex;align-items:baseline;gap:10px;min-width:0;}
.task-title{font-size:15px;word-break:break-word;}
.task.done .task-title{color:var(--ink-2);text-decoration:line-through;}
.task-time{font-family:var(--mono);font-size:12px;color:var(--teal);flex:none;}
.task-act{display:flex;gap:4px;flex:none;}
.iconbtn{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:8px;background:#fff;text-decoration:none;font-size:14px;color:var(--ink-2);}
.iconbtn:hover{border-color:var(--teal);}
.hint{font-size:12px;color:var(--ink-2);margin:14px 0 0;line-height:1.6;}

@media (max-width:600px){
  .task-add{flex-wrap:wrap;}
  .task-add input[type=text]{flex:1 1 100%;order:-1;}
}

/* ===== v3: goals / north-star / routines / verify ===== */
.northstar{background:linear-gradient(135deg,#19293F,#24405F);color:#fff;border-radius:16px;
  padding:22px 22px 18px;margin-bottom:16px;box-shadow:var(--shadow);}
.ns-tag{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:#9FD3DD;text-transform:uppercase;}
.ns-title{font-size:16px;font-weight:700;margin:6px 0 8px;line-height:1.5;}
.ns-count{font-family:var(--mono);font-size:30px;font-weight:700;color:#fff;line-height:1.1;}
.ns-meta{font-family:var(--mono);font-size:12px;color:#B9C6D6;margin:6px 0 12px;}
.northstar .progress-wrap{background:rgba(255,255,255,.18);}
.northstar .progress{background:linear-gradient(90deg,#36C0D6,#7BE0EE);}

.ns-mini{background:var(--teal-soft);border:1px solid #BBDDE2;border-radius:10px;padding:10px 14px;
  margin-bottom:14px;font-size:14px;color:var(--ink);}

.goalcard{cursor:pointer;transition:border-color .15s,transform .05s;}
.goalcard:hover{border-color:var(--teal);}
.goalcard:active{transform:scale(.997);}
.goalcard.primary{border-color:var(--amber);background:#FFFDF7;}
.goal-top{display:flex;align-items:flex-start;gap:12px;margin-bottom:6px;}
.goal-title{flex:1;font-size:15px;font-weight:700;line-height:1.5;}
.goal-count{font-family:var(--mono);font-size:13px;color:var(--ink-2);white-space:nowrap;padding-top:2px;}
.goal-count.soon{color:var(--rust);font-weight:700;}
.goal-sub{font-size:12px;color:var(--ink-2);margin-bottom:10px;line-height:1.5;}
.goal-foot{display:flex;justify-content:flex-end;font-family:var(--mono);font-size:12px;color:var(--ink-2);margin-top:4px;}

.task-goal{font-size:13px;flex:none;cursor:help;}

.verify textarea{background:#FFFDF7;border-color:#EAD9B4;}
.verify h3::before{content:"🔬 ";}

/* modal */
.modal{position:fixed;inset:0;background:rgba(25,41,63,.45);display:flex;align-items:center;
  justify-content:center;padding:20px;z-index:50;}
.modal-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25);
  padding:24px;max-width:440px;width:100%;max-height:90vh;overflow:auto;}
.modal-card h3{margin:0 0 14px;}
.modal-card input[type=range]{width:100%;accent-color:var(--teal);}
.modal-card .check{display:flex;align-items:center;gap:8px;margin:12px 0;font-size:14px;cursor:pointer;}
.modal-card .check input{width:18px;height:18px;accent-color:var(--teal);}
.modal-card .actions{margin-top:16px;}
#gm-del{color:var(--rust);border-color:#E6C3BB;}

@media (max-width:600px){
  .tabs{order:3;width:100%;margin:6px 0 0;justify-content:space-between;}
  .tab{padding:7px 10px;font-size:13px;}
  .task-add{flex-wrap:wrap;}
  .task-add input[type=text]{flex:1 1 100%;order:-1;}
  .task-add select{flex:1;}
}

/* ===== v4: daily workout ===== */
.workout .card-head{margin-bottom:12px;}
.wk-streak{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--rust);}
.wk-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.wk-focus{display:flex;align-items:baseline;gap:10px;flex:1;}
.wk-min{font-family:var(--mono);font-size:13px;color:#fff;background:var(--teal);border-radius:7px;padding:3px 9px;flex:none;}
#wk-focus{font-size:15px;font-weight:700;}
.wk-check{display:flex;align-items:center;gap:10px;width:100%;justify-content:center;
  background:#FCFBF8;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:15px;color:var(--ink);margin-bottom:10px;}
.wk-check .wk-dot{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line);}
.wk-check.on{background:var(--teal-soft);border-color:var(--teal);color:var(--ink);font-weight:700;}
.wk-check.on .wk-dot{background:var(--teal);border-color:var(--teal);}

/* fix: hidden attribute must override display:flex/grid (modal/banner等) */
[hidden]{display:none!important;}
