:root{--background:#f3ede3;--ink:#111;--lime:#c4ff00;--teal:#30c7be}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--background);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,sans-serif}.room-key-page{place-items:center;min-height:100svh;padding:24px;display:grid}.brand{justify-items:center;gap:24px;display:grid}.key-mark{width:120px;height:96px;position:relative;transform:rotate(-12deg)}.key-head{border:10px solid var(--ink);background:var(--lime);width:64px;height:64px;box-shadow:6px 6px 0 var(--teal);border-radius:14px;position:absolute;top:8px;left:4px}.key-stem{background:var(--ink);width:56px;height:16px;position:absolute;top:36px;left:61px}.key-tooth{background:var(--ink);width:16px;position:absolute}.key-tooth-one{height:26px;top:47px;left:88px}.key-tooth-two{height:19px;top:47px;left:104px}.wordmark{letter-spacing:-.08em;font:900 clamp(44px,12vw,64px)/1 ui-monospace,SFMono-Regular,monospace}@media (prefers-reduced-motion:no-preference){.brand{animation:.6s cubic-bezier(.2,.8,.2,1) both settle}@keyframes settle{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}