:root{--bg:#0e0e10;--panel:#1a1a1d;--border:#2a2a2e;--text:#ffffff;--muted:#a1a1aa;--yellow:#ffcd29;--yellow-h:#ffd84d;--on-yellow:#18181b;--dark2:#26262b;--dark2-h:#34343a;--green:#238636;--green-h:#2ea043;--red:#da3633;--red-h:#f85149;--accent:#ffcd29}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;color:var(--text);background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23ffcd29' fill-opacity='0.05'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-attachment:fixed}.wrap{max-width:960px;margin:2rem auto;padding:0 1.25rem}.center{min-height:100vh;display:flex;align-items:center;justify-content:center}.muted{color:var(--muted)}.title{font-size:3rem;text-align:center;margin:.5rem 0 2.5rem}.bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.back{display:inline-block;margin-bottom:.75rem}.error{color:var(--red-h);margin-top:1rem}.login{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:2rem;text-align:center;max-width:380px}.btn-discord{padding:.6rem 1.1rem;border:0;border-radius:8px;background:#5865f2;color:#fff;font-weight:600;cursor:pointer}.grid{display:grid;gap:1.75rem}.course-skeleton{border:2px dashed rgba(255,255,255,.25);border-radius:12px;background:#ffffff09;min-height:245px}.course{padding:0;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--panel);color:#fff;cursor:pointer;text-align:left;transition:transform .12s,border-color .12s}.course:hover{transform:translateY(-3px);border-color:var(--accent)}.course-img{height:180px;background:linear-gradient(135deg,#ffcd2933,#ffffff10),#0e0e10;background-size:cover;background-position:center}.course-name{padding:1.1rem 1.25rem;font-weight:700;font-size:1.3rem;color:#fff}.course-heading{font-size:2.4rem;text-align:center;margin:3rem 0 1.5rem}.labs-panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:.5rem 1.25rem;margin:2.5rem 0 3rem}.labs{width:100%;border-collapse:collapse}.labs td{padding:.9rem .25rem;border-bottom:1px solid var(--border)}.labs tr:last-child td{border-bottom:0}.section-name{font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--yellow);padding:1.6rem .25rem .55rem!important;border-bottom:1px solid var(--border)!important}.labs tr.section-row:first-child .section-name{padding-top:.55rem!important}.lab-name{font-size:1.05rem}.lab-action{width:1%;text-align:right}.play{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;padding:0;background:none;color:var(--yellow);cursor:pointer;transition:color .12s,transform .12s}.play:hover{color:var(--yellow-h);transform:scale(1.12)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;padding:1rem}.modal{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.5rem 1.5rem 1.25rem;width:min(480px,92vw);box-shadow:0 12px 40px #00000080}.modal-title{margin:0 0 .5rem;font-size:1.3rem;font-weight:700}.modal-desc{margin:0;color:var(--text);font-weight:400;line-height:1.5}.modal-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem}.btn-green{padding:.55rem 1.2rem;border:0;border-radius:8px;background:var(--yellow);color:var(--on-yellow);font-weight:700;cursor:pointer}.btn-green:hover{background:var(--yellow-h)}.btn-green:disabled{opacity:.6;cursor:default}.btn-red{padding:.55rem 1.2rem;border:1px solid var(--border);border-radius:8px;background:var(--dark2);color:#fff;font-weight:600;cursor:pointer}.btn-red:hover{background:var(--dark2-h)}
