:root{--night: #090e17;--night-deep: #05080e;--panel: rgba(16, 24, 38, .82);--panel-deep: rgba(8, 13, 22, .94);--gold: #d4af37;--gold-bright: #f3cf5b;--gold-deep: #8f7422;--ivory: #f5efe0;--ivory-dim: #cdbfa0;--muted: #8a93a6;--line: rgba(212, 175, 55, .2);--line-strong: rgba(212, 175, 55, .42);--live: #7bd6a8;--shadow: 0 14px 34px rgba(0, 0, 0, .5)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{min-height:100%}body{min-height:100vh;color:var(--ivory);font-family:Cormorant Garamond,Georgia,serif;background:radial-gradient(80% 55% at 50% 0%,rgba(212,175,55,.11),transparent 65%),radial-gradient(120% 100% at 50% 0%,#141d2d 0%,#0a101b 55%,var(--night-deep) 100%) fixed;-webkit-font-smoothing:antialiased;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 3px)}#root{position:relative;z-index:1;min-height:100vh}::selection{background:#d4af3747}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:1px solid var(--gold);outline-offset:2px}.popover{min-height:100vh}.gm-shell{min-height:100vh;display:flex;flex-direction:column;gap:12px;padding:16px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{display:flex;align-items:center;gap:9px;min-width:0}.brand-mark{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-strong);color:var(--gold-bright);background:radial-gradient(circle,rgba(212,175,55,.16),transparent 70%);box-shadow:inset 0 0 14px #d4af3714}.brand-mark svg{width:18px;height:18px}.brand-text{min-width:0}.brand-kicker{display:block;font-family:Space Mono,monospace;font-size:6.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);white-space:nowrap}.brand-text h1{margin-top:1px;font-family:Playfair Display,serif;font-weight:700;font-size:16px;line-height:1.1;letter-spacing:.01em;color:var(--ivory);white-space:nowrap}.topbar-meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}.status{display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border-radius:999px;border:1px solid rgba(212,175,55,.16);background:#d4af370a;font-family:Space Mono,monospace;font-size:7px;letter-spacing:.1em;text-transform:uppercase;color:var(--ivory-dim);white-space:nowrap}.status .status-dot{width:5px;height:5px;border-radius:50%;background:var(--muted)}.status.is-running{border-color:#7bd6a842;background:#7bd6a812;color:#a9e9cc}.status.is-running .status-dot{background:var(--live);animation:dot-pulse 2s ease-in-out infinite}.real-clock{font-family:Space Mono,monospace;font-size:7.5px;letter-spacing:.04em;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.real-clock b{margin-left:2px;font-weight:700;color:var(--ivory-dim)}.clock-card{position:relative;flex:none;display:flex;flex-direction:column;align-items:center;padding:20px 16px 14px;border:1px solid var(--line);border-radius:12px;background:radial-gradient(90% 75% at 50% 0%,rgba(212,175,55,.13),transparent 65%),linear-gradient(180deg,rgba(25,35,52,.92),var(--panel-deep));box-shadow:var(--shadow),inset 0 1px #ffffff0a}.clock-kicker{font-family:Space Mono,monospace;font-size:7px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-deep)}.game-clock{margin-top:7px;font-family:Space Mono,monospace;font-size:58px;font-weight:700;line-height:1;letter-spacing:-.05em;color:var(--gold-bright);font-variant-numeric:tabular-nums;text-shadow:0 0 26px rgba(243,207,91,.3),0 0 60px rgba(212,175,55,.12)}.clock-meta{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:7px;font-size:11.5px;color:var(--ivory-dim);letter-spacing:.02em}.clock-meta .dot{color:var(--gold-deep)}.elapsed-pill{display:inline-flex;align-items:baseline;gap:6px;margin-top:13px;padding:4px 12px;border-radius:999px;border:1px solid rgba(123,214,168,.16);background:#7bd6a80f}.elapsed-value{font-family:Space Mono,monospace;font-size:16px;font-weight:700;line-height:1;color:#a9e9cc;font-variant-numeric:tabular-nums}.elapsed-label{font-family:Space Mono,monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.progress{width:100%;margin-top:14px}.progress-track{width:100%;height:4px;border-radius:999px;overflow:hidden;background:#ffffff0f;box-shadow:inset 0 1px 2px #00000073}.progress-fill{height:100%;min-width:0;border-radius:999px;background:linear-gradient(90deg,#9a7b22,var(--gold-bright) 50%,var(--gold));background-size:200% 100%;transition:width .4s ease}.clock-card.is-running .progress-fill{animation:shimmer 3s linear infinite}.progress-caption{display:flex;justify-content:space-between;gap:8px;margin-top:5px;font-family:Space Mono,monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.config-card{flex:none;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:0 10px 24px #00000047,inset 0 1px #ffffff08}.config-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.config-head h2{font-family:Playfair Display,serif;font-weight:600;font-size:13px;letter-spacing:.02em;color:var(--ivory-dim);white-space:nowrap}.ratio{padding:3px 7px;border:1px solid var(--line);border-radius:999px;background:#d4af370d;font-family:Space Mono,monospace;font-size:7px;letter-spacing:.03em;color:var(--gold);white-space:nowrap}.field-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.field-label{font-family:Space Mono,monospace;font-size:7.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);white-space:nowrap}.duration-group{display:flex;gap:6px}.number-box{display:flex;align-items:center;gap:4px;height:31px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:#04080f8c;transition:border-color .15s,box-shadow .15s}.number-box:focus-within{border-color:var(--gold);box-shadow:0 0 0 2px #d4af371a}.number-box input{width:100%;min-width:0;border:0;outline:none;background:transparent;color:var(--ivory);font-family:Space Mono,monospace;font-size:12.5px;text-align:right;font-variant-numeric:tabular-nums;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.number-box input::-webkit-outer-spin-button,.number-box input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-box>span{flex:none;font-family:Space Mono,monospace;font-size:7px;text-transform:uppercase;color:var(--muted)}.duration-group .number-box{width:76px}.number-box.wide{width:100%}.split-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stack-field{display:flex;flex-direction:column;gap:4px}.controls{margin-top:auto;display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;border:0;border-radius:8px;cursor:pointer;font-family:Playfair Display,serif;font-weight:700;font-size:14px;letter-spacing:.02em;transition:filter .15s,transform .1s,background .15s,border-color .15s,color .15s}.btn svg{width:14px;height:14px;flex:none}.btn:active{transform:translateY(1px)}.btn-primary{flex:1;color:#191204;background:linear-gradient(180deg,#f6d873,var(--gold) 55%,#b8912b);box-shadow:0 6px 18px #d4af372e,inset 0 1px #ffffff59}.btn-primary:hover{filter:brightness(1.06)}.btn-primary.is-running-action{color:var(--ivory);border:1px solid var(--line-strong);background:linear-gradient(180deg,#26344b,#16202f);box-shadow:none}.btn-primary.is-running-action:hover{filter:brightness(1.14)}.btn-ghost{flex:0 0 118px;border:1px solid var(--line);background:transparent;color:var(--ivory-dim)}.btn-ghost:hover{border-color:var(--line-strong);background:#d4af370f;color:var(--ivory)}.player-view{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}.player-halo{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(243,207,91,.16) 0%,rgba(243,207,91,.04) 48%,transparent 70%);filter:blur(6px);opacity:.55}.player-view.is-running .player-halo{opacity:.85;animation:breathe 5s ease-in-out infinite}.player-clock{position:relative;font-family:Space Mono,monospace;font-weight:700;font-size:78px;line-height:1;letter-spacing:-.06em;color:var(--gold-bright);font-variant-numeric:tabular-nums;text-shadow:0 0 28px rgba(243,207,91,.3),0 0 60px rgba(212,175,55,.12);transition:opacity .4s}.player-view:not(.is-running) .player-clock{opacity:.72}.loading-view{min-height:100vh;display:grid;place-items:center;color:var(--gold-bright)}.loading-icon{width:38px;height:38px;opacity:.9;animation:loading-pulse 1.6s ease-in-out infinite;filter:drop-shadow(0 0 12px rgba(243,207,91,.35))}.alert-container{position:fixed;right:14px;bottom:14px;z-index:50;display:flex;flex-direction:column;gap:8px;pointer-events:none}.alert-card{position:relative;display:flex;align-items:center;gap:10px;width:236px;padding:11px 26px 11px 12px;border:1px solid rgba(212,175,55,.45);border-radius:10px;background:linear-gradient(160deg,#1a2435,#0a101a);box-shadow:0 12px 30px #0000008c,inset 0 1px #ffffff0d;pointer-events:auto;animation:alert-in .35s ease-out;overflow:hidden}.alert-card:before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:linear-gradient(180deg,var(--gold-bright),var(--gold-deep))}.alert-card.leaving{animation:alert-out .3s ease-in forwards}.alert-icon{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:#d4af3712;color:var(--gold-bright)}.alert-icon svg{width:16px;height:16px}.alert-copy{min-width:0}.alert-title{font-family:Playfair Display,serif;font-weight:700;font-size:12.5px;line-height:1.15;color:var(--ivory)}.alert-clock{margin-top:1px;font-family:Space Mono,monospace;font-size:22px;font-weight:700;line-height:1.1;letter-spacing:-.03em;color:var(--gold-bright);font-variant-numeric:tabular-nums}.alert-close{position:absolute;top:4px;right:5px;width:17px;height:17px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:15px;line-height:1;cursor:pointer}.alert-close:hover{background:#ffffff0f;color:var(--ivory)}@keyframes dot-pulse{0%,to{box-shadow:0 0 #7bd6a873}50%{box-shadow:0 0 0 4px #7bd6a800}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes breathe{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.06);opacity:.95}}@keyframes loading-pulse{0%,to{opacity:.45;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}@keyframes alert-in{0%{transform:translate(120%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes alert-out{0%{transform:translate(0);opacity:1}to{transform:translate(120%);opacity:0}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}