:root{--bg: #141b24;--panel: #1e2836;--ink: #eef3f8;--muted: #9aa9bb;--accent: #5fb2ff;--jack: #ffb347;--good: #4ade80;--bad: #ff6b6b;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif;-webkit-text-size-adjust:100%}#root{min-height:100%}.app{display:flex;flex-direction:column;gap:.9rem;padding:max(.9rem,env(safe-area-inset-top)) .9rem max(.9rem,env(safe-area-inset-bottom));max-width:720px;margin:0 auto}header{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}h1{font-size:1.25rem;margin:0;letter-spacing:.01em}button,.primary-button{font:inherit;border-radius:12px;border:0;cursor:pointer}.primary-button{display:block;background:var(--accent);color:#06121f;font-weight:600;text-align:center;padding:1rem;position:relative;overflow:hidden}.primary-button input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.ghost{background:transparent;color:var(--muted);border:1px solid #33445c;padding:.45rem .8rem}.intro{display:flex;flex-direction:column;gap:1rem}.lede{margin:0;color:var(--muted)}.tips{margin:0;padding-left:1.1rem;color:var(--muted);font-size:.9rem}.tips li+li{margin-top:.4rem}.canvas-wrap{position:relative;width:100%;aspect-ratio:4 / 3;background:#0b1119;border-radius:14px;overflow:hidden}.canvas-wrap canvas{display:block;touch-action:none}.hint{color:var(--muted);font-size:.9rem;text-align:center}.diameter{display:flex;flex-direction:column;gap:.4rem;background:var(--panel);border-radius:12px;padding:.8rem .9rem;font-size:.9rem}.diameter span{display:flex;align-items:center;gap:.8rem}.diameter input{flex:1;accent-color:var(--accent)}.diameter output{font-variant-numeric:tabular-nums;min-width:5.5ch;text-align:right}.diameter small{color:var(--muted)}.results{display:flex;flex-direction:column;gap:.7rem}.measuring{margin:0;color:var(--muted);text-align:center}.verdict{margin:0;background:color-mix(in srgb,var(--good) 16%,var(--panel));border-left:3px solid var(--good);border-radius:10px;padding:.8rem .9rem}.verdict.too-close{background:color-mix(in srgb,var(--jack) 16%,var(--panel));border-left-color:var(--jack)}.ranking{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}.ranking li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;background:var(--panel);border-radius:10px;padding:.7rem .9rem}.ranking li.winner{outline:1px solid var(--good)}.ranking .distance{font-variant-numeric:tabular-nums;font-weight:600}.ranking .distance em{font-style:normal;font-weight:400;color:var(--muted)}.team-picker{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--muted)}.team-picker span:first-child{margin-right:auto}.team-chip{background:var(--panel);color:var(--muted);border:1px solid #33445c;border-radius:999px;padding:.4rem .8rem;font-size:.85rem;font-weight:600}.team-chip.small{padding:.15rem .5rem;font-size:.75rem;margin-right:.5rem}.team-chip.team-a.active,.ranking .team-chip.team-a{background:var(--accent);border-color:var(--accent);color:#06121f}.team-chip.team-b.active,.ranking .team-chip.team-b{background:var(--jack);border-color:var(--jack);color:#21160a}.scoreboard{display:flex;flex-direction:column;gap:.6rem;background:var(--panel);border-radius:14px;padding:.9rem}.score-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.score{display:flex;flex-direction:column;gap:.15rem;background:#16202c;border-radius:10px;padding:.7rem .9rem;border-left:3px solid transparent}.score.team-a{border-left-color:var(--accent)}.score.team-b{border-left-color:var(--jack)}.score.won{outline:1px solid var(--good)}.score-label{font-size:.8rem;color:var(--muted)}.score-value{font-size:2rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1}.score-actions{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font-size:.85rem}.score-actions span:last-child{display:flex;gap:.4rem}.muted{color:var(--muted)}.ghost.wide{width:100%;padding:.8rem}.as-button{display:block;position:relative;overflow:hidden;text-align:center;cursor:pointer}.as-button input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.ghost:disabled{opacity:.7}.saved{display:flex;flex-direction:column;gap:.6rem}.saved-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}.saved-list>li{background:var(--panel);border-radius:12px;padding:.75rem .85rem;display:flex;flex-direction:column;gap:.5rem}.saved-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font-size:.85rem}.saved-head span:last-child{display:flex;gap:.4rem}.saved-results{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem;font-size:.9rem}.saved-results li{display:flex;justify-content:space-between;gap:1rem}.saved-results li.winner{color:var(--good)}.saved-results em{font-style:normal;color:var(--muted)}.saved-photo{width:100%;border-radius:8px;display:block}.camera{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:20}.camera video{width:100%;height:100%;object-fit:cover;display:block}.camera-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.camera-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:.8rem;padding:max(.8rem,env(safe-area-inset-top)) .9rem .8rem;background:linear-gradient(to bottom,rgba(0,0,0,.6),transparent)}.camera-top .ghost{background:#0a101899;border-color:#ffffff40;color:var(--ink)}.camera-status{flex:1;font-size:.85rem;color:var(--ink);text-shadow:0 1px 3px rgba(0,0,0,.8)}.camera-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem .9rem max(1.2rem,env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(0,0,0,.65),transparent)}.shutter{width:74px;height:74px;border-radius:50%;background:#ffffff40;border:3px solid #fff;display:grid;place-items:center;padding:0}.shutter span{width:58px;height:58px;border-radius:50%;background:#fff;transition:transform .1s}.shutter:active span{transform:scale(.88)}.shutter:disabled{opacity:.45}.camera-hint{margin:0;font-size:.78rem;color:#eef3f8cc;text-align:center;text-shadow:0 1px 3px rgba(0,0,0,.8)}.warning,.error{margin:0;border-radius:10px;padding:.7rem .9rem;font-size:.9rem}.warning{background:color-mix(in srgb,var(--jack) 14%,var(--panel));color:var(--ink)}.error{background:color-mix(in srgb,var(--bad) 14%,var(--panel));color:var(--ink)}