.strip svg.frame{display:block;width:100%;height:auto;border-radius:3px;background:#8fd0f0}
.clip{overflow:hidden;border-radius:3px}

.ctrl{margin-top:12px}
.ctrl label{display:flex;justify-content:space-between;gap:12px;font-family:var(--display);font-size:1.1rem}
.ctrl label b{font-variant-numeric:tabular-nums}
output{display:block;min-height:3.1em;font-weight:600;margin-top:4px}
.rule output{margin-top:12px}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.wrap input[type=range]:disabled{opacity:.4;cursor:not-allowed}

.shutter{background:var(--wax);color:#18203a;border-color:#18203a;font-size:1.1rem;padding:12px 24px}
.lot{min-height:9.5em;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:8px 14px}
.lotT{font:800 clamp(1.9rem,5vw,2.7rem)/1.05 var(--display);color:var(--wax);margin:0}
.lotC{color:var(--film-ink);font-size:1.1rem;margin:0}

.sub{font-weight:600;margin-top:14px}
.field{display:block;font-family:var(--display);font-size:1.1rem;margin:14px 0 6px}
input[type=text]{font:inherit;color:var(--ink);background:var(--panel);border:2px solid var(--ink);border-radius:10px;padding:10px 14px;width:100%;max-width:26em}
.plan{background:var(--panel);border-radius:10px;padding:20px 24px;border-left:8px solid var(--wax)}
.plan h3{margin-bottom:8px}
.plan ol{margin:8px 0 0;padding-left:1.3em}
.plan li{margin-bottom:6px}
.plrule{font-weight:600;margin:0 0 8px}

.quiz{background:var(--panel);border-radius:10px;padding:24px 26px;max-width:720px;margin-bottom:44px}
.qnum{color:var(--soft);font-weight:600}
.qtext{font-family:var(--display);font-size:1.4rem;line-height:1.2;margin-top:4px}
.qopts{display:grid;gap:10px;margin:14px 0}
.qopts button{border-radius:12px;text-align:left;padding:12px 16px}
.qopts button:disabled{cursor:default;color:var(--ink);opacity:1}
.qopts button.right{background:var(--yes);color:var(--bg);border-color:var(--yes)}
.qopts button.wrong{background:var(--no);color:var(--bg);border-color:var(--no)}
.qmsg{font-weight:600;min-height:3.1em;margin-bottom:10px}

@media (max-width:760px){
  .quiz{padding:18px 16px}
  .qtext{font-size:1.2rem}
  .btns{gap:8px}
  .btns button{padding:8px 14px}
}