*{box-sizing:border-box}html{font-family:ui-rounded,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:#f6f0e1;color:#5c5c4a}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button,select{font:inherit;min-height:44px;padding:8px 12px;border:1px solid #dfd9c4;border-radius:11px;background:#fffaf0;color:inherit;cursor:pointer;touch-action:manipulation}button:active{transform:translateY(1px)}button:focus-visible,select:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #b99a69;outline-offset:3px}button:disabled{opacity:.4}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}.app{max-width:1060px;margin:auto;padding:22px 30px}header{display:flex;align-items:center;justify-content:space-between;font-size:12px}header span{font-size:8px;letter-spacing:1.7px;color:#a7a58c}header button{font-size:11px;min-height:36px;padding:6px 10px}.title{display:flex;align-items:center;justify-content:space-between;margin:28px 0 20px}.title p{font-size:10px;letter-spacing:3px;color:#a9a78b;margin:0 0 8px}h1{font-size:42px;letter-spacing:-2px;line-height:1.2;margin:0}h1 span{color:#a88d5c}h1 i{font-size:38px;color:#c0b082;font-style:normal;margin-left:12px}.record{display:grid;font-size:10px;color:#aaa78d;gap:4px;text-align:right}.record b{font-size:18px;color:#8a977a}main{display:grid;grid-template-columns:minmax(0,560px) minmax(240px,1fr);gap:38px}.play{min-width:0}.hud{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;background:#fffaeb;border:1px solid #e4ddc7;border-bottom:0;border-radius:15px 15px 0 0;font-size:10px;color:#92977c}.hud span{display:flex;align-items:center;gap:6px}.black-dot,.white-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#626b5b}.white-dot{background:#fbf6e7;border:1px solid #b7baa0}.board-wrap{background:#e6d4ae;border-radius:0 0 15px 15px;overflow:hidden;box-shadow:0 13px 30px #8c785614;display:flex;justify-content:center}canvas{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;touch-action:none;cursor:crosshair}.status-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:55px;font-size:11px;color:#939d7e}.status-row button{font-size:11px;flex-shrink:0}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#ad9a72}aside h2{font-size:29px;line-height:1.45;letter-spacing:-1px;margin:14px 0 17px}.tea-art{position:relative;height:85px;margin:7px 0 20px}.tea-art i{display:block;position:absolute;left:40px;top:35px;width:76px;height:36px;border-radius:5px 5px 35px 35px;background:#b1bd95}.tea-art b{position:absolute;left:105px;top:39px;width:23px;height:23px;border:6px solid #b1bd95;border-radius:50%}.tea-art span{position:absolute;left:61px;top:0;color:#b8b99c;font-size:33px}.actions{display:grid;gap:10px}.actions label{font-size:10px;color:#a1a88a;display:grid;gap:6px}.actions select{width:100%;font-size:12px}#new-game{background:#a0b18b;border-color:#92a47e;color:white;font-size:12px}.rules{font-size:11px;line-height:1.8;color:#9da486}.rules p{margin:9px 0}.rules b{color:#b19b70;margin-right:5px}.hint,.last-move{font-size:10px;line-height:1.8;color:#a6ac8c}.last-move{border-top:1px solid #e4e3d0;padding-top:10px}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:#5f655078;backdrop-filter:blur(7px);overflow:auto}.overlay[hidden]{display:none}.modal{width:min(440px,100%);max-height:calc(100dvh - 36px);overflow:auto;background:#fffbed;border:1px solid #fff;border-radius:23px;padding:27px;text-align:center;box-shadow:0 20px 80px #4e563432}.stone-art{height:47px;display:flex;align-items:center;justify-content:center;gap:9px}.stone-art i{width:30px;height:30px;border-radius:50%;background:#65715b;box-shadow:0 3px 2px #7a775423}.stone-art i:nth-child(2){background:#f1eed8;border:1px solid #c6c6a7;transform:translateY(-9px)}.modal h2{font-size:29px;line-height:1.35;margin:13px 0}.modal h2 em{font-style:normal;color:#a99766}.modal p:not(.eyebrow){font-size:12px;line-height:1.9;color:#9ca484}.modal #primary{display:block;width:100%;min-height:48px;background:#98ad83;color:white;border:0;font-weight:700;margin:18px 0 7px}.modal a{display:block;padding:10px;font-size:11px;color:#a9b091}.result-detail{font-size:12px;color:#929e78;line-height:1.8;padding:7px 0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:800px){.app{max-width:560px;padding:10px 14px}header span{display:none}.title{margin:13px 0 12px}.title p{font-size:8px}h1{font-size:30px}.record b{font-size:13px}main{display:flex;flex-direction:column;gap:0}.intro,.rules,.hint,.last-move{display:none}.hud{padding:8px 11px;font-size:9px}.status-row{min-height:49px}.actions{display:flex;align-items:flex-end;gap:9px}.actions label{flex:1;font-size:9px;gap:3px}.actions select{min-height:44px;font-size:11px}.actions button{flex:1;min-height:44px}.board-wrap canvas{max-height:calc(100dvh - 295px)}}@media(max-width:800px) and (max-height:650px) and (orientation:portrait){.app{padding:6px 10px}.title{margin:6px 0}.title p{display:none}h1{font-size:23px}h1 i{font-size:21px}.record{font-size:9px;gap:2px}.record b{font-size:11px}.hud{padding:6px 9px}.board-wrap canvas{max-height:calc(100dvh - 240px)}.modal{padding:18px}.modal h2{font-size:24px;margin:10px 0}.modal p:not(.eyebrow){font-size:11px;line-height:1.7}.stone-art{height:34px}.modal #primary{margin-top:10px}}@media(orientation:landscape) and (max-height:540px){.app{padding:6px 14px;max-width:1000px}header{height:34px}header span{display:none}.title{position:absolute;left:50%;top:12px;transform:translateX(-50%);margin:0;pointer-events:none}.title p,.record,h1 i{display:none}h1{font-size:20px;letter-spacing:0}main{display:grid;grid-template-columns:minmax(0,1fr) 225px;gap:20px;margin-top:4px}.hud{padding:5px 11px;font-size:9px}.board-wrap canvas{height:calc(100dvh - 126px);max-height:none;width:100%;aspect-ratio:auto}.status-row{min-height:44px;font-size:10px}.intro,.rules,.hint,.last-move{display:none}.actions{display:grid;gap:12px}.actions label{font-size:10px;gap:5px}.modal{padding:16px 24px;max-width:510px}.stone-art{display:none}.modal h2{font-size:21px;margin:6px 0}.modal p:not(.eyebrow){font-size:11px;line-height:1.5}.modal #primary{margin:9px 0 3px}.modal .eyebrow{margin:4px 0}}

.modal #review{width:100%;font-size:12px;margin-bottom:5px}