:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#0c121a;color:#ecf4ed;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,.button{border:1px solid #35473f;border-radius:9px;background:#202f2a;color:#e9f4e7;padding:11px 15px;font-weight:650;cursor:pointer;text-decoration:none;transition:background .15s}button:hover,.button:hover{background:#354c3a}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #ffd43b;outline-offset:3px}button:disabled{opacity:.4;cursor:not-allowed}button[aria-pressed=true],.primary{background:#ffd43b;border-color:#ffd43b;color:#101114}.secondary{background:transparent}.host-page{max-width:1480px;margin:auto;padding:36px 36px 12px}.page-header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px}.eyebrow{font-size:14px;letter-spacing:2px;font-weight:700;color:#b4cfad}h1{font-size:clamp(32px,4vw,52px);letter-spacing:-2px;margin:0;line-height:1.1}h1 .title-dot{color:#ffd43b}h2{font-size:20px;margin:0 0 18px;font-weight:720}p{line-height:1.65;color:#bbc9c5;margin:12px 0}.page-header p:last-child{margin-bottom:0}.workspace{display:grid;grid-template-columns:minmax(300px,500px) minmax(0,1fr);gap:30px;align-items:start}.preview-panel{position:sticky;top:20px;border:1px solid #293a35;border-radius:16px;overflow:hidden;background:#080f16}.preview-heading{display:flex;justify-content:space-between;gap:8px;padding:15px;font-size:14px;font-weight:700;color:#ffd43b}.dimensions{color:#97aaa2;font-size:14px}.preview-panel iframe{display:block;width:100%;aspect-ratio:9/16;border:0;background:repeating-conic-gradient(#172025 0% 25%,#111a20 0% 50%) 50%/24px 24px}.preview-panel>p{padding:0 15px;margin:10px 0;font-size:14px}.controls{display:grid;gap:18px;min-width:0}.panel{background:#131d25;border:1px solid #2b3b38;border-radius:15px;padding:24px}.mode-row{display:flex;gap:8px;flex-wrap:wrap}.mode-row button{font-size:14px;flex:1;white-space:nowrap}.small{font-size:14px;line-height:1.65;color:#9bb0a8}.subtle{font-size:14px;color:#b5c8ae}.join-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin:18px 0}.join-row label{grid-column:1/-1}.button-grid{display:flex;gap:8px;flex-wrap:wrap}.button-grid button{font-size:14px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;color:#c6d6ca;font-size:14px;font-weight:650;line-height:1.4}input:not([type=checkbox]),select,textarea{display:block;width:100%;min-width:0;background:#0c161d;color:#e6f0e8;border:1px solid #3e5048;border-radius:8px;padding:11px;margin-top:7px}textarea{font-family:ui-monospace,monospace;font-size:14px;resize:vertical}.checks{display:flex;gap:14px;flex-wrap:wrap;margin:21px 0}.checks label{display:flex;gap:8px;align-items:center}.checks input{accent-color:#ffd43b}.notice{padding:13px;border-left:3px solid #ffd43b;background:#1b2a25;font-size:14px}code{font-size:14px;overflow-wrap:anywhere}#copy{margin-top:12px}.rules p{font-size:14px}footer{font-size:14px;text-align:center;color:#7c918a;padding:28px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.source-page,.source-page body{margin:0;width:100%;height:100%;overflow:hidden;background:#090f18}.source-page #game{display:block;width:100%;height:100%;object-fit:contain}.source-page.transparent,.source-page body.transparent{background:transparent!important}@media(max-width:850px){.host-page{padding:20px 16px}.workspace{grid-template-columns:1fr}.preview-panel{position:static;width:min(100%,440px);margin:auto}.page-header{align-items:flex-start;flex-direction:column;gap:18px}.panel{padding:20px}}@media(max-width:430px){.field-grid{gap:12px}.panel{padding:17px}.mode-row button{padding:10px 8px;font-size:14px}.page-header p{font-size:14px}.button-grid button{flex:1;min-width:120px}h1{letter-spacing:-1px}.checks{flex-direction:column}}