:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#20231f;background:#f5f2ea}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button{font:inherit;cursor:pointer}.app{min-height:100vh;padding-bottom:82px}header{height:72px;background:#fffaf1;border-bottom:1px solid #e4ddcf;display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100vw - 1180px)/2));position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px}.brandmark{width:42px;height:42px;border-radius:12px;background:#20231f;color:#fff;display:grid;place-items:center;font-size:24px}.brand div{display:flex;flex-direction:column}.brand small{color:#777}.icon{border:0;background:transparent;padding:10px}.home,.lesson,.game-layout{max-width:1180px;margin:0 auto;padding:28px 20px}.hero{background:#e8dcc2;border-radius:28px;padding:34px;display:flex;justify-content:space-between;align-items:center;gap:24px}.hero h1{font-size:clamp(34px,5vw,62px);line-height:1.02;margin:10px 0 16px;letter-spacing:-2px}.hero p{font-size:18px;max-width:620px;color:#555}.eyebrow{font-size:12px;font-weight:800;letter-spacing:1.5px;color:#6a5d46}.primary{background:#20231f;color:#fff;border:0;border-radius:14px;padding:15px 20px;font-weight:700;min-height:48px}.mini-board{width:220px;aspect-ratio:1;background:#d6ad67;border-radius:16px;display:grid;grid-template-columns:repeat(5,1fr);padding:22px;box-shadow:0 18px 40px #745d3630}.mini-board i{border-right:1px solid #5a472c;border-bottom:1px solid #5a472c}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.card{border:1px solid #e2ddd2;background:white;border-radius:20px;padding:22px;text-align:left;display:flex;gap:15px;min-height:105px;align-items:flex-start}.card b,.card span{display:block}.card span{color:#777;margin-top:6px}.lesson{max-width:800px}.lesson h1{font-size:44px;margin:8px 0}.lesson p{font-size:20px;line-height:1.6}.lesson-box{background:#fff;border:1px solid #e2ddd2;border-radius:20px;padding:24px;margin-top:25px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}.board-card,.tutor{background:#fff;border:1px solid #e2ddd2;border-radius:22px;padding:18px}.game-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;color:#666}.turn-dot{display:inline-block;width:16px;height:16px;border-radius:50%;vertical-align:-2px;margin-right:8px;border:1px solid #333}.turn-dot.black{background:#161616}.turn-dot.white{background:#fff}.board-wrap{display:grid;place-items:center;overflow:auto;padding:12px}.board{width:min(76vh,100%,680px);aspect-ratio:1;background:#d9ad63;border:2px solid #8b672e;border-radius:7px;padding:5.4%;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);box-shadow:inset 0 0 20px #855c1f22}.intersection{position:relative;border:0;background:transparent;padding:0;min-width:0;min-height:0}.hline,.vline{position:absolute;background:#574321;pointer-events:none}.hline{height:1px;left:-50%;right:-50%;top:50%}.vline{width:1px;top:-50%;bottom:-50%;left:50%}.intersection:nth-child(9n+1) .hline{left:50%}.intersection:nth-child(9n) .hline{right:50%}.intersection:nth-child(-n+9) .vline{top:50%}.intersection:nth-last-child(-n+9) .vline{bottom:50%}.stone{position:absolute;width:82%;height:82%;border-radius:50%;left:9%;top:9%;z-index:2;box-shadow:inset -4px -5px 8px #0003,0 2px 3px #0004}.stone.black{background:#161616}.stone.white{background:#f5f2e9;border:1px solid #999}.last-dot{position:absolute;width:12%;height:12%;border-radius:50%;background:#d14d37;left:44%;top:44%;z-index:3}.game-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.game-actions button,.secondary{min-height:48px;border:1px solid #d7d0c2;background:#fff;border-radius:13px;display:flex;align-items:center;justify-content:center;gap:7px}.tutor{position:sticky;top:92px}.tutor-head{display:flex;gap:10px;align-items:center}.tutor-head div:nth-child(2){display:flex;flex-direction:column}.tutor-head small{color:#777}.avatar{width:42px;height:42px;border-radius:50%;background:#20231f;color:#fff;display:grid;place-items:center;font-weight:800}.speech{background:#f5f2ea;border-radius:16px;padding:16px;margin:18px 0;line-height:1.45;min-height:90px}.secondary{width:100%;margin-top:10px;font-weight:650}.status{margin-top:20px;border-top:1px solid #eee;padding-top:15px;display:flex;flex-direction:column;gap:7px;color:#555}.status b{color:#222;margin-bottom:5px}nav{position:fixed;bottom:0;left:0;right:0;background:#fffaf7e8;backdrop-filter:blur(14px);border-top:1px solid #ded8cc;display:flex;justify-content:center;z-index:40;padding-bottom:env(safe-area-inset-bottom)}nav button{width:min(150px,20%);height:70px;border:0;background:transparent;color:#777;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:12px}nav button.active{color:#111;font-weight:800}nav button:disabled,.card:disabled{opacity:.45;cursor:default}@media(max-width:850px){.mini-board{display:none}.cards{grid-template-columns:1fr}.game-layout{grid-template-columns:1fr}.tutor{position:static}.board{width:min(92vw,680px)}.hero{padding:26px}.hero h1{letter-spacing:-1px}.game-layout{padding:14px 10px}.board-card{padding:10px}.tutor{margin-bottom:15px}}@media(max-width:480px){header{height:60px;padding:0 12px}.brand small{display:none}.home,.lesson{padding:18px 12px}.hero{border-radius:18px}.hero h1{font-size:36px}.game-actions button{font-size:13px}}
