.ho{--mono:"Geist Mono", ui-monospace, monospace;--sans:"Geist", ui-sans-serif, system-ui, sans-serif;--bg:#02060c;--ink:#e6f6fb;--dim:#8aa5b2;--faint:#4f6873;--line:#a0dcf01f;--glass:#081018b8;--hover:#a0dcf012;--accent:#5fd8ff;--accent-ink:#02121a;--tag-bg:#020a129e;--tag-line:#5fd8ff4d;--tag-ink:#e6f6fb;background:var(--bg);color:var(--ink);font:13px/1.5 var(--sans);-webkit-font-smoothing:antialiased;transition:background .3s;position:fixed;inset:0;overflow:hidden}.ho[data-style=blueprint]{--bg:#0d2f57;--ink:#f2f7ff;--dim:#a9c2df;--faint:#6f8db0;--line:#dcecff29;--glass:#0a2442c7;--hover:#dcecff14;--accent:#ffe08a;--accent-ink:#0d2f57;--tag-bg:#0d2f57cc;--tag-line:#dcecff66}.ho[data-theme=light]{--bg:#e8e6e1;--ink:#1c1d21;--dim:#5f636b;--faint:#9a9da3;--line:#1c1d211a;--glass:#faf9f6d1;--hover:#1c1d210d;--accent:#1f6feb;--accent-ink:#fff;--tag-bg:#ffffffdb;--tag-line:#1c1d2124;--tag-ink:#1c1d21}.ho[data-style=ink]{--bg:#f5f2ea;--glass:#fbf9f4db;--accent:#d7263d}.ho *{box-sizing:border-box}.ho a{color:inherit}.ho button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.ho :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}.ho-stage,.ho-canvas{position:absolute;inset:0}.ho-canvas canvas{cursor:grab;touch-action:none;width:100%;height:100%;display:block}.ho-canvas canvas:active{cursor:grabbing}.ho-css{pointer-events:none;position:absolute;inset:0;overflow:hidden}.ho-status{font:12px var(--mono);color:var(--dim);margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ho-tag{font:500 10.5px/1 var(--mono);color:var(--tag-ink);border:1px solid var(--tag-line);background:var(--tag-bg);white-space:nowrap;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:4px;padding:3px 6px}.ho-tag.is-sel{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 25%, transparent)}.ho-key{text-align:center;min-width:18px;padding:2px 5px;font-size:11.5px}.ho-up{color:var(--accent)}.ho-side-l{transform:translate(calc(-50% - 18px))}.ho-side-r{transform:translate(calc(50% + 18px))}.ho-side-l.ho-up{transform:translate(calc(-50% - 18px),-28px)}.ho-side-r.ho-up{transform:translate(calc(50% + 18px),-28px)}.ho-btn{font:500 9.5px/1 var(--mono);color:var(--dim)}.ho-btn-key{font-size:9px}.ho-icon{border-radius:6px;place-items:center;width:28px;height:28px;display:inline-grid;color:var(--dim)!important}.ho-icon:hover{background:var(--hover);color:var(--ink)!important}.ho-top{pointer-events:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:14px 20px;display:grid;position:absolute;top:0;left:0;right:0}.ho-top>*{pointer-events:auto}.ho-brand{align-items:center;gap:8px;min-width:0;display:flex}.ho-home{white-space:nowrap;text-decoration:none;color:var(--dim)!important}.ho-home:hover{color:var(--ink)!important}.ho-slash{color:var(--faint)}.ho-brand h1{white-space:nowrap;margin:0;font-size:13px;font-weight:600}.ho-tabs{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:10px;gap:2px;padding:3px;display:flex}.ho-tabs button{border-radius:7px;justify-items:center;padding:5px 14px 6px;line-height:1.2;display:grid}.ho-tabs button:hover{background:var(--hover)}.ho-tabs button b{font-size:13px;font-weight:600}.ho-tabs button span{font:10px var(--mono);color:var(--faint)}.ho-tabs button.on{background:var(--ink);color:var(--bg)}.ho-tabs button.on span{color:color-mix(in srgb, var(--bg) 65%, var(--ink))}.ho-styles{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:10px;justify-self:end;gap:2px;padding:3px;display:flex}.ho-styles button{color:var(--dim);border-radius:7px;align-items:center;gap:6px;padding:6px 10px;font-size:12px;display:flex}.ho-styles button:hover{background:var(--hover);color:var(--ink)}.ho-styles button.on{background:var(--hover);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.ho-styles i{border:1px solid var(--line);border-radius:50%;width:10px;height:10px}.ho-styles i[data-swatch=holo]{background:radial-gradient(circle at 35% 35%,#9ff3ff,#0b2a3a)}.ho-styles i[data-swatch=studio]{background:radial-gradient(circle at 35% 35%,#fff,#c9c0b4)}.ho-styles i[data-swatch=blueprint]{background:#0d2f57;box-shadow:inset 0 0 0 2px #dcecff}.ho-styles i[data-swatch=ink]{background:#f5f2ea;box-shadow:inset 0 0 0 2px #1c1d21}.ho-caption{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:12px;width:min(420px,100vw - 400px);padding:16px 18px;position:absolute;bottom:20px;left:20px}.ho-caption h2{letter-spacing:-.01em;margin:0 0 6px;font-size:17px;font-weight:600;line-height:1.25}.ho-caption ul{color:var(--dim);margin:0 0 14px;padding-left:16px;list-style:outside}.ho-caption li{margin:2px 0}.ho-actions{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.ho-primary{border-radius:8px;align-items:center;gap:7px;display:inline-flex;background:var(--accent)!important;color:var(--accent-ink)!important;padding:8px 14px!important;font-weight:600!important}.ho-primary:hover{filter:brightness(1.08)}.ho-primary.on{box-shadow:inset 0 0 0 1px var(--line);background:var(--hover)!important;color:var(--ink)!important}.ho-scrub{min-width:200px;font:11px var(--mono);color:var(--faint);flex:1;align-items:center;gap:8px;display:flex}.ho-scrub input{flex:1;min-width:60px}.ho-hint{color:var(--dim);margin:10px 0 0;font-size:12px}.ho input[type=range]{accent-color:var(--accent);width:100%}.ho-panel-toggle{z-index:2;top:72px;right:24px;position:absolute!important}.ho-panel{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);scrollbar-width:thin;scrollbar-color:var(--line) transparent;border-radius:12px;width:316px;padding:36px 16px 14px;position:absolute;top:66px;bottom:20px;right:16px;overflow-y:auto}.ho-panel section{border-bottom:1px solid var(--line);padding:12px 0}.ho-panel section:first-child{padding-top:0}.ho-panel h3{letter-spacing:.04em;text-transform:uppercase;color:var(--dim);justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 8px;font-size:11px;font-weight:600;display:flex}.ho-panel h3 em{font:normal 11px var(--mono);letter-spacing:0;text-transform:none;color:var(--faint)}.ho-seg{flex-wrap:wrap;gap:4px;display:flex}.ho-seg button{box-shadow:inset 0 0 0 1px var(--line);border-radius:6px;flex:auto;font-size:12px;color:var(--dim)!important;padding:5px 8px!important}.ho-seg button:hover{background:var(--hover);color:var(--ink)!important}.ho-seg button.on{background:var(--hover);box-shadow:inset 0 0 0 1px var(--accent);color:var(--ink)!important}.ho-ends{font:10.5px var(--mono);color:var(--faint);justify-content:space-between;margin-top:2px;display:flex}.ho-legend{border-radius:3px;height:5px;margin-top:12px}.ho-small{font:11px var(--mono);color:var(--faint);margin:8px 0 0}.ho-fires{font:11.5px var(--mono);margin:8px 0 0;padding:0;list-style:none}.ho-fires li{color:var(--ink);border-left:2px solid #ff3d63;margin-bottom:2px;padding:4px 8px;animation:.35s ho-in}.ho-fires li.quiet{border-left-color:var(--line);color:var(--faint)}@keyframes ho-in{0%{opacity:0;transform:translate(-6px)}}.ho-type{border:1px solid var(--line);background:var(--hover);width:100%;color:var(--ink);font:13px var(--mono);border-radius:7px;outline:none;padding:8px 10px}.ho-type:focus{border-color:var(--accent)}.ho-typed{font:13px var(--mono);word-break:break-all;margin:8px 0 0}.ho-typed .l{color:#e08a2c}.ho-typed .r{color:var(--accent)}.ho-checks{color:var(--dim);gap:16px;display:flex}.ho-checks input{accent-color:var(--accent);vertical-align:-2px;margin:0 4px 0 0}.ho-card{gap:2px;display:grid}.ho-card b{font-weight:600}.ho-card span{font:11.5px var(--mono);color:var(--dim)}.ho-list{margin:0;padding:0;list-style:none}.ho-list button{text-align:left;border-radius:6px;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;width:100%;padding:5px 6px!important;display:grid!important}.ho-list button:hover{background:var(--hover)}.ho-list button.on{background:var(--hover);box-shadow:inset 2px 0 0 var(--accent)}.ho-list button>span{white-space:nowrap;align-items:center;gap:6px;display:flex}.ho-list button>small{font:11px var(--mono);color:var(--faint);text-align:right;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ho-list button>svg{color:var(--faint)}.ho-list em{font:normal 10px var(--mono);background:var(--hover);color:var(--dim);border-radius:3px;padding:0 4px}.ho-list i{border-radius:50%;flex:none;width:7px;height:7px}.ho-panel footer{color:var(--faint);padding-top:12px;font-size:11.5px}.ho-about{background:color-mix(in srgb, var(--bg) 55%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:5;place-items:center;padding:20px;display:grid;position:absolute;inset:0}.ho-about>div{background:var(--glass);border:1px solid var(--line);border-radius:14px;width:min(560px,100%);padding:26px 28px;position:relative;box-shadow:0 20px 60px #00000040}.ho-about h2{letter-spacing:-.015em;margin:0 0 14px;font-size:21px;line-height:1.2}.ho-about ul{margin:0 0 14px;padding-left:18px;list-style:outside}.ho-about ul ul{color:var(--dim);list-style:circle}.ho-about li{margin:3px 0}.ho-about p{color:var(--dim);margin:0;font-size:12px}.ho-about a{color:var(--accent)}.ho-close{top:12px;right:12px;position:absolute!important}@media (width<=1180px){.ho-top{grid-template-columns:auto 1fr}.ho-tabs{grid-area:2/1/auto/-1;justify-self:start}.ho-styles{grid-area:1/2}.ho-panel{top:112px}.ho-panel-toggle{top:118px}}@media (width<=760px){.ho{min-height:100vh;position:static;overflow:visible}.ho-stage{z-index:0;height:52vh;position:sticky;top:0}.ho-top{background:var(--bg);z-index:1;flex-direction:column;align-items:stretch;gap:10px;padding:12px 16px;display:flex;position:relative}.ho-tabs,.ho-styles{justify-content:space-between;overflow-x:auto}.ho-styles button{flex:1;justify-content:center;padding:6px 4px}.ho-caption{z-index:1;width:auto;margin:0 16px 12px;position:relative;bottom:auto;left:auto}.ho-panel-toggle{display:none!important}.ho-panel{z-index:1;width:auto;margin:0 16px 24px;padding-top:14px;position:relative;inset:auto;overflow:visible}}
