.explorer-page{display:grid;gap:1rem}.explorer-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.85fr);gap:1rem;align-items:start}.tip-list{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.75rem}.tip-list li{padding:.95rem 1rem;border-radius:18px;background:#fffaf3bd;border:1px solid var(--border);color:var(--muted);line-height:1.7}.explorer-frame{padding:.35rem;background:linear-gradient(180deg,#221d1914,#221d1905),#fffaf38f}.explorer-shell{--explorer-bg: #181516;--explorer-panel: #121519;--explorer-card: #1b2027;--explorer-card-soft: #232833;--explorer-border: #313948;--explorer-fg: #f6f0e8;--explorer-muted: #b8aea5;--ring-thin: #efb463;--ring-thick: #68c6c1;--ring-select: #fffaf0}.explorer-shell .wrap{max-width:1250px;margin:0 auto;padding:16px}.explorer-shell .section{margin:14px auto}.explorer-shell .lede{color:var(--explorer-muted);margin:6px 0 16px;max-width:70ch}.explorer-shell .card{background:var(--explorer-card);border:1px solid var(--explorer-border);border-radius:18px;padding:12px;margin-bottom:12px;color:var(--explorer-fg);box-shadow:0 18px 40px #00000038}.explorer-shell .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}.explorer-shell .ctrl{display:flex;align-items:center;gap:8px;margin:6px 0 10px;flex-wrap:wrap}.explorer-shell .btn{border:1px solid var(--explorer-border);background:#202632;color:var(--explorer-fg);padding:6px 10px;border-radius:10px;cursor:pointer;font-size:12px;box-shadow:none;min-height:auto}.explorer-shell .btn[aria-pressed=true]{outline:2px solid rgba(104,198,193,.55)}.explorer-shell .btn.ghost{background:transparent}.explorer-shell input[type=range],.explorer-shell select,.explorer-shell input[type=checkbox]{background:#1a1f28;color:var(--explorer-fg);border:1px solid var(--explorer-border);border-radius:10px;padding:6px 10px}.explorer-shell .grid-wrap{overflow:auto;border:1px solid var(--explorer-border);border-radius:16px;background:#0e1218}.explorer-shell .rl,.explorer-shell .cl,.explorer-shell .cell{border-bottom:1px solid #2d3342;border-right:1px solid #2d3342}.explorer-shell .rl{width:58px;height:36px;display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font-size:11px;cursor:pointer;position:sticky;left:0;background:var(--explorer-card);z-index:2;transition:background .2s ease,color .2s ease}.explorer-shell .cl{width:38px;height:40px;display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;position:sticky;top:0;background:var(--explorer-card);z-index:3;transition:background .2s ease,color .2s ease}.explorer-shell .cell{width:38px;height:36px;position:relative;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.explorer-shell .sel{outline:2px solid var(--ring-select);outline-offset:-2px;box-shadow:0 0 0 2px #0006 inset}.explorer-shell .num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;text-shadow:0 1px 1px rgba(0,0,0,.6)}.explorer-shell .cell-emph{box-shadow:0 0 0 1px #fff3 inset,0 0 0 1px #00000040}.explorer-shell .ring{position:absolute;inset:2px;outline:2px solid var(--ring-thin);outline-offset:-2px;border-radius:5px;box-shadow:0 0 0 2px #00000073 inset}.explorer-shell .ring-thin{outline-color:var(--ring-thin);box-shadow:0 0 0 1px #efb46359,0 0 0 2px #00000073 inset}.explorer-shell .ring-thick{inset:4px;outline-color:var(--ring-thick);box-shadow:0 0 0 2px #68c6c159,0 0 0 2px #00000073 inset}.explorer-shell .cell-pulse:after{content:"";position:absolute;inset:-6px;border:2px solid var(--ring-thick);border-radius:8px;opacity:0;animation:pulseCell .8s ease-out;pointer-events:none}@keyframes pulseCell{0%{opacity:.8;transform:scale(.9)}50%{opacity:.4;transform:scale(1.05)}to{opacity:0;transform:scale(1.12)}}.explorer-shell .axis-active{background:#232a33;color:#fff}.explorer-shell details{background:var(--explorer-panel);border:1px solid var(--explorer-border);border-radius:12px;padding:10px 12px}.explorer-shell details+details{margin-top:8px}.explorer-shell code{background:#0d1116;border:1px solid var(--explorer-border);padding:2px 5px;border-radius:6px}.explorer-shell table.small{border-collapse:collapse;width:100%;font-size:12px}.explorer-shell table.small th,.explorer-shell table.small td{border:1px solid #2d3342;padding:4px 6px;text-align:right}.explorer-shell table.small th:first-child,.explorer-shell table.small td:first-child{text-align:left}.explorer-shell .pill{display:inline-block;padding:2px 8px;border:1px solid var(--explorer-border);border-radius:999px;font-size:11px;color:var(--explorer-muted);background:transparent}.explorer-shell .spark{width:260px;height:50px;display:block}.explorer-shell .blog{line-height:1.6}.explorer-shell .blog h2{margin:0 0 10px}.explorer-shell .blog p{margin:10px 0}.explorer-shell .blog ul{padding-left:20px;margin:10px 0 10px 18px;color:var(--explorer-muted)}.explorer-shell .blog li{margin-bottom:6px}.explorer-shell .controls-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.explorer-shell .ctrl-block{background:var(--explorer-panel);border:1px solid var(--explorer-border);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px}.explorer-shell .ctrl-title{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--explorer-muted);display:flex;align-items:center;gap:4px}.explorer-shell .ctrl-content{display:flex;flex-wrap:wrap;gap:4px;align-items:center}.explorer-shell .ctrl-content select,.explorer-shell .ctrl-content input[type=range],.explorer-shell .ctrl-content input[type=checkbox]{flex:1}.explorer-shell .ctrl-note{font-size:10px;color:var(--explorer-muted)}.explorer-shell .tutorials{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.explorer-shell .tutorial-btn{border:1px solid var(--explorer-border);background:#1a2028;color:var(--explorer-fg);text-align:left;padding:8px 10px;border-radius:12px;cursor:pointer;font-size:13px;line-height:1.3}.explorer-shell .tutorial-btn.active{border-color:var(--ring-thick);box-shadow:0 0 0 1px var(--ring-thick) inset;background:#1f2d34}.explorer-shell .tutorial-title{font-weight:600;display:block}.explorer-shell .tutorial-desc{display:block;font-size:12px;color:var(--explorer-muted);margin-top:2px}.explorer-shell .tutorial-note{margin-top:10px;font-size:13px;color:var(--explorer-muted);background:var(--explorer-panel);border:1px solid var(--explorer-border);border-radius:12px;padding:10px 12px;line-height:1.5}.explorer-shell .info-tip{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid var(--explorer-border);border-radius:50%;font-size:11px;color:var(--explorer-muted);cursor:help}.explorer-shell .btn.mini{padding:4px 8px;font-size:11px}.explorer-shell .layout-shell{display:grid;grid-template-columns:var(--layout-cols, 320px minmax(420px, 1fr) 320px);gap:14px;align-items:start}.explorer-shell .side-panel{display:flex;flex-direction:column;gap:14px;transition:width .22s ease,opacity .22s ease;min-width:0}.explorer-shell .side-panel.closed{width:0;opacity:0;pointer-events:none}.explorer-shell .side-panel .card{background:var(--explorer-card-soft)}.explorer-shell .grid-center{display:flex;flex-direction:column;gap:12px;position:relative}.explorer-shell .panel-toggles{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}.explorer-shell .edge-toggle{font-size:12px;border:1px dashed var(--explorer-border);background:var(--explorer-panel);color:var(--explorer-muted);border-radius:10px;padding:6px 10px;cursor:pointer}.explorer-shell .col-stack>.card+.card{margin-top:14px}.explorer-shell .preset-flash{animation:presetFlash .8s ease}@keyframes presetFlash{0%{box-shadow:0 0 #68c6c159}50%{box-shadow:0 0 0 14px #68c6c11f}to{box-shadow:0 0 #68c6c100}}.explorer-shell .computed-flash{animation:computedFlash .9s ease}@keyframes computedFlash{0%{box-shadow:0 0 #efb4632e}40%{box-shadow:0 0 0 12px #efb4631f}to{box-shadow:0 0 #efb46300}}.explorer-shell .json-block{background:#0d1116;border:1px solid var(--explorer-border);border-radius:10px;padding:8px;font-family:SFMono-Regular,Consolas,Menlo,monospace;font-size:12px;color:var(--explorer-muted);overflow:auto;line-height:1.35}.explorer-shell .guide-details summary{cursor:pointer;font-weight:600;font-size:14px}@media (max-width: 1180px){.explorer-shell .layout-shell{grid-template-columns:1fr!important}.explorer-shell .side-panel,.explorer-shell .side-panel.closed{width:100%;opacity:1;pointer-events:auto}.explorer-shell .panel-toggles{justify-content:flex-end}}@media (max-width: 960px){.explorer-intro{grid-template-columns:1fr}}