.bg-page{max-width:1180px;margin:auto;padding:30px 24px 45px}.bg-page .tool-intro{padding:25px 0!important}.bg-heading h1{font-size:30px;margin:12px 0}.bg-heading p{color:#788674;font-size:14px}.bg-setup{display:grid;grid-template-columns:1.25fr 1fr;gap:35px;background:white;border:1px solid #e1e6dc;border-radius:20px;padding:30px}.bg-setup h2{font-size:19px;margin:0 0 15px}.bg-setup label{font-size:12px;line-height:1.7;color:#697867}.bg-setup textarea{width:100%;resize:vertical;min-height:270px;margin-top:10px;padding:13px;line-height:1.8}.bg-error{font-size:12px;line-height:1.7;color:#aa5345;min-height:16px}.bg-import{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.bg-import label{cursor:pointer;padding:8px 13px}.bg-import input{max-width:190px;font-size:11px}.bg-options{display:grid;grid-template-columns:1fr 1fr;gap:15px}.bg-options label{display:grid;gap:7px}.bg-options select{padding:9px}.bg-names{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.bg-names label{display:flex;gap:7px;align-items:center}.bg-names span{font-size:25px}.bg-names input{min-width:0;width:100%;padding:10px;font-size:12px}.bg-rules{background:#f5f7ec;border:1px solid #e8eddd;border-radius:13px;padding:20px;margin-bottom:20px}.bg-rules p{font-size:12px;line-height:1.9;color:#73816a}.bg-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.bg-top>div{display:flex;gap:10px}.bg-play .bg-heading{text-align:center;margin:25px 0 17px}.bg-teams{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.bg-team{display:flex;align-items:center;gap:9px;background:#fff;border:2px solid transparent;border-radius:11px;padding:10px 14px;opacity:.6;transition:transform .2s,border-color .2s,opacity .2s}.bg-team.active{border-color:var(--team);opacity:1;transform:translateY(-3px);box-shadow:0 4px 0 color-mix(in srgb,var(--team),transparent 65%)}.bg-team>span{font-size:30px}.bg-team strong{font-size:13px}.bg-team small{color:#77836f;font-size:10px}.bg-status{text-align:center;font-size:13px;line-height:1.8;min-height:24px;color:#718369;margin:17px 0}.bg-board{max-width:840px;margin:auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:15px;background:#e7eddf;border:1px solid #d3ddc6;border-radius:19px}.bg-tile{position:relative;aspect-ratio:1.2;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px solid #dce2d6;border-radius:11px;background:#fffefa;color:#293746;box-shadow:0 3px 0 #cdd7c4;padding:22px 6px 10px;cursor:pointer;transition:transform .15s,background .2s}.bg-tile:not(:disabled):hover{transform:translateY(-3px);background:#fff8d8}.bg-tile:disabled{opacity:1;cursor:default}.bg-tile>small{position:absolute;top:8px;left:10px;font-size:10px;color:#8b9580}.bg-tile>strong{font-size:clamp(15px,2vw,26px);overflow-wrap:anywhere;line-height:1.35}.bg-tile.owned{background:var(--team);border-color:color-mix(in srgb,var(--team),#000 12%)}.bg-token{font-size:35px}.bg-tile .bg-owned-word{font-size:13px;opacity:.8}.bg-tile.frozen{background:#edf4f6;border-style:dashed;border-color:#94b5c5}.bg-tile.frozen>strong{opacity:.45}.bg-freeze{font-size:13px;color:#6b91a3}.bg-tile.winning{outline:3px solid #dfa825;outline-offset:-3px;animation:bg-win 1s ease-in-out 3}.bg-result{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;margin:25px 0;padding:24px;background:#fff5cd;border:1px solid #efdf9d;border-radius:14px}.bg-result>strong{font-size:23px}.bg-bottom{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:24px}.bg-bottom>span{flex-basis:100%;text-align:center;font-size:11px;color:#939e8d}.bg-word-dialog{width:min(470px,calc(100vw - 28px));max-height:calc(100dvh - 28px);padding:32px 25px;border:1px solid #e3e8df;border-radius:22px;background:#fffefa;text-align:center;color:#293746;box-shadow:0 20px 70px #26332524;overflow:auto}.bg-word-dialog::backdrop{background:#27342b66;backdrop-filter:blur(4px)}.bg-word-dialog[open]{animation:bg-open .2s ease-out}.bg-dialog-close{position:absolute;right:13px;top:10px;background:transparent;border:0;font-size:24px;color:#87957f}.bg-word-dialog>p:first-of-type{font-size:13px;color:#839178}.bg-word-dialog h2{font-size:clamp(35px,8vw,58px);overflow-wrap:anywhere;line-height:1.4;margin:32px 0 10px}.bg-pinyin{font-size:clamp(20px,4vw,27px);color:#7c9770;margin:0 0 28px;line-height:1.7;overflow-wrap:anywhere}.bg-word-dialog>span{font-size:12px;color:#8a9580}.bg-judge{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:25px}.bg-judge button{min-height:46px;font-size:12px;padding:10px 8px}@keyframes bg-open{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}@keyframes bg-win{50%{filter:brightness(1.12);transform:translateY(-3px)}}
@media(max-width:700px){.bg-page{padding:23px 13px 35px}.bg-setup{grid-template-columns:1fr;padding:21px;gap:22px}.bg-board{gap:6px;padding:8px;border-radius:13px}.bg-tile{aspect-ratio:.85;padding:19px 3px 7px;border-radius:7px;box-shadow:0 2px 0 #cdd7c4}.bg-tile>strong{font-size:17px}.bg-tile>small{top:5px;left:5px;font-size:8px}.bg-token{font-size:26px}.bg-tile .bg-owned-word{font-size:10px}.bg-team{padding:7px 9px;gap:5px}.bg-team>span{font-size:23px}.bg-team strong{font-size:11px}.bg-team small{font-size:9px}.bg-status{font-size:11px}.bg-heading h1{font-size:25px}.bg-top button{font-size:10px;padding:8px}.bg-bottom{gap:8px}.bg-bottom button{font-size:11px}.bg-judge{grid-template-columns:1fr}.bg-word-dialog{padding:30px 20px}.bg-options,.bg-names{gap:10px}}
@media(prefers-reduced-motion:reduce){.bg-word-dialog[open],.bg-tile.winning{animation:none}.bg-tile,.bg-team{transition:none}}body.no-motion .bg-word-dialog[open],body.no-motion .bg-tile.winning{animation:none}body.no-motion .bg-tile,body.no-motion .bg-team{transition:none}
@media(min-width:701px){.bg-play{padding-top:20px}.bg-play .bg-heading{margin:15px 0 12px}.bg-play .bg-heading h1{margin:6px 0;font-size:27px}.bg-play .bg-heading p{margin:7px 0}.bg-play .bg-status{margin:12px 0}.bg-play .bg-board{max-width:min(840px,calc(100dvh - 360px))}.bg-play .bg-bottom{margin-top:18px}}