:root{--ink:#e9fff5;--muted:#91aaa2;--paper:#07100f;--white:#101c1b;--lime:#c7ff62;--green:#8bffd0;--line:#203a35;--orange:#ffac75;--shadow:0 16px 48px #0005;--shadow-hover:0 22px 55px #00f3b221}
html{background:#06100f}
body{position:relative;isolation:isolate;background:radial-gradient(ellipse at 65% -10%,#15372f 0,transparent 37%),radial-gradient(ellipse at 3% 44%,#15243c44 0,transparent 30%),#07100f;color:var(--ink)}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.19;background-image:linear-gradient(#b6ffe90a 1px,transparent 1px),linear-gradient(90deg,#b6ffe90a 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000,transparent 82%)}
.sidebar{background:#081311ec;border-color:#1a3430;box-shadow:12px 0 45px #0004;backdrop-filter:blur(18px)}
.brand{color:#f0fff8}
.logo{background:linear-gradient(135deg,#d4ff70,#73f5c4);color:#0b1916;box-shadow:0 0 24px #91ffb951}
.navlabel{color:#6e8980}
.nav button{color:#94aaa1}
.nav button.active,.nav button:hover{background:linear-gradient(100deg,#b9ff6018,#6fffd00a);color:#eafff5}
.nav button.active{box-shadow:inset 3px 0 #c7ff62,0 0 22px #75ffb90a}
.sidebottom{border-color:#203a35}
.avatar{background:#19342e;color:#9effd5}
.main{position:relative}
.top{position:sticky;top:0;z-index:4;margin:0 -12px;padding:0 12px;background:#07110fe8;border-bottom:1px solid #a5ffcf0d;backdrop-filter:blur(18px)}
.crumb{color:#6f8a82}
.topright{color:#9db5ad}
.tag{background:#baff6012;color:#c7ff62;border:1px solid #baff6028}
.gender-setting{background:#0c1c19;border-color:#25423a}
.gender-option{color:#9cb7ac}
.gender-option[aria-pressed="true"]{background:linear-gradient(135deg,#c7ff62,#84edbd);color:#10201b;box-shadow:0 0 16px #a3ff6438}
.langtrigger,.langoption{background:#0e1c19;color:#d9f5e9;border-color:#29433b}
.langtrigger:hover,.langoption:hover,.langoption.selected{background:#19332a;color:#d8ff91}
.langmenu{background:#0c1916;border-color:#2b483e}
.flag{box-shadow:0 0 0 1px #ffffff28}
.hero.cosmic-hero{min-height:470px;grid-template-columns:minmax(310px,.82fr) minmax(370px,1.18fr);gap:20px;padding:42px 48px;border-radius:30px;border:1px solid #72ffd22b;background:radial-gradient(ellipse at 76% 52%,#164737a6,transparent 44%),radial-gradient(ellipse at 96% 0%,#643c8e38,transparent 40%),linear-gradient(125deg,#0b1918 0%,#0d211e 48%,#0c171e 100%);box-shadow:0 30px 90px #0008,0 0 0 1px #a6ffe80a inset;isolation:isolate;overflow:hidden}
.cosmic-hero:before{content:"";position:absolute;inset:-20% -8% -40% 38%;z-index:-1;pointer-events:none;background:conic-gradient(from 30deg at 52% 48%,transparent 0deg,#47ffd00c 45deg,transparent 95deg,#a281ff0a 180deg,transparent 245deg,#6effcc0b 300deg,transparent 360deg);filter:blur(12px);animation:cosmicSpin 38s linear infinite}
.cosmic-hero:after{content:"";position:absolute;width:430px;height:430px;right:15%;top:-46%;border:1px solid #8dffd11c;border-radius:50%;box-shadow:0 0 0 27px #8dffd109,0 0 0 56px #8dffd106,0 0 0 96px #8dffd104;pointer-events:none;z-index:-1;animation:ringBreath 7s ease-in-out infinite alternate}
.hero-copy{position:relative;z-index:2;max-width:520px}
.eyebrow{display:flex;align-items:center;gap:10px;color:#a8ffd6;font-size:10px;letter-spacing:2.3px}
.eyebrow-signal,.system-pulse{width:7px;height:7px;border-radius:50%;background:#c7ff62;box-shadow:0 0 14px #c7ff62;animation:signalPulse 1.8s infinite}
.hero h1{max-width:480px;margin:24px 0 13px;font-size:clamp(42px,5vw,68px);line-height:.98;letter-spacing:-3.5px;font-weight:850;background:linear-gradient(100deg,#fff 8%,#caffdf 52%,#86f3d2);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-copy>p{margin:0;color:#99b5aa;font-size:17px;letter-spacing:.1px}
.hero-welcome{margin-top:10px;color:#718d83;font-size:12px}
.hero-actions{display:flex;align-items:center;gap:24px;margin-top:28px}
.hero-actions .btn{display:flex;align-items:center;gap:23px;padding:13px 16px 13px 20px;border-radius:12px;background:linear-gradient(110deg,#d4ff69,#8df5b9);color:#0b1915;font-size:13px;box-shadow:0 0 30px #8bffb62e,0 8px 30px #0004}
.hero-actions .btn:hover{transform:translateY(-3px);box-shadow:0 0 38px #8bffb65c,0 12px 35px #0006}
.button-arrow{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#153229;color:#c9ff76;font-size:16px;transition:transform .2s}
.hero-actions .btn:hover .button-arrow{transform:translate(2px,-2px)}
.hero-link{display:flex;align-items:center;gap:9px;background:none;color:#c1dbcf;font-size:12px;font-weight:700}
.hero-link span{color:#9df9cd;font-size:16px;transition:transform .2s}
.hero-link:hover span{transform:translate(3px,-3px)}
.hero-system{display:flex;align-items:center;gap:9px;margin-top:37px;color:#6f9283;font:700 9px/1.2 ui-monospace,monospace;letter-spacing:1.2px}
.hero-system i{width:3px;height:3px;border-radius:50%;background:#477864}
.hero-system .system-pulse{width:6px;height:6px}
.today-panel{position:relative;z-index:1;min-width:0;align-self:center;padding:18px;border:1px solid #2a463d;border-radius:18px;background:linear-gradient(150deg,#10241fe8,#0b1718f0);box-shadow:0 18px 50px #0005,inset 0 1px #ffffff0a;color:#e5f8ee}
.today-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.today-head h2{margin:0;font-size:17px;color:#effff7;letter-spacing:-.3px}
.today-date{color:#86a399;font-size:12px}
.today-list{display:grid;gap:10px}
.today-item{display:grid;gap:5px;padding:12px 14px;border:1px solid #253d36;border-radius:13px;background:#0c1716b8;min-width:0}
.today-item>small{color:#7e9c8f;font:700 10px ui-monospace,monospace;letter-spacing:1px;text-transform:uppercase}
.today-item strong{color:#f1fff8;font-size:16px;overflow-wrap:anywhere}
.today-item strong b{color:#c7ff62}
.today-item p{margin:0;color:#9db5aa;font-size:12px;line-height:1.4}
.today-item .btn{justify-self:start;margin-top:4px;min-height:40px}
.today-bar{height:8px;border-radius:99px;background:#1a2e28;overflow:hidden}
.today-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#c7ff62,#6fe8b2)}
.today-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:#9db5aa;font-size:12px}
.today-note b{color:#effff7}
.today-item.warn{border-color:#7a5a28;background:#2a2113b8}
.today-item.warn>small,.today-item.warn .today-note b{color:#ffcf8c}
.today-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.today-chip{min-height:36px;padding:6px 12px;border:1px solid #7a5a28;border-radius:99px;background:#2a2113;color:#ffdca8;font:700 12px inherit;font-family:inherit;cursor:pointer}
.today-chip:hover,.today-chip:focus-visible{border-color:#ffcf8c;color:#fff}
.today-more{align-self:center;color:#ffcf8c;font-size:12px}
@media(max-width:760px){.today-panel{padding:14px;margin-top:6px}
}
.stats{gap:12px;margin-top:16px}
.stat{position:relative;overflow:hidden;background:linear-gradient(145deg,#101f1d,#0c1717);border:1px solid #253d36;border-radius:16px;box-shadow:inset 0 1px #ffffff07}
.stat:after{content:"";position:absolute;inset:auto -30px -36px auto;width:110px;height:78px;background:#73ffbf12;filter:blur(28px)}
.stat:hover{border-color:#80eec353;transform:translateY(-3px);box-shadow:0 16px 40px #0005,0 0 22px #5effc40e}
.staticon{background:#baff6010;color:#c7ff62;border:1px solid #baff601a}
.stat strong{color:#f1fff8;font-size:25px}
.stat small{color:#86a399}
.stat-arrow{margin-left:auto;color:#76bd9c;align-self:flex-start;transition:transform .2s}
.stat:hover .stat-arrow{transform:translate(3px,-3px);color:#c7ff62}
.titlebar,.sectionhead{margin-top:32px}
.titlebar h2,.sectionhead h2{color:#e8fff4;font-size:20px;letter-spacing:-.6px}
.titlebar p,.sectionhead p{color:#829b91}
.titlebar .btn.secondary{background:#10201d;color:#c5e9d8;border-color:#29453b}
.titlebar .btn.secondary:hover{border-color:#84ecc1;color:#d6ff91}
.program{background:#0e1b19;border-color:#243a34;border-radius:18px;overflow:hidden}
.program:hover{border-color:#71dba865}
.programtop{background:radial-gradient(circle at 82% 38%,#a1ffb82c,transparent 35%),linear-gradient(130deg,#152d25,#11211f)}
.programtop.orange{background:radial-gradient(circle at 82% 38%,#ffa06d31,transparent 36%),linear-gradient(130deg,#30231e,#1c1d1c)}
.programtop.blue{background:radial-gradient(circle at 82% 38%,#8589ff35,transparent 36%),linear-gradient(130deg,#202438,#141d20)}
.programtop:after{border-color:#bbffda2b;box-shadow:0 0 0 18px #b8ffe10c,0 0 0 38px #b8ffe107}
.programbody h3{color:#f2fff8}
.programbody p{color:#8ca49a}
.meta{color:#9bb2a7}
.price{color:#dcffe9}
.price small{color:#81978d}
.btn{background:linear-gradient(110deg,#d1ff64,#89edb8);color:#102019;box-shadow:0 4px 18px #92fd9d18}
.btn.secondary,.btn.ghost{background:#142722;color:#c9ecda;border:1px solid #29433a}
.btn.dark{background:linear-gradient(110deg,#8fffc6,#82cfff);color:#071814}
.section-code{color:#65917c;font:700 9px ui-monospace,monospace;letter-spacing:1.5px}
.today,.checkinbox,.toc,.doc,.lessonpanel,.lessonfocus{background:linear-gradient(145deg,#101d1b,#0c1716);border-color:#263d36;color:#e5f8ee}
.sessionrow{border-color:#203730}
.sessionday{background:#baff6010;color:#bff781;border:1px solid #c1ff6319}
.sessionrow h3{color:#e4fff1}
.sessionrow p,.checkinbox p{color:#8aa198}
.checkicon{background:#9effc21a;color:#a4ffd1}
.notice{background:#372a18;color:#ffcf8c;border:1px solid #644922}
.exercise,.historyrow{background:#0f1b19;border-color:#233a33;color:#e6f7ed}
.exercise h4,.historyrow strong{color:#edfff4}
.exercise p,.historyrow small{color:#8aa197}
.exnum{background:#14251f;color:#c7ff62;box-shadow:inset 0 0 0 1px #38553c}
.sets{color:#b2d2c2}
.locked{opacity:.66}
.filters .filter{background:#101e1c;border-color:#284139;color:#a2b9ad}
.filters .filter:hover{border-color:#72eab8;color:#d7ffe8}
.filters .filter.active{background:linear-gradient(110deg,#c8ff62,#86efb8);border-color:transparent;color:#102019}
.excard{background:linear-gradient(145deg,#111e1c,#0d1817);border-color:#263d36}
.excard strong{color:#ecfff3}
.excard small{color:#8ca59a}
.excard .learnhint{color:#b6ee9b!important}
.excard:hover,.excard:focus-visible{border-color:#77f6c17d;background:#132521}
.excard:after{opacity:.13}
.exercise-icon{box-shadow:inset 0 0 0 1px #ffffff11}
.docgrid .toc a{color:#aac1b5}
.doc h2{color:#eafff3}
.doc p,.doc li{color:#aec0b7}
.doc th{background:#162722;color:#d4f2e3}
.doc td,.doc th{border-color:#294239}
.modalback{background:#03110fe0;backdrop-filter:blur(8px)}
.modal{background:#10201d;color:#eafff3;border:1px solid #315247}
.modal p,.modal label{color:#a8bdb2}
.modal label{background:#152a24}
.lessonback{background:#03100fee;backdrop-filter:blur(8px)}
.lessonmodal{background:#0c1715;border:1px solid #355147}
.lessonhead{background:#101d1b;border-color:#2a4139}
.lessonhead h2{color:#edfff5}
.lessonhead p{color:#91aaa0}
.lessonvisual{background:#111e19;border-color:#294339}
.lessonvisual:has(.exercise-video){background:#101917}
.lessonfocus{background:#14251f;border-color:#2d503d;color:#bdd5c7}
.lessonfocus strong{color:#d9ff9f}
.lessonpanel h3{color:#e9fff4}
.lessonpanel li{color:#b0c5ba}
.lessonfoot{color:#b4c7bd}
.lessonclose{background:#192a25;color:#d5f2df}
.langmenu{box-shadow:0 15px 40px #0008}
.toast{background:#c8ff62;color:#0c1a13}
.exercise-titleline{color:#effff5}
.historyrow .tag{white-space:nowrap}
.smallnote{color:#789188}
.filters .filter:focus-visible,.btn:focus-visible,.nav button:focus-visible,.hero-link:focus-visible{outline:2px solid #c7ff62;outline-offset:3px}
@keyframes cosmicSpin{to{transform:rotate(360deg)}
}
@keyframes ringBreath{from{transform:scale(.96);opacity:.5}
to{transform:scale(1.05);opacity:1}
}
@keyframes signalPulse{0%,100%{opacity:1;box-shadow:0 0 14px #c7ff62}
50%{opacity:.45;box-shadow:0 0 4px #c7ff62}
}
@media(max-width:1100px){.hero.cosmic-hero{padding:35px 32px;grid-template-columns:minmax(280px,.9fr) minmax(300px,1.1fr);min-height:430px}
.hero h1{font-size:clamp(40px,5vw,58px)}
}
@media(max-width:760px){.hero.cosmic-hero{grid-template-columns:1fr;gap:4px;padding:30px 26px 18px}
.hero-copy{max-width:620px}
.hero h1{font-size:clamp(40px,8vw,56px);max-width:520px}
.hero-system{margin-top:23px}
}
@media(max-width:660px){.sidebar{background:#081311f2;border-color:#203a35}
.main{padding-top:0}
.top{background:#07110ff2}
.cosmic-hero:after{width:290px;height:290px;right:-4%;top:-16%}
.hero.cosmic-hero{padding:24px 19px 15px;min-height:0;border-radius:23px}
.hero h1{font-size:clamp(36px,10vw,48px);letter-spacing:-2.4px;margin-top:18px}
.hero-copy>p{font-size:15px}
.hero-welcome{font-size:11px}
.hero-actions{gap:15px;flex-wrap:wrap;margin-top:20px}
.hero-actions .btn{min-height:48px}
.hero-link{min-height:44px}
.hero-system{margin-top:17px;font-size:8px}
.stats{gap:7px}
.stat{padding:11px 9px;gap:8px}
.stat strong{font-size:19px}
.staticon{width:34px;height:34px;font-size:16px}
.stat-arrow{display:none}
.titlebar,.sectionhead{margin-top:25px}
.programtop{height:104px}
.programbody{padding:14px}
.programfoot{align-items:center;flex-direction:row}
.programfoot .btn{width:auto}
.sessionrow{background:transparent}
.excard{min-height:94px}
.lessonhead,.lessonpanel,.doc{background:#101d1b}
}
@media(max-width:390px){.hero-actions{gap:7px}
.hero-actions .btn{gap:12px;padding-left:13px;padding-right:11px;font-size:12px}
.hero-link{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.cosmic-hero:before,.cosmic-hero:after{animation:none!important;transition:none!important}
}