[hidden]{display:none!important}
:root{font-family:Inter,system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:#203052;background:#eef4ff;font-size:14px;--blue:#4e7bff;--purple:#7868f5;--muted:#70809f;--line:#e6ecf6;--shadow:0 8px 32px #36569708,0 2px 6px #36569704;--sidebar:248px}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 85% 0%,#dee5ff,transparent 48%),radial-gradient(ellipse at 15% 65%,#e4f3ff,transparent 45%),#f3f6fc;line-height:1.55}
button,input,select,textarea{font:inherit}
button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:11px;min-height:40px;padding:9px 17px;background:linear-gradient(135deg,#4e7bff,#626df3);color:#fff;font-weight:550;cursor:pointer;box-shadow:0 3px 8px #4e7bff19;transition:background .16s,box-shadow .16s,transform .16s}
button:hover{box-shadow:0 5px 14px #4e7bff30;filter:brightness(1.03)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.5;cursor:wait;transform:none}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #4e7bff50;outline-offset:2px}
.secondary{background:#f1f5fe;color:#4261a3;box-shadow:none;border-color:#e4ebfa}
.secondary:hover{background:#e7eeff;box-shadow:none}
input,select,textarea{width:100%;padding:11px 13px;min-height:44px;border:1px solid #dde5f1;border-radius:10px;background:#ffffffd9;color:#203052;transition:border-color .16s,box-shadow .16s}
input::placeholder,textarea::placeholder{color:#92a0b7}
input:focus,select:focus,textarea:focus{border-color:#94b7ff;box-shadow:0 0 0 3px #4e7bff0d}
input[readonly],select:disabled{background:#f1f4fa;color:#70809f}
input[type=file]{padding:8px;font-size:13px}
input::file-selector-button{border:0;border-radius:7px;background:#edf2ff;color:#4261a3;padding:7px 12px;margin-right:12px;cursor:pointer}
textarea{min-height:106px;resize:vertical}
label{display:block;margin:18px 0;color:#4c5f80;font-size:13px;font-weight:550}
label input,label select,label textarea{margin-top:8px;font-weight:400}
small{font-size:12px}
svg{width:22px;height:22px;flex-shrink:0;vertical-align:middle}
aside{display:flex;flex-direction:column;position:fixed;width:var(--sidebar);inset:0 auto 0 0;background:#ffffff94;backdrop-filter:blur(24px);border-right:1px solid #fff;padding:24px 16px;z-index:2}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0;color:#20335b;font-size:23px;font-weight:750;letter-spacing:1px;margin:0 4px 34px;white-space:nowrap}
.brand img{width:56px;height:56px;object-fit:contain;flex-shrink:0;mix-blend-mode:multiply}
.brand small{display:block;color:#8491ab;font-weight:400;font-size:10px;letter-spacing:3px;margin-top:3px}
.navCaption{font-size:10px;letter-spacing:2px;color:#96a3b9;padding:0 18px 12px}
nav{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#d4def1 transparent;padding:2px}
nav button{display:flex;gap:12px;width:100%;justify-content:flex-start;min-height:46px;text-align:left;background:transparent;color:#5e6f8f;font-weight:500;margin:4px 0;padding:12px 14px;border:1px solid transparent;box-shadow:none}
nav button:hover{background:#eef3ff;box-shadow:none;filter:none}
nav .navIcon{width:22px;flex-shrink:0;text-align:center;display:flex;align-items:center}
nav .navIcon svg{width:21px;height:21px}
nav .navLabel{flex:1}
nav .navChevron{font-size:20px;line-height:1;color:#91a2c2;transition:transform .16s}
nav .navParent.expanded{color:#426bf2;font-weight:650}
nav .navParent.expanded .navChevron{transform:rotate(90deg)}
nav .navParent.active{background:linear-gradient(100deg,#e1eaff,#ececff);color:#426bf2;border-color:#dce6ff;box-shadow:0 3px 12px #4e7bff09}
nav .navChildren{margin:4px 0 14px 25px;padding-left:12px;border-left:1px solid #dce5f7}
nav .child{position:relative;min-height:40px;font-size:13px;margin:3px 0;padding:9px 12px 9px 24px;border:0;border-radius:9px}
nav .child.active{background:#e8eeff;color:#3c60d5;font-weight:650}
nav .child.active::before{content:"";position:absolute;left:10px;width:5px;height:5px;border-radius:50%;background:#4e7bff}
.asideFooter{position:relative;overflow:hidden;flex-shrink:0;margin-top:18px;padding:20px 16px;border:1px solid white;border-radius:16px;background:linear-gradient(120deg,#e4efffb0,#eeebffb0);color:#5774b6}
.asideFooter strong,.asideFooter small{display:block;position:relative}
.asideFooter strong{font-size:13px;font-weight:600}
.asideFooter small{font-size:11px;color:#8494b5;margin-top:4px}
.footerEmblem{position:absolute;right:8px;top:-24px;color:#b4bafa7a;font-size:90px}
main{margin-left:var(--sidebar);padding:0 32px 24px;max-width:1900px;min-width:0}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:88px;border-bottom:1px solid #dfe6f280;margin-bottom:20px}
.breadcrumb{display:flex;align-items:center;gap:12px;font-size:12px;color:#8593ad;white-space:nowrap}
.breadcrumb strong{font-weight:500;color:#4f6285}
.headerTools{display:flex;align-items:center;gap:14px;min-width:0}
.searchField{display:flex;align-items:center;gap:6px;background:#ffffffa1;border:1px solid #fff;border-radius:12px;padding:0 12px;width:clamp(170px,20vw,290px)}
.searchField>span{font-size:26px;color:#879bc6;line-height:1}
.searchField input{background:transparent;border:0;min-height:40px;padding:8px 4px;font-size:12px;box-shadow:none}
.environment{display:inline-flex;align-items:center;gap:6px;background:#edf2ffc9;color:#6b7eaa;border:1px solid #dde5fa;border-radius:6px;padding:4px 8px;font-size:10px;white-space:nowrap}
.environment::before{content:"";width:5px;height:5px;border-radius:50%;background:#8a9ac9}
.userChip{background:transparent;color:#425675;padding:0;box-shadow:none;max-width:180px;font-size:12px}
.userChip:hover{background:transparent;box-shadow:none}
#username{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:105px}
.userInitial{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(130deg,#dbe8ff,#e8e1ff);color:#6476b9;font-weight:700;flex-shrink:0}
#logout{font-size:12px;min-height:32px;padding:5px 11px}
h1{font-size:28px;line-height:1.3;letter-spacing:-.5px;margin:6px 0 12px;font-weight:700;color:#203052}
h2{font-size:16px;margin:0;font-weight:650;color:#283b61}
p{color:var(--muted);margin:10px 0 22px;line-height:1.75;font-size:13px}
.eyebrow{font-size:10px;letter-spacing:2px;color:#718dc4;font-weight:600;display:block;margin-bottom:12px}
.panel{background:#ffffffcc;backdrop-filter:blur(16px);border:1px solid #fff;border-radius:18px;padding:24px;margin:20px 0;box-shadow:var(--shadow)}
.panelHead{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.panelHead h1{margin:6px 0}
.panel .panelHead h2{display:flex;align-items:center;gap:9px}
.panel .panelHead h2::before{content:"";width:3px;height:15px;border-radius:3px;background:linear-gradient(#4e7bff,#9c8bf8)}
.hero{position:relative;overflow:hidden;padding:28px 30px;border:1px solid #ffffffd9;border-radius:20px;background:linear-gradient(105deg,#e6efffd9,#e9edff8a 60%,#f6f9ffc9);margin:4px 0 24px;box-shadow:var(--shadow)}
.hero .eyebrow{margin-bottom:8px}
.hero h1{font-size:30px;margin-bottom:10px}
.hero p{margin:0;max-width:80%;position:relative}
.heroArt{position:absolute;right:24px;top:10px;display:grid;place-items:center;width:150px;height:150px;border:1px solid #ffffff90;border-radius:40px;transform:rotate(-14deg);background:linear-gradient(140deg,#ffffff80,#d8e1ff50);color:#91aaf1}
.heroArt svg{width:74px;height:74px;transform:rotate(14deg);opacity:.5}
.heroArt::before{content:"";position:absolute;width:70px;height:70px;top:-25px;right:-35px;background:#b3aaff20;border:1px solid #ffffff80;border-radius:50%}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.stat{position:relative;margin:0;padding:22px;display:flex;align-items:center;gap:16px;min-height:130px;overflow:hidden}
.stat::after{content:"";position:absolute;right:-26px;bottom:-48px;width:115px;height:115px;border-radius:50%;background:var(--wash,#eef4ff)}
.stat:nth-child(2){--wash:#f1edff;--accent:#7868f5}
.stat:nth-child(3){--wash:#eaf8f3;--accent:#2b9d82}
.stat:nth-child(4){--wash:#fff4e5;--accent:#bd852c}
.stat .statIcon{width:48px;height:48px;display:grid;place-items:center;flex-shrink:0;border-radius:15px;background:var(--wash,#eef4ff);color:var(--accent,#4e7bff)}
.stat .statIcon svg{width:25px;height:25px}
.statContent{position:relative;z-index:1;min-width:0}
.statLabel{font-size:12px;color:#6f80a0}
.stat strong{display:block;font-size:30px;line-height:1.3;margin:4px 0;font-weight:650;color:#233659;font-variant-numeric:tabular-nums}
.stat small{font-size:10px;color:#8c9bb3}
.grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:20px;align-items:start}
.grid>.panel{min-width:0}
.tableWrap{overflow:auto;border:1px solid #e8edf6;border-radius:12px;background:#ffffff70}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{text-align:left;padding:16px 16px;border-bottom:1px solid #edf1f8;vertical-align:middle}
th{font-size:11px;font-weight:550;color:#7e8dab;background:#f6f8fc;white-space:nowrap;padding-top:12px;padding-bottom:12px}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:#f6f9ffb0}
td{line-height:1.65;overflow-wrap:anywhere}
td:first-child{color:#344966;font-weight:500;min-width:160px}
td button{font-size:11px;min-height:30px;padding:5px 10px;margin:3px;white-space:nowrap;border-radius:7px}
td button:not(.secondary){background:#ecf2ff;border-color:#e1e9fc;color:#426bf2;box-shadow:none}
td small{display:block;color:#93a0b5;font-weight:400;font-size:11px;margin-top:4px}
.courseCell{display:flex;align-items:center;gap:12px}
.courseTile{width:42px;height:46px;flex-shrink:0;display:grid;place-items:center;border-radius:9px;color:#6682cc;background:linear-gradient(140deg,#e3eeff,#e9e6fc);border:1px solid #dae4fa}
.courseTile svg{width:20px;height:20px}
.courseCell>div{min-width:0}
.tag{display:inline-flex;align-items:center;gap:5px;border-radius:6px;padding:3px 8px;font-size:10px;background:#e9f8f1;color:#238263;white-space:nowrap;font-weight:500}
.tag::before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}
.tag.draft{background:#fff4e4;color:#ad771e}
.distribution{display:flex;align-items:center;justify-content:center;gap:22px;padding:26px 0 12px;flex-wrap:wrap}
.donut{width:155px;height:155px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;box-shadow:inset 0 0 0 1px #ffffff70}
.donut span{background:#fff;border:6px solid #f8faff;border-radius:50%;width:112px;height:112px;display:grid;place-content:center;text-align:center;font-size:28px;font-weight:650;line-height:1.5;color:#2b3d60}
.donut small{font-size:10px!important;font-weight:400;color:#8c9bb3}
.legend{min-width:120px;flex:1;font-size:12px}
.legend div{display:flex;align-items:center;gap:8px;margin:10px 0;color:#647899}
.legend b{margin-left:auto;font-size:12px;font-weight:550;color:#3e5375}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}
.quickLinks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.quickLink{display:flex;justify-content:flex-start;gap:14px;padding:18px;text-align:left;background:#f5f8ff;border:1px solid #e6edf9;color:#5275bd;box-shadow:none}
.quickLink strong{display:block;color:#3e557c;font-size:13px;font-weight:550}
.quickLink small{display:block;font-size:11px;color:#8899b6;font-weight:400;margin-top:3px}
.quickLink>span:last-child{margin-left:auto;color:#90a4ca}
.empty{font-size:13px;text-align:center;padding:44px!important;color:#8493ac;font-weight:400!important}
.empty::before{content:"◇";display:block;color:#aebfe0;font-size:30px;line-height:1;margin-bottom:16px}
.loading{display:flex;align-items:center;gap:10px;color:#7c8fad;justify-content:center;min-height:220px}
.loading::before{content:"";width:17px;height:17px;border:2px solid #d8e4ff;border-top-color:#4e7bff;border-radius:50%;animation:spin .8s linear infinite}
.pageLoading{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:430px;padding:48px 32px 36px;margin:12px 0 24px;border:1px solid rgba(255,255,255,.95);border-radius:24px;background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(245,247,255,.64));box-shadow:0 14px 40px rgba(88,110,170,.05);overflow:hidden}
.loadingIllustration{position:relative;width:108px;height:108px;display:grid;place-items:center;margin-bottom:24px}
.loadingBook{display:grid;place-items:center;width:68px;height:68px;border-radius:22px;color:#6074ef;background:linear-gradient(135deg,#e4efff,#eae3ff);box-shadow:0 10px 24px rgba(104,119,222,.14);animation:loadingFloat 2.8s ease-in-out infinite}
.loadingBook svg{width:32px;height:32px}
.loadingOrbit{position:absolute;inset:0;border:1px solid #dce5fb;border-radius:50%;animation:spin 3s linear infinite}
.loadingOrbit::after{content:"";position:absolute;top:6px;left:20px;width:9px;height:9px;border-radius:50%;background:#7d8af7;box-shadow:0 0 0 5px rgba(125,138,247,.09)}
.loadingSpark{position:absolute;width:5px;height:5px;border-radius:50%;background:#af9cef;animation:loadingFloat 2.8s ease-in-out infinite}.sparkOne{right:7px;top:17px}.sparkTwo{left:7px;bottom:17px;background:#91bee9;animation-delay:-1.4s}
.pageLoading h2{margin:0;color:#455a7c;font-size:18px;font-weight:600;letter-spacing:.5px}.pageLoading>p{margin:10px 0 22px;color:#8a99b5;font-size:13px}
.loadingTrack{width:124px;height:3px;border-radius:8px;overflow:hidden;background:#e3e9fa}.loadingTrack span{display:block;width:45%;height:100%;border-radius:8px;background:linear-gradient(90deg,#84a6fa,#a293ed);animation:loadingTravel 1.6s ease-in-out infinite}
.loadingSkeleton{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:min(100%,620px);margin-top:38px}
.loadingSkeletonCard{padding:19px 20px;border:1px solid #e9edf8;border-radius:16px;background:rgba(255,255,255,.65)}.loadingSkeletonCard span,.loadingSkeletonCard b,.loadingSkeletonCard i{display:block;height:7px;width:58%;margin-bottom:12px;border-radius:5px;background:linear-gradient(100deg,#edf1fb 20%,#f9faff 45%,#edf1fb 70%);background-size:220% 100%;animation:loadingShimmer 2s ease-in-out infinite}.loadingSkeletonCard b{height:16px;width:38%}.loadingSkeletonCard i{width:84%;margin:0}
@keyframes loadingFloat{50%{transform:translateY(-5px)}}@keyframes loadingTravel{0%{transform:translateX(-120%)}100%{transform:translateX(330%)}}@keyframes loadingShimmer{to{background-position:-220% 0}}
@media(max-width:700px){.pageLoading{min-height:350px;padding:32px 20px}.loadingSkeleton{gap:10px}.loadingSkeletonCard{padding:14px 12px}}
@keyframes spin{to{transform:rotate(360deg)}}
#notice:empty,#formError:empty,#loginError:empty{display:none}
#notice,#formError,#loginError{color:#a6602e;font-size:13px;background:#fff4e8;border:1px solid #f4dfc8;border-radius:10px;padding:12px 16px;margin:12px 0}
#avatarMessage,#passwordMessage{color:#a6602e;font-size:12px}
.toolbar{display:flex;gap:12px;margin-top:20px;align-items:center;flex-wrap:wrap}
.toolbar select{width:180px}
#practiceSubject{max-width:220px}
.profileGrid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(280px,1.4fr);gap:22px;max-width:1120px}
.profileGrid .panel{margin-top:8px}
.avatarWrap{margin:26px 0;display:flex;align-items:center}
.profileAvatar{width:88px;height:88px;border-radius:24px;object-fit:cover;box-shadow:0 4px 20px #4e7bff14;border:4px solid white}
.avatarFallback{display:grid;place-items:center;background:linear-gradient(130deg,#e2edff,#eee7ff);color:#6c80ba;font-size:32px}
.profileGrid form{max-width:500px}
.mainFooter{display:flex;justify-content:space-between;gap:12px;color:#98a5bc;font-size:10px;border-top:1px solid #e3e9f480;padding-top:18px;margin-top:28px;letter-spacing:.5px}
.login{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,470px);gap:8vw;padding:50px 8vw;align-items:center;max-width:1600px;margin:auto}
/* Login scenery stays outside the protected brand, copy and form layout. */
.login{position:relative;isolation:isolate}
.loginBackdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 4% 85%,#dceff6 0,transparent 45%),radial-gradient(ellipse at 75% 8%,#dce2fb 0,transparent 48%),radial-gradient(ellipse at 55% 70%,#e6e6fa 0,transparent 35%),linear-gradient(120deg,#f5f8fd,#edf3fc 52%,#f4f3fb)}
.loginBackdrop::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#8aa3cb55 .8px,transparent .8px);background-size:24px 24px;mask-image:radial-gradient(ellipse at 43% 26%,#000 0,transparent 37%);opacity:.45}
.loginContour{opacity:.48;position:absolute;width:900px;height:900px;left:26%;top:-650px;border:1px solid #ffffffb3;border-radius:50%;box-shadow:0 0 0 48px #ffffff16,0 0 0 49px #ffffff75,0 0 0 98px #ffffff0a,0 0 0 99px #ffffff52;transform:rotate(-25deg) scaleX(1.4)}
.loginHorizon{opacity:.65;position:absolute;width:1100px;height:570px;left:-300px;bottom:-370px;border-radius:50%;border:1px solid #aacad54d;box-shadow:0 0 0 44px #ffffff18,0 0 0 45px #b4cdd938,0 0 0 90px #ffffff12,0 0 0 91px #b4cdd923;transform:rotate(-18deg)}
.loginIntro{align-self:stretch;display:flex;flex-direction:column;padding:12px 0}
.loginIntro .brand{margin-bottom:0}
.loginStory{position:relative;margin:auto 0;padding:50px 0 180px}
.loginStory h1{font-size:clamp(32px,4vw,52px);line-height:1.5;letter-spacing:1px;color:#2a4071}
.loginStory p{font-size:14px;line-height:2;color:#8091ae}
.storyMark{position:absolute;right:10px;bottom:0;transform:rotate(-12deg);pointer-events:none}
.storyMark{isolation:isolate;width:170px;height:170px}
.storyMark::before{content:"";position:absolute;inset:-35px;border-radius:50%;background:radial-gradient(circle,#a7b8f33d,transparent 68%);z-index:-1}
.storyOrbit{position:absolute;width:380px;height:280px;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%) rotate(12deg);z-index:-1;overflow:visible}
.storyIllustration{position:absolute;width:260px;height:223px;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%) rotate(12deg);overflow:visible;filter:drop-shadow(0 14px 16px #6583c21a)}
.loginFoot{color:#97a4bb;font-size:11px;letter-spacing:1px}
.loginCard{padding:40px;margin:0;background:#ffffffbd;border-radius:24px;box-shadow:0 20px 70px #5375b010}
.loginCard h2{font-size:26px;margin-bottom:10px}
.loginCard>p{font-size:12px;margin-bottom:26px}
.loginCard label{margin:22px 0}
.loginCard input{min-height:48px}
.loginCard button{width:100%;margin-top:10px;min-height:48px;justify-content:space-between;padding:12px 18px}
.loginHint{font-size:11px;color:#97a5bc;text-align:center;padding-top:22px;border-top:1px solid #e5ebf6;margin-top:26px}
dialog{border:1px solid #fff;border-radius:22px;width:min(740px,92vw);max-height:88vh;overflow:auto;padding:28px;background:#f7f9fff5;box-shadow:0 30px 100px #273c7430;backdrop-filter:blur(22px)}
dialog::backdrop{background:#263b6150;backdrop-filter:blur(6px)}
.dialogHead{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-bottom:20px;border-bottom:1px solid #e3eaf5;margin-bottom:22px}
.dialogHead h2{font-size:21px}
.dialogHead .eyebrow{margin-bottom:5px}
.dialogActions{display:flex;justify-content:flex-end;border-top:1px solid #e3eaf5;padding-top:18px;margin-top:24px}
.fieldGrid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
@media(min-width:1700px){main{padding-left:44px;padding-right:44px}.hero{padding:34px}.stat{min-height:146px}}
@media(max-width:1200px){:root{--sidebar:224px}main{padding:0 24px 24px}.brand{font-size:21px;gap:7px}.brand img{width:48px;height:48px}.headerTools{gap:10px}.environment{display:none}.stat{padding:18px;gap:10px}.stat .statIcon{width:40px;height:40px}.stat strong{font-size:27px}.grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
@media(max-width:1000px){.breadcrumb>span{display:none}.searchField{width:180px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid{grid-template-columns:minmax(0,1fr)}.grid>.panel{margin-bottom:0}.profileGrid{grid-template-columns:1fr}.quickLinks{grid-template-columns:1fr}.quickLink{padding:14px}.heroArt{right:-20px}.hero p{max-width:85%}}
@media(max-width:700px){aside{position:relative;width:100%;padding:16px 14px}.brand{margin-bottom:16px}.navCaption,.asideFooter{display:none}nav{display:flex;align-items:flex-start;gap:6px;overflow:auto;max-height:290px;flex:none}nav .navGroup{flex:0 0 auto}nav button{white-space:nowrap}nav .navChildren{margin-left:18px}main{margin-left:0;padding:0 16px 20px}.topbar{min-height:74px;margin-bottom:16px;flex-wrap:wrap;padding:16px 0;gap:12px}.breadcrumb{display:none}.headerTools{width:100%;gap:10px}.searchField{flex:1;width:auto;min-width:0}.userChip{max-width:100px}#username{max-width:56px}.hero{padding:22px}.hero h1{font-size:24px}.hero p{font-size:12px;max-width:85%}.heroArt{width:100px;height:100px;right:-30px;top:30px}.heroArt svg{width:55px;height:55px}.panel{padding:18px;border-radius:15px}.stats{gap:12px}.stat{padding:16px;min-height:118px;gap:12px;align-items:flex-start}.stat .statIcon{width:32px;height:32px;border-radius:10px}.stat .statIcon svg{width:19px;height:19px}.stat strong{font-size:26px}.stat small{font-size:9px}.panelHead{gap:12px}h1{font-size:24px}.fieldGrid{grid-template-columns:1fr}.mainFooter span:last-child{display:none}.login{grid-template-columns:1fr;gap:20px;padding:26px 20px;max-width:520px}.loginStory,.loginFoot{display:none}.loginIntro .brand{margin:0}.loginCard{padding:28px}.loginIntro{padding:0}.distribution{gap:18px}.legend{min-width:130px}dialog{padding:22px}.profileGrid{display:block}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@supports not (backdrop-filter:blur(1px)){aside,.panel,.loginCard{background:#fafdff}dialog{background:#f7f9ff}}

.practiceToolbar{display:flex;flex-wrap:wrap;gap:18px;margin:20px 0}.practiceToolbar label{min-width:160px;flex:1;max-width:360px}.practiceViews{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}

/* Course hierarchy mirrors the Android premium directory. */
.premiumFlow{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:18px 0}.premiumFlow span{padding:10px 16px;border-radius:12px;background:#edf4ff;color:#3267b1;font-weight:600}.premiumFlow b{color:#8a9bb5}.premiumUnit h2{color:#3267b1}.premiumChapter{margin:18px 0 0;padding:18px;border-radius:16px;background:#f7f9fd;border:1px solid #e4ebf5}.premiumChapter h3{margin:0;font-size:16px}.premiumChapter td small{max-width:320px;overflow-wrap:anywhere}.premiumUnit .panelHead{flex-wrap:wrap;gap:12px}@media(max-width:700px){.premiumChapter{padding:12px}.premiumFlow{gap:8px}.premiumFlow span{padding:8px 10px}}

/* Task-oriented maintenance workspace */
.pageHeading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:8px 0 24px}.pageHeading h1{margin:6px 0;font-size:26px}.pageHeading p{margin:8px 0;color:var(--muted,#7c8ba7)}.filterBar{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:24px}.filterBar label{min-width:170px}.workspaceTabs{display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid #dfe7f3;margin-bottom:24px;padding-bottom:12px}.workspaceTabs button{background:transparent;color:#7d8da7;box-shadow:none;border:1px solid transparent}.workspaceTabs button.selected{background:#e9f0ff;color:#4065d5;border-color:#d6e3ff}.contentWorkspace{display:grid;grid-template-columns:270px minmax(0,1fr);gap:24px;align-items:start}.directoryPane{background:#f6f9ff;border:1px solid #e0e9f5;border-radius:18px;padding:18px;position:sticky;top:24px;max-height:75vh;overflow:auto}.directoryPane h2{font-size:16px}.directoryPane p{font-size:12px}.treeUnit{margin-bottom:12px}.treeNode{display:flex;width:100%;text-align:left;justify-content:space-between;align-items:center;gap:8px;padding:12px 10px;color:#41506c;background:transparent;box-shadow:none;border:1px solid transparent;border-radius:10px;white-space:normal}.treeNode span{overflow-wrap:anywhere}.treeNode small{flex-shrink:0;color:#8290a8;font-size:11px}.treeNode.selected{background:#e5edff;color:#385ed5;border-color:#d7e3ff}.treeChapter{padding-left:24px;margin-top:3px;font-size:13px}.contentPane{min-width:0;min-height:360px;margin-top:0}.contentPane h2{font-size:22px;margin:6px 0 16px}.contentPane h3{margin-top:24px}.contentPane td{overflow-wrap:anywhere}.actionRow{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.readiness{display:flex;align-items:center;gap:14px;margin:12px 0 24px}.textButton{padding:0;background:none;color:#677fa4;box-shadow:none}.checkIssue{background:#fff5e9;border-radius:10px;padding:14px;color:#a7642b}.previewCourse{max-width:780px;background:#f7faff;padding:24px;border-radius:16px}.previewChapter{padding:18px;background:white;border-radius:12px;margin:16px 0}.previewVideo{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid #ecf0f7;gap:16px}.resourcePreview{width:100%;max-height:60vh;background:#111;border-radius:12px}details{margin:18px 0}summary{cursor:pointer;color:#76869d;margin-bottom:14px}.panel .filterBar{margin-top:12px}@media(max-width:1000px){.contentWorkspace{grid-template-columns:220px minmax(0,1fr);gap:16px}}@media(max-width:700px){.contentWorkspace{grid-template-columns:1fr}.directoryPane{position:static;max-height:260px}.pageHeading{align-items:flex-start;flex-wrap:wrap}.pageHeading h1{font-size:22px}.filterBar label{min-width:0;flex:1}.contentPane{min-height:240px}.workspaceTabs{gap:4px}.workspaceTabs button{padding:10px}.previewCourse{padding:14px}}

/* Shared content workspace: package nodes retain publishing boundaries. */
.archiveFilter{display:flex;align-items:center;gap:8px;align-self:end;min-height:44px}.archiveFilter input{width:16px;height:16px;margin:0}.treePackage{font-weight:650}.treeCourseUnit{padding-left:22px;font-size:13px}.treeCourseChapter{padding-left:34px;margin-top:3px;font-size:12px}.packageHeading{display:flex;align-items:start;justify-content:space-between;gap:18px;margin-bottom:20px}.packageHeading h2{font-size:22px;margin:6px 0 12px}.packageHeading .actionRow{margin:0}.packageHeading+.workspaceTabs{gap:4px}.packageHeading+.workspaceTabs button{padding:10px 12px}@media(max-width:1000px){.packageHeading{flex-wrap:wrap}.packageHeading h2{font-size:20px}}

#paperResolve .paperConfirmation{display:flex;align-items:center;gap:10px;margin:18px 0}
#paperResolve input[type=checkbox]{width:20px;height:20px;min-height:20px;flex:0 0 20px;margin:0}

/* Learner archive keeps read-only fields separate from account maintenance. */
.learnerInfoCards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.learnerInfoCards section{background:#f6f8fc;border:1px solid #e6ecf5;border-radius:14px;padding:20px}.learnerInfoCards h3{margin:0 0 18px}.learnerInfoCards dl{margin:0}.learnerInfoCards dl>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:14px;padding:12px 0;border-bottom:1px solid #e6ecf5}.learnerInfoCards dl>div:last-child{border:0}.learnerInfoCards dt{color:#71809b}.learnerInfoCards dd{margin:0;color:#26334d;overflow-wrap:anywhere}.learnerReadonlyNote{color:#71809b;font-size:13px}.learnerProfile{border-top:1px solid #e6ecf5;padding-top:8px}.learnerProfile form{max-width:520px}.learnerArchive .panelHead{align-items:start}.learnerArchive .panelHead h2{margin:6px 0}.learnerArchive .panelHead p{color:#71809b}@media(max-width:950px){.learnerInfoCards{grid-template-columns:1fr}}
.learnerIdentity{display:flex;gap:20px;align-items:center}.learnerAvatarWrap{flex-shrink:0}.learnerAvatarWrap .profileAvatar{width:88px;height:88px;object-fit:contain;margin:0;background:#eaf7fc}@media(max-width:700px){.learnerArchive .panelHead{flex-wrap:wrap}.learnerIdentity{gap:12px}}
.learnerHeaderActions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.learnerIdentity{min-width:0}.learnerIdentity h2,.learnerIdentity p{overflow-wrap:anywhere}@media(max-width:700px){.learnerHeaderActions{justify-content:flex-start}}

.learnerUserPicker{display:flex;align-items:end;gap:24px;flex-wrap:wrap;margin:0 0 24px}.learnerUserPicker label{flex:1;min-width:200px;margin:0}.learnerUserPicker p{color:#71809b;margin:0 0 12px;font-size:13px}.archiveWorkspace .contentPane{min-height:360px}

@media(min-width:701px) and (max-width:1200px){.storyOrbit{width:290px;height:230px}}
@media(max-width:700px){.loginBackdrop::before{opacity:.2}.loginContour{left:-170px;top:-750px}.loginHorizon{opacity:.55}}