:root{--violet:#b69aff;--panel:#14111d}button,a,input,summary{transition:background .18s,border-color .18s,transform .18s,box-shadow .18s}button:active,.primary:active{transform:translateY(1px)}.page-enter{animation:page-in .23s ease-out}@keyframes page-in{from{opacity:.5;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes dropdown-in{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}dialog[open]{animation:dropdown-in .2s ease-out}dialog{max-width:580px;max-height:88vh;overflow-y:auto}dialog h2{font-size:21px}.modal-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.icon-button{border:1px solid #43334f;background:#21172d;color:#ddd0f0;border-radius:6px;width:32px;height:32px;cursor:pointer}.icon-button:hover{background:#39294a}.field{display:flex;flex-direction:column;gap:8px;font-size:12px;color:#c9b9da;margin:16px 0}.field>label{margin:0}.field input,.field textarea{margin:0;width:100%;min-height:42px;padding:11px 13px;border:1px solid #443451;border-radius:6px;background:#0d0914;color:#f2eaff;font-size:13px}.field textarea{min-height:94px;resize:vertical;font:13px/1.6 Arial,sans-serif}#form-error{color:#ffc0c8;font-size:12px}.custom-select{position:relative;min-width:150px}.custom-select summary{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #443451;background:#17101f;padding:12px 14px;border-radius:6px;list-style:none;color:#ded1ef;font-size:12px;cursor:pointer}.custom-select summary::-webkit-details-marker{display:none}.custom-select[open] summary{border-color:#9672bf}.select-options{position:absolute;top:calc(100% + 5px);left:0;right:0;max-height:230px;overflow:auto;background:#1b1424;border:1px solid #5c4670;border-radius:7px;box-shadow:0 16px 38px #0008;padding:5px;z-index:40;animation:dropdown-in .16s ease-out}.select-options button{display:block;text-align:left;width:100%;border:0;border-radius:4px;background:none;color:#dfd1ef;font-size:12px;padding:11px}.select-options button:hover,.select-options button:focus-visible{background:#39284e}.custom-select[open] summary span{transform:rotate(180deg)}.nav-note{display:none}#language-switch{margin-left:auto;position:relative;z-index:15}#language-switch .field{margin:0}#language-switch label{position:absolute;clip-path:inset(50%);height:1px;width:1px;overflow:hidden}#language-switch .custom-select summary{padding:9px 13px;background:#14101c}.header-right{position:relative}.account-menu{position:absolute;right:max(24px,calc((100vw - 1192px)/2));top:76px;width:290px;border:1px solid #493655;border-radius:10px;padding:8px;background:#18111f;box-shadow:0 20px 60px #000a;z-index:60;animation:dropdown-in .18s ease-out}.account-menu[hidden]{display:none}.menu-profile{display:flex;align-items:center;gap:12px;padding:14px 10px 18px;margin-bottom:7px;border-bottom:1px solid #36263f}.menu-profile strong{font-size:13px}.menu-profile p{font-size:11px}.account-menu a{display:block;padding:12px 13px;border-radius:6px;color:#d8c9e6;font-size:12px}.account-menu a:hover{background:#31213f}.account-grid,.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}.account-grid{grid-template-columns:1fr 1fr}.panel{padding:25px;border:1px solid #3b2c48;border-radius:10px;background:radial-gradient(at 100% 0,#50325d22,transparent 65%),#131019}.panel h2{font-size:21px;margin:17px 0 9px;font-weight:500}.panel p{font-size:13px}.panel>.primary,.panel>.secondary{margin-top:22px}.panel>.subtle-link{display:block;margin-top:18px}.avatar.large{width:58px;height:58px;font-size:23px}.privacy-note{margin-top:22px}.privacy-note h3{margin-bottom:8px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:27px 0 20px}.toolbar h2{font-size:20px}.toolbar h1{margin:0}.row-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center}.panel .row-actions{margin-top:22px}.tabs{display:flex;background:#130e1b;padding:4px;border:1px solid #3e2e4b;border-radius:7px;gap:4px}.tabs button{border:0;border-radius:4px;color:#cbb9df;background:transparent;cursor:pointer;padding:10px 18px;font-size:12px}.tabs button.active,.tabs button:hover{background:#352343;color:#f1e6ff}.empty-state{grid-column:1/-1;text-align:center;padding:50px 25px;background:#100d16;border:1px dashed #493352;border-radius:10px}.empty-state h2,.empty-state h3{margin:15px 0 10px;font-weight:500}.empty-state .mode-icon{margin:auto}.empty-state .primary{margin-top:23px}.empty-state p{max-width:520px;margin:0 auto;font-size:13px}.count{color:#b59bcf;font:12px Consolas,monospace;border:1px solid #4c385b;border-radius:5px;padding:3px 7px;margin-left:7px}.compare p{display:flex;align-items:center;margin-top:19px;font-size:12px}.compare strong{margin-left:auto;color:#e5d7f4}.compare span{font-size:10px;margin-left:13px;color:#aa96ba}.class-card{border:1px solid #3e2d49;border-radius:10px;overflow:hidden;background:#131019;transition:transform .2s,border-color .2s}.class-card:hover{transform:translateY(-3px);border-color:#876798}.class-banner{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;background:linear-gradient(125deg,var(--class-tint,#352045),#16101f)}.class-banner>span:first-child{font-size:25px;color:var(--class-accent,#c7a0ef)}.class-body{padding:24px}.class-body h2{font-weight:500;font-size:21px}.class-body>p{margin-top:10px;font-size:12px}.class-body>a{margin-top:20px}.accent-violet{--class-tint:#3e2453;--class-accent:#c6a3ff}.accent-blue{--class-tint:#183b62;--class-accent:#91c8ff}.accent-mint{--class-tint:#164839;--class-accent:#a0e4c6}.accent-rose{--class-tint:#502037;--class-accent:#ffadc9}.class-hero{position:relative;overflow:hidden;border:1px solid #50365b;border-radius:12px;padding:34px;background:linear-gradient(120deg,var(--class-tint,#352045),#110d19 85%)}.class-hero:after{content:'{ }';position:absolute;right:35px;top:12px;color:var(--class-accent,#b99ade);opacity:.09;font:150px Consolas,monospace;pointer-events:none}.class-hero h1{margin:12px 0 10px;font-size:36px;max-width:80%}.class-hero p{max-width:650px}.join-code{display:flex;align-items:center;gap:13px;margin-top:26px;flex-wrap:wrap}.join-code>span{font:9px Consolas,monospace;letter-spacing:1px;color:#c0a4d5}.join-code strong{font:18px Consolas,monospace;letter-spacing:3px;color:#ead8ff}.join-code button{min-height:32px;font-size:11px;padding:0 12px}.assignment-list{border:1px solid #3b2b48;border-radius:9px;overflow:hidden}.assignment-row{display:flex;gap:17px;align-items:center;padding:22px;background:#121018;border-bottom:1px solid #302437}.assignment-row:last-child{border:0}.assignment-row:hover{background:#1c1424}.assignment-row h3{font-weight:500;font-size:14px}.assignment-row p{font-size:11px;margin-top:6px}.assignment-row .status{margin-left:auto;white-space:nowrap}.table-scroll{overflow:auto;border:1px solid #3c2c48;border-radius:9px}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}th,td{padding:17px 20px;min-width:160px;border-bottom:1px solid #302437;vertical-align:top}th{background:#21162b;font-weight:500;color:#cdb5e2}td{background:#120e18}td>span{color:#b8a1c8;font-size:11px}td strong{font-weight:500}td small{display:block;color:#9585a2;font-size:10px;margin-top:9px;line-height:1.5}.status.passed{color:#b0ebce;border-color:#3b7761;background:#152c22}.assignment-context{border:1px solid #5e416d;background:#25182f;padding:17px 22px;border-radius:7px;margin-bottom:24px}.assignment-context p{margin-top:8px;font-size:12px}.pre-wrap{white-space:pre-wrap}.project-top{display:flex;align-items:center;justify-content:space-between}.project-menu{position:relative}.project-menu summary{list-style:none;color:#c4aad9;cursor:pointer;padding:8px;font-size:16px}.project-menu div{position:absolute;right:0;top:32px;z-index:30;width:190px;background:#201529;padding:5px;border:1px solid #5a3d6c;border-radius:6px;animation:dropdown-in .15s}.project-menu button{padding:12px;text-align:left;width:100%;background:transparent;border:0;color:#ddcbe9;cursor:pointer;font-size:12px;border-radius:4px}.project-menu button:hover{background:#3c2750}.save-state{font-size:11px;color:#afd8be;margin-bottom:13px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#2b1d39;color:#eee0ff;border:1px solid #79548f;padding:15px 23px;border-radius:8px;z-index:100;box-shadow:0 10px 35px #0008;font-size:13px;max-width:90vw}#app-dialog [hidden]{display:none}.lesson-copy .tip pre{overflow:auto}#code{font-size:14px}details[open]>div,details[open]>p,details[open]>pre{animation:dropdown-in .18s ease-out}
@media(max-width:900px){.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}nav{gap:14px}.toolbar{align-items:flex-start;flex-wrap:wrap}.row-actions{gap:7px}nav a{font-size:12px}}
@media(max-width:600px){nav{flex-wrap:wrap;gap:10px;justify-content:flex-start}nav a{font-size:11px;padding:15px 2px 12px}#language-switch{width:100%;margin:0 0 12px}#language-switch summary{padding:9px 12px}.card-grid,.account-grid{grid-template-columns:1fr}.panel{padding:22px}.class-hero{padding:25px}.class-hero h1{max-width:100%;font-size:30px}.class-hero:after{right:5px;top:15px;font-size:110px}.assignment-row{padding:17px 14px;gap:10px;flex-wrap:wrap}.assignment-row>div{flex:1;min-width:170px}.assignment-row>.status{margin-left:45px}.class-body{padding:21px}.toolbar .row-actions{width:100%}.toolbar .row-actions button{flex:1}.account-menu{right:18px;top:67px;max-width:calc(100vw - 36px)}dialog{padding:22px}.join-code{gap:10px}.join-code strong{font-size:16px}.select-options{max-height:200px}.panel>.primary{width:100%}.class-banner{padding:20px}th,td{padding:13px;min-width:140px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.account-menu button{display:block;width:100%;text-align:left;padding:12px 13px;border:0;border-radius:6px;background:transparent;color:#d8c9e6;font-size:12px}.account-menu button:hover{background:#31213f}
.auth-options{display:flex;flex-direction:column;align-items:stretch;gap:12px}.auth-options .primary,.auth-options .secondary{text-align:center;justify-content:center}
button.subtle-link{background:transparent;border:0;padding:10px 0;color:#c4afff;text-align:left;line-height:1.5}button.subtle-link:hover{color:#eee4ff;text-decoration:underline}