.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;vertical-align:middle;-webkit-user-select:none;user-select:none}html,body,#root{margin:0;height:100%}body{background:#111217}html{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.app-shell,.cell,.nav-item,.top-actions,button{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}input,textarea{-webkit-user-select:text;user-select:text}.app-shell{height:100%;display:grid;grid-template-columns:248px 1fr}.main-col{min-width:0;display:grid;grid-template-rows:56px 1fr;background:#111217}.sidebar{height:100%;display:flex;flex-direction:column;background:#0b0c0e;color:#ccccdc;border-right:1px solid #22252b}.sidebar-top{padding:16px 14px 12px}.sidebar-mid{flex:1;overflow:auto;padding:4px 8px 12px}.sidebar-foot{padding:12px;border-top:1px solid #22252b;display:flex;flex-direction:column;gap:10px}.sidebar-user{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#8e8ea3}.link-btn{border:0;background:none;color:#ff780a;cursor:pointer;font:inherit}.brand-logo{height:40px;width:auto;display:block}.nav-item{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;border:1px solid transparent;background:transparent;color:inherit;border-radius:8px;padding:10px 12px;margin-bottom:4px;cursor:pointer;transition:background .22s cubic-bezier(.2,0,0,1),border-color .22s cubic-bezier(.2,0,0,1)}.nav-item:hover{background:#ffffff0a}.nav-item.on{background:#181b1f;border-color:#ff780a}.nav-label{display:block;font-size:14px}.nav-meta{display:block;font-size:11px;color:#8e8ea3;margin-top:2px}.nav-dot{width:8px;height:8px;border-radius:50%;background:#ff780a;flex-shrink:0}.top-actions{display:flex;align-items:center;gap:8px;padding:8px 16px;border-bottom:1px solid #22252b;background:#0b0c0e}.top-spacer{flex:1}.hdr-ico{width:20px;height:20px;display:block;object-fit:contain}.hdr-ico.invert{filter:invert(.88)}.menu-btn{display:none!important}.stage{padding:16px;overflow:auto;min-width:0;height:100%}.view-body{min-width:0;min-height:0;height:100%;overflow:hidden;perspective:1400px}.grid-card{height:100%;min-height:480px;background:#181b1f;border:1px solid #22252b;border-radius:8px;padding:12px;display:flex;flex-direction:column;transform-origin:100% 100%;backface-visibility:hidden}.grid-wrap{flex:1;min-height:0;overflow:auto;perspective:900px}.ip-grid{min-height:100%;display:grid;grid-template-columns:32px repeat(var(--cols, 16),minmax(0,1fr));grid-template-rows:18px repeat(var(--rows, 16),minmax(var(--cell-min, 0px),1fr));gap:5px;-webkit-user-select:none;user-select:none}.ip-grid[data-cols="16"]{--cols: 16;--rows: 16;--cell-min: 0px}.ip-grid[data-cols="8"]{--cols: 8;--rows: 32;--cell-min: 44px}.ip-grid[data-cols="4"]{--cols: 4;--rows: 64;--cell-min: 48px}.ghead,.grow{font-family:Roboto Mono,monospace;font-size:10px;color:#6e6e80;display:grid;place-items:center}.cell-wrap{display:block;width:100%;height:100%;min-width:0;min-height:0;transform-origin:50% 100%;transform-style:preserve-3d}.cell{width:100%;height:100%;min-height:var(--cell-min, 0px);border:1px solid #2c3235;border-radius:4px;background:#22252b;color:#8e8ea3;padding:0;font-family:Roboto Mono,monospace;font-size:clamp(11px,1.4vw,13px);cursor:pointer;transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .22s cubic-bezier(.2,0,0,1),background .22s cubic-bezier(.2,0,0,1)}.cell:hover:not(:disabled){transform:scale(1.06);z-index:2;box-shadow:0 6px 16px #00000059}.cell:disabled{cursor:default}.cell.used{background:#73bf69;color:#111217;border-color:#56a64b}.cell.pending{background:#ff9830;color:#111217;border-color:#ff780a;animation:pendingPulse 1.8s cubic-bezier(.2,0,0,1) infinite}.cell.clear{background:#f2495c;color:#111217;border-color:#e02f44}.cell.reserved,.cell.dead{background:repeating-linear-gradient(45deg,#2c3235,#2c3235 5px,#181b1f 5px,#181b1f 10px);color:#6e6e80}.cell.ro{opacity:.55}.cell.on{outline:2px solid #ff780a;outline-offset:1px}@keyframes pendingPulse{0%,to{filter:saturate(1)}50%{filter:saturate(1.2) brightness(1.08)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.shake{animation:shake .4s cubic-bezier(.2,0,0,1)}.diff-scroll{max-height:360px;overflow:auto}.diff-group{padding:8px 0;border-bottom:1px solid #2c3235}.diff-ip{margin-bottom:4px}.diff-old{color:#f2495c;font-family:Roboto Mono,monospace;font-size:13px}.diff-new{color:#73bf69;font-family:Roboto Mono,monospace;font-size:13px}.dropzone{width:100%;min-height:120px;border:1px dashed #5794f2;border-radius:8px;background:#111217;color:#ccccdc;cursor:pointer;font:inherit}.mono{font-family:Roboto Mono,monospace}.ip-grid.flip-out .cell-wrap,.ip-grid.flip-in .cell-wrap{animation-duration:.24s;animation-timing-function:cubic-bezier(.2,0,0,1);animation-fill-mode:both;animation-delay:var(--d, 0ms);pointer-events:none}.ip-grid.flip-out .cell-wrap{animation-name:cellFlipOut}.ip-grid.flip-in .cell-wrap{animation-name:cellFlipIn}.grid-card.flip-out{animation:boardFlipOut .28s .34s cubic-bezier(.2,0,0,1) both;pointer-events:none}.grid-card.flip-in{animation:boardFlipIn .28s cubic-bezier(.2,0,0,1) both}.view-body.flip-out{animation:viewFlipOut .28s cubic-bezier(.2,0,0,1) both;pointer-events:none}.view-body.flip-in{animation:viewFlipIn .34s cubic-bezier(.2,0,0,1) both}@keyframes cellFlipOut{to{transform:rotateX(-88deg);opacity:0}}@keyframes cellFlipIn{0%{transform:rotateX(88deg);opacity:0}to{transform:none;opacity:1}}@keyframes boardFlipOut{to{transform:rotateX(-70deg) scale(.97);opacity:0}}@keyframes boardFlipIn{0%{transform:rotateX(70deg) scale(.97);opacity:0}to{transform:none;opacity:1}}@keyframes viewFlipOut{to{transform:rotateX(-55deg);opacity:0}}@keyframes viewFlipIn{0%{transform:rotateX(55deg);opacity:0}to{transform:none;opacity:1}}@media(prefers-reduced-motion:reduce){.cell,.nav-item{transition:none}.cell.pending,.shake{animation:none}.cell:hover:not(:disabled){transform:none}.ip-grid.flip-out .cell-wrap,.ip-grid.flip-in .cell-wrap,.grid-card.flip-out,.grid-card.flip-in,.view-body.flip-out,.view-body.flip-in{animation:none}}@media(max-width:860px){.app-shell{grid-template-columns:1fr}.menu-btn{display:inline-flex!important}.sidebar{width:280px}}
