*{box-sizing:border-box;}body{margin:0;min-height:100vh;display:flex;align-items:center;justify-content:center;background:#1e2530;color:#eef1f5;font-family:"Hiragino Kaku Gothic ProN","Meiryo",sans-serif;padding:16px;}.app{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:560px;}h1{margin:0;font-size:1.5rem;}.rule-hint{margin:0;text-align:center;font-size:0.85rem;color:#b5bdc9;}.settings-panel{width:100%;background:#262e3d;border-radius:10px;padding:0 14px;}.settings-panel summary{display:flex;align-items:center;gap:6px;padding:10px 0;font-size:0.85rem;font-weight:bold;color:#b5bdc9;cursor:pointer;list-style:none;user-select:none;}.settings-panel summary::-webkit-details-marker{display:none;}.settings-panel summary::before{content:"▶";display:inline-block;font-size:0.65rem;color:#7a8494;transition:transform 0.15s ease;}.settings-panel[open]summary::before{transform:rotate(90deg);}.settings{display:flex;flex-direction:column;gap:8px;padding:0 0 12px;font-size:0.85rem;}.settings-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:8px 10px;background:#1e2530;border-radius:8px;}.settings-group-title{width:100%;font-size:0.75rem;font-weight:bold;color:#7a8494;text-transform:uppercase;letter-spacing:0.03em;}.switch-row,.select-row{display:flex;align-items:center;gap:8px;cursor:pointer;}.select-row select{font-family:inherit;font-size:0.85rem;background:#262e3d;color:#eef1f5;border:1px solid #3d4b66;border-radius:6px;padding:3px 6px;cursor:pointer;}.select-row select:disabled{opacity:0.4;cursor:not-allowed;}.switch-row input[type="checkbox"]{appearance:none;-webkit-appearance:none;position:relative;width:36px;height:20px;flex-shrink:0;border-radius:999px;background:#3d4b66;cursor:pointer;transition:background 0.15s ease;}.switch-row input[type="checkbox"]::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#eef1f5;transition:transform 0.15s ease;}.switch-row input[type="checkbox"]:checked{background:#7ed957;}.switch-row input[type="checkbox"]:checked::after{transform:translateX(16px);}.switch-row input[type="checkbox"]:focus-visible{outline:2px solid #ffd166;outline-offset:2px;}.status{font-size:1.1rem;font-weight:bold;min-height:1.5em;text-align:center;}.status.thinking{color:#7ed957;}.status.win{color:#ffd166;}.table{display:flex;flex-direction:column;align-items:center;gap:14px;}.player-area{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border-radius:12px;background:#262e3d;width:100%;}.player-area.active{outline:2px solid #ffd166;}.player-label{font-weight:bold;font-size:0.9rem;}.player1-label{color:#5aa9ff;}.player2-label{color:#ff6b6b;}.player3-label{color:#eab308;}.stock{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;min-height:70px;align-items:flex-end;}.stock-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;background:none;border:none;padding:0;}.stock-item:disabled{cursor:not-allowed;opacity:0.3;}.stock-count{font-size:0.75rem;color:#b5bdc9;}.piece{border-radius:50%;border:3px solid rgba(255,255,255,0.85);box-shadow:0 2px 4px rgba(0,0,0,0.4);}.piece.size-1{width:26px;height:26px;}.piece.size-2{width:40px;height:40px;}.piece.size-3{width:56px;height:56px;}.piece.player1{background:#3d7bd9;}.piece.player2{background:#d9483d;}.piece.player3{background:#eab308;}.stock-item.selected .piece{border-color:#ffd166;box-shadow:0 0 0 3px rgba(255,209,102,0.6);}.board{display:grid;gap:6px;background:#101520;padding:6px;border-radius:12px;}.board.grid-3{grid-template-columns:repeat(3,90px);grid-template-rows:repeat(3,90px);}.board.grid-4{grid-template-columns:repeat(4,68px);grid-template-rows:repeat(4,68px);}.cell{background:#2e3648;border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;}.cell.highlight{background:#3a4a3a;box-shadow:inset 0 0 0 2px #7ed957;}.board.cpu-turn .cell{cursor:not-allowed;}.cell.selected-piece{box-shadow:inset 0 0 0 2px #ffd166;}.cell .piece{position:absolute;}.cell .win-piece{box-shadow:0 0 0 3px #ffd166,0 2px 4px rgba(0,0,0,0.4);}.controls{margin-top:4px;}button{font-family:inherit;font-size:0.9rem;padding:8px 16px;border-radius:8px;border:none;background:#3d4b66;color:#eef1f5;cursor:pointer;}button:hover{background:#4a5b7a;}