:root {
  --paper: #f4f1eb;
  --paper-deep: #eae5dc;
  --white: #fffefa;
  --ink: #202b43;
  --muted: #788094;
  --line: #e5e0d7;
  --coral: #ff704f;
  --coral-dark: #df593f;
  --blue: #5265e8;
  --blue-soft: #e9ecff;
  --mint: #a6c5ab;
  --shadow: 0 22px 60px rgba(43, 48, 65, .08);
  font-family: 'Aptos', 'Segoe UI', sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--paper); }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 50; padding: 10px 14px; background: var(--ink); color: white; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid rgba(32,43,67,.1); background: rgba(244,241,235,.93); backdrop-filter: blur(18px); }
.header-inner { max-width: 1480px; height: 78px; padding: 0 48px; margin: auto; display: flex; align-items: center; gap: 42px; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: 0 0 auto; }
.brand-mark { position: relative; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 3px; border-radius: 11px 11px 11px 4px; background: var(--coral); transform: rotate(-5deg); }
.brand-mark i { display: block; width: 4px; background: var(--white); border-radius: 5px; transform: rotate(17deg); }
.brand-mark i:nth-child(1) { height: 13px; margin-top: 7px; }
.brand-mark i:nth-child(2) { height: 20px; }
.brand-mark i:nth-child(3) { height: 13px; margin-bottom: 7px; }
.brand-copy { display: flex; flex-direction: column; gap: 1px; }
.brand-copy strong { font-family: Aptos Display, sans-serif; font-size: 19px; font-weight: 800; letter-spacing: -.8px; }
.brand-copy small { font-size: 8px; line-height: 1.2; letter-spacing: 2.2px; color: var(--muted); font-weight: 700; }
.main-nav { display: flex; align-items: center; gap: clamp(16px, 2.3vw, 37px); margin-left: auto; }
.main-nav a { position: relative; padding: 30px 0 27px; font-size: 12px; font-weight: 700; color: #626b7d; transition: color .2s ease; white-space: nowrap; }
.main-nav a:hover, .main-nav a.is-active { color: var(--ink); }
.main-nav a.is-active::after { position: absolute; left: 0; right: 0; bottom: 19px; height: 2px; content: ''; background: var(--coral); border-radius: 4px; }
.header-actions { display: flex; align-items: center; gap: 15px; }
.mode-pill { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; border: 1px solid #dedbd1; background: rgba(255,255,255,.48); border-radius: 30px; padding: 8px 11px; font-size: 9px; letter-spacing: .8px; font-weight: 800; color: #596276; }
.mode-dot, .status-led { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #54b28d; box-shadow: 0 0 0 3px rgba(84,178,141,.15); }
.header-cta { display: inline-flex; align-items: center; gap: 9px; background: var(--ink); color: white; padding: 11px 15px; border-radius: 999px; font-size: 11px; font-weight: 800; transition: background .2s, transform .2s; }
.header-cta:hover { background: var(--blue); transform: translateY(-1px); }
.mobile-menu, .mobile-nav { display: none; }

main { min-height: 360px; }
.page-wrap { max-width: 1480px; margin: auto; padding: 44px 48px 86px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--coral-dark); font-size: 10px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; }
.eyebrow::before { content: ''; width: 18px; height: 2px; background: var(--coral); border-radius: 2px; }
.hero-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 31px; }
.hero-intro h1 { max-width: 760px; margin: 14px 0 11px; font-family: Aptos Display, sans-serif; font-size: clamp(36px, 4.5vw, 65px); line-height: .99; letter-spacing: -3.5px; font-weight: 800; }
.hero-intro h1 span { color: var(--coral); }
.hero-intro p { max-width: 600px; margin: 0; font-size: 14px; line-height: 1.65; color: #6f7787; }
.hero-badge { display: flex; align-items: center; gap: 10px; min-width: 181px; margin-bottom: 5px; padding: 11px 14px; border: 1px solid #e0ddd5; background: rgba(255,255,255,.52); border-radius: 14px; }
.hero-badge .badge-icon { display: grid; place-items: center; width: 31px; height: 31px; background: #fff0e9; color: var(--coral); border-radius: 10px; font-size: 16px; }
.hero-badge small, .hero-badge strong { display: block; }
.hero-badge small { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.hero-badge strong { margin-top: 3px; font-size: 11px; }

.studio-grid { display: grid; grid-template-columns: minmax(340px, .86fr) minmax(450px, 1.14fr); gap: 19px; align-items: stretch; }
.studio-panel { overflow: hidden; min-width: 0; border: 1px solid #e3ded5; border-radius: 23px; background: var(--white); box-shadow: var(--shadow); }
.composer-panel { display: flex; flex-direction: column; padding: 24px 25px 22px; }
.panel-topline { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.panel-label { display: flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; }
.step-number { display: grid; place-items: center; width: 24px; height: 24px; background: var(--ink); color: #fff; border-radius: 8px; font-family: Aptos Display, sans-serif; font-size: 10px; }
.tiny-pill { border: 1px solid #e8e3db; border-radius: 999px; padding: 6px 9px; font-size: 9px; letter-spacing: .45px; font-weight: 800; color: #737b89; }
.composer-panel h2 { margin: 25px 0 7px; font-family: Aptos Display, sans-serif; font-size: 24px; letter-spacing: -1px; }
.composer-hint { margin: 0 0 19px; color: #737b89; font-size: 12px; line-height: 1.55; }
.prompt-box { position: relative; display: block; }
.prompt-box textarea { width: 100%; height: 143px; resize: vertical; min-height: 105px; padding: 16px 17px 38px; border: 1px solid #dcdde2; border-radius: 15px; outline: none; color: var(--ink); background: #fbfaf7; font-size: 13px; line-height: 1.55; transition: border .2s, box-shadow .2s, background .2s; }
.prompt-box textarea::placeholder { color: #9aa0ad; }
.prompt-box textarea:focus { border-color: var(--blue); background: white; box-shadow: 0 0 0 4px rgba(82,101,232,.1); }
.prompt-meta { position: absolute; right: 13px; bottom: 13px; display: flex; gap: 6px; align-items: center; color: #9299a5; font-size: 9px; pointer-events: none; }
.prompt-meta .spark { color: var(--coral); font-size: 13px; }
.suggestions { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 17px; }
.suggestion { border: 1px solid #e7e3db; background: transparent; border-radius: 999px; padding: 7px 10px; color: #71798a; cursor: pointer; font-size: 10px; font-weight: 700; transition: .2s; }
.suggestion:hover, .suggestion:focus-visible { border-color: #ffb29f; background: #fff4ef; color: var(--coral-dark); }
.control-row { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-top: 2px; }
.control-field label { display: block; margin-bottom: 7px; color: #707889; font-size: 9px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.control-field select { width: 100%; height: 41px; padding: 0 11px; border: 1px solid #e1ded7; border-radius: 11px; outline: none; background: #fbfaf7; color: var(--ink); font-size: 11px; font-weight: 700; }
.control-field select:focus { border-color: var(--blue); }
.size-output { float: right; color: var(--ink); font-size: 9px; letter-spacing: 0; }
.range-line { display: flex; align-items: center; gap: 9px; height: 41px; }
.range-line input { width: 100%; accent-color: var(--coral); }
.range-line span { width: 40px; color: var(--muted); text-align: right; font-size: 10px; }
.primary-button, .secondary-button, .quiet-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; cursor: pointer; transition: transform .18s, background .18s, box-shadow .18s; }
.primary-button { min-height: 48px; width: 100%; margin-top: 19px; padding: 0 18px; border-radius: 12px; background: var(--coral); color: white; font-size: 12px; font-weight: 800; box-shadow: 0 9px 18px rgba(255,112,79,.2); }
.primary-button:hover { background: var(--coral-dark); transform: translateY(-1px); box-shadow: 0 12px 22px rgba(255,112,79,.26); }
.primary-button:disabled { opacity: .52; cursor: wait; transform: none; }
.primary-button .button-arrow { margin-left: auto; font-size: 18px; font-weight: 500; }
.privacy-note { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; color: #8a909c; font-size: 9px; line-height: 1.45; }
.privacy-note .lock { color: var(--blue); font-size: 12px; }
.flow-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0 11px; color: #9a9eaa; font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.flow-divider::before, .flow-divider::after { content: ''; height: 1px; flex: 1; background: #eeebe6; }
.flow-mini-steps { display: flex; gap: 6px; }
.flow-step { display: flex; flex: 1; align-items: center; gap: 7px; min-width: 0; padding: 8px 9px; border: 1px solid #eeeae4; border-radius: 11px; background: #fbfaf7; color: #808796; }
.flow-step b { display: grid; flex: 0 0 auto; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #ebe8e0; color: #767c89; font-size: 9px; }
.flow-step span { overflow: hidden; font-size: 9px; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; }
.flow-step.is-current { border-color: #ffc1b1; background: #fff5f1; color: #9b4b3b; }
.flow-step.is-current b { background: var(--coral); color: white; }
.flow-step.is-done b { background: var(--blue); color: white; }

.stage-panel { position: relative; display: flex; flex-direction: column; min-height: 570px; padding: 21px 22px 17px; background: #f2efe9; }
.stage-head { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.stage-head .panel-label { color: #5f687a; }
.live-tag { display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; background: rgba(255,255,255,.72); padding: 7px 10px; color: #737b88; font-size: 9px; letter-spacing: .6px; font-weight: 800; }
.live-tag .status-led { width: 6px; height: 6px; }
.stage-canvas { position: relative; display: grid; flex: 1; place-items: center; min-height: 410px; margin: 14px 0; overflow: hidden; border: 1px solid #e5dfd6; border-radius: 17px; background:
    radial-gradient(ellipse at 50% 44%, rgba(255,255,255,.94), rgba(255,255,255,0) 54%),
    linear-gradient(145deg,#efeae1,#f8f5ee 59%,#eae6df);
}
.stage-canvas::before { position: absolute; inset: 0; content: ''; opacity: .32; background-image: radial-gradient(#bfc2c9 .8px, transparent .8px); background-size: 19px 19px; mask-image: linear-gradient(transparent 0%,#000 22%,#000 82%,transparent 100%); }
.stage-spotlight { position: absolute; left: 50%; top: 49%; width: min(57%,370px); aspect-ratio: 1; border-radius: 50%; transform: translate(-50%,-50%); background: radial-gradient(circle, rgba(255,255,255,.95), rgba(232,229,223,.52) 60%, transparent 70%); }
.stage-ground { position: absolute; left: 50%; bottom: 15%; width: 61%; height: 34px; transform: translateX(-50%); border-radius: 50%; background: rgba(53,58,76,.12); filter: blur(12px); }
.stage-preview-image { position: relative; z-index: 1; display: block; width: min(80%,580px); max-height: 395px; object-fit: contain; border-radius: 12px; filter: drop-shadow(0 24px 22px rgba(40,43,64,.15)); }
.stage-placeholder { position: relative; z-index: 1; display: flex; max-width: 310px; flex-direction: column; align-items: center; padding: 20px; text-align: center; }
.placeholder-emblem { display: grid; place-items: center; width: 83px; height: 83px; margin-bottom: 19px; border: 1px solid rgba(82,101,232,.2); border-radius: 28px 22px 32px 18px; background: linear-gradient(145deg,#fff9f0,#e8ecff); color: var(--blue); font-size: 31px; transform: rotate(-6deg); box-shadow: 0 15px 35px rgba(82,101,232,.1); }
.stage-placeholder h3 { margin: 0; font-family: Aptos Display, sans-serif; font-size: 18px; letter-spacing: -.45px; }
.stage-placeholder p { margin: 8px 0 0; color: #798092; font-size: 11px; line-height: 1.6; }
.stage-grid { position: absolute; left: 8%; right: 8%; bottom: 13%; height: 48px; background: repeating-linear-gradient(90deg, transparent 0 33px, rgba(99,108,127,.15) 34px 35px), repeating-linear-gradient(0deg, transparent 0 17px, rgba(99,108,127,.12) 18px 19px); transform: perspective(170px) rotateX(63deg); opacity: .72; }
.stage-caption { position: absolute; z-index: 2; left: 17px; bottom: 15px; display: flex; align-items: center; gap: 8px; color: #737b89; font-size: 9px; font-weight: 700; }
.stage-caption .caption-chip { padding: 5px 8px; border-radius: 6px; background: white; color: var(--coral-dark); font-size: 8px; letter-spacing: .7px; font-weight: 900; }
.stage-corner { position: absolute; z-index: 2; top: 17px; right: 17px; display: flex; gap: 6px; }
.icon-button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid rgba(96,101,114,.16); border-radius: 9px; background: rgba(255,255,255,.78); color: #687185; font-size: 13px; cursor: pointer; }
.icon-button:hover { border-color: var(--blue); color: var(--blue); }
.stage-bottom { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 48px; }
.stage-description { display: flex; align-items: center; gap: 10px; min-width: 0; }
.stage-description .info-icon { display: grid; flex: 0 0 auto; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--blue-soft); color: var(--blue); font-size: 12px; font-weight: 800; }
.stage-description p { margin: 0; color: #737a89; font-size: 10px; line-height: 1.4; }
.stage-description p b { display: block; color: var(--ink); font-size: 10px; }
.approve-button { flex: 0 0 auto; border: 0; border-radius: 10px; background: var(--ink); color: white; padding: 12px 14px; font-size: 10px; font-weight: 800; cursor: pointer; transition: .2s; }
.approve-button:hover { background: var(--blue); transform: translateY(-1px); }
.approve-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.model-ready { display: flex; align-items: center; gap: 8px; }
.download-button { display: inline-flex; align-items: center; gap: 8px; padding: 11px 15px; border: 0; border-radius: 10px; background: var(--blue); color: white; font-size: 10px; font-weight: 800; cursor: pointer; }
.download-button:hover { background: #3f50cc; }
.secondary-button { min-height: 39px; padding: 0 13px; border: 1px solid #dedbd5; border-radius: 10px; background: rgba(255,255,255,.7); font-size: 10px; font-weight: 800; }
.secondary-button:hover { background: white; border-color: #c9cbd4; }
.model-stage { position: absolute; inset: 0; width: 100%; height: 100%; cursor: grab; touch-action: none; }
.model-stage:active { cursor: grabbing; }
.progress-wrap { width: 100%; margin: 5px 0 0; }
.progress-label { display: flex; justify-content: space-between; margin-bottom: 7px; color: #747b89; font-size: 9px; font-weight: 700; }
.progress-track { width: 100%; height: 4px; border-radius: 9px; background: #e2dfd8; overflow: hidden; }
.progress-fill { width: 0%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--coral),#f0b64f); transition: width .35s ease; }
.inline-error { margin: 12px 0 0; padding: 11px 12px; border: 1px solid #f0c0b6; border-radius: 10px; background: #fff4f1; color: #a33f34; font-size: 10px; line-height: 1.5; }
.stage-panel.is-working .stage-preview-image { animation: floaty 2.7s ease-in-out infinite; }
@keyframes floaty { 50% { transform: translateY(-7px); } }

.trust-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 19px; }
.trust-item { display: flex; align-items: center; gap: 11px; padding: 14px; border: 1px solid #e5e0d8; border-radius: 15px; background: rgba(255,255,255,.5); }
.trust-icon { display: grid; flex: 0 0 auto; place-items: center; width: 31px; height: 31px; border-radius: 10px; background: white; color: var(--blue); font-size: 13px; font-weight: 900; }
.trust-item strong, .trust-item span { display: block; }
.trust-item strong { font-size: 10px; }
.trust-item span { margin-top: 3px; color: #828897; font-size: 9px; }
.section-block { margin-top: 59px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 19px; }
.section-heading h2 { margin: 8px 0 0; font-family: Aptos Display,sans-serif; font-size: clamp(23px,3vw,33px); line-height: 1.1; letter-spacing: -1.2px; }
.section-heading p { max-width: 390px; margin: 0; color: #778091; font-size: 11px; line-height: 1.55; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature-card { position: relative; min-height: 151px; padding: 19px 21px; overflow: hidden; border: 1px solid #e3ded5; border-radius: 17px; background: rgba(255,255,255,.62); }
.feature-card .feature-index { color: #a4a8b2; font-size: 9px; letter-spacing: 1px; font-weight: 900; }
.feature-card h3 { margin: 15px 0 6px; font-family: Aptos Display,sans-serif; font-size: 15px; letter-spacing: -.45px; }
.feature-card p { max-width: 290px; margin: 0; color: #788091; font-size: 10px; line-height: 1.55; }
.feature-shape { position: absolute; right: -13px; bottom: -19px; width: 84px; height: 84px; border-radius: 30px; transform: rotate(-23deg); opacity: .75; }
.feature-card:nth-child(1) .feature-shape { background: #fff0e9; }
.feature-card:nth-child(2) .feature-shape { background: #e8ebff; }
.feature-card:nth-child(3) .feature-shape { background: #e3eee2; }
.feature-shape::after { position: absolute; inset: 20px; content: ''; border: 1px solid rgba(32,43,67,.13); border-radius: inherit; }

.page-header { max-width: 850px; margin: 13px 0 32px; }
.page-header h1 { margin: 15px 0 12px; font-family: Aptos Display,sans-serif; font-size: clamp(36px,5vw,62px); line-height: 1; letter-spacing: -3px; }
.page-header p { max-width: 670px; margin: 0; color: #747c8c; font-size: 14px; line-height: 1.7; }
.content-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.content-card { padding: 23px; border: 1px solid #e4dfd6; border-radius: 18px; background: var(--white); box-shadow: 0 12px 34px rgba(43,48,65,.045); }
.content-card h2 { margin: 10px 0 8px; font-family: Aptos Display,sans-serif; font-size: 19px; letter-spacing: -.7px; }
.content-card h3 { margin: 19px 0 7px; font-size: 13px; }
.content-card p, .content-card li { color: #727b8b; font-size: 12px; line-height: 1.65; }
.content-card ul, .content-card ol { padding-left: 19px; }
.large-number { display: inline-grid; place-items: center; width: 33px; height: 33px; border-radius: 11px; background: #fff0e9; color: var(--coral-dark); font-size: 12px; font-weight: 900; }
.article-layout { display: grid; grid-template-columns: minmax(0,1fr) 290px; gap: 20px; align-items: start; }
.article-main { display: grid; gap: 13px; }
.article-aside { position: sticky; top: 100px; padding: 21px; border-radius: 17px; background: var(--ink); color: white; }
.article-aside h2 { margin: 0 0 11px; font: 800 16px Aptos Display,sans-serif; }
.article-aside p, .article-aside li { color: rgba(255,255,255,.69); font-size: 10px; line-height: 1.65; }
.article-aside ol { padding-left: 18px; }
.article-aside .aside-button { display: block; margin-top: 15px; padding: 11px 13px; border-radius: 9px; background: var(--coral); color: white; text-align: center; font-size: 10px; font-weight: 800; }
.faq-list { display: grid; gap: 10px; max-width: 880px; }
.faq-item { border: 1px solid #e3ded6; border-radius: 15px; background: var(--white); }
.faq-item summary { position: relative; padding: 17px 44px 17px 18px; list-style: none; cursor: pointer; font-size: 12px; font-weight: 800; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { position: absolute; right: 18px; top: 15px; content: '+'; color: var(--coral); font-size: 19px; font-weight: 500; }
.faq-item[open] summary::after { content: '−'; }
.faq-item p { max-width: 760px; margin: 0; padding: 0 18px 18px; color: #747c8c; font-size: 11px; line-height: 1.65; }
.project-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.project-card { overflow: hidden; border: 1px solid #e3ded7; border-radius: 17px; background: var(--white); }
.project-thumb { display: grid; place-items: center; min-height: 170px; overflow: hidden; background: linear-gradient(140deg,#e9eaff,#fff1e9); }
.project-thumb img { display: block; width: 100%; max-height: 210px; object-fit: cover; }
.project-card-body { padding: 16px; }
.project-card-body h2 { margin: 0 0 7px; font: 800 15px Aptos Display,sans-serif; letter-spacing: -.4px; }
.project-card-body p { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 0; color: #777f8e; font-size: 10px; line-height: 1.5; }
.project-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 13px; color: #9298a3; font-size: 9px; }
.project-meta .project-action { color: var(--blue); font-weight: 800; }
.empty-state { display: flex; max-width: 610px; flex-direction: column; align-items: flex-start; padding: 27px; border: 1px dashed #c9c8cc; border-radius: 17px; background: rgba(255,255,255,.48); }
.empty-state h2 { margin: 14px 0 5px; font: 800 20px Aptos Display,sans-serif; }
.empty-state p { margin: 0; color: #798091; font-size: 12px; line-height: 1.6; }
.empty-state .header-cta { margin-top: 18px; }
.callout { display: flex; gap: 13px; padding: 17px 19px; border: 1px solid #cfd4ff; border-radius: 14px; background: #f0f1ff; color: #38468e; }
.callout strong { display: block; margin-bottom: 3px; font-size: 11px; }
.callout p { margin: 0; font-size: 10px; line-height: 1.55; }
.callout-icon { font-size: 16px; }
.notice { margin-top: 16px; padding: 16px; border-left: 3px solid var(--coral); border-radius: 0 9px 9px 0; background: #fff1eb; color: #7c5149; font-size: 11px; line-height: 1.6; }
.rich-text { max-width: 850px; }
.rich-text h2 { margin: 28px 0 8px; font: 800 21px Aptos Display,sans-serif; letter-spacing: -.7px; }
.rich-text p, .rich-text li { color: #727b8b; font-size: 12px; line-height: 1.75; }
.rich-text a { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.rich-text .placeholder { padding: 4px 7px; border: 1px dashed #e2a68f; border-radius: 5px; background: #fff3ee; color: #a24d3e; font-weight: 700; }
.contact-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-card { padding: 24px; border: 1px solid #e4dfd7; border-radius: 18px; background: var(--white); }
.contact-card h2 { margin: 9px 0 8px; font: 800 19px Aptos Display,sans-serif; }
.contact-card p { color: #767e8c; font-size: 12px; line-height: 1.7; }
.contact-card .contact-link { display: inline-flex; margin-top: 10px; padding: 10px 13px; border-radius: 9px; background: var(--ink); color: white; font-size: 10px; font-weight: 800; }

.site-footer { background: #202b43; color: white; }
.footer-main { display: grid; grid-template-columns: 1.5fr .7fr .7fr .8fr; gap: 40px; max-width: 1480px; padding: 43px 48px 38px; margin: auto; }
.brand-footer .brand-copy strong { color: white; }
.brand-footer .brand-copy small { color: #9da7bb; }
.footer-brand-block p { margin: 16px 0 15px; color: #adb4c2; font-size: 11px; line-height: 1.65; }
.footer-local { display: inline-flex; align-items: center; gap: 8px; color: #ced3dd; font-size: 9px; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }
.footer-column h2 { margin: 4px 0 5px; color: #8993a8; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; }
.footer-column a { color: #e1e4ea; font-size: 10px; }
.footer-column a:hover, .footer-bottom a:hover { color: #ffc0ad; }
.footer-note { position: relative; display: flex; align-items: center; min-height: 90px; padding: 18px; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; background: rgba(255,255,255,.045); }
.footer-note p { position: relative; z-index: 1; margin: 0; color: #b9c0ce; font-size: 11px; line-height: 1.65; }
.footer-note b { color: white; }
.footer-orbit { position: absolute; right: 9px; bottom: -24px; color: rgba(255,112,79,.42); font-size: 100px; transform: rotate(17deg); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1480px; padding: 16px 48px; margin: auto; border-top: 1px solid rgba(255,255,255,.13); color: #939db1; font-size: 9px; }
.footer-bottom div { display: flex; gap: 19px; }
.footer-bottom a { color: #c7ccda; }
.footer-status { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.footer-status .status-led { width: 6px; height: 6px; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 40; max-width: min(400px,calc(100vw - 40px)); padding: 13px 16px; border: 1px solid #d8d5cd; border-radius: 12px; background: white; box-shadow: 0 16px 45px rgba(32,43,67,.15); color: var(--ink); font-size: 11px; line-height: 1.5; }
.toast.is-error { border-color: #efb3a8; color: #9d4035; }
.toast[hidden] { display: none; }

@media (max-width: 1100px) {
  .header-inner { gap: 25px; padding: 0 27px; }
  .main-nav { gap: 17px; }
  .main-nav a { font-size: 11px; }
  .mode-pill { display: none; }
  .page-wrap { padding: 37px 27px 69px; }
  .studio-grid { grid-template-columns: minmax(310px,.9fr) minmax(350px,1.1fr); }
  .footer-main, .footer-bottom { padding-left: 27px; padding-right: 27px; }
}
@media (max-width: 780px) {
  .header-inner { height: 67px; padding: 0 18px; }
  .main-nav, .header-cta { display: none; }
  .header-actions { margin-left: auto; }
  .mode-pill { display: inline-flex; padding: 7px 9px; font-size: 8px; }
  .mobile-menu { display: flex; width: 38px; height: 38px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 1px solid #dfdbd2; border-radius: 12px; background: transparent; cursor: pointer; }
  .mobile-menu span { width: 15px; height: 2px; border-radius: 2px; background: var(--ink); }
  .mobile-nav { display: flex; flex-direction: column; gap: 0; padding: 7px 18px 15px; border-top: 1px solid rgba(32,43,67,.1); background: var(--paper); }
  .mobile-nav[hidden] { display: none; }
  .mobile-nav a { padding: 12px 3px; border-bottom: 1px solid #e6e1d9; font-size: 12px; font-weight: 700; }
  .page-wrap { padding: 31px 18px 57px; }
  .hero-intro { display: block; margin-bottom: 22px; }
  .hero-intro h1 { max-width: 650px; font-size: clamp(38px,10vw,58px); letter-spacing: -2.6px; }
  .hero-intro p { max-width: 540px; font-size: 12px; }
  .hero-badge { display: none; }
  .studio-grid { grid-template-columns: 1fr; gap: 13px; }
  .composer-panel { padding: 20px 18px; }
  .stage-panel { min-height: 500px; padding: 17px 15px 13px; }
  .stage-canvas { min-height: 390px; }
  .stage-preview-image { max-height: 335px; }
  .trust-row { gap: 8px; }
  .trust-item { align-items: flex-start; padding: 11px 9px; gap: 7px; }
  .trust-icon { width: 25px; height: 25px; font-size: 11px; }
  .trust-item strong { font-size: 9px; }
  .trust-item span { font-size: 8px; line-height: 1.4; }
  .feature-grid { grid-template-columns: 1fr; gap: 9px; }
  .feature-card { min-height: 130px; }
  .section-heading { display: block; }
  .section-heading p { margin-top: 8px; }
  .content-grid, .contact-panel { grid-template-columns: 1fr; }
  .article-layout { grid-template-columns: 1fr; }
  .article-aside { position: static; }
  .project-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .footer-main { grid-template-columns: repeat(2,1fr); gap: 29px 19px; padding: 32px 18px; }
  .footer-brand-block { grid-column: 1/-1; }
  .footer-note { min-height: 100px; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 13px; padding: 16px 18px 19px; }
  .footer-bottom div { gap: 15px; flex-wrap: wrap; }
}
@media (max-width: 420px) {
  .brand-copy strong { font-size: 17px; }
  .mode-pill { max-width: 142px; overflow: hidden; font-size: 7px; letter-spacing: .45px; }
  .control-row { grid-template-columns: 1fr; }
  .flow-mini-steps { flex-direction: column; }
  .flow-step { flex: initial; }
  .stage-panel { min-height: 450px; }
  .stage-canvas { min-height: 335px; }
  .stage-bottom { align-items: flex-start; flex-direction: column; padding-top: 8px; }
  .approve-button, .model-ready { width: 100%; }
  .model-ready .download-button { flex: 1; justify-content: center; }
  .project-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr 1fr; }
}

.header-member { display: inline-flex; align-items: center; justify-content: center; min-height: 37px; padding: 0 12px; border: 1px solid #e1ddd4; border-radius: 999px; color: var(--ink); font-size: 10px; font-weight: 800; white-space: nowrap; }
.header-member:hover { border-color: var(--coral); color: var(--coral-dark); }
.builder-layout { display: grid; grid-template-columns: minmax(390px,.9fr) minmax(420px,1.1fr); gap: 18px; align-items: start; }
.builder-controls { display: flex; flex-direction: column; gap: 15px; overflow: visible; padding: 23px; }
.builder-controls .panel-topline { margin-bottom: 3px; }
.builder-name > span { display: block; margin-bottom: 7px; color: #707889; font-size: 9px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.builder-name input, .auth-card input, .editor-grid input, .editor-grid textarea { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid #e1ded7; border-radius: 10px; outline: none; background: #fbfaf7; color: var(--ink); font: inherit; font-size: 12px; }
.builder-name input:focus, .auth-card input:focus, .editor-grid input:focus, .editor-grid textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(82,101,232,.09); }
.template-picker { margin: 0; }
.template-picker label { display: block; margin-bottom: 7px; color: #707889; font-size: 9px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.template-picker select, .builder-selects select { width: 100%; height: 42px; padding: 0 11px; border: 1px solid #e1ded7; border-radius: 10px; background: #fbfaf7; color: var(--ink); font-size: 11px; font-weight: 700; }
.parts-editor-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 3px; }
.parts-editor-heading b, .parts-editor-heading small { display: block; }
.parts-editor-heading b { font-size: 13px; }
.parts-editor-heading small { margin-top: 3px; color: #878d9a; font-size: 9px; }
.parts-editor-heading > span { color: #777f8e; font-size: 9px; font-weight: 800; }
.parts-editor { display: grid; gap: 9px; max-height: 610px; overflow-y: auto; padding-right: 3px; }
.part-editor-card { padding: 13px; border: 1px solid #e8e4dc; border-radius: 13px; background: #fbfaf7; }
.part-editor-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.part-editor-head b { font-size: 10px; letter-spacing: .5px; text-transform: uppercase; }
.part-editor-head button { padding: 5px 8px; font-size: 9px; }
.part-editor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.part-editor-grid label { display: block; color: #767e8c; font-size: 9px; font-weight: 700; }
.part-editor-grid select, .part-editor-grid input { width: 100%; height: 34px; margin-top: 5px; padding: 0 8px; border: 1px solid #e5e1da; border-radius: 8px; outline: none; background: white; color: var(--ink); font-size: 10px; }
.part-editor-grid select:focus, .part-editor-grid input:focus { border-color: var(--blue); }
.part-values { grid-template-columns: repeat(3,1fr); }
.add-part-tools { display: flex; flex-wrap: wrap; gap: 7px; }
.add-part-tools .secondary-button { min-height: 34px; padding: 0 10px; font-size: 9px; }
.builder-selects { grid-template-columns: repeat(3,minmax(0,1fr)); }
.builder-selects .control-field label { letter-spacing: .5px; }
.builder-range { display: block; }
.builder-range > span { display: flex; justify-content: space-between; margin-bottom: 7px; color: #707889; font-size: 9px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; }
.builder-range b { color: var(--ink); }
.builder-range input { width: 100%; accent-color: var(--coral); }
.builder-stage-panel { position: sticky; top: 90px; min-height: 630px; }
.builder-stage-panel .stage-canvas { min-height: 525px; }
.builder-preview-hint { display: flex; align-items: center; gap: 8px; padding: 8px 2px 0; color: #828997; font-size: 10px; }
.builder-preview-hint span { color: var(--coral); font-size: 16px; }
.builder-result { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-top: 10px; border-top: 1px solid #eeebe6; }
.builder-result[hidden] { display: none; }
.builder-result .quiet-button { color: var(--blue); font-size: 10px; font-weight: 800; }
.builder-ideas { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-top: 36px; padding: 23px; border: 1px solid #e3ded5; border-radius: 18px; background: rgba(255,255,255,.58); }
.builder-ideas h2 { margin: 10px 0 0; font: 800 22px Aptos Display,sans-serif; letter-spacing: -.7px; }
.builder-feature-list { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; }
.builder-feature-list span { padding: 9px 11px; border: 1px solid #e4e0d8; border-radius: 999px; background: white; color: #657084; font-size: 9px; font-weight: 700; }
.community-toolbar { display: grid; grid-template-columns: minmax(230px,1fr) 190px auto; gap: 9px; max-width: 860px; margin: -7px 0 23px; }
.search-field { display: flex; align-items: center; gap: 8px; min-height: 43px; padding: 0 12px; border: 1px solid #e1ded7; border-radius: 11px; background: white; color: #88909d; }
.search-field span { font-size: 19px; }
.search-field input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 11px; }
.community-toolbar select { min-height: 43px; padding: 0 10px; border: 1px solid #e1ded7; border-radius: 11px; background: white; font-size: 10px; }
.community-toolbar .secondary-button { min-height: 43px; padding: 0 16px; font-size: 10px; font-weight: 800; }
.dragon-glyph { display: grid; place-items: center; width: 72px; height: 72px; border: 1px solid rgba(82,101,232,.16); border-radius: 26px; background: linear-gradient(135deg,#e6e9ff,#fff0e6); color: var(--coral); font-size: 38px; box-shadow: 0 15px 28px rgba(32,43,67,.08); }
.card-kicker { margin-bottom: 7px; color: var(--coral-dark); font-size: 8px; font-weight: 900; letter-spacing: .85px; }
.model-card-author { display: flex; justify-content: space-between; gap: 8px; margin-top: 13px; color: #9298a3; font-size: 9px; }
.model-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; }
.compact-download { min-height: 34px; padding: 0 11px; font-size: 9px; }
.save-model { min-height: 34px; padding: 0 10px; border: 1px solid #e1ded7; border-radius: 9px; background: white; font-size: 9px; font-weight: 800; }
.material-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.material-card { position: relative; min-height: 280px; padding: 20px; overflow: hidden; border: 1px solid #e4dfd7; border-radius: 17px; background: white; box-shadow: 0 12px 34px rgba(43,48,65,.04); }
.material-card::after { position: absolute; top: -27px; right: -20px; width: 100px; height: 100px; content: ''; border: 1px solid rgba(32,43,67,.08); border-radius: 40px; transform: rotate(31deg); }
.material-card-top { display: flex; justify-content: space-between; align-items: center; }
.material-number { color: var(--coral-dark); font-size: 10px; font-weight: 900; letter-spacing: 1px; }
.material-chip { padding: 6px 8px; border-radius: 999px; background: #f2f1ed; color: #7b8290; font-size: 8px; font-weight: 800; letter-spacing: .6px; }
.material-card h2 { margin: 19px 0 2px; font: 800 29px Aptos Display,sans-serif; letter-spacing: -1px; }
.material-card h3 { margin: 0; color: #667086; font-size: 11px; }
.material-card p { min-height: 55px; color: #747c8c; font-size: 11px; line-height: 1.55; }
.material-notes { display: grid; gap: 5px; margin: 14px 0 16px; color: #697486; font-size: 9px; }
.material-card > a { color: var(--blue); font-size: 9px; font-weight: 800; }
.material-petg { background: linear-gradient(145deg,#fff,#fffaf0); }
.material-asa { background: linear-gradient(145deg,#fff,#fff3eb); }
.material-tpu { background: linear-gradient(145deg,#fff,#f3f1ff); }
.material-nylon { background: linear-gradient(145deg,#fff,#eff5f0); }
.material-callout { margin-top: 17px; }
.auth-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; max-width: 870px; }
.auth-card { display: flex; flex-direction: column; align-items: stretch; gap: 13px; padding: 23px; border: 1px solid #e4dfd7; border-radius: 17px; background: white; box-shadow: 0 12px 34px rgba(43,48,65,.045); }
.auth-card h2 { margin: 0 0 4px; font: 800 21px Aptos Display,sans-serif; }
.auth-card > label { display: grid; gap: 6px; color: #6d7585; font-size: 10px; font-weight: 800; }
.auth-card > label small { color: #8b92a0; font-size: 9px; font-weight: 500; }
.auth-card .primary-button, .auth-card .secondary-button { margin-top: 3px; min-height: 43px; }
.auth-card > small { color: #777f8e; font-size: 10px; }
.auth-status { min-height: 16px; margin: 0; color: #607568; font-size: 10px; line-height: 1.5; }
.auth-note { max-width: 850px; margin-top: 14px; }
.account-shortcuts { display: flex; flex-wrap: wrap; gap: 12px; max-width: 950px; }
.account-tile { display: grid; min-width: 210px; gap: 5px; padding: 17px; border: 1px solid #e4dfd7; border-radius: 15px; background: white; }
.account-tile > span { color: var(--coral); font-size: 19px; }
.account-tile b { font-size: 12px; }
.account-tile small { color: #818897; font-size: 9px; }
.account-shortcuts > button { align-self: center; }
.account-heading { align-items: end; }
.account-heading h2 { margin: 8px 0 0; font-size: 22px; }
.admin-login-card { max-width: 440px; margin-top: 25px; }
.admin-stats { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; margin-bottom: 16px; }
.admin-stat { display: grid; gap: 8px; padding: 16px; border: 1px solid #e4dfd7; border-radius: 14px; background: white; }
.admin-stat small { color: #818897; font-size: 9px; font-weight: 800; letter-spacing: .65px; text-transform: uppercase; }
.admin-stat b { font: 800 24px Aptos Display,sans-serif; }
.admin-columns { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(290px,.65fr); gap: 13px; align-items: start; }
.admin-section { padding: 21px; border: 1px solid #e4dfd7; border-radius: 16px; background: white; }
.admin-section h2 { margin: 9px 0 14px; font: 800 19px Aptos Display,sans-serif; }
.admin-section h3 { margin: 23px 0 11px; font-size: 12px; }
.admin-model-list { display: grid; }
.admin-model-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid #efede8; }
.admin-model-copy { display: grid; flex: 1; gap: 4px; min-width: 0; }
.admin-model-copy b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.admin-model-copy span, .admin-toggle { color: #858c99; font-size: 9px; }
.admin-toggle { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.admin-toggle input { accent-color: var(--blue); }
.admin-model-row > a { padding: 7px 9px; border: 1px solid #e3e0d8; border-radius: 8px; color: var(--blue); font-size: 9px; }
.status-list { display: grid; gap: 0; }
.status-list p { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 10px 0; border-bottom: 1px solid #efede8; color: #7c8492; font-size: 9px; }
.status-list b { color: var(--ink); text-align: right; }
.member-list { display: grid; gap: 8px; }
.member-list > div { display: grid; gap: 3px; }
.member-list b { font-size: 9px; }
.member-list span { color: #858c99; font-size: 8px; }
.legal-editor { margin-top: 14px; }
.legal-editor .field-note { max-width: 850px; }
.editor-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; margin-top: 14px; }
.editor-grid label { display: grid; gap: 6px; color: #707889; font-size: 9px; font-weight: 800; }
.editor-grid textarea { min-height: 130px; resize: vertical; font-size: 10px; line-height: 1.55; }
.legal-editor > .primary-button { max-width: 280px; }
.admin-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 13px; color: #838a97; font-size: 10px; }
.editable-legal-copy { white-space: normal; }
.editable-legal-copy p { white-space: pre-wrap; }

@media (max-width: 1000px) {
  .builder-layout { grid-template-columns: minmax(320px,.9fr) minmax(350px,1.1fr); }
  .builder-controls { padding: 18px; }
  .builder-stage-panel { min-height: 555px; }
  .builder-stage-panel .stage-canvas { min-height: 445px; }
  .material-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 780px) {
  .header-member { min-height: 34px; padding: 0 9px; font-size: 9px; }
  .builder-layout, .admin-columns { grid-template-columns: 1fr; }
  .builder-stage-panel { position: relative; top: auto; min-height: 480px; }
  .builder-stage-panel .stage-canvas { min-height: 385px; }
  .builder-ideas { align-items: start; flex-direction: column; }
  .builder-feature-list { justify-content: start; }
  .material-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .auth-layout { grid-template-columns: 1fr; max-width: 550px; }
}
@media (max-width: 520px) {
  .builder-controls { padding: 16px; }
  .builder-selects { grid-template-columns: 1fr; }
  .part-editor-grid { grid-template-columns: 1fr; }
  .part-values { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .community-toolbar { grid-template-columns: 1fr 1fr; }
  .community-toolbar .search-field { grid-column: 1/-1; }
  .community-toolbar .secondary-button { grid-column: 1/-1; }
  .material-grid { grid-template-columns: 1fr; }
  .admin-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-model-row { flex-wrap: wrap; }
  .admin-model-copy { flex-basis: 100%; }
  .admin-toggle { margin-right: auto; }
  .editor-grid { grid-template-columns: 1fr; }
  .model-card-actions { align-items: stretch; }
  .account-heading { align-items: flex-start; flex-direction: column; }
}