.landing{--sandbox-amber:#ffc066;--sandbox-mint:#98d1c1;--sandbox-ink:#233942}.landing .l-card{display:flex;flex-direction:column;gap:1.5rem;padding:1.75rem;border:2px solid hsl(var(--foreground));border-radius:.75rem;background:hsl(var(--card));box-shadow:6px 6px hsl(var(--foreground));transition:transform .2s,box-shadow .2s;text-decoration:none;color:inherit}.landing .l-card:hover,.landing .l-card:focus-visible{transform:translate(-2px,-2px) rotate(-.4deg);box-shadow:8px 8px hsl(var(--foreground))}.landing .l-card:active{transform:translate(4px,4px);box-shadow:2px 2px hsl(var(--foreground))}.landing .l-go{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;padding:.6rem 1.1rem;border:2px solid var(--sandbox-ink);border-radius:.5rem;font-weight:700;background:var(--sandbox-amber);color:var(--sandbox-ink)}.landing .l-card.alt .l-go{background:var(--sandbox-mint)}@media(prefers-reduced-motion:reduce){.landing .l-card{transition:none}}.demo-selector{max-width:784px;margin:0 auto 26px}.intro:has(+.demo-selector) h1{font-size:clamp(37px,5.5vw,67px)}.intro:has(+.demo-selector) p{max-width:720px;margin-left:auto;margin-right:auto;line-height:1.5}.page[data-scenario] .reels,.page[data-scenario] .reel-labels{grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1.5fr)}.page[data-scenario] .reel{height:190px}.page[data-scenario] .reel-text{font-size:clamp(14px,2vw,23px)}.demo-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.demo-option{min-height:52px;padding:8px 12px;border:1.8px solid var(--ink);border-radius:5px;background:var(--paper-light);box-shadow:3px 3px 0 var(--ink);color:var(--ink);font:700 11px/1.3 var(--app-font-mono);text-transform:uppercase;letter-spacing:.03em;transition:transform .16s,box-shadow .16s,background .16s}.demo-option:hover{background:var(--sky);transform:translateY(2px);box-shadow:3px 1px 0 var(--ink)}.demo-option.is-selected{background:var(--lemon);transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.demo-option-note{display:block;margin-top:5px;font-size:9px;font-weight:400;letter-spacing:.02em}.demo-active{margin-top:18px;padding:16px 20px;background:var(--paper-light);border:2px solid var(--ink);border-radius:3px;box-shadow:4px 4px 0 var(--ink);text-align:left}.demo-badge{display:inline-block;margin-bottom:8px;padding:4px 9px;border:1.5px solid var(--ink);background:var(--rose);font:700 9px var(--app-font-mono);letter-spacing:.1em;text-transform:uppercase;transform:rotate(-1.5deg)}.demo-title{margin:0;font:700 clamp(20px,3vw,26px)/1.15 var(--app-font-serif);letter-spacing:-.04em}.demo-desc{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--ink-soft)}.demo-note{margin:8px 0 0;font:11px var(--app-font-mono);color:var(--cabinet-dark)}.demo-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}.demo-example{min-height:44px;padding:8px 16px;border:1.8px solid var(--ink);border-radius:100px;background:var(--mint);box-shadow:0 3px 0 var(--ink);color:var(--ink);font:700 11px var(--app-font-mono);text-transform:uppercase;letter-spacing:.06em;flex:none}.demo-example:not(:disabled):hover{background:var(--lemon)}.demo-example:disabled{opacity:.48}.demo-disclaimer{margin:0;font:10px/1.45 var(--app-font-mono);color:var(--ink-soft);text-align:right;flex:1}.demo-foot:has(.demo-example:only-child){justify-content:flex-end}@media(max-width:700px){.page[data-scenario] .reel{height:230px;padding:18px 5px}.page[data-scenario] .reel-text{font-size:14px}.demo-options{grid-template-columns:1fr}.demo-foot{flex-direction:column;align-items:stretch}.demo-example{width:100%}.demo-disclaimer{text-align:center}}