:root{--bg:#f6f4ef;--surface:#fff;--text:#22251f;--muted:#6b6f66;--line:#e2ded4;--accent:#2f5d50;--accent-soft:#dfeae5;--want:#8a6d1f;--want-soft:#f4ecd2;--reading:#2f5d50;--reading-soft:#dfeae5;--done:#4a4f8a;--done-soft:#e3e4f3;--danger:#b23b3b;--radius:12px;--tabbar-h:60px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#171916;--surface:#22251f;--text:#ecebe6;--muted:#9ea295;--line:#34382f;--accent:#7fb8a4;--accent-soft:#263a33;--want:#e0c26a;--want-soft:#3a3320;--reading:#7fb8a4;--reading-soft:#263a33;--done:#a9adeb;--done-soft:#2c2e48;--danger:#e07a7a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;margin:0;font-family:-apple-system,BlinkMacSystemFont,PingFang TC,Noto Sans TC,Microsoft JhengHei,sans-serif;font-size:16px;line-height:1.5}button,input,select,textarea{font:inherit;color:inherit}.topbar{z-index:5;padding:calc(env(safe-area-inset-top) + 12px) 16px 10px;background:var(--bg);position:sticky;top:0}.topbar h1{margin:0;font-size:1.6rem}main{padding:0 16px calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 90px);max-width:720px;margin:0 auto}.view{display:none}.view.active{display:block}h2{margin:0 0 8px;font-size:1.15rem}h3{margin:0 0 12px;font-size:1rem}.muted{color:var(--muted);font-size:.875rem}.hint{color:var(--muted);margin:8px 0 0;font-size:.875rem}.empty{color:var(--muted);text-align:center;margin-top:48px}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.spacer{flex:1}.filters{gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.chip{border:1px solid var(--line);background:var(--surface);white-space:nowrap;border-radius:999px;padding:6px 14px}.chip.active{background:var(--accent);border-color:var(--accent);color:var(--bg)}.search,input,select,textarea{border:1px solid var(--line);background:var(--surface);border-radius:10px;width:100%;padding:10px 12px}.search{margin:12px 0}textarea{resize:vertical}.book-list{gap:10px;margin:0;padding:0;list-style:none;display:grid}.book{text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);cursor:pointer;gap:12px;width:100%;padding:10px;display:flex}.cover{object-fit:cover;background:var(--line);border-radius:6px;flex:none;width:56px;height:80px}.cover-blank{color:var(--accent);background:var(--accent-soft);place-items:center;font-size:1.4rem;font-weight:700;display:grid}.book-body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.book-title{overflow-wrap:anywhere;font-weight:600}.meta{flex-wrap:wrap;align-items:center;gap:8px;margin-top:2px;display:flex}.stars{color:var(--want);letter-spacing:1px;font-size:.875rem}.badge{border-radius:999px;padding:1px 8px;font-size:.75rem}.badge-want{color:var(--want);background:var(--want-soft)}.badge-reading{color:var(--reading);background:var(--reading-soft)}.badge-done{color:var(--done);background:var(--done-soft)}.progress{background:var(--accent-soft);border-radius:999px;height:18px;margin-top:6px;position:relative;overflow:hidden}.progress-bar{background:var(--accent);opacity:.35;height:100%}.progress-text{padding-left:8px;font-size:.75rem;line-height:18px;position:absolute;inset:0}.btn{border:1px solid var(--accent);background:var(--accent);color:var(--bg);cursor:pointer;white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:10px 16px;display:inline-flex}.btn-ghost{color:var(--accent);background:0 0}.btn-danger{border-color:var(--danger);color:var(--danger);background:0 0}.btn-block{width:100%;margin-top:10px}.fab{right:20px;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 20px);background:var(--accent);width:56px;height:56px;color:var(--bg);cursor:pointer;border:none;border-radius:50%;font-size:1.8rem;position:fixed;box-shadow:0 4px 14px #00000040}.fab[hidden]{display:none}.tabbar{height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--line);display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar button{color:var(--muted);cursor:pointer;background:0 0;border:none;flex:1}.tabbar button.active{color:var(--accent);font-weight:700}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:12px;padding:16px}.tiles{grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 12px;display:grid}.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);text-align:center;padding:12px 8px}.card .tile{background:var(--bg)}.tile-value{color:var(--accent);font-size:1.4rem;font-weight:700}.tile-label{color:var(--muted);font-size:.75rem}.year-select{width:auto;padding:6px 10px}.bars{grid-template-columns:repeat(12,1fr);align-items:end;gap:4px;height:160px;display:grid}.bar-col{flex-direction:column;justify-content:flex-end;align-items:center;height:100%;display:flex}.bar{background:var(--accent);border-radius:4px 4px 0 0;width:70%;min-height:2px}.bar-num{color:var(--muted);font-size:.7rem}.bar-label{color:var(--muted);margin-top:4px;font-size:.7rem}dialog{background:var(--surface);color:var(--text);border:none;padding:0}dialog::backdrop{background:#00000073}.sheet{width:min(560px,100vw);max-width:100vw;max-height:92vh;padding:20px 16px calc(env(safe-area-inset-bottom) + 16px);border-radius:16px 16px 0 0;margin:auto auto 0;overflow-y:auto}@media (width>=600px){.sheet{border-radius:16px;margin:auto}}#isbn-form{flex-wrap:nowrap;margin-top:10px}#edit-form label{color:var(--muted);margin-bottom:10px;font-size:.875rem;display:block}#edit-form label>input,#edit-form label>select,#edit-form label>textarea{color:var(--text);margin-top:4px;font-size:1rem}.grid2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.edit-head{align-items:center;gap:12px;margin-bottom:12px;display:flex}.edit-head h2{margin:0}.actions{flex-wrap:nowrap;margin-top:8px}.scan{color:#fff;width:100vw;max-width:100vw;height:100vh;max-height:100vh;padding:calc(env(safe-area-inset-top) + 16px) 16px calc(env(safe-area-inset-bottom) + 16px);background:#000}.scan[open]{flex-direction:column;gap:12px;display:flex}.scan-frame{border-radius:var(--radius);background:#111;flex:1;position:relative;overflow:hidden}.scan-frame video{object-fit:cover;width:100%;height:100%}.scan-target{border:3px solid #ffffffd9;border-radius:10px;height:24%;position:absolute;top:38%;left:10%;right:10%;box-shadow:0 0 0 100vmax #00000059}.scan-msg{text-align:center;margin:0}