*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:#000;color:#fff;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden;-webkit-user-select:none;user-select:none}button{font:inherit;cursor:pointer}.big-button{font-size:28px;font-weight:600;padding:18px 40px;border:none;border-radius:16px;background:#22c55e;color:#000}.big-button.secondary{background:#27272a;color:#fff}.select,.result{height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:safe center;gap:20px;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%;max-width:1000px}@media(orientation:portrait){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}.card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 10px 14px;border:3px solid transparent;border-radius:16px;background:#18181b;color:#fff}.card.selected{border-color:#22c55e;background:#14301f}.card-figure{width:100%;max-width:140px;color:#a1a1aa}.card.selected .card-figure{color:#22c55e}.card-title{font-size:24px;font-weight:700}.card-hint{font-size:14px;opacity:.7}.settings{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:center;gap:16px 24px}.setting{display:flex;flex-direction:column;gap:6px}.setting-label{font-size:16px;opacity:.7}.stepper{display:flex;align-items:stretch;border-radius:12px;overflow:hidden;background:#27272a}.stepper button{width:56px;border:none;background:#3f3f46;color:#fff;font-size:28px}.stepper input{width:90px;padding:10px 0;border:none;background:transparent;color:#fff;font:inherit;font-size:28px;font-weight:700;text-align:center;-moz-appearance:textfield;appearance:textfield}.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.segmented{display:flex;border-radius:12px;overflow:hidden;background:#27272a}.segmented button{padding:14px 16px;border:none;background:transparent;color:#fff;font-size:18px}.segmented button.active{background:#22c55e;color:#000;font-weight:600}.result h1{margin:0;font-size:40px}.result-main{font-size:min(9vh,8vw,48px);text-align:center}.result-main b{font-size:1.5em}.result-main.success b{color:#22c55e}.result-stats{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:22px;opacity:.85}.reasons{margin:0;padding:12px 20px 12px 40px;border-radius:12px;background:#18181b;font-size:22px;color:#fca5a5}.result-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.screen{position:relative;height:100%}.camera{position:absolute;inset:0}.camera-video{width:100%;height:100%;object-fit:contain;background:#000}.skeleton{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.camera-video.mirrored,.skeleton.mirrored{transform:scaleX(-1)}.fps{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));padding:6px 12px;border-radius:10px;background:#0000008c;font-size:18px;font-variant-numeric:tabular-nums;touch-action:none;-webkit-touch-callout:none}.debug{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) + 44px);left:max(12px,env(safe-area-inset-left));max-height:calc(100% - 80px);overflow:auto;padding:10px 14px;border-radius:12px;background:#000000b3;font-size:16px;font-variant-numeric:tabular-nums;pointer-events:none}.debug-head{margin-bottom:6px}.debug table{border-collapse:collapse}.debug th{font-weight:400;opacity:.6;text-align:right;padding:0 0 4px 12px}.debug td{padding:2px 0}.debug-value{text-align:right;padding-left:12px!important;font-size:20px;font-weight:600}.debug-raw{text-align:right;padding-left:12px!important;opacity:.6}.hud{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) + 52px);right:max(16px,env(safe-area-inset-right));text-align:right;pointer-events:none;text-shadow:0 2px 8px rgba(0,0,0,.8)}.hud-title{font-size:22px;opacity:.85}.counter{font-size:min(22vh,16vw,160px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.counter.timer{font-size:min(16vh,11vw,120px)}.counter-target{font-size:.45em;font-weight:600;opacity:.8}.counter.done{color:#22c55e}.failed{font-size:22px;color:#fca5a5}.hint{position:absolute;left:50%;bottom:calc(max(16px,env(safe-area-inset-bottom)) + 64px);transform:translate(-50%);max-width:calc(100% - 32px);padding:10px 28px;border-radius:16px;font-size:min(8vh,7vw,44px);font-weight:700;text-align:center;width:max-content;pointer-events:none}.hint-info{background:#000000a6}.hint-ok{background:#16a34ad9}.hint-error{background:#dc2626d9}.bottom-bar{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));display:flex;gap:8px}.tool-button.stop{border-color:#ef4444cc;background:#7f1d1db3}.prepare-guide{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.prepare-figure{width:min(70vw,120vh);max-height:60vh;color:#ffffff73;stroke-dasharray:6 6}.prepare-text{font-size:min(7vh,7vw,40px);font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,.8)}.countdown{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:min(50vh,50vw);font-weight:800;color:#22c55e;text-shadow:0 4px 24px rgba(0,0,0,.8);pointer-events:none;animation:countdown-pop 1s ease-out}@keyframes countdown-pop{0%{transform:scale(1.4);opacity:.4}to{transform:scale(1);opacity:1}}.visibility{position:absolute;left:50%;bottom:calc(max(16px,env(safe-area-inset-bottom)) + 64px);transform:translate(-50%);overflow:hidden;padding:10px 24px;border-radius:16px;background:#dc2626d9;font-size:min(6vh,6vw,30px);font-weight:700;white-space:nowrap;pointer-events:none}.visibility.ok{background:#000000a6}.visibility-fill{position:absolute;inset:0 auto 0 0;background:#16a34ae6;transition:width .1s linear}.visibility span{position:relative}.camera-status{position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translate(-50%);padding:10px 20px;border-radius:12px;background:#000000b3;font-size:22px;text-align:center}.camera-error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:32px;text-align:center;font-size:24px;background:#000c}.toolbar{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;gap:8px}.tool-button{font-size:18px;padding:10px 16px;border:1px solid rgba(255,255,255,.4);border-radius:12px;background:#00000080;color:#fff}
