/* CrewSync finals page styles (split out of finals.html 16 Oct 2026, XVII; precached and required by sw.js) */
:root{--bg:#f5f7f9;--face:#fff;--ink:#2d3748;--mut:#718096;--line:#e0e5ea;--brand:#0f6e5a;--alert:#b42318;--amber:#fff4d6;--amberline:#e0b64f;--na:#8a6d1d}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 -apple-system,system-ui,sans-serif;padding:56px 0 40px}
h1{font-size:15px;letter-spacing:.2em;color:var(--brand);margin:0;font-weight:800}
.sub{font-size:11px;color:var(--mut);letter-spacing:.1em}
.top{position:sticky;top:56px;z-index:3;background:var(--bg);padding:12px 14px 8px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:9px;margin-bottom:10px}.brand .sub{margin-bottom:0}
.appnav{position:fixed;top:0;left:0;right:0;z-index:12;display:flex;gap:6px;padding:8px 14px;
background:var(--bg);border-bottom:1px solid var(--line);padding-top:max(8px,env(safe-area-inset-top))}
.appnav a,.appnav span{flex:1;text-align:center;padding:9px 4px;border-radius:9px;font-size:13px;font-weight:700;
text-decoration:none;color:var(--mut);background:var(--face);border:1px solid var(--line);line-height:1.4}
.appnav .on{background:var(--brand);color:#fff;border-color:var(--brand)}
main{padding:12px 14px 0}
.card{background:var(--face);border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:12px}
.note{font-size:13px;color:var(--mut)}
textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px;font:inherit;min-height:64px;resize:vertical;margin-top:6px}
.plots{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.plots button{font:inherit;font-weight:700;min-width:96px;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--face);color:var(--ink);text-align:left}
.plots button.carried{border-color:var(--amberline);background:var(--amber)}
.plots button.on{box-shadow:inset 0 0 0 2px var(--brand)}
.item{display:grid;grid-template-columns:30px 1fr;gap:6px 10px;padding:12px 0;border-bottom:1px solid var(--line)}
.item:last-child{border-bottom:0}.item .num{font-weight:700;color:var(--mut);padding-top:2px}
.acts{grid-column:2;display:flex;gap:6px;flex-wrap:wrap}.item textarea{grid-column:2}
.acts button{font:inherit;font-size:14px;padding:8px 12px;border-radius:9px;border:1px solid var(--line);background:var(--face);color:var(--ink)}
.acts button.on.done{background:#1e8e3e;color:#fff;border-color:#1e8e3e;font-weight:700}   /* GREEN, ticked (Mark, 24 Oct) */
.acts button.on.na{background:var(--na);color:#fff;border-color:var(--na)}
.acts button.on.not_right{background:var(--alert);color:#fff;border-color:var(--alert)}
.bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden}.bar i{display:block;height:100%;background:var(--brand)}
.sticky{position:sticky;bottom:0;background:var(--bg);padding:10px 0 14px;border-top:1px solid var(--line)}
button.go{width:100%;border:0;border-radius:10px;padding:14px;font:inherit;font-weight:700;color:#fff;background:var(--brand)}
button.ghost{background:var(--face);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:10px;font:inherit;margin:6px 6px 0 0}
button:disabled{opacity:.5}
.ok{background:#e8f5ef;border-color:#9ed3bd}.err{background:#fdecec;border-color:#e6a6a6;color:var(--alert);font-weight:600}
.mine{border-top:1px solid var(--line);padding:9px 0;font-size:14px}
.mine:first-of-type{border-top:0}.mine .when{color:var(--mut);font-size:12px}
