:root{--ink:#17324d;--muted:#5b6c7f;--paper:#fff;--line:#d8e2ec;--red:#d94c57;--red2:#a92639;--blue:#3478c8;--green:#17795a;--amber:#d48212;--cream:#fff8e8;--shadow:0 12px 34px rgba(23,50,77,.12);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-width:320px;color:var(--ink);background:linear-gradient(135deg,#f9f6ed,#edf4fb)}button,input,select{font:inherit}button{touch-action:manipulation}.skip{position:fixed;top:-5rem;left:1rem;z-index:99;padding:.7rem 1rem;background:white;color:var(--ink);border-radius:.5rem}.skip:focus{top:.5rem}.topbar{min-height:72px;padding:.7rem clamp(.75rem,3vw,2rem);display:grid;grid-template-columns:1fr minmax(250px,400px);gap:1.5rem;align-items:center;background:linear-gradient(120deg,#122a43,#204b71);color:#fff}.topbar p{margin:0 0 .15rem;color:#ffd887;font-size:.68rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.topbar h1{margin:0;font:700 clamp(1.35rem,3vw,2rem)/1.05 Georgia,serif}.progress>div:first-child{display:flex;justify-content:space-between;font-size:.78rem}.progress strong{color:#ffd887}.track{height:9px;margin-top:.35rem;overflow:hidden;background:rgba(255,255,255,.2);border-radius:999px}.track i{display:block;height:100%;width:0;background:#ffd887;transition:width .25s}.workspace{width:min(1280px,calc(100% - 1rem));margin:.65rem auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(390px,.8fr);gap:.65rem;align-items:start}.model-card,.task-card{background:rgba(255,255,255,.97);border:1px solid #cfdae5;border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.stem{min-height:70px;padding:.7rem 1rem;display:grid;grid-template-columns:42px 1fr;gap:.8rem;align-items:center;border-bottom:1px solid var(--line)}.stem h2{margin:0;font-size:1.05rem}.stem p{margin:.22rem 0 0;font-size:.84rem;line-height:1.35}.bag-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#f7d09a;background:#b8793c;border:3px solid #855027;box-shadow:inset 0 -8px 12px rgba(70,36,10,.18)}.model-view{padding:.8rem 1rem}.model-toolbar{display:grid;grid-template-columns:auto auto 1fr;gap:.6rem;align-items:center}.model-toolbar>label{font-weight:800;font-size:.82rem}.stepper{display:grid;grid-template-columns:44px 58px 44px}.stepper button,.stepper input,.add-btn{min-height:44px;border:1px solid #b9c8d7}.stepper button{font-size:1.2rem;background:#eef4fa;color:var(--ink);cursor:pointer}.stepper button:first-child{border-radius:9px 0 0 9px}.stepper button:last-child{border-radius:0 9px 9px 0}.stepper input{width:58px;text-align:center;border-left:0;border-right:0;font-weight:900;color:var(--ink)}.add-btn{justify-self:end;border:0;border-radius:9px;padding:.35rem .8rem;background:#8f2634;color:white;font-weight:800;cursor:pointer}.add-btn span{display:inline-grid;place-items:center;width:29px;height:29px;margin-right:.35rem;border-radius:50%;background:white;color:#8f2634}.bag-flow{display:grid;grid-template-columns:1fr auto 1fr;gap:.6rem;align-items:center;margin:.7rem 0}.bag-panel{padding:.65rem .8rem;border:1px solid var(--line);border-radius:12px;background:#f7fafc}.bag-panel.after{background:#fff6f5;border-color:#f0c8cc}.bag-panel small,.draw-card small{display:block;color:var(--muted);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.count-line{display:flex;align-items:center;gap:.42rem;margin:.35rem 0}.count-line strong{font-size:1.65rem;line-height:1}.minor-counts{display:flex;flex-wrap:wrap;gap:.65rem;color:var(--muted);font-size:.72rem}.minor-counts span{display:flex;align-items:center;gap:.25rem}.dot{display:inline-block;width:17px;height:17px;border-radius:50%;border:2px solid rgba(23,50,77,.3);box-shadow:inset -3px -3px 5px rgba(0,0,0,.14),inset 2px 2px 4px rgba(255,255,255,.55)}.dot.red{background:#e04b58}.dot.white{background:#fffdf5}.dot.blue{background:#3f82d1}.arrow{font-size:1.4rem;font-weight:900;color:#8191a2}.target{font-weight:800;color:#8f2634}.probability-readout{min-height:58px;padding:.55rem .7rem;display:flex;align-items:center;justify-content:center;gap:.6rem;background:var(--cream);border:1px solid #ecddba;border-radius:12px;font-size:.82rem}.fraction{display:inline-grid;grid-template-rows:auto auto;text-align:center;vertical-align:middle}.fraction b:first-child{padding:0 .35rem .15rem;border-bottom:2px solid currentColor}.fraction b:last-child{padding:.15rem .35rem 0}.probability-readout .fraction{font-size:1.08rem}.probability-readout>strong{margin-left:auto;padding:.32rem .55rem;border-radius:999px;background:#fff0e5;color:#8b3d0d;font-size:.7rem}.probability-readout>strong.match{background:#e8f7f0;color:#126347}.draw-stage{display:grid;grid-template-columns:1fr auto 1fr;gap:.6rem;align-items:center}.draw-card{padding:.7rem;border:1px solid var(--line);border-radius:12px;background:#f8fafc}.draw-card.changed{background:#fff8e8}.draw-card>.counts{display:flex;gap:.55rem;flex-wrap:wrap;margin:.45rem 0;font-size:.76rem}.draw-card>.counts span{display:flex;align-items:center;gap:.22rem}.draw-btn{min-height:48px;padding:.45rem .65rem;border:0;border-radius:10px;background:#8f2634;color:white;font-weight:800;cursor:pointer}.chain{margin-top:.8rem;padding:.65rem .8rem;background:#edf5ff;border-radius:12px;display:grid;grid-template-columns:auto auto 1fr;gap:.55rem;align-items:center;font-size:.82rem}.chain strong{font-size:1.05rem}.chain em{font-size:.72rem;color:var(--muted)}.history-panel{border-top:1px solid var(--line);font-size:.76rem}.history-panel summary{min-height:44px;padding:.7rem 1rem;cursor:pointer;font-weight:800}.history-panel ol{margin:0;padding:0 1.5rem .8rem 2.5rem;color:var(--muted);line-height:1.45}.task-card{padding:.75rem}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.tab{min-height:46px;padding:.45rem .6rem;border:1px solid var(--line);border-radius:10px;background:#f4f7fa;color:var(--muted);font-weight:800;cursor:pointer}.tab span{display:inline-grid;place-items:center;width:27px;height:27px;margin-right:.25rem;border-radius:8px;background:#dde7f0;color:var(--ink)}.tab b{float:right;margin-top:.2rem}.tab.active{background:#eaf3fc;color:var(--ink);border-color:#97b9da}.tab.active span{background:#204b71;color:white}.tab.done b{color:var(--green)}.question-pane{padding:.75rem .2rem .2rem}.question-head{display:flex;align-items:start;justify-content:space-between;gap:.7rem}.question-head small{font-size:.67rem;color:var(--blue);font-weight:900;letter-spacing:.08em}.question-head h2{margin:.18rem 0 0;font:700 1.25rem/1.12 Georgia,serif}.question-head>span{padding:.3rem .5rem;border-radius:999px;background:#f4f7fa;color:var(--muted);font-size:.68rem;font-weight:800;white-space:nowrap}.equation-cue{min-height:58px;margin:.65rem 0;display:flex;align-items:center;justify-content:center;gap:.85rem;background:var(--cream);border-radius:10px;font-size:1rem}.factor-builder{margin:.65rem 0;display:grid;grid-template-columns:1fr auto 1fr;gap:.5rem;align-items:end}.factor-builder label{font-size:.7rem;font-weight:800;color:var(--muted)}.factor-builder select{display:block;width:100%;min-height:44px;margin-top:.25rem;padding:.4rem;border:1px solid #b8c6d4;border-radius:8px;background:white;color:var(--ink)}.factor-builder>span{align-self:end;padding-bottom:.65rem;font-weight:900}.answer-label{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:center;font-size:.78rem;font-weight:800}.answer-label input{width:100%;min-height:46px;padding:.55rem .7rem;border:2px solid #b8c6d4;border-radius:9px;color:var(--ink)}.answer-label input.good{border-color:var(--green);background:#f2fbf7}.answer-label input.bad{border-color:var(--red);background:#fff6f6}.confidence{margin:.55rem 0 0;padding:0;border:0;display:flex;gap:.35rem;align-items:center}.confidence legend{float:left;margin:.35rem .35rem 0 0;font-size:.68rem;font-weight:800;color:var(--muted)}.confidence button{min-height:36px;padding:.25rem .55rem;border:1px solid #c5d1dc;border-radius:8px;background:white;color:var(--muted);font-size:.68rem;cursor:pointer}.confidence button.selected{background:#204b71;color:white;border-color:#204b71}.actions{display:grid;grid-template-columns:1fr 2fr;gap:.5rem;margin-top:.6rem}.actions button,.finish,.reset,.navigation button{min-height:44px;border-radius:9px;font-weight:800;cursor:pointer}.secondary,.navigation button,.reset{border:1px solid #c6d1dc;background:#f2f6fa;color:var(--ink)}.primary,.finish{border:0;background:#204b71;color:#fff;box-shadow:0 4px 0 #102a42}.hint,.feedback{margin-top:.55rem;padding:.6rem .7rem;border-radius:9px;font-size:.78rem;line-height:1.4}.hint{background:#edf5ff;border-left:4px solid var(--blue)}.feedback:empty{display:none}.feedback.success{background:#eaf8f1;color:#105d43;border:1px solid #a8dcc8}.feedback.error{background:#fff3ec;color:#7b370e;border:1px solid #f0c2a6}.feedback strong{display:block}.navigation{display:flex;justify-content:space-between;margin-top:.55rem}.navigation button{min-width:100px;padding:.3rem .65rem}.navigation button:disabled{opacity:.4;cursor:not-allowed}.finish-row{display:grid;grid-template-columns:1fr auto auto;gap:.45rem;align-items:center;padding:.65rem .2rem 0;border-top:1px solid var(--line)}.finish-row p{margin:0;color:var(--muted);font-size:.72rem}.finish,.reset{padding:.4rem .75rem}.finish:disabled{opacity:.45;box-shadow:none;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid rgba(52,120,200,.28);outline-offset:2px}dialog{width:min(720px,calc(100% - 1rem));padding:0;border:0;border-radius:14px;color:var(--ink);box-shadow:0 26px 80px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(12,27,42,.65)}.dialog-head{padding:1rem 1.2rem;display:flex;justify-content:space-between;background:#eef4fa}.dialog-head small{font-size:.67rem;font-weight:900;color:var(--blue)}.dialog-head h2{margin:.1rem 0 0}.dialog-close{width:44px;height:44px;border:1px solid var(--line);border-radius:9px;background:white;font-size:1.4rem;cursor:pointer}#learnerSummary{padding:1rem 1.2rem}.summary-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.summary-cards div{padding:.7rem;background:#f3f7fb;border-radius:10px;text-align:center}.summary-cards strong{display:block;font-size:1.3rem}.summary-table{width:100%;margin-top:.8rem;border-collapse:collapse;font-size:.78rem}.summary-table th,.summary-table td{padding:.55rem;border-bottom:1px solid var(--line);text-align:left}.summary-note{margin-top:.75rem;padding:.7rem;background:var(--cream);border-left:4px solid #e0a72d}@media(max-width:880px){.workspace{grid-template-columns:1fr}.topbar{grid-template-columns:1fr minmax(210px,320px)}.model-card,.task-card{box-shadow:0 8px 22px rgba(23,50,77,.1)}}@media(max-width:600px){.topbar{grid-template-columns:1fr;gap:.45rem}.workspace{margin:.45rem auto}.model-toolbar{grid-template-columns:1fr auto}.add-btn{grid-column:1/-1;width:100%}.bag-flow,.draw-stage{grid-template-columns:1fr}.arrow{text-align:center;transform:rotate(90deg)}.chain{grid-template-columns:1fr 1fr}.chain em{grid-column:1/-1}.question-head>span{display:none}.answer-label{grid-template-columns:1fr}.finish-row{grid-template-columns:1fr 1fr}.finish-row p{grid-column:1/-1}.summary-cards{grid-template-columns:1fr}.summary-table{font-size:.7rem}}@media(max-height:520px) and (min-width:881px){.topbar{min-height:62px;padding:.5rem 1rem}.stem{min-height:60px;padding:.55rem .8rem}.model-view{padding:.55rem .8rem}.bag-flow{margin:.5rem 0}.question-pane{padding:.55rem .15rem .1rem}.equation-cue{min-height:50px;margin:.45rem 0}.confidence{margin-top:.4rem}.actions{margin-top:.45rem}.history-panel{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media(prefers-contrast:more){.model-card,.task-card{border:2px solid #243c54}button,input,select{border-color:#243c54!important}}