:root{color-scheme:light;--plum:#72516c;--ink:#332d38;--muted:#827783;--line:#e7e0e7}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
main{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 24px 90px}
.logo{width:180px;height:180px;object-fit:contain}
h1{font:normal 48px/1.15 Georgia,serif;letter-spacing:-1.7px;margin:18px 0 38px}
h1 span{font-size:.6em;letter-spacing:-.5px}
button,input{font:inherit}
button{cursor:pointer;touch-action:manipulation}
.primary{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:46px;padding:10px 22px;border:1px solid var(--plum);border-radius:9px;background:var(--plum);color:white;font-size:14px;transition:background .18s,transform .18s}
.primary:hover{background:#5e4059}.primary:active{transform:translateY(1px)}.primary:disabled{opacity:.55;cursor:wait}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--plum);outline-offset:4px}
dialog{position:relative;width:calc(100% - 32px);max-width:420px;max-height:calc(100svh - 32px);padding:32px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);box-shadow:0 24px 80px #39223616}
dialog[open]{animation:appear .2s ease-out}dialog::backdrop{background:#33223730;backdrop-filter:blur(5px)}
h2{font:normal 29px/1.3 Georgia,serif;letter-spacing:-.5px;margin:0 0 28px}
.close{position:absolute;top:12px;right:12px;width:40px;height:40px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:25px;line-height:1}
.close:hover{background:#f6f3f6}label{display:block;font-size:13px;margin:17px 0 6px}
input{display:block;width:100%;height:46px;padding:10px 12px;border:1px solid #dcd2dc;border-radius:7px;background:#fff;color:var(--ink);font-size:16px}
.privacy{font-size:12px;line-height:1.6;color:var(--muted);margin:19px 0 23px}a{color:var(--plum);text-underline-offset:3px}
form>.primary,#success>.primary{width:100%}.trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#form-error{font-size:13px;color:#82564d;margin:0 0 16px}#success p{margin:0 0 26px}#success:focus{outline:none}
[hidden]{display:none!important}
.policy{display:block;max-width:650px;min-height:auto;margin:70px auto;padding:0 24px}.policy h1{font-size:36px;margin-bottom:24px}.policy h2{font:600 16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;margin:25px 0 6px}.policy p{margin:0 0 16px}
@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:480px){main{padding-bottom:70px}.logo{width:150px;height:150px}h1{font-size:43px;margin-top:16px}dialog{padding:28px 24px}.policy{margin-top:35px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.showcase{max-width:1000px;min-height:100svh;margin:auto;padding:18px 24px 35px;justify-content:center}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.demo-stage{position:relative;width:100%;aspect-ratio:16/9;max-height:calc(100svh - 155px)}
#demo{display:block;width:100%;height:100%;object-fit:contain;border-radius:16px}
#demo-end{animation:appear .45s ease-out;position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:white;text-align:center}
#demo-end .logo{width:clamp(100px,20vw,180px);height:clamp(100px,20vw,180px)}
.wordmark{font:normal 48px/1.15 Georgia,serif;letter-spacing:-1.7px;margin:18px 0 8px}.wordmark span{font-size:.6em}.wordmark+p{max-width:320px;margin:0 15px;color:var(--muted);font-size:14px}
.showcase>.primary{flex-shrink:0;margin-top:22px;animation:appear .45s ease-out}
@media(max-width:600px){.showcase{padding:16px 10px 35px}.demo-stage{max-height:none}.wordmark{font-size:36px;margin-top:8px}#demo-end .logo{width:100px;height:100px}.wordmark+p{font-size:12px}}