:root{--night: #17110d;--ink: #261910;--paper: #d9c08d;--paper-light: #f4e4b8;--amber: #b98a48;--coral: #9b3f2d;--line: rgba(231, 204, 148, .24);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--night)}body{color:var(--paper-light);font-family:Songti SC,STSong,"Noto Serif SC",Georgia,serif;-webkit-user-select:none;user-select:none}button{font:inherit}#app,#ui{position:fixed;top:0;right:0;bottom:0;left:0}canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}#ui{z-index:2;pointer-events:none}.topbar{position:absolute;z-index:3;top:0;left:0;right:0;display:flex;align-items:center;gap:18px;padding:calc(18px + var(--safe-top)) calc(22px + var(--safe-right)) 18px calc(22px + var(--safe-left));background:linear-gradient(180deg,#1c110be6,#1c110b00)}.turn-pill{position:absolute;top:calc(18px + var(--safe-top));left:50%;display:flex;align-items:center;gap:9px;margin:0;padding:8px 14px;transform:translate(-50%);border:1px solid rgba(203,160,86,.48);border-radius:999px;background:#271910db;box-shadow:inset 0 1px #ffecb914,0 8px 22px #0000003d;color:var(--paper);font-size:13px;letter-spacing:.12em;transition:border-color .18s,box-shadow .18s}.turn-pill.thinking{border-color:#dba957e6;box-shadow:inset 0 1px #ffecb91f,0 0 22px #ab652a4d}.turn-stone{display:block;width:14px;height:14px;border-radius:50%;box-shadow:inset 1px 1px 2px #ffffff3d,0 2px 4px #0006}.turn-stone.black{background:radial-gradient(circle at 35% 28%,#59616b,#11161c 58%,#05070a)}.turn-stone.white{background:radial-gradient(circle at 35% 28%,#fffdf7,#eadfca 58%,#af9e83)}.top-actions{display:flex;gap:8px;margin-left:auto;justify-content:flex-end}.ghost-button,.secondary-button{pointer-events:auto;min-height:38px;padding:8px 13px;border:1px solid var(--line);border-radius:4px;background:#2b1c12c7;color:var(--paper);cursor:pointer;font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:background .16s,border-color .16s,transform .16s}.ghost-button:hover,.secondary-button:hover{border-color:#dba957d1;background:#482a18e6}.icon-button{display:grid;width:38px;padding:8px;place-items:center}.sound-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7}.sound-off-line,.icon-button.muted .sound-waves{display:none}.icon-button.muted .sound-off-line{display:block}.secondary-button:active,.primary-button:active{transform:translateY(1px)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:grid;place-items:center;padding:calc(24px + var(--safe-top)) calc(20px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(20px + var(--safe-left));background:radial-gradient(circle at 50% 42%,#351f125c,#0f0906d1 72%);pointer-events:auto}.overlay.hidden{display:none}.menu-panel,.result-panel{position:relative;width:min(520px,91vw);padding:34px 38px 28px;border:1px solid rgba(128,83,38,.9);border-radius:7px;background:linear-gradient(142deg,#e5cf9dfa,#be995efa);box-shadow:0 28px 90px #0000009e,inset 0 1px #fff4c880;color:var(--ink)}.menu-panel:before,.result-panel:before{position:absolute;top:8px;right:8px;bottom:8px;left:8px;border:1px solid rgba(111,70,30,.28);content:"";pointer-events:none}.setting label{color:#e3a84dbf;font-size:9px;letter-spacing:.2em}.settings-grid{display:grid;grid-template-columns:1fr;gap:22px;margin-bottom:26px}.setting label{display:block;margin-bottom:9px;color:#67431f;font-size:11px;letter-spacing:.14em}.segmented{display:flex;gap:5px}.choice{flex:1;min-height:40px;padding:7px 8px;border:1px solid rgba(91,57,27,.42);border-radius:4px;background:#53341b1a;color:#362212bd;cursor:pointer;font-size:12px;letter-spacing:.08em;transition:color .16s,background .16s,border-color .16s}.choice:hover{border-color:#73411dd1}.choice.selected{border-color:#8c3427;background:#913726db;color:#f7e7bd}#difficultySetting.disabled{opacity:.38;pointer-events:none}.primary-button{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:12px 17px;border:1px solid rgba(255,222,164,.8);border-radius:4px;background:var(--coral);color:#f8e6b7;cursor:pointer;font-size:12px;font-weight:700;letter-spacing:.15em;transition:background .16s,transform .16s}.primary-button:hover{background:#b04d35}.result-panel{width:min(390px,88vw)}h2{margin:0 0 10px;color:var(--ink);font-family:Georgia,Times New Roman,serif;font-size:38px;font-weight:400;text-align:center}.result-panel p{margin:0 0 24px;color:#362212b8;font-size:13px;line-height:1.6}.result-actions{display:flex;flex-direction:column;gap:9px}.result-actions .secondary-button{width:100%}.mobile-controls{position:absolute;right:calc(18px + var(--safe-right));bottom:calc(18px + var(--safe-bottom));z-index:3;display:none;grid-template-columns:repeat(3,38px);grid-template-rows:repeat(3,38px);gap:4px;pointer-events:auto}.mobile-controls button{border:1px solid rgba(204,163,91,.48);border-radius:5px;background:#2b1b11d6;color:var(--paper);cursor:pointer;font-size:17px}.mobile-controls button:first-child{grid-column:2}.mobile-controls button:nth-child(2){grid-column:1;grid-row:2}.mobile-controls button:nth-child(3){grid-column:2;grid-row:2;color:#e2b260;font-size:12px}.mobile-controls button:nth-child(4){grid-column:3;grid-row:2}.mobile-controls button:nth-child(5){grid-column:2;grid-row:3}@media (pointer: coarse){.mobile-controls{display:grid}}@media (max-width: 600px){.topbar{gap:8px;padding-left:calc(14px + var(--safe-left));padding-right:calc(14px + var(--safe-right))}.turn-pill{padding:7px 10px;font-size:10px}.ghost-button{padding:8px 9px;font-size:9px}.menu-panel,.result-panel{padding:26px 23px 22px}.settings-grid{grid-template-columns:1fr;gap:16px;margin-bottom:20px}}@media (max-height: 560px){.menu-panel,.result-panel{padding:20px 25px 17px}.settings-grid{margin-bottom:15px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
