*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{font-family:Segoe UI,system-ui,sans-serif;background:radial-gradient(ellipse at 20% 20%,rgba(255,0,255,.18) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(57,255,20,.15) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(0,255,255,.08) 0%,transparent 60%),#0a0014;color:#e8ffe8}#app{width:100vw;height:100vh;overflow:hidden;display:flex;flex-direction:column;position:relative}.layout{flex:1;min-height:0;width:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,min(32vw,440px)) minmax(0,1fr);gap:clamp(6px,.8vw,12px);padding:clamp(4px,.6vh,8px);align-items:stretch}.layout--attract{grid-template-columns:minmax(0,1fr) minmax(200px,min(28vw,380px)) minmax(0,1fr)}.layout--attract .player-sidebar,.layout--attract .timer,.layout--attract .rounds-table-wrap{display:none}.layout--attract .player-frame{background:transparent}.layout--attract .center-panel{gap:clamp(12px,2.2vh,24px)}.player-panel{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;height:100%}.player-panel--left,.player-panel--right{justify-content:center}.player-frame{display:flex;flex-direction:row;align-items:stretch;max-height:100%;background:transparent;overflow:hidden}.player-sidebar{width:clamp(132px,14vw,210px);flex-shrink:0;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(10px,1.4vh,16px);padding:clamp(10px,1.2vh,14px);background:#00000059}.player-frame--p1 .player-sidebar{border-left:1px solid rgba(57,255,20,.25)}.player-frame--p2 .player-sidebar{border-right:1px solid rgba(255,0,255,.25)}.panel-header,.panel-footer{display:none}.hud-stats{display:flex;flex-direction:column;gap:clamp(6px,.9vh,10px);flex-shrink:0}.hud-stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:clamp(6px,.9vh,10px) clamp(8px,1vw,12px);background:#0000008c;border:1px solid rgba(255,255,255,.14);border-radius:6px;text-align:center}.player-frame--p1 .hud-stat{box-shadow:inset 0 0 16px #39ff140f}.player-frame--p2 .hud-stat{box-shadow:inset 0 0 16px #ff00ff0f}.hud-stat--score{border-color:#ffff0059;background:#ffff000f}.hud-stat--garbage{border-color:#ff660059;background:#ff66000f}.hud-stat__label{font-size:clamp(9px,1.2vh,11px);font-weight:700;letter-spacing:.02em;opacity:.65}.hud-stat__value{font-size:clamp(20px,3.2vh,32px);font-weight:900;font-variant-numeric:tabular-nums;line-height:1;color:#ff0;text-shadow:0 0 10px rgba(255,255,0,.55),0 0 20px rgba(255,255,0,.25)}.hud-stat--score .hud-stat__value{font-size:clamp(22px,3.6vh,36px)}.hud-next{display:flex;flex-direction:column;align-items:center;gap:clamp(6px,.8vh,10px);flex-shrink:0}.hud-next__label{font-size:clamp(10px,1.4vh,13px);font-weight:800;letter-spacing:.02em;text-align:center;opacity:.75}.hud-next canvas{display:block;flex-shrink:0}.panel-title{font-size:clamp(10px,1.4vh,13px);font-weight:800;letter-spacing:.02em;text-shadow:0 0 12px currentColor;white-space:nowrap;text-align:center;flex-shrink:0;opacity:.9}.panel-title--p1{color:#39ff14}.panel-title--p2{color:#f0f}.board-wrap{flex:0 0 auto;line-height:0}.board-wrap canvas{display:block;vertical-align:top}.center-panel{--center-fs-xs: clamp(11px, 1.55vmin, 14px);--center-fs-sm: clamp(13px, 1.9vmin, 17px);--center-fs-md: clamp(14px, 2.35vmin, 20px);--center-fs-lg: clamp(18px, 3.2vmin, 30px);--center-fs-xl: clamp(30px, 6.5vmin, 56px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,2vh,22px);text-align:center;min-height:0;width:100%;max-width:100%;padding:clamp(8px,1.5vh,16px) clamp(6px,1vw,12px);overflow-y:auto;overflow-x:hidden}.logo{font-size:var(--center-fs-lg);font-weight:900;letter-spacing:.02em;background:linear-gradient(90deg,#39ff14,#0ff,#f0f,#ff0);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 4s linear infinite;filter:drop-shadow(0 0 12px rgba(255,0,255,.5))}@keyframes shimmer{to{background-position:200% center}}.timer{font-size:var(--center-fs-xl);font-weight:900;font-variant-numeric:tabular-nums;color:#0ff;text-shadow:0 0 16px #00ffff,0 0 32px #00ffff66;line-height:1}.rounds-table-wrap{width:100%;max-width:min(100%,420px)}.rounds-table-caption{font-size:var(--center-fs-sm);opacity:.75;margin-bottom:clamp(6px,1vh,10px);text-align:center}.rounds-table{width:100%;border-collapse:collapse;font-size:var(--center-fs-xs);font-variant-numeric:tabular-nums}.rounds-table th,.rounds-table td{padding:clamp(4px,.75vh,8px) clamp(5px,.9vw,10px);text-align:center;border:1px solid rgba(255,255,255,.1);white-space:nowrap}.rounds-table th{font-weight:700;opacity:.7;background:#00000059}.rounds-table__row--done{background:#ffffff0a}.rounds-table__row--current{background:#ffff001a;box-shadow:inset 0 0 12px #ffff001f}.rounds-table__row--current td:nth-child(2){color:#ff0;font-weight:700;text-shadow:0 0 8px rgba(255,255,0,.45)}.rounds-table__row--upcoming{opacity:.45}.rounds-table__row--skipped{opacity:.3}.rounds-table__winner--p1{color:#39ff14;font-weight:700}.rounds-table__winner--p2{color:#f0f;font-weight:700}.message{font-size:var(--center-fs-sm);padding:clamp(8px,1.2vh,12px) clamp(10px,1.4vw,14px);background:#ffff0014;border:1px solid rgba(255,255,0,.35);border-radius:6px;color:#ff8;max-width:100%;word-break:break-word}.mode-select{display:flex;gap:clamp(8px,1.2vw,12px);flex-wrap:wrap;justify-content:center;width:100%;max-width:min(100%,420px)}.mode-btn{padding:clamp(8px,1.2vh,12px) clamp(12px,1.8vw,20px);font:inherit;font-size:var(--center-fs-sm);font-weight:700;letter-spacing:.02em;color:#e8ffe8;background:#00000073;border:1px solid rgba(255,255,255,.2);border-radius:6px;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}.mode-btn:hover:not(:disabled){border-color:#00ffff80;box-shadow:0 0 12px #0ff3}.mode-btn--active{color:#ff8;background:#ffff001a;border-color:#ffff0073;box-shadow:0 0 14px #ffff0026}.mode-btn:disabled{opacity:.45;cursor:not-allowed}.difficulty-select{display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.2vh,12px);width:100%;max-width:min(100%,420px)}.difficulty-select[hidden]{display:none}.difficulty-select__label{font-size:var(--center-fs-sm);font-weight:700;letter-spacing:.02em;opacity:.65}.difficulty-select__buttons{display:flex;gap:clamp(4px,.6vw,8px);flex-wrap:wrap;justify-content:center}.difficulty-btn{padding:clamp(7px,1vh,10px) clamp(10px,1.4vw,16px);font:inherit;font-size:var(--center-fs-xs);font-weight:700;color:#e8ffe8;background:#00000073;border:1px solid rgba(255,0,255,.25);border-radius:6px;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}.difficulty-btn:hover:not(:disabled){border-color:#ff00ff8c;box-shadow:0 0 10px #f0f3}.difficulty-btn--active{color:#f8f;background:#ff00ff1f;border-color:#ff00ff8c;box-shadow:0 0 12px #f0f3}.difficulty-btn:disabled{opacity:.45;cursor:not-allowed}.player-panel--cpu .panel-title--p1{font-size:clamp(9px,1.25vh,12px)}.garbage-badge{color:#f83;text-shadow:0 0 10px rgba(255,102,0,.65),0 0 20px rgba(255,102,0,.3)}.victory-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 30%,rgba(255,0,255,.22) 0%,transparent 55%),radial-gradient(ellipse at 70% 70%,rgba(57,255,20,.18) 0%,transparent 55%),#05000cf5}.victory-screen[hidden]{display:none}.victory-layout{width:100%;height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-items:center;gap:clamp(12px,2vw,32px);padding:clamp(12px,2vh,24px)}.victory-frame{display:flex;align-items:center;justify-content:center;max-height:100%;background:transparent;opacity:.55;transition:opacity .2s}.victory-frame--winner{opacity:1}.victory-frame canvas{display:block}.victory-center{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2vh,20px);text-align:center;min-width:clamp(120px,14vw,200px);padding:0 8px}.victory-title{font-size:clamp(20px,4vh,36px);font-weight:900;letter-spacing:.02em;background:linear-gradient(90deg,#39ff14,#0ff,#f0f);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 16px rgba(255,0,255,.6))}.victory-hint{font-size:clamp(11px,1.6vh,14px);color:#ff8;opacity:.85}.pause-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;display:flex;align-items:center;justify-content:center;background:#05000cb8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.pause-screen[hidden]{display:none}.pause-panel{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.5vh,16px);padding:clamp(20px,3vh,32px) clamp(28px,4vw,48px);background:#0a0014eb;border:2px solid rgba(255,255,0,.4);border-radius:10px;box-shadow:0 0 32px #ffff0026,0 0 48px #ff00ff1f}.pause-title{font-size:clamp(22px,4vh,36px);font-weight:900;letter-spacing:.02em;color:#ff8;text-shadow:0 0 16px rgba(255,255,0,.45)}.pause-hint{font-size:clamp(11px,1.5vh,14px);color:#ff8;opacity:.75}.help-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:clamp(12px,2vh,24px);background:#05000ce0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.help-screen[hidden]{display:none}.help-panel{width:min(760px,94vw);max-height:100%;display:flex;flex-direction:column;gap:12px;padding:clamp(16px,2.5vh,24px);background:#0a0014f2;border:2px solid rgba(0,255,255,.45);border-radius:10px;box-shadow:0 0 32px #ff00ff40,0 0 48px #00ffff26}.help-title{font-size:clamp(18px,3vh,26px);font-weight:900;text-align:center;letter-spacing:.02em;background:linear-gradient(90deg,#39ff14,#0ff,#f0f);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;flex-shrink:0}.help-tabs{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0}.help-tab{flex:1 1 auto;min-width:0;padding:8px 12px;font:inherit;font-size:clamp(11px,1.5vh,13px);font-weight:800;letter-spacing:.01em;color:#8ff;background:#00ffff0f;border:1px solid rgba(0,255,255,.25);border-radius:6px;cursor:pointer;transition:color .15s,background .15s,border-color .15s,box-shadow .15s}.help-tab:hover{color:#ff8;background:#ffff0014;border-color:#ffff0059}.help-tab--active{color:#05000c;background:linear-gradient(135deg,#39ff14,#0ff);border-color:transparent;box-shadow:0 0 16px #39ff1459}.help-tab--active:hover{color:#05000c;background:linear-gradient(135deg,#39ff14,#0ff)}.help-body{overflow-y:auto;flex:1;min-height:0;display:flex;flex-direction:column}.help-tabpanel{display:flex;flex-direction:column;gap:clamp(12px,2vh,18px);padding-right:4px;line-height:1.5;font-size:clamp(12px,1.6vh,14px)}.help-tabpanel[hidden]{display:none}.help-section{display:flex;flex-direction:column;gap:6px}.help-heading{font-size:clamp(13px,1.8vh,16px);font-weight:800;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.5)}.help-section p{opacity:.9}.help-note{opacity:.75;font-size:.92em}.help-list{list-style:none;display:flex;flex-direction:column;gap:4px}.help-list li{display:flex;align-items:center;gap:6px}.help-list kbd,.help-body kbd,.help-tabpanel kbd{display:inline-block;min-width:1.6em;padding:2px 6px;font-family:inherit;font-size:.92em;font-weight:700;text-align:center;color:#ff0;background:#ffff001a;border:1px solid rgba(255,255,0,.35);border-radius:4px;box-shadow:0 0 8px #ffff0026}.help-close{flex-shrink:0;text-align:center;font-size:clamp(11px,1.4vh,13px);color:#ff8;opacity:.75}@media(max-width:700px){.layout{grid-template-columns:1fr;grid-template-rows:auto 1fr 1fr}.center-panel{--center-fs-xs: clamp(10px, 2.8vw, 13px);--center-fs-sm: clamp(12px, 3.2vw, 15px);--center-fs-md: clamp(13px, 3.6vw, 17px);--center-fs-lg: clamp(16px, 4.5vw, 22px);--center-fs-xl: clamp(24px, 7vw, 36px);order:-1;flex-direction:row;flex-wrap:wrap;justify-content:center;align-content:center;gap:clamp(8px,2vw,14px);padding:clamp(8px,1.5vh,12px)}.rounds-table-wrap{width:100%;max-width:100%}.logo{width:100%}.victory-layout{grid-template-columns:1fr;grid-template-rows:1fr auto 1fr}.victory-center{order:-1}}
