:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eef3ff;background:#07101d;color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 30% 10%,#182745 0,#07101d 42%,#040812 100%)}button,input{font:inherit}.topbar{min-height:82px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #25324a;background:#091321e8;backdrop-filter:blur(18px);position:relative;z-index:5}.eyebrow{font-size:11px;letter-spacing:.18em;color:#8aa7d8}.topbar h1{font-size:20px;margin:4px 0 0}.top-actions{display:flex;gap:8px}button{border:1px solid #33435f;background:#111e32;color:#eef3ff;border-radius:12px;padding:10px 13px;cursor:pointer}.primary{background:#6b7cff;border-color:#6b7cff}.ghost{background:#101827}.app-shell{height:calc(100vh - 82px);display:grid;grid-template-columns:minmax(0,1fr) 390px}.viewport-panel{position:relative;min-height:500px;overflow:hidden}.viewport-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:36px 36px;pointer-events:none}.viewport-panel #viewport{width:100%;height:100%}.viewport-hint{position:absolute;bottom:17px;left:18px;background:#08111dcc;padding:8px 12px;border:1px solid #2c3d5a;border-radius:999px;font-size:12px;color:#aebbd1}.view-buttons{position:absolute;top:16px;left:16px;display:flex;gap:7px;right:12px;overflow:auto}.view-buttons button{padding:8px 11px;font-size:12px;background:#0a1424dd;backdrop-filter:blur(10px);white-space:nowrap}.editor-panel{background:#0a1321f2;border-left:1px solid #24324a;overflow:auto;backdrop-filter:blur(16px)}.tabs{display:grid;grid-template-columns:repeat(4,1fr);position:sticky;top:0;background:#0a1321fa;z-index:3;border-bottom:1px solid #24324a}.tab{border:0;border-radius:0;background:transparent;padding:15px 5px;color:#8292ad}.tab.active{color:#fff;background:#16223a;box-shadow:inset 0 -2px #7e8cff}.tabpage{display:none;padding:20px}.tabpage.active{display:block}.tabpage h2{margin:0 0 5px;font-size:18px}.tabpage h3{font-size:13px;letter-spacing:.08em;color:#9fb0cc;margin:23px 0 14px;padding-bottom:8px;border-bottom:1px solid #1d2a40}.section-note{font-size:12px;line-height:1.55;color:#91a0b8;margin:0 0 18px}.control{margin:0 0 16px}.control label{display:flex;justify-content:space-between;margin-bottom:7px;font-size:13px;color:#d7dfec}.control label span{color:#8ea3c7;font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:#7e8cff}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px}.choice{padding:12px 8px}.choice.active{border-color:#7e8cff;background:#1a2850}.color-row{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid #1d2a40}.color-row input{width:72px;height:38px;border:0;background:transparent}.importbox{margin:0 20px 24px;padding:15px;border:1px dashed #364863;border-radius:13px;color:#91a0b8;font-size:12px}.importbox label{display:block;margin-bottom:8px}.importbox input{width:100%;font-size:11px;color:#adb9cd}.boot-status{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:9999;padding:12px 16px;border-radius:14px;background:#101a2b;color:#eaf0ff;border:1px solid #344766;box-shadow:0 12px 40px #0007;font-size:13px;max-width:calc(100vw - 32px);text-align:center}.boot-status.error{background:#2a1118;border-color:#7c3344;color:#ffdce3}.boot-status[hidden]{display:none!important}
@media(max-width:860px){.topbar{min-height:0;height:auto;gap:12px;align-items:flex-start;flex-direction:column;padding:15px 18px}.top-actions{width:100%;overflow:auto}.top-actions button{white-space:nowrap}.app-shell{height:auto;display:flex;flex-direction:column}.viewport-panel{height:53vh;min-height:410px}.editor-panel{border-left:0;border-top:1px solid #24324a}.viewport-hint{font-size:10px;bottom:13px}.topbar h1{font-size:18px}.view-buttons{left:12px;top:12px}.view-buttons button{padding:8px 10px}.tabpage{padding:20px 18px}}
@supports(height:100dvh){body{min-height:100dvh}.app-shell{height:calc(100dvh - 82px)}@media(max-width:860px){.app-shell{height:auto}.viewport-panel{height:53dvh}}}