:root {
  --paper: #f3efee;
  --paper-strong: #fff;
  --ink: #1a1a1a;
  --black: #000;
  --lime: #cbf92b;
  --lime-soft: #cbe86b;
  --muted: #706e6b;
  --line: rgba(26, 26, 26, .14);
  --danger: #a32e25;
  --radius: 18px;
  --shadow: 0 24px 80px rgba(0, 0, 0, .12);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--paper); }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--lime-soft); outline-offset: 3px; }

.ambient { position: fixed; inset: 0; pointer-events: none; opacity: .035; background-image: radial-gradient(#000 0.7px, transparent 0.7px); background-size: 7px 7px; z-index: 10; mix-blend-mode: multiply; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; font-size: 11px; line-height: 1.12; letter-spacing: .1em; font-weight: 700; }
.brand--light { color: white; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; color: var(--black); background: var(--lime); border-radius: 50%; font-size: 19px; letter-spacing: -.06em; font-weight: 800; }
.eyebrow { margin: 0 0 13px; text-transform: uppercase; font-size: 11px; font-weight: 700; letter-spacing: .16em; }
.eyebrow--lime { color: var(--lime); }
.muted { color: var(--muted); line-height: 1.55; }
.button { border: 0; border-radius: 999px; min-height: 48px; padding: 0 22px; display: inline-flex; gap: 20px; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; transition: transform .18s ease, background .18s ease; }
.button:hover { transform: translateY(-1px); }
.button:disabled { cursor: wait; opacity: .6; }
.button--primary { background: var(--lime); color: var(--black); }
.button--dark { background: var(--ink); color: white; }
.button--ghost { background: transparent; border: 1px solid var(--line); color: var(--ink); }
.button--wide { width: 100%; justify-content: space-between; }
.icon-button { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: inherit; font-size: 22px; }
.text-button { border: 0; background: transparent; padding: 4px 0; color: var(--muted); font-size: 13px; font-weight: 700; }

.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(420px, .8fr); }
.auth-story { min-height: 100vh; padding: clamp(28px, 5vw, 72px); background: var(--ink); color: white; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.auth-story::after { content: ""; position: absolute; width: 40vw; height: 40vw; min-width: 420px; min-height: 420px; border: 1px solid rgba(203,249,43,.35); border-radius: 50%; right: -13vw; top: 17vh; box-shadow: 0 0 0 80px rgba(203,249,43,.025), 0 0 0 160px rgba(203,249,43,.018); }
.auth-message { max-width: 760px; position: relative; z-index: 1; }
.auth-message h1 { margin: 0; max-width: 720px; font-size: clamp(48px, 6vw, 96px); line-height: .95; letter-spacing: -.06em; }
.auth-message > p:last-child { max-width: 560px; margin: 30px 0 0; color: rgba(255,255,255,.66); font-size: 18px; line-height: 1.55; }
.trust-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 18px 34px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; position: relative; z-index: 1; }
.trust-list span { color: var(--lime); margin-right: 8px; }
.auth-panel { display: grid; place-items: center; padding: clamp(28px, 6vw, 92px); }
.auth-form, .loading-state { width: min(100%, 510px); }
.auth-form h2 { margin: 0; font-size: clamp(36px, 4vw, 56px); letter-spacing: -.05em; line-height: 1; }
.auth-form > .muted { margin: 18px 0 34px; }
label { display: grid; gap: 8px; margin: 18px 0; font-size: 12px; font-weight: 700; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.58); color: var(--ink); padding: 14px 15px; outline: 0; resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(203,249,43,.42); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-error { min-height: 20px; color: var(--danger); font-size: 12px; font-weight: 700; }
.field-help { color: var(--muted); font-size: 12px; line-height: 1.5; }
.brand-controls { margin: 24px 0 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; }
.brand-controls legend { padding: 0 8px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; }
.color-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.color-grid input[type="color"] { min-height: 48px; padding: 5px; }
.toggle-field { grid-template-columns: 22px 1fr; align-items: start; font-weight: 500; line-height: 1.5; }
.toggle-field input { width: 18px; height: 18px; margin-top: 2px; }

.studio { min-height: 100vh; display: grid; grid-template-columns: 220px 1fr; }
.sidebar { height: 100vh; position: sticky; top: 0; padding: 28px 20px; background: var(--paper); border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 56px; z-index: 5; }
.sidebar nav { display: grid; gap: 8px; }
.nav-item { width: 100%; border: 0; border-radius: 12px; background: transparent; color: var(--muted); display: flex; align-items: center; gap: 12px; padding: 12px; text-align: left; font-size: 13px; font-weight: 700; }
.nav-item:hover, .nav-item.is-active { color: var(--ink); background: rgba(255,255,255,.7); }
.nav-icon { width: 24px; text-align: center; font-size: 18px; }
.nav-item--logout { margin-top: auto; }
.sidebar-note { padding: 17px; border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: 10px 1fr; column-gap: 10px; font-size: 11px; }
.sidebar-note small { grid-column: 2; color: var(--muted); margin-top: 4px; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgba(203,249,43,.18); margin-top: 3px; }
.workspace { min-width: 0; }
.topbar { min-height: 92px; padding: 20px clamp(24px, 5vw, 70px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.workspace-name { margin: 0; font-size: 13px; font-weight: 700; }
.topbar-context { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.topbar-actions { display: flex; align-items: center; gap: 28px; }
.user-chip { display: flex; gap: 10px; align-items: center; font-size: 12px; }
.user-chip > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--ink); font-size: 11px; }
.user-chip div { display: grid; gap: 3px; }
.user-chip small { color: var(--muted); text-transform: capitalize; }
.content-view { padding: clamp(44px, 7vw, 100px) clamp(24px, 5vw, 70px); max-width: 1600px; margin: 0 auto; }
.home-view{max-width:1180px}.home-hero{padding:36px 0 24px}.home-hero h1{max-width:850px;margin:14px 0 18px;font-size:clamp(48px,6vw,88px);line-height:.94;letter-spacing:-.055em}.home-hero>p:not(.eyebrow){max-width:780px;color:var(--muted);font-size:18px;line-height:1.6}.home-composer{margin-top:38px;padding:18px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#171919,#101111);box-shadow:0 26px 80px rgba(0,0,0,.28)}.home-composer textarea{width:100%;min-height:170px;padding:18px;border:0;resize:vertical;background:transparent;color:var(--text);font:500 18px/1.55 inherit;outline:none}.home-composer__footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 4px 2px;border-top:1px solid var(--line)}.home-composer__footer span{color:var(--muted);font-size:13px}.home-starts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.home-starts button{display:grid;gap:8px;padding:22px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:inherit;text-align:left;cursor:pointer;transition:.2s ease}.home-starts button:hover{border-color:var(--accent);transform:translateY(-2px)}.home-starts i{color:var(--accent);font-size:24px}.home-starts span{color:var(--muted);font-size:13px}@media(max-width:760px){.home-starts{grid-template-columns:1fr}.home-composer__footer{align-items:stretch;flex-direction:column}.home-hero{padding-top:10px}.home-hero h1{font-size:48px}}
.hero-row { display: flex; align-items: end; justify-content: space-between; gap: 60px; margin-bottom: 64px; }
.hero-row h1, .project-header h1 { margin: 0; font-size: clamp(48px, 6vw, 92px); line-height: .91; letter-spacing: -.065em; }
.hero-row h1 span, .project-header h1 span { color: #86837f; }
.hero-copy { max-width: 390px; color: var(--muted); line-height: 1.6; font-size: 15px; }
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: solid var(--line); border-width: 1px 0; margin-bottom: 68px; }
.metric { padding: 28px 30px; border-right: 1px solid var(--line); }
.metric:last-child { border: 0; }
.metric strong { display: block; font-size: 38px; letter-spacing: -.05em; }
.metric span { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 24px; }
.section-heading.compact { margin-top: 20px; }
.section-heading h2 { margin: 0; font-size: 32px; letter-spacing: -.04em; }
.legend { display: flex; gap: 18px; color: var(--muted); font-size: 11px; }
.dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; }
.dot--ready { background: #5a8423; }
.dot--working { background: #d28e1f; }
.project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.project-card { min-height: 260px; padding: 25px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.46); display: flex; flex-direction: column; text-align: left; color: inherit; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.project-card__open { appearance:none; border:0; background:transparent; color:inherit; padding:0; display:flex; flex:1; min-width:0; flex-direction:column; text-align:left; cursor:pointer; }
.project-card__actions { display:flex; gap:8px; padding-top:14px; margin-top:14px; border-top:1px solid var(--line); }
.project-card__actions button,.project-filters button { border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:999px; padding:8px 12px; font:inherit; font-size:11px; cursor:pointer; }
.project-card__actions button:hover,.project-filters button.is-active { color:var(--text); border-color:var(--accent); }
.project-card__actions button.is-danger:hover { color:#ff7562; border-color:#ff7562; }
.project-filters { display:flex; gap:8px; }
.project-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); background: white; }
.project-card__top { display: flex; justify-content: space-between; align-items: center; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.project-card h3 { margin: auto 0 12px; font-size: 28px; line-height: 1.05; letter-spacing: -.04em; }
.project-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.project-card__footer { border-top: 1px solid var(--line); padding-top: 17px; margin-top: 24px; display: flex; justify-content: space-between; font-size: 11px; }
.empty-card { grid-column: 1 / -1; padding: 60px; text-align: center; border: 1px dashed var(--line); border-radius: var(--radius); }
.project-header { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin: 40px 0 70px; }
.project-header h1 { font-size: clamp(48px, 6vw, 82px); max-width: 900px; }
.project-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; }
.job-list { display: grid; gap: 12px; }
.job-card { border: 1px solid var(--line); background: rgba(255,255,255,.48); border-radius: 15px; padding: 20px; }
.job-card__top { display: flex; justify-content: space-between; gap: 20px; }
.job-card h3 { margin: 0; font-size: 16px; }
.job-card time { color: var(--muted); font-size: 11px; }
.job-stage { display: inline-flex; padding: 6px 10px; border-radius: 999px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; background: #e5e1df; }
.job-stage--succeeded { background: var(--lime-soft); }
.job-stage--failed, .job-stage--blocked { color: white; background: var(--ink); }
.progress { appearance: none; display: block; width: 100%; height: 4px; margin: 18px 0; border: 0; overflow: hidden; border-radius: 3px; background: #dedad7; }
.progress::-webkit-progress-bar { background: #dedad7; }
.progress::-webkit-progress-value { background: var(--ink); transition: width .25s; }
.progress::-moz-progress-bar { background: var(--ink); }
.job-live-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:8px; color:#77716a; font-size:10px; }.job-live-meta b { color:#24201c; }.job-live-meta--cost { padding:8px 10px; border-radius:10px; background:#f1f5e9; }.job-live-meta--cost b { color:#547000; }
.job-error { color: var(--danger); font-size: 12px; }
.artifact-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.artifact-link, .edit-button { border: 1px solid var(--line); border-radius: 999px; padding: 8px 12px; background: transparent; color: var(--ink); text-decoration: none; font-size: 11px; font-weight: 700; }
.validate-button { border: 0; border-radius: 999px; padding: 9px 13px; background: var(--lime); color: var(--black); font-size: 11px; font-weight: 700; }
.runtime-chip { border-radius: 999px; padding: 8px 12px; background: #e5e1df; color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.artifact-link--primary { background: var(--ink); color: white; }
.artifact-link--locked { display: inline-flex; align-items: center; gap: 7px; cursor: not-allowed; color: var(--muted); background: color-mix(in srgb, var(--panel) 88%, var(--ink)); }
.artifact-requirements { flex-basis: 100%; margin: 10px 0 0; max-width: 760px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.artifact-requirements a { color: var(--accent); text-underline-offset: 3px; }
.visual-preview-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 10px; margin-top: 20px; }
.visual-preview-grid figure { margin: 0; min-width: 0; }
.visual-preview-grid a { display: block; border-radius: 10px; transition: transform .2s ease, box-shadow .2s ease; }
.visual-preview-grid a:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(0, 0, 0, .22); }
.visual-preview-grid img { display: block; width: 100%; height: 220px; object-fit: cover; object-position: top; border: 1px solid var(--line); border-radius: 10px; background: white; }
.visual-preview-grid figcaption { margin-top: 7px; color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.interactive-preview-action { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; padding: 16px 18px; border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--accent) 9%, var(--surface)); }
.interactive-preview-action div { display: grid; gap: 4px; }
.interactive-preview-action b { font-size: 13px; }
.interactive-preview-action small { color: var(--muted); line-height: 1.45; }
.interactive-preview-action .button { flex: 0 0 auto; min-height: 42px; }
.visual-approval-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.visual-approval-actions .button { min-height: 42px; font-size: 11px; }
.validation-card { align-self: start; position: sticky; top: 30px; border-radius: var(--radius); background: var(--ink); color: white; padding: 28px; }
.validation-index { color: var(--lime); font-size: 10px; letter-spacing: .13em; }
.validation-card h3 { font-size: 28px; letter-spacing: -.04em; line-height: 1; margin: 38px 0 16px; }
.validation-card p { color: rgba(255,255,255,.62); font-size: 13px; line-height: 1.6; }
.validation-state { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid rgba(255,255,255,.18); margin-top: 30px; padding-top: 17px; font-size: 10px; }
.validation-state span { color: rgba(255,255,255,.5); }
.preview-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 18px 0 12px; }
.preview-tab { border: 1px solid rgba(255,255,255,.2); border-radius: 999px; padding: 7px 10px; background: transparent; color: rgba(255,255,255,.65); font-size: 9px; text-transform: uppercase; }
.preview-tab.is-active { border-color: var(--lime); color: var(--lime); }
.runtime-preview { width: 100%; max-height: 360px; object-fit: cover; object-position: top; border-radius: 10px; background: white; }
.validation-page-preview { margin: 20px 0; }
.validation-page-preview figcaption { margin-bottom: 10px; font-weight: 600; text-transform: capitalize; }
.validation-page-preview a { display: block; border-radius: 10px; }
.validation-page-preview a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.runtime-progress { appearance: none; width: 100%; height: 5px; margin-top: 20px; border: 0; background: rgba(255,255,255,.16); }
.runtime-progress::-webkit-progress-bar { background: rgba(255,255,255,.16); }
.runtime-progress::-webkit-progress-value, .runtime-progress::-moz-progress-bar { background: var(--lime); }
.capability-list { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.capability-group { border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; }
.capability-group h2 { margin: 0 0 24px; font-size: 26px; }
.capability-item { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 0; border-top: 1px solid var(--line); font-size: 13px; }
.capability-item code { color: var(--muted); font-size: 10px; }

.dialog { width: min(620px, calc(100vw - 32px)); border: 0; border-radius: 22px; padding: 0; background: var(--paper); box-shadow: var(--shadow); }
.dialog--wide { width: min(780px, calc(100vw - 32px)); }
.dialog::backdrop { background: rgba(0,0,0,.62); backdrop-filter: blur(7px); }
.dialog form { padding: 32px; }
.dialog-top { display: flex; align-items: start; justify-content: space-between; gap: 30px; margin-bottom: 24px; }
.dialog h2 { margin: 0; font-size: 36px; letter-spacing: -.05em; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 26px; }
.source-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.source-tab { border: 0; border-bottom: 3px solid transparent; background: transparent; padding: 13px 16px; color: var(--muted); font-size: 12px; font-weight: 700; }
.source-tab.is-active { color: var(--ink); border-color: var(--lime); }
.source-tab.is-disabled { cursor: not-allowed; opacity: .45; }
.source-tab small { display: block; font-size: 8px; margin-top: 3px; }
.toast { position: fixed; right: 24px; bottom: 24px; max-width: 380px; transform: translateY(150%); opacity: 0; padding: 15px 20px; border-radius: 12px; background: var(--ink); color: white; font-size: 13px; box-shadow: var(--shadow); transition: .25s; z-index: 20; }
.toast.is-visible { transform: translateY(0); opacity: 1; }
.toast { border:1px solid #353938; background:#151718!important; color:#fff!important; font-weight:700; }
.toast[data-tone="error"] { border-color:#ff654f; background:#241311!important; }
.toast[data-tone="success"] { border-color:#6ccf93; background:#102019!important; }
.mobile-only { display: none; }
.credit-pill { min-height:44px; display:flex; align-items:center; gap:7px; padding:0 14px; border:1px solid #d7dfca; border-radius:999px; background:#f7fadf; color:var(--ink); }
.credit-pill strong { font-size:16px; }.credit-pill span { color:var(--muted); font-size:11px; }
.billing-hero { display:grid; grid-template-columns:1.25fr .75fr; align-items:end; gap:70px; margin-bottom:72px; }
.billing-hero h1 { margin:8px 0 22px; font-size:clamp(54px,6vw,84px); line-height:.94; letter-spacing:-.07em; }.billing-hero h1 span { color:#596f04; }.billing-hero>div>p:last-child { max-width:650px; color:var(--muted); line-height:1.65; }
.billing-summary { min-height:270px; padding:30px; border-radius:24px; background:radial-gradient(circle at 90% 10%,rgba(215,255,47,.32),transparent 34%),#050814; color:white; box-shadow:var(--shadow); }
.billing-summary>span { color:#aeb5c7; font-size:11px; text-transform:uppercase; letter-spacing:.14em; }.billing-summary>strong { display:block; margin:8px 0 38px; color:#d7ff2f; font-size:25px; }.billing-summary div { display:flex; align-items:end; gap:12px; }.billing-summary b { font-size:72px; line-height:.8; letter-spacing:-.08em; }.billing-summary small,.billing-summary p { color:#939caf; }.billing-summary p { margin-top:28px; font-size:12px; }
.billing-breakdown strong { color:var(--accent); font-size:inherit; letter-spacing:0; }
.billing-plan-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.billing-plan { position:relative; min-height:400px; display:flex; flex-direction:column; padding:28px; border:1px solid var(--line); border-radius:18px; background:white; }.billing-plan.is-featured { border-color:#263cff; box-shadow:0 18px 50px rgba(38,60,255,.1); }.billing-plan.is-selected::before { content:'Tu selección'; position:absolute; right:18px; top:18px; padding:5px 8px; border-radius:5px; background:#d7ff2f; font-size:9px; font-weight:800; text-transform:uppercase; }.billing-plan>span { color:var(--muted); font-size:12px; font-weight:800; text-transform:uppercase; }.billing-plan h3 { margin:24px 0 8px; font-size:36px; letter-spacing:-.05em; }.billing-plan h3 small { font-size:12px; color:var(--muted); }.billing-plan p { color:var(--muted); }.billing-plan ul { list-style:none; padding:18px 0 30px; margin:0; }.billing-plan li { padding:9px 0; border-bottom:1px solid var(--line); font-size:12px; }.billing-plan .button { margin-top:auto; }.billing-notice { margin:28px 0 0; color:var(--muted); font-size:12px; }
.danger-zone { margin-top:72px; padding:28px; display:flex; align-items:center; justify-content:space-between; gap:30px; border:1px solid rgba(190,38,38,.28); border-radius:18px; background:#fff8f7; }.danger-zone h2 { margin:4px 0 8px; }.danger-zone p:last-child { margin:0; color:var(--muted); }.button--danger { border:1px solid #a92323; background:#b62b2b; color:white; }.button--danger:hover { background:#921d1d; }.dialog--danger { border:1px solid rgba(190,38,38,.35); }.dialog--danger strong { color:#a92323; }

/* Guided production copilot */
.project-header--copilot { margin:34px 0 34px; align-items:center; }.project-header--copilot h1 { font-size:clamp(42px,5vw,66px); line-height:.96; }.project-header--copilot .muted { max-width:720px; margin:14px 0 0; }.project-header-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }.privacy-badge { display:inline-flex; align-items:center; gap:7px; padding:9px 12px; border:1px solid #d3dec1; border-radius:999px; background:#f5fadf; color:#536414; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.privacy-badge::before { content:""; width:7px; height:7px; border-radius:50%; background:#7fa51c; box-shadow:0 0 0 4px rgba(127,165,28,.14); }
.copilot-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:22px; align-items:start; }.copilot-shell { min-height:680px; display:flex; flex-direction:column; overflow:hidden; border:1px solid #d8d6d2; border-radius:24px; background:rgba(255,255,255,.74); box-shadow:0 20px 60px rgba(28,25,22,.07); }.copilot-topbar { min-height:76px; padding:16px 20px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); background:rgba(250,249,247,.86); backdrop-filter:blur(14px); }.copilot-topbar>div { display:flex; align-items:center; gap:12px; }.copilot-topbar strong,.copilot-topbar small { display:block; }.copilot-topbar small { margin-top:3px; color:var(--muted); font-size:10px; }.copilot-topbar small i { display:inline-block; width:6px; height:6px; margin-right:5px; border-radius:50%; background:#79a31a; }.copilot-avatar { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:radial-gradient(circle at 30% 20%,#d7ff2f,transparent 38%),#0a0e18; color:white; font-weight:900; }.stage-pill { padding:7px 10px; border-radius:999px; background:#edeae7; color:#66615c; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.assistant-thread { flex:1; min-height:330px; max-height:560px; overflow:auto; padding:28px 24px 12px; scroll-behavior:smooth; }.chat-message { width:min(82%,680px); margin-bottom:18px; }.chat-message--user { margin-left:auto; }.chat-message__label { display:flex; justify-content:space-between; gap:12px; margin:0 4px 6px; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }.chat-message__bubble { padding:15px 17px; border:1px solid var(--line); border-radius:17px 17px 17px 5px; background:white; font-size:14px; line-height:1.58; white-space:pre-wrap; }.chat-message--user .chat-message__bubble { border-color:#111722; border-radius:17px 17px 5px 17px; background:#111722; color:white; }.chat-message__attachments { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }.chat-message__attachments span { padding:5px 8px; border-radius:7px; background:rgba(255,255,255,.12); font-size:9px; }.chat-status { display:inline-block; margin-top:8px; color:#7a756e; font-size:10px; }
.assistant-suggestions { padding:8px 20px 14px; display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:8px; }.suggestion-chip { min-width:0; padding:12px 14px; border:1px solid #d7d3ce; border-radius:14px; background:#faf9f7; color:#27231f; font-size:11px; text-align:left; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }.suggestion-chip span { display:grid; gap:4px; }.suggestion-chip strong { font-size:12px; }.suggestion-chip em { font-style:normal; line-height:1.35; color:#77716b; }.suggestion-chip:hover { border-color:#ff644f; background:#fff7f4; }.suggestion-chip small { flex:0 0 auto; color:#d74b39; white-space:nowrap; }
.assistant-primary-action{margin:4px 20px 14px;padding:16px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;border:1px solid rgba(255,100,76,.46);border-radius:15px;background:linear-gradient(120deg,rgba(255,100,76,.13),rgba(255,100,76,.025)),#151313}.assistant-primary-action[hidden]{display:none}.assistant-primary-action>div{display:flex;align-items:center;gap:12px;min-width:0}.assistant-primary-action>div>i{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:var(--accent);color:#090909;font-size:19px}.assistant-primary-action strong,.assistant-primary-action small{display:block}.assistant-primary-action strong{font-size:13px}.assistant-primary-action small{margin-top:4px;color:var(--muted);font-size:9px;line-height:1.45}.assistant-primary-action .button{min-width:190px;align-items:flex-start;flex-direction:column;gap:2px}.assistant-primary-action .button small{font-size:8px;opacity:.72}
.assistant-composer { margin:0 18px 10px; padding:12px; border:1px solid #c9c5bf; border-radius:18px; background:white; box-shadow:0 8px 24px rgba(32,28,24,.06); }.assistant-composer:focus-within { border-color:#93a839; box-shadow:0 0 0 3px rgba(203,249,43,.22),0 8px 24px rgba(32,28,24,.06); }.assistant-composer textarea { min-height:66px; max-height:180px; margin:0; padding:6px; border:0; border-radius:0; background:transparent; box-shadow:none!important; resize:none; font-size:14px; line-height:1.5; }.composer-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }.composer-toolbar>div { display:flex; align-items:center; gap:5px; }.attach-button,.composer-option { min-height:34px; padding:0 10px; display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:9px; background:#f8f7f5; color:#5c5751; font-size:10px; font-weight:700; cursor:pointer; }.send-button { min-height:38px; padding:0 13px; display:inline-flex; align-items:center; gap:12px; border:0; border-radius:10px; background:#111722; color:white; font-size:11px; font-weight:800; }.send-button span { width:20px; height:20px; display:grid; place-items:center; border-radius:6px; background:var(--lime); color:#111722; }.assistant-composer .form-error { min-height:0; margin:7px 5px 0; }.assistant-attachments { display:flex; gap:7px; padding:0 4px 9px; overflow:auto; }.attachment-preview { position:relative; flex:0 0 64px; height:52px; overflow:hidden; border:1px solid var(--line); border-radius:9px; }.attachment-preview img { width:100%; height:100%; object-fit:cover; }.attachment-preview button { position:absolute; right:3px; top:3px; width:18px; height:18px; padding:0; border:0; border-radius:50%; background:rgba(0,0,0,.72); color:white; font-size:11px; }.composer-cost { min-height:38px; padding:0 22px 14px; display:flex; align-items:center; justify-content:space-between; gap:15px; color:#77716b; font-size:10px; }.composer-cost strong { color:#34302c; }
.project-cockpit { display:grid; gap:12px; }.cockpit-card { padding:21px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.62); }.cockpit-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:17px; }.cockpit-heading span,.cockpit-card>span { color:#7b756e; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }.cockpit-heading strong { font-size:12px; }.workflow-steps { display:grid; gap:0; }.workflow-step { position:relative; min-height:43px; display:grid; grid-template-columns:24px 1fr; align-items:start; gap:8px; color:#8b857e; font-size:11px; }.workflow-step::after { content:""; position:absolute; left:8px; top:19px; bottom:-2px; width:1px; background:#ddd8d2; }.workflow-step:last-child::after { display:none; }.workflow-step i { width:17px; height:17px; display:grid; place-items:center; border:1px solid #cfc9c2; border-radius:50%; background:#f6f4f1; color:transparent; font-style:normal; font-size:9px; }.workflow-step.is-complete { color:#35312d; }.workflow-step.is-complete i { border-color:#93aa2b; background:#dfff62; color:#273100; }.workflow-step.is-current { color:#16130f; font-weight:800; }.workflow-step.is-current i { border-color:#16130f; background:#16130f; box-shadow:0 0 0 4px rgba(203,249,43,.38); }.cockpit-card--credits { background:radial-gradient(circle at 95% 0,rgba(215,255,47,.38),transparent 38%),#111722; color:white; }.cockpit-card--credits>span { color:#aeb5c0; }.cockpit-card--credits>strong { display:block; margin:12px 0 5px; color:#d7ff2f; font-size:25px; letter-spacing:-.04em; }.cockpit-card--credits p { color:#aeb5c0; font-size:11px; line-height:1.55; }.cockpit-card--credits .text-button { color:white; }.safety-card p { margin:10px 0; color:#615c56; font-size:11px; line-height:1.55; }.safety-card small { color:#8b857e; font-size:9px; }.technical-history { margin-top:24px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.42); }.technical-history>summary { padding:18px 22px; display:flex; align-items:center; justify-content:space-between; gap:18px; cursor:pointer; font-weight:800; list-style:none; }.technical-history>summary::-webkit-details-marker { display:none; }.technical-history>summary small { color:var(--muted); font-weight:500; }.project-layout--history { padding:10px 22px 24px; }
.technical-history { overflow:hidden; transition:border-color .2s ease,background .2s ease; }
.technical-history[open] { border-color:rgba(255,92,63,.38); }
.technical-history>summary { min-height:82px; padding:16px 18px; border-radius:17px; transition:background .18s ease; }
.technical-history>summary:hover { background:rgba(255,255,255,.04); }
.technical-history>summary:focus-visible { outline:2px solid var(--accent); outline-offset:-3px; }
.technical-history__heading { min-width:0; display:flex; align-items:center; gap:13px; }
.technical-history__heading>span { min-width:0; display:grid; gap:4px; }
.technical-history__heading strong { font-size:14px; line-height:1.25; }
.technical-history__heading small { color:var(--muted); font-size:11px; font-weight:500; line-height:1.4; }
.technical-history__icon { flex:0 0 auto; width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--line); border-radius:12px; background:rgba(255,92,63,.1); color:var(--accent); font-size:18px; }
.technical-history__action { flex:0 0 auto; min-height:38px; padding:0 12px; display:flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:11px; font-weight:700; }
.technical-history__action i { font-size:14px; transition:transform .2s ease; }
.technical-history__open-label { display:none; }
.technical-history[open] .technical-history__closed-label { display:none; }
.technical-history[open] .technical-history__open-label { display:inline; }
.technical-history[open] .technical-history__action i { transform:rotate(180deg); }
.benchmark-card { background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(241,245,234,.72)); }.benchmark-card .cockpit-heading strong[data-status="passed"] { color:#547000; }.benchmark-card .cockpit-heading strong[data-status="failed"] { color:#b3261e; }.benchmark-card .cockpit-heading strong[data-status="measuring"] { color:#263cff; }.benchmark-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.benchmark-metrics>div { min-width:0; padding:10px 8px; border:1px solid rgba(22,19,15,.08); border-radius:12px; background:rgba(255,255,255,.66); }.benchmark-metrics span,.benchmark-metrics small { display:block; color:#817b73; font-size:8px; line-height:1.35; }.benchmark-metrics strong { display:block; margin:5px 0 3px; color:#17140f; font-size:15px; letter-spacing:-.04em; }
.benchmark-phases { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }.benchmark-phases span { display:flex; align-items:center; gap:5px; padding:5px 7px; border-radius:999px; background:#17140f; color:white; font-size:8px; }.benchmark-phases i { color:#b8b1aa; font-style:normal; }.benchmark-phases b { color:#d7ff2f; font-size:8px; }

@media (max-width: 1080px) {
  .copilot-layout { grid-template-columns:1fr; }.project-cockpit { grid-template-columns:repeat(3,1fr); }.project-cockpit .cockpit-card { min-width:0; }
  .billing-plan-grid { grid-template-columns:repeat(2,1fr); }
  .project-grid { grid-template-columns: repeat(2, 1fr); }
  .project-layout { grid-template-columns: 1fr; }
  .validation-card { position: static; }
  .auth-layout { grid-template-columns: 1fr 460px; }
}

@media (max-width: 820px) {
  .interactive-preview-action { align-items: stretch; flex-direction: column; }
  .interactive-preview-action .button { width: 100%; }
  .project-cockpit { grid-template-columns:1fr; }.project-header-actions { width:100%; }.copilot-shell { min-height:620px; }
  .billing-hero { grid-template-columns:1fr; gap:32px; }
  .danger-zone { align-items:flex-start; flex-direction:column; }
  .auth-layout { display: block; }
  .auth-story { min-height: 52vh; }
  .auth-panel { min-height: 48vh; }
  .trust-list { display: none; }
  .studio { display: block; }
  .sidebar { position: fixed; left: 0; transform: translateX(-105%); width: 230px; box-shadow: var(--shadow); transition: transform .2s; }
  .sidebar.is-open { transform: none; }
  .mobile-only { display: grid; }
  .topbar { padding: 16px 22px; gap: 12px; }
  .topbar > div:first-of-type { display: none; }
  .user-chip div { display: none; }
  .hero-row, .project-header { align-items: start; flex-direction: column; }
  .hero-row { margin-bottom: 42px; }
  .hero-copy { max-width: 560px; }
  .metric-grid { grid-template-columns: 1fr; }
  .metric { border-right: 0; border-bottom: 1px solid var(--line); }
  .project-grid, .capability-list { grid-template-columns: 1fr; }
  .visual-preview-grid { grid-template-columns: 1fr 1fr; }
  .visual-preview-grid figure:first-child { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
  .project-header--copilot h1 { font-size:42px; }.project-header--copilot { margin-bottom:26px; }.privacy-badge { display:none; }.project-header-actions .button { width:100%; }.copilot-shell { border-radius:17px; }.copilot-topbar { padding:13px; }.stage-pill { display:none; }.assistant-thread { padding:20px 13px 8px; }.chat-message { width:92%; }.assistant-composer { margin:0 9px 8px; }.composer-cost { padding:0 13px 12px; flex-wrap:wrap; }.assistant-suggestions { padding-left:10px; padding-right:10px; }.technical-history>summary { min-height:72px; padding:13px; gap:10px; }.technical-history__heading { gap:10px; }.technical-history__icon { width:36px; height:36px; border-radius:10px; }.technical-history__heading small { max-width:30ch; }.technical-history__action { width:38px; min-height:38px; padding:0; justify-content:center; }.technical-history__action span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }.project-layout--history { padding:8px 12px 18px; }
  .credit-pill span { display:none; }.billing-plan-grid { grid-template-columns:1fr; }.billing-hero h1 { font-size:52px; }.billing-summary { min-height:235px; }.billing-summary b { font-size:60px; }
  .auth-story { padding: 28px 22px; min-height: 48vh; }
  .auth-message h1 { font-size: 45px; }
  .auth-message > p:last-child { font-size: 15px; }
  .auth-panel { padding: 42px 22px; }
  .field-row { grid-template-columns: 1fr; gap: 0; }
  .color-grid { grid-template-columns: repeat(2, 1fr); }
  .topbar-actions { gap: 9px; }
  .topbar .button { min-height: 42px; padding: 0 14px; font-size: 0; gap: 0; }
  .topbar .button span { font-size: 18px; }
  .content-view { padding: 48px 20px; }
  .hero-row h1, .project-header h1 { font-size: 48px; }
  .project-header { margin-bottom: 45px; }
  .section-heading { align-items: start; gap: 20px; flex-direction: column; }
  .project-card { min-height: 220px; }
  .dialog form { padding: 24px 20px; }
  .dialog h2 { font-size: 30px; }
  .source-tabs { overflow-x: auto; }
  .dialog-actions { flex-direction: column-reverse; }
  .dialog-actions .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* GALI Sites marketing */
.marketing { --night:#050814; --night-2:#091020; --signal:#d7ff2f; --cobalt:#263cff; --violet:#775cff; --cloud:#f6f7fb; position:relative; min-height:100vh; overflow:hidden; color:var(--cloud); background:var(--night); font-family:Inter,"Helvetica Neue",Arial,sans-serif; }
.marketing h1,.marketing h2,.marketing h3 { font-family:"Space Grotesk",Inter,"Helvetica Neue",Arial,sans-serif; letter-spacing:-.045em; }
.marketing a { color:inherit; text-decoration:none; }
.marketing button { font:inherit; }
.marketing-nav { width:min(1480px,calc(100% - 64px)); height:84px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:28px; border-bottom:1px solid rgba(255,255,255,.1); position:relative; z-index:20; }
.marketing-logo { display:block; width:158px; height:52px; overflow:hidden; }
.marketing-logo img,.marketing-footer img { width:100%; height:100%; object-fit:cover; }
.marketing-links,.marketing-actions { display:flex; align-items:center; gap:30px; }
.marketing-links a,.link-button { color:#c9cddd; font-size:14px; border:0; background:none; padding:0; }
.marketing-links a:hover,.link-button:hover { color:white; }
.cta-button { border:0; border-radius:8px; background:var(--signal); color:#050814; min-height:46px; padding:0 20px; display:inline-flex; align-items:center; justify-content:center; gap:28px; font-weight:800; box-shadow:0 0 26px rgba(215,255,47,.18); }
.cta-button:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(215,255,47,.25); }
.cta-button--large { min-height:58px; padding:0 26px; }
.marketing-menu { display:none; }
.marketing-hero { width:min(1480px,calc(100% - 64px)); margin:auto; min-height:700px; padding:92px 0 72px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:54px; position:relative; }
.hero-glow { position:absolute; pointer-events:none; filter:blur(38px); opacity:.34; border-radius:50%; }
.hero-glow--one { width:440px; height:360px; left:-260px; top:140px; background:#263cff; }
.hero-glow--two { width:520px; height:360px; right:120px; bottom:0; background:#775cff; opacity:.2; }
.hero-content,.composer-card { position:relative; z-index:2; min-width:0; }
.marketing-kicker { color:#99a6ff; text-transform:uppercase; letter-spacing:.16em; font-size:11px; font-weight:800; margin:0 0 22px; }
.marketing-hero h1 { font-size:clamp(52px,4.6vw,72px); line-height:.98; margin:0; max-width:760px; }
.marketing-hero h1 span { color:var(--signal); }
.marketing-lead { max-width:640px; color:#aeb5c7; font-size:18px; line-height:1.65; margin:28px 0 30px; }
.hero-actions { display:flex; align-items:center; gap:28px; }
.watch-link { color:white; font-weight:700; border-bottom:1px solid rgba(255,255,255,.4); padding-bottom:4px; }
.trust-line { display:flex; flex-wrap:wrap; gap:22px; color:#aeb5c7; font-size:13px; margin:22px 0 34px; }
.trust-line span::before { content:""; display:inline-block; width:7px; height:7px; margin-right:8px; border:1px solid var(--signal); border-radius:50%; }
.rating-line { display:flex; gap:14px; align-items:center; color:#8e96aa; font-size:13px; }
.rating-line strong { color:var(--signal); font-size:16px; }
.composer-card { border:1px solid rgba(130,143,255,.32); background:rgba(9,16,32,.82); box-shadow:0 30px 100px rgba(13,33,132,.32); border-radius:18px; padding:18px; backdrop-filter:blur(16px); }
.composer-tabs { display:flex; gap:8px; border-bottom:1px solid rgba(255,255,255,.1); margin-bottom:14px; }
.composer-tabs button { color:#9da5b9; border:0; border-bottom:2px solid transparent; padding:11px 20px; background:none; font-weight:700; }
.composer-tabs button.is-active { color:white; border-color:var(--violet); }
.composer-input { display:flex; gap:18px; align-items:center; padding:14px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:rgba(255,255,255,.035); }
.composer-input p { flex:1; margin:0; color:#d8dbea; line-height:1.5; font-size:14px; }
.composer-input button { border:0; border-radius:8px; background:var(--signal); color:#050814; min-height:44px; padding:0 18px; font-weight:800; }
.composer-progress { display:grid; grid-template-columns:1fr auto; gap:8px; color:#929aae; font-size:12px; margin:13px 0; }
.composer-progress i { grid-column:1/-1; height:5px; border-radius:99px; background:linear-gradient(90deg,var(--violet) 78%,rgba(255,255,255,.09) 78%); }
.site-preview { height:350px; overflow:hidden; border-radius:10px; background:#ebe7e5; }
.site-preview img { width:100%; height:100%; object-fit:cover; object-position:center 18%; }
.composer-status { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; }
.composer-status span { padding:10px 6px; border:1px solid rgba(215,255,47,.2); border-radius:8px; text-align:center; color:#cbd0df; font-size:11px; }
.compatibility { width:min(1340px,calc(100% - 64px)); margin:auto; padding:28px 0 40px; display:flex; justify-content:center; flex-wrap:wrap; gap:50px; border-bottom:1px solid rgba(255,255,255,.1); color:#828aa0; }
.compatibility span { text-transform:uppercase; letter-spacing:.12em; font-size:10px; }
.compatibility strong { color:#b8bfd0; font-size:16px; }
.section-shell { width:min(1340px,calc(100% - 64px)); margin:0 auto; padding:110px 0; }
.seo-paths { display:grid; grid-template-columns:repeat(3,1fr); padding-top:90px; padding-bottom:70px; }
.seo-paths article { padding:0 38px; border-right:1px solid rgba(255,255,255,.1); }
.seo-paths article:first-child { padding-left:0; }.seo-paths article:last-child { border:0; padding-right:0; }
.seo-paths h2 { font-size:34px; margin:0 0 18px; }.seo-paths article>p:not(.marketing-kicker) { color:#9da5b9; line-height:1.65; min-height:82px; }
.path-flow { display:flex; align-items:center; gap:12px; margin:28px 0; }.path-flow span { flex:1; padding:16px; border:1px solid rgba(255,255,255,.12); border-radius:9px; background:#0a1121; font-size:12px; }.path-flow b { color:var(--signal); }
.marketing ul { list-style:none; padding:0; margin:0; }.marketing li { color:#b7bece; margin:12px 0; }.marketing li::before { content:""; width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:10px; background:var(--signal); }
.product-story { display:grid; grid-template-columns:.76fr 1.24fr; align-items:center; gap:70px; }.product-story-copy h2 { max-width:580px; margin:0 0 22px; font-size:clamp(45px,5vw,68px); line-height:.96; }.product-story-copy>p:not(.marketing-kicker) { max-width:570px; color:#aeb6c8; font-size:17px; line-height:1.65; }.product-story-copy ul { margin:30px 0!important; }.product-ui-demo { min-width:0; padding:12px; display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:10px; border:1px solid rgba(255,255,255,.14); border-radius:22px; background:linear-gradient(145deg,rgba(119,92,255,.16),rgba(255,255,255,.035)); box-shadow:0 34px 100px rgba(0,0,0,.34); }.demo-chat,.demo-route { border:1px solid rgba(255,255,255,.1); border-radius:15px; background:#0a1020; }.demo-chat { min-height:500px; padding-bottom:14px; display:flex; flex-direction:column; }.demo-chat header { padding:15px; display:flex; align-items:center; gap:10px; border-bottom:1px solid rgba(255,255,255,.09); }.demo-chat header>span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--signal); color:#050814; font-weight:900; }.demo-chat header div { min-width:0; }.demo-chat header strong,.demo-chat header small { display:block; }.demo-chat header small { margin-top:3px; color:#818ba1; font-size:9px; }.demo-chat header em { margin-left:auto; padding:6px 8px; border-radius:999px; background:rgba(215,255,47,.1); color:var(--signal); font-size:9px; font-style:normal; }.demo-message { max-width:78%; margin:20px 16px 0; padding:13px; border:1px solid rgba(255,255,255,.11); border-radius:13px 13px 13px 4px; color:#c7cede; background:#111a2d; font-size:11px; line-height:1.55; }.demo-message--user { align-self:flex-end; border-radius:13px 13px 4px 13px; background:#f4f6fb; color:#111727; }.demo-suggestions { margin:auto 13px 10px; display:flex; gap:5px; overflow:hidden; }.demo-suggestions span { flex:0 0 auto; padding:7px 9px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:#b4bed1; font-size:8px; }.demo-suggestions b { color:var(--signal); }.demo-composer { margin:0 12px; min-height:55px; padding:9px 10px; display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid rgba(255,255,255,.16); border-radius:12px; color:#7f899e; font-size:9px; }.demo-composer button { border:0; border-radius:8px; padding:9px; background:var(--signal); color:#050814; font-size:9px; font-weight:800; }.demo-route { padding:17px; }.demo-route>span { color:#778299; font-size:8px; text-transform:uppercase; letter-spacing:.14em; }.demo-route ol { padding:20px 0 25px 18px; margin:0; border-bottom:1px solid rgba(255,255,255,.1); }.demo-route li { position:relative; margin:0 0 22px; color:#737d91; font-size:9px; }.demo-route li::before { position:absolute; left:-18px; top:3px; width:7px; height:7px; margin:0; border:1px solid #536078; background:#0a1020; }.demo-route li.done { color:#c2cad8; }.demo-route li.done::before { border-color:var(--signal); background:var(--signal); }.demo-route li.active { color:white; font-weight:800; }.demo-route li.active::before { border-color:white; box-shadow:0 0 0 4px rgba(215,255,47,.2); }.demo-route>div { margin-top:18px; }.demo-route small { color:#768197; font-size:8px; }.demo-route strong { display:block; margin:8px 0; color:var(--signal); font-size:20px; }.demo-route p { color:#8f98aa; font-size:9px; line-height:1.5; }.security-strip { padding-top:22px; padding-bottom:22px; display:grid; grid-template-columns:repeat(3,1fr); border:solid rgba(255,255,255,.1); border-width:1px 0; }.security-strip>div { padding:20px 30px; border-right:1px solid rgba(255,255,255,.1); }.security-strip>div:last-child { border:0; }.security-strip strong,.security-strip span { display:block; }.security-strip strong { color:white; font-size:13px; }.security-strip span { margin-top:7px; color:#858fa3; font-size:10px; line-height:1.5; }
.workflow,.before-after,.examples,.manual-vs,.pricing,.faq { border-top:1px solid rgba(255,255,255,.09); }
.section-intro { text-align:center; max-width:790px; margin:0 auto 58px; }.section-intro h2 { font-size:clamp(40px,5vw,62px); line-height:1.02; margin:0 0 16px; }.section-intro>p:last-child { color:#9ba3b7; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.steps article { padding:28px; min-height:210px; border:1px solid rgba(255,255,255,.12); background:#08101e; border-radius:14px; }.steps article>span { color:#7f8dff; font-size:12px; font-weight:800; }.steps h3 { font-size:23px; margin:55px 0 10px; }.steps p { color:#8f98ac; line-height:1.5; }.steps .step-highlight { border-color:var(--signal); box-shadow:inset 0 0 35px rgba(215,255,47,.06); }
.comparison-stage { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.comparison-pane { padding:16px; border:1px solid rgba(255,255,255,.14); border-radius:16px; background:#0a1120; overflow:hidden; }.comparison-pane>span { display:block; color:#a7aec0; font-size:12px; margin:3px 0 14px; }.comparison-pane img { width:100%; height:430px; object-fit:cover; border-radius:10px; }.comparison-pane--editor { position:relative; padding-right:142px; }.editor-tools { position:absolute; right:16px; top:47px; width:112px; min-height:430px; display:flex; flex-direction:column; gap:18px; padding:18px 12px; background:#12192a; border-radius:10px; color:#aeb5c5; font-size:11px; }.editor-tools b { color:white; }
.proof-strip { padding:48px; border:1px solid rgba(119,92,255,.34); border-radius:18px; display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:center; background:linear-gradient(110deg,rgba(38,60,255,.09),rgba(119,92,255,.06)); }.proof-strip>div { display:flex; flex-direction:column; gap:10px; }.proof-strip strong { color:var(--signal); font-size:25px; }.proof-strip span,.proof-strip blockquote { color:#b5bdce; line-height:1.6; }.proof-strip blockquote { margin:0; font-size:20px; }.proof-strip cite { display:block; color:#7e879d; font-size:12px; margin-top:14px; }
.example-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.example-grid article { position:relative; aspect-ratio:16/8; padding:26px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:#0a1120; }.example-grid article::after { content:""; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,rgba(5,8,20,.96)); }.example-grid img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }.example-grid article:nth-child(2n) img { object-position:center 35%; }.example-grid span,.example-grid strong { position:relative; z-index:1; }.example-grid span { color:#c7cddd; font-size:11px; text-transform:uppercase; letter-spacing:.14em; }.example-grid strong { margin-top:8px; font-size:22px; }
.versus-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:960px; margin:auto; }.versus-grid article { border:1px solid rgba(255,255,255,.12); padding:38px; border-radius:16px; background:#08101f; }.versus-grid h3 { font-size:30px; margin:0 0 28px; }.versus-winner { border-color:var(--signal)!important; box-shadow:0 0 55px rgba(215,255,47,.08); }.versus-winner h3 { color:var(--signal); }
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.pricing-grid article { position:relative; display:flex; flex-direction:column; min-height:430px; padding:28px; border:1px solid rgba(255,255,255,.13); border-radius:16px; background:#08101f; }.pricing-grid article>span { color:#b1b8c9; font-weight:800; }.pricing-grid h3 { font-size:40px; margin:22px 0 8px; }.pricing-grid h3 small { font-size:13px; color:#7f879a; letter-spacing:0; }.pricing-grid p { color:#8f98aa; min-height:42px; }.pricing-grid button,.pricing-grid article>a { margin-top:auto; min-height:46px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.2); background:transparent; color:white; border-radius:8px; font-weight:800; }.pricing-grid button:hover { border-color:var(--signal); }.price-featured { border-color:var(--signal)!important; transform:translateY(-10px); }.price-featured em { position:absolute; right:18px; top:17px; color:#050814; background:var(--signal); padding:6px 9px; border-radius:5px; font-size:10px; font-style:normal; font-weight:800; }.price-featured button { background:var(--signal)!important; color:#050814!important; }
.faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.faq details { border:1px solid rgba(255,255,255,.12); border-radius:10px; background:#08101f; padding:0 20px; }.faq summary { cursor:pointer; padding:20px 0; font-weight:700; }.faq details p { color:#99a2b4; line-height:1.6; margin:0 0 20px; }
.final-cta { margin-bottom:80px; padding:54px; border-radius:18px; display:flex; align-items:center; justify-content:space-between; gap:40px; background:radial-gradient(circle at 50% 100%,rgba(119,92,255,.65),transparent 45%),#101a5b; border:1px solid rgba(128,142,255,.45); }.final-cta h2 { font-size:48px; margin:0 0 10px; }.final-cta p:last-child { color:#b6bdd0; }
.marketing-footer { width:min(1480px,calc(100% - 64px)); margin:auto; min-height:230px; padding:46px 0; display:grid; grid-template-columns:180px 1fr auto; gap:28px; align-items:start; border-top:1px solid rgba(255,255,255,.1); color:#81899e; }.marketing-footer img { width:160px; height:48px; }.marketing-footer p { margin:14px 0; }.marketing-footer div { display:flex; gap:24px; color:#aeb5c5; }.marketing-footer small { grid-column:1/-1; }
.signup-dialog { border:1px solid rgba(119,92,255,.4); background:#080f1f; color:white; }.signup-dialog::backdrop { background:rgba(1,3,10,.82); backdrop-filter:blur(12px); }.signup-dialog form { width:min(600px,calc(100vw - 28px)); }.signup-dialog input { background:#0c1528; border-color:rgba(255,255,255,.14); color:white; }.signup-dialog .cta-button--form { width:100%; margin-top:12px; }.signup-dialog .auth-switch { text-align:center; color:#8790a4; }.signup-dialog .auth-switch button { border:0; background:none; color:var(--signal); font-weight:700; }

@media (max-width:1300px) {
  .marketing-links { display:none; }
  .marketing-menu { display:block; border:1px solid rgba(255,255,255,.16); color:white; background:none; padding:10px 14px; border-radius:7px; }
  .marketing-nav.is-open .marketing-links { display:flex; position:absolute; left:0; right:0; top:84px; padding:24px; flex-direction:column; align-items:flex-start; background:#07101f; border:1px solid rgba(255,255,255,.12); }
}

@media (max-width:1050px) {
  .product-story { grid-template-columns:1fr; }.product-story-copy { text-align:center; }.product-story-copy h2,.product-story-copy>p:not(.marketing-kicker) { margin-left:auto; margin-right:auto; }.product-story-copy .cta-button { margin:auto; }.security-strip { grid-template-columns:1fr; }.security-strip>div { border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
  .marketing-links { display:none; }.marketing-menu { display:block; border:1px solid rgba(255,255,255,.16); color:white; background:none; padding:10px 14px; border-radius:7px; }.marketing-nav.is-open .marketing-links { display:flex; position:absolute; left:0; right:0; top:84px; padding:24px; flex-direction:column; align-items:flex-start; background:#07101f; border:1px solid rgba(255,255,255,.12); }.marketing-hero { grid-template-columns:1fr; padding-top:70px; }.hero-content { text-align:center; }.marketing-lead { margin-left:auto; margin-right:auto; }.hero-actions,.trust-line,.rating-line { justify-content:center; }.composer-card { max-width:850px; margin:auto; }.seo-paths { grid-template-columns:1fr; gap:44px; }.seo-paths article { padding:0!important; border-right:0; border-bottom:1px solid rgba(255,255,255,.1); padding-bottom:38px!important; }.steps,.pricing-grid { grid-template-columns:repeat(2,1fr); }.comparison-stage { grid-template-columns:1fr; }.proof-strip { grid-template-columns:1fr; gap:28px; }.marketing-footer { grid-template-columns:1fr 1fr; }.marketing-footer div { justify-content:flex-end; }
}
@media (max-width:650px) {
  .product-ui-demo { grid-template-columns:1fr; padding:7px; }.demo-route { display:none; }.demo-chat { min-height:440px; }.demo-suggestions span:nth-child(n+3) { display:none; }.product-story-copy { text-align:left; }.product-story-copy .cta-button { margin:0; }.product-story-copy h2 { font-size:40px; }
  .marketing-nav,.marketing-hero,.compatibility,.section-shell,.marketing-footer { width:min(100% - 36px,1340px); }.marketing-nav { height:72px; }.marketing-logo { width:132px; height:44px; }.marketing-actions { display:none; }.marketing-nav.is-open .marketing-links { position:fixed; inset:0; z-index:50; padding:118px 28px 180px; display:flex; flex-direction:column; align-items:flex-start; gap:24px; background:radial-gradient(circle at 80% 16%,rgba(119,92,255,.28),transparent 28%),#050814; border:0; }.marketing-nav.is-open .marketing-links a { font-family:"Space Grotesk",Inter,sans-serif; color:white; font-size:34px; font-weight:700; letter-spacing:-.04em; }.marketing-nav.is-open .marketing-actions { display:flex; position:fixed; z-index:51; left:28px; right:28px; bottom:30px; padding:0; background:transparent; flex-direction:column; align-items:stretch; }.marketing-nav.is-open .marketing-menu { position:fixed; z-index:52; top:16px; right:18px; }.marketing-hero { min-height:auto; padding:62px 0 48px; }.marketing-hero h1 { font-size:42px; line-height:1.02; }.marketing-lead { font-size:16px; }.hero-actions { flex-direction:column; align-items:stretch; }.trust-line { gap:10px 14px; }.composer-card { padding:10px; }.composer-tabs { overflow:auto; }.composer-input { align-items:stretch; flex-direction:column; }.site-preview { height:250px; }.composer-status { grid-template-columns:1fr 1fr; }.section-shell { padding:78px 0; }.section-intro { text-align:left; margin-bottom:36px; }.section-intro h2 { font-size:39px; }.steps,.pricing-grid,.example-grid,.versus-grid,.faq-grid { grid-template-columns:1fr; }.price-featured { transform:none; }.comparison-pane img { height:270px; }.comparison-pane--editor { padding-right:16px; padding-bottom:150px; }.editor-tools { left:16px; right:16px; top:auto; bottom:16px; width:auto; min-height:auto; display:grid; grid-template-columns:repeat(3,1fr); }.proof-strip { padding:28px; }.proof-strip blockquote { font-size:17px; }.final-cta { padding:34px 24px; flex-direction:column; align-items:stretch; }.final-cta h2 { font-size:39px; }.marketing-footer { grid-template-columns:1fr; }.marketing-footer div { justify-content:flex-start; flex-wrap:wrap; }
}

/* Support center */
.support-hero { align-items:flex-end; gap:30px; }
.support-hero>div { max-width:820px; }
.support-hero>div>p:last-child { max-width:720px; color:var(--muted); font-size:17px; line-height:1.65; }
.support-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:10px 0 56px; }
.support-summary article { display:flex; gap:16px; min-height:128px; padding:22px; border:1px solid var(--line); border-radius:16px; background:#111315; }
.support-summary i { color:var(--accent); font-size:25px; }
.support-summary strong,.support-summary span { display:block; }
.support-summary span { margin-top:7px; color:var(--muted); line-height:1.45; }
.support-ticket-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.support-ticket { width:100%; padding:24px; border:1px solid var(--line); border-radius:16px; background:#111315; color:inherit; text-align:left; cursor:pointer; font:inherit; transition:border-color .2s ease,transform .2s ease,background .2s ease; }
.support-ticket:hover,.support-ticket:focus-visible { border-color:var(--accent); background:#151718; transform:translateY(-2px); outline:none; }
.support-ticket__top,.support-ticket footer { display:flex; justify-content:space-between; gap:18px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.support-ticket h3 { margin:26px 0 10px; font-size:24px; }
.support-ticket p { min-height:48px; color:var(--muted); }
.support-ticket footer { margin-top:25px; padding-top:16px; border-top:1px solid var(--line); }
.support-thread-shell { padding:32px; }
.support-thread-messages { display:grid; gap:12px; max-height:min(52vh,520px); overflow:auto; padding:4px 4px 18px; }
.support-thread-message { max-width:86%; padding:16px 18px; border:1px solid var(--line); border-radius:16px; background:#17191a; }
.support-thread-message--customer { margin-left:auto; border-color:rgba(255,100,76,.35); background:rgba(255,100,76,.08); }
.support-thread-message > div { display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.support-thread-message p { margin:10px 0 0; white-space:pre-wrap; line-height:1.55; }
#support-reply-form { margin-top:18px; padding-top:20px; border-top:1px solid var(--line); }
.support-thread-closed { margin:20px 0 0; padding:16px; border:1px solid var(--line); border-radius:12px; color:var(--muted); }
.support-priority { padding:5px 9px; border:1px solid var(--line); border-radius:99px; }
.support-priority--high { color:#ffb347; border-color:#634a27; }
.support-priority--urgent { color:#ff745f; border-color:#6e3028; }
.toggle-field span a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
@media(max-width:900px){.support-summary{grid-template-columns:1fr}.support-ticket-list{grid-template-columns:1fr}.support-hero{align-items:flex-start;flex-direction:column}}

/* GALI Sites 0.15 — unified graphite / coral product system */
:root {
  --paper:#090a0b;
  --paper-strong:#141617;
  --ink:#f4efe7;
  --black:#050505;
  --lime:#ff644c;
  --lime-soft:#ff8a70;
  --accent:#ff644c;
  --accent-soft:#ff9b74;
  --copper:#d59a54;
  --muted:#9d9995;
  --line:rgba(244,239,231,.13);
  --danger:#ff6a5c;
  --radius:18px;
  --shadow:0 24px 80px rgba(0,0,0,.34);
  color:var(--ink);
  background:var(--paper);
}
body { color:var(--ink); background:var(--paper); }
.ambient { opacity:.24; background-image:url("/assets/ui/graphite-copper-texture.png"); background-size:cover; background-position:center top; mix-blend-mode:normal; z-index:-1; }
.auth-story::after { display:none; }
:focus-visible { outline-color:var(--accent-soft); }
.eyebrow,.marketing-kicker,.planner-panel__index { color:var(--accent-soft); }
.eyebrow--accent { color:var(--accent); }
.brand-mark,.wordmark-mark { background:var(--accent); color:white; border-radius:10px; }
.button { border-radius:10px; }
.button--primary,.cta-button,.validate-button { color:#0a0a0a; background:var(--accent); box-shadow:none; }
.button--primary:hover,.cta-button:hover { background:#ff765f; box-shadow:0 10px 32px rgba(255,100,76,.18); }
.button--dark { background:var(--ink); color:var(--black); }
.button--ghost { border-color:var(--line); color:var(--ink); }
.button--ghost:hover { border-color:rgba(255,100,76,.55); background:rgba(255,100,76,.06); }
input,textarea,select { color:var(--ink); border-color:var(--line); background:#111315; }
input:focus,textarea:focus,select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(255,100,76,.16); }

.marketing { --night:#090a0b; --night-2:#111315; --signal:#ff644c; --cobalt:#ff644c; --violet:#d59a54; --cloud:#f4efe7; color:var(--cloud); background:transparent; }
.marketing-nav { width:min(1480px,calc(100% - 64px)); height:92px; border-bottom-color:var(--line); }
.wordmark { display:inline-flex; align-items:center; gap:9px; color:var(--ink); text-decoration:none; font-size:22px; letter-spacing:-.04em; }
.wordmark-mark { width:38px; height:38px; display:grid; place-items:center; margin-right:3px; font-size:18px; font-weight:900; }
.wordmark strong { letter-spacing:-.05em; }
.wordmark span:last-child { font-family:Georgia,serif; color:#d9d2c9; font-size:24px; }
.marketing-logo { width:auto; height:auto; padding:0; }
.brand-logo-link { display:inline-flex; align-items:center; width:174px; height:46px; }
.brand-logo-link img,.marketing-footer .brand-logo-link img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.brand-logo-link--footer { width:158px; height:42px; }
.marketing-links a,.link-button { color:#b7b2ac; }
.marketing-links a:hover,.link-button:hover { color:var(--ink); }
.marketing-hero { width:min(1480px,calc(100% - 64px)); min-height:790px; grid-template-columns:.9fr 1.1fr; gap:50px; padding:76px 0 68px; }
.hero-glow { display:none; }
.marketing-hero h1 { max-width:680px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(54px,4.2vw,64px); line-height:1.01; letter-spacing:-.055em; font-weight:500; text-wrap:balance; }
.marketing-hero h1 span { color:var(--accent-soft); font-style:italic; }
.marketing-lead { max-width:610px; color:#aaa5a0; font-size:17px; }
.watch-link { appearance:none; display:inline-flex; align-items:center; gap:9px; color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:16px 20px; background:#111315; text-decoration:none; }
.watch-link:hover { border-color:rgba(255,100,76,.55); background:#17191a; }
.trust-line { color:#9d9995; }
.trust-line span::before { border-color:var(--copper); }
.rating-line strong { color:var(--accent); }
.cta-button { border-radius:9px; min-height:48px; }
.cta-button--large { min-height:58px; }
.planner-demo { min-height:650px; padding:0; overflow:hidden; border-color:var(--line); background:#0d0f10; box-shadow:0 36px 110px rgba(0,0,0,.42); backdrop-filter:none; }
.planner-demo__top { min-height:68px; padding:13px 17px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:#101213; }
.planner-demo__top>div { display:flex; align-items:center; gap:10px; }
.planner-demo__top strong,.planner-demo__top small { display:block; }
.planner-demo__top small { margin-top:3px; color:var(--muted); font-size:9px; }
.planner-demo__top>span { color:#aaa5a0; font-size:10px; }.planner-demo__top>span b { color:var(--accent); font-size:15px; }
.mini-brand { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--accent); color:white; font-weight:900; }
.planner-demo__body { display:grid; grid-template-columns:150px minmax(0,1fr) 175px; min-height:580px; }
.planner-demo__steps { padding:22px 15px; border-right:1px solid var(--line); }
.planner-demo__steps>span,.planner-label,.planner-demo__estimate>span { color:#8f8a84; font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; }
.planner-demo__steps ol { padding:20px 0 0; margin:0; list-style:none; counter-reset:plan; }
.planner-demo__steps li { position:relative; margin:0 0 24px; padding-left:26px; color:#797571; font-size:9px; }
.planner-demo__steps li::before { counter-increment:plan; content:counter(plan); position:absolute; left:0; top:-3px; width:18px; height:18px; display:grid; place-items:center; border:1px solid #4c4d4e; border-radius:50%; font-size:8px; }
.planner-demo__steps li.is-active { color:var(--ink); font-weight:800; }.planner-demo__steps li.is-active::before { border-color:var(--accent); background:var(--accent); color:#080808; }
.planner-demo__main { padding:24px 18px; min-width:0; }
.planner-demo__routes { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:12px 0 28px; }
.planner-demo__routes button { min-width:0; min-height:110px; display:flex; flex-direction:column; align-items:flex-start; gap:7px; padding:12px; color:var(--ink); border:1px solid var(--line); border-radius:11px; background:#131516; text-align:left; }
.planner-demo__routes button.is-selected { border-color:var(--accent); background:#181313; }
.planner-demo__routes i { color:var(--accent-soft); font-size:18px; }.planner-demo__routes strong { font-size:10px; }.planner-demo__routes small { color:#8e8984; font-size:8px; line-height:1.4; }
.planner-demo__styles { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.planner-demo__styles figure { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:9px; background:#131516; }.planner-demo__styles figure.is-selected { border-color:var(--copper); }
.planner-demo__styles img { width:100%; height:112px; object-fit:cover; object-position:top; }.planner-demo__styles figcaption { padding:9px; color:#d8d2cb; font-size:9px; }
.planner-demo__actions { display:flex; gap:7px; margin-top:14px; }.planner-demo__actions button { padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:transparent; color:#b9b4ad; font-size:9px; }
.planner-demo__estimate { padding:22px 15px; border-left:1px solid var(--line); background:#111314; }
.planner-demo__estimate>strong { display:block; margin:12px 0 20px; font-size:19px; }.planner-demo__estimate>strong b { display:block; margin-top:4px; color:var(--accent); font-size:14px; }
.planner-demo__estimate ul { list-style:none; padding:0!important; margin:0!important; }.planner-demo__estimate li { padding:10px 0; margin:0!important; border-bottom:1px solid var(--line); font-size:9px; }.planner-demo__estimate li::before { display:none; }
.planner-demo__estimate p { margin-top:24px; color:#9c9690; font-size:8px; line-height:1.5; }
.compatibility { color:#8f8a84; }.compatibility strong { color:#c1bbb4; }
.marketing-kicker { color:var(--accent-soft); }
.path-flow span,.steps article,.comparison-pane,.versus-grid article,.pricing-grid article,.faq details,.demo-chat,.demo-route { background:#111315; }
.product-ui-demo,.proof-strip,.final-cta { background:#111315; border-color:var(--line); box-shadow:none; }
.demo-chat header>span,.demo-composer button { background:var(--accent); }
.demo-chat header em,.demo-suggestions b,.demo-route strong,.proof-strip strong,.versus-winner h3 { color:var(--accent); }
.demo-route li.done::before { border-color:var(--accent); background:var(--accent); }
.steps article>span { color:var(--accent-soft); }
.steps .step-highlight,.versus-winner,.price-featured { border-color:var(--accent)!important; box-shadow:none; }
.price-featured em { color:#0b0b0b; background:var(--accent); }
.price-featured button { color:#0b0b0b!important; background:var(--accent)!important; }
.example-grid article::after { background:rgba(9,10,11,.72); }
.final-cta { color:var(--ink); }
.signup-dialog { border-color:rgba(255,100,76,.35); background:#0f1112; }
.signup-dialog input { background:#151718; }.signup-dialog .auth-switch button { color:var(--accent); }
.signup-dialog .auth-switch--signup-top {
  margin:12px 0 4px;
  color:#a7a7a4;
  text-align:left;
}
.google-auth-button { width:100%; min-height:44px; display:flex; align-items:center; justify-content:center; margin:18px 0 12px; overflow:hidden; border-radius:6px; }
.auth-divider { display:flex; align-items:center; gap:12px; margin:14px 0; color:#7f8589; font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.auth-divider::before,.auth-divider::after { content:""; flex:1; height:1px; background:rgba(255,255,255,.12); }
.composer-confirmation { margin:12px 0 0; padding:16px; border:1px solid rgba(255,100,76,.35); border-radius:14px; background:linear-gradient(135deg,rgba(255,100,76,.12),rgba(255,255,255,.035)); }
.composer-confirmation > div:first-child { display:flex; align-items:center; gap:9px; color:#fff; }
.composer-confirmation > div:first-child strong { margin-left:auto; color:var(--accent); }
.composer-confirmation p { margin:9px 0 14px; color:#9aa0a4; font-size:13px; }
.composer-confirmation > div:last-child { display:flex; justify-content:flex-end; gap:9px; }
.project-card--draft { border-style:dashed; border-color:rgba(255,100,76,.55); background:linear-gradient(145deg,rgba(255,100,76,.09),rgba(255,255,255,.025)); }
.project-card--draft .project-card__top > span:first-child,.project-card--draft .project-card__footer > span:last-child { color:var(--accent); }
.marketing-footer .wordmark { width:auto; height:auto; }
.auth-brand-logo { width:174px; height:46px; }
.auth-brand-logo img,.studio-brand-logo img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.studio-brand-logo { width:142px; height:38px; padding:0; }

.studio,.auth-layout { color:var(--ink); background:var(--paper); }
.studio::before,.auth-story::before { content:""; position:fixed; inset:0; z-index:-1; background-image:url("/assets/ui/graphite-copper-texture.png"); background-size:cover; background-position:center; opacity:.26; pointer-events:none; }
.auth-story {
  color:#121313;
  background:
    radial-gradient(circle at 88% 38%,rgba(255,100,76,.14),transparent 30%),
    linear-gradient(145deg,#f5f0e8,#e9e1d6);
}
.auth-story::before { position:absolute; z-index:0; opacity:.08; mix-blend-mode:multiply; }
.auth-story .brand { position:relative; z-index:1; color:#121313; }
.auth-brand-logo {
  width: clamp(170px, 16vw, 220px);
  height: auto;
}
.auth-brand-logo svg {
  display: block;
  width: 100%;
  height: auto;
}
.auth-story .auth-message>p:last-child { color:#5f5a54; }
.auth-story .trust-list { color:#5f5a54; }
.auth-story .trust-list span { color:var(--accent); }
.auth-panel { background:#090a0b; }
.auth-form .auth-switch { margin:14px 0 0; text-align:right; }
.auth-form .auth-switch button {
  padding:5px 0;
  border:0;
  border-bottom:1px solid transparent;
  border-radius:0;
  color:#b9b3ac;
  background:transparent;
  font:700 12px/1.35 inherit;
  cursor:pointer;
}
.auth-form .auth-switch button:hover {
  color:var(--accent-soft);
  border-bottom-color:var(--accent);
}
.auth-form .auth-switch--register {
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  color:#9b9b99;
  text-align:center;
}
.auth-form .auth-switch--register button {
  margin-left:5px;
  color:var(--accent);
}
.auth-form input:-webkit-autofill,
.auth-form input:-webkit-autofill:hover,
.auth-form input:-webkit-autofill:focus {
  -webkit-text-fill-color:var(--ink);
  box-shadow:0 0 0 1000px #111315 inset;
  caret-color:var(--ink);
  transition:background-color 9999s ease-out 0s;
}
.sidebar { background:#0b0d0e; border-right-color:var(--line); }
.sidebar .brand { color:var(--ink); }.sidebar nav { gap:5px; }
.nav-item { min-height:44px; color:#918d88; border-radius:9px; }.nav-item i { width:23px; font-size:19px; }
.nav-item:hover,.nav-item.is-active { color:var(--ink); background:#17191a; }
.sidebar-note { background:#111314; }.status-dot { background:var(--accent); box-shadow:0 0 0 4px rgba(255,100,76,.12); }
.workspace { background:rgba(9,10,11,.82); }
.topbar { background:#0c0e0f; border-bottom-color:var(--line); }
.credit-pill { color:var(--ink); border-color:rgba(213,154,84,.34); background:#181511; }.credit-pill strong { color:var(--copper); }
.user-chip>span { color:white; background:#222425; }
.content-view { width:min(100%,1600px); }
.hero-row h1,.project-header h1,.planner-title h1,.utility-hero h1 { color:var(--ink); }.hero-row h1 span,.project-header h1 span,.planner-title h1 span,.utility-hero h1 span { color:#86817c; }
.hero-copy,.muted { color:var(--muted); }
.metric-grid,.metric,.project-card,.empty-card { border-color:var(--line); }.project-card,.empty-card { background:#111314; }.project-card:hover { background:#17191a; box-shadow:var(--shadow); }
.dot--ready { background:var(--copper); }.dot--working { background:var(--accent); }
.privacy-badge { color:#ffb8a9; border-color:rgba(255,100,76,.35); background:#1a1110; }.privacy-badge::before { background:var(--accent); box-shadow:0 0 0 4px rgba(255,100,76,.12); }
.copilot-shell,.cockpit-card,.technical-history { border-color:var(--line); background:#111314; box-shadow:none; }
.copilot-topbar { border-color:var(--line); background:#121415; }.copilot-avatar { color:white; background:#151718; border:1px solid rgba(255,100,76,.44); }
.copilot-topbar small i { background:var(--accent); }.stage-pill { color:#aaa49d; background:#1b1d1e; }
.chat-message__bubble,.assistant-composer { border-color:var(--line); background:#151718; color:#dad5cf; }.chat-message--user .chat-message__bubble { background:#f2ebe3; color:#161616; }
.suggestion-chip,.attach-button,.composer-option { color:#b6b0aa; border-color:var(--line); background:#151718; }
.assistant-composer:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px rgba(255,100,76,.12); }
.send-button { color:#090909; background:var(--accent); }.send-button span { color:#090909; background:#ff927f; }
.composer-cost,.composer-cost strong { color:#aaa49d; }
.workflow-step.is-complete i { color:#0b0b0b; border-color:var(--copper); background:var(--copper); }.workflow-step.is-current i { border-color:var(--accent); background:var(--accent); box-shadow:0 0 0 4px rgba(255,100,76,.14); }
.cockpit-card--credits { color:var(--ink); background:#171310; }.cockpit-card--credits>strong { color:var(--accent); }
.billing-summary { color:var(--ink); background:#121415; }.billing-summary>strong { color:var(--accent); }
.billing-plan { color:var(--ink); border-color:var(--line); background:#111314; }.billing-plan.is-featured { border-color:var(--accent); box-shadow:none; }
.danger-zone { color:var(--ink); border-color:rgba(255,100,76,.28); background:#171010; }
.dialog { color:var(--ink); background:#111314; }.dialog::backdrop { background:rgba(0,0,0,.78); }.source-tab.is-active { border-color:var(--accent); }
.job-card,.capability-group { border-color:var(--line); background:#111314; }.job-stage { background:#222425; }.job-stage--succeeded { color:#0b0b0b; background:var(--copper); }
.validation-card { color:var(--ink); background:#111314; border:1px solid var(--line); }.validation-index { color:var(--accent); }

.planner-header,.planner-header__actions,.planner-title,.utility-hero,.settings-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.planner-header { margin-bottom:48px; }
.planner-title { align-items:flex-end; margin-bottom:58px; }.planner-title h1,.utility-hero h1 { margin:6px 0 18px; max-width:870px; font-size:clamp(52px,6vw,88px); line-height:.92; letter-spacing:-.065em; }.planner-title>div>p:last-child,.utility-hero>div>p:last-child { max-width:720px; color:var(--muted); line-height:1.6; }
.planner-credit { min-width:230px; padding:22px; border:1px solid var(--line); border-radius:15px; background:#111314; }.planner-credit span,.planner-credit strong,.planner-credit small { display:block; }.planner-credit span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.13em; }.planner-credit strong { margin:9px 0; color:var(--accent); font-size:22px; }.planner-credit small { color:#817c76; font-size:10px; }
.planner-progress { display:grid; grid-template-columns:repeat(6,1fr); margin-bottom:24px; border:1px solid var(--line); border-radius:15px; background:#0f1112; overflow:hidden; }
.planner-progress button { min-height:70px; padding:12px; display:flex; align-items:center; gap:10px; color:#85817c; border:0; border-right:1px solid var(--line); background:transparent; text-align:left; }.planner-progress button:last-child { border-right:0; }.planner-progress b { width:28px; height:28px; display:grid; place-items:center; border:1px solid #4c4e4f; border-radius:50%; }.planner-progress span { font-size:10px; font-weight:700; }.planner-progress .is-active { color:var(--ink); background:#17191a; }.planner-progress .is-active b { color:#090909; border-color:var(--accent); background:var(--accent); }.planner-progress .is-complete b { color:#080808; border-color:var(--copper); background:var(--copper); }
.planner-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:18px; align-items:start; }
.planner-panel,.planner-summary { border:1px solid var(--line); border-radius:18px; background:#0f1112; }
.planner-panel { min-height:640px; padding:34px; }.planner-panel h2 { margin:0 0 12px; font-size:38px; letter-spacing:-.045em; }.planner-step-panel>p:not(.planner-panel__index) { max-width:760px; color:var(--muted); line-height:1.6; }
.smart-brief { margin:28px 0 32px; padding:22px; border:1px solid rgba(255,100,76,.42); border-radius:16px; background:linear-gradient(135deg,rgba(255,100,76,.09),transparent 55%),#121415; }
.smart-brief>label,.planner-subheading { display:block; margin:0 0 10px; color:var(--ink); font-size:12px; font-weight:800; }.smart-brief textarea { min-height:180px; font-size:15px; line-height:1.6; resize:vertical; }
.smart-brief__actions { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-top:13px; }.smart-brief__actions small { color:var(--muted); }.smart-brief__actions small i { color:var(--accent); }
.brief-analysis { margin-top:16px; padding:15px; border:1px solid rgba(82,211,154,.28); border-radius:12px; background:rgba(82,211,154,.06); }.brief-analysis strong { color:#74dda9; }.brief-analysis p { margin:7px 0 12px; color:var(--muted); font-size:12px; }.brief-analysis div { display:flex; flex-wrap:wrap; gap:7px; }.brief-analysis span { padding:6px 9px; border:1px solid var(--line); border-radius:99px; background:#0d0f10; font-size:10px; }
.planner-subheading { margin-top:4px; color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-size:9px; }
.route-choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:30px 0; }
.route-choice-grid--primary { grid-template-columns:repeat(2,minmax(0,1fr)); }
.route-choice { min-height:180px; margin:0; padding:22px; display:flex; flex-direction:column; align-items:flex-start; gap:13px; border:1px solid var(--line); border-radius:15px; background:#131516; cursor:pointer; }.route-choice input,.style-choice input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }.route-choice i { color:var(--accent-soft); font-size:26px; }.route-choice strong { font-size:16px; }.route-choice span { color:var(--muted); font-size:12px; line-height:1.55; }.route-choice.is-selected { border-color:var(--accent); background:#181313; }
.planner-fields { display:grid; gap:14px; }.planner-fields--two { grid-template-columns:1fr 1fr; }.planner-fields label,.planner-wide-field { margin:0; }
.style-choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:30px 0; }
.style-choice { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:#131516; cursor:pointer; }.style-choice.is-selected { border-color:var(--accent); }.style-choice img { width:100%; height:190px; object-fit:cover; object-position:top; }.style-choice>span { display:block; padding:15px; }.style-choice strong,.style-choice small { display:block; }.style-choice small { margin-top:7px; color:var(--muted); line-height:1.45; }
.custom-style-visual { height:190px; display:grid!important; place-content:center; gap:8px; text-align:center; background:radial-gradient(circle at 25% 25%,rgba(255,100,76,.28),transparent 28%),radial-gradient(circle at 75% 72%,rgba(76,145,255,.25),transparent 30%),#0d0f10; }.custom-style-visual i { margin:auto; font-size:31px; color:var(--accent); }.custom-style-visual b { font-size:12px; }.planner-field-span { grid-column:1/-1; }.visual-custom-fields { margin:0 0 8px; }.custom-features-field { display:grid; gap:9px; margin-top:20px; }
.addon-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:30px; }.addon-choice { grid-template-columns:30px 1fr auto; align-items:center; margin:0; padding:18px; border:1px solid var(--line); border-radius:14px; background:#131516; cursor:pointer; }.addon-choice:has(input:checked) { border-color:var(--accent); background:#181313; }.addon-choice input { position:absolute; width:1px; height:1px; opacity:0; }.addon-choice i { color:var(--accent-soft); font-size:24px; }.addon-choice strong,.addon-choice small { display:block; }.addon-choice small { margin-top:5px; color:var(--muted); }.addon-choice>b { color:var(--copper); font-size:12px; }
.addon-choice--configurable { display:flex; justify-content:space-between; gap:16px; cursor:default; }.addon-choice--configurable>label { display:grid; grid-template-columns:30px 1fr; align-items:center; gap:0; cursor:pointer; }.addon-quantity { display:flex; min-width:132px; flex-direction:column; align-items:flex-end; gap:7px; }.addon-quantity input,.addon-quantity select { position:static; width:132px; height:38px; padding:0 10px; opacity:1; color:var(--text); border:1px solid var(--line); border-radius:9px; background:#0c0e0f; }.addon-quantity b { color:var(--copper); font-size:11px; white-space:nowrap; }
.planner-upload-zone { min-height:140px; margin-top:18px; place-items:center; align-content:center; text-align:center; border:1px dashed rgba(244,239,231,.24); border-radius:14px; background:#101213; cursor:pointer; }.planner-upload-zone input { position:absolute; width:1px; height:1px; opacity:0; }.planner-upload-zone i { color:var(--accent); font-size:28px; }.planner-upload-zone span { color:var(--muted); font-weight:400; }
.function-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:30px 0; }.function-grid label { min-height:110px; margin:0; padding:18px; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line); border-radius:13px; background:#131516; cursor:pointer; }.function-grid label:has(input:checked) { border-color:var(--accent); background:#181313; }.function-grid input { position:absolute; width:1px; height:1px; opacity:0; }.function-grid i { color:var(--accent-soft); font-size:24px; }.function-grid span { font-size:12px; }
.gali-suggestion { display:flex; gap:14px; padding:18px; border:1px solid rgba(213,154,84,.28); border-radius:13px; background:#17140f; }.gali-suggestion>i { color:var(--copper); font-size:24px; }.gali-suggestion strong { color:var(--copper); }.gali-suggestion p { margin:5px 0 0; color:#aaa49d; font-size:12px; }
.planner-review { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin:28px 0; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:var(--line); }.planner-review>div { min-height:105px; padding:18px; background:#131516; }.planner-review span,.planner-review strong { display:block; }.planner-review span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.12em; }.planner-review strong { margin-top:12px; line-height:1.45; }
.planner-footer { display:flex; justify-content:flex-end; gap:10px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line); }
.planner-summary { position:sticky; top:24px; padding:24px; }.planner-summary>span,.planner-plan>span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.13em; }.planner-summary>strong { display:block; margin:10px 0 24px; font-size:24px; }.planner-summary dl { margin:0; }.planner-summary dl div { padding:12px 0; display:flex; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); }.planner-summary dt,.planner-summary dd { margin:0; font-size:11px; }.planner-summary dd { color:var(--copper); font-weight:800; }.planner-total { padding:22px 0; }.planner-total span,.planner-total strong { display:block; }.planner-total span { color:var(--muted); font-size:10px; }.planner-total strong { margin-top:7px; color:var(--accent); font-size:20px; }.planner-summary>p { display:flex; gap:9px; color:#948f89; font-size:10px; line-height:1.5; }.planner-plan { margin-top:22px; padding:17px; border:1px solid rgba(255,100,76,.3); border-radius:12px; background:#181313; }.planner-plan strong,.planner-plan small { display:block; }.planner-plan strong { margin:7px 0; color:var(--accent); }.planner-plan small { color:var(--muted); line-height:1.45; }

.utility-hero { align-items:flex-end; margin-bottom:58px; }.utility-hero>div>p:last-child { margin-bottom:0; }.idea-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.idea-grid article { min-height:300px; padding:25px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:16px; background:#111314; }.idea-grid article:nth-child(2),.idea-grid article:nth-child(5) { background:#171310; }.idea-grid article>span { color:var(--accent-soft); font-size:10px; text-transform:uppercase; letter-spacing:.13em; }.idea-grid h2 { margin:50px 0 14px; font-family:Georgia,serif; font-size:28px; line-height:1.05; font-weight:500; }.idea-grid p { color:var(--muted); font-size:12px; line-height:1.55; }.idea-grid button { margin-top:auto; color:var(--ink); text-align:left; }
.file-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; padding-bottom:18px; border-bottom:1px solid var(--line); }.file-toolbar>div { display:flex; gap:8px; }.file-toolbar button { padding:8px 12px; color:var(--muted); border:0; border-radius:8px; background:transparent; }.file-toolbar button.is-active { color:var(--ink); background:#17191a; }.file-toolbar>span { color:var(--muted); font-size:11px; }
.workspace-file-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.empty-library { grid-column:1/-1; min-height:320px; display:grid; place-items:center; align-content:center; text-align:center; border:1px dashed var(--line); border-radius:16px; background:#0f1112; }.empty-library i { color:var(--accent); font-size:38px; }.empty-library h2 { margin:18px 0 6px; }.empty-library p { color:var(--muted); }
.workspace-file { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:#111314; }.workspace-file__preview { height:180px; display:grid; place-items:center; overflow:hidden; background:#17191a; }.workspace-file__preview img { width:100%; height:100%; object-fit:cover; }.workspace-file__preview i { color:var(--accent); font-size:44px; }.workspace-file>div:nth-child(2) { padding:15px; }.workspace-file strong,.workspace-file span { display:block; }.workspace-file strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.workspace-file span { margin-top:5px; color:var(--muted); font-size:10px; }.workspace-file>button { position:absolute; right:10px; top:10px; width:34px; height:34px; border:1px solid var(--line); border-radius:9px; color:white; background:rgba(9,10,11,.84); }
.settings-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:24px; }.settings-nav { display:grid; align-content:start; gap:5px; }.settings-nav button { padding:13px; color:var(--muted); border:0; border-radius:9px; background:transparent; text-align:left; }.settings-nav button.is-active { color:var(--ink); background:#17191a; }.settings-panel { padding:32px; border:1px solid var(--line); border-radius:16px; background:#111314; }.settings-heading span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.13em; }.settings-heading h2 { margin:6px 0 0; }.settings-divider { height:1px; margin:36px 0; background:var(--line); }.preference-list { display:grid; margin-top:24px; }.preference-list label { min-height:72px; grid-template-columns:1fr auto; align-items:center; margin:0; padding:15px 0; border-bottom:1px solid var(--line); }.preference-list strong,.preference-list small { display:block; }.preference-list small { margin-top:5px; color:var(--muted); font-weight:400; }.preference-list input { width:20px; height:20px; accent-color:var(--accent); }
.planning-message ul { margin:12px 0!important; padding-left:18px!important; }.planning-message li { margin:6px 0!important; color:#b9b3ad!important; }.planning-message li::before { display:none!important; }

@media (min-width:1600px) {
  .marketing-nav,.marketing-hero,.marketing-footer { width:min(1480px,calc(100% - 96px)); }
  .workspace>.content-view { max-width:1440px; }
}
@media (max-width:1200px) {
  .marketing-hero { grid-template-columns:1fr; }.hero-content { max-width:800px; text-align:left; }.hero-actions,.trust-line,.rating-line { justify-content:flex-start; }.planner-demo { max-width:980px; margin:auto; }
  .planner-layout { grid-template-columns:1fr; }.planner-summary { position:static; }.style-choice-grid { grid-template-columns:repeat(2,1fr); }.function-grid { grid-template-columns:repeat(3,1fr); }
  .idea-grid { grid-template-columns:1fr 1fr; }.workspace-file-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:900px) {
  .studio { grid-template-columns:1fr; }.sidebar { position:fixed; left:0; top:0; width:min(310px,88vw); transform:translateX(-105%); transition:transform .25s ease; }.sidebar.is-open { transform:translateX(0); }
  .topbar-actions { gap:10px; }.user-chip div { display:none; }
  .planner-title,.utility-hero { align-items:flex-start; flex-direction:column; }.planner-progress { grid-template-columns:repeat(3,1fr); }.planner-layout { grid-template-columns:1fr; }.route-choice-grid { grid-template-columns:1fr; }.route-choice { min-height:auto; }.addon-grid,.planner-review,.planner-fields--two { grid-template-columns:1fr; }.function-grid { grid-template-columns:1fr 1fr; }
  .smart-brief__actions { align-items:stretch; flex-direction:column; }.smart-brief__actions .button { width:100%; }.planner-field-span { grid-column:auto; }
  .settings-layout { grid-template-columns:1fr; }.settings-nav { display:flex; overflow:auto; }.settings-nav button { flex:0 0 auto; }
}
@media (max-width:650px) {
  html,body { overflow-x:hidden; }
  .marketing-nav,.marketing-hero,.compatibility,.section-shell,.marketing-footer { width:min(100% - 32px,1340px); }
  .wordmark { font-size:19px; }.wordmark-mark { width:34px; height:34px; }.wordmark span:last-child { font-size:21px; }
  .marketing-nav.is-open .marketing-links { background:#090a0b; }
  .marketing-hero { padding-top:44px; }.marketing-hero h1 { font-size:43px; }.hero-actions { flex-direction:row; flex-wrap:wrap; }.hero-actions .cta-button,.hero-actions .watch-link { flex:1 1 190px; }
  .planner-demo__body { grid-template-columns:1fr; }.planner-demo__steps,.planner-demo__estimate { display:none; }.planner-demo__main { padding:18px 12px; }.planner-demo__routes { grid-template-columns:1fr; }.planner-demo__routes button { min-height:auto; }.planner-demo__styles { grid-template-columns:repeat(3,1fr); }.planner-demo__styles img { height:86px; }
  .workspace { min-width:0; }.topbar { padding:14px 16px; }.topbar-actions .credit-pill span,.topbar-actions .button span { display:none; }.topbar-actions .button { min-width:44px; padding:0 13px; }.topbar #new-project-button { width:48px; min-width:48px; padding:0; font-size:0; }.topbar #new-project-button i { font-size:18px; }.content-view { max-width:100%; padding:34px 16px 70px; overflow-x:clip; }
  .planner-header { margin-bottom:30px; align-items:stretch; flex-direction:column; gap:14px; }.planner-header > .text-button { align-self:flex-start; }.planner-header__actions { display:grid; grid-template-columns:1fr 1fr; width:100%; }.planner-header__actions .button { min-width:0; white-space:normal; }.planner-header__actions .button span { display:none; }.planner-title h1,.utility-hero h1 { font-size:47px; }.planner-credit { width:100%; }.planner-progress { grid-template-columns:repeat(2,1fr); }.planner-progress button { min-height:58px; }.planner-panel { min-height:auto; padding:20px 16px; }.planner-panel h2 { font-size:31px; }.style-choice-grid { grid-template-columns:1fr 1fr; }.style-choice img { height:130px; }.addon-grid,.function-grid { grid-template-columns:1fr; }.planner-footer { flex-wrap:wrap; }.planner-footer .button { flex:1; }
  .idea-grid,.workspace-file-grid { grid-template-columns:1fr; }.settings-panel { padding:22px 16px; }.settings-heading { align-items:flex-start; flex-direction:column; }
}

/* Conversion landing 0.17 */
.hero-showcase { position:relative; min-height:660px; padding:24px 30px 52px 0; }
.hero-browser { position:relative; z-index:1; width:82%; height:590px; margin-left:auto; overflow:hidden; border:1px solid rgba(244,239,231,.18); border-radius:20px; background:#111315; box-shadow:0 38px 110px rgba(0,0,0,.55); transform:rotate(1.2deg); }
.hero-browser header { height:48px; display:flex; align-items:center; gap:6px; padding:0 14px; border-bottom:1px solid var(--line); background:#17191a; }
.hero-browser header>span { width:7px; height:7px; border-radius:50%; background:#565655; }.hero-browser header>span:first-child { background:var(--accent); }
.hero-browser header small { margin-left:8px; color:#8e8984; font-size:9px; }
.hero-browser>div { height:495px; overflow:hidden; background:#e8e3da; }.hero-browser img { width:100%; height:auto; display:block; }
.hero-browser footer { height:47px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:0 16px; color:#9f9992; font-size:9px; }.hero-browser footer strong { color:#f4efe7; }
.hero-float { position:absolute; z-index:2; width:230px; height:205px; display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(244,239,231,.2); border-radius:17px; background:#111315; box-shadow:0 28px 70px rgba(0,0,0,.58); }
.hero-float img { width:100%; height:165px; object-fit:cover; object-position:top; }.hero-float span { padding:12px 14px; color:#d1cbc4; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.hero-float--one { left:0; top:300px; transform:rotate(-7deg); }.hero-float--two { right:0; top:425px; transform:rotate(6deg); }
.hero-proof { position:absolute; z-index:3; right:28px; top:15px; min-width:230px; display:flex; align-items:center; gap:11px; padding:14px 16px; border:1px solid rgba(255,100,76,.32); border-radius:13px; background:rgba(15,17,18,.88); box-shadow:0 18px 55px rgba(0,0,0,.38); backdrop-filter:blur(14px); }
.hero-proof i { color:var(--accent); font-size:24px; }.hero-proof span,.hero-proof strong { display:block; }.hero-proof span { color:#98928b; font-size:9px; line-height:1.5; }.hero-proof strong { color:#f4efe7; font-size:11px; }
.compatibility { flex-wrap:wrap; }.compatibility b { flex:1; height:1px; background:var(--line); }
.proof-metrics { display:grid; grid-template-columns:repeat(4,1fr); padding:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.proof-metrics article { min-height:155px; display:flex; flex-direction:column; justify-content:center; padding:28px 32px; border-right:1px solid var(--line); }.proof-metrics article:last-child { border-right:0; }
.proof-metrics strong { color:var(--accent-soft); font-family:Georgia,serif; font-size:42px; font-weight:500; }.proof-metrics span { max-width:190px; margin-top:8px; color:#99938d; font-size:11px; line-height:1.5; }
.section-intro--split { max-width:none; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(260px,.55fr); align-items:end; gap:80px; text-align:left; }
.section-intro--split h2 { max-width:780px; }.section-intro--split>p { color:#9e9891; line-height:1.7; }
.feature-bento { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.feature-card { position:relative; min-height:390px; padding:30px; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,#141617,#0e1011); }
.feature-card--wide { grid-column:span 2; display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.8fr); align-items:center; gap:34px; }
.feature-card h3 { max-width:520px; margin:14px 0 12px; font-family:Georgia,serif; font-size:clamp(29px,2.4vw,42px); line-height:1.05; font-weight:500; letter-spacing:-.035em; }
.feature-card>p,.feature-card>div>p:not(.marketing-kicker) { color:#96918b; line-height:1.65; }
.feature-icon { width:43px; height:43px; display:grid; place-items:center; margin-bottom:32px; border:1px solid rgba(255,100,76,.32); border-radius:12px; color:var(--accent); background:#1b1514; font-size:21px; }
.booking-demo { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding:18px; border:1px solid rgba(244,239,231,.15); border-radius:16px; background:#f2eee7; color:#171717; box-shadow:0 22px 70px rgba(0,0,0,.28); transform:rotate(2deg); }
.booking-demo>div { grid-column:1/-1; display:flex; align-items:center; gap:9px; margin-bottom:6px; }.booking-demo>div span { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:var(--accent); font-size:10px; font-weight:900; }
.booking-demo button,.booking-demo label { min-height:54px; padding:11px; border:1px solid #d4cfc7; border-radius:10px; color:#49443f; background:white; font:700 9px/1.4 inherit; text-align:left; }
.booking-demo label { display:flex; flex-direction:column; justify-content:center; }.booking-demo label b { margin-top:3px; color:#171717; }
.booking-demo em { grid-column:1/-1; min-height:43px; display:grid; place-items:center; border-radius:9px; background:#171717; color:white; font-size:10px; font-style:normal; font-weight:800; }
.menu-demo { display:grid; margin-top:46px; border-top:1px solid var(--line); }.menu-demo b { padding:14px 0; border-bottom:1px solid var(--line); color:#e9e4dc; font-size:15px; transition:color .2s,padding .2s; }.menu-demo b:hover { padding-left:9px; color:var(--accent); }
.motion-demo { position:absolute; left:30px; right:30px; bottom:30px; height:92px; overflow:hidden; border-radius:13px; background:radial-gradient(circle at 20% 50%,rgba(255,100,76,.42),transparent 35%),#090a0b; }
.motion-demo span { position:absolute; width:35px; height:35px; border:1px solid rgba(244,239,231,.38); border-radius:50%; }.motion-demo span:nth-child(1) { left:18%; top:28px; }.motion-demo span:nth-child(2) { left:46%; top:14px; width:62px; height:62px; border-color:var(--accent); }.motion-demo span:nth-child(3) { right:15%; top:33px; width:25px; height:25px; }
.asset-demo { position:absolute; left:30px; right:30px; bottom:30px; height:138px; overflow:hidden; border:1px solid var(--line); border-radius:13px; background:#0b0c0d; }.asset-demo img { width:100%; height:100%; object-fit:cover; object-position:top; opacity:.72; }.asset-demo::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent,rgba(5,5,5,.92)); }.asset-demo b,.asset-demo span { position:absolute; z-index:1; left:14px; }.asset-demo b { bottom:28px; }.asset-demo span { bottom:12px; color:#aaa49d; font-size:9px; }
.feature-card--import { grid-column:span 2; background:radial-gradient(circle at 100% 0,rgba(213,154,84,.16),transparent 42%),#121415; }.feature-card--import .cta-button { margin-top:18px; }
.import-demo { padding:18px; border:1px solid var(--line); border-radius:15px; background:#090a0b; box-shadow:0 22px 70px rgba(0,0,0,.34); }.import-demo>span { display:flex; gap:9px; padding-bottom:15px; border-bottom:1px solid var(--line); color:#d8d2ca; font-size:10px; }.import-demo ul { margin:0!important; padding:10px 0!important; list-style:none; }.import-demo li { padding:9px 0!important; margin:0!important; color:#a09a93; font-size:10px; }.import-demo li::before { content:"✓"; position:static; display:inline; margin-right:8px; color:var(--accent); background:none; }.import-demo strong { display:flex; align-items:center; gap:8px; padding:12px; border-radius:9px; color:#ffe7df; background:rgba(255,100,76,.12); font-size:10px; }
.result-grid { display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:480px; gap:15px; }
.result-card { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#111315; transition:transform .25s,border-color .25s; }.result-card:hover { transform:translateY(-6px); border-color:rgba(255,100,76,.48); }
.result-card--wide { grid-column:span 2; }.result-window { height:400px; overflow:hidden; background:#ece7df; }.result-window img { width:100%; height:auto; min-height:100%; display:block; object-fit:cover; object-position:top; transition:transform 8s cubic-bezier(.18,.7,.2,1); }.result-card:hover .result-window img { transform:translateY(calc(-100% + 400px)); }
.result-card footer { min-height:80px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px; }.result-card footer span,.result-card footer strong { display:block; }.result-card footer span { margin-bottom:4px; color:#8f8983; font-size:8px; text-transform:uppercase; letter-spacing:.12em; }.result-card footer strong { font-size:13px; }.result-card footer>b { color:var(--accent-soft); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.results-cta { margin-top:16px; padding:28px 30px; display:flex; align-items:center; justify-content:space-between; gap:28px; border:1px solid rgba(255,100,76,.28); border-radius:16px; background:#171312; }.results-cta strong,.results-cta span { display:block; }.results-cta strong { font-family:Georgia,serif; font-size:24px; font-weight:500; }.results-cta span { margin-top:7px; color:#9d9790; font-size:11px; }
.versus-label { color:#8e8881; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; }.versus-grid article h3 { max-width:390px; font-family:Georgia,serif; font-weight:500; line-height:1.1; }
.final-proof { display:flex; flex-wrap:wrap; gap:12px 20px; margin-top:24px; }.final-proof span { display:flex; align-items:center; gap:6px; color:#b7b1a9; font-size:10px; }.final-proof i { color:var(--accent); }
.mobile-sticky-cta { display:none; }

/* Client account menu and persistent settings */
.user-menu-wrap { position:relative; }
.user-chip { min-height:46px; padding:5px 8px 5px 5px; color:var(--ink); border:1px solid transparent; border-radius:12px; background:transparent; cursor:pointer; text-align:left; }
.user-chip:hover,.user-chip[aria-expanded="true"] { border-color:var(--line); background:#151718; }.user-chip>i { color:var(--muted); font-size:14px; }
.user-menu-popover { position:absolute; z-index:30; right:0; top:calc(100% + 12px); width:310px; padding:9px; border:1px solid var(--line); border-radius:15px; background:#101213; box-shadow:0 30px 80px rgba(0,0,0,.55); }
.user-menu-popover header { display:flex; align-items:center; gap:11px; padding:12px; margin-bottom:6px; border-bottom:1px solid var(--line); }.user-menu-popover header>span { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:white; background:var(--accent); font-size:11px; font-weight:900; }.user-menu-popover header strong,.user-menu-popover header small { display:block; }.user-menu-popover header small { max-width:210px; margin-top:3px; overflow:hidden; color:var(--muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.user-menu-popover>button { width:100%; min-height:58px; display:flex; align-items:center; gap:12px; padding:10px 12px; color:var(--ink); border:0; border-radius:10px; background:transparent; text-align:left; cursor:pointer; }.user-menu-popover>button:hover { background:#191b1c; }.user-menu-popover>button>i { width:24px; color:var(--accent-soft); font-size:19px; }.user-menu-popover>button span,.user-menu-popover>button strong,.user-menu-popover>button small { display:block; }.user-menu-popover>button small { margin-top:3px; color:var(--muted); font-size:9px; font-weight:400; }.user-menu-popover>button:last-child { margin-top:5px; border-top:1px solid var(--line); border-radius:0 0 10px 10px; }.user-menu-popover>button:last-child i { color:#ff7b6b; }
.settings-nav button { display:flex; align-items:center; gap:10px; cursor:pointer; }.settings-nav button i { width:20px; color:#77736e; font-size:17px; }.settings-nav button.is-active i { color:var(--accent); }
.settings-toolbar { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:32px; padding-bottom:25px; border-bottom:1px solid var(--line); }.settings-toolbar>div:first-child>span { color:var(--accent-soft); font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.13em; }.settings-toolbar h2 { margin:7px 0 6px; font-family:Georgia,serif; font-size:31px; font-weight:500; }.settings-toolbar p { margin:0; color:var(--muted); font-size:11px; }.settings-toolbar>div:last-child { display:flex; align-items:center; gap:12px; }.settings-toolbar [role="status"] { color:var(--accent-soft); font-size:10px; }
.account-summary { display:flex; align-items:center; gap:14px; margin-bottom:30px; padding:18px; border:1px solid var(--line); border-radius:14px; background:#151718; }.account-summary>span { width:52px; height:52px; display:grid; place-items:center; border-radius:14px; color:white; background:var(--accent); font-weight:900; }.account-summary>div { min-width:0; flex:1; }.account-summary strong,.account-summary small { display:block; }.account-summary small { margin-top:4px; color:var(--muted); }.account-summary em { padding:7px 9px; border-radius:7px; color:var(--copper); background:#1d1812; font-size:9px; font-style:normal; font-weight:800; text-transform:capitalize; }
.settings-callout { display:flex; gap:14px; margin-bottom:28px; padding:18px; border:1px solid var(--line); border-radius:13px; background:#151718; }.settings-callout>i { color:var(--copper); font-size:24px; }.settings-callout strong,.settings-callout p { display:block; }.settings-callout p { margin:5px 0 0; color:var(--muted); font-size:11px; }.settings-callout--accent { margin:26px 0 0; border-color:rgba(255,100,76,.3); background:#181313; }.settings-callout--accent>i { color:var(--accent); }
.workspace-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:28px; overflow:hidden; border:1px solid var(--line); border-radius:13px; background:var(--line); }.workspace-meta>div { min-height:90px; padding:18px; background:#151718; }.workspace-meta span,.workspace-meta strong { display:block; }.workspace-meta span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }.workspace-meta strong { margin-top:10px; color:var(--ink); font-size:14px; }
.color-field { display:grid; grid-template-columns:55px 1fr; gap:8px; }.color-field input[type="color"] { width:55px; padding:5px; }.settings-wide-field { display:grid; gap:8px; margin-top:20px; color:var(--muted); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.security-setting { min-height:96px; display:flex; align-items:center; justify-content:space-between; gap:22px; padding:18px 0; border-bottom:1px solid var(--line); }.security-setting>div { display:flex; align-items:center; gap:14px; }.security-setting__icon { width:42px; height:42px; display:grid; flex:0 0 auto; place-items:center; border:1px solid var(--line); border-radius:11px; color:var(--accent-soft); background:#151718; font-size:20px; }.security-setting strong,.security-setting p { display:block; }.security-setting p { margin:5px 0 0; color:var(--muted); font-size:11px; line-height:1.45; }

/* A first-time user should reach the next action above the fold. */
.workspace .content-view { padding-top:clamp(34px,4vw,56px); }
.workspace .hero-row { align-items:center; gap:42px; margin-bottom:42px; }
.workspace .hero-row h1 { max-width:760px; font-size:clamp(52px,5.2vw,78px); line-height:.94; }
.workspace .hero-copy { max-width:420px; }
.workspace .metric-grid { margin-bottom:48px; }
.empty-card--onboarding { padding:40px; display:grid; grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr) auto; align-items:center; gap:34px; text-align:left; border-style:solid; background:linear-gradient(120deg,#111314,#0d0f10); }
.empty-card--onboarding h2 { margin:7px 0 10px; font-size:30px; }
.empty-card__routes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.empty-card__routes>span { min-height:112px; padding:15px; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid var(--line); border-radius:12px; background:#0b0d0e; }
.empty-card__routes i { margin-bottom:auto; color:var(--accent); font-size:20px; }
.empty-card__routes strong,.empty-card__routes small { display:block; }
.empty-card__routes strong { font-size:11px; }
.empty-card__routes small { margin-top:5px; color:var(--muted); font-size:9px; line-height:1.35; }

@media (max-width:1200px) {
  .hero-showcase { width:min(900px,100%); margin:auto; }.feature-bento { grid-template-columns:1fr 1fr; }.feature-card--wide,.feature-card--import { grid-column:span 2; }.result-grid { grid-template-columns:1fr 1fr; }.result-card--wide { grid-column:span 2; }
}
@media (max-width:800px) {
  .hero-showcase { min-height:545px; padding:15px 10px 35px; }.hero-browser { width:90%; height:500px; }.hero-browser>div { height:405px; }.hero-float { width:170px; height:155px; }.hero-float img { height:118px; }.hero-float--one { top:285px; }.hero-float--two { top:385px; }
  .proof-metrics { grid-template-columns:1fr 1fr; }.proof-metrics article:nth-child(2) { border-right:0; }.proof-metrics article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .section-intro--split { grid-template-columns:1fr; gap:20px; }.feature-bento { grid-template-columns:1fr; }.feature-card,.feature-card--wide,.feature-card--import { grid-column:auto; }.feature-card--wide { grid-template-columns:1fr; }.result-grid { grid-template-columns:1fr; grid-auto-rows:430px; }.result-card--wide { grid-column:auto; }.result-window { height:350px; }.result-card:hover .result-window img { transform:none; }
  .settings-toolbar { flex-direction:column; }.settings-toolbar>div:last-child { width:100%; justify-content:space-between; }.workspace-meta { grid-template-columns:1fr; }.security-setting { align-items:flex-start; flex-direction:column; }.security-setting .button { width:100%; }
  .empty-card--onboarding { grid-template-columns:1fr; padding:28px; }
  .empty-card__routes { grid-template-columns:1fr; }
  .empty-card__routes>span { min-height:88px; }
}
@media (max-width:650px) {
  .marketing { padding-bottom:72px; }.marketing-hero h1 { font-size:44px; }.hero-content { position:relative; z-index:4; }
  .hero-showcase { min-height:440px; margin-top:20px; padding:0 0 20px; }.hero-browser { width:92%; height:410px; margin:0 auto; transform:none; }.hero-browser>div { height:320px; }.hero-float { width:130px; height:125px; border-radius:12px; }.hero-float img { height:91px; }.hero-float span { padding:8px; font-size:7px; }.hero-float--one { left:-4px; top:260px; transform:rotate(-5deg); }.hero-float--two { right:-4px; top:305px; transform:rotate(4deg); }.hero-proof { right:0; top:-12px; min-width:190px; padding:10px 12px; }.hero-proof span { font-size:8px; }
  .compatibility b { display:none; }.proof-metrics article { min-height:125px; padding:22px 18px; }.proof-metrics strong { font-size:34px; }
  .feature-card { min-height:360px; padding:22px; }.booking-demo { transform:none; }.feature-card h3 { font-size:31px; }.motion-demo,.asset-demo { left:22px; right:22px; bottom:22px; }
  .result-grid { grid-auto-rows:410px; }.result-window { height:330px; }.result-card footer>b { display:none; }.results-cta { align-items:stretch; flex-direction:column; padding:24px; }
  .mobile-sticky-cta { position:fixed; z-index:45; left:16px; right:16px; bottom:14px; min-height:52px; display:flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:12px; background:var(--accent); color:#090a0b; box-shadow:0 16px 45px rgba(0,0,0,.45); font-weight:900; }
  .user-menu-popover { position:fixed; left:16px; right:16px; top:78px; width:auto; }.user-chip>i { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .result-card,.result-window img,.menu-demo b { transition:none!important; }.result-card:hover { transform:none; }.result-card:hover .result-window img { transform:none; }
}

/* Conversion, trust and billing flows 0.21 */
.public-brief { display:grid; grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr); gap:clamp(35px,7vw,110px); align-items:center; padding-top:70px; padding-bottom:70px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.public-brief h2 { margin:10px 0 16px; font-size:clamp(48px,6vw,82px); line-height:.95; letter-spacing:-.065em; }
.public-brief>div>p:last-child { color:#aaa39b; line-height:1.65; }
.public-brief-composer { padding:16px; border:1px solid #393b3a; border-radius:22px; background:linear-gradient(145deg,#17191a,#0e1011); box-shadow:0 28px 80px rgba(0,0,0,.35); }
.public-brief-composer textarea { width:100%; min-height:150px; resize:vertical; padding:20px; border:0; outline:0; color:#f4efe7; background:transparent; font:500 18px/1.55 inherit; }
.public-brief-composer>div { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:10px 10px 0; border-top:1px solid #2d302f; }
.public-brief-composer span { color:#928c85; font-size:11px; }.public-brief-composer button { min-height:50px; padding:0 20px; border:0; border-radius:12px; color:#0b0c0c; background:var(--accent); font-weight:900; cursor:pointer; }
.landing-entry-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; min-width:0; }
.landing-entry-card { min-width:0; display:flex; flex-direction:column; }
.landing-entry-card h3 { margin:10px 4px 4px; color:#f4efe7; font:500 25px/1.08 Georgia,"Times New Roman",serif; letter-spacing:-.035em; }
.landing-entry-card>p { margin:10px 4px 18px; color:#9d9790; font-size:13px; line-height:1.5; }
.landing-entry-index { margin:2px 4px 0; color:var(--accent)!important; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.landing-entry-card textarea { min-height:136px; padding:16px 4px; font-size:14px; }
.landing-entry-card label { display:grid; gap:8px; margin:18px 4px auto; color:#f4efe7; font-size:12px; font-weight:800; }
.landing-entry-card input { width:100%; min-height:54px; padding:0 15px; border:1px solid #393b3a; border-radius:12px; outline:0; color:#f4efe7; background:#0c0e0f; font:600 14px/1 inherit; }
.landing-entry-card input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(242,75,52,.12); }
.landing-entry-card--modernize { border-color:rgba(242,75,52,.55); background:linear-gradient(145deg,rgba(242,75,52,.08),#0e1011 45%); }
.result-card footer button { border:0; color:var(--accent-soft); background:transparent; font:800 10px/1 inherit; text-transform:uppercase; letter-spacing:.08em; cursor:pointer; }
.result-card--pets footer { border-top:3px solid #54b9ff; }.result-card--pets .result-window { background:#e9d9c4; }
.plan-comparison { margin-top:30px; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#111315; }
.plan-comparison__head { display:flex; justify-content:space-between; gap:20px; padding:24px 26px; border-bottom:1px solid var(--line); }.plan-comparison__head span { color:var(--muted); }
.plan-comparison__row { display:grid; grid-template-columns:1.35fr repeat(4,1fr); gap:1px; border-bottom:1px solid var(--line); }.plan-comparison__row:last-child { border:0; }
.plan-comparison__row>* { min-height:62px; display:flex; align-items:center; padding:14px 18px; background:#111315; }.plan-comparison__row span { color:#b6b0a9; border-left:1px solid var(--line); }
.marketing-footer { display:grid!important; grid-template-columns:1.5fr repeat(3,minmax(140px,.7fr)); gap:34px!important; align-items:start!important; }
.marketing-footer__brand p { margin:14px 0 8px; }.marketing-footer__brand small { color:#777; }.marketing-footer__column { display:flex!important; flex-direction:column; align-items:flex-start; gap:11px!important; }.marketing-footer__column strong { margin-bottom:7px; color:#f5f0e8; }.marketing-footer__column a,.marketing-footer__column button { color:#aaa39b; }.marketing-footer__copyright { grid-column:1/-1; padding-top:24px; border-top:1px solid var(--line); }
.invoice-request { display:flex; align-items:center; justify-content:space-between; gap:30px; margin-top:30px; padding:28px; border:1px solid var(--line); border-radius:18px; background:#111315; }.invoice-request h2 { margin:7px 0; }.invoice-request p:last-child { max-width:700px; color:var(--muted); line-height:1.55; }
.backup-warning { display:flex; gap:16px; margin:20px 0; padding:18px; border:1px solid #6b4d22; border-radius:14px; background:#20170d; }.backup-warning>i { color:#f5b75c; font-size:26px; }.backup-warning p { color:#c7b28f; line-height:1.5; }

@media(max-width:1100px){.landing-entry-grid{grid-template-columns:1fr}}
@media(max-width:900px){.public-brief{grid-template-columns:1fr}.marketing-footer{grid-template-columns:1fr 1fr}.marketing-footer__brand,.marketing-footer__copyright{grid-column:1/-1}.plan-comparison{overflow-x:auto}.plan-comparison__row{min-width:760px}.invoice-request{align-items:flex-start;flex-direction:column}}
@media(max-width:650px){.public-brief{padding-top:50px;padding-bottom:50px}.public-brief-composer>div{align-items:stretch;flex-direction:column}.public-brief-composer button{width:100%}.marketing-footer{grid-template-columns:1fr}.marketing-footer__brand,.marketing-footer__copyright{grid-column:auto}}
@media(max-width:650px){body:has(#gali-cookie-control:not([hidden])) .mobile-sticky-cta{left:76px}}

/* Curated Webflow-inspired showcase and clearer client UI 0.18 */
.feature-bento { grid-template-columns:repeat(3,minmax(0,1fr)); }
.feature-card--import { grid-column:1/-1; }
.quality-demo { position:absolute; left:30px; right:30px; bottom:30px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; overflow:hidden; border:1px solid var(--line); border-radius:13px; background:var(--line); }
.quality-demo span { min-height:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:#0c0e0f; color:#8f8982; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.quality-demo b { color:#f4efe7; font-family:Georgia,serif; font-size:27px; font-weight:500; letter-spacing:-.04em; }
.seo-paths { display:grid; grid-template-columns:1fr; gap:22px; }
.seo-paths .path-card { min-width:0; height:620px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr); gap:0; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:20px; background:#111315; }
.path-card__visual { position:relative; min-height:480px; overflow:hidden; background:#ebe6dd; }
.path-card__visual img { width:100%; height:100%; display:block; object-fit:cover; object-position:top; transition:transform .7s cubic-bezier(.2,.75,.2,1); }
.path-card:hover .path-card__visual img { transform:scale(1.025); }
.path-card__visual>span { position:absolute; left:20px; bottom:20px; display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid rgba(255,255,255,.22); border-radius:9px; color:#fff; background:rgba(7,8,9,.78); backdrop-filter:blur(12px); font-size:10px; font-weight:800; }
.path-card__status { position:absolute; right:20px; top:20px; min-width:205px; display:grid; grid-template-columns:32px 1fr; column-gap:9px; padding:12px; border:1px solid rgba(255,255,255,.2); border-radius:12px; color:#f7f3ed; background:rgba(8,10,11,.82); box-shadow:0 18px 45px rgba(0,0,0,.24); backdrop-filter:blur(14px); }
.path-card__status i { width:32px; height:32px; grid-row:1/3; display:grid; place-items:center; border-radius:9px; color:#090a0b; background:#f4efe7; font-size:17px; }
.path-card__status strong,.path-card__status small { display:block; }
.path-card__status strong { font-size:10px; }
.path-card__status small { margin-top:3px; color:#a8a29b; font-size:8px; }
.path-card--url .path-card__status i { background:#9fc8ff; }
.path-card--code .path-card__status i { background:#f24b34; }
.path-card--idea .path-card__status i { background:#f1c588; }
.path-card__copy { padding:42px; display:flex; flex-direction:column; justify-content:center; }
.seo-paths .path-card h2 { font-family:Georgia,serif; font-size:clamp(38px,4vw,58px); font-weight:500; line-height:1; letter-spacing:-.045em; }
.seo-paths .path-card>div>p:not(.marketing-kicker) { min-height:0; color:#9d9790; line-height:1.65; }
.seo-paths .path-card:nth-child(2) .path-card__visual { order:2; }
.seo-paths .path-card:nth-child(2) .path-card__copy { order:1; }
.steps { position:relative; gap:0; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--line); }
.steps::before { content:""; position:absolute; left:9%; right:9%; top:71px; height:1px; background:linear-gradient(90deg,transparent,var(--accent),var(--copper),transparent); opacity:.55; }
.steps article { position:relative; min-height:290px; padding:32px; border:0; border-right:1px solid var(--line); border-radius:0; background:#111315; }
.steps article:last-child { border-right:0; }
.steps article>span { display:block; color:var(--accent); }
.steps article>i { width:52px; height:52px; display:grid; place-items:center; margin-top:24px; border:1px solid var(--line); border-radius:14px; color:#e8e2da; background:#0b0d0e; font-size:24px; }
.steps h3 { margin:28px 0 10px; font-family:Georgia,serif; font-size:27px; font-weight:500; line-height:1.05; }
.steps small { display:block; margin-top:22px; color:#77716b; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.steps .step-highlight { border-color:var(--accent); background:radial-gradient(circle at 100% 0,rgba(255,100,76,.18),transparent 45%),#151314; box-shadow:none; }
.comparison-stage { grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); align-items:stretch; }
.comparison-pane { min-width:0; }
.comparison-pane>img { height:500px; object-position:top; }
.comparison-pane--editor { padding:16px; }
.elementor-editor { height:500px; display:grid; grid-template-columns:150px minmax(0,1fr) 145px; overflow:hidden; border:1px solid #2d2e31; border-radius:11px; background:#1e1f23; box-shadow:0 22px 60px rgba(0,0,0,.28); }
.elementor-sidebar,.elementor-navigator { min-width:0; color:#d7d7db; background:#25262a; font-family:Inter,Arial,sans-serif; font-size:8px; }
.elementor-sidebar { display:flex; flex-direction:column; border-right:1px solid #34353a; }
.elementor-sidebar header,.elementor-navigator header { min-height:44px; display:flex; align-items:center; gap:7px; padding:0 10px; border-bottom:1px solid #38393e; }
.elementor-sidebar header i { color:#ff5a43; font-size:16px; }
.editor-search { margin:10px; padding:9px; border:1px solid #424349; border-radius:5px; color:#8f9096; background:#1c1d20; }
.editor-widget-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:0 10px; }
.editor-widget-grid span { min-height:61px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; border:1px solid #3a3b40; border-radius:5px; background:#2c2d31; text-align:center; }
.editor-widget-grid i { color:#f0f0f2; font-size:17px; }
.elementor-sidebar footer { margin-top:auto; min-height:38px; display:flex; align-items:center; justify-content:space-around; border-top:1px solid #3a3b40; color:#9b9ca2; font-size:13px; }
.elementor-canvas { position:relative; min-width:0; overflow:hidden; background:#efede8; }
.elementor-canvas img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:0; }
.editor-selection { position:absolute; z-index:2; left:8px; right:8px; top:12px; min-height:82px; display:flex; align-items:flex-start; justify-content:space-between; border:2px solid #ff4b31; pointer-events:none; }
.editor-selection b { margin:-24px 0 0 -2px; padding:5px 8px; color:white; background:#ff4b31; font-size:8px; }
.editor-selection i { margin:-2px -2px 0 0; padding:5px; color:white; background:#ff4b31; }
.elementor-navigator { border-left:1px solid #34353a; background:#202125; }
.elementor-navigator header { justify-content:space-between; }
.elementor-navigator>span { display:flex; align-items:center; gap:5px; padding:9px 8px; border-bottom:1px solid #2f3034; color:#b7b8bd; white-space:nowrap; }
.elementor-navigator>span.is-active { color:white; background:#34353a; }
.elementor-navigator>span.nested { padding-left:22px; color:#8f9095; }
.result-grid--curated { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:590px; }
.result-grid--curated .result-window { height:508px; }
.result-grid--curated .result-window img { min-height:0; height:100%; object-fit:cover; object-position:top; }
.result-grid--curated .result-card:hover .result-window img { transform:scale(1.02); }
.result-card--consulting .result-window { background:#f5f5f1; }
.result-card--consulting footer { border-top:3px solid #c7ff35; }
.result-card--agency .result-window { background:#0b0d0c; }
.result-card--agency footer { border-top:3px solid #b8ee2b; }
.result-card--architecture .result-window { background:#efefed; }
.result-card--architecture footer { border-top:3px solid #ef2f25; }
.result-card--hospitality footer { border-top:3px solid #db8e70; }

/* Keep the bento dense: every row is intentionally filled. */
.feature-bento { grid-template-columns:repeat(6,minmax(0,1fr)); grid-auto-flow:dense; }
.feature-card--wide { grid-column:span 4; }
.feature-card:not(.feature-card--wide) { grid-column:span 2; }
.feature-card--import { grid-column:1/-1; }
.feature-bento { gap:18px; }
.feature-card:not(.feature-card--wide) { display:flex; flex-direction:column; }
.feature-card:not(.feature-card--wide) .menu-demo { margin-top:auto; }
.feature-card:not(.feature-card--wide) .motion-demo,
.feature-card:not(.feature-card--wide) .asset-demo,
.feature-card:not(.feature-card--wide) .quality-demo {
  position:relative;
  left:auto;
  right:auto;
  bottom:auto;
  width:100%;
  flex:0 0 auto;
  margin-top:auto;
}
.feature-card--wide>div:first-child { max-width:560px; }
.feature-card--wide .booking-demo { width:min(100%,370px); justify-self:end; }
.feature-card--import .import-demo { width:min(100%,390px); justify-self:end; }

@media (min-width:1500px) {
  .feature-card { min-height:430px; padding:34px; }
  .feature-card h3 { margin-top:18px; }
  .feature-card--wide { gap:56px; }
  .feature-card:not(.feature-card--wide) .motion-demo,
  .feature-card:not(.feature-card--wide) .asset-demo,
  .feature-card:not(.feature-card--wide) .quality-demo { margin-top:30px; }
}

/* The same approved crop is shown before and inside Elementor. */
.comparison-pane>img,.elementor-canvas img { object-fit:cover; object-position:top center; }

/* Remove legacy lime from the signed-in product and normalize spacing. */
.workspace { --lime:var(--accent); --lime-soft:var(--accent-soft); }
.content-view { width:min(100%,1480px); padding:clamp(38px,5vw,72px) clamp(22px,4vw,58px) 88px; }
.topbar { min-height:82px; padding:16px clamp(22px,4vw,58px); }
.topbar-actions { gap:12px; }
.credit-pill,.privacy-badge { border-color:rgba(255,100,76,.26); color:#d9d3cc; background:#181313; }
.status-dot,.copilot-topbar small i { background:var(--accent); box-shadow:0 0 0 4px rgba(255,100,76,.14); }
.billing-hero h1 span,.billing-summary>strong,.cockpit-card--credits>strong,.demo-route strong { color:var(--accent); }
.billing-summary,.cockpit-card--credits { background:radial-gradient(circle at 92% 0,rgba(213,154,84,.25),transparent 38%),#111315; }
.billing-plan.is-selected::before,.send-button span,.workflow-step.is-complete i { color:#0a0a0a; background:var(--accent); }
.suggestion-chip:hover,.assistant-composer:focus-within { border-color:var(--accent); background:#181313; }
.assistant-composer:focus-within { box-shadow:0 0 0 3px rgba(255,100,76,.14),0 8px 24px rgba(0,0,0,.18); }
.workflow-step.is-complete i { border-color:var(--accent); }
.workflow-step.is-current i { box-shadow:0 0 0 4px rgba(255,100,76,.24); }
.copilot-shell,.cockpit-card,.technical-history { border-color:var(--line); background:#111315; box-shadow:none; }
.copilot-topbar { background:#0f1112; }
.assistant-thread { padding:24px 22px 14px; }
.assistant-composer { margin:0 18px 14px; }
.project-cockpit { gap:14px; }

@media (max-width:1100px) {
  .seo-paths .path-card { height:auto; grid-template-columns:1fr; }
  .seo-paths .path-card:nth-child(2) .path-card__visual,.seo-paths .path-card:nth-child(2) .path-card__copy { order:initial; }
  .path-card__visual { height:390px; min-height:0; }
  .comparison-stage { grid-template-columns:1fr; }
  .feature-bento { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .feature-card,.feature-card--wide,.feature-card:not(.feature-card--wide),.feature-card--import { grid-column:span 1; }
  .feature-card--wide,.feature-card--import { grid-column:1/-1; }
}
@media (max-width:800px) {
  .feature-bento { grid-template-columns:1fr; }
  .feature-card,.feature-card--wide,.feature-card--import { grid-column:auto; }
  .steps { grid-template-columns:1fr 1fr; }
  .steps::before { display:none; }
  .steps article:nth-child(2) { border-right:0; }
  .steps article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .result-grid--curated { grid-template-columns:1fr; grid-auto-rows:460px; }
  .result-grid--curated .result-window { height:380px; }
  .elementor-editor { grid-template-columns:122px minmax(0,1fr); }
  .elementor-navigator { display:none; }
}
@media (max-width:650px) {
  .path-card__visual { height:260px; min-height:0; }
  .path-card__copy { padding:28px 22px; }
  .steps { grid-template-columns:1fr; }
  .steps article { min-height:245px; border-right:0; border-bottom:1px solid var(--line); }
  .steps article:nth-child(2) { border-right:0; }
  .path-card__status { right:12px; top:12px; min-width:178px; }
  .comparison-pane>img,.elementor-editor { height:330px; }
  .elementor-editor { grid-template-columns:92px minmax(0,1fr); }
  .editor-widget-grid { grid-template-columns:1fr; }
  .editor-widget-grid span:nth-child(n+3) { display:none; }
  .result-grid--curated { grid-auto-rows:390px; }
  .result-grid--curated .result-window { height:310px; }
  .quality-demo { left:22px; right:22px; bottom:22px; }
}

/* Workspace polish and accountable billing 0.23 */
.workspace .home-view{max-width:1280px}.workspace .home-hero{padding:28px 0 18px}.workspace .home-hero>p:not(.eyebrow){max-width:800px;margin:0;color:var(--muted);font-size:17px;line-height:1.65}.workspace .home-composer{margin-top:32px;padding:18px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,#171919,#101111);box-shadow:0 26px 80px rgba(0,0,0,.28)}.workspace .home-composer textarea{box-sizing:border-box;width:100%;min-height:170px;padding:18px;border:0;resize:vertical;background:transparent;color:var(--ink);font:500 17px/1.55 inherit;outline:none}.workspace .home-composer__footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 4px 2px;border-top:1px solid var(--line)}
.workspace .home-starts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}.workspace .home-starts button{appearance:none;min-width:0;min-height:124px;display:grid;grid-template-columns:auto 1fr;grid-template-areas:'icon title' 'icon copy';align-content:center;column-gap:14px;row-gap:6px;padding:20px;border:1px solid var(--line);border-radius:18px;background:#111314;color:var(--ink);text-align:left;cursor:pointer;transition:.2s ease}.workspace .home-starts button:hover{border-color:var(--accent);transform:translateY(-2px)}.workspace .home-starts i{grid-area:icon;align-self:start;color:var(--accent);font-size:24px}.workspace .home-starts strong{grid-area:title;font-size:14px}.workspace .home-starts span{grid-area:copy;color:var(--muted);font-size:12px;line-height:1.4}
.credit-store,.admin-test-credits{margin-top:34px;padding:28px;display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:34px;align-items:center;border:1px solid var(--line);border-radius:18px;background:#111314}.credit-store h2,.admin-test-credits h2{margin:8px 0;font-size:30px}.credit-store p:last-child,.admin-test-credits p:last-child{margin:0;color:var(--muted);line-height:1.55}.credit-pack-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.credit-pack-grid article{min-height:170px;display:flex;flex-direction:column;padding:18px;border:1px solid var(--line);border-radius:14px;background:#0b0d0e}.credit-pack-grid span{color:var(--accent-soft);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.credit-pack-grid strong{margin-top:18px;font-size:22px}.credit-pack-grid small{margin:5px 0 18px;color:var(--muted)}.credit-pack-grid button{width:100%;margin-top:auto}.admin-test-credits{grid-template-columns:1fr auto;border-color:rgba(255,100,76,.35);background:linear-gradient(120deg,#171314,#111314)}
@media(max-width:800px){.workspace .home-starts{grid-template-columns:1fr}.workspace .home-composer__footer{align-items:stretch;flex-direction:column}.credit-store,.admin-test-credits{grid-template-columns:1fr}.credit-pack-grid{grid-template-columns:1fr}}
.admin-test-credits__actions{display:flex;align-items:end;gap:10px}.admin-test-credits__actions label{display:grid;gap:7px;color:var(--muted);font-size:11px}.admin-test-credits__actions select{min-width:140px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#0b0d0e;color:var(--text)}
@media(max-width:800px){.admin-test-credits__actions{align-items:stretch;flex-direction:column}}

/* High-contrast production controls: the signed-in product never inherits the
   legacy light surface palette used by the public landing. */
.workspace .job-card,.workspace .cockpit-card,.workspace .technical-history{color:#f5f0e9;background:#111315}
.workspace .artifact-link,.workspace .edit-button,.workspace .validate-button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;border:1px solid #494c4d;background:#1a1c1d;color:#f5f0e9;opacity:1;cursor:pointer}
.workspace .artifact-link:hover,.workspace .edit-button:hover,.workspace .validate-button:hover{border-color:var(--accent);background:#211817;color:#fff}
.workspace .artifact-link--primary{border-color:#f4efe7;background:#f4efe7;color:#0b0d0e}
.workspace .artifact-link--primary:hover{border-color:#fff;background:#fff;color:#0b0d0e}
.workspace .runtime-chip,.workspace .artifact-link--locked{border:1px solid #434647;background:#242728;color:#d8d2cb;opacity:1}
.workspace .cockpit-heading span,.workspace .cockpit-card>span,.workspace .safety-card p,.workspace .safety-card small{color:#aaa49d}
.workspace .workflow-step{color:#aaa49d}.workspace .workflow-step.is-complete{color:#d8d2cb}.workspace .workflow-step.is-current{color:#fff}
.workspace .workflow-step::after{background:#484b4c}.workspace .workflow-step i{border-color:#5a5d5e;background:#202223}
.workspace .benchmark-card{background:linear-gradient(145deg,#17191a,#101213)}
.workspace .benchmark-metrics>div{border-color:#3a3d3e;background:#1b1d1e}
.workspace .benchmark-metrics span,.workspace .benchmark-metrics small{color:#aaa49d}.workspace .benchmark-metrics strong{color:#fff}
.workspace .benchmark-phases span{border:1px solid #3a3d3e;background:#0b0d0e;color:#e8e2db}.workspace .benchmark-phases b{color:var(--accent)}
.workspace .production-step.is-upcoming{opacity:.78}.workspace .production-step.is-upcoming strong{color:#d4cec7}.workspace .production-step.is-upcoming small{color:#938d86}
.workspace .production-step__action .button--primary{color:#0b0d0e}.workspace .production-step__action .button--ghost{border-color:#555859;color:#f4efe8;background:#191b1c}

/* Copilot production flow 0.24 */
/* Customer storage manager: bounded cards, readable totals and explicit cleanup. */
#files-view { max-width:1440px; margin-inline:auto; }
.storage-panel { margin-bottom:24px; padding:28px; border:1px solid var(--line); border-radius:18px; background:#101213; min-width:0; }
.storage-panel header { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; margin-bottom:24px; }
.storage-panel h2 { margin:0; font-size:24px; line-height:1.2; }
.storage-panel p,.storage-panel small { color:#bcb8b2; line-height:1.6; }
.storage-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.storage-stats span { display:block; color:#bcb8b2; font-size:12px; margin-bottom:10px; }
.storage-stats strong { font-size:clamp(22px,2.7vw,36px); color:#f4efe8; }
.storage-panel progress { display:block; width:100%; height:10px; margin:24px 0; border:0; border-radius:8px; overflow:hidden; background:#2b2e30; accent-color:var(--accent); }
.storage-panel progress::-webkit-progress-bar { background:#2b2e30; }
.storage-panel progress::-webkit-progress-value { background:var(--accent); border-radius:8px; }
.storage-categories { display:flex; flex-wrap:wrap; gap:12px 24px; font-size:12px; color:#bcb8b2; }
.storage-categories b { color:#f4efe8; }.storage-panel .storage-warning { color:#ffd29d; }
.storage-project { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto; gap:24px; align-items:center; padding:22px 0; border-top:1px solid var(--line); }
.storage-project>div { min-width:0; }.storage-project strong,.storage-project span,.storage-project small { display:block; overflow-wrap:anywhere; }
.storage-project strong { color:#f4efe8; font-size:15px; }.storage-project span { margin-top:6px; color:#bcb8b2; font-size:12px; }.storage-project small { margin-top:7px; font-size:11px; }
.storage-project-size strong { font-size:21px; }.storage-file-actions { padding:0 15px 15px; display:flex; gap:10px; flex-wrap:wrap; }
.storage-file-actions a,.storage-file-actions button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:8px 14px; border:1px solid #555; border-radius:8px; background:#17191a; color:#f4efe8; text-decoration:none; cursor:pointer; }
.storage-file-actions button:disabled { color:#bcb8b2; cursor:default; }.workspace-file small { display:block; margin-top:8px; color:#bcb8b2; line-height:1.5; overflow-wrap:anywhere; }
#files-view .workspace-file-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); }
#files-view .workspace-file strong { white-space:normal; overflow-wrap:anywhere; }
#files-view .file-toolbar { flex-wrap:wrap; }#files-view .file-toolbar label { min-width:0; }#files-view .file-toolbar select { max-width:100%; }
#storage-delete-description { overflow-wrap:anywhere; }#storage-delete-dialog { max-width:min(620px,calc(100vw - 32px)); }
@media(max-width:900px) { .storage-project { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.storage-project>div:last-child { grid-column:1/-1; } }
@media(max-width:560px) { .storage-panel { padding:20px 16px; }.storage-stats { grid-template-columns:1fr; gap:20px; }.storage-stats>div { display:flex; justify-content:space-between; align-items:center; gap:10px; }.storage-stats span { margin:0; }.storage-project { grid-template-columns:1fr; gap:12px; } }
.workspace .home-routes button{position:relative;min-height:190px;grid-template-columns:auto 1fr;grid-template-areas:'number icon' 'title title' 'copy copy' 'meta meta';align-content:start;padding:24px}.workspace .home-routes .route-number{grid-area:number;color:var(--accent);font:800 10px/1 inherit;letter-spacing:.14em}.workspace .home-routes i{grid-area:icon;justify-self:end}.workspace .home-routes strong{grid-area:title;margin-top:22px;font-size:20px;letter-spacing:-.025em}.workspace .home-routes>button>span:not(.route-number){grid-area:copy;font-size:13px;line-height:1.55}.workspace .home-routes small{grid-area:meta;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);color:#d2ccc5;font-size:10px;font-weight:750}
.planner-progress--compact{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}.planner-progress--compact button{border-right:1px solid var(--line)}.planner-progress--compact button:last-child{border-right:0}.planner-progress--compact button>span,.planner-progress--compact button>small{display:block}.planner-progress--compact button>small{margin-left:auto;color:var(--muted);font-size:9px;font-weight:500}.planner-advanced-toggle{width:100%;margin-top:18px;padding:17px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;border:1px solid var(--line);border-radius:13px;background:#111314;color:var(--ink);text-align:left;cursor:pointer}.planner-advanced-toggle:hover{border-color:var(--accent)}.planner-advanced-toggle>i:first-child{color:var(--accent);font-size:22px}.planner-advanced-toggle strong,.planner-advanced-toggle small{display:block}.planner-advanced-toggle small{margin-top:4px;color:var(--muted);font-size:10px;font-weight:400}
.production-flow{margin:0 0 24px;padding:24px;border:1px solid var(--line);border-radius:22px;background:#0f1112}.production-flow>header{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,420px);gap:28px;align-items:end;margin-bottom:20px}.production-flow>header h2{margin:7px 0 0;font-size:clamp(25px,3vw,39px);line-height:1.02;letter-spacing:-.045em}.production-flow>header>p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}.production-flow__steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:hidden;border:1px solid var(--line);border-radius:16px}.production-step{position:relative;min-height:205px;padding:18px;display:flex;flex-direction:column;gap:18px;border-right:1px solid var(--line);background:#111314}.production-step:last-child{border-right:0}.production-step.is-upcoming{opacity:.56}.production-step.is-current{background:linear-gradient(155deg,rgba(255,100,76,.1),transparent 55%),#141616}.production-step.needs-attention{box-shadow:inset 0 0 0 1px var(--accent)}.production-step__index{color:var(--accent);font-size:10px;font-weight:850;letter-spacing:.12em}.production-step>div:nth-child(2){display:grid;gap:7px}.production-step>div:nth-child(2)>strong{font-size:15px}.production-step>div:nth-child(2)>small{min-height:34px;color:var(--muted);font-size:9px;line-height:1.5}.production-step__action{display:grid;gap:7px;margin-top:auto}.production-step__action .button{width:100%;min-height:50px;padding:10px;display:flex;align-items:flex-start;flex-direction:column;justify-content:center;gap:3px}.production-step__action .button small{font-size:8px;font-weight:650;opacity:.72}.production-done,.production-working,.production-waiting{min-height:44px;display:flex;align-items:center;gap:8px;color:#b7b1aa;font-size:10px;font-weight:750}.production-done i{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#090909}.production-working{color:var(--accent)}.production-working i,.production-live>i{font-size:19px;animation:gali-spin 1.1s linear infinite}.production-live{margin-top:14px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;border:1px solid rgba(255,100,76,.35);border-radius:13px;background:#181313}.production-live[hidden]{display:none}.production-live strong,.production-live p{display:block;margin:0}.production-live p{margin-top:4px;color:var(--muted);font-size:10px;line-height:1.5}.production-live>b{color:var(--accent);font-size:18px}@keyframes gali-spin{to{transform:rotate(360deg)}}
.production-live__progress{display:block;width:100%;height:5px;margin-top:11px;border:0;border-radius:99px;overflow:hidden;background:#353031;appearance:none}.production-live__progress::-webkit-progress-bar{background:#353031}.production-live__progress::-webkit-progress-value{background:var(--accent);transition:width .35s ease}.production-live__progress::-moz-progress-bar{background:var(--accent)}
.production-flow__steps{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
@media(max-width:1180px){.production-flow__steps{grid-template-columns:repeat(3,minmax(0,1fr))}.production-step{border-bottom:1px solid var(--line)}.production-step:nth-child(3){border-right:0}.production-step:nth-child(n+4){border-bottom:0}}
@media(max-width:760px){.workspace .home-routes button{min-height:170px}.planner-progress--compact{grid-template-columns:1fr 1fr}.planner-progress--compact button{min-height:70px;align-items:flex-start;flex-direction:column;gap:5px}.planner-progress--compact button>small{margin-left:38px}.production-flow{padding:17px 13px}.production-flow>header{grid-template-columns:1fr}.production-flow__steps{grid-template-columns:1fr}.production-step{min-height:0;border-right:0;border-bottom:1px solid var(--line)!important}.production-step:last-child{border-bottom:0!important}.production-step__action .button{align-items:center}.production-live{grid-template-columns:auto 1fr}.production-live>b{display:none}}
@media(max-width:760px){.assistant-primary-action{margin-left:10px;margin-right:10px;grid-template-columns:1fr}.assistant-primary-action .button{width:100%;align-items:center}}
.nav-badge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;display:inline-grid;place-items:center;border-radius:999px;background:var(--accent);color:#0b0b0b;font-size:10px;font-weight:800}.nav-badge[hidden]{display:none}
.page-selector { margin: 24px 0; padding: clamp(16px, 3vw, 28px); border: 1px solid var(--border, #363838); border-radius: 18px; background: rgba(255,255,255,.025); }
.page-selector > p { color: var(--muted, #aaa); font-size: 14px; line-height: 1.6; }
.page-selector > label { display: grid; gap: 8px; max-width: 280px; margin: 18px 0; }
.page-selector-card { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; min-width: 0; margin: 14px 0; padding: 18px; border: 1px solid var(--border, #363838); border-radius: 12px; }
.page-selector-card legend { padding: 0 8px; font-weight: 600; }
.page-selector-card label { display: grid; gap: 7px; min-width: 0; margin: 0; }
.page-selector-card label:last-child { grid-column: 1 / -1; }
.page-selector input, .page-selector select { width: 100%; min-width: 0; box-sizing: border-box; }
#project-pages-dialog { max-height: calc(100dvh - 40px); overflow: auto; }
#project-pages-dialog .page-selector { margin-top: 0; }
#project-pages-approval { display: flex; align-items: center; gap: 12px; line-height: 1.5; }
#project-pages-approval input { width: 20px; height: 20px; flex-shrink: 0; accent-color: var(--accent); }
#project-pages-approval[hidden] { display: none; }
#project-pages-total { font-weight: 700; line-height: 1.6; }
#project-pages-notice { color: var(--muted); line-height: 1.6; }
.downloads-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin: 24px 0; }
.download-card { min-width: 0; border: 1px solid var(--border, #303232); border-radius: 18px; padding: 26px; background: var(--panel, #111313); }
.download-card.is-ready { border-color: #596d63; }
.download-card__top { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 14px; }
.download-card__top i { font-size: 25px; color: var(--accent); }
.download-card h2 { font-size: 23px; line-height: 1.3; overflow-wrap: anywhere; margin: 22px 0 12px; }
.download-card p, .download-card small, .download-help { color: var(--muted); line-height: 1.65; }
.download-card__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.download-card__actions .button { white-space: normal; text-align: center; max-width: 100%; text-decoration: none; }
.production-step__action a.button { text-decoration: none; }
.download-help { border-top: 1px solid var(--border, #303232); padding: 32px 0; margin-top: 36px; max-width: 860px; }
.download-help h2 { color: var(--text, #f5f5f0); }
.download-help li { margin-bottom: 12px; }
@media(max-width:900px) { .downloads-grid { grid-template-columns: minmax(0,1fr); } }
@media(max-width:600px) { .download-card { padding: 20px; } .download-card__actions .button { width:100%; } }
@media(max-width:600px) { .page-selector-card { grid-template-columns: 1fr; padding: 14px; } }
.delivery-notice { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:16px 24px; padding:18px 20px; border:1px solid var(--accent, #ff644c); border-radius:16px; }
.delivery-notice[hidden] { display:none; }
.delivery-notice p { margin:0; min-width:0; overflow-wrap:anywhere; }
.delivery-notice button { flex-shrink:0; }
@media(max-width:600px) { .delivery-notice { flex-direction:column; align-items:stretch; margin:12px; } }
