:root{--ink: #3c3327;--ink-soft: #7a6c58;--paper: #f6f0e4;--paper-2: #ece2cf;--line: rgba(90, 74, 52, .18);--accent: #b4634a;--accent-2: #6f8b74;--amber: #c08a3e;--shadow: 0 10px 24px rgba(72, 58, 38, .16), 0 2px 6px rgba(72, 58, 38, .1);--panel: rgba(246, 240, 228, .92)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#e9e1d2;color:var(--ink);font:14px/1.4 ui-rounded,SF Pro Rounded,Segoe UI,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{position:fixed;inset:0}#view{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}#view[hidden]{display:none}button{font:inherit;color:inherit;cursor:pointer}.tool{padding:8px 13px;border-radius:10px;border:1px solid var(--line);background:var(--paper);font-size:13px;font-weight:600;white-space:nowrap}.tool:disabled{opacity:.4;cursor:default}.tool:active:not(:disabled){transform:translateY(1px)}.tool.ghost{font-weight:500}.tool.primary{background:var(--accent-2);color:#fff;border-color:transparent}.tool.danger{background:var(--accent);color:#fff;border-color:transparent}.icon{width:30px;height:30px;padding:0;border-radius:9px;border:1px solid var(--line);background:var(--paper);font-size:15px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.icon[data-off="1"]{opacity:.42;text-decoration:line-through}.mark{width:20px;height:20px;border-radius:6px;flex:none;background:radial-gradient(circle at 50% 118%,var(--paper) 0 34%,transparent 35%),linear-gradient(135deg,var(--accent) 0 55%,var(--accent-2) 55% 100%);box-shadow:inset 0 0 0 1px #0000001f}#menu{position:absolute;inset:0;overflow-y:auto;padding:max(24px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:18px;background:radial-gradient(120% 80% at 50% 0%,#f6f1e6,#e9e1d2 60%,#ddd3c0)}#menu[hidden]{display:none}.menuHead{text-align:center;max-width:460px}.menuHead .mark{display:inline-block;vertical-align:-3px;margin-right:8px}.menuHead h1{display:inline;font-size:22px;letter-spacing:.2px;margin:0}.menuHead p{margin:8px 0 0;font-size:13px;color:var(--ink-soft)}#cards{display:grid;gap:14px;width:100%;max-width:720px;grid-template-columns:1fr}@media(min-width:620px){#cards{grid-template-columns:1fr 1fr}}.pcard{display:flex;flex-direction:column;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);text-align:left}.pcard .shot{height:168px;border-radius:11px;background:linear-gradient(180deg,#f7f2e7,#e6ddca);display:grid;place-items:center;overflow:hidden;margin-bottom:10px}.pcard .shot img{width:100%;height:100%;object-fit:contain}.pcard h2{margin:0;font-size:16px}.pcard .blurb{margin:3px 0 10px;font-size:12.5px;color:var(--ink-soft)}.pcard .meter{height:6px;border-radius:3px;background:#5a4a3429;overflow:hidden;margin-bottom:8px}.pcard .meter span{display:block;height:100%;background:linear-gradient(90deg,var(--accent-2),#8fae93)}.pcard .foot{display:flex;align-items:center;gap:10px}.pcard .state{font-size:12px;color:var(--ink-soft);flex:1}.pcard.done .state{color:var(--accent-2);font-weight:600}.menuFoot{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink-soft)}#play[hidden]{display:none}#brand,#status{position:absolute;top:max(10px,env(safe-area-inset-top));display:flex;align-items:center;gap:8px;padding:6px 10px;background:#f6f0e4db;backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}#brand{left:10px;padding-left:6px}#status{right:10px}#brand .words{display:flex;flex-direction:column;line-height:1.15}#brand b{font-size:13.5px;letter-spacing:.2px}#brand i{font-style:normal;font-size:10px;color:var(--ink-soft)}#progress{width:64px;height:6px;border-radius:3px;background:#5a4a3429;overflow:hidden}#bar{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--accent-2),#8fae93);transition:width .28s cubic-bezier(.2,.8,.2,1)}#count{font-variant-numeric:tabular-nums;font-size:12px;color:var(--ink-soft);min-width:42px;text-align:right}#toast{position:absolute;left:50%;transform:translate(-50%);bottom:calc(var(--tray-h, 140px) + 16px);max-width:min(86vw,380px);text-align:center;padding:8px 14px;font-size:12.5px;font-weight:600;background:var(--panel);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);pointer-events:none;animation:rise .22s cubic-bezier(.2,1,.3,1) both}#toast[hidden]{display:none}#toast[data-kind=turned]{color:#8a5c14;border-color:#c08a3e80}#toast[data-kind=far]{color:var(--ink-soft)}#toast[data-kind=good]{color:#3f6b4a;border-color:#6f8b7480}@keyframes rise{0%{opacity:0;transform:translate(-50%) translateY(6px)}}#tray{position:absolute;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));margin:0 auto;max-width:min(96vw,960px);padding:8px 10px 10px;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);transition:opacity .4s,transform .4s}#tray[data-hidden="1"]{opacity:0;transform:translateY(18px);pointer-events:none}#coach{margin:2px 2px 8px;padding:8px 11px;font-size:12.5px;line-height:1.35;color:#4a5b4d;background:#6f8b7421;border:1px solid rgba(111,139,116,.32);border-radius:10px}#coach[hidden]{display:none}#coach b{color:#3f6b4a}#trayTools{display:flex;align-items:center;gap:8px;margin-bottom:8px}#selName{font-size:11.5px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:right}@keyframes nudge{0%,to{transform:translate(0)}20%{transform:translate(-3px)}45%{transform:translate(3px)}70%{transform:translate(-2px)}}.tool[data-nudge="1"]{animation:nudge .45s ease 2;border-color:var(--amber);box-shadow:0 0 0 2px #c08a3e47}#thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:5px}@media(min-width:560px){#thumbs{grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:6px}}.thumb{position:relative;aspect-ratio:1;padding:2px;border-radius:10px;border:1px solid var(--line);background:linear-gradient(180deg,#fffaf0,var(--paper-2));touch-action:none;display:flex;align-items:center;justify-content:center;transition:transform .12s,box-shadow .12s,border-color .12s,opacity .3s}.thumb img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 1px 1px rgba(70,55,35,.28))}.thumb[data-sel="1"]{border-color:var(--accent-2);box-shadow:0 0 0 2px #6f8b7459;transform:translateY(-2px)}.thumb[data-gone="1"]{opacity:.3;background:#78695014;box-shadow:inset 0 1px 3px #4637232e;pointer-events:none}.thumb[data-gone="1"] img{filter:grayscale(1) opacity(.65)}.thumb[data-dragging="1"]{opacity:.3}.thumb[data-coach="1"]:after{content:"";position:absolute;inset:-4px;border-radius:13px;border:2px solid var(--accent-2);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.25}50%{opacity:.9}}#done{position:absolute;left:50%;transform:translate(-50%);bottom:max(14px,env(safe-area-inset-bottom));width:min(94vw,460px)}#done[hidden]{display:none}#done .card{display:flex;flex-direction:column;align-items:center;gap:3px;padding:16px 18px 15px;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);animation:pop .42s cubic-bezier(.2,1.3,.3,1) both}#done b{font-size:17px}#done span{font-size:12.5px;color:var(--ink-soft)}#done .row{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap;justify-content:center}@keyframes pop{0%{transform:scale(.94) translateY(10px);opacity:0}}#confirm{position:absolute;inset:0;display:grid;place-items:center;background:#e9e1d299;backdrop-filter:blur(3px);z-index:5}#confirm[hidden]{display:none}#confirm .card{width:min(90vw,340px);padding:20px 22px;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);animation:pop .3s cubic-bezier(.2,1.3,.3,1) both}#confirm b{font-size:16px}#confirm p{margin:6px 0 15px;font-size:13px;color:var(--ink-soft)}#confirm .row{display:flex;gap:8px;justify-content:center}@media(max-width:560px){#brand{max-width:calc(100vw - 196px);gap:6px}#brand b{font-size:12.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#brand i{display:none}#status{gap:6px;padding:6px 8px}#progress{width:40px}#count{font-size:11px;min-width:34px}.icon{width:26px;height:26px;font-size:13px}}