:root{--bg:#f6f3ee;--surface:#fff;--surface-2:#ece7df;--text:#1d1a16;--muted:#776f64;--border:#ddd5c9;--accent:#d9861c;--accent-text:#1d1a16;--danger:#c2412d;--ok:#3f8f4f;--radius:12px;--film-yellow:#e2a534;--film-yellow-band:#f6e3b4;--film-black:#2d2b28;--film-black-band:#e9e5dd;--film-blue:#2f6fa3;--film-blue-band:#cfe0ee;--film-red:#c0462f;--film-red-band:#f2d2c8;--film-green:#4d8048;--film-green-band:#d6e6d2;--film-purple:#6c56a0;--film-purple-band:#ddd5ec;--film-silver:#a39e94;--film-silver-band:#ecebe7;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-text-size-adjust:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.45}@media (prefers-color-scheme:dark){:root:not([data-theme]){--bg:#15130f;--surface:#211e19;--surface-2:#2c2822;--text:#f1ebe2;--muted:#a39a8c;--border:#3a352d;--accent:#f0a640;--danger:#ef6f5a;--ok:#6cc17c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=amber-dark]{--bg:#15130f;--surface:#211e19;--surface-2:#2c2822;--text:#f1ebe2;--muted:#a39a8c;--border:#3a352d;--accent:#f0a640;--danger:#ef6f5a;--ok:#6cc17c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=dracula]{--bg:#282a36;--surface:#343746;--surface-2:#44475a;--text:#f8f8f2;--muted:#a2abd9;--border:#4b4e63;--accent:#bd93f9;--accent-text:#282a36;--danger:#f55;--ok:#50fa7b;--film-yellow:#f1fa8c;--film-yellow-band:#fbfde0;--film-black:#191a21;--film-black-band:#f8f8f2;--film-blue:#8be9fd;--film-blue-band:#dcf8fe;--film-red:#f55;--film-red-band:#ffd5d5;--film-green:#50fa7b;--film-green-band:#d4fbe0;--film-purple:#bd93f9;--film-purple-band:#ece0fd;--film-silver:#6272a4;--film-silver-band:#c9cde0;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}h1{margin:.25rem 0 1rem;font-size:1.5rem}h2{color:var(--muted);margin:1.5rem 0 .5rem;font-size:1rem;font-weight:600}a{color:var(--accent)}button,.button,input,select,textarea{font:inherit;color:inherit}button,.button{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;justify-content:center;align-items:center;gap:.4rem;min-height:44px;padding:0 1rem;text-decoration:none;display:inline-flex}button.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text);font-weight:600}button.danger{color:var(--danger)}button.big{flex:1;min-height:52px;font-size:1.05rem}button.link{min-height:36px;color:var(--accent);background:0 0;border:0;padding:0}input,select,textarea{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:100%;min-height:44px;padding:.5rem .75rem}textarea{resize:vertical}.app{flex-direction:column;min-height:100dvh;display:flex}.topbar{z-index:2;padding:calc(env(safe-area-inset-top) + .5rem) 16px .5rem;background:var(--bg);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.brand{color:var(--text);letter-spacing:.02em;font-size:1.1rem;font-weight:700;text-decoration:none}main{flex:1;width:100%;max-width:640px;margin:0 auto;padding:1rem 16px 6rem}.tabbar{background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar a{text-align:center;color:var(--muted);flex:1;padding:.9rem 0;font-weight:500;text-decoration:none}.tabbar a.active{color:var(--accent)}.sync{border-radius:999px;min-height:32px;padding:0 .7rem;font-size:.85rem}.sync .dot{background:var(--ok);border-radius:50%;width:8px;height:8px}.sync-syncing .dot{background:var(--accent);animation:1s infinite alternate pulse}.sync-offline .dot{background:var(--muted)}.sync-error .dot,.sync-auth .dot{background:var(--danger)}@keyframes pulse{to{opacity:.3}}.banner{background:var(--surface-2);text-align:center;padding:.6rem 16px;font-size:.9rem}.page-head{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;display:flex}.page-head h1{margin-bottom:.15rem}.list{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin:0;padding:0;list-style:none;overflow:hidden}.list:empty{display:none}.list li+li{border-top:1px solid var(--border)}.row{width:100%;min-height:56px;color:inherit;text-align:left;background:0 0;border:0;border-radius:0;justify-content:space-between;align-items:center;gap:.75rem;padding:.6rem 1rem;text-decoration:none;display:flex}.title{font-weight:600}.count{color:var(--muted);font-variant-numeric:tabular-nums}.frame-no{min-width:2rem;color:var(--accent);font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:700}.grow{flex:1;min-width:0}.muted{color:var(--muted)}.small{font-size:.85rem}.empty,.hint{color:var(--muted)}.notes{white-space:pre-wrap}.error{color:var(--danger);white-space:pre-wrap}.form{flex-direction:column;gap:1rem;display:flex}.form label{color:var(--muted);flex-direction:column;gap:.3rem;font-size:.9rem;display:flex}.form label>input,.form label>select,.form label>textarea{color:var(--text);font-size:1rem}.grid2{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.actions{flex-wrap:wrap;gap:.5rem;display:flex}.card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin-bottom:1rem;padding:1rem}.card h2{margin-top:0}.frame-form{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin-bottom:.5rem;padding:1rem}.frame-head{gap:.75rem;display:flex}.frame-number{flex-shrink:0;width:5.5rem}.frame-number input{text-align:center;font-weight:700;font-size:1.25rem!important}.chips{border:0;min-width:0;margin:0;padding:0}.chips legend{color:var(--muted);margin-bottom:.4rem;padding:0;font-size:.9rem}.chip-row{flex-wrap:wrap;gap:.4rem;display:flex}.chip{background:var(--surface-2);font-variant-numeric:tabular-nums;border-color:#0000;border-radius:999px;min-width:3.2rem;min-height:40px;padding:0 .6rem}.chip.on{background:var(--accent);color:var(--accent-text);font-weight:600}.gps{align-items:center;gap:1rem;font-size:.9rem;display:flex}.segmented{border-radius:var(--radius);background:var(--surface-2);margin-bottom:1rem;padding:3px;display:flex}.segmented button{min-height:38px;color:var(--muted);background:0 0;border:0;flex:1}.segmented button.on{background:var(--surface);color:var(--text);font-weight:600}section>.primary,.segmented+.primary,.segmented+.card{margin-bottom:1rem}.toggle{align-items:center;gap:.75rem;color:var(--text)!important;flex-direction:row!important;display:flex!important}.toggle input{width:22px;min-height:22px;accent-color:var(--accent)}.login{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;min-height:100dvh;padding:16px;display:flex}.login h1{margin:0;font-size:2.5rem}.login button{flex:none;margin-top:1.5rem;padding:0 2rem}.icon{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;display:block}.icon.sm{stroke-width:3.4px}.icon.lg{stroke-width:2px}.icon .glass{fill:var(--accent);fill-opacity:.28}.icon .solid{fill:currentColor;stroke:none}.icon .f-body{fill:var(--film)}.icon .f-band{fill:var(--film-band)}.thumb{background:var(--surface-2);border-radius:10px;flex-shrink:0;place-items:center;width:44px;height:44px;display:grid}.stack{flex-shrink:0;position:relative}.stack .badge{background:var(--surface);border:1px solid var(--border);border-radius:7px;place-items:center;width:24px;height:24px;display:grid;position:absolute;bottom:-6px;right:-6px}.row .grow+.count{margin-left:auto}.roll-icons{gap:6px;display:flex}.roll-icons>div{background:var(--surface-2);border-radius:14px;place-items:center;width:56px;height:56px;display:grid}.page-head .grow{flex:1}.picker{border:0;min-width:0;margin:0;padding:0}.picker legend{color:var(--muted);margin-bottom:.4rem;padding:0;font-size:.9rem}.tiles{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:.4rem;display:grid}.tile,.swatch{flex-direction:column;gap:.35rem;height:auto;padding:.6rem .25rem .5rem;font-size:.78rem;line-height:1.2}.swatches{flex-wrap:wrap;gap:.4rem;display:flex}.swatch{min-width:64px}.tile.on,.swatch.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.tile.on .icon{color:var(--accent)}.row.skipped{color:var(--muted);font-style:italic}.row.skipped .frame-no{color:var(--muted);font-style:normal}.list .gap{color:var(--muted);text-align:center;background:repeating-linear-gradient(-45deg, transparent 0 6px, var(--surface-2) 6px 12px);padding:.5rem 1rem;font-size:.85rem}
