/* ============================================================
     クイズ画面（#screen-quiz）
     ※怪異演出中の見た目の変化は kaii.css
     ============================================================ */
  #screen-quiz{ justify-content:center; gap:18px; }
  #screen-quiz .link-back{ margin-top:0; }
  .quiz-topbar{
    display:flex; align-items:center; justify-content:center;
  }
  .progress-wrap{ width:100%; }
  .progress-label{ font-size:12.5px; color:var(--bone-dim); margin-bottom:6px; letter-spacing:.05em; text-align:center; }
  .progress-track{
    height:5px; border-radius:3px; background:var(--line); overflow:hidden;
  }
  .progress-fill{
    height:100%; background:linear-gradient(90deg, var(--ash-purple-2), var(--blood-bright));
    transition:width .4s ease;
  }

  .kanji-stage{
    position:relative;
    margin-top:6px;
    padding:38px 16px 32px;
    border-radius:8px;
    background:
      radial-gradient(ellipse 90% 70% at 50% 30%, rgba(139,26,43,0.10), transparent 70%),
      linear-gradient(180deg, var(--bg-panel), var(--bg-panel-2));
    border:1px solid var(--line);
    text-align:center;
    overflow:hidden;
  }
  .kanji-stage::before{
    content:"";
    position:absolute; inset:0;
    border:1px solid transparent;
    box-shadow:0 0 0 1px rgba(139,26,43,0.12) inset;
    pointer-events:none;
  }
  .kanji-main{
    font-family:'Yuji Syuku',serif;
    font-size:clamp(52px, 17vw, 84px);
    color:var(--bone);
    text-shadow:0 0 30px rgba(139,26,43,0.35);
    line-height:1.1;
    word-break:keep-all;
  }
  .kanji-index{
    margin-top:10px; font-size:16px; color:var(--bone-dim); letter-spacing:.1em;
  }

  .answer-zone{ display:flex; flex-direction:column; gap:10px; }

  .choice-grid{
    display:grid; grid-template-columns:1fr 1fr; gap:10px;
  }
  .choice-btn{
    min-height:56px;
    padding:12px 10px;
    font-size:16px;
    font-weight:500;
    background:var(--bg-panel);
    border:1px solid var(--line);
    color:var(--bone);
    border-radius:6px;
    cursor:pointer;
    transition:transform .1s ease, border-color .15s ease, background .15s ease;
    line-height:1.3;
  }
  .choice-btn:active{ transform:scale(0.97); }
  .choice-btn.is-correct{ border-color:var(--sick-green-bright); background:rgba(74,124,89,0.18); }
  .choice-btn.is-wrong{ border-color:var(--blood-bright); background:rgba(139,26,43,0.22); }
  .choice-btn:disabled{ cursor:default; opacity:.85; }

  .free-input-row{ display:flex; gap:8px; }
  .free-input{
    /* min-width:0：入力欄の「最低限の幅」より縮められるようにし、スマホの狭い画面でも判定ボタンを押し出さない */
    flex:1; min-width:0; min-height:52px;
    background:var(--bg-panel);
    border:1px solid var(--line);
    border-radius:6px;
    color:var(--bone);
    font-size:18px;
    padding:0 14px;
    font-family:'Zen Kaku Gothic New',sans-serif;
  }
  .free-input:focus{ outline:none; border-color:var(--ash-purple-2); }
  .btn-submit{
    min-width:84px; min-height:52px;
    background:linear-gradient(180deg,#2a1420,#1a0d14);
    border:1px solid var(--blood);
    color:var(--bone);
    border-radius:6px;
    font-size:15px;
    cursor:pointer;
  }
  .btn-submit:disabled{ opacity:.4; }
  .input-hint{ font-size:11.5px; color:var(--bone-dim); padding-left:2px; }

  @media (min-width:600px){
    .kanji-main{ font-size:88px; }
  }