@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{font-family:Space Grotesk,Inter,system-ui,-apple-system,sans-serif;background:linear-gradient(145deg,#0f172a,#0b1220);color:#e2e8f0;min-height:100vh}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:transparent}button{font-family:inherit}.NavBar{display:flex;flex-direction:column;gap:18px;padding:20px 20px 28px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:14px;background:#ffffff08;border:1px solid rgba(255,255,255,.05);box-shadow:0 16px 36px #0000003d}.topbar-actions{display:flex;align-items:center;gap:10px}.nav-link{color:#cbd5e1;text-decoration:none;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.05);background:#ffffff08;font-weight:600}.nav-link:hover{border-color:#0ea5e980;color:#e0f2fe}.brand{color:#e2e8f0;text-decoration:none;font-weight:800;letter-spacing:.08em;font-size:1.05rem;text-transform:uppercase}.user-btn{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#22d3ee,#0ea5e9);color:#0b1220;text-decoration:none;font-weight:700;box-shadow:0 10px 24px #0ea5e959;transition:transform .15s ease,filter .2s ease}.user-btn:hover{transform:translateY(-2px);filter:brightness(1.05)}.avatar{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:inherit;font-size:1rem}.page{display:grid;grid-template-columns:280px 1fr 320px;gap:24px;padding:0 8px;min-height:calc(100vh - 90px)}.editor-layout{grid-template-columns:1fr 320px}.sidebar{background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:18px;padding:18px 16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 18px 45px #00000040}.sidebar.left{display:flex;flex-direction:column;gap:12px}.sidebar.right{display:flex;flex-direction:column;gap:10px}.sticky{position:sticky;top:16px}.sidebar-header{display:flex;gap:12px;align-items:center}.dot{width:12px;height:12px;border-radius:50%;background:#38bdf8;box-shadow:0 0 0 6px #38bdf826}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;color:#94a3b8;font-weight:600}.title{font-weight:700;color:#e2e8f0}.recent-list{display:flex;flex-direction:column;gap:10px}.recent-card{width:100%;text-align:left;padding:12px 12px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.05);background:linear-gradient(135deg,#38bdf814,#ffffff05);color:#e2e8f0;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .2s ease}.recent-card:hover{transform:translateY(-3px);border-color:#38bdf859;box-shadow:0 10px 24px #0000004d}.recent-title{font-weight:700;margin-bottom:4px}.recent-meta{display:flex;gap:6px;color:#94a3b8;font-size:.9rem;align-items:center}.bullet{opacity:.5}.main{background:#ffffff05;border-radius:18px;border:1px solid rgba(255,255,255,.05);padding:22px;box-shadow:0 18px 45px #0000003d;display:flex;flex-direction:column;gap:20px}.main-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.main-header h1{margin:6px 0 8px;font-size:1.8rem;letter-spacing:-.01em}.lede{margin:0;color:#cbd5e1;max-width:48ch}.actions{display:flex;gap:10px}.editor-actions{display:flex;gap:10px;align-items:center}.btn{border:none;border-radius:12px;padding:12px 16px;font-weight:700;font-size:.95rem;cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,filter .2s ease}.btn.primary{background:linear-gradient(135deg,#0ea5e9,#22d3ee);color:#0b1220;box-shadow:0 10px 24px #0ea5e959}.btn.secondary{background:#ffffff14;color:#e2e8f0;border:1px solid rgba(255,255,255,.08)}.btn.third{background:linear-gradient(135deg,#ef4444,#f87171);color:#0b1220;box-shadow:0 10px 24px #0ea5e959}.btn:hover{transform:translateY(-2px);filter:brightness(1.05)}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.search{flex:1}.search input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:#e2e8f0;outline:none}.search input::placeholder{color:#94a3b8}.filters{display:flex;gap:8px}.chip{padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:#cbd5e1;cursor:pointer}.chip.active{border-color:#0ea5e980;color:#e0f2fe;background:#0ea5e926}.grid-section{background:#ffffff03;border:1px solid rgba(255,255,255,.04);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading h2{margin:4px 0 0;font-size:1.2rem}.ghost{background:transparent;border:1px dashed rgba(255,255,255,.18);border-radius:10px;color:#94a3b8;padding:8px 12px;cursor:pointer}.folder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.folder-card{padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:#ffffff05;color:#e2e8f0}.folder-dot{width:12px;height:12px;border-radius:8px;margin-bottom:8px}.folder-name{font-weight:700}.folder-meta{color:#94a3b8;font-size:.9rem;display:flex;gap:6px;align-items:center}.quiz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.quiz-card{text-align:left;padding:14px;border-radius:12px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(140deg,#ffffff08,#ffffff03);color:#e2e8f0;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .2s ease}.quiz-card:hover{transform:translateY(-2px);border-color:#0ea5e959;box-shadow:0 12px 28px #00000047}.quiz-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.pill{background:#0ea5e924;color:#67e8f9;padding:6px 10px;border-radius:999px;font-weight:700;font-size:.85rem}.quiz-title{font-weight:700;font-size:1.05rem;margin-bottom:6px}.quiz-meta{color:#94a3b8;font-size:.9rem;display:flex;gap:6px;align-items:center;margin-bottom:8px}.muted{color:#94a3b8}.progress{width:100%;height:6px;background:#ffffff0f;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#22d3ee,#0ea5e9)}.placeholder-card{margin-top:8px;padding:14px;border-radius:12px;border:1px dashed rgba(255,255,255,.15);background:#ffffff05;display:flex;gap:12px;align-items:center}.placeholder-bubble{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#22d3ee,#a855f7);opacity:.6}.placeholder-lines{display:grid;gap:6px;width:100%}.placeholder-lines span{display:block;height:8px;border-radius:12px;background:#ffffff14}.import-page{display:flex;justify-content:center;align-items:flex-start;padding-top:48px}.modal{width:min(720px,100%);background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:20px 18px 18px;box-shadow:0 18px 45px #00000040}.modal-header h2{margin:4px 0 8px}.modal-actions{display:flex;justify-content:center;gap:10px;margin-top:12px}.file-note{margin-top:10px;color:#cbd5e1;font-size:.95rem}.placeholder-panel.full{width:100%;border:1px dashed rgba(255,255,255,.2);border-radius:16px;padding:24px;background:#ffffff05;color:#e2e8f0}.editor-main{gap:16px}.editor-metadata{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-bottom:8px}.editor-box{display:flex;flex-direction:column;gap:14px}.question-card{padding:14px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:#ffffff05;display:flex;flex-direction:column;gap:10px}.question-row textarea{width:100%;min-height:90px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:#e2e8f0;padding:10px;resize:vertical;font-family:inherit}.question-label{color:#94a3b8;font-weight:700;margin-bottom:6px}.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}.option-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.05);background:#ffffff08}.option-input{flex:1;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:#e2e8f0;outline:none}.options-controls{display:flex;justify-content:flex-end;margin-top:6px}.question-actions{display:flex;gap:8px;align-items:center;margin-bottom:8px}.ghost.small{padding:6px 8px;font-size:.9rem}.add-question{width:100%;padding:14px;border-radius:12px;border:1px dashed rgba(14,165,233,.5);color:#e0f2fe;background:#0ea5e914;font-weight:700;cursor:pointer}.play-shell{background:linear-gradient(145deg,#0f172a,#0b1220);color:#f1f5f9;display:flex;justify-content:center;padding:48px 32px}.play-page{width:min(90%,100%);min-height:400px;display:flex;flex-direction:column;gap:28px}.start-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}.start-card{justify-content:center;padding:18px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:#00000073;box-shadow:0 18px 45px #00000040}.start-actions{margin-top:12px;padding:15px 0;display:flex;gap:10px}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}.toggle-row:last-child{border-bottom:none}.switch{position:relative;display:inline-block;width:46px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:#fff3;transition:.2s;border-radius:26px}.slider:before{position:absolute;content:"";height:18px;width:18px;left:4px;bottom:4px;background-color:#fff;transition:.2s;border-radius:50%}.switch input:checked+.slider{background:linear-gradient(135deg,#22d3ee,#0ea5e9)}.switch input:checked+.slider:before{transform:translate(20px)}.play-question-box{position:relative;border-radius:16px;background:#0000008c;border:1px solid rgba(255,255,255,.08);padding:22px 24px 24px;text-align:center;box-shadow:0 24px 50px #00000059}.count-pill{position:absolute;top:-14px;left:50%;transform:translate(-50%);background:#111827;color:#fbbf24;border-radius:999px;padding:6px 12px;font-weight:700;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 18px #00000059}.play-question-box h2{margin:0;font-size:clamp(1.6rem,2.6vw,2rem);letter-spacing:-.01em;color:#f8fafc}.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.choice-card{position:relative;text-align:center;padding:28px 18px 32px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:#ffffff08;color:#f8fafc;cursor:pointer;transition:transform .12s ease,border-color .15s ease,box-shadow .2s ease,filter .2s ease,background .2s ease;min-height:220px;display:flex;align-items:center;justify-content:center}.choice-card:hover{transform:translateY(-3px);box-shadow:0 18px 32px #0000004d}.choice-text{font-weight:700;font-size:1.05rem;line-height:1.4}.choice-index{position:absolute;top:10px;right:10px;background:#00000059;border-radius:8px;padding:6px 8px;font-weight:700;font-size:.9rem}.choice-card.choice-selected{background:linear-gradient(135deg,#22d3ee,#0ea5e9);border-color:#ffffff59;color:#0b1220;box-shadow:0 14px 28px #0ea5e959}.choice-card.choice-correct{background:#22c55e29;border-color:#22c55ecc;box-shadow:0 18px 36px #22c55e59}.choice-card.choice-wrong{background:#ef44442e;border-color:#ef4444cc;box-shadow:0 18px 36px #ef444459}.play-submit-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px}.btn.wide.align-right{justify-self:end;min-width:180px}.play-progress{display:flex;align-items:center;gap:10px}.progress.slim{height:10px;box-shadow:none;background:#ffffff14}.play-menu{position:relative;align-self:flex-end}.kebab{background:#ffffff14;color:#e2e8f0;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px;cursor:pointer;font-weight:700;letter-spacing:.08em}.dropdown{position:absolute;right:0;top:110%;background:#0f172af2;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px;min-width:160px;display:flex;flex-direction:column;gap:6px;box-shadow:0 12px 28px #00000059;z-index:20}.dropdown-item{background:transparent;color:#e2e8f0;border:0;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer}.dropdown-item:hover{background:#ffffff0f}@media (max-width: 1180px){.page{grid-template-columns:260px 1fr;grid-template-areas:"left main" "right main"}.sidebar.right{grid-area:right}}@media (max-width: 960px){.page{grid-template-columns:1fr}.sidebar.left,.sidebar.right{order:2}.main{order:1}.main-header{flex-direction:column;align-items:flex-start}.actions{width:100%}.toolbar{flex-direction:column;align-items:stretch}}