:root{--bg:#070a10;--panel:#0f1520;--line:#222c3d;--text:#dbe4f0;--muted:#8b9ab0;--signal:#38bdf8;--good:#34d399;--warn:#fbbf24;--bad:#f87171;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}button,input{font:inherit;color:inherit}button{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:8px;padding:6px 12px}button:hover{border-color:#3a4a63}button.active{border-color:var(--signal);color:var(--signal)}.harness{grid-template-columns:auto minmax(0,1fr);gap:28px;min-height:100vh;padding:20px 24px;display:grid}.device-col{flex-direction:column;align-items:center;display:flex}.device{background:#000;border:2px solid #2a3344;border-radius:52px;padding:12px;position:relative;box-shadow:0 20px 60px #0009}.device iframe{background:#0b0f17;border:0;border-radius:40px;display:block}.device.flash:after{content:"";pointer-events:none;box-shadow:0 0 0 4px var(--flash,var(--signal)), 0 0 28px var(--flash,var(--signal));border-radius:52px;animation:.4s ease-out forwards flash;position:absolute;inset:-2px}.device[data-haptic=break],.device[data-haptic=loot]{--flash:var(--good)}.device[data-haptic=trap]{--flash:var(--warn)}.device[data-haptic=trace]{--flash:var(--bad)}@keyframes flash{0%{opacity:1}to{opacity:0}}.caption{color:var(--muted);margin:10px 0 0;font-size:12px}.caption a{color:var(--signal)}.panel{flex-direction:column;gap:18px;max-width:760px;display:flex}.panel h1{letter-spacing:.02em;margin:0;font-size:22px}.panel header p{color:var(--muted);margin:2px 0 0}.panel h2{text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;font-size:13px}.muted{color:var(--muted);text-transform:none;letter-spacing:0;font-weight:400}.controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.controls input{background:var(--panel);border:1px solid var(--line);border-radius:8px;width:110px;margin-left:6px;padding:6px 8px}.label{color:var(--muted)}.seg{gap:4px;display:flex}.readout{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.readout div{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 10px}.readout span{color:var(--muted);font-size:11px;display:block}.readout strong{white-space:nowrap;text-overflow:ellipsis;font-size:15px;display:block;overflow:hidden}.log{background:var(--panel);border:1px solid var(--line);border-radius:10px;height:260px;margin:0;padding:8px;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:12px;list-style:none;overflow-y:auto}.log li{border-left:2px solid #0000;padding:2px 4px}.log .tone-good{border-color:var(--good)}.log .tone-warn{border-color:var(--warn)}.log .tone-bad{border-color:var(--bad);color:var(--bad)}.log .tone-muted{color:var(--muted)}.log .tone-divider{color:var(--signal);border-top:1px solid var(--line);margin-top:6px}.tag{color:var(--warn);border:1px solid #5a4a1c;border-radius:4px;margin-right:6px;padding:0 5px;font-size:10.5px}.runs{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:13px}.runs th,.runs td{text-align:left;border-bottom:1px solid var(--line);padding:6px 8px}.runs th{color:var(--muted);font-size:11px;font-weight:600}.result-extracted td:nth-child(4){color:var(--good)}.result-dropped td:nth-child(4),.result-traced td:nth-child(4){color:var(--bad)}@media (width<=900px){.harness{grid-template-columns:1fr}.readout{grid-template-columns:repeat(3,minmax(0,1fr))}}
