@import"https://fonts.googleapis.com/css2?family=Cascadia+Code:wght@400;700&family=Noto+Sans+SC:wght@400;700&display=swap";:root{--bg: #f5f0eb;--bg-dark: #2d2d2d;--card-bg: #ffffff;--card-inner: #fafaf7;--text: #2d2d2d;--text-dim: #888888;--text-light: #ffffff;--pink: #f8c3cd;--pink-dark: #ff6b9d;--green: #a8e6cf;--border: #2d2d2d;--border-light: #cccccc;--danger: #ff6b9d;--font: "Cascadia Code", "Noto Sans SC", monospace}[data-theme=dark]{--bg: #1a1a1a;--bg-dark: #2d2d2d;--card-bg: #2d2d2d;--card-inner: #242424;--text: #eee8dd;--text-dim: #aaaaaa;--text-light: #ffffff;--pink: #c9b1e8;--pink-dark: #a78bfa;--green: #6ee7f0;--border: #555555;--border-light: #444444;--danger: #e74c3c}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{font-family:var(--font);font-size:15px;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;transition:background .3s ease,color .3s ease}#app{min-height:100vh}a{color:inherit;text-decoration:none}.topbar{height:48px;background:var(--bg-dark);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:100}.topbar-title{color:var(--text-light);font-size:14px;font-weight:700;letter-spacing:1px;cursor:pointer;line-height:1.3;max-width:80px;text-align:left}.topbar-actions{display:flex;align-items:center;gap:12px}.theme-btn{width:30px;height:30px;border-radius:15px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid #888;font-family:inherit;font-size:14px;padding:0;background:var(--card-bg);color:var(--text)}.user-info{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative}.user-avatar{width:30px;height:30px;border-radius:15px;border:1.5px solid #888;object-fit:cover}.contribute-btn{padding:4px 12px;font-size:12px;font-weight:700;color:var(--text);background:var(--pink);border:1.5px solid var(--border);text-decoration:none;letter-spacing:1px}.contribute-btn:active{opacity:.8}.user-nick{font-size:13px;color:var(--text-light);max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-menu{position:absolute;top:110%;right:0;background:var(--card-bg);border:2px solid var(--border);min-width:120px;z-index:200}.menu-item{padding:8px 14px;font-size:13px;cursor:pointer;color:var(--text);display:block}.menu-item:hover{background:var(--pink)}.nav{display:flex;gap:0;padding:0;background:var(--card-bg);border-bottom:2px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch}.nav-item{flex-shrink:0;padding:8px 16px;font-size:13px;color:var(--text);text-decoration:none;border-right:1px solid var(--border-light);white-space:nowrap;transition:background .2s}.nav-item:hover{background:var(--card-inner)}.nav-item.router-link-active{background:var(--pink);font-weight:700}.content{padding:16px;max-width:640px;margin:0 auto;width:100%}.card{background:var(--card-bg);border:2px solid var(--border);margin-bottom:12px}.card-header{background:var(--bg-dark);padding:8px 14px;font-size:14px;font-weight:700;color:var(--text-light);letter-spacing:1px}.card-body{background:var(--card-inner);padding:14px}.card-header.pink{background:var(--pink);color:var(--text)}.card-header.green{background:var(--green);color:var(--text)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;font-size:13px;font-weight:700;border:2px solid var(--border);cursor:pointer;font-family:var(--font);letter-spacing:1px;transition:opacity .15s}.btn:active{opacity:.7}.btn-primary{background:var(--pink);color:var(--text)}.btn-primary:hover{opacity:.85}.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn-outline{background:var(--card-bg);color:var(--text)}.btn-outline:hover{background:var(--card-inner)}.btn-sm{padding:5px 10px;font-size:11px}.btn-block{display:flex;width:100%}input[type=text],input[type=password],input[type=number],textarea,.input{width:100%;padding:10px 12px;font-size:14px;border:2px solid var(--border);background:var(--card-bg);color:var(--text);font-family:var(--font);outline:none;transition:border-color .2s}input:focus,textarea:focus,.input:focus{border-color:var(--pink-dark)}input::placeholder,textarea::placeholder{color:var(--text-dim)}.label{display:block;font-size:12px;font-weight:700;color:var(--text-dim);margin-bottom:5px;letter-spacing:.5px}.form-group{margin-bottom:14px}.tag{display:inline-block;padding:2px 8px;font-size:10px;font-weight:700;border:1px solid var(--border);letter-spacing:.5px}.tag-pink{background:var(--pink);color:var(--text)}.tag-green{background:var(--green);color:var(--text)}.text-dim{color:var(--text-dim)}.text-center{text-align:center}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mb-12{margin-bottom:12px}.loading{display:flex;align-items:center;justify-content:center;padding:32px;color:var(--text-dim);gap:10px}.spinner{width:20px;height:20px;border:2px solid var(--border-light);border-top-color:var(--pink-dark);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:40px 20px;color:var(--text-dim)}.empty-state .icon{font-size:40px;margin-bottom:10px}.options-grid{display:flex;flex-wrap:wrap;gap:8px}.option-btn{padding:8px 14px;border:2px solid var(--border);background:var(--card-bg);color:var(--text);font-size:13px;cursor:pointer;font-family:var(--font);font-weight:700;transition:all .15s;white-space:nowrap}.option-btn:active{opacity:.7}.option-btn.selected{background:var(--pink);border-color:var(--border)}.option-btn.correct{background:var(--green);border-color:var(--border)}.option-btn.wrong{background:var(--danger);color:#fff;border-color:var(--danger)}.option-btn:disabled{opacity:.7;cursor:default}.tabs{display:flex;gap:0;margin-bottom:14px;border:2px solid var(--border)}.tab{flex:1;padding:8px 0;font-size:13px;font-weight:700;background:var(--card-bg);color:var(--text);cursor:pointer;font-family:var(--font);border:none;border-right:1px solid var(--border-light);letter-spacing:.5px;transition:background .2s}.tab:last-child{border-right:none}.tab.active{background:var(--pink)}.error-msg{color:var(--danger);font-size:12px;margin-top:8px;font-weight:700}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--pink);border-radius:0}
