:root{--door-surface:#f0ebe2;--door-hero:#2e2a66;--door-hero-line:#3b3778;--door-ink:#1d1c1a;--door-muted:#67635a;--door-white:#fff;--door-ink-dim:#c9c4ee;--door-periwinkle:#a9a7d9;--door-gold:#d6c390}body{background:var(--door-surface);color:var(--door-ink);grid-template-rows:auto 1fr auto;min-height:100svh;display:grid}.pattern-defs{position:absolute}.top{padding:var(--s5)}.brand{align-items:center;gap:var(--s2);font-family:var(--serif);font-weight:var(--w-bold);font-size:var(--t-lg);letter-spacing:-.01em;color:var(--door-ink);text-decoration:none;display:inline-flex}.brand svg{width:22px;height:22px;color:var(--door-gold)}.mid{padding:var(--s4);place-items:center;display:grid}.card{background:var(--door-hero);width:100%;max-width:402px;color:var(--door-white);border-radius:var(--r3);padding:var(--s6) var(--s5);box-shadow:var(--sh-doc);animation:.5s cubic-bezier(.16,1,.3,1) both door-rise;position:relative;overflow:hidden}@keyframes door-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.card{animation:none}}.lattice,.arc{pointer-events:none;position:absolute}.lattice{inset:0}.arc{top:var(--s4);right:var(--s4);width:116px;height:auto}.card>:not(.lattice,.arc){position:relative}.card .over{margin:0 0 var(--s2);color:var(--door-periwinkle);display:block}.card h1{font-family:var(--serif);font-variation-settings:var(--opsz-display);font-size:var(--t-name);font-weight:var(--w-bold);letter-spacing:-.01em;margin:0 0 var(--s3);line-height:1.1}.card h1 em{font-variation-settings:var(--opsz-display);color:var(--door-gold);font-style:italic}.lede{font-size:var(--t-body);color:var(--door-ink-dim);margin:0 0 var(--s5);line-height:1.6}.card .btn{border:1px solid var(--door-periwinkle);border-radius:var(--r-pill);width:100%;min-height:50px;color:var(--door-white);background:0 0}.card .btn:before{content:"";background:var(--door-gold);border-radius:50%;width:6px;height:6px}.card .btn:hover{border-color:var(--door-gold);color:var(--door-gold);background:0 0}.card .btn:focus-visible{border-radius:var(--r-pill)}.foot-link{text-align:center;margin-top:var(--s4);font-size:var(--t-sm);color:var(--door-ink-dim);text-decoration:none;display:block}.foot-link:hover{color:var(--door-white);text-decoration:underline}.demo{padding:var(--s5) var(--s4);text-align:center;font-size:var(--t-xs);color:var(--door-muted);line-height:1.6}@media (width<=480px){.top{padding:var(--s4)}.card{padding:var(--s5) var(--s4);border-radius:var(--r2)}}@media (width<=420px){.arc{display:none}}