:root{--felt: #1b2440;--felt-2: #131a30;--paper: #f6efdd;--ink: #2b2a26;--brass: #cfae5a;--brass-2: #eed9a0;--muted: rgba(246, 239, 221, .6);--mark-ink: var(--brass-2);--serif: "Cormorant Garamond", Georgia, serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:radial-gradient(100% 70% at 50% 0%,rgba(255,255,255,.05),transparent 60%),linear-gradient(180deg,var(--felt),var(--felt-2));background-attachment:fixed;color:var(--paper);font:500 17px/1.45 var(--serif);display:flex;flex-direction:column;align-items:center}.hero{padding:82px 20px 0;text-align:center}.hero h1{margin:0;font:600 clamp(40px,7vw,66px)/1 var(--serif);font-variant:small-caps;letter-spacing:.12em;color:var(--brass-2)}.hero .sub{margin:4px 0 0;font-style:italic;color:var(--muted);font-size:16px}.table{width:100%;max-width:1060px;padding:20px 20px 90px;display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:22px;align-items:start}.paper-wrap{position:relative;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 42% 36%,#fffaf0,var(--paper) 55%,#e8dfc6);box-shadow:0 34px 70px -30px #000000e6,inset 0 0 40px #2b2a261f}.paper-wrap canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%}.bench{display:flex;flex-direction:column;gap:14px;padding:18px 16px;border-radius:12px;background:linear-gradient(180deg,#ffffff0d,#00000040);border:1px solid rgba(207,174,90,.4)}.knob{display:grid;grid-template-columns:1fr 44px;align-items:center;gap:2px 8px}.knob span{grid-column:1 / -1;font:500 12px/1 var(--serif);font-variant:small-caps;letter-spacing:.26em;color:var(--muted)}.knob input{width:100%;accent-color:var(--brass)}.knob b{font:600 20px/1 var(--serif);color:var(--brass-2);text-align:right}.inks{display:flex;gap:8px;flex-wrap:wrap}.inks button{width:30px;height:30px;border-radius:50%;border:2px solid transparent;background:var(--c);cursor:pointer;box-shadow:inset 0 2px 4px #00000059}.inks button[aria-pressed=true]{border-color:var(--brass-2);transform:scale(1.12)}.keys{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.key{font:600 14px/1 var(--serif);font-variant:small-caps;letter-spacing:.2em;color:#221a06;background:linear-gradient(180deg,var(--brass-2),var(--brass) 60%,#a8883e);border:0;border-radius:999px;padding:11px 18px 9px;cursor:pointer;box-shadow:0 3px #6e5620}.key:active{transform:translateY(2px);box-shadow:0 1px #6e5620}.key.ghost{background:transparent;color:var(--brass-2);border:1px solid var(--brass);box-shadow:none}.key:disabled{opacity:.5;cursor:default}.poster .hero{padding-top:14px}.poster .hero h1{font-size:46px}.poster .table{grid-template-columns:340px 200px;justify-content:center;padding:12px 20px 0;gap:30px}.poster .bench{transform:scale(.92);transform-origin:top left}@media(max-width:820px){.table{grid-template-columns:1fr}.bench{order:2}.hero{padding-top:72px}}