:root{--ink:#343a2f;--muted:#818779;--green:#335445;--paper:#f5f3eb;--line:#dedfd2}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:14px}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.65}button,input,a,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #bd8f47;outline-offset:4px}main{max-width:1220px;margin:auto;padding:0 40px}header{height:104px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{color:var(--ink);text-decoration:none;display:flex;gap:12px;align-items:center;font-size:23px;font-weight:750;letter-spacing:4px}.brand-icon{font-size:43px;color:#53694f}.brand small{display:block;font-size:8px;letter-spacing:3.2px;margin-top:3px;color:#858d79}.header-note{font-size:9px;letter-spacing:2px;color:#89907e}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:650;color:#838d75}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400}h1{font-size:55px;line-height:1.08;letter-spacing:-1.8px;margin:13px 0 12px}h2{font-size:27px;line-height:1.22;margin:14px 0 12px}p{line-height:1.7}.primary{display:flex;justify-content:space-between;align-items:center;gap:18px;border:1px solid #244332;background:linear-gradient(#40634f,#2d4b3d);color:#fff;border-radius:8px;padding:15px 19px;font-size:13px;font-weight:600;box-shadow:inset 0 1px 0 #ffffff17,0 2px 3px #263b2310}.primary:hover:not(:disabled){background:linear-gradient(#355943,#243f31)}.secondary{border:1px solid #bec8b4;border-radius:8px;background:transparent;color:#486044;padding:12px 17px;font-size:12px}.small-link{font-size:11px;color:#849077;text-underline-offset:4px}.welcome{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;padding:70px 0 65px;min-height:650px}.welcome h1{font-size:60px}.intro{font-size:14px;color:#8a8c7b;margin:21px 0 28px}.start-card{max-width:360px}.mode-switch{display:flex;padding:4px;background:#e9ebdf;border:1px solid #dbe0d2;border-radius:9px;margin-bottom:21px}.mode-switch button{flex:1;background:transparent;color:#8b927f;border:0;border-radius:6px;padding:10px 8px;font-size:12px;font-weight:600}.mode-switch button.active{background:#fffef8;color:#3b5444;box-shadow:0 2px 4px #29412012}label{font-size:11px;font-weight:600;display:block;margin:13px 0 8px}input,select{width:100%;padding:12px 13px;border:1px solid #d6dbc9;background:#fffef9;color:var(--ink);border-radius:7px}input:focus,select:focus{border-color:#879e79}input::placeholder{color:#a0a594}.start-card>.primary{width:100%;margin-top:15px}.fine{color:#979b8b;font-size:10px;margin-top:14px}.preview-wrap{transform:rotate(-6deg);padding:12px 0 20px}.preview-caption{font-size:8px;letter-spacing:2px;text-align:center;margin-top:30px;color:#93957f}.board-frame{position:relative;border-radius:16px;padding:19px;background:linear-gradient(135deg,#c3975c 0,#784d28 18%,#af7b3e 45%,#714323 80%,#af7e42);box-shadow:inset 0 2px 2px #ffe4ad94,inset 2px 0 1px #f5c78c5c,inset 0 -6px 3px #452b1c88,inset -2px 0 3px #4d301e6e,0 12px 0 -6px #614224,0 19px 30px -5px #3e321738,0 4px 8px #6a4d1a26}.board-frame:before{position:absolute;content:'';inset:7px;border:1px solid #ecc68b67;border-bottom-color:#3c291b5c;border-right-color:#3c291b5c;border-radius:10px;pointer-events:none}.board-surface{width:100%;aspect-ratio:1;position:relative;background:linear-gradient(135deg,#fff0c826,#9d652c15),url('wood.svg') center/cover,#d8b37a;border-radius:3px;box-shadow:inset 0 1px 5px #4129169c,inset 0 0 25px #9b652439;border:1px solid #68491f85}.board-lines{position:absolute;width:100%;height:100%;left:0;top:0;pointer-events:none}.board-lines line{stroke-linecap:round}.groove-light{stroke:#ffe5b6;stroke-width:5;opacity:.62}.groove-dark{stroke:#5c381e;stroke-width:4;opacity:.87}.board-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:Georgia,serif;font-size:13px;letter-spacing:2.7px;color:#8f693b;text-shadow:0 1px 0 #ffe4b28c;text-align:center;line-height:1.9;pointer-events:none}.board-stamp small{display:block;font-family:system-ui,sans-serif;letter-spacing:2.2px;font-size:5px}.point{position:absolute;transform:translate(-50%,-50%);width:8%;height:8%;border:0;padding:0;border-radius:50%;background:transparent;z-index:1;opacity:1!important;transition:box-shadow .18s,outline-color .18s}.point.empty:before{content:'';position:absolute;left:36%;top:36%;width:28%;height:28%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#4c2d14,#744722 55%,#b48442 85%);box-shadow:inset 0 2px 3px #321d119c,0 1px 0 #ffe6b8bb}.point .stone-cap{position:absolute;inset:4% 2% 13%;border-radius:50%;opacity:0;pointer-events:none}.white{background:radial-gradient(ellipse at 40% 30%,#f8ead1 15%,#e7d3aa 58%,#c1a574 87%,#9d8059 100%)!important;box-shadow:0 5px 0 #ad936d,0 7px 1px #7c633e,0 9px 9px #3a251f69,inset 0 1px 1px #fff9e8}.black{background:radial-gradient(ellipse at 36% 27%,#514338 5%,#2a211b 52%,#130d09 95%)!important;box-shadow:0 5px 0 #1c130e,0 7px 1px #0d0906,0 9px 9px #3a251f70,inset 0 1px 1px #ad998054}.point.white .stone-cap,.point.black .stone-cap{opacity:1}.white .stone-cap{background:radial-gradient(ellipse at 35% 18%,#fffaf0b3,transparent 50%);box-shadow:inset 0 0 0 1px #e1cba199,inset 0 -2px 4px #ab875330}.black .stone-cap{background:radial-gradient(ellipse at 34% 18%,#b1a08b5e,transparent 47%);box-shadow:inset 0 0 0 1px #82736041,inset 0 -3px 4px #0005}.point.selected{outline:3px solid #e6b95e;outline-offset:5px;box-shadow:0 5px 0 #8c714f,0 7px 1px #584222,0 10px 13px #412d2870,0 0 0 9px #ffe6a32b}.point.possible.empty:after{content:'';position:absolute;inset:8%;border:2px solid #476940;border-radius:50%;background:#88a76d28;box-shadow:0 0 0 3px #fff6d047}.point.possible:not(.empty){outline:2px dashed #b74a2a;outline-offset:5px}.point.last:not(.empty):after{content:'';position:absolute;width:7%;height:7%;background:#d4a862;bottom:19%;left:46.5%;border-radius:50%;box-shadow:0 1px 0 #fce5ad70}.point:hover:not(:disabled):not(.empty){filter:brightness(1.1)}.point:focus-visible{outline:3px solid #e6b95e;outline-offset:5px}.game-heading{padding:38px 0 29px;display:flex;align-items:center;justify-content:space-between;gap:25px}.game-heading p{margin:0;color:#88907e;font-size:12px}.heading-actions{display:flex;align-items:center;gap:18px}.game-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:36px;align-items:start}.board-meta{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#879077;letter-spacing:1.4px;margin:1px 4px 17px}.connection{font-size:10px;letter-spacing:0;display:flex;align-items:center;gap:7px}.connection i{width:6px;height:6px;border-radius:50%;background:#718e64}.connection.disconnected i{background:#b86543}.board-under{display:flex;justify-content:space-between;align-items:center;color:#9c9e8a;font-size:7px;letter-spacing:1px;margin:29px 4px 0}.board-under span:last-child{font-size:10px;letter-spacing:0}.status-card{background:#fffef8;border:1px solid #e1e3d4;border-radius:12px;padding:25px}.status-card>p{color:#909683;font-size:12px;margin:0 0 23px}.player{display:flex;align-items:center;gap:14px;padding:17px 8px;border-top:1px solid #eceddf}.player.active{border-radius:8px;background:#f0f3e9;border-top-color:transparent}.sample{width:31px;height:31px;flex-shrink:0;border-radius:50%;position:relative;align-self:flex-start;margin-top:4px}.player-copy{flex:1;min-width:0}.player-copy strong{font-size:12px;font-weight:650;display:block;overflow-wrap:anywhere}.player-copy>span{display:block;font-size:10px;color:#929c83;margin-top:5px}.reserve{display:flex;gap:5px;margin:10px 0 3px}.reserve-chip{width:12px;height:12px;flex-shrink:0;border-radius:50%;box-shadow:0 2px 0 #5b422e45}.reserve-chip.spent{background:transparent!important;box-shadow:inset 0 0 0 1px #c7ceba}.turn-indicator{font-size:9px;color:#7d946f;visibility:hidden}.player.active .turn-indicator{visibility:visible}.text-button{background:none;border:0;color:#9a9c89;font-size:10px;padding:15px 0 0}.rematch{width:100%;margin-top:16px;justify-content:center}.rules{padding:24px 9px 14px}.rules summary,.moves summary{cursor:pointer;font-size:12px;font-weight:600;display:flex;justify-content:space-between;list-style:none}.rules summary span{color:#a2aa91}.rules ol{padding-left:19px;color:#99a38b;font-size:11px}.rules li{margin:16px 0;padding-left:5px}.rules strong{color:#5f6c53;font-size:11px}.rules p{font-size:10px;color:#929984;margin:5px 0}.rules .rule-note{font-size:9px;border-top:1px solid #e4e7d8;padding-top:12px}.moves{padding:15px 9px;border-top:1px solid #e0e4d4}.moves ol{padding:0;list-style:none;font-size:10px;color:#8e9880}.moves li{margin:9px 0;line-height:1.5}.join-banner{display:flex;gap:15px;align-items:center;padding:19px;background:#e7eddf;border:1px solid #d7dfcd;border-radius:10px;margin-bottom:25px}.join-banner div{flex:1}.join-banner strong{font-size:13px}.join-banner p{font-size:11px;margin:3px 0;color:#89977c}.join-banner input{width:180px}.invite-fallback{background:#e9eddf;padding:12px 18px;border-radius:9px;margin-bottom:19px}.invite-fallback label{margin-top:0}.notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:650px;width:calc(100% - 32px);z-index:10;background:#fff1df;color:#805833;border:1px solid #d9b688;border-radius:10px;padding:15px 18px;display:flex;gap:15px;align-items:center;justify-content:space-between;box-shadow:0 7px 30px #5c453a24;font-size:12px}.notice button{border:0;background:none;color:inherit;font-size:24px;padding:0 3px}footer{border-top:1px solid var(--line);margin-top:45px;padding:26px 0;display:flex;justify-content:space-between;color:#929c84;font-size:8px;letter-spacing:1.5px}footer span:last-child{letter-spacing:0;font-size:10px}@media(max-width:1000px){main{padding:0 26px}.welcome{gap:32px}.welcome h1{font-size:47px}.game-layout{gap:23px;grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr)}.board-frame{padding:15px;border-radius:13px}.status-card{padding:21px}.heading-actions{flex-direction:column;align-items:flex-end;gap:11px}.board-under{font-size:6px}.board-under span:last-child{font-size:8px}}@media(max-width:740px){main{padding:0 16px}header{height:80px}.brand{font-size:19px;letter-spacing:3px}.brand-icon{font-size:35px}.brand small{font-size:7px}.header-note{font-size:7px;letter-spacing:1px}.welcome{grid-template-columns:1fr;gap:36px;padding:40px 0 20px}.welcome h1{font-size:48px}.intro{font-size:12px}.start-card{max-width:none}.preview-wrap{width:90%;margin:auto;padding:0 0 8px}.preview-caption{font-size:7px}.game-heading{padding:27px 0 24px;gap:18px;flex-wrap:wrap}.game-heading h1{font-size:43px}.game-heading p{font-size:11px}.heading-actions{flex-direction:row;align-items:center;gap:15px}.secondary{padding:11px 13px;font-size:11px}.game-layout{grid-template-columns:1fr;gap:28px}.board-frame{padding:13px}.board-meta{font-size:8px;margin-bottom:13px}.board-under{margin-top:25px;font-size:6px}.board-under span:last-child{font-size:8px}.status-card{padding:23px}.board-stamp{font-size:10px;letter-spacing:2px}.board-stamp small{font-size:4px;letter-spacing:1.7px}.point{width:8.6%;height:8.6%}.point.selected{outline-width:2px;outline-offset:4px}.point.possible:not(.empty){outline-offset:4px}.reserve-chip{width:14px;height:14px}.reserve{gap:6px}.join-banner{flex-wrap:wrap;padding:16px;gap:12px}.join-banner div{flex-basis:100%}.join-banner input{width:auto;flex:1}.join-banner .primary{font-size:11px;padding:13px 15px}.rules{padding-top:24px}.rules p{font-size:11px}.rules strong{font-size:12px}.rules .rule-note{font-size:10px}footer{margin-top:30px;padding:22px 0}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
