:root{--flap-bg:#2a2a2a;--flap-color:#e8e8e8;--flap-gap:3px;--flip-duration:.4s;--char-w:42px;--char-h:56px;--char-font:1.6rem}*{box-sizing:border-box;margin:0;padding:0}body{color:#fff;cursor:default;background:#111;font-family:Roboto Mono,Courier New,monospace;overflow:hidden}body.hide-cursor{cursor:none}.board-frame{justify-content:center;align-items:center;min-height:100vh;display:flex}.board-outer{background:#1a1a1a;border-radius:16px;padding:24px;box-shadow:0 12px 48px #000c}.board{gap:var(--flap-gap);flex-direction:column;display:flex}.board-row{gap:var(--flap-gap);display:flex}.flap-char{width:var(--char-w);height:var(--char-h);perspective:300px;background:#1a1a1a;border-radius:5px;position:relative}.flap-half{background:var(--flap-bg);height:50%;font-size:var(--char-font);color:var(--flap-color);backface-visibility:hidden;justify-content:center;align-items:center;font-family:Roboto Mono,Courier New,monospace;font-weight:600;display:flex;position:absolute;left:0;right:0;overflow:hidden}.flap-top{background:linear-gradient(#333 0%,#2a2a2a 100%);border-radius:5px 5px 0 0;align-items:flex-end;line-height:0;top:0}.flap-top span{transform:translateY(50%)}.flap-bottom{background:linear-gradient(#2a2a2a 0%,#222 100%);border-radius:0 0 5px 5px;align-items:flex-start;line-height:0;bottom:0}.flap-bottom span{transform:translateY(-50%)}.flap-char:after{content:"";z-index:10;background:#111;height:2px;position:absolute;top:50%;left:0;right:0;transform:translateY(-1px)}.flap-flip-out{height:50%;font-size:var(--char-font);color:var(--flap-color);transform-origin:bottom;animation:flipOut var(--flip-duration) ease-in forwards;z-index:20;background:linear-gradient(#333 0%,#2a2a2a 100%);border-radius:5px 5px 0 0;justify-content:center;align-items:flex-end;font-family:Roboto Mono,Courier New,monospace;font-weight:600;line-height:0;display:flex;position:absolute;top:0;left:0;right:0;overflow:hidden}.flap-flip-out span{transform:translateY(50%)}.flap-flip-in{height:50%;font-size:var(--char-font);color:var(--flap-color);transform-origin:top;animation:flipIn var(--flip-duration) ease-out forwards;animation-delay:calc(var(--flip-duration) * .5);z-index:20;background:linear-gradient(#2a2a2a 0%,#222 100%);border-radius:0 0 5px 5px;justify-content:center;align-items:flex-start;font-family:Roboto Mono,Courier New,monospace;font-weight:600;line-height:0;display:flex;position:absolute;bottom:0;left:0;right:0;overflow:hidden;transform:rotateX(90deg)}.flap-flip-in span{transform:translateY(-50%)}@keyframes flipOut{0%{transform:rotateX(0)}to{transform:rotateX(-90deg)}}@keyframes flipIn{0%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.controls{z-index:50;opacity:.15;gap:.5rem;transition:opacity .3s;display:flex;position:fixed;bottom:1rem;right:1rem}.controls:hover{opacity:1}.controls button{color:#fff;cursor:pointer;background:#333;border:1px solid #555;border-radius:8px;padding:.5rem 1rem;font-size:1rem}.config-overlay{z-index:100;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.config-panel{color:#fff;background:#1a1a1a;border:2px solid #333;border-radius:12px;width:90%;max-width:480px;padding:2rem}.config-panel h2{color:#fc0;margin-bottom:1.5rem;font-size:1.25rem}.config-panel label{color:#aaa;margin-bottom:1rem;font-size:.85rem;display:block}.config-panel input[type=text],.config-panel input[type=number],.config-panel select{color:#fff;background:#000;border:1px solid #444;border-radius:6px;width:100%;margin-top:.25rem;padding:.5rem;font-family:inherit;display:block}.config-panel button{color:#000;cursor:pointer;background:#fc0;border:none;border-radius:6px;margin-top:1rem;padding:.6rem 1.5rem;font-weight:700}@media (max-width:900px){:root{--char-w:28px;--char-h:38px;--char-font:1rem;--flap-gap:2px}.board-outer{padding:12px}}@media (min-width:1400px){:root{--char-w:56px;--char-h:76px;--char-font:2.2rem}.board-outer{padding:32px}}