/* 問題演習（過去問道場型） /renshu/ 専用。共通の部品（.choice .fb .btn .q-card など）は kiso の CSS を流用 */
.rn-hero{padding:22px 0 6px}
.rn-hero h1{font-size:1.45rem;line-height:1.5;margin:6px 0 8px}
.rn-hero p{font-size:.92rem;color:var(--sub);margin:0;max-width:38rem}
.rn-kicker{font-size:.76rem;font-weight:700;letter-spacing:.06em;color:var(--sub)}

/* 続きから */
.rn-resume{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--cta,#F7AA34);border-radius:12px;padding:14px 16px;margin:18px 0 0}
.rn-resume[hidden]{display:none}
.rn-resume .t{flex:1;min-width:180px}
.rn-resume .t b{display:block;font-size:.98rem}
.rn-resume .t span{font-size:.8rem;color:var(--sub)}
.rn-resume .btn{width:auto;display:inline-block;padding:11px 18px;font-size:.9rem;margin:0}
.lnk{background:none;border:none;color:var(--sub);font-family:var(--jp-sans);font-size:.8rem;text-decoration:underline;cursor:pointer;padding:6px}
.lnk:hover{color:var(--aka,var(--shu))}

/* 記録の要約と近道 */
.rn-sum{margin-top:18px}
.rn-sum .stats{margin-top:0}
.rn-sum .stats .st .l{font-size:.72rem;color:var(--sub);margin-top:2px}
.rn-quick{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.rn-quick button,.mini{background:var(--card);border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font-family:var(--jp-sans);font-size:.84rem;font-weight:700;color:var(--ink);cursor:pointer}
.rn-quick button:hover,.mini:hover{border-color:var(--ink)}
.rn-quick button:disabled,.mini:disabled{opacity:.45;cursor:default;border-color:var(--line)}
.rn-quick .link{border:none;background:none;text-decoration:underline;color:var(--sub);font-weight:500}

/* 出題設定 */
.rn-set{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px 16px;margin-top:18px}
.rn-set h2{font-size:1.06rem;margin:0 0 12px}
.rn-row{margin:14px 0 0}
.rn-row .lbl{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:.8rem;font-weight:700;color:var(--sub);margin-bottom:8px}
.rn-row .lbl small{font-weight:500;flex:1 1 auto;min-width:0}
.rn-row .lbl .r{margin-left:auto;display:flex;gap:12px;flex:none}
.rn-row .lbl .r button{background:none;border:none;color:var(--sub);font-family:var(--jp-sans);font-size:.76rem;text-decoration:underline;cursor:pointer;padding:0;white-space:nowrap}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{background:var(--paper);border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font-family:var(--jp-sans);font-size:.88rem;font-weight:700;color:var(--ink);cursor:pointer;min-height:40px}
.seg button:hover{border-color:var(--ink)}
.seg button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.seg.exam button{padding:10px 18px;font-size:.95rem}
.seg.exam button small{font-weight:500;opacity:.8;margin-left:4px}
.rn-note{font-size:.78rem;color:var(--sub);margin:8px 0 0}

.un-cat{border:1px solid var(--line);border-radius:10px;margin-top:8px;background:var(--paper);overflow:hidden}
.un-row{display:flex;align-items:center;gap:10px;padding:10px 12px}
.un-lbl{display:flex;align-items:center;gap:10px;flex:1;min-width:0;cursor:pointer;font-weight:700;font-size:.95rem}
.un-lbl input,.un-item input{width:20px;height:20px;flex:none;accent-color:var(--brand,var(--shu));cursor:pointer}
.un-no{flex:none;font-size:.7rem;font-weight:700;color:var(--sub);border:1px solid var(--line);border-radius:999px;padding:1px 8px;background:var(--card)}
.un-name{min-width:0}
.un-meta{flex:none;font-size:.76rem;color:var(--sub);font-variant-numeric:tabular-nums;white-space:nowrap}
.un-tgl{flex:none;background:var(--card);border:1px solid var(--line);border-radius:8px;width:34px;height:34px;font-size:1rem;color:var(--ink);cursor:pointer}
.un-list{border-top:1px dashed var(--line);padding:4px 12px 8px 14px;background:var(--card)}
.un-item{display:flex;align-items:center;gap:10px;padding:7px 0;cursor:pointer;font-size:.9rem;border-bottom:1px solid var(--slate-soft)}
.un-item:last-child{border-bottom:none}
.un-item .un-t{flex:1;min-width:0}
.rn-cnt{margin:18px 0 0;font-size:.9rem;color:var(--ink)}
.rn-cnt b{font-family:var(--jp-serif);font-size:1.1rem}
.rn-start{margin-top:10px}
.rn-start .btn{font-size:1.06rem;padding:16px}
.rn-start .btn:disabled{opacity:.45;cursor:default}
.rn-keys{font-size:.76rem;color:var(--sub);margin:10px 0 0}

/* 出題中 */
.rn-bar{position:sticky;top:var(--hd-h,56px);z-index:10;background:var(--paper);border-bottom:1px solid var(--line);padding:10px 0 8px;margin-bottom:12px}
.rn-bar .top{display:flex;align-items:center;gap:12px}
.rn-bar .num{font-family:var(--jp-serif);font-weight:700;font-size:1.02rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.rn-bar .num span{font-size:.82rem;color:var(--sub);font-weight:500}
.rn-bar .score{font-size:.82rem;color:var(--sub);font-variant-numeric:tabular-nums;white-space:nowrap}
.rn-bar .label{flex:1;min-width:0;font-size:.74rem;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}
.rn-bar .exit{flex:none}
.rn-bar .track{height:5px;border-radius:3px;background:var(--slate-soft);overflow:hidden;margin-top:8px}
.rn-bar .track i{display:block;height:100%;width:0;background:var(--ink);border-radius:3px;transition:width .25s ease}
.q-where{font-size:.74rem;color:var(--sub)}
.chk{margin-left:auto;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-family:var(--jp-sans);font-size:.76rem;color:var(--sub);cursor:pointer;white-space:nowrap}
.chk:hover{border-color:var(--ink);color:var(--ink)}
.chk.on{background:var(--cta,#F7AA34);border-color:var(--cta,#F7AA34);color:#3A0900;font-weight:700}
.rn-nav{display:flex;gap:10px;margin-top:16px}
.rn-nav .btn{flex:1 1 0;width:auto;margin:0;padding:14px 8px;font-size:.95rem}
.rn-nav .btn+.btn{margin-top:0}
.rn-nav .btn:disabled{opacity:.38;cursor:default}
.rn-nav .btn.primary:disabled{opacity:.25}
.rn-nav .prev{flex:0 0 120px}
.rev-chk{color:#3A0900;background:var(--wash,#FFF0DD);border-radius:999px;padding:1px 8px;font-size:.78rem}
.res-actions .btn{margin-top:10px}
.res-actions .btn[hidden]{display:none}

/* 学習の記録 */
.rn-his h1{font-size:1.35rem;margin:6px 0 10px}
.hi-cat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 14px 12px;margin-top:12px}
.hi-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hi-head b{font-size:1rem}
.hi-head .un-meta{margin-left:auto}
.hi-bar{display:flex;height:8px;border-radius:4px;background:var(--slate-soft);overflow:hidden;margin:10px 0}
.hi-bar i{display:block;height:100%}
.hi-bar i.ok{background:var(--ok)}
.hi-bar i.ng{background:var(--ng)}
.hi-acts{display:flex;gap:6px;flex-wrap:wrap}
.hi-units{margin-top:10px;border-top:1px dashed var(--line);padding-top:6px}
.hi-unit{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:.88rem;border-bottom:1px solid var(--slate-soft)}
.hi-unit:last-child{border-bottom:none}
.hi-unit .un-t{flex:1;min-width:0}
.hi-unit .mini{padding:4px 12px;font-size:.78rem}
.hi-grid{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px}
.hi-grid .cell{width:38px;height:28px;border:1px solid var(--line);border-radius:6px;background:var(--paper);font-family:var(--jp-sans);font-size:.68rem;color:var(--sub);cursor:pointer;font-variant-numeric:tabular-nums;padding:0}
.hi-grid .cell.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.hi-grid .cell.ng{background:var(--ng);border-color:var(--ng);color:#fff}
.hi-grid .cell.chk{box-shadow:0 0 0 2px var(--cta,#F7AA34) inset}
.hi-grid .cell:hover{outline:2px solid var(--ink);outline-offset:1px}
.hi-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.76rem;color:var(--sub);margin:12px 0 0}
.hi-legend i{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid var(--line);vertical-align:-2px;margin-right:4px;background:var(--paper)}
.hi-legend i.ok{background:var(--ok);border-color:var(--ok)}
.hi-legend i.ng{background:var(--ng);border-color:var(--ng)}
.hi-legend i.chk{box-shadow:0 0 0 2px var(--cta,#F7AA34) inset}
.hi-foot{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;align-items:center}

@media (max-width:600px){
  .rn-set{padding:14px 12px 12px}
  .rn-row .lbl small{flex-basis:100%;order:3}
  .un-row{padding:9px 8px}
  .un-lbl{font-size:.9rem}
  .un-meta .un-acc{display:none}
  .seg button{padding:8px 12px;font-size:.84rem}
  .rn-bar .label{display:none}
  .hi-grid .cell{width:34px}
}