:root{--gold:#ffc531;--gold2:#ffe58a;--bg:#02070d;--panel:#071522;--line:#28415a;--cyan:#3ad6ff;--red:#ff5b62;--muted:#9eb0c2}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% 0,#112941 0,#06111d 32%,#02070d 72%);color:#eef5fb;font-family:Pretendard,"Noto Sans KR","Malgun Gothic",sans-serif}button,select{font:inherit}
.topbar{height:64px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:0 18px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(2,8,14,.9);position:sticky;top:0;z-index:20;backdrop-filter:blur(10px)}.home-link{color:#cad7e3;text-decoration:none;font-weight:800}.ai-brand{text-align:center}.ai-brand strong{display:block;color:var(--gold);font-size:24px;line-height:1}.ai-brand span{font-size:12px;color:#b9c6d3;letter-spacing:.06em}.ghost-btn{justify-self:end;border:1px solid #44586b;background:#0a1723;color:#dce7f0;padding:9px 13px;border-radius:10px;cursor:pointer}
.practice-shell{width:min(1260px,100%);margin:0 auto;padding:20px;display:grid;grid-template-columns:minmax(0,820px) minmax(300px,380px);gap:20px}.game-panel,.coach-panel{border:1px solid rgba(255,197,49,.22);background:linear-gradient(180deg,rgba(9,23,37,.97),rgba(4,13,22,.98));border-radius:20px;box-shadow:0 18px 55px rgba(0,0,0,.35)}.game-panel{padding:16px}.coach-panel{padding:22px;height:max-content;position:sticky;top:84px}
.score-row{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}.player-card{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;border:1px solid #32485b;border-radius:14px;padding:9px 11px;background:#07111b}.player-card.white{text-align:left}.player-card.active{border-color:var(--gold);box-shadow:0 0 0 1px rgba(255,197,49,.25),0 0 22px rgba(255,197,49,.1)}.player-card b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-card small{display:block;color:#9fb0bf;margin-top:2px}.stone-mini{width:28px;height:28px;border-radius:50%}.black-stone{background:radial-gradient(circle at 34% 30%,#68717a 0,#171b20 28%,#020304 78%);border:1px solid #67717a}.white-stone{background:radial-gradient(circle at 34% 28%,#fff 0,#eef2f5 42%,#a7afb5 100%);border:1px solid #fff}.turn-badge{display:none;background:var(--gold);color:#241b08;font-size:11px;font-weight:900;border-radius:999px;padding:4px 7px}.player-card.active .turn-badge{display:inline}.center-status{text-align:center;color:var(--gold);font-weight:900;font-size:20px}.center-status small{display:block;color:#7890a5;font-size:10px;font-weight:700}
.notice-wrap{height:56px;display:flex;align-items:center}.notice{width:100%;padding:10px 12px;border-radius:10px;background:#03101a;border-left:3px solid var(--gold);color:#dce8f2;font-weight:750;font-size:14px}.notice.good{border-color:#51e58b;color:#bfffd3}.notice.warn{border-color:#ffb13b;color:#ffe2ad}.notice.danger{border-color:#ff646b;color:#ffd0d2}.notice.scan{border-color:var(--cyan);color:#c6f4ff}
.board-wrap{position:relative;width:min(100%,760px);aspect-ratio:1/1;margin:0 auto;border-radius:16px;padding:26px;background:linear-gradient(135deg,#dca934,#f3cf66 55%,#c99022);box-shadow:inset 0 0 0 2px #4b3513,inset 0 0 35px rgba(62,37,2,.35),0 16px 34px rgba(0,0,0,.36);overflow:hidden}.board{
  width:100%;
  height:100%;
  position:relative;
  overflow:visible;
  isolation:isolate;
}
.board-grid{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
  overflow:visible;
  shape-rendering:geometricPrecision;
}
.board-grid line{
  stroke:#60410f;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
  opacity:.84;
}
.board-grid circle{
  fill:#60410f;
  opacity:.9;
}
.cell{
  --x:0;
  --y:0;
  position:absolute;
  left:calc(var(--x) * 100% / 14);
  top:calc(var(--y) * 100% / 14);
  width:calc(100% / 14);
  height:calc(100% / 14);
  transform:translate(-50%,-50%);
  z-index:1;
  border:0;
  background:transparent;
  cursor:pointer;
  padding:0;
  min-width:0;
  min-height:0;
  touch-action:manipulation;
}
.cell::after{
  content:"";
  position:absolute;
  width:12%;
  height:12%;
  left:44%;
  top:44%;
  border-radius:50%;
  background:#61400b;
  opacity:0;
  transition:.12s;
}
.cell:hover::after{opacity:.42}
.cell.center-ban::after{
  opacity:.28;
  background:#8c1f1f;
  width:22%;
  height:22%;
  left:39%;
  top:39%;
}
.stone{position:absolute;left:8%;top:8%;width:84%;height:84%;border-radius:50%;z-index:3;box-shadow:0 3px 6px rgba(0,0,0,.45)}.stone.B{background:radial-gradient(circle at 32% 26%,#717981 0,#20252b 25%,#030405 76%);border:1px solid #69747c}.stone.W{background:radial-gradient(circle at 32% 25%,#fff 0,#f7f9fa 40%,#b0b7bc 100%);border:1px solid #fff}.stone.hidden-own{opacity:.52;border:2px dashed var(--cyan);box-shadow:0 0 18px rgba(58,214,255,.55)}.stone.hidden-own::after,.stone.hidden-public::after,.stone.scan-show::after{content:"H";position:absolute;inset:0;display:grid;place-items:center;font-weight:1000;font-size:clamp(10px,2vw,23px)}.stone.hidden-own::after{color:#e8fbff;text-shadow:0 1px 3px #003d4d}.stone.hidden-public::after{color:var(--gold);text-shadow:0 1px 2px #000}.stone.scan-show{opacity:.48;border:2px dashed #5ce7ff;animation:blink .38s infinite alternate}.stone.last{outline:6px solid #ff5b32;outline-offset:-5px;box-shadow:0 0 0 2px rgba(255,229,178,.86),0 0 16px rgba(255,69,42,.78),0 3px 6px rgba(0,0,0,.45)}.scan-target{position:absolute;inset:14%;border:2px solid var(--cyan);border-radius:50%;box-shadow:0 0 14px var(--cyan);z-index:5;animation:pulse .6s infinite alternate}@keyframes blink{to{opacity:.8}}@keyframes pulse{to{transform:scale(1.18);opacity:.48}}.scan-pulse{pointer-events:none;position:absolute;width:26px;height:26px;border:2px solid var(--cyan);border-radius:50%;opacity:0;z-index:10}.scan-pulse.on{animation:scanring .9s ease-out}@keyframes scanring{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(16)}}
.action-row{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:14px}.scan-btn,.secondary-btn,.gold-btn{border-radius:12px;padding:12px 16px;font-weight:900;cursor:pointer}.scan-btn{border:1px solid #36cdeb;background:linear-gradient(#0d4a5d,#073243);color:#bdf5ff;box-shadow:0 0 18px rgba(58,214,255,.12)}.scan-btn.active{background:#0b7892;color:#fff;box-shadow:0 0 22px rgba(58,214,255,.42)}.scan-btn:disabled{opacity:.35;cursor:not-allowed}.secondary-btn{border:1px solid #445b70;background:#0a1825;color:#d7e4ee}.gold-btn{width:100%;border:0;color:#1c1405;background:linear-gradient(#ffe479,#ffb91f);box-shadow:0 8px 20px rgba(255,185,31,.23)}
.dojo-head{display:flex;align-items:center;gap:13px}.dojo-avatar{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-family:serif;font-size:28px;font-weight:900;color:#301f02;background:radial-gradient(circle at 35% 30%,#fff4ac,#ffc332 55%,#b87709);border:2px solid #ffe99a;box-shadow:0 0 24px rgba(255,196,50,.24)}.dojo-head span{font-size:10px;letter-spacing:.18em;color:var(--gold)}.dojo-head h1{margin:2px 0 0;font-size:27px}.dojo-copy{color:#b9c8d4;line-height:1.65}.setting-box,.lesson-box,.practice-note{margin-top:17px;border:1px solid #263d51;border-radius:14px;background:#05111c;padding:14px}.setting-box label{display:block;font-size:12px;color:#91a5b7;margin-bottom:6px}.setting-box select{width:100%;padding:11px;border-radius:10px;border:1px solid #395067;background:#081927;color:#eef6fb;margin-bottom:10px}.lesson-box h2{font-size:15px;margin:0 0 10px;color:#f6d878}.lesson-box ul{margin:0;padding-left:18px;color:#b8c8d4;line-height:1.75;font-size:13px}.lesson-box b{color:#fff}.practice-note strong{color:#f5cf67}.practice-note p{font-size:12px;color:#8fa3b5;line-height:1.6;margin:6px 0 0}
.modal{display:none;position:fixed;inset:0;z-index:50;place-items:center;padding:18px}.modal.open{display:grid}.modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(7px)}.help-card{position:relative;width:min(560px,95vw);background:#081827;border:1px solid rgba(255,197,49,.55);border-radius:18px;padding:24px;box-shadow:0 25px 80px #000}.help-card h2{color:var(--gold);margin-top:0}.help-card p{color:#c7d4df;line-height:1.6}.x-btn{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:29px;cursor:pointer}
@media(max-width:900px){.practice-shell{grid-template-columns:1fr;padding:10px}.coach-panel{position:static;order:-1}.coach-panel .lesson-box,.coach-panel .practice-note{display:none}.dojo-copy{margin-bottom:8px}.setting-box{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end}.setting-box label{grid-column:1/-1;margin:0}.setting-box select,.setting-box .gold-btn{margin:0}.topbar{grid-template-columns:auto 1fr auto}.ai-brand span{display:none}}
@media(max-width:560px){.topbar{height:56px;padding:0 10px}.ai-brand strong{font-size:20px}.ghost-btn{font-size:12px;padding:7px 9px}.practice-shell{padding:6px}.game-panel{padding:8px;border-radius:14px}.coach-panel{padding:12px;border-radius:14px}.dojo-head{display:none}.dojo-copy{font-size:12px;margin:0 0 8px}.setting-box{margin-top:6px;padding:9px}.score-row{gap:4px}.player-card{padding:6px;grid-template-columns:auto 1fr}.turn-badge{display:none!important}.stone-mini{width:21px;height:21px}.player-card b{font-size:12px}.player-card small{font-size:10px}.center-status{font-size:16px}.notice-wrap{height:48px}.notice{font-size:12px;padding:8px}.board-wrap{padding:17px;border-radius:10px}.action-row{margin-top:8px;gap:5px}.scan-btn,.secondary-btn{padding:9px 10px;font-size:12px}.secondary-btn#helpBtn{display:none}}

.sound-btn[aria-pressed="false"]{opacity:.62}

.player-info{min-width:0}
.item-status{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.item-chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:20px;padding:2px 7px;border-radius:999px;
  font-size:10px;font-weight:900;letter-spacing:.02em;
  border:1px solid #46596b;color:#7f93a5;background:#0a131d;
}
.item-chip.available.hidden-chip{
  color:#ffe7a0;border-color:#e7ad28;background:#4b3306;
  box-shadow:0 0 12px rgba(255,190,40,.16)
}
.item-chip.available.scan-chip{
  color:#bff7ff;border-color:#34cfe9;background:#073a4a;
  box-shadow:0 0 12px rgba(58,214,255,.16)
}
.item-chip.placed{color:#e8d17f;border-color:#776127;background:#1a170b}
.item-chip.revealed{color:#c8d4dc;border-color:#566572;background:#121b22}
.item-chip.used{opacity:.45;filter:saturate(.35)}

.hidden-btn,.scan-btn,.secondary-btn,.gold-btn{
  border-radius:12px;padding:12px 16px;font-weight:900;cursor:pointer
}
.hidden-btn{
  border:1px solid #e7ad28;
  background:linear-gradient(#65490c,#3b2a08);
  color:#ffe7a0;
  box-shadow:0 0 18px rgba(255,190,40,.12)
}
.hidden-btn.ready{
  background:linear-gradient(#8a620e,#543906);
  box-shadow:0 0 24px rgba(255,190,40,.35);
  animation:hiddenReady .9s ease-in-out infinite alternate
}
@keyframes hiddenReady{to{transform:translateY(-1px);box-shadow:0 0 30px rgba(255,190,40,.55)}}
.hidden-btn:disabled{
  opacity:.38;cursor:not-allowed;animation:none;transform:none
}
/* SCAN stays visually available while 1 remains, even during opponent turn.
   It only turns gray after actual consumption. */
.scan-btn.available{
  opacity:1;
  border-color:#36cdeb;
  background:linear-gradient(#0d4a5d,#073243);
  color:#bdf5ff;
}
.scan-btn.waiting{
  cursor:not-allowed;
  filter:saturate(.72);
}
.scan-btn.spent{
  opacity:.34;
  cursor:not-allowed;
  filter:saturate(.25);
}

.scan-btn:disabled.available{opacity:1}
.scan-btn:disabled.waiting{opacity:.72}
.scan-btn:disabled.spent{opacity:.34}
@media(max-width:560px){
  .item-status{gap:3px;margin-top:3px}
  .item-chip{font-size:8px;padding:1px 5px;min-height:17px}
  .hidden-btn,.scan-btn,.secondary-btn{padding:9px 10px;font-size:12px}
}


/* ===== v1.4 : 실전형 대형 HIDDEN / SCAN ===== */
.item-actions{
  gap:12px;
  align-items:stretch;
}
.item-action{
  min-width:174px;
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:9px 16px;
  border-radius:16px;
  font-weight:1000;
  position:relative;
  overflow:hidden;
}
.item-icon{
  flex:0 0 54px;
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  position:relative;
}
.item-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  line-height:1.05;
}
.item-copy strong{
  font-size:18px;
  letter-spacing:.025em;
}
.item-copy small{
  margin-top:7px;
  font-size:12px;
  font-weight:900;
  opacity:.92;
}
.item-copy b{font-size:14px}

/* HIDDEN : 점선 원 안의 H — 실전 UI에서 한눈에 보이게 */
.hidden-btn{
  border:1px solid #e7ad28;
  background:
    radial-gradient(circle at 18% 20%,rgba(255,222,105,.12),transparent 42%),
    linear-gradient(#5f4309,#2e2106);
  color:#ffe39a;
  box-shadow:0 0 20px rgba(255,190,40,.16);
}
.hidden-icon{
  border:3px dashed #ffd85d;
  border-radius:50%;
  box-shadow:0 0 15px rgba(255,200,65,.30),inset 0 0 12px rgba(255,220,105,.12);
}
.hidden-icon::before{
  content:"";
  position:absolute;
  inset:7px;
  border:2px solid rgba(255,239,186,.72);
  border-radius:50%;
}
.hidden-icon span{
  position:relative;
  z-index:2;
  font-size:25px;
  color:#fff4c7;
  text-shadow:0 1px 2px #2d1b00;
}
.hidden-btn.ready{
  border-color:#ffd85d;
  background:
    radial-gradient(circle at 18% 20%,rgba(255,234,139,.22),transparent 44%),
    linear-gradient(#805b0b,#4a3307);
  box-shadow:0 0 30px rgba(255,190,40,.42);
  animation:hiddenReadyV14 .85s ease-in-out infinite alternate;
}
@keyframes hiddenReadyV14{
  to{box-shadow:0 0 38px rgba(255,190,40,.62);transform:translateY(-1px)}
}

/* SCAN : 레이더 아이콘 */
.scan-btn{
  border:1px solid #3bdcf7;
  background:
    radial-gradient(circle at 18% 20%,rgba(80,230,255,.13),transparent 42%),
    linear-gradient(#0b5267,#073343);
  color:#c8f8ff;
  box-shadow:0 0 20px rgba(58,214,255,.18);
}
.scan-icon{
  border:2px solid #72ecff;
  border-radius:50%;
  background:
    radial-gradient(circle,#51e7ff 0 4%,transparent 5% 17%,rgba(92,231,255,.55) 18% 20%,transparent 21% 35%,rgba(92,231,255,.45) 36% 38%,transparent 39%),
    conic-gradient(from -35deg,rgba(85,236,255,.78) 0 12deg,transparent 13deg 360deg);
  box-shadow:0 0 16px rgba(58,214,255,.38),inset 0 0 14px rgba(58,214,255,.12);
}
.scan-icon::before,.scan-icon::after{
  content:"";
  position:absolute;
  background:rgba(102,236,255,.62);
}
.scan-icon::before{width:2px;height:100%;left:50%;top:0}
.scan-icon::after{height:2px;width:100%;top:50%;left:0}
.scan-dot{
  width:8px;height:8px;border-radius:50%;
  background:#d7fbff;
  box-shadow:0 0 10px #55e8ff;
  z-index:3;
}
.scan-btn.active{
  background:linear-gradient(#0d7995,#075069);
  color:#fff;
  box-shadow:0 0 32px rgba(58,214,255,.58);
}
.scan-btn.available:not(:disabled){
  animation:scanReadyV14 .9s ease-in-out infinite alternate;
}
@keyframes scanReadyV14{
  to{box-shadow:0 0 34px rgba(58,214,255,.52);transform:translateY(-1px)}
}

/* 남아 있으면 아이콘은 항상 선명하게, 사용 완료시에만 확실히 회색 */
.item-action:disabled{
  transform:none;
}
.hidden-btn:disabled,
.scan-btn:disabled{
  cursor:not-allowed;
}
.hidden-btn:disabled:not(.ready){
  opacity:.48;
  filter:saturate(.48);
  animation:none;
}
.scan-btn:disabled.available{
  opacity:.78;
  filter:saturate(.82);
  animation:none;
}
.scan-btn.spent{
  opacity:.34 !important;
  filter:grayscale(.65) saturate(.2);
  animation:none !important;
}
.item-action.spent .item-icon{
  box-shadow:none;
}

/* 플레이어 카드의 보유상태도 기존보다 크게 */
.item-chip{
  min-height:24px !important;
  padding:3px 9px !important;
  font-size:11px !important;
}
.item-chip.available.hidden-chip{
  box-shadow:0 0 14px rgba(255,190,40,.22) !important;
}
.item-chip.available.scan-chip{
  box-shadow:0 0 14px rgba(58,214,255,.22) !important;
}

@media(max-width:560px){
  .item-actions{gap:7px}
  .item-action{
    min-width:0;
    width:calc(50% - 4px);
    min-height:64px;
    padding:7px 9px;
    gap:7px;
  }
  .item-icon{flex-basis:44px;width:44px;height:44px}
  .item-copy strong{font-size:14px}
  .item-copy small{font-size:10px;margin-top:5px}
  .hidden-icon span{font-size:20px}
  .item-chip{font-size:9px !important;padding:2px 6px !important;min-height:20px !important}
}


/* ===== v1.5 : 점수 / 현재 수 / 도움말 가독성 강화 ===== */
.player-card small{
  font-size:15px !important;
  font-weight:800;
  line-height:1.15;
}
#scoreB,#scoreW{
  display:inline-block;
  margin-left:5px;
  font-size:27px;
  line-height:1;
  font-weight:1000;
  color:#ffd34f;
  text-shadow:0 0 12px rgba(255,202,55,.22);
  vertical-align:-2px;
}
.center-status{
  min-width:74px;
  font-size:36px !important;
  line-height:.95;
  font-weight:1000 !important;
}
.center-status small{
  margin-top:6px;
  font-size:13px !important;
  line-height:1;
}
.turn-badge{
  font-size:14px !important;
  padding:6px 9px !important;
}

/* 도움말 팝업 — PC에서 훨씬 크게 */
.help-card{
  width:min(830px,94vw) !important;
  max-height:min(82vh,760px);
  overflow:auto;
  padding:34px 38px !important;
  border-radius:22px !important;
}
.help-card h2{
  font-size:29px;
  margin:0 48px 22px 0 !important;
}
.help-card p{
  font-size:17px;
  line-height:1.8 !important;
  margin:13px 0;
}
.help-card .x-btn{
  right:18px !important;
  top:14px !important;
  font-size:36px !important;
}

/* 알림도 조금 더 또렷하게 */
.notice{
  font-size:15px !important;
  line-height:1.35;
}

@media(max-width:560px){
  .player-card small{font-size:11px !important}
  #scoreB,#scoreW{font-size:20px}
  .center-status{font-size:27px !important;min-width:50px}
  .center-status small{font-size:10px !important}
  .help-card{
    width:95vw !important;
    max-height:84vh;
    padding:24px 20px !important;
  }
  .help-card h2{font-size:23px}
  .help-card p{font-size:15px;line-height:1.65 !important}
}


/* ===== 오투도사 테스트 버전 7 : 대국 시작 대형 안내 ===== */
.start-overlay{
  position:fixed;
  inset:0;
  z-index:5000;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(2,8,15,.74);
  backdrop-filter:blur(4px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease,visibility .16s ease;
}
.start-overlay.show{
  opacity:1;
  visibility:visible;
}
.start-announcement{
  width:min(720px,88vw);
  padding:42px 34px 38px;
  text-align:center;
  border:2px solid #ffc83d;
  border-radius:28px;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,205,72,.18),transparent 46%),
    linear-gradient(180deg,#0c1a28,#07111b);
  box-shadow:
    0 0 55px rgba(255,190,50,.30),
    inset 0 0 30px rgba(255,209,90,.06);
  transform:scale(.88);
}
.start-overlay.show .start-announcement{
  animation:startPop 1.85s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes startPop{
  0%{transform:scale(.72);opacity:0}
  18%{transform:scale(1.05);opacity:1}
  32%{transform:scale(1)}
  82%{transform:scale(1);opacity:1}
  100%{transform:scale(.98);opacity:.96}
}
.start-brand{
  color:#ffc83d;
  font-size:18px;
  font-weight:1000;
  letter-spacing:.18em;
}
.start-title{
  margin-top:10px;
  color:#fff;
  font-size:64px;
  line-height:1;
  font-weight:1000;
  text-shadow:0 0 25px rgba(255,255,255,.16);
}
.start-sub{
  margin-top:18px;
  color:#ffd45c;
  font-size:30px;
  line-height:1.2;
  font-weight:1000;
}
@media(max-width:560px){
  .start-announcement{padding:32px 18px 30px;border-radius:22px}
  .start-brand{font-size:13px}
  .start-title{font-size:46px}
  .start-sub{font-size:22px}
}

/* ===== 오투도사 테스트 버전 8 : 실전 랜덤점수 / 종료 결과창 ===== */
.bonus-marker{
  position:absolute;
  inset:16%;
  z-index:2;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:clamp(9px,1.8vw,18px);
  font-weight:1000;
  line-height:1;
  pointer-events:none;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  box-shadow:0 0 13px rgba(255,255,255,.18), inset 0 0 10px rgba(255,255,255,.12);
}
.bonus-marker.plus{
  color:#efffe9;
  background:radial-gradient(circle at 35% 28%,#8bff79,#20a94c 58%,#0f6d31);
  border:2px solid #d9ffd4;
}
.bonus-marker.minus{
  color:#fff1f1;
  background:radial-gradient(circle at 35% 28%,#ff938f,#df3c49 58%,#8b1623);
  border:2px solid #ffd1d1;
}
.cell.bonus-plus::before,.cell.bonus-minus::before{
  content:"";
  position:absolute;
  inset:10%;
  border-radius:50%;
  z-index:1;
  opacity:.28;
  animation:bonusGlow 1.1s ease-in-out infinite alternate;
}
.cell.bonus-plus::before{box-shadow:0 0 18px 5px #55e570}
.cell.bonus-minus::before{box-shadow:0 0 18px 5px #ff5965}
@keyframes bonusGlow{to{opacity:.56;transform:scale(1.06)}}

.result-overlay{
  position:absolute;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(3,8,14,.74);
  backdrop-filter:blur(3px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .18s ease,visibility .18s ease;
}
.result-overlay.show{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.result-card{
  width:min(520px,88%);
  padding:30px 26px 26px;
  text-align:center;
  border:2px solid #ffc83d;
  border-radius:24px;
  background:radial-gradient(circle at 50% 0,rgba(255,202,61,.18),transparent 45%),linear-gradient(180deg,#0c1b2a,#07111b);
  box-shadow:0 0 48px rgba(255,190,50,.30),0 20px 55px rgba(0,0,0,.55);
  animation:resultPop .28s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes resultPop{from{transform:scale(.84);opacity:0}to{transform:scale(1);opacity:1}}
.result-brand{color:#ffc83d;font-size:13px;font-weight:1000;letter-spacing:.16em}
.result-title{margin-top:8px;font-size:42px;line-height:1.05;font-weight:1000;color:#fff}
.result-reason{margin-top:13px;font-size:22px;line-height:1.35;font-weight:900;color:#ffd86d}
.result-score{margin-top:13px;font-size:19px;font-weight:900;color:#d9e8f3}
.rematch-btn{
  width:100%;
  margin-top:22px;
  padding:15px 18px;
  border:0;
  border-radius:14px;
  font-size:19px;
  font-weight:1000;
  cursor:pointer;
  color:#251903;
  background:linear-gradient(#ffe783,#ffb91f);
  box-shadow:0 9px 22px rgba(255,185,31,.28);
}
.rematch-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
@media(max-width:560px){
  .result-overlay{padding:14px}
  .result-card{width:92%;padding:24px 18px 20px;border-radius:20px}
  .result-title{font-size:34px}
  .result-reason{font-size:18px}
  .result-score{font-size:16px}
  .rematch-btn{font-size:17px;padding:13px}
}


/* ===== 오투도사 테스트 버전 9 : 모든 주요 이슈 대형 팝업 + MAX 사운드 ===== */
.event-overlay{
  position:absolute;
  inset:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,8,14,.34);
  backdrop-filter:blur(1.5px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .10s ease,visibility .10s ease;
}
.event-overlay.show{opacity:1;visibility:visible}
.event-card{
  width:min(610px,88%);
  padding:31px 27px 27px;
  text-align:center;
  border:3px solid #ffc83d;
  border-radius:26px;
  background:radial-gradient(circle at 50% 0,rgba(255,205,72,.22),transparent 48%),linear-gradient(180deg,rgba(9,25,39,.98),rgba(3,11,19,.98));
  box-shadow:0 0 65px rgba(255,196,49,.42),0 22px 58px rgba(0,0,0,.56),inset 0 0 32px rgba(255,255,255,.04);
}
.event-overlay.show .event-card{animation:eventMegaPop .42s cubic-bezier(.16,.9,.2,1) both}
@keyframes eventMegaPop{
  0%{transform:scale(.68);opacity:0;filter:brightness(1.5)}
  62%{transform:scale(1.08);opacity:1}
  100%{transform:scale(1);opacity:1;filter:brightness(1)}
}
.event-kicker{font-size:14px;font-weight:1000;letter-spacing:.17em;color:#ffd767}
.event-title{margin-top:8px;font-size:50px;line-height:1.04;font-weight:1000;color:#fff;text-shadow:0 0 24px rgba(255,255,255,.22)}
.event-detail{margin-top:13px;font-size:21px;line-height:1.42;font-weight:900;color:#e7f1f8}
.event-card.hidden{border-color:#ffca3d;box-shadow:0 0 75px rgba(255,197,49,.58),0 22px 58px rgba(0,0,0,.56)}
.event-card.reveal{border-color:#fff08c;box-shadow:0 0 85px rgba(255,224,87,.72),0 22px 58px rgba(0,0,0,.56)}
.event-card.scan{border-color:#43dcff;box-shadow:0 0 75px rgba(58,214,255,.60),0 22px 58px rgba(0,0,0,.56)}
.event-card.scan-hit{border-color:#70f7d2;box-shadow:0 0 88px rgba(76,242,199,.68),0 22px 58px rgba(0,0,0,.56)}
.event-card.scan-miss{border-color:#ff7279;box-shadow:0 0 88px rgba(255,76,88,.65),0 22px 58px rgba(0,0,0,.56)}
.event-card.plus{border-color:#77ff8d;box-shadow:0 0 80px rgba(81,229,139,.64),0 22px 58px rgba(0,0,0,.56)}
.event-card.minus{border-color:#ff6a72;box-shadow:0 0 80px rgba(255,78,91,.66),0 22px 58px rgba(0,0,0,.56)}
.event-card.foul{border-color:#ff4f59;box-shadow:0 0 90px rgba(255,52,65,.75),0 22px 58px rgba(0,0,0,.56)}
.event-card.pattern{border-color:#b8a1ff;box-shadow:0 0 76px rgba(150,118,255,.56),0 22px 58px rgba(0,0,0,.56)}
.event-card.scan .event-kicker,.event-card.scan .event-title{color:#c9f8ff}
.event-card.scan-hit .event-kicker,.event-card.scan-hit .event-title{color:#caffed}
.event-card.scan-miss .event-kicker,.event-card.scan-miss .event-title{color:#ffd2d4}
.event-card.plus .event-kicker,.event-card.plus .event-title{color:#d5ffdc}
.event-card.minus .event-kicker,.event-card.minus .event-title,.event-card.foul .event-title{color:#ffd5d7}
@media(max-width:560px){
  .event-overlay{padding:13px}
  .event-card{width:94%;padding:24px 16px 21px;border-radius:20px}
  .event-kicker{font-size:11px}
  .event-title{font-size:35px}
  .event-detail{font-size:16px}
}


/* ===== 오투도사 테스트 버전 11 =====
   - HIDDEN / SCAN 조작을 내 유저 박스 안으로 이동
   - 연습실의 골드/시안/그린/레드 이벤트 팔레트를 실전 UI 기준으로 유지 */
.score-row{align-items:stretch}
.player-card{align-self:stretch}
.player-item-controls{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  width:100%;
  margin-top:4px;
}
.player-item-controls .item-action{
  min-width:0;
  min-height:45px;
  padding:5px 8px;
  gap:7px;
  border-radius:11px;
}
.player-item-controls .item-icon{
  flex:0 0 31px;
  width:31px;
  height:31px;
}
.player-item-controls .item-copy strong{font-size:12px;letter-spacing:.02em}
.player-item-controls .item-copy small{margin-top:3px;font-size:9px}
.player-item-controls .item-copy b{font-size:10px}
.player-item-controls .hidden-icon{border-width:2px}
.player-item-controls .hidden-icon::before{inset:4px;border-width:1px}
.player-item-controls .hidden-icon span{font-size:15px}
.player-item-controls .scan-dot{width:5px;height:5px}
.utility-actions{margin-top:12px}

/* 종료 결과창을 제외한 주요 이벤트 팝업은 약 3초로 통일하며, 표시 중 착수 입력/AI 진행을 잠시 잠근다. */
.event-overlay.show{background:rgba(2,8,14,.40)}

@media(max-width:560px){
  .player-card{grid-template-columns:auto minmax(0,1fr)}
  .player-item-controls{gap:4px;margin-top:3px}
  .player-item-controls .item-action{min-height:38px;padding:4px 5px;gap:5px}
  .player-item-controls .item-icon{flex-basis:26px;width:26px;height:26px}
  .player-item-controls .item-copy strong{font-size:10px}
  .player-item-controls .item-copy small{font-size:8px;margin-top:2px}
  .player-item-controls .hidden-icon span{font-size:12px}
}

/* ===== 오투도사 테스트 버전 12 : 실전형 알림 내역 ===== */
.notice-wrap{
  position:relative;
  z-index:80;
}
button.notice{
  appearance:none;
  border-top:0;
  border-right:0;
  border-bottom:0;
  text-align:left;
  cursor:pointer;
  font:inherit;
  position:relative;
  padding-right:42px !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
button.notice::after{
  content:'▾';
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  color:#8da6b9;
  font-size:16px;
  transition:transform .16s ease,color .16s ease;
}
button.notice[aria-expanded="true"]::after{transform:translateY(-50%) rotate(180deg);color:#ffc531}
.notice-history{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% - 3px);
  z-index:90;
  border:1px solid #355066;
  border-top:1px solid rgba(255,197,49,.45);
  border-radius:0 0 14px 14px;
  background:rgba(3,16,26,.98);
  box-shadow:0 22px 46px rgba(0,0,0,.46),0 0 0 1px rgba(255,197,49,.06) inset;
  opacity:0;
  visibility:hidden;
  transform:translateY(-5px);
  transition:opacity .14s ease,transform .14s ease,visibility .14s ease;
  overflow:hidden;
}
.notice-history.open{opacity:1;visibility:visible;transform:translateY(0)}
.notice-history-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding:11px 13px 9px;
  border-bottom:1px solid #203647;
  color:#ffc531;
}
.notice-history-head strong{font-size:13px;letter-spacing:.02em}
.notice-history-head span{font-size:10px;color:#8198aa;font-weight:700}
.notice-history-list{max-height:260px;overflow-y:auto;overscroll-behavior:contain;padding:5px 7px 8px;scrollbar-width:thin}
.notice-history-item{padding:9px 9px 10px;border-bottom:1px solid rgba(96,128,151,.14);border-left:3px solid #607d91;border-radius:6px;color:#d9e7f0;background:rgba(255,255,255,.018)}
.notice-history-item+ .notice-history-item{margin-top:3px}
.notice-history-item.good{border-left-color:#51e58b}.notice-history-item.warn{border-left-color:#ffb13b}.notice-history-item.danger{border-left-color:#ff646b}.notice-history-item.scan{border-left-color:#43dcff}
.notice-history-meta{font-size:10px;color:#7890a5;font-weight:800;margin-bottom:3px}
.notice-history-text{font-size:12px;line-height:1.4;font-weight:750;word-break:keep-all}
.notice-history-empty{padding:18px;text-align:center;color:#7890a5;font-size:12px}
@media(max-width:560px){
  .notice-history-head{align-items:flex-start;flex-direction:column;gap:2px}
  .notice-history-list{max-height:220px}
  .notice-history-text{font-size:11px}
}


/* ===== 오투도사 테스트 버전 13 =====
   HIDDEN 생존 점등 / AI 아이템 상태 동일 UI / lighter item state */
.hidden-btn.live,
.item-chip.live.hidden-chip{
  opacity:1 !important;
  filter:none !important;
  border-color:#ffd85d !important;
  color:#fff0aa !important;
  background:radial-gradient(circle at 18% 20%,rgba(255,234,139,.22),transparent 44%),linear-gradient(#76540b,#3d2b07) !important;
  box-shadow:0 0 26px rgba(255,190,40,.42) !important;
}
.hidden-btn:disabled.live{opacity:1 !important;filter:none !important}
.hidden-btn.spent{opacity:.34 !important;filter:grayscale(.65) saturate(.2) !important;box-shadow:none !important}
.status-only{cursor:default !important;pointer-events:none;user-select:none}
.ai-item-controls .item-action{opacity:1}
.ai-item-controls .item-action.spent{opacity:.34 !important;filter:grayscale(.65) saturate(.2)}
.ai-item-controls .scan-btn.available{box-shadow:0 0 24px rgba(58,214,255,.34)}
.ai-item-controls .scan-btn.available .item-icon{filter:none}


/* v14: 실전형 랜덤 선후공 뺑뺑이 */
.roulette-overlay{position:fixed;inset:0;z-index:125;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(2,8,14,.74);opacity:0;visibility:hidden;transition:opacity .2s ease}
.roulette-overlay.show{opacity:1;visibility:visible}
.roulette-card{width:min(470px,92vw);padding:28px 24px 24px;text-align:center;border:2px solid #ffc531;border-radius:24px;background:linear-gradient(180deg,#0b1a27,#06111b);box-shadow:0 0 70px rgba(255,197,49,.42),0 24px 70px rgba(0,0,0,.6)}
.roulette-brand{font-size:11px;letter-spacing:.22em;font-weight:1000;color:#ffc531}.roulette-title{margin-top:8px;font-size:clamp(25px,5vw,38px);font-weight:1000;color:#f7fbff}
.roulette-stage{position:relative;width:236px;height:236px;margin:18px auto 12px}.roulette-wheel{position:absolute;inset:8px;border-radius:50%;border:7px solid #f5c33e;background:conic-gradient(#111 0 45deg,#f3f5f6 45deg 90deg,#111 90deg 135deg,#f3f5f6 135deg 180deg,#111 180deg 225deg,#f3f5f6 225deg 270deg,#111 270deg 315deg,#f3f5f6 315deg 360deg);box-shadow:inset 0 0 0 4px #79580a,0 0 30px rgba(255,197,49,.35)}
.roulette-wheel.spinning{animation:o2rouletteSpin 3s cubic-bezier(.12,.64,.16,1) forwards}.roulette-pointer{position:absolute;left:50%;top:-3px;transform:translateX(-50%);z-index:4;width:0;height:0;border-left:17px solid transparent;border-right:17px solid transparent;border-top:0;border-bottom:36px solid #ffca37;filter:drop-shadow(0 4px 3px rgba(0,0,0,.45))}
.rw{position:absolute;left:50%;top:50%;font-size:16px;font-weight:1000;text-shadow:0 1px 2px #000}.r1{transform:translate(-50%,-50%) rotate(22.5deg) translateY(-86px) rotate(-22.5deg);color:#fff}.r2{transform:translate(-50%,-50%) rotate(67.5deg) translateY(-86px) rotate(-67.5deg);color:#111}.r3{transform:translate(-50%,-50%) rotate(112.5deg) translateY(-86px) rotate(-112.5deg);color:#fff}.r4{transform:translate(-50%,-50%) rotate(157.5deg) translateY(-86px) rotate(-157.5deg);color:#111}.r5{transform:translate(-50%,-50%) rotate(202.5deg) translateY(-86px) rotate(-202.5deg);color:#fff}.r6{transform:translate(-50%,-50%) rotate(247.5deg) translateY(-86px) rotate(-247.5deg);color:#111}.r7{transform:translate(-50%,-50%) rotate(292.5deg) translateY(-86px) rotate(-292.5deg);color:#fff}.r8{transform:translate(-50%,-50%) rotate(337.5deg) translateY(-86px) rotate(-337.5deg);color:#111}
.roulette-result{min-height:30px;font-size:19px;font-weight:950;color:#ffc531}
@keyframes o2rouletteSpin{0%{transform:rotate(0deg)}70%{transform:rotate(1310deg)}100%{transform:rotate(var(--roulette-end,1507.5deg))}}
@media(max-width:560px){.roulette-stage{width:205px;height:205px}.roulette-card{padding:22px 16px 20px}.rw{font-size:14px}.r1{transform:translate(-50%,-50%) rotate(22.5deg) translateY(-74px) rotate(-22.5deg)}.r2{transform:translate(-50%,-50%) rotate(67.5deg) translateY(-74px) rotate(-67.5deg)}.r3{transform:translate(-50%,-50%) rotate(112.5deg) translateY(-74px) rotate(-112.5deg)}.r4{transform:translate(-50%,-50%) rotate(157.5deg) translateY(-74px) rotate(-157.5deg)}.r5{transform:translate(-50%,-50%) rotate(202.5deg) translateY(-74px) rotate(-202.5deg)}.r6{transform:translate(-50%,-50%) rotate(247.5deg) translateY(-74px) rotate(-247.5deg)}.r7{transform:translate(-50%,-50%) rotate(292.5deg) translateY(-74px) rotate(-292.5deg)}.r8{transform:translate(-50%,-50%) rotate(337.5deg) translateY(-74px) rotate(-337.5deg)}}
.topbar .official-mini-logo{display:flex;width:120px;height:54px;align-items:center;justify-content:center;overflow:visible;flex:0 0 auto}.topbar .official-mini-logo img{display:block;width:120px;height:auto;max-height:54px;object-fit:contain;object-position:center;border-radius:0}.topbar .ai-brand{display:flex;flex-direction:column;gap:1px}.topbar .ai-brand strong{font-size:15px}.topbar .ai-brand span{font-size:10px;color:#8f9bab}

/* ===== 홈페이지 테스터 v7 : AI 연습실 긴급 사용성 패치 ===== */
.result-card{position:relative}
.result-close-btn{
  position:absolute;right:12px;top:9px;width:38px;height:38px;border:1px solid #526579;
  border-radius:50%;background:#07131f;color:#eef5fb;font-size:27px;line-height:1;cursor:pointer;
}
.result-close-btn:hover{border-color:#ffc83d;color:#ffc83d}
.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:22px}
.result-actions .rematch-btn{grid-column:1/-1;margin-top:0}
.result-sub-btn{
  min-height:46px;border:1px solid #496175;border-radius:12px;background:#0a1a28;color:#e2edf5;
  font-weight:900;cursor:pointer;padding:11px 14px;
}
.result-sub-btn.danger{border-color:#81424b;color:#ffd2d5;background:#271016}
.result-sub-btn:hover{filter:brightness(1.12)}
.postgame-btn{border-color:#d2a72e;color:#ffe49a}

.review-bar{
  margin-top:12px;border:1px solid rgba(255,197,49,.42);border-radius:13px;background:#06121d;
  padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.review-bar[hidden]{display:none!important}
.review-bar strong{color:#ffd56a;font-size:13px}
.review-controls{display:flex;gap:6px;flex-wrap:wrap}
.review-controls button{
  min-width:44px;min-height:36px;border:1px solid #3d566b;border-radius:9px;background:#0b1b29;color:#dce8f1;
  font-size:12px;font-weight:900;cursor:pointer;padding:6px 9px;
}
.review-controls .review-exit{border-color:#a87d19;color:#ffe49a}

/* 모바일 1차 터치 선택 표시. 선택은 시간 제한 없이 유지된다. */
.cell.mobile-selected{
  border-radius:50%;
  box-shadow:inset 0 0 0 3px rgba(65,225,255,.95),0 0 14px rgba(65,225,255,.65);
  background:rgba(65,225,255,.10);
}
.cell.mobile-selected::after{opacity:1;background:#e8fcff;box-shadow:0 0 9px #40e1ff}
.mobile-tap-card{text-align:left}
.mobile-tap-card h2{margin-bottom:14px}
.mobile-tap-card p{margin:9px 0}
.mobile-tap-card b{color:#fff}
.mobile-tap-note{font-size:13px;color:#9fb3c4!important}
.mobile-tap-card .gold-btn{margin-top:13px}

@media(max-width:560px){
  .result-actions{grid-template-columns:1fr 1fr;gap:7px}
  .result-close-btn{right:8px;top:7px;width:34px;height:34px;font-size:24px}
  .review-bar{padding:8px;align-items:flex-start}
  .review-controls{width:100%;display:grid;grid-template-columns:repeat(4,1fr)}
  .review-controls button{min-width:0;padding:6px 3px}
  .review-controls .review-exit{grid-column:1/-1}
}


/* ===== 홈페이지 테스터 v8 : 모바일 AI 연습실 긴급 안정화 ===== */
/* 모바일 브라우저의 더블탭/컨트롤 자동 확대는 막되 핀치 확대와 스크롤은 유지 */
.practice-shell,
.topbar,
.game-panel,
.coach-panel,
.board-wrap,
.cell,
button,
select,
.review-bar{
  touch-action:manipulation;
}

/* 중복 상태 칩은 숨기고, 실제 HIDDEN/SCAN 아이템의 점등/소등만 사용 */
.item-status{display:none!important}
.player-item-controls .item-copy small{display:none!important}

/* 마지막 착수: 굵은 흰색 외곽선 + 중앙 빨간 점 */
.stone.last{
  outline:4px solid rgba(255,255,255,.98)!important;
  outline-offset:1px!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.72),0 0 13px rgba(255,255,255,.55),0 3px 6px rgba(0,0,0,.45)!important;
}
.stone.last::before{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:24%;height:24%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:#ff493d;
  box-shadow:0 0 0 2px rgba(255,255,255,.68),0 0 7px rgba(255,55,45,.85);
  z-index:6;
}

/* 복기에서는 당시 아직 비활성이던 HIDDEN도 처음 배치 시점부터 공개해서 보여준다. */
.stone.review-hidden{opacity:.72;border:2px dashed #ffd65b;box-shadow:0 0 12px rgba(255,197,49,.36)}
.stone.review-hidden::after{color:#ffe17a!important;text-shadow:0 1px 2px #000}

@media(max-width:560px){
  /* 상단은 로고+AI 연습실만 남겨 공간 절약. 로고 클릭으로 홈 이동 */
  .topbar{grid-template-columns:auto 1fr!important;height:56px!important;padding:0 10px!important;column-gap:8px}
  .topbar .home-link,#newGameTop{display:none!important}
  .topbar .official-mini-logo{width:116px;height:52px;justify-self:start}
  .topbar .official-mini-logo img{width:116px;max-height:52px}
  .topbar .ai-brand{justify-self:end;text-align:right;min-width:0}
  .topbar .ai-brand strong{font-size:18px!important;white-space:nowrap}
  .topbar .ai-brand span{display:none!important}

  /* AI 시작 패널을 한 줄 설명 + 2개 컨트롤로 압축 */
  .coach-panel{padding:8px 10px!important;border-radius:12px!important}
  .dojo-copy{font-size:11px!important;line-height:1.3!important;margin:0 0 5px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .setting-box{margin-top:0!important;padding:6px!important;gap:6px!important;border-radius:10px!important}
  .setting-box label{display:none!important}
  .setting-box select,.setting-box .gold-btn{min-height:44px;font-size:16px!important}

  /* 선수 박스 안의 HIDDEN/SCAN 두 아이템이 잘리지 않도록 축소/정렬 */
  .score-row{grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr)!important;gap:5px!important}
  .player-card{padding:7px 6px!important;gap:5px!important;overflow:visible!important}
  .player-item-controls{grid-template-columns:1fr 1fr!important;gap:5px!important;width:100%!important;min-width:0!important}
  .player-item-controls .item-action{width:100%!important;min-width:0!important;min-height:46px!important;padding:5px 3px!important;gap:3px!important;overflow:visible!important}
  .player-item-controls .item-icon{flex:0 0 25px!important;width:25px!important;height:25px!important}
  .player-item-controls .item-copy{min-width:0!important;align-items:center!important}
  .player-item-controls .item-copy strong{font-size:9px!important;white-space:nowrap!important;overflow:visible!important}
  .player-item-controls .hidden-icon span{font-size:12px!important}
  .player-item-controls .scan-dot{width:4px!important;height:4px!important}
  .center-status{font-size:18px!important}
  .center-status small{font-size:9px!important}

  /* 판 하단까지 자연스럽게 볼 수 있도록 불필요한 여백 축소 */
  .game-panel{padding:7px!important}
  .notice-wrap{height:46px!important}
  .board-wrap{padding:15px!important;margin-bottom:4px!important}
  .utility-actions{margin-top:7px!important}
}


/* ===== 홈페이지 테스터 v9 : 모바일 터치/표시 안정화 ===== */
/* AI 연습실은 앱처럼 고정 배율로 사용한다. 삼성 인터넷 등에서 첫 탭/SCAN/HIDDEN/복기 후
   브라우저가 임의 확대하는 현상을 막고, 세로 스크롤만 허용한다. */
html,body{touch-action:pan-y;}
.practice-shell,.topbar,.game-panel,.coach-panel,.board-wrap,.board,.cell,
.player-card,.player-item-controls,.item-action,button,select,.review-bar,.notice-wrap{
  touch-action:pan-y!important;
}
.topbar .ai-brand{justify-self:center}

/* 내 HIDDEN은 밝은 점선 테두리 대신 진한 외곽선으로 본체 크기를 선명하게 보이게 한다. */
.stone.hidden-own{
  opacity:.58!important;
  border:3px solid #101820!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.16),0 0 10px rgba(0,0,0,.58)!important;
}
.stone.hidden-own::after{
  color:#111922!important;
  text-shadow:0 1px 1px rgba(255,255,255,.45)!important;
}

/* 마지막 착수 빨간점: v8 대비 약 2배 확대 */
.stone.last::before{
  width:48%!important;
  height:48%!important;
  box-shadow:0 0 0 2px rgba(255,255,255,.82),0 0 8px rgba(255,55,45,.92)!important;
}

@media(max-width:560px){
  /* 첫 진입/첫 탭에도 판 폭이 변하지 않도록 모바일 판 폭을 고정적으로 컨테이너에 맞춘다. */
  .practice-shell{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  .game-panel,.coach-panel{width:100%!important;min-width:0!important;max-width:100%!important}
  .board-wrap{width:100%!important;max-width:100%!important;min-width:0!important;aspect-ratio:1/1!important}
  .board{width:100%!important;height:100%!important;min-width:0!important}
  .cell{-webkit-tap-highlight-color:transparent!important}
  .topbar{grid-template-columns:auto 1fr!important}
  .topbar .ai-brand{justify-self:end!important}
}


/* ===== 홈페이지 테스터 v10 : AI 연습실 시작/복기/상단 UI 마무리 ===== */
/* 상단: 좌측 오디오 컨트롤 / 중앙 공식 로고 / 우측 AI 연습실 */
.topbar{position:sticky;grid-template-columns:1fr auto 1fr!important;column-gap:12px!important}
.topbar .topbar-controls{justify-self:start;display:flex;align-items:center;gap:7px;min-width:0;z-index:2}
.topbar .official-mini-logo{justify-self:center!important;position:absolute;left:50%;transform:translateX(-50%);z-index:1}
.topbar .ai-brand{justify-self:end!important;text-align:right!important;z-index:2}
.header-music{display:flex;align-items:center}
.header-music .header-music-play{width:36px;height:36px;flex:0 0 36px;font-size:14px}
.header-sound-btn{min-height:36px!important;padding:6px 9px!important;font-size:11px!important;white-space:nowrap!important}
#newGameTop{display:none!important}

/* 복기: 수순 조작은 한 줄, 1수/3수 이동. 종료·한판더는 작게 묶는다. */
.review-bar{display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:8px!important;padding:9px 10px!important}
.review-controls{display:grid!important;grid-template-columns:repeat(6,minmax(38px,1fr));gap:6px!important;flex-wrap:nowrap!important;min-width:0}
.review-controls button{min-width:38px!important;min-height:38px!important;padding:5px 4px!important;font-size:18px!important;line-height:1!important}
.review-actions{display:flex;align-items:center;gap:6px;white-space:nowrap}
.review-actions button{min-height:36px;border:1px solid #a87d19;border-radius:9px;background:#0b1b29;color:#ffe49a;font-size:11px;font-weight:900;padding:6px 9px;cursor:pointer}
.review-actions .review-rematch{background:linear-gradient(180deg,#ffcf48,#e4a51c);color:#161006;border-color:#f0bd36}

@media(max-width:560px){
  .topbar{height:58px!important;padding:0 8px!important;column-gap:5px!important}
  .topbar .topbar-controls{gap:4px!important;max-width:112px}
  .header-music .header-music-play{width:34px!important;height:34px!important;flex-basis:34px!important}
  .header-sound-btn{min-height:34px!important;padding:5px 6px!important;font-size:9px!important;max-width:74px;overflow:hidden;text-overflow:ellipsis}
  .topbar .official-mini-logo{width:112px!important;height:52px!important}
  .topbar .official-mini-logo img{width:112px!important;max-height:52px!important}
  .topbar .ai-brand strong{font-size:17px!important}

  .review-bar{grid-template-columns:1fr!important;gap:7px!important;padding:8px!important}
  .review-bar strong{font-size:12px!important}
  .review-controls{width:100%!important;grid-template-columns:repeat(6,1fr)!important;gap:5px!important}
  .review-controls button{min-width:0!important;min-height:38px!important;font-size:17px!important;padding:4px 2px!important}
  .review-actions{justify-content:flex-end;width:100%}
  .review-actions button{min-height:34px!important;padding:5px 10px!important;font-size:11px!important}
  /* 모바일에서는 하단 보조 버튼을 없애고 상단/복기 전용 버튼만 사용 */
  .utility-actions{display:none!important}
}

/* ===== 홈페이지 테스터 v11 : 모바일 백/랜덤 선택 복구 ===== */
