:root{font-family:Inter,Segoe UI,sans-serif;color:#e5e5e5;background:#111;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}button,select,input{font:inherit}button{color:inherit}.app-shell{min-height:100%;padding:24px 28px 28px;background:radial-gradient(circle at 50% 48%,rgb(255 255 255 / 4%),transparent 34%),linear-gradient(145deg,#151515,#0d0d0d 72%)}.app-header{height:74px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #303030}.eyebrow{margin:0 0 4px;color:#999;font-family:Cascadia Mono,Consolas,monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase}h1{margin:0;font-size:clamp(18px,2vw,27px);font-weight:500;letter-spacing:-.035em}.quality-control{display:flex;align-items:center;gap:10px;color:#8a8a8a;font-family:Cascadia Mono,Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.header-controls{display:flex;align-items:flex-start;gap:14px}select,button{border:1px solid #383838;border-radius:7px;background:#1e1e1e;transition:border-color .12s ease,background-color .12s ease,transform .12s ease}select{padding:7px 28px 7px 10px;color:#dedede}button{min-width:0;min-height:34px;padding:7px 10px;cursor:pointer}button:hover{border-color:#686868;background:#292929}button:disabled{cursor:wait;opacity:.55}button:active{transform:translateY(1px)}button:focus-visible,select:focus-visible{outline:2px solid #d4d4d4;outline-offset:2px}.workspace{height:calc(100vh - 126px);display:grid;grid-template-columns:minmax(340px,1fr) minmax(260px,340px);gap:22px;padding-top:22px}.panel{min-width:0;min-height:0;padding:18px;border:1px solid #333;border-radius:12px;background:#181818c2;box-shadow:0 22px 70px #0000002e}.panel-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:16px}.panel-heading span{font-family:Cascadia Mono,Consolas,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase}.panel-heading small,.navigator-wrap p{color:#7f7f7f}.panel-heading small{font-size:10px}.tracking-control{display:grid;gap:6px;margin-bottom:18px;color:#8a8a8a;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase}.tracking-control select{width:100%}.preset-tools{display:flex;gap:5px;margin:-11px 0 16px}.preset-tools button{min-height:27px;padding:4px 7px;color:#999;font-size:8px}.preset-dialog{width:min(620px,calc(100vw - 32px));padding:0;border:1px solid #444;border-radius:12px;color:#e5e5e5;background:#1c1c1c;box-shadow:0 28px 90px #0009}.preset-dialog::backdrop{background:#000000b8}.preset-dialog form{display:grid;gap:15px;padding:20px}.preset-dialog label,.preset-dialog legend{color:#999;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.preset-dialog form>label{display:grid;gap:6px}.preset-dialog input[type=text],.preset-dialog form>label input{min-height:35px;padding:7px 10px;border:1px solid #383838;border-radius:7px;color:#e5e5e5;background:#171717}.dialog-heading,.dialog-options{display:flex;justify-content:space-between;gap:12px}.dialog-heading strong{font-size:16px;font-weight:500}.dialog-heading button{min-height:28px;padding:4px 8px;font-size:9px}.dialog-options label{flex:1;display:grid;gap:6px}.preset-dialog fieldset{margin:0;padding:12px;border:1px solid #373737;border-radius:8px}.piece-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:9px}.piece-picker label{min-height:29px;display:grid;place-items:center;border:1px solid #373737;border-radius:5px;cursor:pointer}.piece-picker label.selected{color:#e8e8e8;border-color:#777;background:#353535}.piece-picker input{position:absolute;opacity:0;pointer-events:none}.dialog-error{min-height:14px;margin:0;color:#dd8484;font-size:10px}.dialog-save{justify-self:end}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.preset-grid button{color:#b8b8b8;font-size:12px}.navigator-wrap{height:calc(100% - 205px);min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:13px}.navigator-wrap p{margin:0;text-align:center;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;line-height:1.6;text-transform:uppercase}.view-navigator{position:relative;width:min(150px,80%);aspect-ratio:1;border:1px solid #484848;border-radius:50%;background:radial-gradient(circle,#282828 0 30%,#181818 31% 100%);touch-action:none;cursor:grab}.view-navigator:active{cursor:grabbing}.navigator-ring{position:absolute;inset:10px;border:1px dashed #505050;border-radius:50%}.navigator-cross{position:absolute;inset:50% auto auto 50%;background:#484848;transform:translate(-50%,-50%)}.navigator-cross-x{width:44%;height:1px}.navigator-cross-y{width:1px;height:44%}.navigator-knob{position:absolute;inset:50% auto auto 50%;width:28%;aspect-ratio:1;border:1px solid #686868;border-radius:50%;background:#333;transform:translate(-50%,-50%);box-shadow:0 4px 18px #00000059}.cube-stage{position:relative;min-width:0;min-height:0;border:1px solid #303030;border-radius:14px;background:linear-gradient(#303030 1px,transparent 1px),linear-gradient(90deg,#303030 1px,transparent 1px),radial-gradient(circle,#202020,#151515 65%);background-size:36px 36px,36px 36px,auto;overflow:hidden}.cube-stage:after{content:"";position:absolute;inset:15px;border:1px solid rgb(255 255 255 / 10%);border-radius:9px;pointer-events:none}.cube-view,.cube-canvas{width:100%;height:100%}.cube-view{position:absolute;inset:0;touch-action:none;-webkit-user-select:none;user-select:none}.scramble-bar{position:absolute;z-index:2;top:22px;left:50%;width:min(720px,calc(100% - 48px));display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 10px 9px 14px;border:1px solid #383838;border-radius:9px;background:#141414e0;transform:translate(-50%)}.scramble-bar code{min-width:0;color:#d3d3d3;font-family:Cascadia Mono,Consolas,monospace;font-size:10px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scramble-actions{flex:0 0 auto;display:flex;gap:5px}.scramble-actions button{min-height:28px;padding:5px 8px;font-size:9px}.scramble-actions .clear-button{color:#a78389;border-color:#3d2d33;background:#171116}.cube-canvas{display:block}.stage-status{position:absolute;left:50%;bottom:24px;display:flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid #383838;border-radius:999px;color:#a0a0a0;background:#141414db;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.04em;transform:translate(-50%);pointer-events:none}.timer-display{position:absolute;z-index:2;top:92px;left:50%;display:grid;justify-items:center;color:#e2e2e2;transform:translate(-50%);pointer-events:none}.timer-display strong{font-family:Cascadia Mono,Consolas,monospace;font-size:clamp(26px,5vw,54px);font-weight:400;letter-spacing:-.06em;text-shadow:0 5px 28px #050505}.timer-display span{color:#888;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.timer-eight strong,.timer-twelve strong{color:#f2bd6b}.timer-plus2 strong,.timer-dnf strong{color:#ed7b7b}.status-dot{width:6px;height:6px;border-radius:50%;background:#ed7b7b;box-shadow:0 0 9px #ed7b7b}.control-panel{overflow:auto}@media(max-width:860px){.app-shell{padding:16px;overflow:auto}.app-header{height:66px}.workspace{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:min(68vw,520px) auto;gap:12px;padding-top:14px}.cube-stage{grid-column:1 / -1;grid-row:1}.control-panel{grid-column:1 / -1;grid-row:2}.navigator-wrap{height:220px;min-height:0}}@media(max-width:540px){h1{max-width:220px;font-size:16px}.quality-control{align-items:flex-end;flex-direction:column;gap:3px}.header-controls{gap:5px}.header-controls>.quality-control:nth-child(2){display:none}.workspace{grid-template-rows:min(82vw,420px) auto}.panel{padding:12px}.preset-grid{grid-template-columns:repeat(2,1fr)}.navigator-wrap{height:180px}.scramble-bar{top:10px;width:calc(100% - 20px);align-items:stretch;flex-direction:column;gap:7px}.scramble-actions{display:grid;grid-template-columns:1.4fr 1fr 1fr}}.brand-controls{position:relative;display:flex;align-items:center;gap:8px}.menu-button{width:32px;height:32px;display:grid;align-content:center;gap:3px;padding:7px}.menu-button>span{width:100%;height:1px;display:block;background:#ffffff9e}.app-menu{position:absolute;z-index:6;top:40px;left:0;width:248px;display:grid;gap:8px;padding:8px;border:1px solid rgb(255 255 255 / 12%);border-radius:8px;background:#202020;box-shadow:0 16px 40px #0000005c}.menu-section-label{padding:4px 6px;color:#777;font-family:Cascadia Mono,Consolas,monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.menu-section>button{min-height:48px;display:grid;justify-items:start;gap:2px;text-align:left}.menu-section>button.active{border-color:#ffffff3d;background:#303030}.menu-section>button:disabled{cursor:not-allowed}.menu-section>button small{color:#777;font-size:8px}.scramble-bar{width:100%;min-height:64px;display:grid;grid-template-columns:32px minmax(0,1fr) 32px;align-items:center;gap:8px;padding:8px}.scramble-lines{display:grid;justify-items:center;gap:4px;overflow:visible;text-align:center;text-overflow:clip;white-space:normal}.scramble-lines span{display:block}.scramble-nav{width:32px;height:32px;min-height:32px;padding:0;color:#ffffff8f;border-color:transparent;background:transparent;font-size:9px}.scramble-nav:disabled{opacity:.2}@media(max-width:540px){.workspace{width:100%;grid-template-columns:minmax(0,1fr)}.scramble-bar{min-height:72px;grid-template-columns:28px minmax(0,1fr) 28px;gap:4px;padding:8px 4px}.scramble-lines{gap:3px;font-size:8px;line-height:1.4}.scramble-nav{width:28px;height:28px;min-height:28px}}.perf-overlay{position:absolute;z-index:3;top:22px;right:24px;display:grid;grid-template-columns:auto auto;gap:3px 12px;padding:9px 12px;border:1px solid #383838;border-radius:9px;background:#141414e0;font-family:Cascadia Mono,Consolas,monospace;font-size:10px;letter-spacing:.03em;pointer-events:none}.perf-pip .perf-overlay{position:static;border:none;border-radius:0;padding:12px 14px;font-size:12px}.perf-label{color:#7f7f7f}.perf-value{color:#d4d4d4;text-align:right;font-variant-numeric:tabular-nums}.perf-toggle{align-self:end;padding:6px 11px;font-size:10px;letter-spacing:.06em}.perf-toggle[aria-pressed=true]{border-color:#707070;color:#d4d4d4}:root{color:#e5e5e5;background:#171717}.app-shell{padding:16px;background:#1b1b1b}.app-header{position:relative;z-index:5;height:40px;align-items:center;border-bottom-color:#ffffff14}.eyebrow{margin:0;color:#a3a3a3}.header-controls{position:relative;align-items:center;gap:8px}select,button{border-color:#ffffff1a;border-radius:4px;background:#242424}button{min-height:32px;padding:6px 8px}button:hover{border-color:#ffffff3d;background:#2c2c2c}button:focus-visible,select:focus-visible{outline-color:#d4d4d4}.settings-button{width:32px;height:32px;display:grid;place-items:center;padding:6px}.settings-button svg{width:18px;height:18px;fill:none;stroke:#bdbdbd;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.settings-popover{position:absolute;top:40px;right:0;width:208px;max-height:calc(100dvh - 64px);display:grid;gap:8px;padding:12px;border:1px solid rgb(255 255 255 / 12%);border-radius:8px;background:#202020;box-shadow:0 16px 40px #0000005c;overflow-y:auto}.view-settings{display:grid;gap:8px}.view-settings-stage{display:grid;justify-items:center;gap:8px}.view-preview{position:relative;width:100%;height:116px}.view-settings-actions{display:grid;grid-template-columns:1fr 1fr;gap:4px}.view-settings-actions button{min-height:28px;padding-inline:4px;font-size:11px}.settings-popover .quality-control{display:grid;gap:4px}.settings-popover select,.settings-popover .perf-toggle{width:100%}.workspace{height:calc(100vh - 72px);grid-template-columns:minmax(360px,1fr) minmax(250px,330px);gap:16px;padding-top:16px}.panel{padding:16px;border-color:#ffffff17;border-radius:8px;background:#ffffff08;box-shadow:none}.panel-heading{margin-bottom:16px}.preset-grid{gap:4px}.preset-grid button{min-height:32px}.navigator-wrap{height:auto;min-height:0;justify-content:flex-start;gap:8px;margin-bottom:12px}.view-navigator{width:min(200px,100%);border-color:transparent;background:transparent;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.view-navigator *{pointer-events:none}.navigator-ring{inset:0;border:1px solid rgb(255 255 255 / 20%);background:#1c1c1c}.navigator-ring:after{position:absolute;inset:10%;border:1px dashed rgb(255 255 255 / 18%);border-radius:50%;content:""}.navigator-cross{position:absolute;inset:22%;background:transparent;transform:none}.navigator-track{position:absolute;inset:50% auto auto 50%;border:1px solid rgb(255 255 255 / 10%);border-radius:999px;background:#101010;transform:translate(-50%,-50%)}.navigator-track-x{width:132%;height:8px}.navigator-track-y{width:8px;height:132%}.navigator-knob{position:absolute;border:0;border-radius:999px;background:#767676}.navigator-knob-x{top:50%;left:20%;width:18px;height:12px;transform:translate(-50%,-50%)}.navigator-knob-y{top:50%;left:50%;width:12px;height:18px;transform:translate(-50%,-50%)}.view-face-presets{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}.view-face-presets button{width:100%;min-height:0;aspect-ratio:1;padding:0;font-family:Cascadia Mono,Consolas,monospace;font-size:9px}.view-default{min-height:22px;padding:2px 6px;color:#a3a3a3;font-size:8px}.stage-column{min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px}.stage-column>.cube-stage{grid-column:auto;grid-row:2}.scramble-bar{position:static;width:100%;min-height:48px;padding:8px;border-color:#ffffff17;border-radius:8px;background:#ffffff08;transform:none}.scramble-actions{gap:4px}.scramble-actions button{min-height:32px;padding:6px 8px}.cube-stage{border-color:#ffffff12;border-radius:8px;background:#101010}.cube-stage:after{inset:8px;border-color:#ffffff12;border-radius:4px}.timer-display{top:24px}.stage-status{bottom:16px;border-color:#ffffff17;background:#181818e0}.move-grid{max-width:288px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:4px}.move-row{display:grid;grid-template-columns:repeat(10,minmax(0,1fr))}.move-row>.move-button{grid-column-end:span 2}.move-row-offset>.move-button:first-child{grid-column-start:2}.move-button{width:86%;min-height:0;aspect-ratio:1;display:grid;place-items:center;padding:0;font-family:Cascadia Mono,Consolas,monospace;font-size:13px}.move-button-lead{justify-self:end;margin-right:1px}.move-button-trail{justify-self:start;margin-left:1px}.move-button-solo{justify-self:center}.move-extras{max-width:288px;margin-inline:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:12px;row-gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid rgb(255 255 255 / 9%)}.move-extra-pair{display:grid;grid-template-columns:1fr 1fr;gap:2px}.move-extras .move-button{width:100%;margin-inline:0;aspect-ratio:auto;min-height:32px;font-size:11px}@media(max-width:860px){.app-shell{height:100dvh;min-height:100dvh;padding:12px;overflow:auto}.app-header{height:40px}.workspace{height:calc(100dvh - 64px);grid-template-columns:1fr 1fr;grid-template-rows:minmax(200px,1fr) auto;gap:8px;padding-top:8px}.stage-column{grid-column:1 / -1;grid-row:1}.control-panel{grid-column:1 / -1;grid-row:2}}@media(max-width:540px){.workspace{grid-template-rows:minmax(180px,1fr) auto}.scramble-bar{width:100%;align-items:stretch;flex-direction:column;gap:4px}.panel{padding:12px}.workspace{width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.cube-stage:after{display:none}.stage-status.is-hidden{visibility:hidden;opacity:0}.stage-column{gap:0}.scramble-bar{height:52px;min-height:52px;border-bottom:0;border-radius:8px 8px 0 0}.cube-stage{border-radius:0 0 8px 8px}.timer-row{position:absolute;z-index:2;top:24px;left:50%;display:flex;align-items:center;gap:12px;transform:translate(-50%)}.timer-row .timer-display{position:static;transform:none}.timer-action{position:absolute;z-index:3;bottom:16px;left:50%;width:64px;min-width:64px;transform:translate(-50%)}.timer-ready-prompt{position:absolute;z-index:2;top:50%;left:50%;color:#a3a3a3;font-family:Cascadia Mono,Consolas,monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;transform:translate(-50%,-50%);pointer-events:none}.timer-strip{height:52px;min-height:52px;display:grid;place-items:center;padding:8px;border:1px solid rgb(255 255 255 / 9%);border-bottom:0;border-radius:8px 8px 0 0;background:#ffffff08}.timer-strip strong{position:relative;left:-2ch;width:8ch;color:#d8d8d8;font-family:Cascadia Mono,Consolas,monospace;font-size:22px;font-variant-numeric:tabular-nums;font-weight:300;letter-spacing:-.05em;text-align:right}.stage-status{bottom:64px}.settings-check,.settings-range{color:#9a9a9a;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.04em}.settings-check{min-height:28px;display:flex;align-items:center;gap:8px}.settings-check input{width:14px;height:14px;margin:0;accent-color:#a3a3a3}.settings-check-child{padding-left:22px;color:#7f7f7f}.settings-check input:disabled+span{opacity:.45}.settings-range{display:grid;gap:6px}.settings-range>span{display:flex;justify-content:space-between}.settings-range output{color:#d4d4d4}.settings-range input{width:100%;margin:0;accent-color:#a3a3a3}.settings-range-controls{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;align-items:center;gap:6px}.settings-range-controls button{width:24px;height:24px;min-height:24px;padding:0}.performance-settings{display:grid;gap:7px;padding-bottom:8px;border-bottom:1px solid rgb(255 255 255 / 9%)}.control-panel[aria-disabled=true]{opacity:.45}.scheme-settings{display:grid;gap:7px;padding-top:8px;border-top:1px solid rgb(255 255 255 / 9%)}.settings-section-title,.scheme-picker{color:#9a9a9a;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.04em}.settings-section-title{color:#d4d4d4;text-transform:uppercase}.scheme-picker{display:grid;gap:5px;margin:0;padding:0;border:0}.scheme-picker legend{margin-bottom:4px;padding:0;color:#bdbdbd}.scheme-face-row{display:grid;grid-template-columns:12px 1fr;align-items:center;gap:6px}.scheme-swatches{display:grid;grid-template-columns:repeat(6,18px);gap:4px}.scheme-swatch{width:18px;height:18px;min-height:18px;padding:0;border:1px solid rgb(255 255 255 / 24%);border-radius:2px}.scheme-swatch:hover{border-color:#fff;background:inherit}.scheme-swatch.selected{border-color:#fff;box-shadow:0 0 0 1px #202020,0 0 0 2px #fff}.scheme-swatch:disabled{cursor:not-allowed;opacity:.14}.scramble-start{min-height:28px;padding:4px 12px;color:#d4d4d4;font-family:Cascadia Mono,Consolas,monospace;font-size:9px;letter-spacing:.06em}.scramble-nav.placeholder{visibility:hidden}@media(max-width:540px){.scramble-bar{height:52px;min-height:52px}}.menu-tabs{display:grid;grid-auto-flow:column;gap:4px;padding-bottom:8px;border-bottom:1px solid rgb(255 255 255 / 10%)}.menu-tabs button{min-height:28px;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.menu-tabs button.active{border-color:#ffffff3d;background:#303030;color:#f2f2f2}.menu-tabpanel{display:grid;gap:12px;max-height:min(60vh,460px);overflow-y:auto}.menu-section{display:grid;gap:4px}.menu-section-tools{display:grid;grid-auto-flow:column;gap:4px;padding-top:4px}.menu-section-tools button,.menu-section-tools .preset-add{min-height:30px;font-size:10px}.records-panel{display:grid;gap:10px}.records-summary{display:grid;grid-template-columns:1fr 1fr;gap:4px}.records-summary div{display:grid;gap:2px;padding:8px;border:1px solid rgb(255 255 255 / 10%);border-radius:6px;background:#262626}.records-summary strong{font-size:16px;font-variant-numeric:tabular-nums}.records-summary small,.records-empty,.records-tools small{color:#777;font-size:9px}.records-empty{margin:0;padding:8px 2px;line-height:1.5}.records-list{display:grid;gap:3px;margin:0;padding:0;list-style:none}.records-list li{display:grid;grid-template-columns:auto 1fr auto auto auto;align-items:center;gap:6px;padding:5px 8px;border:1px solid rgb(255 255 255 / 8%);border-radius:6px}.records-time{font-variant-numeric:tabular-nums;font-size:12px}.records-when{color:#777;font-size:9px}.records-list button{min-height:24px;padding:0 6px;font-size:9px}.records-tools{display:grid;gap:4px;padding-top:4px;border-top:1px solid rgb(255 255 255 / 10%)}.records-penalty{display:grid;grid-auto-flow:column;gap:2px}.records-penalty button.active{border-color:#ffffff47;background:#3a3030;color:#f2f2f2}
