/* CognitAT: quiet surfaces, tactile actions, visible learning rewards. */
:root { --learn-bg:#f7f9fc; --learn-surface:#fff; --learn-border:#e0e5ed; --learn-text:#28334a; --learn-muted:#68768c; --learn-accent:#6552da; --learn-accent-edge:#4938ad; --learn-tint:#f0edff; }
.dark { --learn-bg:#101a27; --learn-surface:#172333; --learn-border:#2d3e52; --learn-text:#e7edf6; --learn-muted:#a5b3c6; --learn-accent:#8877f1; --learn-accent-edge:#5742bd; --learn-tint:#29264c; }
body.learning-ui { background:var(--learn-bg); color:var(--learn-text); }
.learning-ui h1,.learning-ui h2,.learning-ui h3 { letter-spacing:-.025em; }
.learning-ui .landing-bg,.learning-ui .auth-bg { display:none; }
.learning-ui .glass-card { background:var(--learn-surface); border:2px solid var(--learn-border); box-shadow:0 3px 0 var(--learn-border); border-radius:22px; backdrop-filter:none; }
.learning-ui .glass-card:hover { box-shadow:0 3px 0 var(--learn-border); }
.learning-ui aside,.learning-ui .glass-nav { background:var(--learn-surface); backdrop-filter:none; }
.learning-ui :is(.btn-primary,.btn-secondary) { min-height:44px; border-radius:14px; font-weight:800; letter-spacing:.01em; transition:transform .13s ease,box-shadow .13s ease,filter .13s ease; }
.learning-ui .btn-primary { background:var(--learn-accent); border:0; color:#fff; box-shadow:0 4px 0 var(--learn-accent-edge)!important; }
.learning-ui .btn-primary:hover { filter:brightness(1.08); box-shadow:0 4px 0 var(--learn-accent-edge)!important; }
.learning-ui .btn-secondary { background:var(--learn-surface); color:var(--learn-text); border:2px solid var(--learn-border); box-shadow:0 3px 0 var(--learn-border)!important; }
.learning-ui :is(.btn-primary,.btn-secondary):active:not(:disabled) { transform:translateY(3px); box-shadow:none!important; }
.learning-ui :is(button,a,summary,select):focus-visible { outline:3px solid #9e8dff; outline-offset:4px; }
.learning-ui .dash-tab { min-height:48px; border:2px solid transparent; border-radius:14px; font-weight:700; }
.learning-ui .dash-tab.active { color:var(--learn-accent); background:var(--learn-tint); border-color:color-mix(in srgb,var(--learn-accent) 35%,transparent); box-shadow:none; }
.learning-ui .category-btn { background:var(--learn-surface); border:2px solid var(--learn-border); border-radius:20px; box-shadow:0 4px 0 var(--learn-border); min-height:104px; padding:20px; transition:transform .15s ease,border-color .15s ease; }
.learning-ui .category-btn:hover { transform:translateY(-2px); background:var(--learn-surface); border-color:var(--learn-accent); box-shadow:0 4px 0 var(--learn-border); }
.learning-ui .practice-answer-btn { background:var(--learn-surface); border:2px solid var(--learn-border); border-radius:16px; box-shadow:0 3px 0 var(--learn-border); transition:background .15s,border-color .15s; }
.learning-ui .practice-answer-btn.correct { background:#eff9e8; border-color:#76b948; color:#37671d; box-shadow:0 3px 0 #76b948; }
.dark .learning-ui .practice-answer-btn.correct { background:#223b28; color:#c1edaa; }
.learning-ui .practice-answer-btn.incorrect { background:#fff1ed; border-color:#eb9c86; color:#a74430; box-shadow:0 3px 0 #eb9c86; }
.dark .learning-ui .practice-answer-btn.incorrect { background:#442d2c; color:#ffc6b9; }
.learning-ui .practice-answer-btn.correct { animation:answer-confirm .4s ease-out; }
.learning-ui .practice-answer-btn:focus-visible { outline:3px solid var(--learn-accent); outline-offset:4px; }
.learning-ui .practice-body { scroll-margin-top:110px; }
@keyframes answer-confirm { from { box-shadow:0 3px 0 #76b948,0 0 0 0 #76b94866; } to { box-shadow:0 3px 0 #76b948,0 0 0 12px #76b94800; } }
@media(prefers-reduced-motion:reduce) { .learning-ui .practice-answer-btn.correct { animation:none; } }
.learning-ui .practice-floating-bar { border-radius:20px; border-width:2px; box-shadow:0 4px 0 var(--learn-border); backdrop-filter:none; }
.learning-ui .practice-header { flex-wrap:wrap; gap:12px; }
.learning-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 24px; position:sticky; top:0; z-index:100; background:var(--learn-surface); border-bottom:2px solid var(--learn-border); }
.learning-toolbar-brand { display:flex; align-items:center; gap:8px; font-weight:800; font-size:14px; color:var(--learn-muted); }
.learning-toolbar-actions { display:flex; align-items:center; gap:7px; }
.learning-icon-button { width:44px; height:44px; border:2px solid var(--learn-border); border-radius:14px; background:var(--learn-surface); color:var(--learn-muted); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.learning-icon-button[aria-pressed="true"] { color:var(--learn-accent); background:var(--learn-tint); }
.learning-icon-button[aria-pressed="false"] { opacity:.7; }
.energy-chip { position:relative; display:inline-flex; gap:10px; align-items:center; min-width:126px; min-height:58px; padding:7px 14px 12px; border:2px solid #edc76a; border-radius:17px; background:#fff8dd; color:#986009; box-shadow:0 3px 0 #edc76a; white-space:nowrap; }
.dark .energy-chip { background:#3c3119; color:#ffcf55; border-color:#765b25; box-shadow:0 3px 0 #765b25; }
.energy-bolt { width:28px; height:34px; color:#f5b323; filter:drop-shadow(0 2px 0 #d58915); flex-shrink:0; }
.energy-value { display:flex; flex-direction:column; align-items:flex-start; line-height:1.05; }
.energy-value strong { font-size:23px; font-weight:900; font-variant-numeric:tabular-nums; }
.energy-value small { font-size:13px; margin-left:2px; opacity:.6; }
.energy-caption { font-size:10px; font-weight:800; margin-top:3px; }
.energy-mini-track { position:absolute; left:13px; right:13px; bottom:5px; height:4px; border-radius:4px; background:color-mix(in srgb,#c38b16 20%,transparent); overflow:hidden; }
.energy-mini-track span { display:block; height:100%; border-radius:inherit; background:#edb027; transition:width .25s ease; }
.energy-low { border-style:dashed; }
.energy-details { position:absolute; top:calc(100% + 8px); right:20px; width:340px; max-width:calc(100vw - 32px); padding:22px; border-radius:20px; background:var(--learn-surface); border:2px solid var(--learn-border); box-shadow:0 10px 35px #0002; color:var(--learn-text); }
.energy-details[hidden] { display:none; }
.energy-details h2 { font-size:20px; font-weight:850; margin-bottom:6px; }
.energy-details p { font-size:13px; line-height:1.6; color:var(--learn-muted); }
.energy-rules { display:grid; gap:10px; margin:18px 0; }
.energy-rules div { display:flex; gap:12px; font-size:13px; align-items:center; }
.energy-rules strong { min-width:40px; color:#ba820f; font-size:18px; }
.learning-particle { position:fixed; width:7px; height:7px; border-radius:3px; pointer-events:none; z-index:10050; }
.learning-energy-flight { position:fixed; pointer-events:none; z-index:10060; filter:drop-shadow(0 0 12px #ffc629); }
.learning-has-reward::after { content:'🎁'; position:absolute; right:-6px; top:-7px; font-size:15px; width:24px; height:24px; display:grid; place-items:center; background:var(--learn-surface); border:2px solid #74b94d; border-radius:50%; }
.reward-availability { background:var(--learn-tint); border-bottom:1px solid var(--learn-border); padding:0 16px; text-align:center; }
.reward-availability[hidden] { display:none; }
.reward-availability button { min-height:44px; color:var(--learn-accent); font-size:13px; font-weight:800; }
.learning-streak-chip { position:relative; display:flex; align-items:center; gap:5px; min-height:44px; padding:8px; border:2px solid var(--learn-border); border-radius:14px; font-size:18px; background:var(--learn-surface); color:var(--learn-text); }
.reward-ready-dot { position:absolute; right:-3px; top:-3px; width:10px; height:10px; background:#58b529; border:2px solid var(--learn-surface); border-radius:50%; }
.reward-ready-dot[hidden] { display:none; }
.learning-ui .ui-popup-overlay { background:rgba(10,18,32,.65); backdrop-filter:blur(3px); }
.learning-ui .ui-popup-card { background:var(--learn-surface)!important; color:var(--learn-text); border:2px solid var(--learn-border); border-radius:26px; box-shadow:0 7px 0 #0003,0 24px 80px #0004; backdrop-filter:none; }
.learning-ui .ui-popup-header { border-bottom:2px solid var(--learn-border); box-shadow:none; padding:20px 24px; }
.learning-ui .ui-popup-header h3 { font-weight:850; }
.learning-ui .ui-popup-card > div:last-child { box-shadow:none; border-color:var(--learn-border); }
.learning-ui .ui-popup-danger { background:#c94343; box-shadow:0 4px 0 #933434!important; }
.learning-ui .ui-popup-card button:disabled { opacity:.55; cursor:default; transform:none; }
.reward-streak { display:flex; align-items:center; gap:16px; margin:0 0 20px; }
.reward-streak > span { font-size:44px; }
.reward-streak strong { font-size:24px; font-weight:900; color:var(--learn-text); }
.reward-streak p,.reward-tile p,.reward-milestone p,.reward-spin-screen p,.reward-result p { font-size:13px; color:var(--learn-muted); margin:4px 0 12px; }
.reward-energy-summary { display:flex; align-items:center; gap:12px; padding:12px 15px; margin:0 0 18px; border:2px solid #dcbd62; border-radius:16px; background:color-mix(in srgb,#ffc834 10%,var(--learn-surface)); }
.reward-energy-summary > span { font-size:28px; }.reward-energy-summary strong { font-size:20px; font-weight:850; color:var(--learn-text); }.reward-energy-summary p { font-size:11px; color:var(--learn-muted); margin:0; }
.reward-goal { margin-bottom:24px; }
.reward-goal > div { display:flex; justify-content:space-between; font-size:12px; margin-bottom:8px; }
.reward-goal progress { width:100%; height:13px; border:0; border-radius:20px; background:var(--learn-border); overflow:hidden; accent-color:#58b529; }
.reward-goal progress::-webkit-progress-bar { background:var(--learn-border); border-radius:20px; }
.reward-goal progress::-webkit-progress-value { background:#58b529; border-radius:20px; }
.reward-cards { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.reward-tile { border:2px solid var(--learn-border); border-radius:20px; padding:18px 12px; text-align:center; }
.reward-tile h3,.reward-spin-screen h3,.reward-result h3 { font-size:18px; font-weight:850; color:var(--learn-text); }
.reward-tile button,.reward-spin-screen > button,.reward-result button { width:100%; justify-content:center; padding:10px; font-size:13px; }
.reward-chest { width:92px; height:80px; position:relative; margin:7px auto 15px; }
[data-reward-body] > .reward-chest { margin:45px auto 20px; }
.reward-chest-box { position:absolute; bottom:0; left:0; width:92px; height:49px; background:#d8992b; border:4px solid #ab6a16; border-radius:6px 6px 15px 15px; box-shadow:0 4px 0 #855117; }
.reward-chest-box::before,.reward-chest-box::after { content:''; position:absolute; width:10px; height:100%; top:0; background:#ffe183; }
.reward-chest-box::before { left:9px; }.reward-chest-box::after { right:9px; }
.reward-chest-box span { position:relative; top:2px; z-index:2; color:#7d5010; font-size:26px; }
.reward-chest-lid { position:absolute; left:-3px; top:10px; z-index:2; width:98px; height:30px; border:4px solid #ab6a16; border-radius:20px 20px 6px 6px; background:linear-gradient(#ffe082,#efb63d); transform-origin:5% 100%; }
.reward-chest-glow { position:absolute; inset:5px; border-radius:50%; background:#ffc83444; box-shadow:0 0 20px #ffc83455; }
.reward-wheel-mini { width:76px; height:76px; margin:8px auto 18px; display:grid; place-items:center; border:5px solid var(--learn-surface); outline:3px solid #9b87ed; border-radius:50%; background:conic-gradient(#ffd96b 0deg 60deg,#b5e898 60deg 120deg,#ffe9a8 120deg 180deg,#8fdcd8 180deg 240deg,#9b87ed 240deg 300deg,#e1b6ff 300deg); color:#fff; text-shadow:0 2px #7654a2; font-size:35px; }
.reward-milestone { margin:22px 0 16px; padding-top:18px; border-top:2px solid var(--learn-border); }
.reward-milestone > strong { font-size:14px; }
.reward-days { display:flex; justify-content:space-between; gap:6px; }
.reward-days span { flex:1; display:grid; place-items:center; height:32px; border-radius:9px; background:var(--learn-border); color:var(--learn-muted); font-size:12px; font-weight:800; }
.reward-days span.done { background:#d9efc8; color:#3e6b28; }
.reward-balance { font-size:12px; font-weight:750; color:var(--learn-text); line-height:1.7; }
.reward-fineprint { font-size:11px!important; color:var(--learn-muted); line-height:1.65; margin-top:12px!important; }
.reward-spin-screen,.reward-result { text-align:center; }
.reward-result { padding:10px 0 20px; }
.reward-result h3 { color:var(--learn-accent); font-size:24px; }
.reward-text-button { display:block; font-size:12px; font-weight:750; color:var(--learn-accent); padding:12px 0; margin:auto; }
.reward-wheel-wrap { position:relative; width:244px; height:244px; margin:10px auto 26px; }
.reward-wheel { position:relative; width:244px; height:244px; border:7px solid var(--learn-surface); outline:3px solid var(--learn-border); border-radius:50%; background:conic-gradient(#ffe49a 0deg 60deg,#bce59f 60deg 120deg,#ffe49a 120deg 180deg,#98deda 180deg 240deg,#b9aff5 240deg 300deg,#e5baff 300deg); box-shadow:0 6px 0 var(--learn-border); }
.reward-wheel > span { position:absolute; left:50%; top:50%; width:70px; margin-left:-35px; margin-top:-12px; transform:rotate(var(--angle)) translateY(-82px) rotate(calc(-1 * var(--angle))); font-size:18px; font-weight:900; color:#28333e; text-align:center; }
.reward-wheel > b { position:absolute; inset:91px; display:grid; place-items:center; border-radius:50%; background:#fff; color:#7b5dd1; box-shadow:0 3px 0 #0002; font-size:24px; }
.reward-wheel-pointer { position:absolute; left:50%; top:-19px; transform:translateX(-50%); z-index:3; font-size:36px; color:var(--learn-accent); filter:drop-shadow(0 3px 0 #0003); }
@media(max-width:767px) {
    .learning-toolbar-brand { display:none; }
    .learning-toolbar-actions { width:100%; justify-content:space-between; gap:4px; }
    .learning-streak-chip { font-size:16px; padding:6px; }
    .learning-ui .ui-popup-card { border-radius:26px 26px 0 0; }
    .learning-ui .ui-popup-header { padding:16px; }
    .reward-cards { gap:10px; }
    .reward-tile { padding:15px 8px; }
    .reward-tile h3 { font-size:16px; }
}
.learning-bonus { margin-top:10px; color:#548c2c; font-weight:800; font-size:14px; }
.core-offer { display:grid; grid-template-columns:1fr 260px; gap:32px; align-items:center; padding:32px; }
.core-offer-label { display:inline-flex; align-items:center; gap:8px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:850; color:var(--learn-accent); margin-bottom:14px; }
.core-offer h3 { font-size:30px; line-height:1.15; font-weight:850; margin:0 0 12px; }
.core-offer p { color:var(--learn-muted); font-size:14px; line-height:1.7; }
.core-benefits { display:grid; gap:13px; margin:22px 0; font-size:14px; font-weight:650; }
.core-benefits li { display:flex; align-items:center; gap:10px; }
.core-benefits i { color:#62a734; }
.core-price-panel { padding:24px; border-radius:20px; background:var(--learn-tint); text-align:center; }
.core-price { font-size:48px; font-weight:900; letter-spacing:-.05em; line-height:1.2; }
.core-price-caption { font-size:12px; color:var(--learn-muted); margin:8px 0 20px; line-height:1.6; }
.core-price-panel .btn-primary { width:100%; }
.offer-badge { display:inline-block; padding:6px 10px; border-radius:8px; background:#e5f5d8; color:#3e741c; font-size:11px; font-weight:850; margin-bottom:14px; }
.dark .offer-badge { background:#263c28; color:#b8e59f; }
.offer-badge[hidden],.offer-deadline[hidden] { display:none; }
.core-offer .offer-deadline,.offer-deadline { font-size:12px; line-height:1.6; color:var(--learn-text); font-weight:700; margin:0 0 18px; }
.core-offer .core-checkout-note { font-size:10px; color:var(--learn-muted); margin:12px 0 0; }
.billing-details { border-top:1px solid var(--learn-border); padding-top:12px; margin-top:20px; }
.billing-details summary { font-size:12px; color:var(--learn-muted); cursor:pointer; padding:6px 0; }
.billing-details select { margin-top:12px; }
.learning-ui #allergie-global-pill { top:auto; bottom:100px; }
.learning-ui #urgency-upsell-banner { border-left:2px solid var(--learn-border); }
.learning-ui #pricing > div > .grid > div { border-radius:22px; background:var(--learn-surface); box-shadow:0 4px 0 var(--learn-border); }
@media(max-width:767px) {
    .learning-toolbar { padding:8px 12px; }
    .learning-toolbar-brand span { display:none; }
    .learning-toolbar-brand { font-size:0; }
    .learning-toolbar-brand i { font-size:20px; color:var(--learn-accent); }
    .learning-toolbar-actions { gap:6px; }
    .learning-toolbar .energy-chip { min-width:118px; }
    .learning-icon-button { width:40px; height:42px; }
    .core-offer { grid-template-columns:1fr; padding:22px; gap:20px; }
    .core-offer h3 { font-size:26px; }
    .learning-ui .category-btn { padding:16px; }
    .learning-ui .practice-header .energy-chip { min-width:100px; min-height:48px; padding:5px 10px 10px; }
    .learning-ui .practice-header .energy-bolt { width:22px; height:28px; }
    .learning-ui .practice-header .energy-value strong { font-size:19px; }
    .learning-ui .practice-header .energy-caption { display:none; }
}
@media(prefers-reduced-motion:reduce) {
    .learning-ui *, .learning-ui *::before, .learning-ui *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}

/* One opaque global status bar; the question header only holds exercise controls. */
.learning-ui .learning-toolbar { background:var(--learn-surface)!important; opacity:1; backdrop-filter:none; isolation:isolate; padding-top:calc(10px + env(safe-area-inset-top,0px)); }
.learning-ui .practice-header { background:var(--learn-surface); border:2px solid var(--learn-border); border-radius:16px; padding:10px 12px; }
.learning-ui .practice-stop-btn { min-height:44px!important; min-width:44px!important; }
.learning-ui .practice-floating-bar { background:var(--learn-surface)!important; }
.learning-ui > nav { background:var(--learn-surface)!important; backdrop-filter:none; }
.learning-ui main { min-width:0; overscroll-behavior-y:contain; }
/* Compact spacing when exercise is active */
.mobile-exercise-active.learning-ui .learning-toolbar { padding-top:calc(4px + env(safe-area-inset-top,0px)); padding-bottom:4px; }
.mobile-exercise-active.learning-ui main > div:first-of-type { padding-top:4px!important; }
.learning-ui .practice-header { padding:4px 10px; margin-bottom:2px; }
.learning-ui .practice-body { padding-top:0.75rem!important; }
.learning-ui .ui-popup-card { padding-bottom:env(safe-area-inset-bottom,0px); }
.learning-streak-chip > i { color:#e68b2a; }
.learning-has-reward::after { content:'\f06b'; font-family:'Font Awesome 6 Free'; font-weight:900; color:#619d39; font-size:12px; }
.reward-availability i { margin:0 6px; }
.reward-overview { display:flex; align-items:stretch; gap:12px; margin-bottom:16px; }
.reward-overview .reward-energy-summary { flex:1; margin:0; padding:10px 12px; }
.reward-overview .reward-streak { margin:0; gap:8px; padding:8px; }
.reward-overview .reward-streak > span { font-size:26px; color:#e68b2a; }
.reward-overview .reward-streak strong { font-size:22px; }.reward-overview .reward-streak p { margin:0; font-size:11px; }
.reward-core-card { padding:20px; border-radius:20px; background:var(--learn-tint); border:2px solid color-mix(in srgb,var(--learn-accent) 35%,var(--learn-border)); margin-bottom:20px; }
.reward-core-top { display:flex; align-items:center; justify-content:space-between; color:var(--learn-accent); font-size:11px; letter-spacing:.12em; font-weight:850; margin-bottom:8px; }
.reward-core-top i { font-size:30px; }
.reward-core-card h3 { color:var(--learn-text); font-size:27px; font-weight:900; line-height:1.1; margin:0 0 10px; }
.reward-core-card p { font-size:12px; color:var(--learn-muted); margin:0 0 16px; }
.reward-core-card .btn-primary { width:100%; display:flex; justify-content:center; gap:10px; padding:12px; }
.reward-core-card small { display:block; text-align:center; font-size:10px; color:var(--learn-muted); margin-top:12px; }
.reward-milestone-label { display:flex; justify-content:space-between; gap:8px; font-size:12px; margin-bottom:10px; }
.reward-milestone-label span { color:var(--learn-accent); font-weight:750; }
.reward-rules { margin-top:12px; font-size:11px; color:var(--learn-muted); line-height:1.65; }
.reward-rules summary { cursor:pointer; min-height:44px; display:list-item; padding:12px 0; }
.reward-rules p { margin-bottom:8px; }
.reward-tile-copy p { margin-bottom:10px; }
.reward-elite-link { min-height:44px; }
.reward-wheel > span i { font-size:16px; }
.energy-empty { max-width:480px; margin:clamp(12px,4vh,40px) auto; padding:0 4px; }
.energy-empty-status { display:flex; align-items:center; gap:12px; margin:0 0 20px; font-size:17px; font-weight:800; color:var(--learn-text); }
.energy-empty-status > i { display:grid; place-items:center; width:52px; height:52px; flex-shrink:0; border:2px solid var(--learn-border); border-radius:16px; color:#c18b28; background:var(--learn-surface); font-size:24px; }
.energy-empty .reward-core-card { padding:28px; box-shadow:0 4px 0 color-mix(in srgb,var(--learn-accent) 25%,var(--learn-border)); }
.energy-empty .reward-core-card h3 { font-size:36px; }
.energy-free-option { width:100%; display:flex; align-items:center; justify-content:center; padding:12px; gap:10px; }
.energy-empty-note { text-align:center; color:var(--learn-muted); font-size:11px; margin:12px 0 6px; line-height:1.6; }
.energy-empty-footer { display:flex; justify-content:space-between; }.energy-empty-footer button { margin:0; min-height:44px; }
.learning-ui .ui-popup-compact .ui-popup-header { padding:12px 18px; }
.learning-ui .ui-popup-compact .ui-popup-header button { min-height:44px; min-width:44px; }
@media(max-width:767px) {
    .learning-ui .learning-toolbar-actions { justify-content:flex-end; gap:9px; }
    .learning-ui .learning-toolbar-actions .learning-streak-chip { margin-right:auto; min-width:48px; justify-content:center; }
    .learning-ui .ui-popup-compact { max-height:calc(100dvh - env(safe-area-inset-top,0px) - 12px)!important; }
    .reward-overview { gap:8px; margin-bottom:12px; }
    .reward-core-card { padding:16px; margin-bottom:16px; }
    .reward-core-card h3 { font-size:25px; }
    .reward-goal { margin-bottom:16px; }
    .reward-cards { grid-template-columns:1fr; gap:10px; }
    .reward-tile { display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:center; gap:10px; padding:12px 10px; text-align:left; }
    .reward-tile .reward-chest { transform:scale(.44); transform-origin:center; margin:-16px -23px; }
    .reward-tile .reward-wheel-mini { width:40px; height:40px; font-size:17px; border-width:3px; outline-width:2px; margin:0; }
    .reward-tile h3 { font-size:14px; }.reward-tile p { font-size:10px; margin:3px 0 0; }
    .reward-tile button { width:auto; max-width:108px; min-height:44px; font-size:11px; padding:8px 9px; }
    .reward-milestone { margin:16px 0 8px; padding-top:14px; }
    .reward-wheel-wrap,.reward-wheel { width:230px; height:230px; }
    .reward-wheel > span { transform:rotate(var(--angle)) translateY(-76px) rotate(calc(-1 * var(--angle))); }
    .reward-wheel > b { inset:85px; }
    .energy-empty .reward-core-card { padding:22px; }.energy-empty .reward-core-card h3 { font-size:32px; }
    .energy-empty-status { font-size:15px; gap:10px; }
    .learning-ui .ui-popup-compact .reward-streak strong { font-size:20px; }
}
@media(max-width:767px) {
    .learning-ui .learning-toolbar { padding-right:max(10px,env(safe-area-inset-right,0px)); padding-left:max(10px,env(safe-area-inset-left,0px)); }
    .learning-ui .learning-toolbar .energy-chip { min-width:104px; min-height:50px; padding:5px 9px 10px; gap:7px; }
    .learning-ui .learning-toolbar .energy-bolt { width:22px; height:29px; }
    .learning-ui .learning-toolbar .energy-value strong { font-size:20px; }
    .learning-ui .learning-toolbar .learning-icon-button { width:40px; height:44px; }
    .learning-ui .learning-toolbar-actions { gap:4px; }
    .learning-ui .practice-header { padding:5px 7px!important; gap:7px!important; }
    .learning-ui #practice-mobile-diff-btn { width:44px; height:44px; }
    .learning-ui .practice-question-text { overflow-wrap:anywhere; }
    .learning-ui .practice-answer-btn { min-height:48px; }
}
.learning-path { max-width:740px; margin:0 auto; color:var(--learn-text); }
.path-heading,.membership-heading { margin:12px 0 28px; }.path-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.path-heading h1,.membership-heading h1 { font-size:clamp(26px,4vw,36px); font-weight:900; letter-spacing:-1px; margin:4px 0; }
.path-heading p,.path-footnote,.membership-status p { color:var(--learn-muted); font-size:13px; }.path-eyebrow { color:var(--learn-accent); font-size:10px; font-weight:900; letter-spacing:1.5px; }
.path-total { white-space:nowrap; font-weight:800; font-size:13px; padding:10px 12px; background:var(--learn-surface); border:2px solid var(--learn-border); border-radius:14px; }
.path-unit { padding:20px; background:var(--learn-accent); color:white; border-radius:22px; box-shadow:0 5px 0 color-mix(in srgb,var(--learn-accent) 70%,black); }
.path-unit-nav { display:flex; align-items:center; justify-content:space-between; gap:10px; text-align:center; }.path-unit-nav span { font-size:10px; letter-spacing:1px; font-weight:800; opacity:.8; }.path-unit h2 { font-size:22px; font-weight:850; }.path-unit p { font-size:12px; text-align:center; margin-top:8px; opacity:.85; }.path-unit-nav button { width:44px; height:44px; border-radius:13px; background:#fff2; flex-shrink:0; }.path-unit-nav button:disabled { opacity:.3; }
.path-stations { list-style:none; margin:0; padding:36px 0 0; overflow:hidden; }.path-station { position:relative; display:flex; flex-direction:column; align-items:center; padding-bottom:38px; transform:translateX(var(--path-offset)); margin-right:65px; }
.path-station:not(:last-child)::after { content:''; width:6px; border-radius:5px; background:var(--learn-border); position:absolute; top:90px; bottom:-5px; left:50%; z-index:-1; }.path-station.is-done::after { background:#79be48; }
.path-node { width:88px; height:80px; border-radius:50%; border:5px solid var(--learn-surface); outline:3px solid var(--learn-border); background:var(--learn-border); box-shadow:0 7px 0 color-mix(in srgb,var(--learn-border) 78%,black); display:grid; place-items:center; font-size:28px; color:var(--learn-muted); position:relative; z-index:1; }
.path-node:focus-visible { outline:4px solid #f7bc36; outline-offset:5px; }.is-current .path-node { background:var(--learn-accent); color:#fff; outline-color:var(--learn-accent); box-shadow:0 8px 0 color-mix(in srgb,var(--learn-accent) 70%,black); }.is-current .path-node:active { transform:translateY(5px); box-shadow:0 3px 0 var(--learn-accent); }.is-done .path-node { background:#58a929; color:white; outline-color:#79be48; box-shadow:0 7px 0 #3f861b; }
.path-station-label { text-align:center; margin-top:20px; background:var(--learn-bg,#f7f8fc); padding:5px 10px; max-width:280px; border-radius:12px; }.path-station-label strong { display:block; font-size:15px; }.path-station-label span,.path-station-label small { display:block; font-size:11px; color:var(--learn-muted); line-height:1.7; margin-top:3px; }.path-start { margin:12px auto 10px; min-width:170px; justify-content:center; }.is-locked .path-station-label { opacity:.65; }
.path-footnote { text-align:center; padding:0 15px 30px; }.path-footnote details { max-width:420px; margin:16px auto; text-align:left; }.path-footnote summary { text-align:center; cursor:pointer; }.path-footnote p { margin-top:12px; line-height:1.7; }
.path-complete,.path-finished,.path-error { padding:40px 20px; text-align:center; }.path-complete { max-width:480px; margin:25px auto; }.path-complete h1 { font-size:34px; font-weight:900; margin:14px 0 25px; letter-spacing:-1px; }.path-trophy { display:grid; place-items:center; width:116px; height:116px; border-radius:35px; margin:0 auto 30px; background:#fff0bb; color:#e2a116; box-shadow:0 7px 0 #ebcd69; font-size:62px; }.path-result { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }.path-result > span { padding:15px; border:2px solid var(--learn-border); border-radius:16px; background:var(--learn-surface); font-size:13px; }.path-result strong { font-size:20px; }.path-energy { color:#b7820b; }.path-complete p { margin:20px 0; color:var(--learn-muted); font-size:14px; }.path-complete .btn-primary { width:100%; justify-content:center; }.path-error button { margin:15px 5px; }
.path-lesson-progress { display:flex; gap:16px; align-items:center; padding:12px 0 20px; font-size:12px; font-weight:800; color:var(--learn-muted); }.path-lesson-progress span { white-space:nowrap; }.path-lesson-progress progress { flex:1; min-width:0; height:12px; border:0; border-radius:10px; overflow:hidden; accent-color:#58b529; }.path-lesson-progress progress::-webkit-progress-bar { background:var(--learn-border); }.path-lesson-progress progress::-webkit-progress-value { background:#58b529; border-radius:10px; transition:width .3s ease; }.path-practice .practice-diff-selector,.path-practice #practice-mobile-diff-btn { display:none!important; }
.membership-page { max-width:920px; margin:0 auto; color:var(--learn-text); }.membership-status { display:flex; align-items:center; gap:16px; justify-content:space-between; padding:17px 20px; border:2px solid var(--learn-border); background:var(--learn-surface); border-radius:18px; margin-bottom:24px; }.membership-status strong { font-size:15px; }.membership-status p { margin-top:3px; }.membership-status > span { font-size:11px; white-space:nowrap; }
.membership-offer { display:grid; grid-template-columns:1.25fr 1fr; border:2px solid var(--learn-border); border-radius:26px; background:var(--learn-surface); overflow:hidden; box-shadow:0 5px 0 var(--learn-border); }.membership-story { padding:32px; }.membership-emblem { display:grid; place-items:center; width:60px; height:56px; border-radius:18px; background:var(--learn-tint); color:var(--learn-accent); font-size:32px; margin-bottom:22px; }.membership-story h2 { font-size:clamp(28px,4vw,38px); font-weight:900; line-height:1.12; letter-spacing:-1.2px; margin:8px 0 14px; }.membership-story > p { color:var(--learn-muted); font-size:14px; line-height:1.7; }.membership-story ul { display:grid; gap:20px; margin-top:28px; }.membership-story li { display:flex; gap:13px; align-items:center; color:var(--learn-muted); font-size:12px; }.membership-story li > i { width:24px; font-size:21px; color:var(--learn-accent); text-align:center; }.membership-story li strong { display:block; color:var(--learn-text); font-size:14px; margin-bottom:3px; }
.membership-buy { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:16px; padding:32px; background:var(--learn-tint); border-left:2px solid var(--learn-border); }.membership-buy .core-price { font-size:60px; font-weight:900; line-height:1; }.membership-buy .btn-primary { width:100%; justify-content:center; margin-top:8px; }.membership-buy .offer-deadline { margin:0; line-height:1.6; }.membership-buy .billing-details { width:100%; margin-top:6px; font-size:12px; }.membership-buy .core-checkout-note { align-self:center; margin:0; }.membership-free { display:flex; gap:14px; align-items:center; padding:24px 6px; font-size:12px; color:var(--learn-muted); }.membership-free > i { color:#58a929; font-size:24px; }.membership-free p { flex:1; line-height:1.6; }.membership-free strong { display:block; color:var(--learn-text); }.membership-free button { white-space:nowrap; }
.membership-invoices { border-top:2px solid var(--learn-border); margin-top:12px; }.membership-invoices > summary { padding:20px 2px; font-size:14px; font-weight:750; cursor:pointer; }.membership-invoices summary span { float:right; font-size:11px; color:var(--learn-muted); }.membership-simulation { display:flex; gap:12px; padding:14px; border:1px dashed #c99722; margin-bottom:20px; font-size:12px; }.membership-simulation.hidden { display:none; }.membership-offer.hidden { display:none; }
@media (max-width:640px) { .membership-offer { grid-template-columns:1fr; }.membership-story { padding:24px; }.membership-story ul { gap:15px; margin-top:20px; }.membership-buy { padding:24px; border-left:0; border-top:2px solid var(--learn-border); gap:12px; }.membership-emblem { float:right; width:50px; height:48px; margin-left:10px; }.membership-story h2 { clear:both; padding-top:5px; }.membership-free { flex-wrap:wrap; }.membership-free button { margin-left:36px; }.membership-status { padding:14px; flex-wrap:wrap; }.path-heading { align-items:flex-start; }.path-total { font-size:11px; padding:8px; }.path-unit { padding:16px 10px; }.path-unit h2 { font-size:19px; }.path-station { --path-offset:0px!important; margin-right:0; }.path-station:nth-child(even) { transform:translateX(24px); }.path-station:nth-child(3) { transform:translateX(-24px); }.path-station-label { max-width:245px; }.path-complete h1 { font-size:29px; } }
@media (prefers-reduced-motion:no-preference) { .path-complete .path-trophy { animation:path-reward-in .55s cubic-bezier(.2,1.5,.5,1) both; } @keyframes path-reward-in { from { transform:scale(.4) rotate(-20deg); opacity:0; } to { transform:scale(1) rotate(0); opacity:1; } } }
.membership-access { font-size:12px; color:var(--learn-muted); align-self:center; }
.membership-page.has-core .membership-free { display:none; }
.membership-status { margin-top:12px; }
@media (max-width:640px) {
 .membership-heading { margin:6px 0 20px; }
 .membership-heading h1 { font-size:26px; }
 .membership-story { padding:20px!important; }
 .membership-story ul { gap:9px!important; margin-top:18px!important; }
 .membership-story li span { font-size:0; }
 .membership-story li strong { font-size:12px!important; margin:0!important; }
 .membership-story li > i { font-size:15px!important; }
 .membership-story > p { font-size:12px!important; }
 .membership-status > span { display:none; }
}
@media (prefers-reduced-motion:no-preference) {
 .path-station.is-current .path-node { animation:path-node-in .4s ease-out both; }
 @keyframes path-node-in { from { transform:translateY(8px) scale(.85); opacity:.4; } to { transform:translateY(0) scale(1); opacity:1; } }
}
.membership-buy .core-checkout-note { font-size:11px; color:var(--learn-muted); }
.membership-buy .billing-details summary { min-height:44px; display:flex; align-items:center; }
.membership-buy #mem-ch-warning { font-size:12px; line-height:1.6; color:var(--learn-muted); margin-top:12px; }
@media (max-width:380px) { .membership-free p { flex-basis:calc(100% - 44px); }.membership-free button { width:calc(100% - 36px); text-align:left; }.membership-heading .path-eyebrow { font-size:9px; } }
.membership-status .hidden { display:none!important; }
.learning-ui .feature-disabled,.learning-ui [data-tab="learnCards"][hidden],.learning-ui .subtab-btn[hidden] { display:none!important; }
.reward-odds { text-align:center; margin:14px 0 0; }
.reward-odds summary { font-size:11px; color:var(--learn-muted); cursor:pointer; }
.path-complete .path-result { margin-bottom:28px; }
.learning-toolbar-actions { margin-left:auto; }
.path-section-picker { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.path-section-picker label { font-size:12px; color:var(--learn-muted); font-weight:750; }
.path-section-picker select { min-height:44px; min-width:0; flex:1; border:2px solid var(--learn-border); border-radius:12px; background:var(--learn-surface); color:var(--learn-text); padding:8px 12px; font-weight:750; font-size:14px; }
.path-section-picker button { min-height:44px; font-size:12px; }
.path-etappen { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:6px; margin:22px 0; }
.path-etappen button { min-height:44px; border:2px solid var(--learn-border); border-radius:12px; font-size:13px; font-weight:850; background:var(--learn-surface); color:var(--learn-muted); }
.path-etappen .is-selected { background:var(--learn-tint); color:var(--learn-accent); border-color:var(--learn-accent); box-shadow:0 3px 0 var(--learn-accent-edge); }
.path-etappen .is-done { color:#58a929; }
.path-etappe-title { font-size:17px; font-weight:850; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px; }
.path-etappe-title span { font-size:11px; font-weight:500; color:var(--learn-muted); }
@media(max-width:640px) { .path-etappen { grid-template-columns:repeat(6,minmax(0,1fr)); }.path-section-picker label { display:none; }.path-section-picker select { width:100%; }.path-etappe-title span { width:100%; }.path-stations { padding-top:28px; } }
.path-unit-nav > div { min-width:0; flex:1; }
.path-unit select { display:block; width:100%; min-height:44px; color:white; background:transparent; font-size:20px; font-weight:850; text-align:center; border:0; cursor:pointer; padding:0 3px; }
.path-unit select option { background:var(--learn-surface); color:var(--learn-text); }
.path-return { margin:-8px 0 12px; text-align:right; }.path-return button { min-height:44px; }
@media(max-width:380px) { .path-unit select { font-size:16px; }.path-unit-nav > button { width:36px; }.path-unit-nav { gap:5px; } }