/* ASL v3 brand tokens, matched to the live design system on 2026-09-19.
   Source: https://autosecurelogin.com/asl-design-system.css?v=20260908.1
   Locally served: no external font, stylesheet, or tracking dependency. */
:root {
  color-scheme: dark;
  --obsidian: #040914; --navy: #071328; --panel: #0b1a35; --panel-2: #10234a;
  --text: #eef3ff; --muted: #a9b9d8; --dim: #7f90b3;
  --cyan: #4c9aff; --ice: #9cc8ff; --blue-deep: #1f5fc9;
  --green: #6ce5b1; --amber: #ffce7a; --red: #ff8d9b;
  --line: #1e3a66; --line-soft: #152c52;
  --silver: linear-gradient(180deg, #ffffff 0%, #dbe5f5 55%, #b6c6df 100%);
  --surface: linear-gradient(160deg, rgba(15,35,74,.72), rgba(6,17,38,.88));
  --selected-surface: #102e5e;
  --success-surface: #103b33; --warning-surface: #382b17; --error-surface: #3b1d2c;
  --shadow: 0 24px 70px -34px rgba(0,0,0,.9);
  --glow: 0 0 0 1px rgba(76,154,255,.18), 0 24px 70px -24px rgba(76,154,255,.38);
  --font: "Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono: ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --serif: var(--font); --sans: var(--font);
}

:root{--studio-ink: #eef3ff;--studio-paper: #0b1a35;--studio-mint: #6ce5b1;--studio-orange: #ffce7a;--studio-green: #4c9aff;--studio-line: #1e3a66;--studio-danger: #ff8d9b}*{box-sizing:border-box}.studio-page{margin:0;min-height:100vh;background: var(--surface);color: var(--text);font-family: var(--font)}.studio-shell{width:min(1180px,calc(100% - 32px));margin:auto;padding:32px 0 72px}.studio-header{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;border-bottom: 3px solid var(--line);padding-bottom:20px}.studio-kicker{font: 700 12px/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color: var(--muted)}.studio-header h1{font-size:clamp(38px,7vw,76px);line-height:.88;letter-spacing:-.055em;margin:8px 0 0}.studio-status{border: 2px solid var(--line);border-radius:999px;padding:10px 16px;background: var(--panel);color: var(--text);font-weight:800}.studio-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:22px;margin-top:24px}.studio-card{border: 2px solid var(--line);border-radius:22px;background: var(--panel);box-shadow: none;padding:22px}.studio-card h2{margin:0 0 16px;font-size:25px}.studio-form{display:grid;gap:14px}.studio-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-label{display:grid;gap:6px;font-weight:800;color: var(--text)}.studio-label span{font-size:12px;letter-spacing:.08em;text-transform:uppercase}.studio-input,.studio-select,.studio-textarea{width:100%;border: 2px solid var(--line);border-radius:12px;background: var(--panel);color: var(--text);padding:12px;font:600 15px/1.35 inherit}.studio-textarea{min-height:132px;resize:vertical}.studio-actions{display:flex;gap:10px;flex-wrap:wrap}.studio-button{appearance:none;border: 2px solid var(--line);border-radius:999px;background: var(--panel);color: var(--text);padding:12px 19px;font-weight:900;cursor:pointer;box-shadow: none}.studio-button.secondary{background: var(--panel)}.studio-button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.studio-progress{height:8px;border-radius:9px;overflow:hidden;background: var(--panel);display:none}.studio-progress.active{display:block}.studio-progress::after{content:"";display:block;width:35%;height:100%;background: var(--cyan);animation:studio-slide 1s ease-in-out infinite}@keyframes studio-slide{from{transform:translateX(-110%)}to{transform:translateX(320%)}}.studio-result{min-height:260px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:15px;background: var(--panel);color: var(--text);padding:16px;font: 13px/1.55 var(--mono)}.studio-note{border-left: 5px solid var(--line);padding:10px 12px;background: var(--panel);color: var(--text)}.studio-error{color: var(--red);background: var(--error-surface);padding:10px 12px;border-radius:10px}.studio-artifacts{display:grid;gap:10px;margin-top:14px}.studio-artifact{border: 2px solid var(--line);border-radius:12px;padding:12px;background: var(--panel);color: var(--text)}.advanced-studio-launch{position:fixed;right:18px;bottom:18px;z-index:50;border: 2px solid var(--line);border-radius:999px;background: var(--panel);color: var(--text) !important;padding:11px 17px;font-weight:900;text-decoration:none;box-shadow: none}@media(max-width:780px){.studio-grid,.studio-header{grid-template-columns:1fr}.studio-row{grid-template-columns:1fr}.studio-shell{width:min(100% - 20px,1180px);padding-top:18px}.studio-status{justify-self:start}.studio-card{padding:17px}}

/* Standalone creation studio uses the same ASL v3 surfaces as the account workspace. */
.studio-page { font-family: var(--font); line-height: 1.6; color: var(--text); background: radial-gradient(1300px 760px at 82% -8%,rgba(53,128,255,.26),transparent 62%),linear-gradient(180deg,#081a3d,#050d21 30rem,#03070f); }
.studio-header { border-bottom: 1px solid var(--line); }
.studio-header h1,.studio-card h2 { color: var(--text); font-weight: 800; letter-spacing: -.03em; line-height: 1.06; background: linear-gradient(180deg,#fff,#e7edf8 42%,#aebdd4); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.studio-card { background: var(--surface); border: 1px solid rgba(76,154,255,.25); border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255,255,255,.05),var(--shadow); }
.studio-kicker { color: var(--cyan); font-family: var(--font); }
.studio-input,.studio-select,.studio-textarea { background: #061127; color: var(--text); border: 1px solid #48678d; font-family: var(--font); font-size: 15px; }
.studio-input::placeholder,.studio-textarea::placeholder { color: #96a9c9; }
.studio-button { min-height: 46px; color: #061229; background: var(--silver); border: 1px solid rgba(255,255,255,.55); border-radius: 12px; box-shadow: var(--glow); font-size: .9rem; }
.studio-button.secondary { color: var(--text); background: var(--panel); border-color: rgba(76,154,255,.4); box-shadow: none; }
.studio-button:disabled { color: var(--muted); background: #11213b; border-color: #344b71; opacity: 1; box-shadow: none; }
.studio-status { color: var(--ice); background: var(--selected-surface); border: 1px solid rgba(76,154,255,.45); }
.studio-result { background: #061127; border: 1px solid var(--line); color: var(--text); }
.studio-note { color: var(--text); background: var(--panel-2); border-left-color: var(--cyan); }
.studio-error { color: var(--red); background: var(--error-surface); }
.studio-artifact { color: var(--text); background: var(--panel); border: 1px solid var(--line); }
.studio-artifact a { color: var(--ice); }
.studio-progress::after { background: var(--cyan); }
.studio-page :focus-visible { outline: 2px solid var(--ice); outline-offset: 3px; }
.advanced-studio-launch { color: #061229 !important; background: var(--silver); border: 1px solid rgba(255,255,255,.55); box-shadow: var(--glow); font-family: var(--font); }
@media(prefers-reduced-motion:reduce) { .studio-progress::after { animation: none; width: 100%; } }
:root .builder-launch{position:fixed;bottom:76px;right:24px;z-index:50;display:block;padding:13px 19px;border-radius:12px;background:#dceaff;color:#101d30;font:700 13px system-ui,sans-serif;border:1px solid #b8cce6;text-decoration:none;box-shadow:0 8px 28px #0005}
:root .builder-launch[hidden]{display:none}
/* Left navigation shared with the Hub sections. */
.hub-menu-toggle{display:none;position:fixed;left:12px;z-index:100;align-items:center;gap:9px;min-height:42px;padding:10px 14px;border:1px solid #48678d;border-radius:10px;background:#102743;color:#eef4ff;font:700 13px/1.4 system-ui,sans-serif;cursor:pointer}.hub-menu-toggle:focus-visible{outline:3px solid #9cc8ff;outline-offset:3px}
.hub-nav{position:fixed;left:0;bottom:0;width:218px;z-index:30;display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:26px 16px;overflow-y:auto;overflow-x:hidden;border-right:1px solid #243751;background:#071328;font-family:Inter,ui-sans-serif,system-ui,sans-serif}.hub-nav a{display:flex;align-items:center;min-height:45px;padding:10px 13px;border:1px solid transparent;border-radius:11px;color:#aebed5;text-decoration:none;font-size:12.5px;font-weight:650;line-height:1.4;letter-spacing:.025em;white-space:normal;overflow-wrap:anywhere}.hub-nav a:hover{color:#fff;border-color:#48678d;background:#102743}.hub-nav a[aria-current="page"]{color:#eef4ff;background:#102e5e;border-color:#48678d}.hub-nav .hub-nav-home{color:#fff}
.studio-page{padding-left:218px}.studio-page .hub-nav{top:0}.studio-page .hub-menu-toggle{top:12px}
@media(max-width:900px){.studio-page{padding-left:0}.studio-page .studio-shell{padding-top:76px}.studio-page .hub-menu-toggle{display:inline-flex}.studio-page .hub-nav{padding-top:70px;transform:translateX(-100%);visibility:hidden}.studio-page .hub-nav.is-open{transform:none;visibility:visible}}
