.hologram-header{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,80px)}.hologram-header h1{font-size:clamp(54px,7.3vw,112px);line-height:.96}.hologram-demo{margin:0;min-width:0}.hologram-demo .cb-visual{width:min(100%,480px);margin:0 auto}.hologram-demo figcaption{font-size:15px;line-height:1.6;color:var(--muted);max-width:36ch;margin:18px auto 0}.hologram-demo .cb-motion{margin-left:0}@media(max-width:760px){.hologram-header{grid-template-columns:1fr}.hologram-demo .cb-visual{max-width:360px}.hologram-header h1{font-size:clamp(52px,12vw,84px)}}
.portrait-stage{background:#f7f8f5;padding:16px 20px;transition:background-color .2s}.portrait-stage[data-theme=dark]{background:#111911}.portrait-stage[data-theme=dark] .cb-motion{color:#d2d9ce}@media(prefers-color-scheme:dark){.portrait-stage:not([data-theme=white]){background:#111911}.portrait-stage:not([data-theme=white]) .cb-motion{color:#d2d9ce}}.hologram-demo figcaption{max-width:none;min-height:3.2em}.portrait-controls{padding-top:30px;padding-bottom:45px;border-top:1px solid var(--line)}.controls-heading{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:32px}.controls-heading h2{font-size:32px}.controls-heading p{max-width:54ch}.portrait-options{display:grid;grid-template-columns:.65fr 1.8fr 1fr;gap:35px}.portrait-options fieldset{border:0;padding:0;min-width:0}.portrait-options legend{font-size:15px;font-weight:600;margin-bottom:16px}.choice-row{display:flex;flex-wrap:wrap;gap:8px}.choice-row button,.demo-actions button{background:transparent;color:var(--ink);border:1px solid var(--line);font:inherit;font-size:15px;padding:9px 13px;cursor:pointer}.choice-row button[aria-pressed=true]{background:var(--ink);color:var(--page,#f7f8f5);border-color:var(--ink)}.portrait-options label{display:flex;justify-content:space-between;font-size:14px}.portrait-options input{display:block;width:100%;accent-color:#c73879;min-height:30px;margin-bottom:16px}.demo-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.demo-actions p{flex-basis:100%;font-size:14px;color:var(--muted);margin-top:6px}.portrait-controls button:focus-visible{outline:2px solid #c73879;outline-offset:3px}@media(max-width:760px){.controls-heading,.portrait-options{grid-template-columns:1fr}.portrait-options{gap:24px}.portrait-stage{padding:10px}.hologram-demo .cb-visual{max-width:400px}}@media(prefers-reduced-motion:reduce){.portrait-stage{transition:none}}

.hologram-header{display:block}.hologram-header h1{font-size:clamp(48px,5.8vw,84px)}.hologram-header h1 br{display:none}.hologram-header .project-summary{max-width:62ch}.portrait-workbench{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:5vw;padding-bottom:45px}.portrait-workbench .hologram-demo{position:sticky;top:24px}.portrait-workbench .portrait-controls{padding:20px 0 0;min-width:0}.portrait-workbench .controls-heading{display:block;margin-bottom:24px}.portrait-workbench .controls-heading h2{font-size:29px;margin-bottom:16px}.portrait-workbench .portrait-options{grid-template-columns:1fr;gap:20px}.portrait-workbench .cb-visual{max-width:460px}.portrait-workbench .demo-actions{margin-top:15px}.portrait-workbench .demo-actions button{font-size:14px}.portrait-workbench input{margin-bottom:10px}@media(max-width:760px){.portrait-workbench{grid-template-columns:1fr;gap:22px}.portrait-workbench .hologram-demo{position:static}.hologram-header h1 br{display:block}.portrait-workbench .cb-visual{max-width:330px}}
