:root{color-scheme:dark;--bg:#09090b;--panel:#18181bc9;--line:#ffffff20;--muted:#aaa8b8;--purple:#aa8cf1;--green:#9ee8be}
body[data-theme=mint]{--purple:#75d9b2;--green:#b9f3d8}body[data-theme=blue]{--purple:#78a8ff;--green:#9ed8ff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f4f1f9;font:14px system-ui,-apple-system,sans-serif}button,input,select{font:inherit}button,a,input,select{outline-offset:3px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #d0b7ff}
button{cursor:pointer}button:disabled{opacity:.5;cursor:default}a{color:#cab5ff}header{height:76px;border-bottom:1px solid var(--line);background:#0f0e12;display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:20px}.brand{text-decoration:none;display:flex;align-items:center;gap:10px;color:#fff;font-size:21px;font-weight:800}.brand>span:last-child>span{color:var(--purple)}.brand-mark{background:#9b74ed;color:#fff;font-size:27px;display:grid;place-items:center;width:35px;height:38px;border-radius:10px}.header-side{display:flex;align-items:center;gap:14px}.pill{border:1px solid #a787f136;color:#ccb7fd;border-radius:8px;padding:7px 10px;font-weight:700}.quiet{border:0;background:none;color:#b6a2e7;padding:8px}.layout{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:calc(100vh - 76px)}aside{border-right:1px solid var(--line);padding:26px 15px;display:flex;flex-direction:column}.eyebrow{font-size:10px;letter-spacing:1.6px;color:#9c91b4;font-weight:800}nav{display:grid;gap:5px;margin-top:18px}nav button{text-align:left;background:none;color:#a9a3b8;border:1px solid transparent;border-radius:10px;padding:12px;font-weight:600}nav button[aria-current]{background:#a78bfa20;border-color:#a78bfa40;color:#e0d1ff}.aside-note{margin-top:auto;color:#8d8999;font-size:11px;line-height:1.6;padding:16px 8px}main{padding:32px clamp(18px,4vw,55px);max-width:1400px;width:100%;margin:auto}h1{font-size:31px;letter-spacing:-1px;margin:4px 0 8px}h2{font-size:18px;margin:0 0 12px}h3{font-size:14px;margin:0 0 6px}p{line-height:1.55}small,.muted{color:var(--muted)}#message{min-height:22px;color:#b9eecb;margin:0 0 12px}.lead{font-size:13px;color:#aaa4b7;margin-bottom:24px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:21px;backdrop-filter:blur(14px)}.hero{background:radial-gradient(circle at 90% 40%,#7550b947,transparent 48%),linear-gradient(115deg,#1b1724,#15141a);border-color:#ae8ef83b;padding:28px}.hero h2{font-size:25px}.metric{font-size:28px;font-weight:800;margin:5px 0}.btn{background:#ac90f2;color:#1b1127;border:0;border-radius:9px;padding:11px 15px;font-weight:800}.btn.secondary{background:#ffffff10;color:#eee;border:1px solid #ffffff20}.btn.small{padding:8px 10px;font-size:11px}.btn:hover{filter:brightness(1.12)}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.topic{min-height:170px}.topic .num{font-size:24px;font-weight:800;color:#bca5f8}.topic p{font-size:11px;color:#aaa}.progress{height:6px;background:#ffffff15;border-radius:10px;overflow:hidden;margin:14px 0}.progress i{display:block;height:100%;background:#b28efa;border-radius:10px}.section{margin-top:26px}.list{display:grid;gap:12px}.list .card{padding:17px}.tag{display:inline-block;color:#b4ecce;background:#7ce0a01b;border:1px solid #7ce0a030;border-radius:6px;padding:4px 7px;font-size:10px;font-weight:700}.tag.orange{color:#ffc99e;background:#ff9d5618}.tag.purple{color:#d0b8ff;background:#ac8bf31d}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:13px;border-bottom:1px solid var(--line);font-size:12px}th{color:#a198ae;font-weight:600}label{display:block;margin:14px 0;color:#c4bbcf;font-size:12px}input,select{display:block;width:100%;padding:11px;margin-top:7px;background:#101014;color:#fff;border:1px solid #ffffff30;border-radius:8px}input[type=checkbox]{width:auto;display:inline-block;margin:0 8px 0 0}.checkgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;max-height:230px;overflow:auto}.checkgrid label{margin:0}.toolbar{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}dialog{width:min(680px,calc(100% - 24px));max-height:90vh;overflow:auto;padding:25px;border:1px solid #7e5fb2;border-radius:18px;background:#17131f;color:#fff;box-shadow:0 30px 100px #000a}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}#task-title{font-size:21px;line-height:1.5;white-space:pre-wrap}.task-table{overflow:auto;max-height:250px;margin:15px 0}.task-table td{border:1px solid #ffffff25;padding:6px 9px}.task-art{max-width:340px;display:block;margin:10px auto}.feedback{border:1px solid #9d7ad045;background:#ac8bf21a;border-radius:12px;padding:18px;margin:15px 0}.feedback ol{line-height:1.8;padding-left:20px}.danger{color:#ffb2b2}.file{display:inline-block;margin:6px;padding:8px 10px;border:1px solid var(--line);border-radius:8px}button:active{transform:translateY(1px)}
.profile-avatar{width:32px;height:32px;border-radius:10px;background:#2b2731;display:grid;place-items:center;font-weight:900;color:#c9c2d2}.profile-avatar.violet{background:linear-gradient(135deg,#a78bfa,#6d49cf);color:white;box-shadow:0 0 18px #9d78ed55}.profile-frame{border:1px solid #b796ff;border-radius:8px;padding:6px 9px;box-shadow:0 0 16px #a77cff44}.reward-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.reward{opacity:.72}.reward.unlocked{opacity:1;border-color:#9c7ce344}.inventory{display:grid;gap:10px}.inventory>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(90px,.4fr) auto;align-items:center;gap:12px;padding:12px;border-bottom:1px solid var(--line)}.inventory small{display:block}.boss-card{background:radial-gradient(circle at 90% 20%,#ff74352a,transparent 44%),linear-gradient(140deg,#21161a,#17151c);border-color:#ff9b5e42}.boss-stages{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.stage{display:grid;gap:4px;border:1px solid var(--line);border-radius:12px;padding:14px}.stage strong{font-size:22px;color:#b9a0f5}.stage.complete{border-color:#73d99b66}.stage.failed{border-color:#ff7b7b66}.stage.ready,.stage.correct{border-color:#e7a46766}
@media(max-width:850px){.layout{grid-template-columns:1fr}aside{padding:10px 18px;border-right:0;border-bottom:1px solid var(--line)}.aside-note,.eyebrow{display:none}nav{display:flex;overflow:auto;margin:0}nav button{white-space:nowrap}.cards{grid-template-columns:1fr 1fr}.grid,.reward-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){header{padding:0 16px}.header-side{gap:6px}#header-person{display:none}main{padding:22px 15px}.cards,.grid,.reward-grid,.boss-stages{grid-template-columns:1fr}.checkgrid{grid-template-columns:repeat(2,1fr)}.inventory>div{grid-template-columns:1fr auto}.inventory small{display:none}}
progress.progress{display:block;width:100%;height:6px;border:0;border-radius:10px;appearance:none;background:#ffffff15;margin:14px 0}
progress.progress::-webkit-progress-bar{background:#ffffff15;border-radius:10px}
progress.progress::-webkit-progress-value{background:#b28efa;border-radius:10px}
progress.progress::-moz-progress-bar{background:#b28efa;border-radius:10px}
.task-art{width:100%;height:auto}#task-message{color:#ffd3a3;overflow-wrap:anywhere}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e4d4ff;outline-offset:3px}
.task-table th{border:1px solid #ffffff25;padding:6px 9px;color:#e3d5ff;background:#aa8cf115}.task-table caption{text-align:left;padding:0 0 8px;color:#c6bed3}.task-table:focus-visible,#task-feedback-title:focus{outline:2px solid #d0b7ff;outline-offset:2px}
.task-code{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0;padding:12px 14px;border:1px solid #65d9ff42;border-radius:11px;background:linear-gradient(120deg,#7651c82b,#42cbed16);color:#e7dcff}.task-code strong{letter-spacing:.05em}
@media(max-width:520px){input,select{font-size:16px}dialog{padding:16px}#task-title{font-size:18px}.brand{font-size:18px}.header-side{flex-wrap:wrap}}
main,aside,.card,.row>*,.header-side{min-width:0}h1,h2,h3,p,td,.tag,.file{overflow-wrap:anywhere}.row{flex-wrap:wrap}.row>.quiet{flex-shrink:0}.avatar-link{text-decoration:none;display:grid;place-items:center;min-width:44px;min-height:44px}.quiet{min-width:44px;min-height:44px}.skip-link{position:fixed;top:8px;left:8px;z-index:20;padding:12px;background:#241b38;transform:translateY(-180%)}.skip-link:focus{transform:none}#nav{scroll-padding:4px}#main-content:focus{outline:none}
@media(max-width:520px){header{height:auto;min-height:76px;flex-wrap:wrap;gap:8px;padding:12px 16px}.header-side{margin-left:auto}.pill{white-space:nowrap}nav button{min-height:44px}.checkgrid{grid-template-columns:minmax(0,1fr)}}

/* Bright beta theme: colour carries meaning while the dark study surface stays calm. */
:root{--cyan:#62d9ff;--pink:#ff74b8;--orange:#ffad66;--yellow:#f6df72;--purple-glow:#9e73ff55}
html{background:#09090b}body{min-height:100vh;background:
 radial-gradient(circle at 8% 4%,#6f46d52b 0,transparent 30rem),
 radial-gradient(circle at 92% 14%,#087da425 0,transparent 28rem),
 radial-gradient(circle at 72% 92%,#c33c7c17 0,transparent 34rem),var(--bg);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.22;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,#000,transparent 75%)}
header{position:sticky;top:0;z-index:10;background:#0d0c11d9;backdrop-filter:blur(22px) saturate(145%);box-shadow:0 10px 45px #0005}
.brand-mark{position:relative;overflow:hidden;background:linear-gradient(145deg,#c39cff,#8b5cf6 52%,#4ecdf0);box-shadow:0 0 0 1px #e2d4ff2e,0 8px 25px #8b5cf650;animation:brand-float 4s ease-in-out infinite}
.brand-mark:after{content:"";position:absolute;inset:-60% auto -60% -70%;width:45%;transform:rotate(18deg);background:#fff8;filter:blur(3px);animation:brand-shine 5s ease-in-out infinite}
.pill{background:linear-gradient(135deg,#a787f122,#4bc9ed12);box-shadow:inset 0 1px #ffffff18,0 0 24px #8d65e920}
.avatar-link{border-radius:12px;transition:transform .2s ease,background .2s ease}.avatar-link:hover{background:#ffffff0b;transform:translateY(-2px)}
aside{background:linear-gradient(180deg,#15111eb5,#0c1019a8);backdrop-filter:blur(16px)}
nav button{position:relative;overflow:hidden;transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease}
nav button:hover{color:#fff;background:#ffffff0a;border-color:#ffffff12;transform:translateX(3px)}
nav button[aria-current]{background:linear-gradient(100deg,#a78bfa2d,#42c5ed16);border-color:#b394fb55;box-shadow:0 8px 26px #7046c31c,inset 0 1px #ffffff16}
nav button[aria-current]:before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:3px;border-radius:5px;background:linear-gradient(#d9c4ff,#68dfff);box-shadow:0 0 14px #a78bfa}
.eyebrow{color:#c5b3ef}.lead{color:#bbb4c8}
#content>*{animation:content-in .38s cubic-bezier(.2,.75,.25,1) both}
.card{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(145deg,#211d29d9,#15161ccf);border-color:#ffffff24;box-shadow:inset 0 1px #ffffff0b,0 14px 42px #00000020;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.card:before{content:"";position:absolute;z-index:-1;left:8%;right:8%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#d9c7ff8c,transparent)}
.card:hover{border-color:#bda3ff4a;box-shadow:inset 0 1px #ffffff12,0 18px 52px #0004;transform:translateY(-2px)}
.cards>.card:nth-child(3n+1){background:radial-gradient(circle at 100% 0,#8b5cf62c,transparent 48%),linear-gradient(145deg,#211d29e8,#15161cda)}
.cards>.card:nth-child(3n+2){background:radial-gradient(circle at 100% 0,#18bce82a,transparent 48%),linear-gradient(145deg,#19232ae8,#15161cda)}
.cards>.card:nth-child(3n){background:radial-gradient(circle at 100% 0,#ff8b4625,transparent 48%),linear-gradient(145deg,#261e1be8,#15161cda)}
.hero{min-height:210px;background:
 radial-gradient(circle at 88% 36%,#57ddff4a 0,transparent 18%),
 radial-gradient(circle at 75% 80%,#ff64b335 0,transparent 24%),
 linear-gradient(125deg,#2a1748,#1b1940 50%,#102b3b);border-color:#c3a5ff70;box-shadow:inset 0 1px #fff2,0 22px 70px #7443c12b}
.hero:after{content:"✦";position:absolute;right:8%;top:18%;font-size:90px;color:#b8f2ff;text-shadow:0 0 28px #4bd8ff,28px 34px 0 #c68cff22;transform:rotate(10deg);animation:hero-star 4.5s ease-in-out infinite;z-index:-1}
.hero h2{max-width:72%;font-size:clamp(24px,3vw,34px);line-height:1.2;text-shadow:0 4px 18px #0005}.hero p{max-width:65%}
.metric{background:linear-gradient(110deg,#fff 15%,#d4beff 50%,#82e7ff);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:0 8px 35px #a684fa33}
.btn{position:relative;overflow:hidden;background:linear-gradient(120deg,#c0a2ff,#9c7af4 48%,#68d5f4);box-shadow:0 8px 25px #8d66e63d,inset 0 1px #fff7;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.btn:before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,#fff6 48%,transparent 72%);transform:translateX(-120%);transition:transform .48s ease}.btn:hover{filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 12px 32px #8d66e65e,inset 0 1px #fff8}.btn:hover:before{transform:translateX(120%)}
.btn.secondary{background:linear-gradient(135deg,#ffffff12,#a78bfa18);box-shadow:inset 0 1px #ffffff15,0 8px 22px #0002}.btn.secondary:hover{border-color:#b99cff66;background:linear-gradient(135deg,#ffffff1c,#a78bfa28)}
.tag{box-shadow:inset 0 1px #ffffff12}.tag.purple{color:#e1d2ff;background:linear-gradient(120deg,#a66dff27,#55d1f51a);border:1px solid #b691ff43}.tag.orange{background:linear-gradient(120deg,#ff97422a,#ff5c9a17);border:1px solid #ffac6a45}
.progress{height:8px}.progress i,progress.progress::-webkit-progress-value{background:linear-gradient(90deg,#9f77f6,#cf78dc,#53d8f6);background-size:180% 100%;animation:progress-glow 3.2s linear infinite;box-shadow:0 0 14px #9e73ff70}progress.progress::-moz-progress-bar{background:linear-gradient(90deg,#9f77f6,#cf78dc,#53d8f6);box-shadow:0 0 14px #9e73ff70}
.grid .topic{min-height:184px}.grid .topic:nth-child(4n+1){--topic:#a985ff}.grid .topic:nth-child(4n+2){--topic:#5ed8f5}.grid .topic:nth-child(4n+3){--topic:#ff8bc4}.grid .topic:nth-child(4n){--topic:#ffbb71}.topic{background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--topic) 20%,transparent),transparent 44%),linear-gradient(145deg,#211d29e8,#15161cda)}.topic .num{color:var(--topic);text-shadow:0 0 25px color-mix(in srgb,var(--topic) 46%,transparent)}.topic:hover{border-color:color-mix(in srgb,var(--topic) 55%,transparent);transform:translateY(-5px)}
.boss-card{background:radial-gradient(circle at 88% 16%,#ffbe683d,transparent 30%),radial-gradient(circle at 8% 100%,#e94a9329,transparent 38%),linear-gradient(140deg,#32172b,#201926 58%,#141922);border-color:#ff9b5e66}.boss-card:after{content:"♛";position:absolute;right:7%;bottom:-22px;font-size:112px;color:#ffb06a14;transform:rotate(-9deg);z-index:-1}.boss-card:hover{border-color:#ffad7585;box-shadow:0 18px 60px #d8527b20}
.stage{background:#0e10165c;transition:transform .2s ease,border-color .2s ease}.stage:hover{transform:translateY(-3px)}.stage.complete{background:#53d89414}.stage.failed{background:#ff6c8414}.stage.ready,.stage.correct{background:#f3ac5d13}
.reward.unlocked{background:radial-gradient(circle at top right,#9e72f536,transparent 52%),linear-gradient(145deg,#241d31,#17171d);box-shadow:0 12px 42px #8f64e620}.reward.unlocked:after{content:"✦";position:absolute;right:16px;bottom:10px;color:#d2baff44;font-size:32px}
.profile-avatar.violet{animation:avatar-pulse 3.4s ease-in-out infinite}.inventory>div{transition:background .2s ease,border-color .2s ease}.inventory>div:hover{background:#ffffff08;border-color:#b796ff55}tbody tr{transition:background .18s ease}tbody tr:hover{background:#a78bfa12}
dialog{background:radial-gradient(circle at 90% 0,#6f46b72b,transparent 40%),linear-gradient(145deg,#201829,#13151d);border-color:#a985e180;box-shadow:0 35px 130px #000c,0 0 65px #7248b72b}dialog[open]{animation:modal-in .24s cubic-bezier(.2,.8,.2,1)}dialog::backdrop{animation:backdrop-in .24s ease both}.feedback{background:linear-gradient(135deg,#ac8bf225,#49c8e50d);border-color:#ad88e763;animation:feedback-in .32s ease both}.feedback:has(.danger){background:linear-gradient(135deg,#d84c681d,#ff9f620d);border-color:#ff7a8a55}
input,select{transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}input:hover,select:hover{border-color:#a98de566}input:focus,select:focus{border-color:#b99bf2;box-shadow:0 0 0 4px #a481e51f;background:#13121a}
#class-data,#league-data{background:radial-gradient(circle at 100% 0,#4bcdec22,transparent 38%),radial-gradient(circle at 0 100%,#9d67f21b,transparent 42%),linear-gradient(145deg,#1d1b27e8,#14171dda);min-height:60px}
@keyframes content-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes modal-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes feedback-in{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}@keyframes brand-float{50%{transform:translateY(-2px);box-shadow:0 0 0 1px #e2d4ff40,0 12px 32px #8b5cf675}}@keyframes brand-shine{0%,70%{transform:translateX(-130%) rotate(18deg)}90%,100%{transform:translateX(430%) rotate(18deg)}}@keyframes hero-star{50%{transform:translateY(-8px) rotate(18deg);filter:brightness(1.2)}}@keyframes progress-glow{to{background-position:-180% 0}}@keyframes avatar-pulse{50%{box-shadow:0 0 26px #9d78ed88}}@media(max-width:850px){aside{background:#100d16ed}.hero:after{right:2%;opacity:.72}.card:hover,.topic:hover{transform:none}}@media(max-width:520px){.hero{min-height:190px}.hero h2,.hero p{max-width:78%}.hero:after{font-size:68px;right:-2%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}