:root{--accent:#2456f6;--accent-hover:#1f49d6;--accent-soft:#eef2ff;--accent-text:#1f49d6;--bg:#fff;--surface:#fff;--surface-2:#f6f7f9;--bg-subtle:#f8f9fb;--border:#e6e8ec;--text:#0f1115;--text-2:#4a525c;--text-3:#7b8390;--text-muted:#9aa1ab;--success:#1f8a5b;--success-soft:#e7f5ee;--warning:#a55a26;--warning-soft:#fbf1e7;--pro:#9a7b16;--radius:10px;--shadow-sm:0 1px 2px #0f11150f;--shadow-lg:0 20px 50px -20px #0f111540;--font-sans:"Geist", system-ui, -apple-system, sans-serif;--font-display:"Instrument Serif", Georgia, serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--page-pad:24px}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg-subtle);color:var(--text);font-family:var(--font-sans);margin:0;line-height:1.55}a{color:inherit;text-decoration:none}h1,h2,h3{font-family:var(--font-display);margin:0;font-weight:600;line-height:1.12}.container{max-width:1120px;padding:0 var(--page-pad);margin:0 auto}.h-hero{font-size:2.6rem}.h-2{font-size:1.6rem}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);font-size:11px;font-weight:600}.small{color:var(--text-2);font-size:13px}.muted{color:var(--text-3)}.row{align-items:center;gap:10px;display:flex}.col{flex-direction:column;display:flex}.spacer{flex:1}.wrap{flex-wrap:wrap}.btn{appearance:none;border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;cursor:pointer;white-space:nowrap;border-radius:8px;align-items:center;gap:7px;padding:8px 14px;font-size:13px;font-weight:500;transition:background .12s,border-color .12s;display:inline-flex}.btn:hover{background:var(--surface-2)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-ghost{background:0 0;border-color:#0000}.btn-ghost:hover{background:var(--surface-2)}.btn-sm{padding:5px 10px;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible,.palette-choice:focus-visible,.template-choice:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 25%, transparent);outline-offset:2px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.input{border:1px solid var(--border);width:100%;font:inherit;background:var(--surface);border-radius:8px;padding:9px 12px;font-size:14px}.input:focus{border-color:var(--accent);outline:none}.badge{border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);border-radius:999px;align-items:center;gap:5px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-pro{color:var(--pro);background:#fbf5e3;border-color:#efe0b0}.badge-hosted{background:var(--success-soft);color:var(--success);border-color:#bfe6d2}.statuslabel{letter-spacing:.04em;text-transform:uppercase;border-radius:4px;padding:2px 7px;font-size:10px;font-weight:600}.sl-implemented{background:var(--success-soft);color:var(--success)}.sl-scaffolded{background:var(--accent-soft);color:var(--accent-text)}.sl-mocked{background:var(--surface-2);color:var(--text-3)}.sl-external{background:var(--warning-soft);color:var(--warning)}.topbar{z-index:20;height:54px;padding:0 var(--page-pad);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);background:#ffffffdb;align-items:center;gap:14px;display:flex;position:sticky;top:0}.brand-mark{background:var(--accent);color:#fff;width:24px;height:24px;font-family:var(--font-display);border-radius:6px;justify-content:center;align-items:center;font-size:15px;display:inline-flex}.modal-backdrop{z-index:100;background:#0f111573;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:var(--surface);box-shadow:var(--shadow-lg);border-radius:14px;width:100%;max-width:460px;overflow:hidden}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;padding:18px 20px;display:flex}.modal-body{padding:20px}.modal-footer{border-top:1px solid var(--border);justify-content:flex-end;gap:10px;padding:14px 20px;display:flex}.toast{background:var(--text);color:#fff;box-shadow:var(--shadow-lg);z-index:200;border-radius:8px;padding:10px 16px;font-size:13px;position:fixed;bottom:22px;left:50%;transform:translate(-50%)}.grid-cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;display:grid}.dev-pill{letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--warning);border-radius:4px;padding:2px 7px;font-size:10px;font-weight:700}.onboarding-progress{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px;display:grid}.onboarding-progress-item{align-items:center;gap:7px;min-width:0;display:flex}.onboarding-progress-label{font-size:12px;line-height:1.25}.selection-button.is-selected,.template-choice.is-selected,.control-choice.is-selected{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);box-shadow:inset 0 0 0 1px var(--accent)}.template-choice{appearance:none;color:var(--text);font:inherit}.fact-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px;display:grid}.fact-copy{min-width:0}.fact-actions{align-items:center;gap:6px;display:flex}.fact-decision.is-approved{border-color:var(--success);background:var(--success-soft);color:var(--success);box-shadow:inset 0 0 0 1px var(--success)}.fact-decision.is-skipped{border-color:var(--warning);background:var(--warning-soft);color:var(--warning);box-shadow:inset 0 0 0 1px var(--warning)}.utility-page{place-items:center;max-width:520px;min-height:calc(100vh - 54px);padding:32px 24px;display:grid}.utility-card{width:100%;max-width:460px;padding:28px}.account-page{max-width:760px}.account-data-card{max-width:640px}.account-data-card>.h-2{margin:6px 0}.account-data-section{border-top:1px solid var(--border);margin-top:26px;padding-top:22px}.account-data-section h2{margin-bottom:6px;font-size:18px}.account-data-section p{margin-bottom:14px}.danger-zone{border-top-color:color-mix(in srgb, var(--danger) 35%, var(--border))}.danger-zone .input{max-width:260px;margin-bottom:10px}.canvas-editable{border-radius:2px;outline:none}.canvas-editable:hover{outline:1px dashed color-mix(in srgb, currentColor 45%, transparent);outline-offset:3px}.canvas-editable:focus{outline:1px solid color-mix(in srgb, currentColor 60%, transparent);outline-offset:3px}.builder-shell{grid-template-columns:220px minmax(0,1fr) 250px;height:calc(100vh - 54px);display:grid}.builder-preview,.builder-structure,.builder-design{min-width:0}.builder-preview-toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.builder-device-controls{align-items:center;gap:6px;display:flex}.builder-page-preview{width:min(190px,34vw);height:34px;padding:4px 28px 4px 8px}.portfolio-frame{container-type:inline-size}.portfolio-responsive-grid{grid-template-columns:repeat(var(--portfolio-columns,1), minmax(0, 1fr));display:grid}@container (width<=560px){.portfolio-responsive-grid{grid-template-columns:minmax(0,1fr)}}.palette-choice{border:1px solid var(--border);cursor:pointer;border-radius:6px;width:34px;height:24px;padding:0;position:relative}.palette-choice.is-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.control-check{z-index:1;color:#fff;background:var(--accent);border-radius:999px;place-items:center;width:15px;height:15px;font-size:9px;font-weight:800;line-height:1;display:grid;position:absolute;top:-7px;left:-7px}.editor-drawer{background:var(--surface);width:min(460px,100%);min-width:0;height:100%;box-shadow:var(--shadow-lg);flex-direction:column;flex:0 0 min(460px,100%);display:flex;overflow:hidden}.editor-drawer-scroll{min-width:0;padding:18px;overflow:hidden auto}.editor-drawer-scroll>*,.editor-drawer-scroll .card,.editor-drawer-scroll .row,.editor-drawer-scroll .col{min-width:0;max-width:100%}.editor-drawer-scroll .row>.col{flex:1 1 0}.editor-drawer-scroll .input{min-width:0;max-width:100%}.editor-drawer-scroll textarea.input{overflow-wrap:anywhere;resize:vertical}.editor-inline-fields{align-items:flex-end;gap:6px}.focal-grid{grid-template-columns:repeat(3,minmax(44px,1fr));gap:4px;display:grid}.focal-grid .btn[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.portfolio-cover{aspect-ratio:16/7;object-fit:cover;border-radius:12px;width:100%;margin-bottom:24px;display:block}.canvas-preview-media{z-index:3;color:#fff;cursor:zoom-in;background:#0000009e;border:1px solid #ffffff8c;border-radius:999px;place-items:center;width:44px;height:44px;display:grid;position:absolute;top:8px;right:8px}.canvas-slideshow{position:relative}.canvas-slideshow-controls{justify-content:center;align-items:center;gap:12px;margin-top:8px;display:flex}.canvas-slideshow-controls button{min-width:44px;min-height:44px;color:inherit;background:0 0;border:1px solid;border-radius:999px}.canvas-lightbox{z-index:200;color:#fff;background:#08090cf0;grid-template-columns:56px minmax(0,1fr) 56px;align-items:center;padding:24px;display:grid;position:fixed;inset:0}.canvas-lightbox figure{text-align:center;min-width:0;margin:0}.canvas-lightbox img,.canvas-lightbox iframe{object-fit:contain;border:0;width:min(1100px,100%);max-width:100%;max-height:82vh}.canvas-lightbox iframe{aspect-ratio:16/9}.canvas-lightbox figcaption{margin-top:8px}.canvas-lightbox button{color:#fff;background:#00000080;border:1px solid #ffffff8c;border-radius:999px;min-width:44px;min-height:44px}.canvas-lightbox-close{position:absolute;top:16px;right:16px}.project-detail-canvas h1{max-width:16ch;margin:10px 0 30px;font-size:clamp(2.6rem,9vw,6.5rem);line-height:.95}.project-detail-overview{grid-template-columns:minmax(0,2fr) minmax(180px,1fr);gap:48px;margin-bottom:40px;display:grid}.project-detail-overview dl{margin:0}.project-detail-overview dl div{grid-template-columns:minmax(70px,max-content) 1fr;gap:10px;display:grid}.project-detail-overview dt{opacity:.62}.project-detail-overview dd{margin:0}.project-detail-media{gap:16px;display:grid}.project-detail-media img,.project-detail-media iframe{object-fit:contain;border:0;width:100%;max-height:88vh;display:block}.project-detail-media iframe{aspect-ratio:16/9}.canvas-site-nav{justify-content:space-between;align-items:center;gap:18px;margin-bottom:32px;display:flex}.canvas-site-nav>div{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px 18px;display:flex}.canvas-site-nav button,.canvas-site-nav a{min-height:44px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;padding:8px 0}.canvas-site-nav .canvas-nav-brand{font-weight:700}.canvas-project-pager{border-top:1px solid color-mix(in srgb, currentColor 16%, transparent);justify-content:space-between;gap:18px;margin-top:46px;padding-top:18px;display:flex}.canvas-project-pager button{min-height:44px;color:inherit;cursor:pointer;background:0 0;border:0;padding:8px 0}.supporting-page-title h1{margin-bottom:32px;font-size:clamp(2.6rem,9vw,6rem);line-height:.98}@container (width<=560px){.project-detail-canvas h1{font-size:clamp(2.4rem,16vw,4.6rem)}.project-detail-overview{grid-template-columns:minmax(0,1fr);gap:22px}.canvas-site-nav{flex-direction:column;align-items:flex-start;margin-bottom:24px}.canvas-site-nav>div{justify-content:flex-start}}@media (width<=1100px){.builder-shell{grid-template-columns:minmax(0,1fr);height:auto;min-height:calc(100vh - 54px)}.builder-preview{order:0;padding:12px!important;overflow:visible!important}.builder-structure{border-top:1px solid var(--border);order:1;border-right:0!important;overflow:visible!important}.builder-design{border-top:1px solid var(--border);order:2;border-left:0!important;overflow:visible!important}}@media (width<=600px){:root{--page-pad:12px}.topbar{gap:5px;padding:0 10px}.topbar-brand{gap:0!important}.topbar-brand-label{display:none}.topbar-primary-nav{gap:0!important;margin-left:0!important}.topbar-primary-nav .btn{padding-inline:8px}.topbar-auth-actions{gap:4px!important}.topbar-auth-actions .btn{padding-inline:9px}.topbar-account{display:none}.dashboard-header{flex-direction:column;align-items:stretch}.dashboard-actions{align-self:flex-start}.h-hero{font-size:2.2rem}.modal-backdrop{padding:10px}.onboarding-page{padding:24px 12px!important}.onboarding-progress{gap:4px}.onboarding-progress-item{text-align:center;flex-direction:column;gap:5px}.onboarding-progress-label{min-height:2.5em;font-size:11px}.fact-row{grid-template-columns:minmax(0,1fr);align-items:stretch}.fact-actions{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.fact-actions .btn{justify-content:center}.builder-preview-toolbar{flex-wrap:wrap;align-items:flex-start}.builder-device-controls{flex-wrap:wrap;width:100%}.builder-page-preview{width:100%}.utility-page{min-height:calc(100vh - 54px);padding:20px 12px}.utility-card{padding:22px}.editor-drawer{flex-basis:100%;width:100%}.editor-inline-fields{flex-direction:column;align-items:stretch}.canvas-lightbox{grid-template-columns:44px minmax(0,1fr) 44px;padding:12px}.canvas-lightbox img,.canvas-lightbox iframe{max-height:76vh}}.port-masonry{column-count:3;column-gap:10px}@container (width<=560px){.port-masonry{column-count:2}}.hover-lift{transition:transform .18s}@media (prefers-reduced-motion:no-preference){.hover-lift:hover{transform:translateY(-2px)}[data-animate=reveal] .reveal{animation:.6s cubic-bezier(.2,.7,.2,1) both port-rise}[data-animate=subtle] .reveal{animation:.5s both port-fade}}@keyframes port-rise{0%{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes port-fade{0%{opacity:.001}to{opacity:1}}