:root{color-scheme:dark;--gold:#deb878;--cream:#f5e0b8;--dark:#160c09;--wood:#37170e;--line:#9b6a38}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#1d0c08 url('/assets/orthello/mahogany.webp') repeat;color:var(--cream);font-family:Georgia,'Times New Roman',serif}body:before{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(circle at 51% 6%,#98683a25,transparent 52%),linear-gradient(180deg,#13080570,#27130d85)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:var(--gold)}.hidden{display:none!important}.inn-top{background:linear-gradient(#3d2013,#1d0b06);border-bottom:2px ridge #a2743d;padding:12px clamp(15px,4vw,50px);display:flex;align-items:center;justify-content:space-between;gap:12px}.inn-top a{text-decoration:none}.brand{font-size:23px;letter-spacing:.14em;color:#f9d49b;font-weight:700}.brand em{color:#efb85d;font-style:normal}.brand small{display:block;font-size:10px;letter-spacing:.18em;color:#b99a6b}.back{font:700 11px Arial,sans-serif;letter-spacing:.08em;color:#e1c39c}.game-head{text-align:center;padding:24px 12px 22px;text-shadow:0 3px 7px #000}.kicker{font:700 11px Arial,sans-serif;letter-spacing:.22em;color:#cba06a;text-transform:uppercase}.game-head h1{margin:8px 0 4px;font-size:clamp(34px,5vw,70px);line-height:1;letter-spacing:.06em;color:#fce1a9;text-shadow:0 2px 0 #87582d,0 5px 0 #2d1207,0 8px 17px #080301}.game-head em{font-style:normal;color:#efb65d}.game-head p{font-style:italic;margin:12px 0 2px;color:#cfb089}main{max-width:1440px;margin:auto;padding:0 18px}h2{color:#ffdeaa;margin:12px 0 13px;font-size:clamp(22px,2.7vw,33px);text-shadow:0 2px 2px #100400}h3{color:var(--cream)}.carved{border:3px ridge #bc8b4e;border-radius:12px;background:linear-gradient(130deg,#3b1b0f,#251109 45%,#4a2515 95%);box-shadow:inset 0 0 0 3px #200b07,0 12px 30px #080300aa;padding:24px}.lobby-grid{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(380px,1.35fr);gap:25px;margin:10px auto 40px;align-items:start}.lobby-form label{display:block;font:700 11px Arial,sans-serif;letter-spacing:.12em;color:#d2b387;margin:13px 0 7px}.lobby-form input,.lobby-form select{width:100%;border:1px solid #956c3c;border-radius:4px;padding:12px;background:#140a07;color:#f6dfb9;min-height:42px;outline-offset:2px}.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.brass-btn{display:block;color:#fce4b0;background:linear-gradient(180deg,#694126,#3c2116 53%,#291208);border:2px ridge #b98a50;box-shadow:inset 0 1px #e7b86960,0 3px 8px #1204019c;border-radius:6px;min-height:43px;padding:9px 12px;text-align:center;text-decoration:none;font:700 12px Arial,sans-serif;letter-spacing:.045em;transition:filter .15s,transform .12s}.brass-btn:hover:not(:disabled){filter:brightness(1.2);transform:translateY(-1px)}.brass-btn:focus-visible{outline:3px solid #fff2bd;outline-offset:2px}.brass-btn.primary{background:linear-gradient(#bd8749,#795020 47%,#4c260f);color:#fff5d7}.lobby-form>.brass-btn,.solo-box>.brass-btn,.waiting .brass-btn{width:100%;margin-top:11px}.divider{text-align:center;color:#d0ae7e;font-size:12px;letter-spacing:.1em;margin:20px 0 14px}.solo-box{margin-top:24px;padding:16px;background:#1e0f0b;border:1px solid #7c542a;border-radius:5px}.solo-box h3{margin:0;color:#ffdc9a}.solo-box p,.small{color:#d6bd97;font-size:14px;line-height:1.55}.lobby-right{display:grid;gap:18px}.picture-frame{padding:8px;border:6px ridge #c3985e;background:#1c0d08;box-shadow:0 14px 40px #0a0303b0;border-radius:12px;overflow:hidden}.picture-frame img{display:block;width:100%;aspect-ratio:1701/925;object-fit:cover}.tables{display:flex;flex-direction:column;gap:7px;padding:8px 0 12px;min-height:43px}.tables button{background:#1d0d08;border:1px solid #8e673c;color:#ffe0ad;border-radius:4px;padding:11px;text-align:left;font-size:14px}.tables button small{float:right;color:#ccae7c}.waiting{padding:19px}.waiting h2{margin-bottom:0}.game-room{background:linear-gradient(#17090371,#1a0b05aa),url('/assets/fourinn/lounge-room.webp') center top/cover;border:4px ridge #996638;border-radius:16px;padding:25px;display:grid;grid-template-columns:minmax(500px,1fr) minmax(245px,315px);gap:25px;box-shadow:0 20px 45px #0b0201bb}.board-side{min-width:0}.scoreboards{display:flex;justify-content:space-between;gap:15px;margin:0 auto 12px;max-width:800px}.scorebox{min-width:0;flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 15px;background:linear-gradient(#2b140c,#120805);border:3px ridge #b18b54;border-radius:9px;box-shadow:inset 0 0 0 2px #4d2b19,0 7px 14px #0008}.scorebox img{width:62px;max-width:26%;filter:drop-shadow(0 3px 2px #050200)}.scorebox div{display:flex;flex-direction:column;text-align:center;gap:5px;min-width:0}.scorebox strong{font-size:clamp(14px,1.9vw,23px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scorebox small{font-size:10px;letter-spacing:.16em;color:#b89b70}.scorebox span{font:700 10px Arial,sans-serif;color:#b4a083}.scorebox.active span{color:#ffe5a8;text-shadow:0 0 12px #49c86f}.scorebox.active{box-shadow:inset 0 0 0 2px #4d2b19,0 0 16px #d1aa5a66}.cabinet{width:min(100%,800px);margin:auto;padding:10px 13px 13px;border:7px ridge #875126;border-radius:15px;background:linear-gradient(90deg,#190b06,#70401f 5%,#3b1b10 23%,#542911 80%,#180804);box-shadow:inset 0 0 0 4px #180a04,0 21px 22px #060200dd}.cabinet-name{text-align:center;background:linear-gradient(180deg,#2a120b,#3d1b10,#160805);border:3px ridge #d3a45f;border-radius:12px 12px 3px 3px;padding:9px;color:#dbad6d;font-size:14px;letter-spacing:.2em;text-shadow:0 2px 4px #000}.cabinet-name strong{display:block;font-size:clamp(22px,3vw,37px);letter-spacing:.09em;color:#ffdb95;text-shadow:0 1px 0 #9b6229,0 5px 6px #080200}.cabinet-name span{font:700 9px Arial,sans-serif;letter-spacing:.2em;color:#d9b47d}.upright-frame{margin:7px 0 0;padding:12px 11px 9px;border:8px ridge #976033;border-radius:8px;background:linear-gradient(120deg,#48200d,#753d1b 40%,#3d190c 90%);box-shadow:inset 0 0 8px #0b0403,0 3px 5px #090200}.column-controls{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin:0 auto 5px;max-width:630px}.column-controls button{background:none;color:#f3cc88;min-width:0;min-height:30px;border:0;font:700 11px Arial,sans-serif;position:relative}.column-controls button:hover:not(:disabled),.column-controls button:focus-visible{background:#d1a76822;outline:2px solid #f2d291;outline-offset:-2px}.column-controls button::after{content:'▼';display:block;font-size:11px;opacity:.8}.rack{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:clamp(2px,.7vw,8px);aspect-ratio:7 / 6;margin:auto;padding:clamp(8px,1vw,15px);background:linear-gradient(80deg,#45200fbb,#210e06aa),url('/assets/fourinn/walnut.webp') repeat;background-size:auto,70px auto;border:5px ridge #a4723b;border-radius:7px;box-shadow:inset 0 0 18px #090300,0 0 0 2px #200900}.slot{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;aspect-ratio:1;position:relative;background:radial-gradient(circle at 53% 58%,#100806 0%,#170a07 59%,#37190c 72%,#a47740 77%,#2d1107 84%);border-radius:50%;box-shadow:inset 0 3px 7px #000a,0 1px 2px #deb57170}.token{width:97%;height:97%;border-radius:50%;object-fit:cover;filter:drop-shadow(1px 2px 2px #000c);transform:translateY(0);animation:land .28s cubic-bezier(.12,.78,.25,1.05) backwards}.token.piece-last{filter:drop-shadow(1px 2px 2px #000c) drop-shadow(0 0 5px #f8ca7f8c)}.slot.winner .token{box-shadow:0 0 0 3px #fee4a0,0 0 13px 7px #edba55b0}.slot.winner{outline:2px solid #eec876}.slot:after{content:'';position:absolute;inset:2px;border-radius:50%;pointer-events:none;box-shadow:inset -2px -2px 3px #0007, inset 1px 1px 2px #fff3}.wood-sill{margin:5px auto 0;max-width:630px;border-top:2px groove #bf8a4d;text-align:center;padding-top:5px;color:#ab854d;letter-spacing:.18em;font-size:9px}.bottom-plaque{margin:8px auto 1px;max-width:75%;text-align:center;border:2px ridge #ddb074;border-radius:6px;background:linear-gradient(#bd8c4e,#815126,#b98a50);color:#2b1006;text-shadow:0 1px #fff8;font-weight:bold;letter-spacing:.08em;padding:3px 8px;font-size:10px}.bottom-plaque strong{display:block;font-size:17px;letter-spacing:.11em}.underboard{max-width:800px;margin:13px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.steward{align-self:start;padding:22px}.steward h2{font-size:27px}.steward .brass-btn{width:100%;margin-top:10px}.status{font-weight:700;color:#f9d99d;font-size:18px;line-height:1.35}.invite-panel,.ready-panel,.result-panel{margin:13px 0;padding:12px;border:1px solid #a67e47;background:#1a0c06;border-radius:6px}.invite-panel strong{display:block;font:700 16px monospace;letter-spacing:.12em;overflow-wrap:anywhere;color:#eac387}.ready-name{border-bottom:1px solid #6d4524;font-weight:700;color:#e3c496;padding:9px 2px}.ready-name.ok{color:#d7f0ad}.result-panel h3{color:#f9d18f}.result-panel p{line-height:1.5}.tiny{font-size:12px;color:#d9bf97;overflow-wrap:anywhere;line-height:1.4}.error{min-height:27px;text-align:center;color:#ffb7a2;font-weight:700;padding:8px}.error:empty{padding:0}footer{text-align:center;color:#b59062;font-size:11px;letter-spacing:.12em;padding:35px 0 28px}.carved,.cabinet,.game-room{min-width:0}@keyframes land{from{transform:translateY(-160%);opacity:.65}60%{transform:translateY(6%);opacity:1}to{transform:translateY(0);opacity:1}}@media(prefers-reduced-motion:reduce){.token,.brass-btn{animation:none!important;transition:none!important}}
@media(max-width:1030px){.game-room{grid-template-columns:1fr}.steward{max-width:800px;width:100%;margin:auto}.lobby-grid{grid-template-columns:1fr}.lobby-right{grid-template-columns:1fr 1fr;align-items:start}.cabinet{max-width:700px}.game-room{padding:14px}}
@media(max-width:650px){main{padding:0 7px}.game-head{padding:17px 8px}.game-head h1{font-size:35px}.game-head p{font-size:13px}.lobby-grid{gap:12px}.lobby-right{grid-template-columns:1fr}.carved{padding:15px}.pair{grid-template-columns:1fr}.game-room{padding:7px;gap:12px}.scoreboards{gap:6px}.scorebox{padding:5px 5px;gap:3px;border-width:2px}.scorebox img{width:32px}.scorebox strong{font-size:14px}.scorebox small{font-size:8px}.scorebox span{font-size:8px}.cabinet{padding:4px;border-width:3px}.cabinet-name{padding:4px}.cabinet-name strong{font-size:20px}.cabinet-name span{font-size:7px}.upright-frame{border-width:4px;padding:3px}.rack{border-width:2px;gap:2px;padding:5px}.bottom-plaque{max-width:90%}.underboard{grid-template-columns:repeat(2,1fr);gap:5px}.underboard button{min-height:40px;font-size:10px}.column-controls button{min-height:33px}.back{font-size:9px}.brand{font-size:16px}.brand small{font-size:8px}.steward{padding:15px}}


/* V19.8.1 — WINNER BRASS PLAQUE — presentation-only terminal-game announcement */
.board-side{position:relative}
.winner-plaque{position:absolute;z-index:30;top:83px;left:50%;transform:translateX(-50%);
 width:min(89%,570px);padding:14px 18px 15px;text-align:center;pointer-events:none;
 background:linear-gradient(110deg,#533015 0%,#eec581 18%,#ad7635 36%,#f5d89f 50%,#ab6d2e 76%,#563114 100%);
 color:#2e160a;border:5px ridge #edbe74;border-radius:9px;
 box-shadow:inset 0 0 0 2px #643316,inset 0 0 15px #fff2c755,0 12px 0 #361b0e,0 20px 30px #000b;
 text-shadow:0 1px #ffe6ae;animation:innWinnerDrop .65s cubic-bezier(.2,1.2,.32,1) both}
.winner-plaque.hidden{display:none!important}
.winner-plaque:before,.winner-plaque:after{content:'✦';position:absolute;top:43%;font-size:19px;color:#54290f}
.winner-plaque:before{left:12px}.winner-plaque:after{right:12px}
.winner-plaque-eyebrow{font:700 10px/1.25 Georgia,serif;letter-spacing:.16em}
.winner-plaque-name{font:700 clamp(19px,2.5vw,32px)/1.14 Georgia,'Times New Roman',serif;margin:5px 18px 3px;overflow-wrap:anywhere}
.winner-plaque-caption{font:700 clamp(11px,1.3vw,16px)/1.3 Georgia,serif;letter-spacing:.13em}
@keyframes innWinnerDrop{from{opacity:0;transform:translate(-50%,-140px) rotate(-2deg)}70%{opacity:1;transform:translate(-50%,8px)}to{transform:translate(-50%,0)}}
@media(max-width:900px){.winner-plaque{top:72px;max-width:96%;padding:9px 11px 12px}.winner-plaque-name{font-size:clamp(17px,4vw,26px)}.winner-plaque-eyebrow{font-size:8px}}
@media(prefers-reduced-motion:reduce){.winner-plaque{animation:none}}