@charset "UTF-8";
:root{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif;color:#182e41;background:#f5f4ef;font-synthesis:none;--ink:#182e41;--muted:#5c6c78;--blue:#2563b7;--green:#167453;--orange:#b95716;--wild:#96701c;--line:#d9e0df;--shadow:0 12px 36px #18394a0b}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #317bc1;outline-offset:4px}button{touch-action:manipulation}h1,h2,h3,p{margin:0}button{color:inherit}button,input{accent-color:var(--green)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.loading{min-height:75vh;display:grid;place-content:center;justify-items:center;gap:24px}
.shell{max-width:1320px;margin:auto;padding:0 36px 32px}.topbar{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:750;letter-spacing:.02em}.brand-mark{display:grid;place-items:center;width:43px;height:48px;border-radius:12px;background:var(--ink);color:#fff;box-shadow:5px 3px 0 #a9c8b7;font-size:19px;font-weight:800}.brand small{display:block;font-size:10px;letter-spacing:.2em;color:var(--muted);margin-top:3px}.top-right{display:flex;align-items:center;gap:12px}.prototype{font-size:11px;letter-spacing:.08em;color:#536973;border:1px solid #cbd7d8;border-radius:100px;padding:6px 10px;white-space:nowrap}.text-button{background:none;border:0;min-height:44px;padding:10px 12px;font-weight:650;font-size:14px}.muted{color:var(--muted)}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:750;color:var(--green)}
.home-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:72px;align-items:center;min-height:650px;padding:55px 0 40px}.hero h1{font-size:clamp(32px,3.8vw,53px);line-height:1.5;letter-spacing:-.04em;margin:17px 0}.hero h1 em{font-style:normal;color:var(--green)}.intro{line-height:1.9;font-size:16px;color:var(--muted);max-width:470px}.course-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:27px 0 18px}.course-tab{background:#fff;border:1px solid #d7dede;border-radius:9px;padding:11px 17px;font-size:13px}.course-tab.active{border-color:var(--ink);background:var(--ink);color:white}.mode-options{display:grid;gap:9px;max-width:475px}.mode-option{display:flex;align-items:center;gap:12px;background:#fff;padding:16px;border:1px solid #dce4df;border-radius:12px;cursor:pointer}.mode-option:has(input:checked){border-color:#4d8a70;background:#f0f7f0;box-shadow:inset 0 0 0 1px #4d8a70}.mode-option input{width:18px;height:18px;flex:none}.mode-option strong{font-size:15px}.mode-option small{display:block;color:var(--muted);font-size:12px;margin-top:5px}.recommend{font-size:10px;color:#216142;background:#dcebdd;border-radius:4px;padding:4px 6px;margin-left:8px;white-space:nowrap}.primary{border:0;border-radius:11px;background:var(--ink);color:#fff;padding:15px 23px;font-weight:700;min-height:50px;box-shadow:0 5px 12px #122f4110}.primary:hover:not(:disabled){background:#2b4d63}.primary.green{background:var(--green)}.secondary{border:1px solid #bdcacb;border-radius:10px;background:#fff;padding:12px 18px;font-weight:650;min-height:46px}.home-start{display:flex;align-items:center;gap:18px;margin-top:19px}.home-start .primary{min-width:245px}.note{font-size:12px;color:var(--muted);line-height:1.7}.seed-option{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted);margin-top:17px;min-height:32px}.seed-option input{width:16px;height:16px}
.preview{background:#e8ede5;border:1px solid #dce4d8;border-radius:24px;padding:35px 28px 27px;position:relative}.preview-label{font-size:12px;letter-spacing:.08em;display:flex;align-items:center;gap:7px}.preview-label:before{content:"";width:7px;height:7px;background:var(--green);border-radius:50%}.example-cards{display:flex;justify-content:center;gap:17px;padding:37px 5px 27px}.example-card{width:160px;min-height:205px;border-radius:14px;background:#fff;box-shadow:var(--shadow);border:2px solid #5d87c4;display:flex;flex-direction:column;justify-content:space-between;padding:20px 16px;transform:rotate(-5deg)}.example-card:nth-child(2){transform:rotate(5deg) translateY(6px)}.card-kicker{font-size:10px;letter-spacing:.15em;color:#71808a}.example-card strong{font-size:21px;line-height:1.6}.example-card small{color:var(--blue);font-size:11px}.preview-explanation{background:#f9fbf8;border-radius:12px;padding:18px;line-height:1.8;font-size:14px}.relation-tag{display:inline-block;font-size:11px;font-weight:700;border-radius:5px;padding:3px 8px;background:#e8f0fc;color:var(--blue);margin-bottom:7px}.preview-bottom{display:flex;gap:8px;align-items:center;margin-top:18px;font-size:11px;color:#5f7462}.preview-bottom span{background:#d4e2d0;border-radius:50%;width:22px;height:22px;display:grid;place-items:center}.principles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);padding:25px 0;gap:28px}.principles strong{font-size:14px}.principles p{font-size:12px;color:var(--muted);line-height:1.7;margin-top:7px}
.game-meta{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin:23px 0 16px}.game-meta h1{font-size:21px}.game-meta small{font-size:12px;color:var(--muted);margin-left:12px}.hint-switches{display:flex;gap:15px;align-items:center;flex-wrap:wrap;font-size:12px}.check-control{display:flex;gap:7px;align-items:center;min-height:32px;cursor:pointer}.check-control input{width:17px;height:17px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start}.table{background:#eef1e9;border:1px solid #d8e2d4;border-radius:18px;padding:20px}.opponents{display:flex;gap:30px;justify-content:center;padding:2px 0 14px}.opponent{border:1px solid transparent;padding:12px 18px;border-radius:12px;min-width:190px;background:#ffffff75;transition:background .2s}.opponent.current{background:white;border-color:#94b3a0}.opponent-head{display:flex;align-items:center;gap:9px;font-size:13px}.avatar{height:32px;width:32px;border-radius:50%;display:grid;place-items:center;background:#dbe6ed;color:#3b5b70;font-size:12px;font-weight:800}.avatar.two{background:#e5e0ef;color:#776287}.opponent-count{margin-left:auto;font-size:12px;font-weight:700}.backs{height:38px;display:flex;justify-content:center;margin-top:10px;padding-left:13px}.mini-back{width:24px;height:33px;border:2px solid #f8fbf8;border-radius:4px;background:repeating-linear-gradient(45deg,#486c64 0 2px,#53786f 2px 5px);margin-left:-7px;transform:rotate(-5deg);box-shadow:1px 2px 2px #23452c10}.mini-back:nth-child(even){transform:rotate(5deg)}.turn-banner{text-align:center;padding:15px 10px 17px;border-top:1px solid #d7dfd1}.turn-banner strong{font-size:16px;display:block}.turn-banner p{color:var(--muted);font-size:12px;margin-top:7px;line-height:1.6}.turn-banner.human strong{color:var(--green)}.relations{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.relation{position:relative;background:#fff;border:1px solid #c9d6dc;border-radius:10px;padding:11px 9px;min-height:70px;text-align:left;color:var(--tone,var(--blue));isolation:isolate}.relation strong{font-size:16px;display:block}.relation small{display:block;font-size:10px;margin-top:4px;color:#62727e}.relation.selected{border:2px solid var(--tone);padding:10px 8px;background:var(--tint)}.relation.selected:after{content:"✓ 選択済み";position:absolute;right:6px;top:7px;font-size:9px;font-weight:750}.tone-inclusion{--tone:#2563b7;--tint:#edf3fe}.tone-means{--tone:#167453;--tint:#eaf5ee}.tone-contrast{--tone:#b95716;--tint:#fff1e7}.tone-wild{--tone:#96701c;--tint:#fff7df}
.hinted{outline:3px solid var(--tone);outline-offset:3px}.hinted.pulsing{animation:hintPulse 2s ease-in-out 2;animation-delay:var(--pulse-delay,0s)}@keyframes hintPulse{0%,100%{box-shadow:0 0 0 1px var(--tone),0 0 0 5px transparent}50%{box-shadow:0 0 0 3px var(--tone),0 0 0 8px var(--tint)}}
.hint-panel{background:#fff;border:1px solid #d8e1da;border-radius:16px;padding:21px;box-shadow:var(--shadow);min-height:260px}.hint-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:15px;border-bottom:1px solid #e6eae5}.hint-heading h2{font-size:15px}.hint-heading small{font-size:11px;color:var(--muted)}.hint-mode-tag{font-size:10px;background:#edf4ed;border-radius:5px;color:#387553;padding:4px 7px}.hint-body{padding-top:16px}.hint-body h3{font-size:17px;line-height:1.8;margin:3px 0 12px;overflow-wrap:anywhere}.hint-body .statement{font-size:14px;line-height:1.9;color:#36515e}.detail-label{display:block;font-size:10px;font-weight:700;color:var(--muted);margin-top:12px;margin-bottom:4px;letter-spacing:.05em}.hint-extra{font-size:12px;line-height:1.8;color:#526575;white-space:pre-wrap;overflow-wrap:anywhere}.hint-help{font-size:11px;color:var(--muted);line-height:1.8;padding:12px 0;margin-top:5px}.hint-controls{display:flex;gap:8px}.hint-controls button{font-size:12px;padding:10px 13px;min-height:42px}.hint-empty{padding:25px 0 17px;color:var(--muted);font-size:14px;line-height:1.9}.sidebar-note{padding:16px 9px;font-size:11px;line-height:1.8;color:var(--muted)}
.hand-section{margin-top:24px}.hand-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.hand-heading h2{font-size:15px}.hand-heading small{font-size:11px;color:var(--muted)}.hand{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:13px;align-items:stretch}.playing-card{border:1px solid #d1dcde;border-radius:11px;position:relative;background:white;box-shadow:0 4px 7px #1a34410b;min-width:0;isolation:isolate}.playing-card.selected{border:2px solid var(--ink);box-shadow:0 0 0 2px #182e4110}.card-select{width:100%;min-height:151px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;justify-content:space-between;gap:14px;background:transparent;border:0;padding:15px 12px 12px;border-radius:11px 11px 0 0;opacity:1!important}.card-select:disabled{color:#304757}.card-top{display:flex;justify-content:space-between;align-items:center;width:100%;font-size:10px;color:#7b8b92}.card-select strong{font-size:17px;line-height:1.6;font-weight:700;overflow-wrap:anywhere}.card-bottom{font-size:10px;color:#768b8b}.card-detail{display:block;border:0;border-top:1px solid #ecf0ef;width:100%;padding:9px 5px;background:#f9fbfa;font-size:10px;color:#506b79;border-radius:0 0 10px 10px;min-height:35px}.selection-check{color:var(--ink);font-weight:750}.hint-flag{position:absolute;top:-10px;right:7px;background:var(--tone);color:white;font-size:9px;font-weight:700;padding:3px 6px;border-radius:4px;z-index:1}.wild-card .card-bottom{color:var(--wild)}.hand-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;padding:18px;background:#fff;border:1px solid #dae2e2;border-radius:13px}.hand-footer p{font-size:12px;line-height:1.7;color:var(--muted)}.hand-actions{display:flex;gap:10px;flex-wrap:wrap}.hand-actions button{font-size:13px;padding:13px 18px}.selection-summary{max-width:420px}.error-message{margin-top:12px;border-left:3px solid #b35737;background:#fff4ed;padding:12px 15px;font-size:13px;line-height:1.7;color:#8e4529}.public-log{margin-top:16px;padding:14px 18px;font-size:12px;color:#586e78;background:#eef2ef;border-radius:10px;line-height:1.8}.public-log strong{color:#29485b}.draw-zone{padding:17px 8px 12px;text-align:center;background:#fff;border-radius:12px;margin-top:16px}.draw-zone h3{font-size:14px;margin-bottom:14px}.draw-offer{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.draw-card{width:57px;height:80px;border:3px solid white;outline:1px solid #648878;border-radius:8px;color:#e9f2ea;background:repeating-linear-gradient(45deg,#3f6e61 0 2px,#48796a 2px 5px);font-size:12px;box-shadow:0 4px 8px #21473610}.draw-card:hover{transform:translateY(-5px)}
.result-wrap{max-width:890px;margin:45px auto}.result-hero{text-align:center;background:#eaf0e6;padding:38px 25px;border-radius:20px}.result-icon{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 17px;background:white;border-radius:50%;font-size:29px;color:var(--green)}.result-hero h1{font-size:29px;margin-bottom:10px}.result-hero p{color:#617069;font-size:14px;line-height:1.8}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.stat{padding:20px 12px;background:#fff;border:1px solid #dce3de;border-radius:12px;text-align:center}.stat strong{display:block;font-size:29px;margin-bottom:8px}.stat small{font-size:12px;color:var(--muted)}.result-actions{display:flex;gap:10px;justify-content:center;margin:25px 0}.history-list{background:white;border:1px solid #dce4df;border-radius:15px;padding:22px}.history-list h2{font-size:17px;margin-bottom:15px}.history-row{padding:15px 0;border-top:1px solid #e6ece8}.history-row p{font-size:13px;line-height:1.8;color:var(--muted);margin-top:5px}.history-row strong{font-size:14px}.history-row small{font-size:11px;color:var(--muted)}
dialog{border:1px solid #d7e1dc;border-radius:19px;padding:0;color:var(--ink);width:min(580px,calc(100vw - 28px));max-height:90dvh;box-shadow:0 30px 90px #132b4430}dialog::backdrop{background:#14273473;backdrop-filter:blur(3px)}#modal-content{max-height:90dvh;display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:21px 24px;border-bottom:1px solid #e1e7e4;background:#fff;flex:none}.modal-header h2{font-size:20px;line-height:1.6}.modal-close{font-size:20px;background:#f0f3f0;border:0;border-radius:50%;width:39px;height:39px;flex:none}.modal-body{padding:23px 24px;overflow-y:auto;line-height:1.9;font-size:14px;overflow-wrap:anywhere}.modal-body h3{font-size:15px;margin:18px 0 7px}.modal-body h3:first-child{margin-top:0}.modal-body ol{padding-left:21px}.modal-body li{padding-bottom:12px}.modal-body .definition{font-size:17px;color:#31586a;margin-bottom:16px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid #e1e7e4;flex:none}.relation-detail{border-top:1px solid #e5ebe7;padding:13px 0}.relation-detail p{font-size:13px}.footer-note{text-align:center;color:#7b898b;font-size:10px;line-height:1.8;margin-top:27px}
@media(min-width:1450px){.shell{max-width:1370px}.game-layout{grid-template-columns:minmax(0,1fr) 325px}.playing-card .card-select{min-height:166px}}
@media(max-width:1000px){.shell{padding:0 24px 25px}.home-grid{gap:30px}.preview{padding:23px 17px}.example-card{width:140px;padding:18px 12px}.game-layout{grid-template-columns:minmax(0,1fr) 255px}.hint-panel{padding:17px}.game-meta small{display:block;margin:7px 0 0}.hand{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}}
@media(max-width:760px){.shell{padding:0 18px 25px}.topbar{min-height:76px}.brand{font-size:14px}.brand-mark{width:34px;height:39px;font-size:15px}.prototype{display:none}.home-grid{grid-template-columns:1fr;gap:28px;padding-top:32px;min-height:auto}.hero h1{font-size:35px}.mode-options{max-width:none}.home-start .primary{flex:1;min-width:0}.preview{max-width:460px;width:100%;margin:auto}.example-cards{padding-top:22px}.example-card{min-height:160px;width:155px}.principles{grid-template-columns:1fr;gap:18px}.game-layout{grid-template-columns:1fr}.side{grid-row:2}.sidebar-note{display:none}.hint-panel{min-height:0}.hint-body h3{font-size:16px;margin-bottom:8px}.hint-panel .hint-extra{font-size:12px}.table{padding:14px}.opponents{gap:12px}.opponent{min-width:0;width:50%;padding:9px 11px}.relations{gap:8px}.relation{min-height:72px}.relation small{font-size:9px}.relation.selected:after{position:static;display:block;margin-top:4px}.hand{grid-template-columns:repeat(auto-fit,minmax(106px,1fr));gap:12px}.card-select{min-height:145px}.card-select strong{font-size:16px}.hand-heading{align-items:flex-start}.hand-footer{align-items:stretch;flex-direction:column;padding:15px}.hand-actions{display:grid;grid-template-columns:1fr 1fr}.hand-actions button{padding:12px 10px}.result-wrap{margin:30px auto}.result-stats{gap:8px}.stat small{font-size:10px}.stat strong{font-size:24px}.game-meta{margin-top:19px}.hint-switches{gap:12px}.game-meta h1{font-size:19px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.draw-card:hover{transform:none}}

/* Keep the action area in view during a screen-share, including long hands. */
.hand-footer{position:sticky;bottom:12px;z-index:2;box-shadow:0 8px 28px #18394a16}
@media(max-width:760px){.topbar{flex-wrap:wrap;padding:12px 0}.top-right{margin-left:auto;gap:6px}.brand small{font-size:8px;letter-spacing:.14em}.topbar .text-button{font-size:12px;padding:8px}.relations>*{min-width:0}}
.card-select strong{text-wrap:balance}

/* v1.2: beginner wording, levels, readable selection, and public pair review. */
.brand-logo{display:block;flex:none;width:48px;height:48px}.goal-box{background:#e8f2e7;border-left:4px solid var(--green);border-radius:0 12px 12px 0;padding:17px 20px;margin:20px 0 12px;line-height:1.8}.goal-label{font-size:11px;font-weight:700;color:var(--green)}.goal-box p{font-size:17px;margin:3px 0}.goal-box strong{font-size:18px;color:#165a40}.intro{font-size:14px}.level-section{margin:18px 0}.level-section h2,.relations-title{font-size:14px;margin-bottom:12px}.level-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.level-option{background:#fff;border:1px solid #cbd7cf;border-radius:9px;padding:12px 4px;min-height:64px}.level-option strong{display:block;font-size:13px}.level-option span{display:block;font-size:10px;margin-top:6px;color:var(--muted)}.level-option.active{border:2px solid var(--green);background:#eef7ed}.level-notice{font-size:12px;line-height:1.7;margin-top:9px;color:var(--muted);min-height:21px}.wild-card{background:#fff6d9;border:2px solid #b88929}.wild-card .card-bottom{font-weight:800;color:#775207}.wild-card .card-bottom:before{content:"✦ ";font-size:17px}.wild-card .card-detail{background:#fff0c1;color:#745116}.playing-card.selected{background:#dcefe4;border-color:#176348}.playing-card.selected .card-detail{background:#d4e8dc}.playing-card.selected .selection-check{color:#164b36}.relations-title{margin-top:4px}.opponent-head strong{overflow-wrap:anywhere;line-height:1.6}.avatar,.opponent-count{flex:none}.discard-area{margin-top:24px;border:1px solid #d9e2da;border-radius:14px;padding:20px;background:#ebf0e9}.discard-area h2{font-size:17px;margin-bottom:6px}.discard-pairs{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin-top:15px}.discard-pair{border:1px solid #d3ddd5;border-radius:10px;background:#fff;padding:13px;text-align:left}.discard-pair small{font-size:11px;color:var(--muted)}.pair-cards{display:flex;gap:8px;align-items:center;margin:10px 0}.pair-cards strong{flex:1;align-self:stretch;display:grid;place-items:center;padding:12px 8px;border:1px solid #d8e3db;border-radius:7px;font-size:14px;line-height:1.6;background:#f6f8f4;overflow-wrap:anywhere}.pair-read{font-size:11px;color:var(--green)}.empty-pairs{font-size:13px;line-height:1.8;color:var(--muted)}.pair-definition{border-bottom:1px solid #e1e7e4;padding-bottom:14px;margin-bottom:14px}.pair-detail-link{padding-left:0;color:var(--green)}
@media(max-width:760px){.brand-logo{width:40px;height:40px}.opponent-head{gap:5px;flex-wrap:wrap}.opponent-head strong{font-size:11px;flex:1;min-width:56px}.opponent-count{font-size:11px}.avatar{width:24px;height:24px}.goal-box{padding:14px}.goal-box strong{font-size:16px}.hand-heading{flex-wrap:wrap;gap:5px}.discard-area{padding:14px}.discard-pairs{grid-template-columns:1fr}.result-hero h1{font-size:24px;overflow-wrap:anywhere}.level-options{gap:5px}}

/* Mobile v1.3: a scrolling table with a separate, unobstructed action row. */
.mobile-only{display:none}
@media(max-width:760px){
  .shell{padding:0 max(12px,env(safe-area-inset-right)) 20px max(12px,env(safe-area-inset-left))}
  .topbar{min-height:54px;padding:4px 0;gap:6px;flex-wrap:nowrap}
  .brand{font-size:12px;gap:6px;white-space:nowrap}.brand-logo{width:30px;height:34px}.brand small{display:none}
  .top-right{gap:0}.topbar .text-button{padding:8px 6px;font-size:11px}
  .home-grid{padding:14px 0 24px;gap:24px;grid-template-columns:minmax(0,1fr)}.hero,.preview,.mode-option>span{min-width:0}.eyebrow{font-size:11px}.hero h1{font-size:28px;line-height:1.35;margin:8px 0 10px}
  .goal-box{margin:10px 0 8px;padding:8px 12px;line-height:1.6}.goal-box p{font-size:14px;margin:2px 0}.goal-box p br{display:none}.goal-box strong{font-size:14px}.intro{font-size:12px}
  .course-tabs{margin:12px 0;gap:6px}.course-tab{min-height:44px;padding:9px 12px;font-size:12px}
  .level-section{margin:10px 0}.level-section h2{margin-bottom:6px;font-size:12px}.level-option{min-height:54px;padding:7px 2px}.level-option span{margin-top:3px}.level-notice{font-size:11px;margin-top:5px;min-height:18px}
  .mode-options{gap:6px}.mode-option{padding:9px;gap:7px;min-height:59px}.mode-option strong{font-size:13px}.mode-option small{font-size:11px;margin-top:3px}.recommend{font-size:9px;margin-left:5px}
  .home-start{gap:9px;margin-top:12px}.home-start .primary{min-height:48px;padding:12px;font-size:14px}.home-start .note{font-size:10px}.seed-option{margin-top:6px;min-height:44px;font-size:11px}
  .game-shell{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding-top:env(safe-area-inset-top);padding-bottom:0}
  .game-shell .topbar{flex:none}.game-screen{display:flex;flex-direction:column;flex:1;min-height:0}
  .game-meta{flex:none;display:block;margin:5px 0 0}.game-meta h1{font-size:14px;line-height:1.5}.game-meta small{display:inline;margin:0 0 0 6px;font-size:10px}
  .hint-switches{justify-content:space-between;gap:2px;font-size:11px}.check-control{min-height:44px;gap:4px}.check-control input{margin-left:0}.hint-switches .text-button{font-size:11px;padding:8px 4px}
  .game-layout{display:block;flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scroll-padding-top:calc(var(--guidance-height,180px) + 12px);scroll-padding-bottom:10px}
  .table{padding:10px;border-radius:12px}.opponents{gap:6px;padding:0 0 6px}.opponent{padding:6px;min-width:0}.opponent-head{gap:4px;flex-wrap:nowrap}.opponent-head strong{font-size:10px;min-width:0;line-height:1.4}.avatar{width:21px;height:21px;font-size:10px}.opponent-count{font-size:10px;white-space:nowrap}.backs{display:none}
  .turn-banner{padding:7px 3px}.turn-banner strong{font-size:13px}.turn-banner p{font-size:10px;margin-top:3px;line-height:1.5}
  .mobile-guidance{position:sticky;top:0;z-index:3;background:#eef1e9;padding:6px 0 9px;margin-bottom:4px}
  .hint-panel{padding:8px 10px;border-radius:10px;box-shadow:none}.hint-heading{padding-bottom:4px;border-bottom:0}.hint-heading h2{font-size:12px}.hint-mode-tag{font-size:9px;padding:2px 5px}.hint-body{padding-top:0}
  .hint-body .relation-tag{font-size:10px;padding:2px 5px;margin:0 5px 0 0;float:left}.hint-body h3{font-size:12px;line-height:1.6;margin:0 0 4px;min-height:20px}.hint-body h3 br{display:none}
  .has-candidate .statement,.has-candidate .detail-label,.has-candidate .hint-extra,.has-candidate .hint-help{display:none}
  .hint-controls{display:grid;grid-template-columns:1fr 1.2fr .65fr;gap:5px;clear:both}.hint-controls button{min-height:44px;padding:7px 4px;font-size:11px}.hint-controls .mobile-only{display:block}
  .hint-empty{font-size:11px;padding:3px 0 6px;line-height:1.5}.hint-empty br{display:none}.hint-panel>#hint-open{min-height:44px;padding:8px 12px;font-size:12px}.hint-help{font-size:11px;margin:0;padding:3px 0 5px}
  .relations-title{font-size:11px;margin:6px 0 10px}.relations{gap:9px}.relation{min-height:48px;padding:5px 6px}.relation strong{font-size:13px}.relation small{font-size:9px;margin-top:2px}.relation.selected{padding:4px 5px}.relation.selected:after{position:absolute;top:5px;right:3px;font-size:0;margin:0;content:'✓';font-size:10px}.hint-flag{font-size:8px;top:-8px;padding:2px 4px;right:4px}.hinted{outline-width:2px;outline-offset:2px}
  .hand-section{margin-top:8px}.hand-heading{margin-bottom:12px;gap:3px}.hand-heading h2{font-size:12px}.hand-heading small{font-size:9px}.hand{grid-template-columns:repeat(3,minmax(0,1fr));gap:11px 9px}
  .card-select{min-height:83px;padding:7px 7px 5px;gap:5px}.card-select strong{font-size:13px;line-height:1.45;text-wrap:wrap}.card-top{font-size:8px}.selection-check{font-size:8px}.card-bottom{font-size:8px}.wild-card .card-bottom:before{font-size:10px}.card-detail{min-height:44px;font-size:10px;padding:8px 2px}
  .game-screen>.hand-footer{position:static;flex:none;z-index:auto;margin:6px 0 0;padding:7px 8px max(8px,env(safe-area-inset-bottom));gap:5px;border-radius:11px 11px 0 0;box-shadow:0 -3px 12px #18394a09}
  .hand-footer .selection-summary{font-size:10px;line-height:1.5;max-width:none;overflow-wrap:anywhere}.hand-actions{gap:8px}.hand-actions button{min-height:44px;padding:9px 6px;font-size:12px}
  .game-screen>.footer-note{display:none}.discard-area{margin:12px 0;padding:12px}.discard-area h2{font-size:14px}.draw-zone{margin-top:10px;padding:12px 6px}.draw-zone h3{font-size:12px}.draw-card{min-width:44px;width:44px;height:62px}
  .modal-header{padding:12px 14px}.modal-header h2{font-size:17px}.modal-close{width:44px;height:44px}.modal-body{padding:16px}.modal-actions{padding:12px}.result-actions{flex-wrap:wrap}.result-hero{padding:24px 15px}
}
@media(max-width:760px) and (max-height:600px){
  .mobile-guidance{position:static}.game-layout{scroll-padding-top:10px}.game-meta{display:flex;gap:4px;margin:0}.game-meta h1{font-size:11px}.hint-switches{flex:1;justify-content:flex-end;gap:5px;font-size:10px}.game-meta small{font-size:9px}.topbar{min-height:44px}.brand-logo{height:28px}.hand-footer .selection-summary{font-size:9px}
}

/* v1.4 / No.19–20: the complete hand comes first; hints live below it. */
@media(max-width:760px), (max-width:1000px) and (max-height:500px){
  .game-shell{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding:env(safe-area-inset-top) max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left))}
  .game-shell .topbar{flex:none;min-height:46px;padding:0;flex-wrap:nowrap;gap:5px}.game-shell .brand{font-size:12px;gap:5px}.game-shell .brand-logo{width:28px;height:30px}.game-shell .brand small,.game-shell .prototype{display:none}.game-shell .top-right{gap:0}.game-shell .topbar .text-button{font-size:11px;padding:8px 6px}
  .game-screen{display:flex;flex-direction:column;flex:1;min-height:0}.game-meta{flex:none;display:flex;flex-wrap:nowrap;justify-content:space-between;gap:4px;margin:0;min-height:44px}.game-meta h1{font-size:13px;line-height:1.5}.game-meta small{display:inline;margin-left:5px;font-size:10px}.hint-switches{gap:0;flex-wrap:nowrap;flex:none}.hint-switches>.check-control{display:none}.hint-switches .text-button{font-size:11px;min-width:44px;padding:8px 4px}.hint-switches .mobile-only{display:block}
  .game-layout{display:block;flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scroll-padding:0}.game-layout>.table{height:100%;display:flex;flex-direction:column;min-height:0;padding:8px;border-radius:12px}
  .opponents{flex:none;gap:6px;padding:0 0 4px}.opponent{padding:4px 6px;min-width:0;width:50%}.opponent-head{gap:4px;flex-wrap:nowrap}.opponent-head strong{font-size:10px;min-width:0;line-height:1.3}.opponent-count{font-size:10px}.avatar{width:19px;height:19px;font-size:10px}.backs{display:none}
  .turn-banner{flex:none;padding:5px 2px}.turn-banner strong{font-size:13px}.turn-banner p{font-size:10px;margin-top:2px;line-height:1.4}
  .relations-title{flex:none;font-size:11px;margin:2px 0 8px}.relations{flex:none;gap:8px}.relation{min-height:44px;padding:4px 6px}.relation.selected{padding:3px 5px}.relation strong{font-size:13px}.relation small{font-size:9px;margin-top:1px}.relation.selected:after{position:absolute;top:4px;right:4px;content:'✓';font-size:10px;margin:0}.hinted{outline-width:2px;outline-offset:2px}.hint-flag{top:-7px;right:3px;font-size:8px;padding:1px 4px}
  .hand-section{display:flex;flex:1;flex-direction:column;min-height:0;margin-top:8px}.hand-heading{flex:none;margin:0 0 9px;gap:3px;flex-wrap:wrap}.hand-heading h2{font-size:12px}.hand-heading small{font-size:9px}.hand{flex:1;min-height:0;max-height:calc(var(--hand-rows,3) * 128px);grid-template-columns:repeat(var(--hand-columns,3),minmax(0,1fr));grid-template-rows:repeat(var(--hand-rows,3),minmax(0,1fr));gap:8px}
  .playing-card{display:flex;flex-direction:column;min-height:0;box-shadow:none;border-width:2px}.card-select{flex:1;min-height:0;padding:5px;gap:2px;justify-content:center;position:relative}.card-select strong{font-size:13px;line-height:1.35;text-wrap:wrap;word-break:normal;overflow-wrap:anywhere}.card-top{position:absolute;top:3px;right:3px;width:auto;font-size:9px}.card-top>span:first-child{display:none}.selection-check{font-size:0}.selection-check:after{content:'✓';font-size:11px}.card-bottom{display:none}.wild-card .card-bottom{display:block;font-size:9px}.card-detail{flex:none;min-height:28px;height:28px;padding:4px 1px;font-size:10px}.selected .card-select{padding:5px}
  .hint-controls .mobile-only{display:block}.hint-controls{display:grid;grid-template-columns:1fr 1.2fr .65fr;gap:5px}.hint-controls button{min-height:44px;font-size:11px;padding:7px 4px}.has-candidate .statement,.has-candidate .detail-label,.has-candidate .hint-extra,.has-candidate .hint-help{display:none}.game-layout>.side{margin-top:10px}.side>#back-to-cards{display:block;margin-left:auto;min-height:44px;font-size:12px}.hint-panel{position:static;min-height:0}.sidebar-note{display:none}
  .game-screen>.hand-footer{position:static;flex:none;z-index:auto;flex-direction:column;align-items:stretch;margin:5px 0 0;padding:4px 7px max(7px,env(safe-area-inset-bottom));gap:4px;border-radius:10px 10px 0 0;box-shadow:none}.selection-row{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:28px}.hand-footer .selection-summary{font-size:10px;line-height:1.3;max-width:none;overflow-wrap:anywhere}.selection-row .mobile-only{display:block;flex:none;font-size:11px;min-height:28px;padding:3px 4px}.hand-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hand-actions button{min-height:44px;padding:7px 5px;font-size:12px}.game-screen>.footer-note{display:none}
  .draw-zone{flex:1;display:flex;flex-direction:column;justify-content:center;margin-top:10px;padding:8px}.draw-zone h3{font-size:12px;margin-bottom:12px}.draw-card{width:44px;height:62px}.discard-area{margin:12px 0}
  .modal-close{height:44px;width:44px}.modal-body .check-control{min-height:44px}
}
@media(max-width:760px) and (max-height:700px){
  .turn-banner p{display:none}.card-select strong{font-size:12px;line-height:1.25}.hand-heading small{font-size:8px}.table .avatar{display:none}.game-meta small{font-size:9px}
}
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape){
  .game-shell .topbar{min-height:44px}.game-meta{position:absolute;top:0;left:220px;right:150px;height:44px;min-height:44px}.game-meta h1{font-size:11px}.game-meta small{font-size:9px}.game-meta .hint-switches{gap:0}.hint-switches .text-button{font-size:10px}
  .game-layout>.table{display:grid;grid-template-columns:170px minmax(0,1fr);grid-template-rows:auto auto auto 1fr;column-gap:14px;padding:7px}.opponents{grid-column:1;grid-row:1;gap:4px}.opponent{padding:4px}.avatar{display:none}.opponent-head{flex-wrap:wrap}.turn-banner{grid-column:1;grid-row:2;padding:4px 0}.turn-banner p{display:none}.relations-title{grid-column:1;grid-row:3;margin:3px 0 8px}.relations{grid-column:1;grid-row:4;align-self:start;gap:5px}.relation strong{font-size:12px}.relation small{font-size:8px}.hand-section{grid-column:2;grid-row:1 / 5;margin:0;align-self:stretch}.hand-heading{margin-bottom:8px}.hand-heading small{font-size:8px}.hand{gap:7px}.card-select strong{font-size:12px;line-height:1.25}.draw-zone{grid-column:2;grid-row:1 / 5;margin:0}
  .game-screen>.hand-footer{flex-direction:row;align-items:center;padding:4px 7px max(5px,env(safe-area-inset-bottom))}.selection-row{flex:1}.hand-actions{width:290px;flex:none}.hand-footer .selection-summary{font-size:9px}.selection-row .mobile-only{min-height:44px}
}

@media(max-width:760px) and (max-height:600px) and (orientation:portrait){.relations-title{display:none}.relations{margin-top:7px}}

@media(max-width:340px) and (max-height:600px){.card-select,.selected .card-select{padding:3px}.card-select strong{font-size:11.5px;line-height:1.15}}

/* v1.5 qualification-specific Level 1 and forthcoming one-time products. */
.level-options{grid-template-columns:repeat(3,minmax(0,1fr))}.course-label{color:var(--green);font-weight:750;font-size:16px;margin:20px 0 12px}.bundle-notice{font-size:13px;line-height:1.8;margin-top:12px;padding:12px;border-radius:9px;background:#e9efe8}.bundle-notice small{font-size:11px;color:var(--muted)}.course-portal{max-width:620px;margin:auto;padding:60px 24px}.course-portal h1{font-size:27px;margin:24px 0 16px}.course-portal p{line-height:1.9;color:var(--muted)}.portal-link{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);border-radius:14px;padding:24px;margin-top:20px;background:white;color:var(--ink);text-decoration:none}.portal-link span{font-size:13px;color:var(--green)}
@media(max-width:760px){.brand{min-width:0}.brand>div{font-size:12px}.brand small{font-size:7px}.game-shell .brand>div{font-size:10px}.game-shell .brand small{font-size:6px}}

/* Guest checkout remains separate from the play layout. */
.purchase-panel{padding:18px;margin:20px 0;border:1px solid #a8c4b6;border-radius:12px;background:#f3f8f2}.sandbox-label{font-size:12px;font-weight:700;color:#835614;background:#fff2cb;padding:9px;border-radius:7px}.purchase-panel p{line-height:1.8}.purchase-panel button{margin:5px 6px 5px 0}.purchase-panel select,.recovery-code{display:block;max-width:100%;width:100%;box-sizing:border-box;min-height:44px;border:1px solid #b7c7c0;border-radius:6px;background:white;padding:10px;font-size:14px}.recovery-code{font-family:monospace;margin:10px 0}.recovery-confirm{display:flex;align-items:center;gap:8px;margin:18px 0;min-height:44px}.purchase-panel select{white-space:normal}

/* No.21–24: fresh selections, country flags and a visible mobile start action. */
.avatar.country-flag{display:inline-flex;align-items:center;justify-content:center;background:transparent;border-radius:0;font-size:23px;width:30px;height:28px;line-height:1;flex:none}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
 .home-shell{padding-bottom:calc(105px + env(safe-area-inset-bottom))}
 .home-shell .home-start{position:fixed;left:0;right:0;bottom:0;z-index:15;margin:0;padding:9px max(12px,env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;align-items:center;gap:8px;background:#f5f4eff5;border-top:1px solid #cad7d0;box-shadow:0 -4px 18px #18394a12}
 .home-shell .home-start .primary{flex:1;min-width:0;min-height:48px;padding:10px 8px;font-size:15px}
 .home-shell .home-start .note{flex:none;font-size:10px;line-height:1.6}
 .home-shell .hero h1{font-size:25px}.home-shell .level-section{margin:12px 0}.home-shell .level-option{min-height:56px;padding:7px 3px}.home-shell .level-option span{margin-top:3px}
 .avatar.country-flag{display:inline-flex;font-size:18px;width:22px;height:22px}
}
@media(max-width:360px){.home-shell .home-start .primary{font-size:13px}.home-shell .home-start .note{font-size:9px}}

@media(max-width:760px) and (max-height:700px),(max-width:1000px) and (max-height:500px){.opponent-head .country-name{display:none}.avatar.country-flag{width:19px;height:19px;font-size:17px}}

/* Keep the start/result headers below native notches and status bars. */
.shell:not(.game-shell){padding-top:env(safe-area-inset-top)}

/* Independent relationship practice; shared by browser and native WebViews. */
.quiz-entry{margin:12px 0;padding:12px 16px;border:1px solid #aac5b8;border-radius:14px;background:#eff6f0;width:100%;text-align:left;color:var(--ink);font:inherit;cursor:pointer}
.quiz-entry strong,.quiz-entry small{display:block}.quiz-entry small{font-size:12px;color:var(--muted);margin-top:3px}
.quiz-wrap{max-width:720px;margin:auto;padding:28px 0 40px}.quiz-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.quiz-title h1{font-size:28px;margin:6px 0 16px}.quiz-preview-label{background:#fff4d9;border-radius:10px;padding:10px 14px;font-size:13px;color:#70541d}
.quiz-card{margin:18px 0;padding:30px;border:1px solid #d6e0df;border-radius:22px;background:#fff;box-shadow:0 8px 28px #18304408}.quiz-card h2{font-size:19px;line-height:1.7;margin:16px 0}.quiz-card h2:focus{outline:none}.quiz-progress{display:flex;align-items:center;gap:18px;font-size:14px;margin-top:24px}.quiz-progress progress{flex:1;min-width:40px;height:8px;accent-color:#147854}
.quiz-stem{font-size:24px;font-weight:700;line-height:1.9;overflow-wrap:anywhere;margin:24px 0}.quiz-blank{display:inline-block;border-bottom:3px solid #26866b;color:#147854;background:#edf6f0;padding:0 7px;border-radius:5px 5px 0 0}
#quiz-form label{display:block;font-weight:700;margin-bottom:10px}#quiz-form label small{display:block;font-weight:400;color:var(--muted);font-size:12px;margin-top:5px}#quiz-answer{box-sizing:border-box;width:100%;min-height:52px;border:2px solid #a4b9b7;border-radius:10px;padding:12px;font:inherit;font-size:18px;color:var(--ink);background:#fff}#quiz-answer:focus{outline:3px solid #d4eae0;border-color:#147854}.quiz-card .primary{min-height:48px}#quiz-check,#quiz-next{width:100%;margin-top:14px}
.quiz-support{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px}.quiz-support button{min-height:44px}.quiz-hint{background:#eff6f0;border-left:4px solid #147854;border-radius:8px;padding:14px;margin-top:18px}.quiz-hint p{margin:6px 0}.quiz-feedback{border-top:1px solid #d6e0df;padding-top:12px}.quiz-feedback h3{font-size:20px;color:#147854}.quiz-feedback p{line-height:1.8}.quiz-complete{background:#f2f5f6;padding:14px;border-radius:10px}.quiz-source-pair{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:16px 0}.quiz-source-pair span:not([aria-hidden]){border:1px solid #c8d7da;border-radius:10px;padding:10px 12px;font-weight:700}.quiz-card details{margin:16px 0;line-height:1.8}.quiz-card summary{cursor:pointer;font-weight:700;min-height:44px;padding-top:8px}.quiz-empty{text-align:center}.quiz-symbol{font-size:36px;color:#147854}.quiz-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0}.quiz-stats div{background:#f0f5f1;border-radius:12px;text-align:center;padding:14px 4px}.quiz-stats strong{display:block;font-size:32px}.quiz-stats span{font-size:12px}.quiz-result-list{padding:0;list-style:none}.quiz-result-list li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;border-bottom:1px solid #e3e9e6;padding:12px 0}.quiz-result-list span{color:var(--muted);font-size:13px}.quiz-actions{display:grid;gap:12px;margin-top:24px}
@media(max-width:760px){.quiz-wrap{padding:14px 0 32px}.quiz-title h1{font-size:23px}.quiz-card{padding:20px 16px;margin:14px 0;border-radius:16px}.quiz-stem{font-size:21px;line-height:1.8}.quiz-card h2{font-size:16px}.quiz-preview-label{font-size:12px}.quiz-entry{padding:10px 12px}.quiz-shell .brand{white-space:normal}.quiz-shell .topbar .prototype{display:none}}

.quiz-context{background:#edf3f8;border-left:3px solid #376983;padding:12px 16px;margin:16px 0}.quiz-context p{margin:6px 0;line-height:1.7}.quiz-learning-label{font-size:13px;color:#496a5d}.quiz-explanation{border-top:1px solid #dce5e3;margin-top:18px;padding-top:4px}.quiz-explanation p{line-height:1.8;overflow-wrap:anywhere}.quiz-card select{display:block;width:100%;min-height:48px;padding:10px;margin:12px 0 20px;border:1px solid #b8cccf;border-radius:10px;background:white;font:inherit;color:inherit}.quiz-entry:disabled{opacity:.6;cursor:not-allowed}.quiz-support{flex-wrap:wrap}.quiz-support button{white-space:normal}

/* Shared card library and optional language examples, for every course. */
.card-library{max-width:1050px;margin:35px auto}.card-library>label{display:block;font-size:13px;margin:16px 0 8px}.card-library>input{font:inherit;padding:12px;border:1px solid #cbd7cf;border-radius:8px;width:min(100%,420px);margin-bottom:10px}.card-library-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:22px 0}.library-card{background:#fff;border:1px solid #d3ddd5;border-radius:12px;padding:20px;min-width:0}.library-card h2{font-size:19px;line-height:1.6;overflow-wrap:anywhere;margin:10px 0}.library-card p{font-size:13px;line-height:1.9;margin-bottom:16px}.library-card button{font-size:13px;min-height:44px}.example-detail{padding:12px 0;border-top:1px solid #e5ebe7}.example-detail p{margin:5px 0}.example-detail [lang=en],.relation-expression{font-size:16px;font-weight:600;line-height:1.8;overflow-wrap:anywhere}.quiz-history{margin:20px 0}.quiz-history summary{cursor:pointer;min-height:44px;line-height:2}.quiz-history .quiz-actions{flex-wrap:wrap}.quiz-result-list .text-button{font-size:12px;min-height:44px}.quiz-stem[lang=en]{overflow-wrap:anywhere}.hint-controls{flex-wrap:wrap}
@media(max-width:760px){.card-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.library-card{padding:14px}.library-card h2{font-size:16px}.library-card .secondary{width:100%;padding:10px 4px}}

/* v1.11 / management No.25–35: learning first, calm promotions, visible guidance. */
.level-option strong{font-size:13px;line-height:1.6}.level-description{line-height:1.6}.level-option{padding:10px 8px;text-align:left}.bundle-notice{background:transparent;padding:0;border:0;margin-top:8px;font-size:12px}.bundle-notice summary{cursor:pointer;min-height:36px;padding:8px 0;color:var(--muted)}.bundle-notice p{margin:5px 0}.quiz-feature{border-left:4px solid var(--green);background:#eef5ed;padding:16px 18px;border-radius:0 12px 12px 0;margin:12px 0 20px}.feature-kicker{font-size:11px;color:var(--green);font-weight:700}.quiz-feature h2{font-size:22px;line-height:1.5;margin:4px 0}.quiz-feature>p{font-size:13px;line-height:1.75;color:#405d62}.quiz-feature .quiz-entry{background:white;border:1px solid #71a58c;margin:12px 0 0}.turn-banner.human{background:#dcefe4;border:2px solid #227b56;border-radius:10px;margin:6px 0;padding:10px}.turn-banner.human strong{font-size:19px;font-weight:800;color:#124f35}.turn-banner.opponent-turn{background:#f8faf7;border-top:1px solid #b5c9b8;border-radius:8px;margin:6px 0}.turn-banner.opponent-turn strong{color:#294858;font-weight:700}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
 .level-options{grid-template-columns:repeat(2,minmax(0,1fr))}.home-shell .level-option{min-height:74px;padding:7px 9px}.level-option strong{font-size:12px}.level-description{font-size:10px;line-height:1.5}.quiz-feature{padding:12px 14px;margin:10px 0 16px}.quiz-feature h2{font-size:20px}.quiz-feature>p{font-size:12px}.quiz-feature .quiz-entry{min-height:56px}.turn-banner.human{padding:5px 2px;margin:3px 0}.turn-banner.human strong{font-size:15px}.turn-banner.opponent-turn{margin:3px 0}.turn-banner.opponent-turn strong{font-size:13px}
 .hint-compact.mobile-only{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:44px;border-left:3px solid var(--tone,#167453);padding:0 6px;background:var(--tint,#edf5ee);border-radius:5px}.hint-compact-text{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.35;font-size:11px;overflow-wrap:anywhere}.hint-compact-text>strong{font-size:10px;color:var(--tone,#167453)}.hint-compact button{flex:none;font-size:11px;min-height:44px;padding:5px 9px}.selection-row #hint-jump{min-height:28px}.game-screen>.hand-footer{gap:3px}
}
@media(max-width:1000px) and (max-height:500px) and (orientation:landscape){.game-screen>.hand-footer{flex-wrap:wrap}.hint-compact.mobile-only{flex:1 0 100%;min-height:32px}.hint-compact-text{flex-direction:row;gap:6px}.hint-compact button{min-height:32px}.turn-banner.human strong{font-size:13px}}
/* Reflow fallback: never hide text merely to meet a one-screen target. */
@media(max-width:760px) and (min-resolution:1dppx){.game-layout.large-text>.table{min-height:580px;height:auto}.game-layout.large-text .hand{grid-auto-rows:minmax(110px,auto);grid-template-rows:none;max-height:none}.game-layout.large-text .card-select strong{font-size:1rem!important}.game-layout.large-text .hand-section{flex:auto}}

/* No.20: retain readable labels while reserving space for 7–8 cards. */
@media(max-width:760px) and (max-height:700px) and (orientation:portrait){
 .turn-banner.human{padding:3px 2px;margin:2px 0}.turn-banner.human strong{line-height:1.3}
 .game-screen>.hand-footer{padding-top:3px;gap:2px}.hint-compact-text{flex-direction:row;align-items:center;gap:5px}
 .hint-compact-text>span{font-size:10px}.hint-compact.mobile-only{min-height:36px}.hint-compact button{min-height:36px}
 .hand-heading{margin-bottom:6px}.hand{gap:7px}
}

/* Start with the card game; the quiz is a secondary activity below its introduction. */
.babanuki-home .home-grid{align-items:start;padding-top:24px;min-height:0}
.babanuki-home .hero h1{font-size:clamp(28px,3vw,38px);line-height:1.35;margin:8px 0 12px}
.babanuki-home .goal-box{margin:12px 0 8px;padding:10px 14px;line-height:1.6}
.babanuki-home .goal-box p{font-size:14px}.babanuki-home .goal-box p br{display:none}
.babanuki-home .goal-box strong{font-size:15px}
.babanuki-home .mode-options{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;gap:8px}
.babanuki-home .mode-option{min-width:0;min-height:48px;padding:10px 8px;gap:6px}
.babanuki-home .mode-option strong{font-size:13px;white-space:nowrap}
.babanuki-home .mode-option input{width:16px;height:16px;margin:0}
.babanuki-home .home-start{margin-top:12px;gap:12px}
.babanuki-home .home-start .primary{min-width:0;flex:1}
.babanuki-home .quiz-feature{margin:20px 0;background:#f0f3ed;border-left-color:#a5bcae}
.babanuki-home .quiz-feature h2{font-size:20px}
.babanuki-home .quiz-feature .quiz-entry{max-width:460px}
@media(max-width:1000px) and (min-width:761px){
 .babanuki-home .home-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px}
 .babanuki-home .home-start .note{font-size:10px}
}
@media(max-width:760px),(max-width:1000px) and (max-height:500px){
 .babanuki-home .home-grid{padding-top:14px;grid-template-columns:minmax(0,1fr)}
 .babanuki-home .hero h1{font-size:25px}
 .babanuki-home .home-start{margin:0;gap:8px}
}
@media(max-width:360px){.babanuki-home .mode-options{gap:6px}.babanuki-home .mode-option{padding:10px 6px;gap:4px}.babanuki-home .mode-option strong{font-size:12px}}

/* Shared question format: text or image choices, independent of course / OS. */
.quiz-choices{border:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quiz-choices legend{margin-bottom:8px}.quiz-choice{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px solid #bdcdd2;border-radius:12px;padding:12px;min-height:48px;cursor:pointer}.quiz-choice img{width:100%;height:100px;object-fit:contain}.quiz-choice input{width:20px!important;height:20px}.quiz-choice:has(input:checked){outline:2px solid #157f65;background:#edf7f1}.quiz-choice span{overflow-wrap:anywhere}