/* Shared controls and dialogs; the mobile board fits the current browser viewport. */
.compact-settings{display:grid;grid-template-columns:27% 23% 50%;align-items:center;min-width:0;background:#fffef9;border:1px solid #dce4d0;border-radius:14px;padding:0 3px;margin:0 0 16px}
.compact-settings label{display:block;position:relative;min-width:0;max-width:none;width:auto;margin:0;padding:0 10px}
.compact-settings label:after{content:'';position:absolute;width:1px;height:16px;right:0;top:50%;transform:translateY(-50%);background:#e1e7d8}
.compact-settings label>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.compact-settings select{width:100%;max-width:none;min-width:0;height:46px;min-height:44px;border:0;border-radius:10px;box-shadow:none;background-color:transparent;font-size:14px;color:#4d6952;padding:0 18px 0 4px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6'%3E%3Cpath d='m1 1 3.5 3.5L8 1' fill='none' stroke='%2383947a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 1px center;background-repeat:no-repeat}
#settingsBtn{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:46px;padding:4px 9px;background:transparent;border-radius:11px;font-size:14px;line-height:1.25}
#settingsSummary{min-width:0;overflow-wrap:anywhere;text-align:center}#settingsBtn svg{width:18px;height:18px;flex-shrink:0;color:#879b7c}
.pause-button{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;background:#e8eddd;border:1px solid #d6dfc9;border-radius:13px;color:#587252}.pause-button svg{width:20px;height:20px}.pause-button:disabled{opacity:.4;cursor:default}.pause-button:not(:disabled):hover,#settingsBtn:hover{background:#e2ead7}
.mobile-round{display:none}.manually-paused .board{visibility:hidden}.pause-dialog{text-align:center;width:330px;padding:26px 24px}.pause-emblem{width:58px;height:58px;border-radius:20px;background:#e9efdf;display:grid;place-items:center;color:#6a8a60;margin:0 auto 16px}.pause-emblem svg{width:25px;height:25px}.pause-dialog h2{font-size:24px;margin:0 0 13px}.pause-dialog p{font-size:14px;line-height:1.8;color:#829174;margin:0 0 23px}.pause-dialog .primary-button{width:100%;min-height:48px}
.settings-dialog{width:440px;max-height:90dvh;padding:22px}.settings-dialog .dialog-heading{position:static;padding:0}.settings-dialog .dialog-heading h2{overflow-wrap:anywhere;line-height:1.35}.sheet-handle{display:none}.setting-label{font-size:13px;margin:19px 0 8px;color:#879879}
.settings-dialog .edition-switch,.settings-dialog .mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;padding:4px;background:#eaeedf;border:1px solid #dce3d2;border-radius:14px;width:100%;min-width:0}
.settings-dialog .edition-switch button,.settings-dialog .mode-switch button{min-height:48px;width:auto;margin:0;padding:8px 7px;border:0;border-radius:10px;background:transparent;box-shadow:none;overflow-wrap:anywhere;white-space:normal;font-size:14px;line-height:1.35;color:#879579}
.settings-dialog .edition-switch button b{font-size:14px;line-height:1.35}.settings-dialog .edition-switch button small{display:none}.settings-dialog .edition-switch button.active,.settings-dialog .mode-switch button.active{background:#fffef9;color:#496b53;box-shadow:0 1px 4px #435f4915}.settings-dialog #challengeEdition.active{background:#f6e6c9;color:#96723f}
.settings-note{font-size:12px;line-height:1.65;color:#8b977f;margin:15px 0}.settings-dialog #doneSettings{width:100%;min-height:46px}.settings-links{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:14px}.settings-links button{padding:9px 6px;min-height:44px;background:#edf1e3;border-radius:11px;font-size:12px;overflow-wrap:anywhere;line-height:1.4}.settings-dialog .level-progress-strip{margin-top:14px;gap:8px;flex-wrap:wrap}.settings-dialog #levelMapBtn{min-height:44px}.settings-dialog .supplement-controls{margin-bottom:0;gap:8px;flex-wrap:wrap}.settings-dialog .supplement-controls button{min-height:44px;white-space:normal;line-height:1.5}.word-detail{font-size:16px;line-height:1.7;overflow-wrap:anywhere}.word-detail p:lang(ko){font-family:KoreanUnified,Jua,sans-serif}.word-ribbon[role=button]{cursor:pointer}
.compact-language{display:none}
#doneSettings,#continueGameBtn{justify-content:center}.settings-dialog h2,.pause-dialog h2{font-weight:400}
@media(max-width:760px),(pointer:coarse) and (max-height:500px){
 html,body{height:100%;width:100%;overflow:hidden;overscroll-behavior:none}body{height:100dvh;display:grid;grid-template-rows:44px minmax(0,1fr);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 .ambient,.sidebar,.rightbar,body>footer{display:none}.topbar{height:44px;min-height:0;max-width:520px;width:100%;padding:0 12px;margin:0 auto;gap:8px}.brand{font:800 13px system-ui,sans-serif;gap:6px;white-space:nowrap;min-width:0;letter-spacing:.1px}.brand-mark{font-family:KoreanUnified,Jua,sans-serif;font-size:27px;width:auto;height:auto;line-height:1;background:transparent;border:0;box-shadow:none;transform:none;padding:0}.brand-mark span,.brand small,.saved-label{display:none}.top-actions{gap:0;flex-shrink:0}.top-actions .icon-button{width:44px;height:44px;min-width:44px;min-height:44px;background:transparent;border:0;font-size:18px}
 .layout{display:block;max-width:520px;min-height:0;height:100%;width:100%;padding:4px 12px 8px;margin:0 auto}.game-area{display:grid;grid-template-rows:46px minmax(0,1fr) 32px;gap:8px;height:100%;min-height:0;min-width:0}.game-heading{display:none}.compact-settings{margin:0;min-height:46px;height:46px}.compact-settings label{padding:0 8px}.compact-settings select{height:44px;min-height:44px;font-size:12px;padding-left:1px}.compact-settings .translation-select select{opacity:0;position:relative;z-index:1}.compact-language{display:block;position:absolute;inset:0 9px 0 12px;pointer-events:none;line-height:44px;font-size:14px;font-weight:400;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6'%3E%3Cpath d='m1 1 3.5 3.5L8 1' fill='none' stroke='%2383947a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right center;background-repeat:no-repeat}.compact-settings select:focus-visible{outline:2px solid #72986c;outline-offset:-2px}.translation-select:focus-within{outline:2px solid #72986c;border-radius:10px}#settingsBtn{font-size:12px;min-height:44px;height:44px;padding:3px 7px;gap:6px}#settingsSummary{max-height:36px;line-height:1.35}
 .play-card{display:grid;grid-template-rows:54px minmax(0,1fr) 44px;gap:8px;padding:0;border:0;border-radius:0;box-shadow:none;min-height:0;height:100%;background:transparent}.scorebar{padding:4px 0;gap:8px;border-top:1px solid #e3e8d8;border-bottom:1px solid #e3e8d8;min-width:0}.scorebar>div:first-child{order:2;max-width:16%;text-align:center;flex:0 0 auto}.scorebar .goal{order:1;min-width:55px}.scorebar .time{order:3;min-width:55px;flex-shrink:0}.scorebar .pause-button{order:4}.scorebar small{font-size:9px;line-height:1.1;margin:0 0 2px}.scorebar strong{font-size:21px;line-height:1;letter-spacing:0}.scorebar .time strong{font-size:22px;letter-spacing:0}.scorebar #timeLabel{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.goal>div:first-child{flex-wrap:nowrap;align-items:center;gap:5px;margin-bottom:3px;font-size:11px}.goal>div:first-child>span{display:none}.goal b{font:600 10px system-ui}.mobile-round{display:block;background:transparent;border:0;font-size:12px;padding:0;min-height:32px;min-width:44px;color:#526f50;white-space:nowrap}.goal .progress-track{height:5px}.instruction{display:none}
 .board-wrap,.board{min-height:0;height:100%;min-width:0}.board,.board.affix-board{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(var(--board-rows,4),minmax(0,1fr));gap:8px;align-content:stretch}.board .tile,.board.affix-board .tile{height:100%;min-height:0;border-radius:18px;border-bottom-width:4px;padding:6px 3px;gap:3px;container-type:size}.tile .ko,.tile.bilingual .ko,.affix-board .tile .ko{font-size:clamp(18px,5.7vw,25px);line-height:1.15;max-width:100%;font-weight:400}.tile .ko.long,.tile.bilingual .ko.long,.affix-board .tile .ko.long{font-size:13px;line-height:1.2}.tile .zh,.affix-board .tile .zh{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;font-size:12px;line-height:1.3;max-width:100%}.tile .zh.long,.affix-board .tile .zh.long{font-size:11px}.tile .zh:lang(zh-Hans),.affix-board .tile .zh:lang(zh-Hans){font-size:14px}.tile .tile-translation,.affix-board .tile .tile-translation{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:10px;line-height:1.3;max-height:27px;max-width:100%;letter-spacing:0;flex-shrink:1}.tile .tile-translation:lang(zh-Hans),.affix-board .tile .tile-translation:lang(zh-Hans){font-size:12px;max-height:32px}.tile .affix-example,.affix-board .tile .affix-example{font-size:11px;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;flex-shrink:1}.tile .speaker{height:28px;width:28px}.tile.selected{transform:translateY(-1px);outline-offset:-3px}.tile.hinted{outline-offset:-3px}
 .board-actions{margin:0;padding:0;gap:6px;border:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:44px}.board-actions button{padding:3px 4px;min-height:44px;border:1px solid #dce4d0;border-radius:11px;background:#fffef9;font-size:11px;line-height:1.2;overflow-wrap:anywhere}.board-actions small{margin-left:2px}
 .word-ribbon{margin:0;padding:2px 0;min-height:0;height:32px;border:0;background:transparent;gap:6px;align-items:center;border-radius:5px;overflow:hidden}.word-ribbon .ribbon-icon{display:none}.word-ribbon>div{display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden;white-space:nowrap}.word-ribbon strong,.word-ribbon strong.learned{font-size:14px;flex-shrink:0;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.word-ribbon:not(.has-word)>div{justify-content:center}.word-ribbon:not(.has-word) strong{max-width:100%;font-size:11px;color:#8a987d}.word-ribbon:not(.has-word) p{display:none}.word-ribbon p,.word-ribbon p:lang(zh-Hans){display:block;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;line-height:1.4}.word-ribbon .word-example{display:none}.word-ribbon button{font-size:0;width:32px;height:32px;min-width:32px;padding:0}.word-ribbon button:after{content:'↻';font-size:19px}
 .start-cover{inset:0;padding:6px}.board-wrap:has(.affix-board) .start-cover{align-items:center;padding-top:6px}.start-card{padding:13px 16px;max-height:100%;width:min(330px,94%)}.start-card>svg,.start-card>.tiny-label{display:none}.start-card h3{font-size:17px;margin:0 0 8px}.start-card p{font-size:12px;line-height:1.5;margin:8px 0;overflow-wrap:anywhere}.start-card .primary-button{min-height:44px;font-size:14px;padding:10px 14px}.start-card>small{font-size:10px;line-height:1.4;margin-top:8px}
 .settings-dialog{position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:520px;max-height:90dvh;border-radius:25px 25px 0 0;border-bottom:0;padding:10px 20px max(20px,env(safe-area-inset-bottom));overflow:auto}.sheet-handle{display:block;width:35px;height:4px;border-radius:4px;background:#d6ddcc;margin:0 auto 9px}.settings-dialog .dialog-heading{min-height:44px}.settings-dialog .dialog-heading h2{font-size:20px}.settings-dialog .icon-button{min-height:44px;min-width:44px}.settings-dialog .level-progress-strip{display:flex}.settings-dialog .supplement-controls{display:flex}.settings-dialog .supplement-controls [hidden]{display:none}.settings-dialog .setting-label{margin-top:14px}.settings-dialog .settings-note{font-size:11px;margin:12px 0}.settings-dialog .edition-switch button,.settings-dialog .mode-switch button{min-height:44px}.pause-dialog{max-width:calc(100vw - 48px)}
 .toast{padding:10px 14px;font-size:12px;bottom:max(14px,env(safe-area-inset-bottom))}
 .word-ribbon:not(.has-word) #ribbonZh{display:none}
 .scorebar .goal{position:relative}.goal>div:first-child{margin-bottom:0}.mobile-round{min-height:44px}.goal .progress-track{position:absolute;bottom:0;left:0;right:0}.word-ribbon.has-word>div:after{content:'›';color:#8c9d7e;font-size:18px}
}
@container(max-height:66px){.tile .ko,.tile.bilingual .ko,.affix-board .tile .ko{font-size:18px}.tile .ko.long,.tile.bilingual .ko.long{font-size:11px}.tile .tile-translation,.tile .tile-translation:lang(zh-Hans),.affix-board .tile .tile-translation,.affix-board .tile .tile-translation:lang(zh-Hans){-webkit-line-clamp:1;max-height:15px;font-size:10px}.tile .affix-example{font-size:10px}.tile .zh,.affix-board .tile .zh{-webkit-line-clamp:3;font-size:10px}}
@media(max-width:350px){.layout{padding-left:9px;padding-right:9px}.brand{font-size:11px}.topbar{padding-left:10px;padding-right:7px}.compact-settings label{padding:0 6px}.compact-settings select{font-size:11px}.compact-language{font-size:13px;left:9px}.scorebar{gap:6px}.scorebar .time strong{font-size:20px}.board,.board.affix-board{gap:6px}.board .tile,.board.affix-board .tile{border-radius:15px}.board-actions{gap:5px}.board-actions button{font-size:10px}#settingsBtn{font-size:11px}}
@media(max-width:760px) and (max-height:600px),(pointer:coarse) and (max-height:500px){body{grid-template-rows:minmax(0,1fr)}.topbar{display:none}.layout{padding-top:8px}.game-area{gap:6px;grid-template-rows:46px minmax(0,1fr) 28px}.play-card{grid-template-rows:48px minmax(0,1fr) 44px;gap:6px}.word-ribbon{height:28px}.start-card h3{display:none}.start-card p{font-size:11px}.start-card{padding:8px 12px}}
@media(orientation:landscape) and (max-height:500px) and (pointer:coarse){.layout{max-width:100%}.game-area{grid-template-columns:minmax(210px,31%) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 28px;gap:8px 16px}.compact-settings{grid-column:1;grid-row:1;align-self:start;grid-template-columns:30% 25% 45%}.play-card{grid-column:2;grid-row:1 / 3;grid-template-rows:46px minmax(0,1fr) 44px}.word-ribbon{grid-column:1;grid-row:2}.board,.board.affix-board{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(var(--board-rows,4),minmax(0,1fr));gap:5px}.board .tile{padding:3px 2px;border-radius:12px}.start-card p{display:none}.start-card>small{display:none}.settings-dialog{max-width:600px}}
