@font-face{font-family:Inter;src:url('./assets/inter.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--background:#101010;--text:#f2f2f2;--muted:#828282;--accent:#f53c70;--border:#272727;--scale:1;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--background)}body{height:100svh;overflow:hidden;font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;color:var(--text)}.scene{position:absolute;left:50%;top:50%;width:1080px;height:630px;transform:translate(-50%,-50%) scale(var(--scale));transform-origin:center}.drawing{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}.message{position:absolute;left:586px;top:222px;width:355px}.eyebrow{margin:0 0 12px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:6.8px;font-weight:400;line-height:10px;letter-spacing:2px;color:#636363}h1{margin:0;font-size:24px;font-weight:500;line-height:32px;letter-spacing:-.45px;white-space:nowrap}.description{margin:11px 0 22px;color:var(--muted);font-size:11px;line-height:21px;font-weight:400;letter-spacing:-.05px}.actions{display:flex;gap:9px}.actions a{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:29px;padding:0 14px;border:1px solid var(--border);border-radius:6px;background:#171717;color:#eee;text-decoration:none;font-size:9.5px;line-height:1;box-shadow:0 1px 3px #0003;transition:background .16s var(--ease),transform .16s var(--ease),border-color .16s var(--ease)}.actions svg{width:13px;height:13px}.actions .home{background:linear-gradient(180deg,#fa477a,#ec3265);border-color:#fa5c89;color:#fff;padding-inline:14px}.actions .home:hover{background:linear-gradient(180deg,#ff5786,#f43d71);border-color:#ff7ba0}.actions .editor:hover{background:#202020;border-color:#373737}.actions a:active{transform:translateY(1px) scale(.98)}a:focus-visible{outline:2px solid #f688a8;outline-offset:4px}.secondary{display:flex;gap:17px;margin-top:17px}.secondary a{color:#606060;text-decoration:none;font-size:8px;line-height:12px;transition:color .16s}.secondary a:hover{color:#aaa}.secondary a:active{color:#ddd}
@media(max-width:600px) and (orientation:portrait){.scene{width:390px;height:680px}.message{left:33px;top:414px;width:324px}h1{font-size:25px}.eyebrow{font-size:7.5px}.description{font-size:11px}.actions a{font-size:10px;height:34px}.secondary a{font-size:9px}.secondary{margin-top:20px}}
@media(prefers-reduced-motion:reduce){a{transition:none}}