:root{
  --bg:#f5f8f4; --card:#ffffff; --ink:#1f2a24; --muted:#5f6f66; --line:#e1e9e3;
  --green:#2f8f6b; --green-d:#23725a; --green-l:#e3f3ea;
  --warn:#b36b00; --warn-bg:#fff3d9; --bad:#b3261e; --bad-bg:#fde7e5;
  --radius:18px; --nav:68px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#121815; --card:#1b2420; --ink:#e8f0eb; --muted:#9fb0a6; --line:#2a3631;
    --green:#4cc19a; --green-d:#3aa985; --green-l:#1f3a30;
    --warn:#f0b24d; --warn-bg:#3a2f14; --bad:#ff8a80; --bad-bg:#3d1c1a;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;padding-bottom:calc(var(--nav) + env(safe-area-inset-bottom) + 12px)}
.wrap{max-width:680px;margin:0 auto;padding:0 16px}
h1,h2,h3{line-height:1.25;margin:0 0 8px}
h2{font-size:1.3rem}
h3{font-size:1.08rem}
p{margin:0 0 10px}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}

.top{position:sticky;top:0;z-index:20;background:var(--green);color:#fff;padding-top:env(safe-area-inset-top)}
.top-in{max-width:680px;margin:0 auto;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.logo{font-weight:700;font-size:1.2rem}
.top-day{font-size:.9rem;opacity:.95}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin:14px 0}
.card.green{background:var(--green-l);border-color:transparent}
.muted{color:var(--muted)}
.small{font-size:.9rem}

.bar{height:12px;background:var(--line);border-radius:99px;overflow:hidden;margin:8px 0}
.bar>i{display:block;height:100%;background:var(--green);border-radius:99px;transition:width .3s}

.hero{display:flex;gap:14px;align-items:center}
.ring{flex:none;width:76px;height:76px}
.ring text{font-weight:700}

.list{list-style:none;margin:0;padding:0}
.item{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.item:first-child{border-top:0}
.item .t{flex:1;min-width:0}
.item .t b{display:block;font-weight:600}
.item .t span{display:block;color:var(--muted);font-size:.88rem}
.chk{flex:none;width:38px;height:38px;border-radius:12px;border:2px solid var(--green);background:transparent;color:#fff;font-size:1.3rem;line-height:1;display:grid;place-items:center}
.chk.on{background:var(--green)}
.cnt{flex:none;display:flex;align-items:center;gap:6px}
.cnt button{width:38px;height:38px;border-radius:12px;border:2px solid var(--green);background:var(--card);font-size:1.3rem;line-height:1;color:var(--green)}
.cnt .n{min-width:46px;text-align:center;font-weight:600}
.cnt.done .n{color:var(--green)}
.auto{flex:none;font-size:1.4rem}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
label.f{display:block;font-size:.9rem;color:var(--muted)}
label.f input,label.f textarea{display:block;width:100%;margin-top:4px;padding:11px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);font-size:1.05rem}
label.f input:focus,label.f textarea:focus,#chatInput:focus{outline:2px solid var(--green);border-color:var(--green)}

.btn{display:inline-block;border:0;background:var(--green);color:#fff;padding:13px 20px;border-radius:14px;font-weight:600;font-size:1.02rem}
.btn:hover{background:var(--green-d)}
.btn.ghost{background:transparent;color:var(--green);border:2px solid var(--green)}
.btn.block{display:block;width:100%}
.btn:disabled{opacity:.5}

.alert{border-radius:14px;padding:12px 14px;margin:12px 0;font-size:.98rem}
.alert.bad{background:var(--bad-bg);color:var(--bad);border:1.5px solid var(--bad)}
.alert.warn{background:var(--warn-bg);color:var(--warn);border:1.5px solid var(--warn)}
.alert.ok{background:var(--green-l);color:var(--green-d)}
.alert b{display:block}

.ask-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chip{border:1.5px solid var(--line);background:var(--card);padding:9px 13px;border-radius:99px;font-size:.95rem}
.chip:hover{border-color:var(--green)}

/* chat */
.avrow{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.avb{border:2px solid var(--line);background:var(--card);border-radius:16px;padding:8px 4px;text-align:center;font-size:.82rem;line-height:1.2}
.avb svg{display:block;margin:0 auto 4px;width:52px;height:52px}
.avb.on{border-color:var(--green);background:var(--green-l)}
.avb b{display:block;font-size:.92rem}
.who{display:flex;gap:12px;align-items:center;margin:14px 0 4px}
.who svg{flex:none;width:60px;height:60px}
.who h2{margin:0}
.badge{display:inline-block;font-size:.72rem;background:var(--green-l);color:var(--green-d);border-radius:99px;padding:2px 8px;vertical-align:middle;margin-left:6px}
#msgs{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.msg{max-width:88%;padding:11px 14px;border-radius:18px;white-space:normal;word-wrap:break-word}
.msg.bot{background:var(--card);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:6px}
.msg.me{background:var(--green);color:#fff;align-self:flex-end;border-bottom-right-radius:6px}
.msg .demo{display:block;margin-top:6px;font-size:.78rem;color:var(--muted)}
.typing{align-self:flex-start;color:var(--muted);font-size:.95rem;padding:4px 8px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.cform{position:sticky;bottom:calc(var(--nav) + env(safe-area-inset-bottom));background:var(--bg);padding:8px 0 10px;display:flex;gap:8px;align-items:flex-end}
#chatInput{flex:1;resize:none;padding:11px 12px;border:1.5px solid var(--line);border-radius:14px;background:var(--card);max-height:140px;min-height:48px}
.send{flex:none;width:52px;height:48px;border-radius:14px;border:0;background:var(--green);color:#fff;font-size:1.3rem}
.send:disabled{opacity:.5}

/* progress */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}
.stat{background:var(--green-l);border-radius:14px;padding:12px 4px}
.stat b{display:block;font-size:1.4rem}
.stat span{font-size:.82rem;color:var(--muted)}
svg.chart{width:100%;height:auto;display:block}
svg.chart text{fill:var(--muted);font-size:10px}
.legend{display:flex;gap:14px;font-size:.85rem;color:var(--muted);margin-top:4px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}
.table{width:100%;border-collapse:collapse;font-size:.92rem}
.table td,.table th{padding:7px 4px;border-top:1px solid var(--line);text-align:left}
.table th{color:var(--muted);font-weight:500;border-top:0}

/* welcome */
.hello{margin-top:18px}
.hello h1{font-size:1.6rem}
.checkrow{display:flex;gap:10px;align-items:flex-start;margin:12px 0;font-size:.95rem}
.checkrow input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--green)}

.foot{padding-top:6px;padding-bottom:14px}
.disc{font-size:.8rem;color:var(--muted)}
.credit{margin:6px 0 0;text-align:right;font-size:.88rem;color:var(--muted)}
.credit a{color:var(--green);text-decoration:none;font-weight:600}
@media (max-width:640px){.credit{text-align:center}}

.nav{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--card);border-top:1px solid var(--line);display:flex;justify-content:center;padding-bottom:env(safe-area-inset-bottom)}
.nav button{flex:1;max-width:226px;height:var(--nav);border:0;background:transparent;font-size:.85rem;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.nav button span{font-size:1.4rem;line-height:1}
.nav button.on{color:var(--green);font-weight:700}
.link{background:none;border:0;color:var(--muted);text-decoration:underline;font-size:.9rem;padding:6px 0}

/* documents */
.sel{display:block;width:100%;margin-top:4px;padding:11px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);font-size:1.05rem}
label.f input[type=file]{padding:9px 10px}
.doc{border-top:1px solid var(--line);padding:12px 0}
.doc:first-of-type{border-top:0}
.doc-h{display:flex;gap:12px;align-items:center}
.thumb{flex:none;width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--green-l)}
.thumb.pdf{display:grid;place-items:center;font-weight:700;color:var(--green-d)}
.doc-b{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.aibox{background:var(--green-l);border-radius:14px;padding:12px;margin-top:10px;font-size:.95rem}
.aibox b{display:block;margin-bottom:4px}
.sel{font-size:.95rem}