*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:Arial,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;min-height:100dvh;color:#333}.screen{width:100%;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:clamp(8px,2vw,24px)}.screen.hidden{display:none}.container{text-align:center;background:#fff;width:100%;max-width:578px;padding:clamp(12px,3.5vw,40px);border-radius:clamp(12px,3vw,20px);box-shadow:0 20px 60px #0000004d}h1{color:#667eea;margin-bottom:20px;font-size:clamp(1.6rem,7vw,2.5rem)}p{margin-bottom:30px;font-size:clamp(1rem,4vw,1.2rem);color:#666}.btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:15px clamp(24px,8vw,40px);font-size:clamp(1rem,4vw,1.1rem);border-radius:50px;cursor:pointer;transition:transform .2s,box-shadow .2s;font-weight:700;max-width:100%;touch-action:manipulation}@media(hover:hover){.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #0003}}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed}.debug-option{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px;cursor:pointer;font-size:clamp(.9rem,3.6vw,1rem)}.debug-option input{width:18px;height:18px}.model-status{margin-bottom:20px;padding:10px clamp(12px,4vw,20px);border-radius:8px;font-size:clamp(.85rem,3.4vw,.95rem);font-weight:500}.model-status.loading{background:#fff3e0;color:#f57c00}.model-status.ready{background:#e8f5e9;color:#2e7d32}.model-status.error{background:#ffebee;color:#c62828}.game-info{margin-bottom:20px}.player-info{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(8px,3vw,24px);margin-bottom:15px;font-size:clamp(.9rem,3.6vw,1.2rem)}.player,.ai{display:flex;align-items:center;gap:10px;padding:10px clamp(10px,3vw,20px);background:#f5f5f5;border-radius:10px;flex:1 1 auto;justify-content:center;min-width:0;white-space:nowrap}#player-color,#ai-color{font-size:1.5em}.turn-indicator{font-size:clamp(.9rem,3.6vw,1.1rem);font-weight:700;padding:10px;border-radius:8px;background:#e3f2fd;color:#1976d2}.board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:100%;max-width:498px;aspect-ratio:1 / 1;gap:2px;background:#333;padding:2px;border-radius:8px;margin:0 auto;box-shadow:0 10px 30px #0000004d}.cell{width:100%;height:100%;background:#2d7a2d;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s;position:relative;container-type:inline-size;touch-action:manipulation;-webkit-tap-highlight-color:transparent}@media(hover:hover){.cell:hover{background:#3a8f3a}}.cell.valid-move{background:#4da64d}.cell.valid-move:after{content:"";width:33%;aspect-ratio:1 / 1;border-radius:50%;background:#ffffff4d;position:absolute}.debug-score{position:absolute;bottom:4%;right:4%;background:#0009;color:#fff;font-size:clamp(7px,20cqw,11px);line-height:1.2;padding:2px 5px;border-radius:6px;pointer-events:none;opacity:.95}.piece{width:83%;aspect-ratio:1 / 1;border-radius:50%;box-shadow:inset 0 -2px 5px #0000004d;animation:placepiece .3s ease}@keyframes placepiece{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.piece.black{background:radial-gradient(circle at 30% 30%,#555,#000)}.piece.white{background:radial-gradient(circle at 30% 30%,#fff,#ddd)}.result{margin-top:clamp(16px,5vw,30px);padding:clamp(16px,5vw,30px);background:#f5f5f5;border-radius:15px}.result.hidden{display:none}.result h2{color:#667eea;margin-bottom:15px;font-size:clamp(1.4rem,6vw,2rem)}.result p{margin-bottom:20px;font-size:clamp(1rem,4.2vw,1.3rem);color:#333}#result-message.win{color:#4caf50}#result-message.lose{color:#f44336}#result-message.draw{color:#ff9800}@media(min-width:481px){.board{max-width:clamp(320px,calc(100vh - 350px),498px);max-width:clamp(320px,calc(100dvh - 350px),498px)}}@media(max-width:480px){h1{margin-bottom:12px}.debug-option{display:flex;margin-bottom:16px}p{margin-bottom:20px}.game-info{margin-bottom:12px}.player-info{margin-bottom:10px}.player,.ai{gap:6px;flex:1 1 45%}#player-color,#ai-color{font-size:1.3em}}@media(max-height:560px)and (orientation:landscape){.screen{padding:8px}h1{font-size:clamp(1.2rem,3.5vh,1.8rem);margin-bottom:8px}#main-screen p,#main-screen .model-status{margin-bottom:12px}#main-screen .container{padding:16px 24px}#game-screen .container{max-width:900px;padding:12px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title  board" "info   board" "result board";align-content:center;gap:8px 16px}#game-screen h1{grid-area:title;margin-bottom:0;align-self:end}#game-screen .game-info{grid-area:info;margin-bottom:0}#game-screen .board{grid-area:board;align-self:center;width:auto;max-width:none;height:min(498px,calc(100vh - 40px));height:min(498px,calc(100dvh - 40px))}#game-screen .result{grid-area:result;margin-top:8px;padding:12px}.player-info{flex-direction:column;flex-wrap:nowrap;gap:6px;margin-bottom:8px}.player,.ai{flex:0 0 auto;padding:6px 10px;white-space:normal}.result h2{font-size:1.3rem;margin-bottom:6px}.result p{font-size:1rem;margin-bottom:10px}.result .btn{padding:10px 20px}}