:root{--bg:#fafafa;--text:#111;--text2:#666;--text3:#999;--accent:#45e3c6;--accent2:#3bc4a8;--white:#fff;--border:#e8e8e8;--red:#f5576c;--shadow:0 24px 64px #00000014;--radius:16px;--radius-sm:8px;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:var(--font);cursor:pointer;border:none}input{font-family:var(--font)}.navbar{z-index:100;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);background:#fafafaf2;padding:6px 0;position:fixed;top:0;left:0;right:0}.navbar-inner{justify-content:space-between;align-items:center;max-width:1100px;margin:0 auto;padding:0 24px;display:flex}.nav-logo{margin-top:-46px;margin-bottom:-46px}.nav-logo img{width:auto;height:100px;display:block}.nav-links{gap:4px;margin-left:24px;display:flex}.nav-links a{color:var(--text2);border-radius:var(--radius-sm);padding:8px 16px;font-size:14px;font-weight:500;transition:all .15s}.nav-links a:hover{color:var(--text);background:var(--bg)}.nav-links a.active{color:var(--text);background:#45e3c61f;font-weight:600}.nav-right{align-items:center;gap:12px;display:flex}.nav-avatar{background:var(--accent);border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:flex}.nav-name{font-size:14px;font-weight:600}.btn-sm{border-radius:var(--radius-sm);border:2px solid var(--border);color:var(--text2);background:0 0;padding:4px 12px;font-size:12px;font-weight:600;transition:all .15s}.btn-sm:hover{border-color:var(--accent);color:var(--accent2)}.footer{border-top:1px solid var(--border);color:var(--text3);background:var(--bg);justify-content:space-between;align-items:center;padding:10px 24px;font-size:12px;display:flex}.footer a{color:var(--text3)}.footer a:hover{color:var(--text)}.app-layout{flex-direction:column;min-height:100vh;padding-top:54px;display:flex}.main-content{flex:1}.container{max-width:1100px;margin:0 auto;padding:24px}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.btn-primary{background:var(--accent);color:var(--text)}.btn-primary:hover{background:var(--accent2);transform:translateY(-1px)}.btn-outline{border:2px solid var(--border);color:var(--text2);background:0 0}.btn-outline:hover{border-color:var(--accent);color:var(--text)}.auth-page{background-image:radial-gradient(at 20%,#45e3c614 0%,#0000 50%),radial-gradient(at 80%,#45e3c60d 0%,#0000 50%);justify-content:center;align-items:center;min-height:100vh;display:flex}.auth-card{background:var(--white);box-shadow:var(--shadow);border:1px solid var(--border);border-radius:32px;width:100%;max-width:420px;padding:48px 40px}.auth-title{text-align:center;margin-bottom:8px;font-size:28px;font-weight:800}.auth-subtitle{color:var(--text3);text-align:center;margin-bottom:36px;font-size:15px}.form-group{margin-bottom:20px}.form-label{color:var(--text2);margin-bottom:8px;font-size:13px;font-weight:600;display:block}.form-input{background:var(--bg);border:2px solid var(--border);border-radius:var(--radius-sm);outline:none;width:100%;padding:14px 16px;font-size:15px;transition:all .2s}.form-input:focus{border-color:var(--accent);background:var(--white);box-shadow:0 0 0 4px #45e3c61a}.form-input.error{border-color:var(--red)}.field-error{color:var(--red);margin-top:4px;font-size:12px}.btn-submit{background:var(--accent);width:100%;color:var(--text);border-radius:var(--radius-sm);margin-top:8px;padding:15px;font-size:16px;font-weight:700;transition:all .2s}.btn-submit:hover:not(:disabled){background:var(--accent2);transform:translateY(-1px)}.btn-submit:disabled{opacity:.6;cursor:not-allowed}.auth-footer{text-align:center;color:var(--text3);margin-top:28px;font-size:14px}.auth-footer a{color:var(--accent2);font-weight:600}.auth-footer a:hover{color:var(--text)}.alert{border-radius:var(--radius-sm);margin-bottom:20px;padding:12px 16px;font-size:13px;font-weight:500}.alert-error{color:var(--red);background:#f5576c14;border:1px solid #f5576c33}.alert-success{color:#2d8a6e;background:#45e3c614;border:1px solid #45e3c633}.hero{align-items:center;min-height:calc(100vh - 54px);display:flex}.hero-title{letter-spacing:-.03em;font-size:72px;font-weight:800;line-height:1.1}.hero-text{color:var(--text2);max-width:500px;margin:24px 0 32px;font-size:18px;line-height:1.7}.hero-image{width:calc(100% + 40px);margin-left:-20px}.stats-row{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px;display:grid}.stat-card{background:var(--white);border-radius:var(--radius);border:1px solid var(--border);padding:20px 24px}.stat-card .label{color:var(--text3);text-transform:uppercase;font-size:12px}.stat-card .value{margin-top:4px;font-size:32px;font-weight:800}.section-title{margin-bottom:20px;font-size:20px;font-weight:700}.class-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;display:grid}.class-card{background:var(--white);border-radius:var(--radius);border:1px solid var(--border);cursor:pointer;padding:24px;transition:all .2s}.class-card:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)}.class-card .name{margin-bottom:6px;font-size:18px;font-weight:700}.class-card .meta{color:var(--text3);gap:16px;font-size:13px;display:flex}.class-card .code{background:var(--bg);color:var(--text2);border-radius:20px;margin-top:12px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-block}.tabs{background:var(--white);border-radius:var(--radius);border:1px solid var(--border);gap:4px;margin-bottom:24px;padding:4px;display:flex}.tab{text-align:center;cursor:pointer;color:var(--text2);background:0 0;border-radius:12px;flex:1;padding:12px;font-size:14px;font-weight:600;transition:all .15s}.tab.active{background:var(--accent);color:var(--text)}.rank-list{flex-direction:column;gap:8px;display:flex}.rank-item{background:var(--white);border-radius:var(--radius);border:1px solid var(--border);align-items:center;gap:16px;padding:16px 20px;display:flex}.rank-num{background:var(--bg);border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;font-weight:800;display:flex}.rank-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:16px;font-weight:700;display:flex}.rank-name{flex:1;font-size:15px;font-weight:600}.sticker-grid{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.sticker-btn{border:2px solid var(--border);background:var(--white);cursor:pointer;text-align:center;border-radius:12px;min-width:80px;padding:12px 18px;transition:all .15s}.sticker-btn:hover{transform:translateY(-2px)}.sticker-btn.reward{border-color:#45e3c64d}.sticker-btn.reward:hover{border-color:var(--accent)}.sticker-btn.penalty{border-color:#f5576c4d}.sticker-btn.penalty:hover{border-color:var(--red)}.sticker-emoji{margin-bottom:4px;font-size:28px;display:block}.sticker-name{color:var(--text2);font-size:11px;font-weight:600}.sticker-point{font-size:14px;font-weight:800}.member-list{flex-direction:column;gap:4px;display:flex}.member-item{background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;align-items:center;gap:12px;padding:12px 16px;transition:all .15s;display:flex}.member-item:hover{border-color:var(--accent)}.member-item.selected{border-color:var(--accent);background:#45e3c60f}.activity-item{background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--border);align-items:center;gap:12px;padding:12px 16px;display:flex}.activity-emoji{text-align:center;min-width:32px;font-size:20px}.activity-info{flex:1}.activity-info .atitle{font-size:14px;font-weight:600}.activity-info .atime{color:var(--text3);font-size:12px}.activity-point{font-size:15px;font-weight:700}.info-bar{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);color:var(--text2);flex-wrap:wrap;gap:24px;margin-bottom:24px;padding:16px 20px;font-size:13px;display:flex}.info-bar strong{color:var(--text)}.modal-overlay{z-index:200;background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--white);border-radius:var(--radius);width:90%;max-width:440px;padding:32px}.modal h3{margin-bottom:20px;font-size:20px;font-weight:700}.empty{text-align:center;color:var(--text3);padding:48px}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:24px;height:24px;margin:40px auto;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toast{border-radius:var(--radius-sm);z-index:300;padding:12px 20px;font-size:14px;font-weight:600;animation:.3s slideIn;position:fixed;top:64px;right:24px}.toast-success{color:var(--accent2);background:#45e3c61a;border:1px solid #45e3c633}.toast-error{color:var(--red);background:#f5576c1a;border:1px solid #f5576c33}@keyframes slideIn{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}.badge{border-radius:12px;padding:3px 10px;font-size:11px;font-weight:600}.badge-green{color:var(--accent2);background:#45e3c626}.text-green{color:var(--accent2)}.text-red{color:var(--red)}.text-muted{color:var(--text3)}.text-center{text-align:center}.mt-2{margin-top:8px}.gap-8{gap:8px}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}