/* ===== /app/ learner app – premium native feel (class names fixed: appshell.js depends on them) ===== */
body.in-app .ftr,body.in-app .tabbar{display:none}body.in-app{background:var(--g0);padding-bottom:0}
.appx{min-height:calc(100svh - var(--hh));color:var(--gt);background:radial-gradient(1000px 520px at 85% -12%,rgba(25,163,90,.2),transparent 65%),radial-gradient(700px 500px at -10% 110%,rgba(14,122,65,.12),transparent 65%),var(--g0)}
.appx .mute,.appx .lead{color:var(--gm)}.appx .kicker{color:var(--acc-ink)}
.appx .card{background:linear-gradient(180deg,var(--card-hi),transparent),var(--g2);border-color:var(--gl);color:var(--gt)}.appx .empty{color:var(--gm);border-color:var(--gl2)}.appx .tag{color:var(--gm)}
.appx .btn:not(.btn--acc){background:var(--fill);border-color:var(--gl2);color:var(--gt)}
/* boot: skeleton instead of a spinner */
.appx__boot{max-width:1180px;margin:0 auto;padding:28px clamp(14px,3vw,34px);display:grid;gap:14px}
.appx__boot::before,.appx__boot::after{content:"";display:block;border-radius:24px;background:linear-gradient(90deg,rgb(var(--fg-rgb) / .04),rgb(var(--fg-rgb) / .09),rgb(var(--fg-rgb) / .04));background-size:200% 100%;animation:shimmer 1.3s linear infinite}
.appx__boot::before{height:150px}.appx__boot::after{height:320px}
.appx__boot .appx__spin{display:none}
.appx__spin{width:28px;height:28px;border-radius:50%;border:3px solid rgb(var(--fg-rgb) / .12);border-top-color:var(--acc);animation:spin .8s linear infinite;display:inline-block;vertical-align:middle;margin-right:10px}
@keyframes spin{to{transform:rotate(360deg)}}
/* shell */
.appx__shell{display:grid;grid-template-columns:248px minmax(0,1fr);max-width:1240px;margin:0 auto;min-height:calc(100svh - var(--hh))}
.appx__side{position:sticky;top:var(--hh);align-self:start;height:calc(100svh - var(--hh));padding:24px 14px;display:flex;flex-direction:column;gap:18px}
.appx__brand{display:none}
.appx__nav{display:grid;gap:4px}
.appx__nav a{display:flex;gap:13px;align-items:center;min-height:48px;padding:0 14px;border-radius:14px;text-decoration:none;color:var(--gm);font-weight:550;font-size:16px;letter-spacing:-.012em;transition:background .18s,color .18s,transform .12s}
.appx__nav a svg{width:22px;height:22px;stroke-width:1.75}
.appx__nav a:hover{background:rgb(var(--fg-rgb) / .05);color:var(--gt)}.appx__nav a:active{transform:scale(.97)}
.appx__nav a.is-on{background:rgb(var(--fg-rgb) / .08);color:var(--gt);box-shadow:inset 0 0 0 1px var(--gl)}.appx__nav a.is-on svg{color:var(--acc-2)}
.appx__trk{margin-top:auto;padding:16px;border-radius:18px;background:radial-gradient(240px 120px at 100% 0%,rgba(25,163,90,.18),transparent 70%),var(--g2);border:1px solid var(--gl)}
.appx__trk small{display:block;color:var(--gm);font-size:13px}.appx__trk b{display:block;font-size:16px;margin:2px 0 6px}.appx__trk a{color:var(--acc-ink);font-size:14.5px;font-weight:550;text-decoration:none}
.appx__main{padding:22px clamp(14px,3vw,36px) 120px;min-width:0}
/* top status bar: rank + xp + streak */
.appx__hud{position:sticky;top:calc(var(--hh) + 10px);z-index:20;display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px;padding:10px 12px 10px 10px;border-radius:20px;background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--gl);box-shadow:0 12px 30px -16px rgba(0,0,0,.5)}
.hud__rank{display:flex;gap:12px;align-items:center;min-width:0}.hud__rank b{font-size:15.5px;font-weight:600}
.hud__badge{width:42px;height:42px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;font:650 16px var(--sans);color:#0b0c0b;background:radial-gradient(circle at 34% 28%,#e8f6ee,#2fc874 50%,#0e7a41);box-shadow:0 0 0 3px rgba(25,163,90,.2),0 6px 16px -6px rgba(25,163,90,.8)}
.hud__bar{width:180px;max-width:34vw;height:8px;border-radius:99px;background:rgb(var(--fg-rgb) / .1);margin-top:6px;overflow:hidden}.hud__bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0e7a41,#2fc874);box-shadow:0 0 10px rgba(47,200,116,.6);transition:width 1.2s var(--spring)}
.hud__chips{display:flex;gap:8px}
.hud__chip{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 13px;border-radius:999px;background:rgb(var(--fg-rgb) / .06);border:1px solid var(--gl);font:500 16px var(--mono);white-space:nowrap}
.hud__chip svg{width:18px;height:18px}.hud__fire svg{color:#e7bf5c}.hud__fire b{color:var(--gt)}.hud__chip:not(.hud__fire) svg{color:var(--acc-2)}
.appx__view{opacity:0;transform:translateY(10px)}.appx__view.is-in{opacity:1;transform:none;transition:opacity .4s var(--ease),transform .5s var(--spring)}
.pg__h{font-size:clamp(26px,3.4vw,38px);margin:4px 0 8px;letter-spacing:-.022em}
/* home metrics (hm) */
.hm{margin:0 0 16px;display:grid;gap:12px;padding:0;border:0;background:none}
.hm--guest{padding:20px;border:1px solid var(--gl);border-radius:22px;background:radial-gradient(400px 200px at 100% 0%,rgba(25,163,90,.16),transparent 70%),var(--g2);display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}.hm--guest b{font-weight:550;font-size:16.5px;max-width:52ch;line-height:1.5}
.hm__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;border:0}
.hm__grid>div{padding:16px;display:grid;gap:4px;border-radius:18px;background:var(--g2);border:1px solid var(--gl)}.hm__grid>div+div{border-left:1px solid var(--gl)}
.hm small,.hm__plan small{display:block;font:500 13.5px var(--sans);color:var(--gm)}.hm__grid b{font-size:21px;font-weight:600;color:var(--gt);letter-spacing:-.02em}.hm__grid b.mono{font:500 24px var(--mono);color:var(--gt);letter-spacing:-.04em}.hm__grid em{font-style:normal;font-size:13.5px;color:var(--acc-ink)}
.hm__weak{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;padding:16px 18px;border-radius:20px;border:1px solid var(--gl);background:radial-gradient(400px 160px at 0% 0%,rgba(231,191,92,.1),transparent 70%),var(--g2)}.hm__weak b{font-size:16.5px}
.hm__plan{display:grid;gap:6px}.hm__plan a{display:block;padding:12px 14px;border-radius:14px;background:var(--g2);border:1px solid var(--gl);text-decoration:none;font-size:15.5px}.hm__plan a b{font:600 13px var(--sans);color:var(--acc-ink);margin-right:8px}
.hm__mk{justify-self:start;display:inline-flex;align-items:center;gap:8px;min-height:46px;border:1px dashed var(--gl2);background:transparent;color:var(--gt);border-radius:14px;padding:0 16px;font:550 15px var(--sans);cursor:pointer;transition:border-color .15s,background .15s}.hm__mk:hover{border-color:var(--acc);background:var(--acc-soft)}
.hm__badges{display:flex;flex-wrap:wrap;gap:6px}.hm__badge{font:550 13px var(--sans);padding:7px 12px;border:1px solid var(--gl);border-radius:999px;color:var(--gm);opacity:.65}.hm__badge.is-got{opacity:1;color:#0b0c0b;background:var(--acc-grad);border-color:transparent}
.hm__field{display:flex;gap:12px;align-items:center;min-height:52px;font:600 15px var(--sans);cursor:pointer;padding:10px 14px;border:1px solid var(--gl);border-radius:16px;background:var(--g2)}.hm__field input{accent-color:var(--acc);width:20px;height:20px}.hm__field small{font:450 14px var(--sans);color:var(--gm)}
@media (max-width:640px){.hm__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* today */
.td__hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px;padding:26px 26px 26px 28px;border-radius:28px;background:radial-gradient(500px 260px at 100% 0%,rgba(25,163,90,.3),transparent 70%),radial-gradient(400px 200px at 0% 120%,rgba(120,128,122,.1),transparent 70%),var(--g2);border:1px solid var(--gl);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.td__hero h1{font-size:clamp(26px,3.4vw,38px);margin:8px 0 6px;letter-spacing:-.022em}.td__hero p{margin:0;font-size:16.5px}
.td__ring{width:112px;height:112px;flex:0 0 auto;filter:drop-shadow(0 0 18px rgba(25,163,90,.35))}
.td__ring circle{fill:none;stroke:rgb(var(--fg-rgb) / .1);stroke-width:8}
.td__ring .td__ringv{stroke:#19a35a;stroke-linecap:round;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset 1.6s var(--spring)}
.td__ring text{fill:var(--gt);font:500 17px var(--mono);text-anchor:middle;letter-spacing:-.04em}
.td__tasks{display:grid;gap:8px}
.td__task{display:flex;gap:14px;align-items:center;min-height:72px;padding:12px 16px 12px 12px;border-radius:20px;background:var(--g2);border:1px solid var(--gl);text-decoration:none;color:var(--gt);animation:rise .5s var(--spring) both;animation-delay:var(--d);transition:border-color .15s,background .15s,transform .12s}
.td__task:hover{border-color:rgba(25,163,90,.5)}.td__task:active{transform:scale(.985)}
.td__task span:nth-child(2){flex:1;min-width:0}.td__task small{display:block;color:var(--gm);font:500 13.5px var(--sans)}.td__task b{display:block;font-size:16.5px;font-weight:600;letter-spacing:-.015em}
.td__task em{font:500 14px var(--mono);font-style:normal;color:var(--acc-ink);white-space:nowrap;padding:6px 10px;border-radius:999px;background:var(--acc-soft)}
.td__ic{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(145deg,rgba(25,163,90,.28),rgba(14,122,65,.1));border:1px solid rgba(25,163,90,.3);color:var(--acc-ink)}.td__ic svg{width:23px;height:23px}
.td__task.is-done{opacity:.72}.td__task.is-done .td__ic{background:var(--acc-grad);border-color:transparent;color:#0b0c0b}
@keyframes rise{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.td__cont{position:relative;display:block;margin:16px 0;padding:22px 84px 22px 24px;border-radius:24px;text-decoration:none;color:#0b0c0b;background:radial-gradient(400px 200px at 100% 0%,rgba(255,255,255,.35),transparent 60%),linear-gradient(140deg,#2fc874,#19a35a 55%,#0e7a41);overflow:hidden;box-shadow:0 24px 50px -24px rgba(25,163,90,.8),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s var(--ease)}
.td__cont:hover{transform:translateY(-2px)}.td__cont:active{transform:scale(.985)}
.td__cont .kicker{color:#062f19}.td__cont .kicker::before{background:#062f19;box-shadow:none}.td__cont b{display:block;font-size:22px;font-weight:650;letter-spacing:-.03em;margin:6px 0 4px}.td__cont small{font-size:15px;color:#0b3d22}
.td__go{position:absolute;right:20px;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:#0b0c0b;color:#7ee2a8;display:grid;place-items:center}.td__go svg{width:22px;height:22px}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(11,12,11,.45)}70%{box-shadow:0 0 0 14px rgba(11,12,11,0)}100%{box-shadow:0 0 0 0 rgba(11,12,11,0)}}
@media (prefers-reduced-motion:no-preference){.td__go{animation:pulseRing 2.4s infinite}}
.td__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.td__tile{position:relative;overflow:hidden;min-height:132px;padding:18px;border-radius:22px;text-decoration:none;color:var(--gt);display:flex;flex-direction:column;justify-content:flex-end;gap:2px;border:1px solid var(--gl);background:var(--g2);transition:transform .2s var(--ease),border-color .2s}
.td__tile:hover{transform:translateY(-2px);border-color:rgba(25,163,90,.5)}.td__tile:active{transform:scale(.98)}
.td__tile b{font-size:18px;font-weight:600;letter-spacing:-.02em}.td__tile small{color:var(--gm);font-size:14.5px}
.td__tile::before{content:"";position:absolute;right:-30px;top:-30px;width:140px;height:140px;border-radius:50%;filter:blur(8px);opacity:.9}
.td__tile--a::before{background:radial-gradient(circle,rgba(25,163,90,.45),transparent 65%)}.td__tile--b::before{background:radial-gradient(circle,rgba(231,191,92,.3),transparent 65%)}.td__tile--c::before{background:radial-gradient(circle,rgba(138,150,156,.4),transparent 65%)}.td__tile--d::before{background:radial-gradient(circle,rgba(120,128,122,.35),transparent 65%)}
.td__pay{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:16px;padding:20px;border-radius:22px;border:1px solid rgba(25,163,90,.45);background:radial-gradient(400px 200px at 100% 0%,rgba(25,163,90,.2),transparent 70%),var(--g2)}.td__pay b{display:block;margin:4px 0;font-size:17px}.td__pay small{color:var(--gm);font-size:14.5px}
/* path (learning route) – glossy 3D nodes */
.path__unit{margin:30px 0 12px}
.path__head{position:relative;overflow:hidden;padding:20px 22px;border-radius:22px;background:radial-gradient(400px 160px at 100% 0%,rgba(25,163,90,.22),transparent 70%),var(--g2);border:1px solid var(--gl)}
.path__unit:nth-child(odd) .path__head{background:radial-gradient(400px 160px at 100% 0%,rgba(120,128,122,.16),transparent 70%),var(--g2)}
.path__head span{font:550 13.5px var(--sans);color:var(--acc-ink)}.path__head b{display:block;font-size:21px;font-weight:650;letter-spacing:-.025em;margin:2px 0}.path__head small{color:var(--gm);font-size:15px}
.path{list-style:none;padding:30px 0 8px;margin:0;display:flex;flex-direction:column;align-items:center;gap:20px}
.path__n{position:relative;translate:var(--x) 0;display:flex;flex-direction:column;align-items:center;animation:rise .5s var(--spring) both;animation-delay:var(--d)}
.path__n>a,.path__n>button{position:relative;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;font:600 20px var(--mono);color:var(--gm);text-decoration:none;border:0;cursor:pointer;
  background:radial-gradient(circle at 34% 26%,rgb(var(--fg-rgb) / .22),rgb(var(--fg-rgb) / .07) 62%);box-shadow:0 6px 0 rgb(var(--fg-rgb) / .1),inset 0 1px 0 rgb(var(--fg-rgb) / .2),0 14px 24px -12px rgba(0,0,0,.5);transition:transform .15s var(--ease),box-shadow .15s}
.path__n>a svg,.path__n>button svg{width:26px;height:26px}
.path__n>a:hover,.path__n>button:hover{transform:translateY(-2px)}
.path__n>a:active,.path__n>button:active{transform:translateY(5px);box-shadow:0 1px 0 rgb(var(--fg-rgb) / .1),inset 0 1px 0 rgb(var(--fg-rgb) / .2)}
.path__n.is-done>a,.path__n.is-done>button{color:#0b0c0b;background:radial-gradient(circle at 34% 26%,#c8f0d8,#19a35a 55%,#0e7a41);box-shadow:0 6px 0 #0a4d29,inset 0 2px 0 rgba(255,255,255,.4),0 16px 26px -12px rgba(25,163,90,.6)}
.path__n.is-cur>a{width:82px;height:82px;color:#0b0c0b;background:radial-gradient(circle at 34% 26%,#e8f6ee,#2fc874 48%,#0e7a41);box-shadow:0 7px 0 #0a5c30,0 0 0 9px rgba(25,163,90,.2),0 0 40px rgba(25,163,90,.55),inset 0 2px 0 rgba(255,255,255,.5)}
.path__n.is-cur>a:active{box-shadow:0 2px 0 #0a5c30,0 0 0 9px rgba(25,163,90,.2)}
@keyframes bob{50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:no-preference){.path__n.is-cur>a{animation:bob 2s ease-in-out infinite}}
.path__n.is-lock>a,.path__n.is-lock>button{opacity:.55}
.path__n.is-boss>button{width:88px;height:88px;border-radius:28px;color:#ffffff;background:radial-gradient(circle at 34% 26%,#3a3d3a,#9aa09a 52%,#0b0c0b);box-shadow:0 7px 0 #000000,inset 0 2px 0 rgba(255,255,255,.5),0 18px 30px -12px rgba(120,128,122,.5)}
.path__n.is-boss>button svg{width:34px;height:34px}
.path__lbl{margin-top:12px;font-size:14.5px;font-weight:550;color:var(--gt);max-width:200px;text-align:center;line-height:1.3}
.path__n.is-lock .path__lbl{color:var(--gm)}
.path__here{position:absolute;top:-34px;background:var(--gt);color:var(--g0);font:600 13px var(--sans);padding:5px 11px;border-radius:999px;box-shadow:0 8px 20px -8px rgba(0,0,0,.6)}
.path__here::after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-5px;border:5px solid transparent;border-bottom:0;border-top-color:var(--gt)}
/* situations list */
.sit__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.sit{display:grid;grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;align-items:center;min-height:76px;padding:12px 14px 12px 12px;border-radius:20px;background:var(--g2);border:1px solid var(--gl);text-decoration:none;color:var(--gt);animation:rise .45s var(--spring) both;animation-delay:var(--d);transition:border-color .15s,transform .12s}
.sit:hover{border-color:rgba(25,163,90,.5)}.sit:active{transform:scale(.985)}.sit b{font-size:15.5px;font-weight:600;line-height:1.3}
.sit__lv{grid-row:1/3;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--acc-soft);color:var(--acc-ink);font:500 14px var(--mono)}.sit__lv svg{width:22px;height:22px}.sit small{color:var(--gm);font-size:13.5px}.sit.is-lock{opacity:.6}
.lvl__sub{font:600 16px var(--sans);color:var(--gt);margin:26px 0 12px}
/* sim + ai tabs */
.sim__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sim__card{position:relative;overflow:hidden;min-height:180px;border-radius:24px;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;text-decoration:none;color:#f2f3ee;border:1px solid rgba(255,255,255,.08);transition:transform .25s var(--ease),border-color .2s}
.sim__card:hover{transform:translateY(-3px);border-color:rgba(25,163,90,.55)}.sim__card:active{transform:scale(.98)}
.sim__card b{font-size:20px;font-weight:650;letter-spacing:-.025em}.sim__card small{color:#c4c8bc;font-size:14.5px}
.sim__card::before{content:"";position:absolute;right:-40px;top:-40px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(47,200,116,.35),transparent 65%)}
.sim__card--a{background:linear-gradient(150deg,#14402a,#141711)}.sim__card--b{background:linear-gradient(150deg,#2f3a3e,#111416)}.sim__card--c{background:linear-gradient(150deg,#2a2c2a,#15140f)}.sim__card--d{background:linear-gradient(150deg,#123a26,#111410)}
.ai__hero{text-align:center;padding:36px 10px 26px}.ai__hero h1{font-size:clamp(28px,4vw,40px)}
.ai__orb{display:block;width:120px;height:120px;margin:0 auto 24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e8f6ee,#2fc874 35%,#0e7a41 70%,#062f19);box-shadow:0 0 0 10px rgba(25,163,90,.1),0 0 0 22px rgba(25,163,90,.05),0 0 80px rgba(25,163,90,.55)}
@keyframes orb{50%{transform:scale(1.06);box-shadow:0 0 0 14px rgba(25,163,90,.12),0 0 0 30px rgba(25,163,90,.05),0 0 100px rgba(25,163,90,.7)}}
@media (prefers-reduced-motion:no-preference){.ai__orb{animation:orb 4s ease-in-out infinite}}
.ai__sugg{display:grid;gap:8px;max-width:640px;margin:0 auto}.ai__sugg button{display:flex;align-items:center;min-height:56px;text-align:left;padding:14px 18px;border-radius:18px;border:1px solid var(--gl);background:var(--g2);color:var(--gt);font:550 16px var(--sans);cursor:pointer;animation:rise .45s var(--spring) both;animation-delay:var(--d);transition:border-color .15s,transform .12s}.ai__sugg button:hover{border-color:rgba(25,163,90,.55)}.ai__sugg button:active{transform:scale(.985)}
/* onboarding */
.onb{max-width:660px;margin:0 auto;padding:36px 18px 90px;min-height:calc(100svh - var(--hh))}
.onb__bar{height:8px;border-radius:99px;background:rgb(var(--fg-rgb) / .1);overflow:hidden;margin-bottom:34px}.onb__bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0e7a41,#2fc874);transition:width .6s var(--spring)}
.onb__q{animation:rise .45s var(--spring) both}.onb__n{color:var(--acc-ink);font:550 15px var(--sans)}.onb h1{font-size:clamp(26px,3.6vw,38px);margin:10px 0 24px;letter-spacing:-.022em}
.onb__a{display:grid;gap:10px}
.onb__a button{display:flex;gap:16px;align-items:center;min-height:68px;text-align:left;padding:12px 18px 12px 12px;border-radius:20px;border:1px solid var(--gl2);background:var(--g2);color:var(--gt);font:550 17.5px var(--sans);letter-spacing:-.015em;cursor:pointer;animation:rise .45s var(--spring) both;animation-delay:var(--d);transition:border-color .15s,background .15s,transform .12s}
.onb__a button:hover{border-color:var(--acc);background:var(--acc-soft)}.onb__a button:active{transform:scale(.985)}
.onb__e{width:46px;height:46px;flex:0 0 auto;border-radius:14px;display:grid;place-items:center;background:var(--acc-soft);color:var(--acc-ink);font:600 15px var(--mono)}.onb__e svg{width:23px;height:23px}
.onb__plan{list-style:none;padding:0;margin:20px 0 28px;display:grid;gap:8px;counter-reset:op}
.onb__plan li{padding:16px 16px 16px 58px;position:relative;border-radius:18px;background:var(--g2);border:1px solid var(--gl);animation:rise .45s var(--spring) both;counter-increment:op;font-size:16px}
.onb__plan li::before{content:counter(op);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--acc-grad);color:#0b0c0b;font:600 14px var(--mono)}
.onb .btn{margin:0 8px 8px 0}.onb__ghost{background:var(--fill)!important;color:var(--gt)!important;border-color:var(--gl2)!important}
/* sheets – iOS bottom sheet with grabber */
.sh{position:fixed;inset:0;z-index:200;background:rgba(5,6,5,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .25s}.sh.is-on{opacity:1}
.sh__card{position:relative;width:min(580px,100%);max-height:92svh;overflow:auto;background:var(--g1);color:var(--gt);border-radius:30px 30px 0 0;padding:30px 22px calc(26px + env(safe-area-inset-bottom));transform:translateY(60px);transition:transform .45s var(--spring);border:1px solid var(--gl2);border-bottom:0;box-shadow:0 -30px 80px -20px rgba(0,0,0,.6)}
.sh__card::before{content:"";position:absolute;left:50%;top:9px;width:40px;height:5px;margin-left:-20px;border-radius:99px;background:rgb(var(--fg-rgb) / .2)}
.sh.is-on .sh__card{transform:none}
.sh__t{display:flex;align-items:center;gap:10px;font-size:21px;margin-bottom:8px;font-weight:650;letter-spacing:-.025em}.sh__t svg{width:22px;height:22px;color:var(--acc-ink)}
.sh__x{position:absolute;right:14px;top:14px;width:40px;height:40px;border-radius:50%;border:0;background:rgb(var(--fg-rgb) / .08);color:var(--gt);font-size:22px;line-height:1;cursor:pointer}
.sh--full{align-items:stretch}.sh--full .sh__card{width:min(660px,100%);border-radius:0;max-height:none;height:100svh;display:flex;flex-direction:column}
@media (min-width:720px){.sh{align-items:center}.sh__card{border-radius:30px;border-bottom:1px solid var(--gl2)}.sh--full .sh__card{height:auto;max-height:92svh;border-radius:30px}}
.sh .btn:not(.btn--acc){background:var(--fill);color:var(--gt);border-color:var(--gl2)}.sh .mute{color:var(--gm)}
/* lightning + boss */
.zb,.bs{display:flex;flex-direction:column;gap:16px;flex:1}
.zb__top,.bs__top{display:flex;justify-content:space-between;align-items:center;font:600 15px var(--sans);padding-right:48px}.bs__top span:first-child{display:inline-flex;align-items:center;gap:8px}.bs__top svg{width:20px;height:20px;color:#9aa09a}
.zb__time{font:500 36px var(--mono);font-variant-numeric:tabular-nums;color:var(--gt);letter-spacing:-.05em}.zb__time.is-low{color:var(--sig);animation:pulse .5s infinite alternate}
.zb__combo{padding:6px 12px;border-radius:999px;border:1px solid var(--gl2);font:500 15px var(--mono)}.zb__combo.is-hot{background:var(--acc-grad);border-color:transparent;color:#0b0c0b}.zb__pts{font:500 22px var(--mono);color:var(--acc-ink)}
@keyframes pulse{to{opacity:.4}}
.zb__q{padding:20px;border-radius:22px;background:var(--g2);border:1px solid var(--gl);animation:rise .3s var(--spring) both}.zb__q small{color:var(--acc-ink);font:500 14px var(--mono)}.zb__q p,.bs__q{font-size:19px;font-weight:600;margin:8px 0 0;line-height:1.45;letter-spacing:-.015em}
.zb__a{display:grid;gap:8px}.zb__a button{min-height:56px;padding:14px 16px;border-radius:16px;border:1px solid var(--gl2);background:var(--g2);color:var(--gt);font:550 16.5px/1.4 var(--sans);text-align:left;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}
.zb__a button:hover:not(:disabled){border-color:var(--acc)}.zb__a button:active:not(:disabled){transform:scale(.985)}.zb__a button.is-ok{background:var(--ok-soft);border-color:var(--ok)}.zb__a button.is-bad{background:var(--bad-soft);border-color:var(--bad)}
.zb--shake{animation:shake .35s}@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.zb__end{text-align:center;padding:24px 0;display:flex;flex-direction:column;align-items:center;gap:8px}.zb__big{font:500 80px/1 var(--mono);letter-spacing:-.06em;background:linear-gradient(180deg,var(--gt),var(--acc));-webkit-background-clip:text;background-clip:text;color:transparent}.zb__xp{font:500 17px var(--mono);color:var(--acc-ink);min-height:26px}
.bs__bar{height:8px;border-radius:99px;background:rgb(var(--fg-rgb) / .1);overflow:hidden}.bs__bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0e7a41,#2fc874);transition:width .4s var(--spring)}
.bs__wait{display:grid;place-items:center;flex:1;font-size:16px}.bs__rev{text-align:left;width:100%;max-height:42vh;overflow:auto;margin:12px 0;display:grid;gap:6px}.bs__rev details{padding:12px 14px;border-radius:14px;background:var(--g2);border:1px solid var(--gl)}.bs__rev .bad summary{color:var(--bad)}.bs__rev .ok summary{color:var(--ok)}
/* fx */
.fx-confetti{position:fixed;inset:0;z-index:400;pointer-events:none}
.fx-xp{position:fixed;z-index:401;transform:translate(-50%,0);font:600 22px var(--mono);color:#7ee2a8;text-shadow:0 2px 14px rgba(0,0,0,.6);pointer-events:none;animation:xpfly 1.3s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes xpfly{0%{opacity:0;transform:translate(-50%,10px) scale(.7)}20%{opacity:1;transform:translate(-50%,-10px) scale(1.12)}100%{opacity:0;transform:translate(-50%,-90px) scale(1)}}
.fx-lvl{position:fixed;inset:0;z-index:399;display:grid;place-items:center;background:rgba(5,6,5,.75);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;transition:opacity .3s}.fx-lvl.is-on{opacity:1}
.fx-lvl__card{text-align:center;color:#f2f3ee;display:flex;flex-direction:column;align-items:center;gap:8px;transform:scale(.85);transition:transform .5s var(--spring);padding:34px 38px;border:1px solid rgba(255,255,255,.14);background:radial-gradient(400px 240px at 50% 0%,rgba(25,163,90,.35),transparent 70%),#121412;border-radius:32px;box-shadow:0 50px 100px -30px rgba(0,0,0,.8)}.fx-lvl.is-on .fx-lvl__card{transform:none}
.fx-lvl__badge svg{width:120px;height:120px}.fx-lvl__card span{color:#7ee2a8;font:600 15px var(--sans)}.fx-lvl__card b{font-size:38px;font-weight:650;letter-spacing:-.04em}.fx-lvl__card small{color:#c4c8bc;margin-bottom:12px;font-size:15px}
/* mobile: floating tab bar */
@media (max-width:860px){
  .appx__shell{grid-template-columns:minmax(0,1fr)}
  .appx__side{position:fixed;z-index:120;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));top:auto;height:auto;padding:6px;border-radius:24px;background:var(--tab-bg);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--gl2);box-shadow:0 20px 40px -12px rgba(0,0,0,.6)}
  .appx__nav{grid-template-columns:repeat(5,1fr);gap:2px}
  .appx__nav a{flex-direction:column;justify-content:center;gap:4px;min-height:56px;padding:4px 2px;border-radius:18px;font-size:11.5px;font-weight:550}.appx__nav a.is-on{box-shadow:none}
  .appx__trk{display:none}.appx__main{padding-bottom:120px}
  .appx__hud{top:calc(var(--hh) + 6px);border-radius:18px}
  .td__hero{padding:20px;border-radius:24px}.td__ring{width:88px;height:88px}.hud__bar{width:110px}
  .hud__chip{min-height:38px;padding:0 10px;font-size:15px}
}
@media (max-width:420px){.hud__rank b{font-size:14px}.hud__chips{gap:5px}.td__hero{flex-direction:row;align-items:flex-start}.td__hero h1{font-size:26px}}
@media (prefers-reduced-motion:reduce){.appx__view,.td__task,.path__n,.onb__q,.onb__a button,.sit,.ai__sugg button,.zb__q,.onb__plan li{animation:none!important;transition:none!important}.path__n.is-cur>a,.td__go,.ai__orb{animation:none}}
html[data-motion="reduce"] .path__n.is-cur>a,html[data-motion="reduce"] .td__go,html[data-motion="reduce"] .ai__orb{animation:none}
@media (max-width:860px){body.in-app .ai-fab{bottom:calc(96px + env(safe-area-inset-bottom))}}

/* ===== FIELD MODE (institutions): darker, compact, task-first ===== */
html[data-mode="field"]{--g0:#070806;--g1:#0d0e0c;--g2:#131512;--g3:#1c1f1a;--gt:#eef0eb;--gm:#a5a99b;--gl:rgba(47,200,116,.14);--gl2:rgba(47,200,116,.3);--pad:14px}
html[data-mode="field"] body{background:var(--g0)}
html[data-mode="field"] .hdr{background:rgba(7,8,6,.92)}
html[data-mode="field"] .appx{background:var(--g0)}
html[data-mode="field"] .appx__shell{max-width:none;grid-template-columns:210px minmax(0,1fr)}
html[data-mode="field"] .appx__main{padding:12px 16px 90px}
html[data-mode="field"] .appx__nav a{min-height:42px;padding:0 10px;font-size:15px;border-radius:10px}
html[data-mode="field"] .appx__hud{margin-bottom:10px;padding:6px 10px;border-radius:12px;border-color:var(--gl2);background:rgba(7,8,6,.94)}
html[data-mode="field"] .appx__hud::before{content:"Field";font:650 12px var(--sans);color:#0b0c0b;background:#2fc874;padding:4px 9px;border-radius:999px}
html[data-mode="field"] .pg__h,html[data-mode="field"] .td__hero h1{font-size:22px}
html[data-mode="field"] .td__hero{margin-bottom:8px;padding:14px;border-radius:14px}html[data-mode="field"] .td__ring{width:60px;height:60px}
html[data-mode="field"] .td__task,html[data-mode="field"] .sit,html[data-mode="field"] .onb__a button,html[data-mode="field"] .zb__a button{min-height:52px;padding:8px 10px;border-radius:12px}
html[data-mode="field"] .td__ic{width:36px;height:36px;border-radius:10px}
html[data-mode="field"] .td__cont{padding:14px 70px 14px 16px;border-radius:14px;margin:10px 0}html[data-mode="field"] .td__cont b{font-size:17px}
html[data-mode="field"] .td__tile{min-height:76px;padding:12px;border-radius:12px}
html[data-mode="field"] .td__grid,html[data-mode="field"] .sim__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
html[data-mode="field"] .sim__card{min-height:96px;padding:12px;border-radius:12px}
html[data-mode="field"] .hm__grid>div{padding:10px 12px;border-radius:12px}
html[data-mode="field"] .path{gap:10px;padding-top:14px}html[data-mode="field"] .path__n{translate:none}
html[data-mode="field"] .path__n>a,html[data-mode="field"] .path__n>button{width:48px;height:48px;font-size:15px;box-shadow:none}
html[data-mode="field"] .path__n.is-cur>a{width:52px;height:52px;animation:none;box-shadow:0 0 0 3px rgba(25,163,90,.3)}
html[data-mode="field"] .card,html[data-mode="field"] .sh__card{border-radius:14px}
html[data-mode="field"] *{transition-duration:0s!important}
@media (max-width:860px){html[data-mode="field"] .appx__shell{grid-template-columns:minmax(0,1fr)}html[data-mode="field"] .td__grid,html[data-mode="field"] .sim__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pg__h2{font-size:clamp(22px,2.4vw,28px);margin:40px 0 6px;letter-spacing:-.018em}
.hm__badge{display:inline-block;text-transform:lowercase}.hm__badge::first-letter{text-transform:uppercase}
/* micro-lesson path (learn.css by CORE) aligned with the v4 surfaces */
.appx .lp__head{color:var(--gt);background:radial-gradient(400px 160px at 100% 0%,rgba(25,163,90,.24),transparent 70%),var(--g2);border:1px solid var(--gl);box-shadow:none}
.appx .lp__head small{text-transform:none;letter-spacing:0;font:550 13.5px var(--sans);color:var(--acc-ink);opacity:1}.appx .lp__head b{font-size:21px;font-weight:650;letter-spacing:-.025em}.appx .lp__head p{color:var(--gm);opacity:1}
.appx .lp__node>button{font:600 20px var(--mono);color:var(--gm);background:radial-gradient(circle at 34% 26%,rgb(var(--fg-rgb) / .22),rgb(var(--fg-rgb) / .07) 62%);box-shadow:0 6px 0 rgb(var(--fg-rgb) / .1),inset 0 1px 0 rgb(var(--fg-rgb) / .2),0 14px 24px -12px rgba(0,0,0,.5)}
.appx .lp__node.is-done>button{color:#0b0c0b;background:radial-gradient(circle at 34% 26%,#c8f0d8,#19a35a 55%,#0e7a41);box-shadow:0 6px 0 #0a4d29,inset 0 2px 0 rgba(255,255,255,.4)}
.appx .lp__node.is-cur>button{color:#0b0c0b;background:radial-gradient(circle at 34% 26%,#e8f6ee,#2fc874 48%,#0e7a41);box-shadow:0 7px 0 #0a5c30,0 0 0 9px rgba(25,163,90,.2),0 0 40px rgba(25,163,90,.55),inset 0 2px 0 rgba(255,255,255,.5)}
.appx .lp__node>span{font-weight:550;color:var(--gt)}.appx .lp__place{border-color:var(--gl);background:radial-gradient(400px 160px at 100% 0%,rgba(25,163,90,.2),transparent 70%),var(--g2)}

/* ===== v5: light app, real photos on shortcut tiles, green Duolingo path ===== */
body.in-app{background:var(--g0)}
.appx{background:var(--g0)}
.appx__hud{background:var(--glass);box-shadow:var(--sh)}
.td__hero{background:var(--white);box-shadow:var(--sh);border-color:var(--line)}
.td__hero::before,.td__hero::after{display:none}
.td__cont{background:var(--acc);color:#0b0c0b;box-shadow:0 20px 40px -24px rgba(25,163,90,.7)}
.td__go{background:#0b0c0b;color:#2fc874}
.td__task,.sit,.hm__grid>div,.hm__plan a,.hm__field,.path__head,.ai__sugg button{background:var(--white);box-shadow:var(--sh)}
.path__head,.path__unit:nth-child(odd) .path__head{background:var(--white)}
.td__tile,.sim__card{min-height:150px;color:#fff;border:0;background:#0b0c0b center/cover no-repeat}
.td__tile::before,.sim__card::before{content:"";position:absolute;inset:0;right:0;top:0;width:auto;height:auto;border-radius:0;filter:none;opacity:1;background:linear-gradient(0deg,rgba(6,7,6,.9) 0%,rgba(6,7,6,.35) 60%,rgba(6,7,6,.1) 100%)}
.td__tile>*,.sim__card>*{position:relative}
.td__tile small,.sim__card small{color:rgba(255,255,255,.85)}
.td__tile--a{background-image:url(../media/photo-city.jpg)}.td__tile--b{background-image:url(../media/photo-controller.jpg)}
.td__tile--c{background-image:url(../media/takeoff.jpg)}.td__tile--d{background-image:url(../media/photo-pilot.jpg)}
.sim__card--a{background-image:url(../media/hero.jpg)}.sim__card--b{background-image:url(../media/rescue.jpg)}
.sim__card--c{background-image:url(../media/photo-pro.jpg)}.sim__card--d{background-image:url(../media/photo-controller.jpg)}
.td__tile:hover,.sim__card:hover{border-color:transparent;box-shadow:var(--sh2)}
/* path nodes: green done, bright green current, black boss */
.path__n.is-done>a,.path__n.is-done>button{background:#19a35a;color:#0b0c0b;box-shadow:0 6px 0 #0e7a41,0 14px 24px -12px rgba(25,163,90,.6)}
.path__n.is-cur>a{background:#2fc874;color:#0b0c0b;box-shadow:0 7px 0 #0e7a41,0 0 0 9px rgba(25,163,90,.18)}
.path__n.is-boss>button{background:#0b0c0b;color:#2fc874;box-shadow:0 7px 0 #000,0 18px 30px -12px rgba(0,0,0,.4)}
.path__n:not(.is-done):not(.is-cur):not(.is-boss)>a,.path__n:not(.is-done):not(.is-cur):not(.is-boss)>button{background:var(--g3);color:var(--mute);box-shadow:0 6px 0 rgb(var(--fg-rgb) / .14)}
.path__here{background:var(--ink);color:var(--paper)}.path__here::after{border-top-color:var(--ink)}
.hud__badge{background:#19a35a;color:#0b0c0b;box-shadow:none}
.hud__bar i,.onb__bar i{background:#19a35a;box-shadow:none}
.ai__orb{background:radial-gradient(circle at 35% 30%,#c8f0d8,#2fc874 38%,#0e7a41 72%,#062f19)}
/* ===== v6 mobile app: site tab bar at the bottom (same 5 tabs everywhere), in-app sections as a sticky segmented strip ===== */
@media (max-width:860px){
  body.in-app .tabbar{display:grid}
  body.in-app{padding-bottom:calc(var(--tb,64px) + 12px + env(safe-area-inset-bottom))}
  body.in-app .appx__side{position:sticky;z-index:40;top:var(--hh);left:auto;right:auto;bottom:auto;height:auto;margin:0;padding:8px clamp(10px,3vw,20px);border-radius:0;border:0;border-bottom:1px solid var(--gl);box-shadow:none;background:var(--tab-bg);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);transition:top .35s var(--ease)}
  body.in-app .appx__nav{display:flex;grid-template-columns:none;gap:6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  body.in-app .appx__nav::-webkit-scrollbar{display:none}
  body.in-app .appx__nav a{flex:0 0 auto;flex-direction:row;gap:7px;min-height:44px;padding:0 15px;border-radius:999px;font-size:14.5px;font-weight:650;letter-spacing:-.01em;scroll-snap-align:start;background:rgb(var(--fg-rgb) / .05);color:var(--gm)}
  body.in-app .appx__nav a svg{width:18px;height:18px}
  body.in-app .appx__nav a.is-on{background:var(--gt);color:var(--g0);box-shadow:none}body.in-app .appx__nav a.is-on svg{color:var(--acc)}
  body.in-app .appx__hud{position:relative;top:auto;margin-top:4px;box-shadow:0 12px 30px -20px rgba(0,0,0,.35)}
  body.in-app .appx__main{padding:14px 14px 28px}
  body.in-app .ai-fab{bottom:calc(var(--tb,64px) + 16px + env(safe-area-inset-bottom))}
  .td__task,.sit,.td__tile,.sim__card{-webkit-tap-highlight-color:transparent}
  .td__hero,.td__cont,.td__pay,.hm--guest{border-radius:26px}
  .td__grid{gap:10px}.td__tile{min-height:150px;border-radius:24px}
}
@media (max-width:820px){body.in-app .hdr.is-hidden~* .appx__side,body.in-app:has(.hdr.is-hidden) .appx__side{top:0}}