/* Agentic QA patch for 폐장 전 안전점검관
   - 판단 버튼을 항상 보이게 고정
   - 작은 화면에서 버튼 클릭 영역이 겹치지 않게 재배치
   - 위험 기준 안내와 사운드 토글 상태 표시 강화
*/
:root{scroll-padding-bottom:150px}

.sound-toggle{position:relative;padding-left:38px}
.sound-toggle::before{content:"";position:absolute;left:16px;top:50%;width:12px;height:12px;border-radius:999px;transform:translateY(-50%);background:var(--green);box-shadow:0 0 14px rgba(124,247,167,.8)}
.sound-toggle[aria-pressed="false"]::before{background:var(--muted);box-shadow:none}

.rule-guide{display:grid;gap:5px;background:rgba(255,209,102,.1);border-color:rgba(255,209,102,.26)}
.rule-guide b{color:var(--yellow);font-size:12px}
.rule-guide span{color:#d9e8f6;line-height:1.45}

.play-grid{align-items:start}
.ride-card,.check-panel,.condition-panel{min-height:0}
.ride-card::after{pointer-events:none}

.decision-dock{
  position:sticky;
  bottom:10px;
  z-index:40;
  grid-template-columns:minmax(210px,.9fr) minmax(0,1.7fr) minmax(112px,auto);
  overflow:visible;
  background:rgba(8,21,36,.92);
  backdrop-filter:blur(18px);
}
.decision-buttons{position:relative;z-index:2;isolation:isolate}
.decision{position:relative;z-index:1;min-width:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.decision.close{z-index:3}
.decision:focus-visible,.btn:focus-visible{outline:3px solid rgba(103,232,249,.75);outline-offset:3px}
.btn.next{position:relative;z-index:4;min-width:112px;white-space:nowrap}
.feedback{position:relative;z-index:3}
.log-panel{margin-bottom:18px}

@media (max-width: 1040px){
  .app{padding:10px}
  .screen{min-height:calc(100vh - 20px)}
  .menu-screen{grid-template-columns:1fr}
  .play-grid{grid-template-columns:1fr 1.25fr;grid-template-areas:"conditions check" "ride ride"}
  .condition-panel{grid-area:conditions}.check-panel{grid-area:check}.ride-card{grid-area:ride}
  .ride-main{grid-template-columns:minmax(170px,.42fr) minmax(0,1fr)}
  .ride-visual{min-height:220px}
  .decision-dock{grid-template-columns:1fr;gap:8px;bottom:8px}
  .decision-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}
  .btn.next{width:100%}
}

@media (max-width: 720px){
  .status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .play-grid{display:flex;flex-direction:column}
  .ride-main{grid-template-columns:1fr;gap:10px}
  .ride-visual{min-height:180px}
  .ride-copy h2{font-size:clamp(30px,12vw,44px)}
  .decision-dock{bottom:0;border-radius:22px 22px 0 0;margin-left:-4px;margin-right:-4px;padding:10px}
  .decision-buttons{gap:7px}
  .decision{min-height:62px;padding:10px;text-align:center}
  .decision span{font-size:15px}.decision small{font-size:11px}
  .feedback{min-height:58px}.feedback span{font-size:12px}
  .history{flex-wrap:wrap;overflow:visible}.history-item{min-width:min(100%,180px);flex:1 1 160px}
}

@media (max-width: 430px){
  .hero-card h1{font-size:clamp(44px,18vw,64px)}
  .lead{font-size:14px}.menu-stats{grid-template-columns:repeat(2,1fr)}
  .status-strip{grid-template-columns:1fr}
  .decision-buttons{grid-template-columns:1fr}
  .decision{min-height:52px;display:flex;align-items:center;justify-content:space-between;text-align:left}
  .feedback span{display:block}
}
