:root{--desk: #2a2019;--desk-2: #1d1611;--wood: #4a3626;--paper: #f2e8d2;--ink: #2b2a26;--brass: #cfae5a;--brass-2: #eed9a0;--muted: rgba(242, 232, 210, .55);--mark-ink: var(--brass-2);--mono: "Courier Prime", "Courier New", monospace;--caps: Oswald, "Arial Narrow", sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:radial-gradient(90% 60% at 50% 0%,rgba(255,200,120,.08),transparent 60%),repeating-linear-gradient(90deg,rgba(0,0,0,.12) 0 3px,transparent 3px 11px),linear-gradient(180deg,var(--desk),var(--desk-2));background-attachment:fixed;color:var(--paper);font:17px/1.5 var(--mono);display:flex;flex-direction:column;align-items:center}.hero{padding:82px 20px 0;text-align:center}.hero h1{margin:0;font:700 clamp(40px,7vw,64px)/1 var(--mono);color:var(--brass-2)}.hero .sub{margin:6px 0 0;font:500 12px/1 var(--caps);letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}.desk{width:100%;max-width:760px;padding:24px 20px 100px;display:flex;flex-direction:column;gap:18px;align-items:center}.tape-wrap{width:100%}.decoded{min-height:30px;display:flex;align-items:baseline;gap:10px;padding:0 4px 6px}.decoded .lbl{font:500 11px/1 var(--caps);letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}.decoded b{font:700 22px/1.2 var(--mono);color:var(--paper);letter-spacing:.06em;min-height:26px}.decoded .caret{color:var(--brass);animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}.tape{position:relative;height:74px;background:linear-gradient(180deg,#e8dcc0,var(--paper) 30%,#e2d5b6);border-radius:4px;overflow:hidden;box-shadow:inset 0 4px 10px #00000059,0 10px 30px -16px #000000e6}.tape:before,.tape:after{content:"";position:absolute;top:0;bottom:0;width:26px;z-index:2;pointer-events:none}.tape:before{left:0;background:linear-gradient(90deg,rgba(0,0,0,.35),transparent)}.tape:after{right:0;background:linear-gradient(-90deg,rgba(0,0,0,.35),transparent)}.strip{position:absolute;right:26px;top:0;bottom:0;display:flex;align-items:center;gap:7px;color:var(--ink);transition:none;white-space:nowrap}.strip .m{flex:none;background:var(--ink);border-radius:3px;height:8px}.strip .m.dot{width:8px}.strip .m.dash{width:26px}.strip .g{flex:none;width:4px}.strip .g.letter{width:16px}.strip .g.word{width:34px;border-left:1px dashed rgba(43,42,38,.3);height:40px}#form{display:flex;gap:10px;width:100%}#msg{flex:1;font:700 20px/1.2 var(--mono);color:var(--paper);background:#ffffff0d;border:1px solid rgba(207,174,90,.5);border-radius:6px;padding:12px 14px;outline:none}#msg:focus{border-color:var(--brass)}#msg::placeholder{color:#f2e8d24d}.knob-btn{font:500 13px/1 var(--caps);letter-spacing:.22em;text-transform:uppercase;color:#221a06;background:linear-gradient(180deg,var(--brass-2),var(--brass) 60%,#a8883e);border:0;border-radius:6px;padding:12px 20px;cursor:pointer;box-shadow:0 3px #6e5620}.knob-btn:active{transform:translateY(2px);box-shadow:0 1px #6e5620}.knob-btn.ghost{background:transparent;color:var(--brass-2);border:1px solid var(--brass);box-shadow:none}.knob-btn.ghost[aria-pressed=true]{background:#cfae5a40}.key-area{text-align:center;margin-top:6px}.tkey{position:relative;width:220px;height:130px;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.tkey .base{position:absolute;left:10px;right:10px;bottom:0;height:26px;border-radius:10px;background:linear-gradient(180deg,var(--wood),#33251a);box-shadow:0 8px 22px -8px #000000e6,inset 0 1px #ffffff1f}.tkey .arm{position:absolute;left:24px;right:54px;bottom:42px;height:10px;border-radius:5px;background:linear-gradient(180deg,var(--brass-2),var(--brass) 55%,#8a7439);transform-origin:12% 50%;transition:transform .05s ease;box-shadow:0 4px 10px -4px #000c}.tkey .button{position:absolute;right:34px;bottom:40px;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 36% 32%,#fff0c6,var(--brass) 55%,#8a7439);box-shadow:0 6px 14px -4px #000000d9,inset 0 2px #ffffff80;transition:transform .05s ease}.tkey.down .arm{transform:rotate(4deg)}.tkey.down .button{transform:translateY(6px)}.hint{margin:10px 0 0;font-size:13px;color:var(--muted)}.row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}.ctl{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font:500 12px/1 var(--caps);letter-spacing:.2em;text-transform:uppercase}.ctl input{width:120px;accent-color:var(--brass)}.ctl b{font:700 18px/1 var(--mono);color:var(--brass-2)}.lamp{position:fixed;inset:0;background:#fff8e0;opacity:0;pointer-events:none;z-index:40}.lamp.on{opacity:.85}.poster .hero{padding-top:16px}.poster .hero h1{font-size:46px}.poster .desk{padding:12px 40px 0;gap:12px}.poster .tape{height:58px}.poster #form,.poster .row,.poster .hint{display:none}.poster .tkey{transform:scale(.9)}@media(max-width:560px){.hero{padding-top:72px}#form{flex-direction:column}}