:root{color:#172321;font-synthesis:none;background:#e7ebe5;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button{font:inherit}button:focus-visible{outline-offset:3px;outline:3px solid #e6b94b}.app-shell{max-width:1480px;min-height:100vh;margin:0 auto;padding:28px}.topbar{border-bottom:1px solid #c8d0c9;align-items:center;gap:18px;padding-bottom:20px;display:flex}.topbar h1,.panel-heading h2{letter-spacing:0;margin:0;font-size:25px}.eyebrow{letter-spacing:0;color:#527067;margin:0 0 5px;font-size:11px;font-weight:700}.rule-chip{background:#d5e2d7;border:1px solid #b5cbb9;align-items:center;gap:6px;margin-left:auto;padding:8px 11px;font-size:13px;display:flex}.icon-button{color:#24473a;cursor:pointer;background:#f6f8f3;border:1px solid #8ca99c;border-radius:5px;place-items:center;width:38px;height:38px;display:grid}.status-strip{align-items:center;gap:8px;padding:15px 2px;font-size:14px;display:flex}.status-dot{background:#0a8b65;border-radius:50%;width:8px;height:8px}.status-dot.done{background:#b36f23}.connection-state{color:#61736a;margin-left:8px;font-size:12px}.wall-count{color:#61736a;margin-left:auto;font-size:13px}.workspace{grid-template-columns:minmax(0,1fr) 330px;gap:22px;display:grid}.table-area{color:#f7f4e8;background:#1c6a54;border:1px solid #7c9b89;border-radius:7px;flex-direction:column;align-items:center;min-height:690px;padding:22px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 0 9px #286e59,0 12px 30px #193e3222}.opponent{color:#d4e6dc;align-items:center;gap:9px;font-size:12px;display:flex}.north{flex-direction:column}.concealed-row,.hand-row{gap:3px;display:flex}.table-middle{flex:1;grid-template-columns:82px 1fr 82px;align-items:center;width:100%;min-height:255px;display:grid}.west{flex-direction:column-reverse;justify-self:start}.east{flex-direction:column;justify-self:end}.concealed-column{flex-direction:column;gap:1px;display:flex}.concealed-column .tile{margin:7px 0;transform:rotate(90deg)}.center-board{background:#15513f;border:1px solid #94b6a3;flex-direction:column;justify-content:center;justify-self:center;align-items:center;gap:6px;width:165px;height:165px;display:flex;box-shadow:0 0 0 7px #1b624e}.center-board .wind{color:#e3c66b;font-family:serif;font-size:45px;line-height:1}.center-board strong{font-size:14px}.center-board small{color:#c0d5c8;font-size:11px}.tile{color:#203933;background:#faf8ee;border:1px solid #d5d1bf;border-radius:3px;flex-direction:column;flex:0 0 35px;justify-content:center;align-items:center;width:35px;height:51px;padding:0;font-family:Georgia,serif;font-size:22px;line-height:.8;display:inline-flex;box-shadow:1px 2px #0b372a66}.tile small{margin-top:5px;font:11px/1 sans-serif}.tile.wan{color:#b5362e}.tile.tong{color:#1a667b}.tile.tiao{color:#287540}.tile-back{color:#4e6c60;background:repeating-linear-gradient(45deg,#d9e0dc,#d9e0dc 3px,#85a096 3px 5px);font-size:12px}.tile.selected{border-color:#e4b944;transform:translateY(-8px);box-shadow:0 0 0 2px #e4b944}.hand-row .tile{cursor:pointer;transition:transform .12s}.hand-row .tile:hover{transform:translateY(-6px)}.discard-zone{flex-wrap:wrap;place-content:center;gap:3px;max-width:515px;min-height:108px;padding:8px;display:flex}.discard-zone .tile{flex-basis:28px;width:28px;height:39px;font-size:17px}.discard-zone .tile small{margin-top:3px;font-size:8px}.player-zone{background:#15513f55;border-top:1px solid #80a792;width:100%;max-width:760px;padding:11px}.player-label{justify-content:space-between;margin-bottom:8px;font-size:13px;display:flex}.player-label small{color:#c4d9ce}.hand-row{flex-wrap:wrap;justify-content:center}.decision-panel{background:#f9fbf6;border:1px solid #c5d0c6;border-radius:7px;min-width:0;padding:20px}.panel-heading{color:#225c48;justify-content:space-between;align-items:start;display:flex}.evaluation-state{color:#63776b;border-bottom:1px solid #dce3dc;margin:0;padding:10px 0 14px;font-size:12px}.decision-list{gap:7px;padding:13px 0;display:grid}.decision-row{text-align:left;cursor:pointer;color:#18372c;background:#fff;border:1px solid #d6e0d7;border-radius:5px;justify-content:space-between;align-items:center;width:100%;padding:10px;display:flex}.decision-row:hover{border-color:#76a58b}.decision-row.recommended{background:#fffcf1;border-color:#c69a32}.choice{gap:3px;display:grid}.choice b{font-size:13px}.choice em{color:#443400;background:#e4b944;justify-self:start;padding:2px 5px;font-size:10px;font-style:normal}.choice small{color:#67766d;font-size:11px;line-height:1.35}.rate{color:#216651;font-size:22px;font-weight:700}.rate small{font-size:12px}.action-row{flex-wrap:wrap;gap:7px;display:flex}.action-button,.outcome button{color:#fff;cursor:pointer;background:#216b53;border:1px solid #30775f;border-radius:4px;padding:8px 12px;font-size:13px}.rules-note{color:#5d6d64;border-top:1px solid #dce3dc;gap:6px;margin-top:18px;padding-top:15px;font-size:12px;line-height:1.5;display:grid}.rules-note strong{color:#285440}.empty-state{color:#789086;text-align:center;justify-items:center;gap:8px;padding:30px 0;font-size:13px;display:grid}.outcome{color:#1e4437;background:#f9fbf6;border:1px solid #83a891;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:12px;width:min(300px,100% - 40px);height:165px;margin:auto;display:flex;position:absolute;inset:0;box-shadow:0 15px 40px #08251c88}.outcome strong{font-size:22px}.outcome span{font-size:14px}@media (width<=900px){.app-shell{padding:16px}.workspace{grid-template-columns:1fr}.table-area{min-height:605px}.decision-panel{order:-1}.decision-list{grid-template-columns:repeat(2,minmax(0,1fr))}.rules-note{display:none}}@media (width<=560px){.topbar{gap:9px}.topbar h1{font-size:20px}.rule-chip{padding:6px;font-size:11px}.table-area{min-height:575px;padding:15px 8px}.tile{flex-basis:30px;width:30px;height:45px;font-size:19px}.table-middle{grid-template-columns:50px 1fr 50px}.center-board{width:128px;height:128px}.concealed-row .tile:nth-child(n+10){display:none}.decision-list{grid-template-columns:1fr}.discard-zone{min-height:95px}.hand-row{gap:2px}.connection-state{display:none}.wall-count{font-size:11px}}