/* Random-practice setup: compact configuration sheet backed by real quiz data. */
body.custom-setup-open{overflow:hidden}
body.custom-setup-open .quiz-page{animation:none!important;transform:none!important}
body.custom-setup-open #quizNav::before{
  content:"";
  position:fixed;
  z-index:1790;
  inset:0;
  background:rgba(10,26,31,.58);
  backdrop-filter:blur(4px);
}
.cs-page{
  position:fixed;
  z-index:1800;
  top:50%;
  left:50%;
  width:min(760px,calc(100vw - 32px));
  max-height:min(86vh,820px);
  margin:0;
  padding:0 24px 18px;
  overflow:auto;
  overscroll-behavior:contain;
  transform:translate(-50%,-50%);
  border:1px solid rgba(72,145,153,.28);
  border-radius:18px;
  color:var(--t);
  background:color-mix(in srgb,var(--card) 96%,#edf8f6);
  box-shadow:0 34px 100px rgba(5,35,42,.32);
}
.cs-modal-head{
  position:sticky;
  z-index:4;
  top:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 -24px 4px;
  padding:16px 20px 14px 24px;
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--card) 96%,#edf8f6);
}
.cs-modal-head .cs-title{margin:0}
.cs-modal-head .cs-title b{font-size:20px}
.cs-close{
  flex:0 0 40px;
  width:40px;height:40px;
  border:0;border-radius:50%;
  color:var(--t2);background:transparent;
  font:300 30px/1 system-ui,sans-serif;
}
.cs-close:hover{color:var(--t);background:var(--card2)}
.cs-step{padding-top:2px}
.cs-step>header{margin-bottom:10px}
.cs-all-subjects{margin-bottom:9px}
.cs-subjects .qs-item{min-height:72px;padding:12px 14px}
.cs-subjects .qs-sub{display:none}
.cs-subjects .qs-progress{font-size:11px}
.cs-chapter-picker{
  margin-top:18px;
  border:1px solid var(--line);
  border-radius:12px;
  background:color-mix(in srgb,var(--card) 92%,transparent);
}
.cs-chapter-picker>summary{
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  padding:13px;
  cursor:pointer;
  list-style:none;
}
.cs-chapter-picker>summary::-webkit-details-marker{display:none}
.cs-chapter-picker>summary>span{
  display:grid;place-items:center;width:28px;height:28px;
  border:1px solid rgba(72,145,153,.25);border-radius:7px;
  color:#5fa1aa;font:700 12px Georgia,serif;
}
.cs-chapter-picker>summary>div{display:grid;gap:2px}
.cs-chapter-picker>summary b{font-size:15px}
.cs-chapter-picker>summary small{color:var(--t3);font-size:12px}
.cs-chapter-picker>summary i{color:var(--t3);font-size:12px;font-style:normal}
.cs-chapter-picker[open]>summary i{font-size:0}
.cs-chapter-picker[open]>summary i::after{content:"收起";font-size:12px}
.cs-chapter-picker-body{padding:0 12px 12px}
.cs-chapter-block:first-child{margin-top:0}
.cs-custom-count{
  position:relative;
  display:inline-grid;
  grid-template-columns:58px auto;
  align-items:center;
  min-height:38px;
  padding:0 11px;
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--t3);
  background:var(--card);
}
.cs-custom-count.on{border-color:#3a9889;background:rgba(38,139,121,.1)}
.cs-custom-count input{
  width:52px;
  padding:0 7px 0 0;
  border:0;
  outline:0;
  color:var(--t);
  background:transparent;
  font:700 13px Georgia,serif;
}
.cs-custom-count span{font-size:12px}
.cs-summary{
  z-index:3;
  bottom:-18px;
  margin:24px -24px -18px;
  padding:13px 24px calc(13px + env(safe-area-inset-bottom,0px));
  border-width:1px 0 0;
  border-radius:0 0 18px 18px;
}

@media(max-width:700px){
  .cs-page{
    top:auto;
    bottom:0;
    left:0;
    width:100%;
    max-height:94svh;
    padding:0 14px 14px;
    transform:none;
    border-width:1px 0 0;
    border-radius:20px 20px 0 0;
  }
  .cs-modal-head{margin:0 -14px 3px;padding:13px 12px 11px 16px}
  .cs-modal-head .cs-title span{display:none}
  .cs-step{margin-top:14px}
  .cs-subjects{grid-template-columns:1fr 1fr}
  .cs-subjects .qs-item{
    min-height:64px;
    grid-template-columns:34px minmax(0,1fr) 26px;
    gap:8px;
    padding:9px;
  }
  .cs-subjects .qs-code{width:32px;height:32px;font-size:10px}
  .cs-subjects .qs-info b{font-size:12px;line-height:1.35}
  .cs-subjects .qs-progress{display:none}
  .cs-item .cs-check{width:26px;height:26px}
  .cs-pills{gap:7px}
  .cs-pill{padding:8px 12px;font-size:12px}
  .cs-summary{
    bottom:-14px;
    margin:20px -14px -14px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));
    border-radius:0;
  }
  .cs-summary-info{gap:4px 10px;font-size:11px}
  .cs-summary-info span:nth-child(2),
  .cs-summary-info span:nth-child(4){display:none}
  .cs-start{min-width:116px}
}