/* AnaPhyNest — mobile-first styles. Warm Reviewers' Nest palette; Anatomy = terracotta, Physiology = teal. */
:root{
  --ground:#FBF6EE; --card:#FFFCF6; --line:#EADFCC; --ink:#3B2414; --muted:#6E5E52;
  --accent:#A65A1A; --accent-d:#7A3F0E; --accent-soft:#F6E3CF;
  --ana:#B4542B; --ana-soft:#FBE6DA; --phy:#1F7A8C; --phy-soft:#DDF0F2;
  --ok:#2F7D46; --ok-soft:#E1F2E5; --bad:#B3261E; --bad-soft:#FBE3E0; --why:#4F6F52; --why-soft:#E8F0E6;
  --serif:'Fraunces',Georgia,serif; --sans:'DM Sans',system-ui,-apple-system,sans-serif; --display:'Bricolage Grotesque','DM Sans',sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--ground);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
a{color:var(--accent-d)}
h1,h2,h3{font-family:var(--serif);line-height:1.15;margin:0 0 .35em;letter-spacing:-.01em}
h1{font-size:clamp(24px,6vw,32px)} h2{font-size:20px} h3{font-size:17px}
p{margin:0 0 .8em}
.rn-small{font-size:14px}.rn-muted{color:var(--muted)}
.rn-spin{display:inline-block;width:26px;height:26px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;margin:0 0 14px}
button{font:inherit;color:inherit}
.b-main,.b-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 18px;border-radius:12px;font:600 15px var(--sans);text-decoration:none;cursor:pointer;border:1px solid var(--accent);transition:transform .1s}
.b-main{background:var(--accent);color:#fff}.b-main:hover{background:var(--accent-d)}
.b-main:disabled,.b-main[disabled]{opacity:.45;cursor:not-allowed}
.b-ghost{background:var(--card);color:var(--accent-d);border-color:var(--line)}.b-ghost:hover{border-color:var(--accent)}
.b-main:active,.b-ghost:active{transform:scale(.98)}
.sm{min-height:36px;padding:6px 12px;font-size:14px}
.wide{width:100%;margin-top:8px}
:focus-visible{outline:3px solid #E7B27C;outline-offset:2px}
.btn-row{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}.btn-row.sm{margin:8px 0 0}
.back{display:inline-block;margin:4px 0 10px;text-decoration:none;font-weight:600;font-size:15px}
.sec-h{font-size:18px;margin:18px 0 10px}

/* shell */
.ap-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:rgba(251,246,238,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.ap-brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font:800 20px var(--display);letter-spacing:-.03em}
.ap-brand b{color:var(--accent)}
.ap-logo{width:30px;height:30px}.ap-logo.big{width:64px;height:64px}
.ap-top-r{display:flex;align-items:center;gap:8px}
.xp-chip{background:var(--accent-soft);color:var(--accent-d);font:700 13px var(--sans);padding:5px 10px;border-radius:999px}
.ap-icon-btn{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:12px;color:var(--ink)}
.ap-icon-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}
.ap-main{max-width:820px;margin:0 auto;padding:14px 16px 24px}
.ap-loading{display:flex;justify-content:center;padding:60px 0}
.ap-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:space-around;background:var(--card);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.ap-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--muted);font:600 12px var(--sans);padding:4px 0;border-radius:10px}
.ap-nav svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ap-nav a.on{color:var(--accent)}
.ap-preview{background:#FFF1D6;color:#7A5A00;text-align:center;font:600 14px var(--sans);padding:6px}
.ap-gate{max-width:440px;margin:40px auto;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}
.ap-gate h1{font:800 34px var(--display);letter-spacing:-.03em}.ap-gate h1 b{color:var(--accent)}
.ap-toast{position:fixed;left:50%;bottom:calc(88px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--ink);color:#fff;padding:10px 16px;border-radius:14px;font-size:15px;max-width:calc(100% - 32px);z-index:60;transition:.25s;text-align:center}
.ap-toast.show{opacity:1;transform:translate(-50%,0)}.ap-toast.xp{background:var(--accent-d)}.ap-toast.err{background:var(--bad)}
.ap-lock{border-color:#E7B27C;background:#FFF6EA}.ap-lock .b-main{margin-right:8px}

/* home */
.hello h1{margin-top:6px}
.streak{color:var(--accent-d);font-weight:600}
.cont{display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit;border-left:6px solid var(--c)}
.cont-m{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.cont-m b{font:700 18px var(--serif)}
.cont-go{font-size:28px;color:var(--muted)}
.eyebrow{font:700 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.sys-ico{width:38px;height:38px;flex:none;fill:none;stroke:var(--c);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;background:color-mix(in srgb,var(--c) 12%,#fff);border-radius:12px;padding:6px}
.pbar{display:block;height:8px;border-radius:99px;background:#EFE5D6;overflow:hidden;flex:1;min-width:40px}
.pbar i{display:block;height:100%;border-radius:inherit;background:var(--c,var(--accent));transition:width .6s}
.seg{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.seg button{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 14px;font-weight:600;font-size:14px;cursor:pointer}
.seg button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.plan{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:6px}
.plan li{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.plan li span:first-child{flex:1;font-weight:600}
.plan li.done span:first-child::before{content:"✓ ";color:var(--ok)}
.sys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.sys{display:flex;flex-direction:column;gap:6px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;text-decoration:none;color:inherit}
.sys-n{font-weight:700;font-size:15px}
.sys-p{font-size:13px;color:var(--muted);font-weight:600}
.sys.locked,.sys-row.locked{opacity:.6}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.act{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit;margin:0}
.act-i{font-size:24px}
.act.done{opacity:.7}
.prog-mini{display:block;text-decoration:none;color:inherit;margin-top:14px}
.prog-mini .sec-h{margin-top:0}
.pm-row{display:grid;grid-template-columns:minmax(0,132px) 1fr 48px;gap:10px;align-items:center;margin:8px 0;text-decoration:none;color:inherit;font-size:15px}
.pm-row span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-row b{text-align:right}
.lvl{display:grid;gap:4px;margin-top:12px}
.link{color:var(--accent-d);font-weight:600}
.onb .choice,.choice{display:grid;gap:8px;margin-bottom:8px}
.opt-card{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);background:var(--card);border-radius:14px;padding:12px;cursor:pointer}
.opt-card input{margin-top:4px;accent-color:var(--accent);width:18px;height:18px}
.opt-card span{display:flex;flex-direction:column}
.opt-card:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.switch{display:flex;gap:10px;align-items:center;cursor:pointer}.switch input{width:20px;height:20px;accent-color:var(--accent)}
.links{display:flex;flex-direction:column;gap:10px}.links .b-ghost{align-self:flex-start}

/* explore and systems */
.sys-list{display:grid;gap:10px}
.sys-row{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;margin:0}
.sr-m{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.sys-head{display:flex;gap:14px;align-items:center;margin-bottom:10px}.sys-head>div{flex:1}.sys-head .sys-ico{width:56px;height:56px;padding:10px}
.topics{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.topic{display:flex;gap:12px;margin:0}
.t-n{flex:none;width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);display:flex;align-items:center;justify-content:center;font-weight:800}
.topic.done .t-n{background:var(--ok);color:#fff}
.t-m{flex:1;min-width:0}.t-m p{margin:2px 0 6px}
.hy{background:#FFF1D6;color:#8A5A00;font:700 11px var(--sans);text-transform:uppercase;letter-spacing:.05em;padding:2px 7px;border-radius:6px;vertical-align:middle}
.free{background:var(--ok-soft);color:var(--ok);font:700 11px var(--sans);text-transform:uppercase;padding:2px 7px;border-radius:6px}
.halves{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.half{font:700 12px var(--sans);padding:3px 9px;border-radius:999px;border:1.5px solid;opacity:.55}
.half.a{color:var(--ana);border-color:var(--ana)}.half.p{color:var(--phy);border-color:var(--phy)}
.half.on{opacity:1}.half.a.on{background:var(--ana);color:#fff}.half.p.on{background:var(--phy);color:#fff}
.soon{color:var(--accent-d);font-style:italic}

/* lesson */
.les-head{border-left:6px solid var(--c);padding-left:12px;margin-bottom:12px}
.halftabs{position:sticky;top:58px;z-index:20;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px;background:var(--ground);padding:6px 0 10px}
.ht{display:flex;flex-direction:column;align-items:center;border-radius:14px;padding:8px 6px;cursor:pointer;border:2px solid var(--line);background:var(--card);line-height:1.2}
.ht b{font:800 15px var(--display);letter-spacing:.02em;text-transform:uppercase}.ht span{font-size:12px;color:var(--muted)}
.ht.a b{color:var(--ana)}.ht.p b{color:var(--phy)}.ht.q b{color:var(--accent-d)}
.ht.a.on{background:var(--ana);border-color:var(--ana)}.ht.p.on{background:var(--phy);border-color:var(--phy)}.ht.q.on{background:var(--accent-d);border-color:var(--accent-d)}
.ht.on b,.ht.on span{color:#fff}
.lesson{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;border-top:6px solid var(--ana)}
.lesson.half-p{border-top-color:var(--phy)}.lesson.half-q{border-top-color:var(--accent-d)}
.half-label{font:800 12px var(--sans);letter-spacing:.12em;margin-bottom:8px}.half-label.a{color:var(--ana)}.half-label.p{color:var(--phy)}.half-label.q{color:var(--accent-d)}
.b-h{margin-top:18px}
.b-list,.b-steps{padding-left:22px;margin:0 0 12px}.b-list li,.b-steps li{margin:4px 0}
.b-steps{list-style:none;padding-left:0;counter-reset:s}
.b-steps li{counter-increment:s;position:relative;padding-left:36px;min-height:28px}
.b-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--accent-soft);color:var(--accent-d);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.half-p .b-steps li::before{background:var(--phy-soft);color:var(--phy)}
.b-table{overflow-x:auto;margin:0 0 14px;border:1px solid var(--line);border-radius:12px}
.b-table table{border-collapse:collapse;width:100%;font-size:14px}
.b-table th,.b-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.b-table th{background:#F7EEE2;font-weight:700}
.b-key{background:#FFF6E6;border-left:4px solid #E0A23B;border-radius:10px;padding:10px 12px;margin:0 0 14px}
.b-key b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#8A5A00}
.b-why{background:var(--why-soft);border:1.5px solid #C9DBC4;border-radius:16px;padding:14px;margin:18px 0}
.why-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}.why-h b{font:700 17px var(--serif);color:var(--why)}
.why-tag{margin-left:auto;font:700 11px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--why);border:1px solid #9DB89F;border-radius:999px;padding:2px 8px}
.why-tabs{display:flex;gap:6px;margin:6px 0 8px}
.why-tabs button{border:1.5px solid var(--why);background:transparent;color:var(--why);border-radius:999px;padding:5px 12px;font-weight:700;font-size:14px;cursor:pointer}
.why-tabs button.on{background:var(--why);color:#fff}
.why-p{background:#fff;border-radius:12px;padding:10px 12px}.why-p p:last-child{margin:0}
.b-act{border:2px dashed #E7C9A8;border-radius:16px;padding:12px;margin:16px 0}
.act-h{font:800 13px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin-bottom:6px}
.les-foot{margin:16px 0}
.done-card{text-align:center;display:flex;flex-direction:column;gap:8px;align-items:center}

/* diagrams */
.dg{margin:8px 0 14px}
.cap{font-weight:600;margin:12px 0 6px}
.dg-frame{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;touch-action:pan-y;aspect-ratio:auto}
.dg-frame.zoomed{touch-action:none;cursor:grab}
.dg-stage{transform-origin:center center;transition:transform .05s}
.dg-svg{display:block;width:100%;height:auto;max-height:70vh}
.dg-svg [data-part]{cursor:pointer;transition:opacity .2s,filter .2s}
.dg-svg [data-part]:hover{filter:brightness(1.06)}
.dg-svg .hi,.dg-svg .hi *{filter:drop-shadow(0 0 4px #F5B700) drop-shadow(0 0 2px #F5B700)}
.dg-svg .sel,.dg-svg .sel *{filter:drop-shadow(0 0 3px #1F7A8C) drop-shadow(0 0 6px #1F7A8C)}
.dg-svg .ok,.dg-svg .ok *{filter:drop-shadow(0 0 4px #2F7D46) drop-shadow(0 0 6px #2F7D46)}
.dg-svg .bad,.dg-svg .bad *{filter:drop-shadow(0 0 4px #B3261E) drop-shadow(0 0 6px #B3261E)}
.dg-dimmed [data-part]:not(.hi){opacity:.28}
.dg-dimmed .hi{animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.75}}
.dg-pin circle{fill:var(--ink);stroke:#fff;stroke-width:2}.dg-pin text{fill:#fff;font-family:var(--sans);font-weight:800;pointer-events:none}
.dg-pin{cursor:pointer}.dg-pin.filled circle{fill:var(--phy)}.dg-pin.drop-over circle{fill:var(--accent)}
.dg-pin.ok circle{fill:var(--ok)}.dg-pin.bad circle{fill:var(--bad)}
.dg-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.dg-hint{font-size:13px;color:var(--muted)}
.dg-z{display:flex;gap:4px}.dg-z button{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--card);font-weight:800;font-size:17px;cursor:pointer}
.dg-info{min-height:52px;background:#FFF8EE;border-radius:12px;padding:8px 12px;margin-top:8px;font-size:15px}
.dg-info b{display:block;font-family:var(--serif);font-size:17px}
.dg-parts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.dg-parts button{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:4px 10px;font-size:13px;cursor:pointer}
.dg-parts button.on{background:var(--phy);color:#fff;border-color:var(--phy)}
.dg-note{font-size:12px;color:var(--muted);margin:6px 0 0;font-style:italic}
.locked .dg-svg [data-part]{cursor:default}

/* pathway */
.pw{background:#F4FAFB;border:1.5px solid #B9DCE2;border-radius:16px;padding:12px;margin:16px 0}
.pw-head{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.pw-tag{font:800 11px var(--sans);text-transform:uppercase;letter-spacing:.08em;background:var(--phy);color:#fff;border-radius:6px;padding:2px 7px}
.pw-step{min-height:72px;background:#fff;border-radius:12px;padding:10px 12px;font-size:15px}
.pw-n{display:inline-block;font:800 12px var(--sans);color:var(--phy);margin-right:4px}
.pw-ctl{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.pw-ctl .b-main{border-color:var(--phy);background:var(--phy)}
.pw-dots{order:-1;flex-basis:100%;display:flex;gap:5px;justify-content:center;flex-wrap:wrap;margin-bottom:4px}
.pw-ctl .b-main{margin-left:auto}
.pw-dots i{width:9px;height:9px;border-radius:50%;background:#C7DDE1;cursor:pointer}.pw-dots i.done{background:#8CC1CA}.pw-dots i.on{background:var(--phy);transform:scale(1.3)}

/* questions */
.qcard{position:relative}
.q-top{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.q-kind{font:800 12px var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}
.q-course{font:700 11px var(--sans);border-radius:999px;padding:2px 8px;background:var(--why-soft);color:var(--why)}
.q-timer{margin-left:auto;font:800 15px var(--sans);background:var(--accent-soft);color:var(--accent-d);border-radius:999px;padding:3px 10px}.q-timer.low{background:var(--bad);color:#fff}
.q-scen{background:#F4FAFB;border-left:4px solid var(--phy);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.q-stem{font:600 17px/1.45 var(--sans)}
.opts{display:grid;gap:8px}
.opt{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;text-align:left;width:100%;min-height:48px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);cursor:pointer}
.opt-l{flex:none;width:26px;height:26px;border-radius:8px;background:#F2E8DA;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.opt>span:nth-child(2){flex:1;min-width:0}
.opt.sel{border-color:var(--phy);background:var(--phy-soft)}
.opt.ok{border-color:var(--ok);background:var(--ok-soft)}.opt.bad{border-color:var(--bad);background:var(--bad-soft)}
.opt-note{flex-basis:100%;color:var(--muted);padding-left:36px}
.q-actions{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.q-fb{margin-top:12px;border-radius:14px;padding:12px}
.q-fb.good{background:var(--ok-soft);border:1.5px solid #A7D3B2}.q-fb.nope{background:var(--bad-soft);border:1.5px solid #E8B4AE}.q-fb.saved{background:#F4F0E8}
.fb-h{font:800 17px var(--sans);margin-bottom:4px}.q-fb.good .fb-h{color:var(--ok)}.q-fb.nope .fb-h{color:var(--bad)}
.xp{font:700 13px var(--sans);background:var(--accent);color:#fff;border-radius:999px;padding:2px 8px;margin-left:6px}
.q-right{background:#fff;border-radius:12px;padding:8px 12px;margin-top:8px;font-size:15px}.q-right ol{margin:4px 0 0;padding-left:20px}
.chip{border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:7px 12px;font-weight:600;font-size:14px;cursor:grab;touch-action:none;user-select:none}
.chip.held{border-color:var(--accent);background:var(--accent-soft)}.chip.used{opacity:.35}
.bank,.pool{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.lbl-slots{display:grid;gap:6px;margin-top:8px}
.slot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;text-align:left;border:1.5px dashed #D9C6AE;background:#FFFBF5;border-radius:12px;padding:8px 10px;cursor:pointer;min-height:44px}
.slot-n{width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none}
.slot.filled{border-style:solid;border-color:var(--phy)}.slot.drop-over{border-color:var(--accent);background:var(--accent-soft)}
.slot.ok{border-color:var(--ok);background:var(--ok-soft)}.slot.bad{border-color:var(--bad);background:var(--bad-soft)}
.slot small{flex-basis:100%;padding-left:36px;color:var(--ok);font-weight:700}
.match{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.m-col{display:grid;gap:8px;align-content:start}
.m-a,.m-b{position:relative;text-align:left;border:1.5px solid var(--line);background:var(--card);border-radius:12px;padding:10px 10px 10px 34px;min-height:48px;cursor:pointer;font-size:14px;touch-action:none}
.m-n{position:absolute;left:8px;top:10px;width:20px;height:20px;border-radius:50%;background:#EFE5D6;font:800 12px var(--sans);display:flex;align-items:center;justify-content:center}
.m-a.held{border-color:var(--accent);background:var(--accent-soft)}
.m-a.paired .m-n,.m-b.paired .m-n{background:var(--phy);color:#fff}
.m-b.drop-over{border-color:var(--accent);background:var(--accent-soft)}
.m-a.ok{border-color:var(--ok);background:var(--ok-soft)}.m-a.bad{border-color:var(--bad);background:var(--bad-soft)}
.m-a small{display:block;color:var(--ok);font-weight:700;margin-top:4px}
.sortl{list-style:none;padding:0;margin:8px 0;display:grid;gap:6px}
.sortl li{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:6px 8px;min-height:48px}
.sortl li.lifting{border-color:var(--accent);box-shadow:0 6px 18px -8px rgba(59,36,20,.4)}
.sortl li.ok{border-color:var(--ok);background:var(--ok-soft)}.sortl li.bad{border-color:var(--bad);background:var(--bad-soft)}
.grip{cursor:grab;touch-action:none;font-size:20px;color:var(--muted);padding:0 4px;user-select:none}
.s-n{width:24px;height:24px;flex:none;border-radius:50%;background:#EFE5D6;font:800 12px var(--sans);display:flex;align-items:center;justify-content:center}
.s-t{flex:1;font-size:15px}
.s-mv{display:flex;gap:4px}.s-mv button{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;font-weight:800}
.tray{border:2px dashed #D9C6AE;border-radius:14px;padding:8px;min-height:64px;background:#FFFBF5}.tray.drop-over{border-color:var(--accent);background:var(--accent-soft)}
.tray-empty{display:block;text-align:center;color:var(--muted);padding:10px;font-size:14px}
.tray .sortl{margin:0}
.drag-ghost{position:fixed;z-index:100;pointer-events:none;transform:translate(-50%,-60%) rotate(-2deg);box-shadow:0 10px 24px -8px rgba(0,0,0,.35);opacity:.95}
.dragging{opacity:.4}
.locked .chip,.locked .m-a,.locked .m-b,.locked .slot,.locked .opt,.locked .grip{cursor:default}
.locked .s-mv,.locked .tray-empty{display:none}

/* quiz runner */
.quiz-top{display:flex;align-items:center;gap:10px;margin-bottom:6px}.quiz-top b{flex:1;text-align:center}.quiz-top .back{margin:0}
.qcount{font-weight:700;color:var(--muted)}
.qprog{margin-bottom:12px}
#qbox .qcard,.rev-item.qcard{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px}
.rev-item{margin-bottom:12px}
.exam-clock{text-align:center;font:800 15px var(--sans);color:var(--accent-d);margin-bottom:8px}
.q-next{margin-top:12px}
.quiz-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.results{text-align:center}
.score{width:140px;height:140px;margin:12px auto;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p)*1%),#EFE5D6 0);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.score::before{content:"";position:absolute;inset:12px;background:var(--card);border-radius:50%}
.score b,.score span{position:relative}.score b{font:800 28px var(--display)}
.dots{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin:10px 0}.dots i{width:14px;height:14px;border-radius:4px;background:#E6DCCB}.dots i.ok{background:var(--ok)}.dots i.bad{background:var(--bad)}
.results .btn-row{justify-content:center}

/* flashcards */
.flash{display:flex;flex-direction:column;width:100%;min-height:300px;border:0;border-radius:22px;background:var(--card);box-shadow:0 10px 30px -14px rgba(59,36,20,.35);border-top:8px solid var(--c);padding:18px;cursor:pointer;text-align:center;transition:transform .3s}
.flash.flipped{transform:rotateY(0) scale(1.01);cursor:default}
.fc-sys{font:700 12px var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.fc-inner{flex:1;display:flex;flex-direction:column;justify-content:center;gap:14px}
.fc-front{font:700 21px/1.35 var(--serif)}
.fc-back{font-size:17px;border-top:1px dashed var(--line);padding-top:14px;color:var(--ink)}
.fc-tap{font-size:13px;color:var(--muted)}
.fc-acts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.mk{min-height:52px;border-radius:14px;border:1.5px solid;font-weight:700;font-size:14px;cursor:pointer;background:var(--card)}
.mk.diff{border-color:var(--bad);color:var(--bad)}.mk.later{border-color:#C99A06;color:#8A6500}.mk.mast{border-color:var(--ok);color:var(--ok)}

/* progress */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:10px 0 14px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:2px}
.tile b{font:800 26px var(--display)}.tile small{font-size:14px;color:var(--muted)}.tile span{font-size:13px;color:var(--muted)}
.weak{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:8px}.weak li{display:flex;justify-content:space-between;align-items:center;gap:10px}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.badge{border:1px solid var(--line);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:2px;opacity:.55;background:#FAF6EF}
.badge.got{opacity:1;background:#FFF6E6;border-color:#E7C08A}.bi{font-size:22px}

@media (min-width:760px){
  .ap-nav{max-width:560px;left:50%;right:auto;width:100%;transform:translateX(-50%);border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0}
  .duo{grid-template-columns:repeat(4,1fr)}
  .halftabs{top:58px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- report a problem ---- */
.rep-link{display:inline-flex;align-items:center;gap:6px;margin:10px 0 0;padding:6px 2px;border:0;background:none;color:var(--muted);font-size:13.5px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.rep-link:hover{color:var(--bad)}
.rep-row{border-top:1px dashed var(--line);margin-top:18px;padding-top:4px}
.rep-dlg{border:0;border-radius:18px;padding:0;max-width:440px;width:calc(100% - 32px);background:var(--card);color:var(--ink);box-shadow:0 20px 60px rgba(59,36,20,.3)}
.rep-dlg::backdrop{background:rgba(42,28,18,.45)}
.rep-f{padding:20px}
.rep-f fieldset{border:0;margin:6px 0 10px;padding:0;display:flex;flex-direction:column;gap:4px}
.rep-r{display:flex;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:12px;cursor:pointer;font-size:15px}
.rep-r:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.rep-r input{width:18px;height:18px;accent-color:var(--accent)}
.rep-n{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:600}
.rep-n textarea{font:15px var(--sans);padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff;resize:vertical}
.rep-err{color:var(--bad);font-size:14px;margin:8px 0 0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---- exams: continue card, pause, history, by-system ---- */
.open-exam{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-decoration:none;color:inherit;border-color:var(--accent);background:var(--accent-soft)}
.open-exam b{display:block}
button.back{border:0;background:none;padding:0;font:inherit;color:var(--accent-d);cursor:pointer;font-weight:600}
.end-exam{display:flex;margin:10px auto 0}
.card.act.mock{border-color:var(--accent);box-shadow:inset 4px 0 0 var(--accent)}
.sysbars .pm-row{grid-template-columns:minmax(0,120px) 1fr 44px 46px}
.exam-list{list-style:none;margin:0;padding:0}
.exam-list .card{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;color:inherit}
.exam-list .card b{display:block}
.ex-score{font:800 20px var(--display);padding:6px 12px;border-radius:12px;background:var(--bad-soft);color:var(--bad)}
.ex-score.mid{background:var(--accent-soft);color:var(--accent-d)}.ex-score.ok{background:var(--ok-soft);color:var(--ok)}
.enroll-cta{border-color:var(--accent);background:linear-gradient(180deg,var(--accent-soft),var(--card))}
.ap-lock .btn-row{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}

/* question tags, calculation input and local-practice notes (shared with PharmaNest) */
.q-class{font:700 11px var(--sans);border-radius:999px;padding:2px 8px;background:var(--accent-soft,#eee);color:var(--accent-d,#333)}
.q-diff{font:700 11px var(--sans);border-radius:999px;padding:2px 8px;border:1.5px solid currentColor}
.q-diff.easy{color:#2F7A3A}.q-diff.moderate{color:#9A6A00}.q-diff.hard{color:#A32A1F}
.calc{display:flex;align-items:center;gap:10px;margin:6px 0}
.calc-in{font:600 20px var(--sans);width:min(220px,60vw);padding:10px 12px;border:2px solid var(--line,#ccc);border-radius:12px;background:#fff;color:inherit}
.calc-in:focus{outline:3px solid var(--accent-soft,#ddd);border-color:var(--accent,#555)}
.calc-in.ok{border-color:#2F7A3A;background:#EEF7EF}.calc-in.bad{border-color:#A32A1F;background:#FBEDEB}
.calc-u{font-weight:700}
.fb-local{margin-top:8px;padding:8px 10px;border-left:4px solid #C99A06;background:#FFF8E1;border-radius:8px;font-size:15px}
.why-hint{font-size:13px;margin:4px 0 0}