:root{color-scheme:light;font-family:'Nunito',system-ui,sans-serif;color:#2b3e35;background:#e9e5d7;font-size:16px;--ink:#2b3e35;--green:#386456;--paper:#faf7ec;--line:#aeb9a5}*{box-sizing:border-box}[hidden]{display:none!important}body{overflow-wrap:anywhere;margin:0;background:radial-gradient(ellipse at 20% 0,#f8f3e6 0,transparent 60%),#e5e8dc}button,select{font:inherit;min-height:44px;border:1px solid #728d77;border-radius:11px;color:var(--ink);background:#f9f5e8;padding:.55rem .9rem;cursor:pointer;line-height:1.25;overflow-wrap:anywhere}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #b36332;outline-offset:3px}button:hover:not(:disabled){background:#e3ecda}button:disabled{opacity:.56;cursor:default}.primary{background:var(--green);color:#fff7df;border-color:var(--green)}button.selected{box-shadow:inset 0 0 0 2px #386456;background:#dcebd5}.primary:hover:not(:disabled){background:#294e43}p{line-height:1.55;margin:.65rem 0}h1,h2,h3{font-family:'Baloo 2','Nunito',system-ui,sans-serif;line-height:1.18;margin:.4rem 0 .9rem;overflow-wrap:anywhere}h1{font-size:2rem}h2{font-size:1.4rem}h3{font-size:1.15rem}#app{width:100%;min-height:100svh;padding:10px max(10px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}#panel{max-width:960px;margin:auto}#panel-card{border:1px solid #b0b9a3;border-radius:22px;background:var(--paper);padding:clamp(14px,3vw,30px);box-shadow:0 12px 35px #26382d18}#panel-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:1.2rem}#panel-actions>button{flex:1 1 190px}.hero{display:block;width:100%;max-height:380px;object-fit:contain;border-radius:13px;background:#ece1c6}.tagline{font-size:1.15rem;font-weight:800;color:var(--green)}.muted{color:#56644f}.badge{background:#e5ebdc;border-radius:9px;padding:.6rem .8rem}.stats{display:flex;flex-wrap:wrap;gap:8px}.stats span{min-width:0;max-width:100%;overflow-wrap:anywhere;border:1px solid var(--line);border-radius:9px;padding:.5rem .8rem}.warning{padding:.7rem;border-left:4px solid #a86b2e;background:#f8edcf}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:13px;margin:1rem 0}.card{border:1px solid var(--line);border-radius:13px;padding:14px;background:#f3f3e6}.card button{width:100%;margin-top:5px}.card img{display:block;width:100%;max-height:170px;object-fit:contain}.frame-swatch{height:64px;border:8px solid var(--green);border-radius:8px;background:#ead1a6}.setting{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:10px 0;padding:8px 0;border-bottom:1px solid #d6ddca}.setting select{max-width:100%;min-width:150px}.setting button{min-width:80px}.mugi{display:block;width:160px;height:160px;flex:none}.mugi.large{margin:auto;width:200px;height:180px}#game-view{max-width:760px;margin:0 auto}#game-header{display:flex;align-items:center;justify-content:space-between;gap:8px;max-width:100%}#game-header>div{min-width:0}#game-title{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#turn{font-size:.86rem;margin:3px 0;line-height:1.3}#pause-game{width:46px;min-width:46px;padding:4px}#board-scroll{max-width:100%;max-height:none;overflow:auto;overscroll-behavior:contain;border:5px solid #8c7751;border-radius:8px;background:#dec494;scrollbar-gutter:stable}#board{display:block;width:100%;aspect-ratio:11/12;touch-action:none;outline-offset:-4px}#board.large{width:max(100%,396px)}#board.pan{touch-action:pan-x pan-y}.hand{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin:5px 0;min-height:34px}.hand .hand-label{font-size:.75rem;color:#435a46;flex:0 0 100%}.hand button{min-width:44px;flex:1 0 44px;min-height:44px;padding:4px 6px;border-radius:7px;font-size:.86rem;white-space:nowrap}.hand .hand-static{font-size:.75rem;background:#e3e7d7;border-radius:5px;padding:4px 7px}#selection{font-size:.83rem;line-height:1.35;min-height:1.35em;margin:5px 0}#confirm,#board-actions{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}#confirm>button{flex:1 1 100px}#board-actions>button{flex:1 1 85px;font-size:.83rem;padding:6px}#salon{display:flex;align-items:center;justify-content:center;gap:8px;color:#58644b;font-size:.83rem;line-height:1.4}#salon .mugi{width:105px;height:105px}#salon-caption{max-width:310px}#notice{position:fixed;z-index:10;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(90vw,700px);padding:12px 18px;background:#293f34;color:#fff9e6;border-radius:12px;box-shadow:0 3px 12px #0003;pointer-events:none}#game-hint,#guide-body{border-left:3px solid #688d6b;padding-left:10px;font-size:.88rem}.piece-list{display:flex;gap:5px;flex-wrap:wrap}.piece-list button{min-width:44px}.move-list{max-height:330px;overflow:auto;padding:1rem 1rem 1rem 2rem}.move-list li{margin:.45rem 0;line-height:1.4}.less-motion *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
@media(min-width:700px){#game-view{position:relative;max-width:600px}#board-scroll{max-width:510px;margin:auto}#game-header,.hand,#selection,#confirm,#board-actions{max-width:510px;margin-left:auto;margin-right:auto}}@media(max-height:650px) and (min-width:600px){#game-view{max-width:980px;display:grid;grid-template-columns:minmax(250px,48%) minmax(220px,1fr);gap:6px 16px;align-items:start}#game-header{grid-column:2;grid-row:1;max-width:none;margin:0}#board-scroll{grid-column:1;grid-row:1/9;width:min(100%,calc((100svh - 45px)*11/12));max-width:none;max-height:calc(100svh - 30px);margin:0 auto}#opponent-hand{grid-column:2;grid-row:2}#own-hand{grid-column:2;grid-row:3}#selection{grid-column:2;grid-row:4}#confirm{grid-column:2;grid-row:5}#board-actions{grid-column:2;grid-row:6}#salon{grid-column:2;grid-row:7}#guide-body,#game-hint{grid-column:1/3}#salon .mugi{width:70px;height:70px}.hand{margin:0;max-width:none}.hand button{min-height:44px}.large-text #salon{display:none}.large-text #board-scroll{max-height:calc(100svh - 30px)}.large-text #game-view{align-content:start}}@media(max-width:360px){#app{padding-left:6px;padding-right:6px}#panel-card{padding:13px}.hand button{padding:4px;flex-basis:34px}#board-actions>button{flex-basis:70px}h1{font-size:1.7rem}}