@import "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap";:root{--duo-green:#00978a;--duo-green-dark:#007a70;--duo-green-light:#dbf0ee;--duo-blue:#1cb0f6;--duo-red:#ff4b4b;--duo-gold:#ffc800;--duo-purple:#ce82ff;--duo-gray:#afafaf}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}:root{--duo-green:#00978a;--duo-green-dark:#007a70;--duo-green-light:#dbf0ee;--duo-blue:#1cb0f6;--duo-orange:#ff9600;--duo-red:#ff4b4b;--duo-gold:#ffc800;--duo-purple:#ce82ff;--admin-purple:#7c5cfc;--duo-gray:#afafaf;--bg-light:#f7f7f7;--border-main:#e5e5e5}body{background:#f0f0f0;min-height:100vh;padding:20px 0 40px;font-family:Nunito,sans-serif}.qm-app{flex-direction:column;align-items:center;display:flex}.phone{background:#fff;border:1px solid #ddd;border-radius:40px;flex-direction:column;display:flex;position:relative;overflow:hidden;transform:translateZ(0);box-shadow:0 50px 100px -20px #00000040,0 30px 60px -30px #0000004d}.phone:after{content:"";z-index:1000;background:#0003;border-radius:10px;width:120px;height:5px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.statusbar{color:#3c3c3c;z-index:999;background:#fff;justify-content:space-between;align-items:center;padding:10px 24px 6px;font-size:11px;font-weight:900;display:flex}.screen{background:#fff;flex-direction:column;flex:1;width:100%;min-height:0;display:flex;position:relative;overflow:hidden}.card-premium{border:2px solid var(--border-main);background:#fff;border-bottom-width:4px;border-radius:20px;padding:16px;transition:transform .1s}.card-premium:active{border-bottom-width:2px;transform:translateY(2px)}.btn-duo{letter-spacing:.5px;text-transform:uppercase;cursor:pointer;text-align:center;border:none;border-radius:16px;width:100%;padding:14px;font-family:Nunito,sans-serif;font-size:15px;font-weight:800;transition:all .1s;display:block}.btn-green{background:var(--duo-green);color:#fff;border-bottom:4px solid var(--duo-green-dark)}.btn-green:active{border-bottom:2px solid var(--duo-green-dark);transform:translateY(2px)}.btn-blue{color:#fff;background:#1cb0f6;border-bottom:4px solid #0898dc}.btn-blue:active{border-bottom:2px solid #0898dc;transform:translateY(2px)}.btn-outline{color:#1cb0f6;background:#fff;border:2px solid #e5e5e5;border-bottom-width:4px}.btn-disabled{color:#afafaf;cursor:not-allowed;background:#e5e5e5;border-bottom:4px solid #ccc}.phone.theme-musyrif .btn-green{background:#23a100;border-bottom-color:#1a7a00}.phone.theme-musyrif .statusbar,.phone.theme-musyrif .topbar{color:#fff;background:#1a1a1a}.phone.theme-admin .btn-green{background:#4f46e5;border-bottom-color:#3730a3}.phone.theme-admin .statusbar,.phone.theme-admin .topbar{color:#fff;background:#1e293b}.topbar{align-items:center;gap:10px;padding:12px 16px 8px;display:flex}.prog-bar-bg{background:#e5e5e5;border-radius:100px;flex:1;height:16px;overflow:hidden}.prog-bar-fill{background:var(--duo-green);border-radius:100px;height:100%;transition:width .4s}.section-label{letter-spacing:1px;text-transform:uppercase;color:#afafaf;margin:10px 0 6px;padding:0 16px;font-size:11px;font-weight:800}.scroll-content{-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.qm-app.svelte-12qhfyh{background:#f0f0f0;min-height:100vh;display:flex;overflow-x:hidden;flex-direction:row!important;align-items:stretch!important}.mobile-topbar.svelte-12qhfyh{z-index:900;background:#fff;border-bottom:1px solid #e5e5e5;justify-content:space-between;align-items:center;height:60px;padding:0 16px;display:none;position:fixed;top:0;left:0;right:0}.menu-toggle.svelte-12qhfyh{color:#3c3c3c;cursor:pointer;background:0 0;border:none;font-size:24px}.app-logo.svelte-12qhfyh{color:#3c3c3c;align-items:center;gap:8px;font-weight:900;display:flex}.menu-overlay.svelte-12qhfyh{z-index:999;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080;position:fixed;inset:0}.snav.svelte-12qhfyh{z-index:1000;background:#fafafa;border-right:1px solid #e5e5e5;flex-direction:column;width:240px;height:100vh;padding:16px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;left:0}.snav.collapsed.svelte-12qhfyh{width:72px;padding:16px 12px}.logo-text.svelte-12qhfyh,.cat-label.svelte-12qhfyh,.snb-text.svelte-12qhfyh{white-space:nowrap;overflow:hidden}.snav-scroll.svelte-12qhfyh{flex:1;padding-right:4px;overflow-y:auto}.snav-logo.svelte-12qhfyh{border-bottom:1px solid #e5e5e5;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;padding:12px 8px 20px;display:flex}.close-menu-btn.svelte-12qhfyh{color:#afafaf;background:0 0;border:none;font-size:20px;display:none}.cat-header.svelte-12qhfyh{text-transform:uppercase;letter-spacing:1px;align-items:center;margin:16px 0 6px;padding-left:4px;font-size:10px;font-weight:900;display:flex}.cat-dot.svelte-12qhfyh{border-radius:50%;flex-shrink:0;width:6px;height:6px}.snb.svelte-12qhfyh{cursor:pointer;color:#777;text-align:left;background:#fff;border:2px solid #e5e5e5;border-radius:14px;align-items:center;gap:12px;width:100%;margin-bottom:6px;padding:10px 12px;font-family:Nunito,sans-serif;font-size:11px;font-weight:800;transition:all .15s;display:flex}.collapsed.svelte-12qhfyh .snb:where(.svelte-12qhfyh){justify-content:center;padding:10px}.snb-icon.svelte-12qhfyh{flex-shrink:0;justify-content:center;align-items:center;font-size:14px;display:flex}.main-container.svelte-12qhfyh{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;min-height:100vh;margin-left:240px;padding:60px 20px 40px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.main-container.collapsed.svelte-12qhfyh{margin-left:72px}.sidebar-toggle-btn.svelte-12qhfyh{color:#afafaf;cursor:pointer;z-index:101;background:#fff;border:1px solid #e5e5e5;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;transition:all .2s;display:flex;position:absolute;top:32px;right:-14px;box-shadow:0 2px 4px #0000000d}.sidebar-toggle-btn.svelte-12qhfyh:hover{color:#3c3c3c;background:#f7f7f7;border-color:#ccc}.view-switcher-container.svelte-12qhfyh{flex-wrap:wrap;flex-shrink:0;justify-content:center;align-items:center;gap:16px;width:100%;margin-bottom:24px;display:flex}.view-switcher.svelte-12qhfyh{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffd9;border:2px solid #e5e5e5cc;border-radius:100px;padding:4px;display:flex;box-shadow:0 4px 20px #0000000d}.switcher-btn.svelte-12qhfyh{color:#777;cursor:pointer;background:0 0;border:none;border-radius:100px;align-items:center;gap:6px;padding:8px 16px;font-family:Nunito,sans-serif;font-size:12px;font-weight:800;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.switcher-btn.svelte-12qhfyh:hover{color:#3c3c3c}.switcher-btn.active.svelte-12qhfyh{color:#fff;background:#00978a;box-shadow:0 2px 8px #00978a4d}.phone.svelte-12qhfyh{background:#fff;border:12px solid #1a1a1a;border-radius:48px;width:390px;height:844px;margin:0 auto;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}.phone.svelte-12qhfyh:after{content:"";opacity:.2;z-index:1000;background:#000;border-radius:10px;width:120px;height:5px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.role-indicator.svelte-12qhfyh{text-align:center;text-transform:uppercase;letter-spacing:1px;padding:8px;font-size:10px;font-weight:900}.tablet.svelte-12qhfyh{background:#fff;border:14px solid #1a1a1a;border-radius:36px;flex-direction:column;width:680px;height:820px;margin:0 auto;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}.tablet.svelte-12qhfyh:after{content:"";z-index:1000;background:#333;border-radius:50%;width:8px;height:8px;position:absolute;top:6px;left:50%;transform:translate(-50%)}.tablet-statusbar.svelte-12qhfyh{color:#64748b;background:#f8fafc;border-bottom:1px solid #e2e8f0;flex-shrink:0;justify-content:space-between;align-items:center;height:30px;padding:0 16px;font-size:11px;font-weight:800;display:flex}.tablet-body.svelte-12qhfyh{background:#fff;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.tablet-role.svelte-12qhfyh{text-align:center;text-transform:uppercase;letter-spacing:1px;padding:8px;font-size:10px;font-weight:900}.tablet.theme-musyrif.svelte-12qhfyh .tablet-statusbar:where(.svelte-12qhfyh){color:#aaa;background:#1a1a1a;border-bottom-color:#333}.tablet.theme-admin.svelte-12qhfyh .tablet-statusbar:where(.svelte-12qhfyh){color:#94a3b8;background:#1e293b;border-bottom-color:#334155}.desktop-browser.svelte-12qhfyh{background:#fff;border:14px solid #1a1a1a;border-radius:32px;flex-direction:column;width:1280px;height:800px;margin:0 auto;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}.browser-chrome.svelte-12qhfyh{background:#f8fafc;border-bottom:1px solid #e2e8f0;flex-shrink:0;align-items:center;gap:16px;height:48px;padding:0 16px;display:flex}.chrome-dots.svelte-12qhfyh{gap:6px;display:flex}.chrome-dot.svelte-12qhfyh{border-radius:50%;width:12px;height:12px;display:inline-block}.chrome-dot.red.svelte-12qhfyh{background:#ff5f56}.chrome-dot.yellow.svelte-12qhfyh{background:#ffbd2e}.chrome-dot.green.svelte-12qhfyh{background:#27c93f}.chrome-nav.svelte-12qhfyh{gap:4px;display:flex}.chrome-nav-btn.svelte-12qhfyh{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;transition:all .2s;display:flex}.chrome-nav-btn.svelte-12qhfyh:hover:not(:disabled){color:#1e293b;background:#f1f5f9}.chrome-nav-btn.svelte-12qhfyh:disabled{opacity:.4;cursor:not-allowed}.chrome-address.svelte-12qhfyh{color:#64748b;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:6px;max-width:400px;height:30px;margin:0 auto;font-size:12px;font-weight:600;display:flex}.chrome-address.svelte-12qhfyh i:where(.svelte-12qhfyh){color:#10b981;font-size:11px}.chrome-actions.svelte-12qhfyh{align-items:center;display:flex}.role-badge.svelte-12qhfyh{text-transform:uppercase;letter-spacing:.5px;border-radius:100px;padding:4px 10px;font-size:10px;font-weight:800;box-shadow:0 1px 2px #00000005}.browser-body.svelte-12qhfyh{background:#fff;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.desktop-browser.theme-musyrif.svelte-12qhfyh .browser-chrome:where(.svelte-12qhfyh){background:#1a1a1a;border-bottom-color:#333}.desktop-browser.theme-musyrif.svelte-12qhfyh .chrome-address:where(.svelte-12qhfyh){color:#aaa;background:#2a2a2a;border-color:#3e3e3e}.desktop-browser.theme-admin.svelte-12qhfyh .browser-chrome:where(.svelte-12qhfyh){background:#1e293b;border-bottom-color:#334155}.desktop-browser.theme-admin.svelte-12qhfyh .chrome-address:where(.svelte-12qhfyh){color:#94a3b8;background:#0f172a;border-color:#1e293b}@media (width<=1024px){.snav.svelte-12qhfyh{width:220px}.main-container.svelte-12qhfyh{margin-left:220px}}@media (width<=500px){.mobile-topbar.svelte-12qhfyh{display:flex!important}.snav.svelte-12qhfyh{z-index:1001!important;transform:translate(-100%)!important}.snav.open.svelte-12qhfyh{transform:translate(0)!important}.main-container.svelte-12qhfyh{justify-content:center!important;align-items:flex-start!important;min-height:100vh!important;margin-left:0!important;padding:80px 20px 40px!important;display:flex!important}.sidebar-toggle-btn.svelte-12qhfyh{display:none!important}}.tablet-body.svelte-12qhfyh .bottom-nav,.browser-body.svelte-12qhfyh .bottom-nav,.qm-app.lesson-mode.svelte-12qhfyh .snav:where(.svelte-12qhfyh){display:none!important}.qm-app.lesson-mode.svelte-12qhfyh .main-container:where(.svelte-12qhfyh){margin-left:0!important;padding-top:20px!important}body{margin:0;padding:0}.canvas-viewport.svelte-12qhfyh{scroll-behavior:smooth;touch-action:pan-x pan-y;justify-content:center;align-items:flex-start;width:100%;height:auto;display:flex;position:relative;overflow:auto}.canvas-content.svelte-12qhfyh{will-change:transform;justify-content:center;align-items:flex-start;padding:20px;display:flex}.hint-touch.svelte-12qhfyh{display:none}@media (pointer:coarse){.hint-desktop.svelte-12qhfyh{display:none}.hint-touch.svelte-12qhfyh{display:inline}}.top-zoom-controls.svelte-12qhfyh{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffd9;border:2px solid #e5e5e5cc;border-radius:100px;align-items:center;padding:4px;display:flex;box-shadow:0 4px 20px #0000000d}.zoom-btn.svelte-12qhfyh{color:#777;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:11px;transition:all .2s;display:flex}.zoom-btn.svelte-12qhfyh:hover{color:#fff;background:#00978a}.zoom-text.svelte-12qhfyh{color:#555;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;min-width:44px;font-family:Nunito,sans-serif;font-size:12px;font-weight:800;transition:color .2s}.zoom-text.svelte-12qhfyh:hover{color:#00978a}