:root{--primary-bg:#f8fafc;--glass-bg:#ffffffb3;--glass-border:#ffffff4d;--brand-color:#6366f1;--accent-mint:#10b981;--accent-rose:#f43f5e;--accent-amber:#f59e0b;--text-main:#1e293b;--text-muted:#64748b;--card-shadow:0 8px 32px 0 #1f268712;--border-radius:24px}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;color:var(--text-main);-webkit-font-smoothing:antialiased;background:linear-gradient(135deg,#e0e7ff 0%,#f1f5f9 100%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--card-shadow)}.title-gradient{background:linear-gradient(to right, var(--brand-color), var(--accent-mint));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-weight:800}.login-page{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-header{text-align:center;margin-bottom:30px}.logo-box{background:#fff;border-radius:18px;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto 15px;display:flex;box-shadow:0 4px 12px #0000000d}.logo-box img{width:36px}.login-header h1{color:var(--text-main);margin-bottom:8px;font-size:28px}.login-header p{color:var(--text-muted);font-size:14px}.login-card{width:100%;max-width:400px;padding:30px}.mode-tabs{background:#00000008;border-radius:12px;margin-bottom:25px;padding:4px;display:flex}.mode-tabs button{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:8px;flex:1;padding:10px;font-size:14px;font-weight:600;transition:all .3s}.mode-tabs button.active{color:var(--text-main);background:#fff;box-shadow:0 2px 8px #0000000d}.form-group{margin-bottom:20px}.form-group label{color:var(--text-muted);margin-bottom:8px;font-size:13px;font-weight:600;display:block}.glass-input{background:#ffffff80;border:1px solid #0000001a;border-radius:12px;outline:none;width:100%;padding:12px 16px;transition:all .3s}.glass-input:focus{border-color:var(--brand-color);background:#fff;box-shadow:0 0 0 4px #6366f11a}.submit-btn{background:var(--brand-color);color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;margin-top:10px;padding:14px;font-size:16px;font-weight:700;transition:all .3s}.submit-btn:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 20px #6366f14d}.submit-btn:active{transform:translateY(0)}.submit-btn:disabled{cursor:wait;opacity:.7}.form-error{color:var(--accent-rose);margin-top:-6px;margin-bottom:12px;font-size:12px;font-weight:600}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0006;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{width:90%;max-width:450px;padding:30px;animation:.3s slideUp}.modal-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.modal-header h2{color:var(--text-main);font-size:20px;font-weight:700}.close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:5px;transition:all .2s}.close-btn:hover{color:var(--accent-rose);background:#0000000d}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.pet-card{flex-direction:column;align-items:center;width:200px;padding:24px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative}.pet-card:hover{transform:translateY(-8px)}.pet-lv-badge{background:var(--accent-mint);color:#fff;border-radius:8px;padding:2px 8px;font-size:11px;font-weight:800;position:absolute;top:15px;left:15px}.pet-visual{justify-content:center;align-items:center;height:120px;margin-bottom:20px;display:flex}.egg-display{flex-direction:column;align-items:center;display:flex;position:relative}.egg-float{width:80px;animation:3s ease-in-out infinite float}.egg-shadow{filter:blur(2px);background:#0000000d;border-radius:50%;width:40px;height:6px;margin-top:10px;animation:3s ease-in-out infinite shadowScale}.student-info{text-align:center;margin-bottom:20px}.pet-type-label{color:var(--text-muted);margin-bottom:4px;font-size:12px;display:block}.student-name{color:var(--text-main);font-size:18px;font-weight:700}.pet-action-btn{cursor:pointer;border:none;border-radius:12px;width:100%;padding:10px;font-size:13px;font-weight:600;transition:all .2s}.pet-action-btn.activate{color:var(--text-muted);background:#00000008}.pet-action-btn.activate:hover{background:var(--text-main);color:#fff}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shadowScale{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.2;transform:scale(.8)}}.pet-selection-container{flex-direction:column;display:flex}.pet-selection-container .subtitle{color:var(--text-muted);text-align:center;margin-bottom:20px;font-size:13px}.pet-grid{grid-template-columns:repeat(4,1fr);gap:12px;max-height:250px;margin-bottom:25px;padding:5px;display:grid;overflow-y:auto}.pet-option{cursor:pointer;border:2px solid #0000;border-radius:16px;flex-direction:column;align-items:center;gap:8px;padding:12px;transition:all .2s;display:flex}.pet-option:hover{background:#00000008}.pet-option.active{border-color:var(--accent-mint);background:#fff;box-shadow:0 4px 12px #10b98126}.pet-icon-wrapper{background:#00000005;border-radius:12px;justify-content:center;align-items:center;width:50px;height:50px;display:flex}.pet-icon-wrapper img{width:32px}.pet-option span{font-size:12px;font-weight:600}.pet-naming-section{margin-bottom:20px}.pet-naming-section label{color:var(--text-muted);margin-bottom:8px;font-size:12px;font-weight:600;display:block}.confirm-activation-btn{background:var(--accent-mint);color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;padding:14px;font-size:16px;font-weight:700;transition:all .3s}.confirm-activation-btn:disabled{cursor:not-allowed;background:#cbd5e1}.confirm-activation-btn:not(:disabled):hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 20px #10b9814d}.interaction-container{flex-direction:column;display:flex}.interaction-tabs{background:#00000008;border-radius:12px;margin-bottom:20px;padding:4px;display:flex}.interaction-tabs button{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:8px;flex:1;padding:10px;font-size:14px;font-weight:600;transition:all .3s}.interaction-tabs button.active{color:var(--accent-mint);background:#fff;box-shadow:0 2px 8px #0000000d}.interaction-tabs button.active.negative{color:var(--accent-rose)}.rules-grid{grid-template-columns:repeat(2,1fr);gap:12px;max-height:400px;padding:2px;display:grid;overflow-y:auto}.rule-card{cursor:pointer;background:#ffffff80;border:1px solid #0000000d;border-radius:16px;align-items:center;gap:12px;padding:12px;transition:all .2s;display:flex}.rule-card:hover{background:#fff;transform:scale(1.02);box-shadow:0 4px 12px #0000000d}.rule-card.positive:hover{border-color:var(--accent-mint)}.rule-card.negative:hover{border-color:var(--accent-rose)}.rule-icon{background:#00000005;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:24px;display:flex}.rule-info{flex-direction:column;gap:4px;display:flex}.rule-name{color:var(--text-main);font-size:14px;font-weight:700}.rule-changes{gap:8px;font-size:11px;font-weight:600;display:flex}.exp-change{color:var(--brand-color)}.coin-change{color:var(--accent-amber)}.pet-paradise-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:25px;width:100%;padding:20px;display:grid}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;margin-top:50px;display:flex}.empty-illustration{margin-bottom:20px;font-size:64px}.empty-state h2{color:var(--text-main);margin-bottom:10px;font-size:24px}.empty-state p{color:var(--text-muted);margin-bottom:30px}.import-btn-large{background:var(--accent-mint);color:#fff;cursor:pointer;border:none;border-radius:16px;align-items:center;gap:10px;padding:14px 28px;font-weight:700;transition:all .3s;display:flex}.import-btn-large:hover{transform:scale(1.05);box-shadow:0 10px 25px #10b9814d}.import-overlay{text-align:left;width:100%;max-width:500px;margin-top:30px;padding:25px}.import-overlay h3{margin-bottom:15px;font-size:18px}.import-overlay textarea{resize:vertical;width:100%;margin-bottom:20px}.import-actions{justify-content:flex-end;gap:15px;display:flex}.import-actions button{cursor:pointer;border:none;border-radius:10px;padding:8px 20px}.mini-shop-container{width:100%;padding:20px}.shop-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.header-info{align-items:center;gap:15px;display:flex}.shop-icon{color:var(--brand-color)}.header-info h2{color:var(--text-main);font-size:24px}.header-info .subtitle{color:var(--text-muted);background:#00000008;border-radius:6px;padding:2px 8px;font-size:13px}.add-item-btn{background:var(--text-main);color:#fff;cursor:pointer;border:none;border-radius:12px;align-items:center;gap:8px;padding:10px 20px;font-weight:600;transition:all .3s;display:flex}.add-item-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.shop-items-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.shop-item-card{align-items:center;gap:20px;padding:20px;display:flex}.item-icon{background:#fff;border-radius:16px;justify-content:center;align-items:center;width:60px;height:60px;font-size:32px;display:flex;box-shadow:0 2px 8px #0000000d}.item-details{flex:1}.item-details h3{margin-bottom:8px;font-size:16px}.item-meta{gap:15px;font-size:13px;font-weight:600;display:flex}.item-meta .price{color:var(--accent-amber)}.item-meta .stock{color:var(--text-muted)}.redeem-trigger-btn{background:var(--accent-rose);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:8px 16px;font-size:13px;font-weight:700;transition:all .2s}.redeem-trigger-btn:hover:not(:disabled){filter:brightness(1.1);transform:scale(1.05)}.redeem-trigger-btn:disabled{cursor:not-allowed;background:#cbd5e1}.empty-shop{color:var(--text-muted);flex-direction:column;grid-column:1/-1;align-items:center;gap:15px;padding:100px;display:flex}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.redeem-hint{color:var(--text-muted);margin-bottom:15px;font-size:13px}.redeem-summary{color:var(--text-muted);justify-content:space-between;gap:12px;margin-bottom:14px;font-size:12px;font-weight:700;display:flex}.student-selection-grid{grid-template-columns:repeat(3,1fr);gap:10px;max-height:300px;padding:5px;display:grid;overflow-y:auto}.student-item{cursor:pointer;background:#ffffff80;border:1px solid #0000000d;border-radius:12px;flex-direction:column;padding:10px;transition:all .2s;display:flex;position:relative}.student-item.disabled{opacity:.4;cursor:not-allowed;filter:grayscale()}.student-item.selected{border-color:var(--brand-color);background:#fff;box-shadow:0 4px 12px #6366f11a}.s-name{font-size:14px;font-weight:600}.s-coins{color:var(--accent-amber);font-size:11px}.check-mark{color:var(--brand-color);font-size:12px;font-weight:800;position:absolute;top:5px;right:5px}.hof-container{width:100%;padding:20px}.hof-header{justify-content:center;margin-bottom:40px;display:flex}.rank-switches{border-radius:16px;gap:8px;padding:6px;display:flex}.rank-switches button{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:12px;padding:10px 24px;font-size:14px;font-weight:700;transition:all .3s}.rank-switches button.active{background:var(--text-main);color:#fff;box-shadow:0 4px 12px #0000001a}.hof-content{gap:30px;max-width:1000px;margin:0 auto;display:flex}.champion-card-wrapper{flex:1}.champion-card{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:40px;display:flex;position:relative;overflow:visible}.crown-box{z-index:10;animation:2s infinite bounce;position:absolute;top:-30px}.crown-icon{color:var(--accent-amber);filter:drop-shadow(0 4px 8px #f59e0b66)}.champion-visual img{filter:drop-shadow(0 10px 20px #0000001a);width:150px;margin-bottom:20px}.coin-champion-avatar{margin-bottom:20px;font-size:80px}.champion-info h2{margin-bottom:10px;font-size:32px}.champion-honor{background:var(--accent-mint);color:#fff;border-radius:20px;margin-bottom:25px;padding:4px 12px;font-size:13px;font-weight:700;display:inline-block}.champion-stats{gap:20px;width:100%;display:flex}.stat{background:#fff6;border-radius:16px;flex-direction:column;flex:1;gap:5px;padding:15px;display:flex}.stat .label{color:var(--text-muted);font-size:12px}.stat .value{color:var(--text-main);font-size:20px;font-weight:800}.ranking-list{flex-direction:column;flex:1;gap:12px;max-width:400px;padding:20px;display:flex}.rank-item{background:#fff6;border-radius:14px;align-items:center;gap:15px;padding:12px 16px;transition:all .2s;display:flex}.rank-item:hover{background:#fff;transform:translate(5px)}.rank-num{color:var(--brand-color);width:30px;font-weight:800}.rank-info{flex-direction:column;flex:1;display:flex}.rank-name{font-weight:700}.rank-pet{color:var(--text-muted);font-size:11px}.rank-score{font-size:13px;font-weight:800}@keyframes bounce{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-10px)rotate(5deg)}}.empty-hof{text-align:center;color:var(--text-muted);padding:100px}.toolbox-container{width:100%;padding:30px}.toolbox-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;max-width:1000px;margin:0 auto;display:grid}.tool-card{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:15px;height:180px;transition:all .3s;display:flex;position:relative;overflow:hidden}.tool-card:hover:not(.locked){background:#fff;transform:translateY(-5px);box-shadow:0 12px 24px #00000014}.tool-card.locked{opacity:.6;filter:grayscale(.5);cursor:not-allowed}.tool-icon{background:#fffc;border-radius:20px;justify-content:center;align-items:center;width:64px;height:64px;display:flex;box-shadow:0 4px 12px #0000000d}.tool-name{font-size:16px;font-weight:700}.lock-badge{background:var(--text-main);color:#fff;border-radius:6px;align-items:center;gap:4px;padding:2px 8px;font-size:10px;font-weight:700;display:flex;position:absolute;top:10px;right:10px}.tool-tag{color:var(--text-muted);background:#0000000a;border-radius:4px;padding:2px 8px;font-size:10px}.random-select-view{flex-direction:column;align-items:center;gap:30px;padding:20px;display:flex}.lucky-name{color:var(--brand-color);text-shadow:0 4px 12px #6366f133;justify-content:center;align-items:center;min-height:72px;font-size:48px;font-weight:800;display:flex}.lucky-name.rolling{animation:.1s infinite pulse}.roll-btn{background:var(--brand-color);color:#fff;cursor:pointer;border:none;border-radius:50px;width:200px;padding:15px;font-size:18px;font-weight:800;transition:all .3s}.roll-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 8px 20px #6366f14d}.roll-btn:disabled{cursor:not-allowed;background:#cbd5e1}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}}.timer-view{flex-direction:column;align-items:center;gap:25px;padding:20px;display:flex}.timer-display{color:var(--text-main);background:#fff6;border-radius:20px;padding:10px 30px;font-family:monospace;font-size:72px;font-weight:800;box-shadow:inset 0 2px 8px #0000000d}.timer-presets{gap:12px;display:flex}.preset-btn{border:1px solid var(--glass-border);cursor:pointer;background:#fff;border-radius:10px;padding:8px 16px;font-weight:600;transition:all .2s}.preset-btn:hover{background:var(--brand-color);color:#fff}.timer-controls{gap:15px;display:flex}.control-btn{cursor:pointer;border:none;border-radius:15px;padding:12px 30px;font-weight:800;transition:all .2s}.control-btn.main{background:var(--brand-color);color:#fff;min-width:120px}.control-btn.reset{color:var(--text-muted);background:#f1f5f9}.control-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.settings-container{width:100%;max-width:1000px;min-height:600px;display:flex;overflow:hidden}.settings-sidebar{background:#00000005;border-right:1px solid #0000000d;flex-direction:column;gap:8px;width:200px;padding:20px;display:flex}.menu-item{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.menu-item:hover{color:var(--text-main);background:#00000008}.menu-item.active{color:var(--brand-color);background:#fff;box-shadow:0 4px 12px #0000000d}.settings-main{flex:1;padding:30px;overflow-y:auto}.settings-section h3{color:var(--text-main);margin-bottom:25px;font-size:20px}.info-grid{grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:40px;display:grid}.info-item{flex-direction:column;gap:8px;display:flex}.info-item label{color:var(--text-muted);font-size:12px;font-weight:600}.info-item span{color:var(--text-main);font-weight:700}.badge.amber{background:var(--accent-amber);color:#fff;border-radius:6px;width:fit-content;padding:2px 8px}.password-reset{background:#00000005;border-radius:16px;padding:20px}.password-reset h4{align-items:center;gap:8px;margin-bottom:15px;font-size:14px;display:flex}.inline-hint{margin-bottom:0}.pw-form{gap:12px;display:flex}.inline-action-row{align-items:center;gap:12px;display:flex}.inline-action-row.compact{width:min(100%,360px)}.section-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.add-btn{background:var(--accent-mint);color:#fff;cursor:pointer;border:none;border-radius:10px;align-items:center;gap:6px;padding:8px 16px;font-weight:600;display:flex}.class-rename{margin-bottom:30px}.input-group{gap:12px;margin-top:10px;display:flex}.confirm-btn.small{padding:8px 16px}.students-table-wrapper{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px #00000008}.students-table{border-collapse:collapse;text-align:left;width:100%}.students-table th{color:var(--text-muted);background:#00000005;padding:12px 16px;font-size:13px}.students-table td{border-top:1px solid #00000008;padding:12px 16px;font-size:14px}.empty-table-cell{text-align:center;color:var(--text-muted);padding:28px 16px}.actions{gap:8px;display:flex}.icon-btn{cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.icon-btn.blue{color:var(--brand-color);background:#6366f11a}.icon-btn.red{color:var(--accent-rose);background:#f43f5e1a}.icon-btn:hover{filter:brightness(.9)}.icon-btn:disabled{cursor:not-allowed;opacity:.4}.subsection{background:#00000003;border:1px solid #00000005;border-radius:20px;padding:20px}.subsection h4{margin-bottom:10px;font-size:16px}.hint{color:var(--text-muted);margin-bottom:20px;font-size:12px}.thresholds-grid{grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:20px;display:grid}.lv-input-box{text-align:center;flex-direction:column;gap:8px;display:flex}.lv-input-box label{color:var(--brand-color);font-size:11px;font-weight:800}.glass-input.small{text-align:center;padding:8px}.mt-30{margin-top:30px}.rules-list{flex-direction:column;gap:10px;display:flex}.rule-form-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;width:100%;display:grid}.rule-item{align-items:center;gap:15px;padding:12px 20px;display:flex}.r-icon{width:30px;font-size:20px}.r-name{flex:1;font-size:14px;font-weight:700}.r-stats{color:var(--text-muted);font-size:12px;font-weight:600}.system-tag{color:var(--brand-color);background:#6366f11a;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:700}.log-list{flex-direction:column;gap:8px;display:flex}.log-item{background:#fff;border-radius:12px;align-items:center;gap:15px;padding:12px 20px;font-size:13px;display:flex}.log-time{color:var(--text-muted);width:70px;font-family:monospace}.log-badge{color:var(--brand-color);background:#6366f11a;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:700}.log-detail{flex:1;font-weight:600}.log-user{color:var(--text-muted);font-size:11px}.empty-settings-state{color:var(--text-muted);text-align:center;background:#fff9;border-radius:18px;padding:32px;font-weight:600}@media (width<=960px){.settings-container{flex-direction:column}.settings-sidebar{flex-direction:row;width:100%;overflow-x:auto}.info-grid{grid-template-columns:1fr}.thresholds-grid{grid-template-columns:repeat(3,1fr)}.rule-form-grid{grid-template-columns:1fr 1fr}.stack-on-mobile{flex-direction:column;align-items:stretch}.student-selection-grid{grid-template-columns:1fr}}.app-container{flex-direction:column;align-items:center;min-height:100vh;padding:20px;display:flex}.main-nav{justify-content:space-between;align-items:center;width:100%;max-width:1000px;height:64px;margin-bottom:30px;padding:8px 16px;display:flex}.nav-left{align-items:center;display:flex}.class-selector-panel{position:relative}.class-selector{cursor:pointer;background:0 0;border:none;border-right:1px solid #0000000d;align-items:center;gap:10px;padding:6px 14px 6px 6px;display:flex}.class-icon{background:var(--accent-mint);border-radius:12px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.class-name{font-size:14px;font-weight:600}.arrow{transition:transform .3s}.arrow.open{transform:rotate(180deg)}.class-dropdown{z-index:20;flex-direction:column;gap:6px;min-width:220px;padding:10px;display:flex;position:absolute;top:calc(100% + 12px);left:0}.class-option{cursor:pointer;width:100%;color:var(--text-main);background:0 0;border:none;border-radius:14px;justify-content:space-between;align-items:center;padding:10px 12px;font-weight:600;transition:all .2s;display:flex}.class-option:hover{background:#0000000a}.class-option.active{color:var(--brand-color);background:#6366f11a}.class-option.create{border-top:1px solid #0000000f;justify-content:center;gap:8px;padding-top:12px}.class-option-tag{background:#fff;border-radius:999px;padding:2px 8px;font-size:11px}.nav-center{gap:8px;display:flex}.nav-tab{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:12px;align-items:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:500;transition:all .3s;display:flex}.nav-tab:hover{color:var(--text-main);background:#00000008}.nav-tab.active{background:var(--text-main);color:#fff}.nav-right{align-items:center;gap:15px;display:flex}.status-chip{color:var(--accent-mint);background:#10b9811f;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700}.user-profile{background:#00000008;border-radius:12px;align-items:center;gap:8px;padding:4px 8px;display:flex}.user-name{font-size:13px;font-weight:600}.user-level{background:var(--accent-amber);color:#fff;border-radius:6px;padding:2px 6px;font-size:10px;font-weight:800}.logout-btn{color:var(--accent-rose);cursor:pointer;background:0 0;border:none;align-items:center;padding:4px;display:flex}.batch-action{cursor:pointer;background:#fff;border:1px solid #0000000d;border-radius:50px;align-items:center;gap:6px;padding:6px 12px;font-size:13px;font-weight:600;display:flex;box-shadow:0 2px 8px #0000000d}.content-area{flex:1;justify-content:center;width:100%;max-width:1200px;display:flex}.app-error-banner{width:100%;max-width:1200px;color:var(--accent-rose);background:#f43f5e1f;border-radius:16px;margin-bottom:18px;padding:14px 18px;font-weight:700}.create-class-form{flex-direction:column;gap:20px;display:flex}.modal-footer{justify-content:flex-end;gap:12px;margin-top:10px;display:flex}.cancel-btn,.confirm-btn{cursor:pointer;border:none;border-radius:12px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.cancel-btn{color:var(--text-muted);background:0 0}.cancel-btn:hover{background:#0000000d}.confirm-btn{background:var(--accent-mint);color:#fff}.confirm-btn:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 12px #10b98133}.confirm-btn:active{transform:translateY(0)}.confirm-btn:disabled{cursor:wait;opacity:.7}@media (width<=960px){.main-nav{flex-direction:column;align-items:stretch;gap:16px;height:auto}.nav-center{flex-wrap:wrap;justify-content:center}.nav-right{flex-wrap:wrap;justify-content:space-between}.class-selector{border-right:none;justify-content:space-between;width:100%}.class-dropdown{width:100%;min-width:0}}.demo-view{text-align:center;margin-top:100px}