/* Card artwork is a separate product surface, not desktop window chrome. */
.program-preview{border:1px solid var(--line);border-radius:12px;background:var(--paper,#fff);box-shadow:0 16px 50px #182c4610}.program-preview .hero-program{padding:24px}.hero-brand-switch{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:18px}.hero-brand-switch button{border:1px solid transparent;border-radius:5px;background:transparent;font:inherit;font-size:12px;padding:7px 10px;color:var(--muted);cursor:pointer}.hero-brand-switch button[aria-pressed=true]{background:#f0edff;border-color:#ded9ff;color:var(--accent)}.hero-brand-switch a{margin-left:auto;font-size:12px;display:inline-flex;align-items:center;gap:4px;color:var(--accent)}
.brand-card{position:relative;isolation:isolate;display:flex;flex-direction:column;aspect-ratio:1.586;max-width:480px;width:100%;padding:clamp(20px,2.6vw,30px);border-radius:16px;background:var(--card-color,#172b47);color:var(--card-ink,#fff);border:1px solid #ffffff24;overflow:hidden;font-family:var(--font);box-shadow:0 12px 30px #172b4714}.brand-card::after{content:"";position:absolute;z-index:-1;width:72%;aspect-ratio:1;right:-28%;bottom:-65%;border:1px solid currentColor;border-radius:50%;opacity:.12}.brand-card-head{display:flex;align-items:center;gap:10px}.brand-card-head strong{font-size:clamp(16px,2vw,21px);font-weight:550;letter-spacing:-.025em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit}.brand-card-mark{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border:1px solid currentColor;border-radius:8px;font-size:12px;letter-spacing:-.025em;font-weight:600;overflow:hidden}.brand-card-mark img{width:100%;height:100%;object-fit:contain;background:#ffffff10}.brand-card-type{margin-left:auto;flex-shrink:0;font-size:9px;letter-spacing:.12em;opacity:.72}.brand-card .brand-card-label{margin:18px 0 0;color:inherit;opacity:.8;font-size:13px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-card-number{margin-top:auto;font:22px var(--mono);letter-spacing:.09em;opacity:.85}.brand-card-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-top:18px;font-size:11px;line-height:1.4}.brand-card-bottom span:last-child{font-size:8px;letter-spacing:.09em;opacity:.7;flex-shrink:0}.card-art-disclosure{font-size:11px!important;line-height:1.65!important;color:var(--muted);margin:12px 0 24px!important;max-width:480px}.design-layout{align-items:start}.design-layout aside>.console-panel{margin-top:20px}.design-layout .field input[type=color]{height:42px;padding:5px}.design-layout input[type=file]{padding:10px;font-size:12px}.design-layout form>h2{font-size:19px;margin-bottom:10px}.design-layout form>p{font-size:13px;line-height:1.7;margin-bottom:22px}.design-layout hr{margin:28px 0}.program-hierarchy{padding-left:20px;line-height:1.8;font-size:13px;margin:0 0 20px}.program-hierarchy li{padding:5px 0}.program-scope-note{padding:16px 20px;border:1px solid var(--line);border-radius:7px;margin-bottom:24px;background:#f8f9fc;font-size:13px}.program-scope-note p{margin:5px 0 10px;line-height:1.65;color:var(--muted)}.program-scope-note a{color:var(--accent);display:inline-flex;gap:5px;align-items:center}.template-scope{display:block;font-size:11px;color:var(--accent);margin-top:8px}.template-scope.exploratory{color:var(--muted)}#home-template-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-details summary{flex-wrap:wrap}.performance-summary-time{font-size:11px;margin-left:auto;font-weight:450;color:var(--muted)}.api-check{border-top:1px solid var(--line);margin-top:22px;padding-top:20px}.api-check h3{font-size:14px}.api-check .btn{margin:6px 0 12px}.api-check-result{padding:16px;background:#f7f8fc;border:1px solid var(--line);border-radius:6px;margin-top:12px}.api-check-result dl>div{display:flex;justify-content:space-between;gap:16px;font-size:12px;padding:8px 0}.api-check-result dt{color:var(--muted)}.api-check-result dd{margin:0;text-align:right}.api-check-result small{display:block;overflow-wrap:anywhere;font-size:10px}.design-boundary p{line-height:1.75;font-size:13px}
@media(max-width:700px){#home-template-gallery{grid-template-columns:1fr}.brand-card{padding:22px}.hero-brand-switch a{margin-left:0}.program-preview .hero-program{padding:18px}.brand-card-head strong{font-size:18px}.brand-card-label{font-size:12px}.api-check-result dl>div{display:block}.api-check-result dd{text-align:left;margin-top:4px}}

.program-preview .hero-verdict{align-items:center;margin:18px 0;border-top:1px solid var(--line);padding-top:18px}.program-preview .hero-verdict strong{font-size:14px}.program-preview .hero-verdict p{margin:5px 0 0;font-size:11px}.program-preview .text-link{font-size:12px}.program-preview .card-art-disclosure{margin-bottom:12px!important}

.private-draft-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}.private-draft-hero h1{font-size:clamp(32px,3.6vw,48px)}.private-draft-hero aside{min-width:0}.private-draft-hero .brand-card{aspect-ratio:1.586}.private-draft-hero .brand-card-label{font-size:12px}@media(max-width:850px){.private-draft-hero{grid-template-columns:1fr;gap:28px}.private-draft-hero aside{max-width:440px}}

/* Card artwork sets the hero width; desktop dashboard offsets do not apply. */
.hero-visual{margin-right:0}.program-preview{max-width:528px;margin-left:auto}.program-preview .brand-card{max-width:none}.brand-card-bottom>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-card-head strong{min-width:0}@media(max-width:900px){.program-preview{margin-left:0}}
