:root{--navy-950:#050713;--navy-900:#090b17;--navy-850:#10132a;--navy-800:#141834;--navy-700:#1b1f39;--navy-600:#27315b;--navy-500:#3a4480;--navy-dim:#465091;--tab-active:#4a5299;--stroke:#7f8fd6;--stroke-hi:#8097fc;--stroke-soft:#7f8fd673;--text:#fff;--text-1:#d9ddf1;--text-2:#aeb6ff;--text-3:#7f8fd6;--yellow:#ffe346;--yellow-stroke:#ffce2d;--olive:#4a4425;--olive-hi:#6b5e2a;--cyan:#1cc0f2;--cyan-2:#00abfe;--blue:#5794f7;--cyan-12:#1cc0f21f;--cyan-25:#1cc0f240;--cyan-glow:#1cc0f28c;--red:#f43;--red-2:#f04;--red-12:#ff00441f;--font-display:"Akshar", "Arial Narrow", system-ui, sans-serif;--font-label:"Jura", "Trebuchet MS", system-ui, sans-serif;--screen-bg:var(--navy-900);--size:5;--chrome-h:360px;--cell-w:min(3.6rem, calc((100vw - 64px) / var(--size)));--cell-h:max(26px, min(var(--cell-w), calc((100dvh - var(--chrome-h)) / var(--size))));--gap:8px;--slot:34px;--duration-fast:.12s;--ease:cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body{height:100%;color:var(--text-1);font-family:var(--font-display);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;background:var(--screen-bg);margin:0;font-weight:600;overflow:hidden}button{font:inherit;color:inherit}.hud-panel{--bw:1.5px;--cut-t:12px;--cut-b:8px;--notch:0px;--notch-h:16px;--tab:0px;--tab-i:18%;--t:var(--cut-t);--b:var(--cut-b);--n:var(--notch);--d:var(--tab);--i:var(--tab-i);isolation:isolate;background:linear-gradient(180deg, var(--stroke-hi), var(--stroke) 55%, #5c679d);position:relative}.hud-panel:before{--t:calc(var(--cut-t) - var(--bw) * .6);--b:calc(var(--cut-b) - var(--bw) * .6);--i:calc(var(--tab-i) - var(--bw) * .4);content:"";inset:var(--bw);z-index:-1;background:radial-gradient(ellipse 80% 60% at 50% 0%, #8097fc24, transparent 70%), linear-gradient(180deg, var(--navy-600), var(--navy-700) 50%, #1d2244);position:absolute}.hud-panel,.hud-panel:before{clip-path:polygon(var(--t) 0, calc(100% - var(--t)) 0, 100% var(--t), 100% calc(50% - var(--notch-h)), calc(100% - var(--n)) calc(50% - var(--notch-h) + var(--n)), calc(100% - var(--n)) calc(50% + var(--notch-h) - var(--n)), 100% calc(50% + var(--notch-h)), 100% calc(100% - var(--d) - var(--b)), calc(100% - var(--b)) calc(100% - var(--d)), calc(100% - var(--i)) calc(100% - var(--d)), calc(100% - var(--i) - var(--d)) 100%, calc(var(--i) + var(--d)) 100%, var(--i) calc(100% - var(--d)), var(--b) calc(100% - var(--d)), 0 calc(100% - var(--d) - var(--b)), 0 calc(50% + var(--notch-h)), var(--n) calc(50% + var(--notch-h) - var(--n)), var(--n) calc(50% - var(--notch-h) + var(--n)), 0 calc(50% - var(--notch-h)), 0 var(--t))}.slot:after,.cell:after{content:"";pointer-events:none;background:linear-gradient(var(--bk) 0 0) top left / var(--bk-len) var(--bk-w), linear-gradient(var(--bk) 0 0) top left / var(--bk-w) var(--bk-len), linear-gradient(var(--bk) 0 0) top right / var(--bk-len) var(--bk-w), linear-gradient(var(--bk) 0 0) top right / var(--bk-w) var(--bk-len), linear-gradient(var(--bk) 0 0) bottom left / var(--bk-len) var(--bk-w), linear-gradient(var(--bk) 0 0) bottom left / var(--bk-w) var(--bk-len), linear-gradient(var(--bk) 0 0) bottom right / var(--bk-len) var(--bk-w), linear-gradient(var(--bk) 0 0) bottom right / var(--bk-w) var(--bk-len);background-repeat:no-repeat;position:absolute}.frame{z-index:1;background:var(--screen-bg);flex-direction:column;justify-content:center;align-items:center;padding:10px 12px 8px;display:flex;position:fixed;inset:0;overflow:hidden}.breach{width:100%;max-width:var(--column-w,440px);gap:var(--gap);flex-direction:column;flex:0 auto;min-height:0;display:flex;position:relative}.timer{justify-items:center;gap:6px;display:grid}.timer-socket{--hex:18px;background:linear-gradient(180deg, var(--navy-600), var(--navy-800));clip-path:polygon(var(--hex) 0, calc(100% - var(--hex)) 0, 100% 50%, calc(100% - var(--hex)) 100%, var(--hex) 100%, 0 50%);padding:3px 10px}.timer-glow{filter:drop-shadow(0 0 5px #ffce2da6)drop-shadow(0 0 12px #ffaa1e4d)}.timer-pill{--hex:13px;isolation:isolate;background:var(--yellow-stroke);min-width:152px;clip-path:polygon(var(--hex) 0, calc(100% - var(--hex)) 0, 100% 50%, calc(100% - var(--hex)) 100%, var(--hex) 100%, 0 50%);justify-content:center;align-items:baseline;gap:7px;padding:4px 26px 3px;display:flex;position:relative}.timer-pill:before{content:"";z-index:-1;background:linear-gradient(90deg, transparent 62%, #00000029 62%), linear-gradient(180deg, var(--olive-hi), var(--olive) 70%, #3c3720);clip-path:polygon(11.8px 0,calc(100% - 11.8px) 0,100% 50%,calc(100% - 11.8px) 100%,11.8px 100%,0 50%);position:absolute;inset:2px}.timer-label,.timer-value{color:#fff4cf;font-family:var(--font-display);letter-spacing:.02em;text-shadow:0 0 1px #ff7a2b,0 0 6px #ff7828bf;font-weight:600}.timer-label{font-size:1.05rem}.timer-value{text-align:left;font-variant-numeric:tabular-nums;min-width:3.1em;font-size:1.3rem;line-height:1.15}.timer-bar{background:#7f8fd62e;width:min(78%,320px);height:3px;overflow:hidden}.timer-bar i{background:linear-gradient(90deg, var(--yellow-stroke), var(--yellow));transform-origin:0;height:100%;display:block;box-shadow:0 0 6px #ffe346cc}.is-low-time .timer-pill{background:var(--red)}.is-low-time .timer-pill:before{background:linear-gradient(#5c1f22,#3a1418)}.is-low-time .timer-glow{filter:drop-shadow(0 0 6px #ff4433bf)}.is-low-time .timer-bar i{background:var(--red);box-shadow:0 0 6px #f43c}.buffer-wrap{justify-content:center;align-items:center;gap:10px;display:flex}.buffer-label,.panel-head{font-family:var(--font-label);letter-spacing:.14em;color:var(--text-3);font-weight:700}.buffer-label{writing-mode:vertical-rl;font-size:.6rem;transform:rotate(180deg)}.buffer{gap:5px;min-width:0;display:flex}.slot{--bk:#ffffff8c;--bk-len:7px;--bk-w:2px;width:var(--slot);min-width:24px;height:var(--slot);font-family:var(--font-display);color:var(--text);background:linear-gradient(#2b3366,#20264f);border:1px solid #7f8fd666;flex:0 auto;place-items:center;font-size:1rem;font-weight:600;display:grid;position:relative}.slot:after{inset:-2px}.slot.is-next{--bk:#fff;border-color:var(--stroke)}.slot.is-filled{--bk:var(--cyan);text-shadow:0 0 6px var(--cyan-glow);background:linear-gradient(#1cc0f247,#00abfe1f),#1d2a5a;border-color:#1cc0f2b3;box-shadow:0 0 10px #1cc0f259,inset 0 0 8px #1cc0f240}.slot.is-ghost{--bk:var(--cyan);border:1px dashed var(--cyan);color:#1cc0f2a6;animation:1.1s ease-in-out infinite alternate ghost-pulse}@keyframes ghost-pulse{to{color:#82e1ff}}.panels{gap:var(--gap);flex-direction:column;flex:auto;min-height:0;display:flex}.panel-head{justify-content:center;align-items:center;gap:8px;margin:0;font-size:.66rem;line-height:1.2;display:flex}.panel-head:before,.panel-head:after{content:"";background:linear-gradient(90deg, transparent, var(--stroke-soft));flex:0 26px;height:1px}.panel-head:after{transform:scaleX(-1)}.matrix-panel{--cut-t:16px;--cut-b:8px;--notch:9px;--notch-h:22px;flex-direction:column;flex:0 auto;gap:4px;min-height:0;padding:7px 12px 10px;display:flex}.grid{grid-template-rows:repeat(var(--size), minmax(0, var(--cell-h)));clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);background:linear-gradient(#090b176b,#090b1738);flex:0 auto;justify-content:center;align-self:center;min-height:0;padding:5px;display:grid;box-shadow:inset 0 0 0 1px #7f8fd629}.grid-row{grid-template-columns:repeat(var(--size), var(--cell-w));min-height:0;display:grid}.cell{--bk:var(--cyan);--bk-len:8px;--bk-w:2px;min-height:0;color:var(--text);font-family:var(--font-display);font-weight:600;font-size:clamp(16px, calc(var(--cell-h) * .44), 26px);letter-spacing:.02em;cursor:default;transition:background-color var(--duration-fast) var(--ease), color var(--duration-fast) var(--ease), text-shadow var(--duration-fast) var(--ease);touch-action:manipulation;background:0 0;border:none;margin:0;padding:0;line-height:1;position:relative}.cell:after{opacity:0;transition:opacity var(--duration-fast) var(--ease);inset:4px}.cell.is-line{background:linear-gradient(#8097fc33,#8097fc1f)}.grid[data-axis=row] .cell.is-line{box-shadow:inset 0 1.5px 0 var(--stroke-hi), inset 0 -1.5px 0 var(--stroke-hi)}.grid[data-axis=col] .cell.is-line{box-shadow:inset 1.5px 0 0 var(--stroke-hi), inset -1.5px 0 0 var(--stroke-hi)}.cell.is-dim{color:var(--navy-dim)}.cell.is-preview-line.is-dim{color:#9fdcf5;text-shadow:0 0 8px #1cc0f273;background:#1cc0f217}.grid[data-preview-axis=row] .cell.is-preview-line.is-dim{box-shadow:inset 0 1px #1cc0f299,inset 0 -1px #1cc0f299}.grid[data-preview-axis=col] .cell.is-preview-line.is-dim{box-shadow:inset 1px 0 #1cc0f299,inset -1px 0 #1cc0f299}.cell.is-used{color:#5d68ab;letter-spacing:.08em;font-weight:500}.cell.is-last-pick{color:var(--cyan);text-shadow:0 0 8px var(--cyan-glow)}.cell.is-last-pick:after{opacity:1}.cell.is-selectable{cursor:pointer}.cell.is-preview,.cell.is-selectable:focus-visible{color:#bff0ff;text-shadow:0 0 10px var(--cyan-glow);background:radial-gradient(circle,#1cc0f252,#1cc0f21f 70%);outline:none}.cell.is-preview:after,.cell.is-selectable:focus-visible:after{opacity:1}.cell.is-selectable:active{background:#1cc0f259}.seq-panel{--cut-t:8px;--cut-b:8px;--tab:9px;--tab-i:22%;flex:none;padding:7px 10px 16px}.seqs{gap:5px;margin:5px 0 0;padding:0;list-style:none;display:grid}.seq{transition:background-color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);background:#090b1759;border:1px solid #7f8fd638;border-left:2px solid #7f8fd659;padding:5px 8px 4px;position:relative}.seq.is-progress,.seq[data-preview=advance],.seq[data-preview=install]{border-left-color:var(--cyan);background:linear-gradient(90deg,#1cc0f224,#090b1759 70%)}.seq--installed{border-color:var(--cyan);background:linear-gradient(90deg,#1cc0f23d,#00abfe14);box-shadow:0 0 12px #1cc0f259,inset 0 0 12px #1cc0f226}.seq--failed{background:var(--red-12);border:1px dashed #ff0044bf}.seq--unreachable{filter:grayscale();opacity:.5;border-color:#7f8fd62e}.seq-codes{flex-wrap:wrap;gap:4px;margin-bottom:3px;display:flex}.token{text-align:center;min-width:2rem;font-family:var(--font-display);color:var(--text-1);background:var(--navy-800);border:1px solid var(--navy-500);clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);cursor:pointer;-webkit-user-select:none;user-select:none;padding:1px 4px 0;font-size:1.1rem;font-weight:600;line-height:1.3}.token.is-next{color:var(--text);border-color:var(--stroke-hi);background:var(--navy-600)}.token.is-matched{color:var(--text);border-color:var(--cyan);background:linear-gradient(#1cc0f28c,#00abfe4d)}.seq--installed .token{color:var(--navy-950);background:linear-gradient(180deg, #6fdcff, var(--cyan));border-color:#a6ebff}.seq--failed .token{color:#ff7882bf;background:#ff004414;border-color:#f436}.token.is-preview-match{color:#bff0ff;background:var(--cyan-25);border:1px dashed var(--cyan)}.token.is-preview-hit{box-shadow:inset 0 0 6px var(--cyan-glow);border-style:solid}.seq[data-preview=break] .token.is-matched:not(.is-preview-match){border-color:var(--red);color:var(--red);background:#ff44331f;text-decoration:line-through}.seq-meta{font-family:var(--font-label);letter-spacing:.06em;color:var(--text-2);align-items:center;gap:6px;font-size:.68rem;font-weight:700;line-height:1.3;display:flex}.seq-icon{border:1.5px solid var(--yellow);border-radius:50%;flex:none;width:11px;height:11px;position:relative;box-shadow:0 0 5px #ffe34680}.seq-icon:after{content:"";border-left:1.5px solid var(--yellow);border-bottom:1.5px solid var(--yellow);width:2.5px;height:3.5px;position:absolute;top:1px;left:3px}.badge{--hex:6px;font-family:var(--font-display);letter-spacing:.08em;clip-path:polygon(var(--hex) 0, calc(100% - var(--hex)) 0, 100% 50%, calc(100% - var(--hex)) 100%, var(--hex) 100%, 0 50%);margin-left:auto;padding:1px 10px 0;font-size:.72rem;font-weight:600}.badge--installed{background:var(--cyan);color:var(--navy-950)}.badge--failed{background:var(--red-2);color:var(--text)}.btn{min-height:40px;font-family:var(--font-display);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);justify-content:center;align-items:center;gap:8px;padding:4px 14px;font-size:1.05rem;font-weight:600;display:inline-flex;position:relative}.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.btn--speed{background:linear-gradient(180deg, var(--olive-hi), var(--olive));border:1.5px solid var(--yellow-stroke);width:100%;min-height:52px;color:var(--yellow);letter-spacing:.03em;text-shadow:0 0 8px #ffe34659;font-size:1.7rem;box-shadow:0 0 10px #ffce2d8c,inset 0 0 14px #ffe3461f}.btn--speed:hover{background:linear-gradient(#7a6c2f,#574f2a);box-shadow:0 0 16px #ffce2dbf,inset 0 0 14px #ffe3462e}.result{z-index:20;background:var(--screen-bg);place-items:center;padding:14px;display:grid;position:fixed;inset:0;overflow-y:auto}.result[hidden]{display:none}.result-card{--accent:var(--cyan);--accent-glow:var(--cyan-glow);width:min(380px,100%);animation:result-in .26s var(--ease);flex-direction:column;align-items:center;display:flex}.result[data-success=false] .result-card{--accent:var(--red-2);--accent-glow:#f049}.result-top{--cut-t:22px;--cut-b:6px;--notch:16px;--notch-h:26px;justify-items:center;width:100%;padding:10px 26px 26px;display:grid}.result-emblem{width:132px;height:auto;color:var(--accent);filter:drop-shadow(0 0 8px var(--accent-glow))}.result-title{color:var(--text);font-family:var(--font-display);letter-spacing:.02em;text-align:center;margin:2px 0 0;font-size:1.75rem;font-weight:600;line-height:1.1}.result-seam{--hex:16px;z-index:2;background:linear-gradient(180deg, var(--navy-600), var(--navy-850));clip-path:polygon(var(--hex) 0, calc(100% - var(--hex)) 0, 100% 50%, calc(100% - var(--hex)) 100%, var(--hex) 100%, 0 50%);margin:-18px 0 -16px;padding:3px 9px;position:relative}.result-pill{--hex:13px;text-align:center;min-width:170px;font-family:var(--font-display);letter-spacing:.05em;color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent);clip-path:polygon(var(--hex) 0, calc(100% - var(--hex)) 0, 100% 50%, calc(100% - var(--hex)) 100%, var(--hex) 100%, 0 50%);text-shadow:0 0 8px var(--accent-glow);background:linear-gradient(#13284a,#0e1a36);padding:5px 30px 4px;font-size:1.15rem;font-weight:600;display:block}.result-pill:before{content:"COMPLETED"}.result[data-success=false] .result-pill{background:linear-gradient(#3a1027,#220a1a)}.result[data-success=false] .result-pill:before{content:"FAILED"}.result-bottom{--cut-t:6px;--cut-b:6px;--tab:18px;--tab-i:14%;gap:10px;width:100%;padding:26px 20px 30px;display:grid}.result-outcome{text-align:center;color:var(--text-2);font-family:var(--font-display);letter-spacing:.03em;text-transform:uppercase;margin:0;font-size:1.2rem;font-weight:500}.result-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.result-item{background:#090b1766;border:1px solid #7f8fd640;grid-template-columns:1fr auto;align-items:center;gap:1px 10px;padding:6px 10px;display:grid}.result-item--installed{border-color:var(--cyan);box-shadow:inset 0 0 10px #1cc0f22e}.result-item--failed{background:var(--red-12);border:1px dashed #ff0044b3}.result-codes{color:var(--text);font-family:var(--font-display);letter-spacing:.08em;font-size:1.1rem;font-weight:600}.result-label{color:var(--text-2);font-family:var(--font-label);letter-spacing:.06em;grid-column:1;font-size:.66rem;font-weight:700}.result-item .badge{grid-area:1/2/span 2}.result-reason{text-align:center;color:var(--text-3);font-family:var(--font-label);letter-spacing:.08em;text-transform:uppercase;margin:-2px 0 2px;font-size:.72rem;font-weight:700}@keyframes result-in{0%{opacity:0;transform:translateY(10px)scale(.98)}}.debug{z-index:30;font-family:var(--font-label);color:#aeb6ff59;pointer-events:none;font-size:9px;line-height:11px;position:fixed;top:0;right:4px}@media (prefers-reduced-motion:reduce){.result-card,.slot.is-ghost{animation:none}.cell,.cell:after,.btn,.seq{transition:none}}@media (width>=700px) and (height>=600px){:root{--column-w:480px;--chrome-h:404px;--cell-w:min(4.9rem, calc((var(--column-w) - 56px) / var(--size)));--cell-h:max(28px, min(calc(var(--cell-w) * .9), calc((100dvh - var(--chrome-h)) / var(--size))));--gap:10px;--slot:42px}.frame{padding:14px 24px 10px}.timer-pill{min-width:200px;padding:6px 34px 5px}.timer-label{font-size:1.3rem}.timer-value{font-size:1.6rem}.slot{font-size:1.2rem}.matrix-panel{--cut-t:22px;--notch:10px;--notch-h:34px;gap:6px;padding:10px 22px 14px}.seq-panel{--tab:12px;padding:10px 16px 22px}.panel-head{font-size:.75rem}.seqs{gap:8px;margin-top:8px}.seq{padding:7px 12px 6px}.token{min-width:2.4rem;font-size:1.3rem}.seq-meta{font-size:.78rem}.result-card{width:440px}.result-emblem{width:170px}.result-title{font-size:2.2rem}}