/* Exact client assets and fixed control metrics from Slate. MenuScale changes the window only. */
@font-face { font-family:ArticSlate; src:url('/assets/fonts/slate-regular.ttf') format('truetype'); font-weight:400 600; font-display:swap; }
@font-face { font-family:ArticSlate; src:url('/assets/fonts/slate-bold.ttf') format('truetype'); font-weight:700 900; font-display:swap; }
:root { --cheat-accent:#008cff; --cheat-bg:#0c0f12; --cheat-panel:#101316; --cheat-line:#373f4785; }
.showcase-caption { display:flex; align-items:center; flex-wrap:wrap; gap:12px; width:min(100%,1125px); color:#9299a2; font-size:12px; margin:10px 0 -16px; }
.showcase-caption small { display:block; color:#737e8b; font-size:10px; margin-top:4px; font-variant-numeric:tabular-nums; }
.demo-live-dot { width:5px; height:5px; border-radius:50%; background:#008cff; box-shadow:0 0 10px #008cff; }
.showcase-view-controls { margin-left:auto; display:flex; border:1px solid #373f4785; border-radius:4px; padding:3px; gap:2px; }
.showcase-view-controls button,#demo-reset { border:0; background:transparent; color:#9299a2; cursor:pointer; font:inherit; padding:6px 8px; border-radius:2px; }
.showcase-view-controls button[aria-pressed=true] { background:#1d2227; color:#dde0e4; }
.demo-sample-toggle { display:flex; align-items:center; gap:6px; font-size:11px; }.demo-sample-toggle input { accent-color:#008cff; }
.showcase-viewport { width:min(100%,1125px); overflow:auto; padding:0; scrollbar-width:thin; scrollbar-color:#373f47 #0c0f12; overscroll-behavior-x:contain; }
.showcase-stage { position:relative; margin-inline:auto; width:750px; height:400px; }
.cheat-preview { position:absolute; top:0; left:0; width:var(--menu-width,750px); height:var(--menu-height,400px); transform-origin:top left; text-align:left; border:1px solid #373f4785; border-radius:4px; overflow:hidden; background:#0c0f12; color:#dde0e4; font:18px/1.15 ArticSlate,Arial,sans-serif; isolation:isolate; }
.showcase-viewport[hidden],.demo-reopen[hidden] { display:none!important; }
.cheat-preview *,.cheat-preview *::before,.cheat-preview *::after { box-sizing:border-box; }
.cheat-preview button,.cheat-preview input,.cheat-preview select { font:inherit; }
.cheat-preview button { cursor:pointer; }.cheat-preview :focus-visible { outline:1px solid var(--cheat-accent); outline-offset:2px; }
.cheat-titlebar { height:46px; display:flex; align-items:center; padding:0 14px 0 12px; border-bottom:1px solid #2a303680; }
.cheat-brand { display:flex; align-items:center; gap:10px; }.cheat-brand img { width:34px; height:34px; object-fit:contain; }
.cheat-brand strong { color:var(--cheat-accent); font:13px ArticSlate,Arial,sans-serif; }
#demo-close { margin-left:auto; border:0; color:#7c838c; background:none; padding:8px 0 8px 8px; font-size:14px; }
.cheat-body { display:grid; grid-template-columns:145px minmax(0,1fr); height:calc(100% - 46px); padding-top:8px; }
.cheat-nav { padding:8px 0 8px 14px; background:#101316; border-right:1px solid #373f4785; overflow:auto; scrollbar-width:none; }
.cheat-tab { display:block; width:100%; border:1px solid transparent; border-radius:0 7px 7px 0; height:30px; margin:0 0 2px; padding:0 12px; background:transparent; color:#7c838c; text-align:left; white-space:nowrap; font-size:20px!important; }
.cheat-tab:hover,.cheat-subnav button:hover { color:#dde0e4; }
.cheat-tab.active { color:var(--cheat-accent); background:#191e23; border-color:#373f4785; border-left:3px solid var(--cheat-accent); padding-left:10px; }
.cheat-subnav { margin:4px 0 2px; }.cheat-subnav button { position:relative; width:100%; display:block; text-align:left; border:0; background:none; color:#7c838c; height:29px; padding:0 4px 0 18px; font-size:20px; }
.cheat-subnav button.active { color:#dde0e4; }.cheat-subnav button.active::before { content:'•'; position:absolute; left:6px; color:var(--cheat-accent); font-size:14px; }
.cheat-main { min-width:0; overflow:auto; padding:10px; background:radial-gradient(ellipse 300px 240px at 50% 15px,color-mix(in srgb,var(--cheat-accent) 11%,transparent),transparent 90%); scrollbar-width:thin; scrollbar-color:#373f47 transparent; overscroll-behavior:contain; }
.cheat-panels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; align-items:start; min-height:0; }
.cheat-column { display:grid; gap:8px; min-width:0; }.cheat-card { min-width:0; border:1px solid #373f4785; border-radius:4px; padding:0 14px 14px; background:radial-gradient(ellipse 180px 100px at 50% -50px,color-mix(in srgb,var(--cheat-accent) 4%,transparent),transparent),#10131670; }
.cheat-card h3 { height:30px; display:flex; align-items:flex-end; color:var(--cheat-accent); font:18px/1.15 ArticSlate,Arial,sans-serif; margin:0 0 14px; white-space:nowrap; }
.demo-row { display:flex; align-items:center; gap:12px; min-height:26px; margin-bottom:14px; font-weight:400; }.demo-row:last-child { margin-bottom:0; }.demo-row[hidden] { display:none; }
.demo-row label { min-width:0; cursor:pointer; }.demo-toggle-row { color:#7c838c; }.demo-toggle-row:has(:checked) { color:#dde0e4; }
.demo-checkbox { appearance:none; margin:0; width:20px; height:20px; border:1px solid #373f4785; border-radius:4px; background:#16191d; flex:none; cursor:pointer; }
.demo-checkbox:checked { background:var(--cheat-accent); border-color:var(--cheat-accent); }.demo-checkbox:checked::after { content:'✓'; display:block; color:#05121d; font:18px/18px Arial,sans-serif; text-align:center; }
.demo-range-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0; height:30px; min-height:0; margin:0 0 14px; line-height:21px; }.demo-range-row output { color:#7c838c; font-variant-numeric:tabular-nums; }
.demo-range-row input { grid-column:1/-1; appearance:none; margin:0; width:100%; min-width:0; height:9px; border:1px solid #373f4785; border-radius:4px; background:linear-gradient(to right,var(--cheat-accent) var(--fill),#16191d var(--fill)); cursor:pointer; }
.demo-range-row input::-webkit-slider-thumb { appearance:none; width:2px; height:8px; background:var(--cheat-accent); }.demo-range-row input::-moz-range-thumb { width:2px; height:8px; border:0; background:var(--cheat-accent); }
.demo-bind-row,.demo-segment-row { justify-content:space-between; min-height:34px; }.demo-bind { min-width:72px; height:34px; padding:0 6px; background:#16191d; color:#dde0e4; border:0; font:12px ArticSlate,Arial,sans-serif!important; }
.demo-segments { display:flex; padding:2px; gap:1px; border:1px solid #373f4785; border-radius:3px; }.demo-segments button { border:0; border-radius:2px; background:none; color:#7c838c; padding:3px; font-size:14px; }.demo-segments button.selected { background:#1d2227; color:#dde0e4; }
.demo-color-row { min-height:20px; margin-bottom:10px; }.demo-color { appearance:none; width:16px; height:16px; padding:0; border:0; background:none; flex:none; cursor:pointer; }
.demo-color::-webkit-color-swatch-wrapper { padding:0; }.demo-color::-webkit-color-swatch { border:1px solid #c8cfd4; border-radius:2px; }.demo-color::-moz-color-swatch { border:1px solid #c8cfd4; border-radius:2px; }
.demo-select-row { display:grid; gap:3px; margin:0 0 14px; }.demo-select-row select { min-width:0; width:100%; height:30px; border:1px solid #373f4785; border-radius:3px; background:#16191d; color:#dde0e4; padding:0 6px; }
.demo-action-row { min-height:34px; }.demo-action { width:100%; border:0; background:var(--cheat-accent); color:#fff; border-radius:6px; height:34px; padding:0 6px; cursor:pointer; white-space:nowrap; }.demo-action:hover { filter:brightness(1.1); }
.demo-bones { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px 6px; width:100%; }.demo-bones button { border:0; border-radius:5px; height:28px; background:none; color:#7c838c; text-align:left; padding:0 6px; font-size:14px; white-space:nowrap; }.demo-bones button.selected { color:#dde0e4; background:#1d2227; }.demo-bones button:last-child { grid-column:4; }
.demo-section-heading { grid-column:1/-1; font:18px ArticSlate,Arial,sans-serif; color:var(--cheat-accent); border-bottom:1px solid #2a303680; margin:0; padding:2px 0 6px; }
.demo-text-input { border:0; border-radius:3px; background:#ffffff04; padding:10px 8px; width:100%; min-width:0; color:#dde0e4; }.demo-text-input::placeholder { color:#7c838c; opacity:1; }
.demo-empty-state { border:1px solid #373f4785; border-radius:4px; padding:32px 12px; min-height:144px; margin:6px 0 0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:10px; }.demo-empty-state strong { font-weight:500; }.demo-empty-state span { max-width:220px; color:#7c838c; }
.demo-config-layout { display:flex; height:100%; }.demo-config-panel { width:100%; height:100%; display:flex; flex-direction:column; padding:14px; gap:6px; }.demo-config-heading { display:flex; gap:8px; align-items:center; }.demo-config-heading strong { font-weight:800; font-size:20px; }.demo-config-heading .demo-action { width:auto; height:24px; }
.demo-config-list { flex:1; min-height:0; overflow:auto; }.demo-config-list .demo-empty-state { height:100%; min-height:0; border:0; margin:0; }.demo-config-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.demo-config-heading strong{margin-right:auto;font-size:15px}.demo-config-help{font-size:12px;color:#aeb8c6;margin:0 0 4px;line-height:1.4}.demo-config-create{display:flex;gap:6px}.demo-config-create input{flex:1;min-width:0}.demo-config-create .demo-action{width:100px;flex-shrink:0}.demo-config-heading a.demo-action{display:flex;align-items:center;text-decoration:none}.demo-config-list .demo-list-item{min-height:48px}.demo-config-actions button:disabled{opacity:.45;cursor:default}.cheat-column{gap:4px}
.demo-misc-sections{grid-column:1/-1;margin-bottom:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));height:30px}
.demo-misc-sections button.selected{background:color-mix(in srgb,var(--cheat-accent) 14%,transparent);color:var(--cheat-accent)}.demo-misc-sections button:hover{background:color-mix(in srgb,var(--cheat-accent) 18%,transparent)}
.demo-list-item { width:100%; text-align:left; padding:12px; margin-top:6px; background:#16191d; color:#dde0e4; border:1px solid #373f4785; border-radius:4px; }.demo-list-item.selected { border-color:var(--cheat-accent); background:#1d2227; }
.demo-style-library { grid-column:1/-1; }.demo-style-library > span { display:block; margin:0 0 4px; }.demo-style-library .demo-segments { gap:6px; }.demo-style-library button { flex:1; height:34px; border:1px solid #373f4785; font-size:18px; font-weight:800; }.demo-style-library button.selected { border-color:var(--cheat-accent); }
.demo-crosshair-canvas { display:block; width:100%; height:124px; border:1px solid #373f4785; border-radius:8px; background:#ffffff04; }.demo-crosshair-row { display:block; }
.showcase-status { width:min(100%,1125px); font-size:11px; line-height:1.5; color:#9299a2; margin:-16px 0 0; min-height:18px; }.demo-reopen { background:#16191d; color:#dde0e4; border:1px solid #373f47; border-radius:4px; padding:12px; cursor:pointer; }
.page-section { scroll-margin-top:90px; }.page-section[hidden] { display:none!important; }.account-activity-note { max-width:900px; padding:18px 0; color:#9299a2; font-size:12px; line-height:1.8; }
@media(max-width:700px) { .showcase-caption { gap:8px; }.showcase-view-controls { margin-left:auto; }.showcase-view-controls button,#demo-reset { min-height:40px; }.demo-sample-toggle { min-height:40px; margin-right:auto; }.showcase-status { margin-top:-12px; } }
@media(prefers-reduced-motion:reduce) { .cheat-preview * { animation:none!important; transition:none!important; } }
.demo-number-row{display:grid;grid-template-columns:80px 26px minmax(0,1fr) 26px;gap:4px;align-items:center;min-height:30px}.demo-number-input{width:100%;min-width:0;box-sizing:border-box;background:#18212a;color:#edf2f6;border:1px solid #28343e;border-radius:4px;padding:5px;text-align:center}.demo-number-row .demo-action{padding:0;min-height:26px}.demo-crosshair-canvas{height:100px}

.demo-crosshair-banner{grid-column:1/-1;display:grid;grid-template-columns:1fr 140px;gap:4px}.demo-crosshair-banner .demo-crosshair-row{grid-column:1/-1}.demo-crosshair-banner .demo-crosshair-canvas{height:70px}

.demo-crosshair-studio .demo-range-row{gap:0;grid-template-rows:21px 9px}.demo-crosshair-studio .cheat-card h3{height:28px;color:#dde0e4}