@font-face{font-family:Digital7;src:url(/shotclock-app/fonts/digital-7.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#fff;background:#05080d;font-synthesis:none;text-rendering:optimizeLegibility;--navy: #172331;--orange: #f24705;--green: #28e06f;--red: #ff3434;--muted: #9aa7b4;--panel: #0f1720;--line: #26323e}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{min-height:100vh;background:#05080d}button,input,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.shell{width:min(100%,760px);margin:0 auto;padding:max(18px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom))}.brand{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}.brand-mark{font-weight:900;letter-spacing:.12em;text-transform:uppercase;font-size:.85rem;color:#cbd5df}.brand-title{font-size:1.05rem;font-weight:800}.panel{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:20px}.stack{display:grid;gap:14px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.btn{border:1px solid var(--line);background:#111b25;color:#fff;border-radius:16px;min-height:54px;padding:12px 14px;font-weight:800}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--orange);border-color:var(--orange);color:#fff}.btn-reset{min-height:88px;font-size:1.55rem;background:#eff4f7;color:#091018;border:none}.btn-active{outline:3px solid var(--orange);outline-offset:2px}.btn-danger{background:#5a1111;border-color:#8f2222}.input{width:100%;min-height:52px;border-radius:14px;border:1px solid var(--line);background:#09111a;color:#fff;padding:10px 14px;font-size:1.1rem}.label{color:var(--muted);font-size:.85rem;margin-bottom:6px;display:block}.status{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--muted)}.dot{width:10px;height:10px;border-radius:50%;background:#687683}.dot.on{background:var(--green)}.dot.off{background:var(--red)}.muted{color:var(--muted)}.small{font-size:.86rem}.clock-preview{font-family:Digital7,monospace;font-weight:400;font-style:normal;text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.02em;font-size:clamp(5rem,27vw,11rem);line-height:.9;padding:18px 4px 12px;color:var(--green);user-select:none;-webkit-user-select:none}.clock-preview.red{color:var(--red)}.mode-card{display:grid;gap:6px;text-align:left;min-height:112px;align-content:center}.mode-card strong{font-size:1.1rem}.mode-card span{color:var(--muted);font-size:.9rem;font-weight:500}.code{font-size:clamp(2.6rem,12vw,5rem);letter-spacing:.14em;font-weight:950;text-align:center}.display{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(14px,env(safe-area-inset-top)) 18px max(14px,env(safe-area-inset-bottom));background:#000;overflow:hidden}.display-number{font-family:Digital7,monospace;font-weight:400;font-style:normal;font-size:min(70vh,72vw);line-height:.78;letter-spacing:.015em;font-variant-numeric:tabular-nums;color:var(--green);user-select:none;-webkit-user-select:none}.display-number.red{color:var(--red)}.display-meta{position:absolute;top:max(10px,env(safe-area-inset-top));left:18px;right:18px;display:flex;justify-content:space-between;align-items:center;color:#8f9aa5;font-size:.8rem}.sound-gate{position:absolute;inset:auto 18px max(18px,env(safe-area-inset-bottom)) 18px;display:flex;justify-content:center}.sound-gate .btn{background:#fff;color:#000;min-width:220px}.zero-flash{animation:flash .34s linear 3}@keyframes flash{50%{background:#501010}}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 0}.switch-row input{width:22px;height:22px}.divider{height:1px;background:var(--line);margin:4px 0}.notice{border:1px solid #62400e;background:#251a0a;color:#ffd79b;padding:12px 14px;border-radius:14px}@media(max-width:520px){.grid-4{grid-template-columns:repeat(2,1fr)}.shell{padding-left:12px;padding-right:12px}}.single-device{width:100%;min-height:100dvh;display:grid;grid-template-columns:minmax(0,3fr) minmax(300px,1fr);background:#000}.single-clock-area{min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:18px}.single-clock{width:100%;padding:0;font-family:Digital7,monospace;font-size:min(72vw,88vh);line-height:.76;letter-spacing:.01em;text-align:center}.single-controls{min-width:0;max-height:100dvh;overflow-y:auto;background:#0a0f15;border-left:1px solid var(--line);padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}.single-brand{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 4px 6px}.single-controls .panel{border-radius:16px;padding:12px}.single-controls .stack{gap:9px}.single-controls .btn{min-height:46px;padding:8px 10px}.single-controls .btn-reset{min-height:66px;font-size:1.25rem}.single-controls .input{min-height:46px;font-size:1rem}.single-controls .grid-2{gap:8px}.single-controls .grid-4{gap:7px}.single-settings{margin-bottom:4px}@media(max-width:800px),(orientation:portrait){.single-device{display:block;min-height:100%;background:#05080d}.single-clock-area{min-height:42vh;padding:18px 12px 8px;background:#000}.single-clock{font-size:min(65vw,38vh)}.single-controls{max-height:none;overflow:visible;border-left:0;border-top:1px solid var(--line);padding:12px}}.single-header-actions,.display-meta-actions{display:flex;align-items:center;gap:12px}.btn-back{border:1px solid var(--line);background:#111b25;color:#fff;min-height:38px;padding:7px 12px;border-radius:10px;font-size:.82rem;font-weight:800;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-back:hover{filter:brightness(1.12)}.btn-back:active{transform:translateY(1px)}@media(max-width:520px){.single-header-actions,.display-meta-actions{gap:7px}.btn-back{min-height:36px;padding:6px 9px;font-size:.75rem}}