:root{--bg: #07070f;--surface: #0c0c18;--card: #131420;--card-solid: #131420;--card-hover: #181928;--primary: #6366f1;--primary-hover:#4f46e5;--primary-rgb: 99,102,241;--secondary: #8b5cf6;--accent: #a855f7;--cyan: #06b6d4;--pink: #ec4899;--success: #10b981;--success-dark: #059669;--error: #ef4444;--error-rgb: 239,68,68;--error-dark: #dc2626;--warning: #f59e0b;--text: #f1f1f8;--text-sub: #a1a1b5;--muted: #6b6b80;--border: #1e1f32;--border-solid: #1e1f32;--radius: 14px;--radius-sm: 10px;--radius-lg: 20px;--topbar-h: 56px;--grad: linear-gradient(135deg,#6366f1,#8b5cf6);--grad-text: linear-gradient(135deg,#818cf8 0%,#a78bfa 50%,#c084fc 100%)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Inter,Noto Sans Thai,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:15px;line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;position:relative;overflow-x:hidden;padding-top:56px}.topbar,main,#app,.gm-page{position:relative;z-index:1}a{color:var(--primary);text-decoration:none;transition:color .2s}a:hover{color:#a78bfa}.topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-h);background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 28px;gap:16px;z-index:100}.logo{font-size:17px;font-weight:800;color:var(--text);text-decoration:none;letter-spacing:-.5px;display:flex;align-items:center;gap:9px}.logo-dot{width:8px;height:8px;background:var(--primary);border-radius:50%;flex-shrink:0}.logo:hover{color:#a78bfa}.topbar-nav{display:flex;align-items:center;gap:2px;flex:1}.topbar-right{display:flex;align-items:center;gap:10px;flex-shrink:0}.nav-link{color:var(--muted);text-decoration:none;padding:6px 13px;border-radius:8px;font-size:13.5px;font-weight:500;transition:all .2s;letter-spacing:.01em}.nav-link:hover{color:var(--text);background:#ffffff0f}.user-link{color:var(--text);font-weight:600}.streak-badge{background:#fb923c1a;color:#fb923c;border:1px solid rgba(251,146,60,.25);padding:4px 11px;border-radius:999px;font-size:12px;font-weight:600}.xp-badge{background:rgba(var(--primary-rgb),.1);color:#a5b4fc;border:1px solid rgba(var(--primary-rgb),.25);padding:4px 11px;border-radius:999px;font-size:12px;font-weight:600}.guest-badge{font-size:12px;color:var(--muted);background:#ffffff0a;border:1px solid var(--border);border-radius:999px;padding:4px 12px}.btn-primary{display:inline-flex;align-items:center;justify-content:center;background:var(--primary);color:#fff;padding:10px 24px;border-radius:var(--radius-sm);font-weight:700;font-size:14.5px;border:none;cursor:pointer;text-decoration:none;transition:background .2s,transform .15s,box-shadow .2s;letter-spacing:.01em}.btn-primary:hover{color:#fff;background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 6px 20px #6366f159}.btn-primary:active{transform:translateY(0) scale(.98)}.btn-primary.btn-lg{padding:14px 36px;font-size:16px;border-radius:var(--radius)}.btn-primary.btn-full{width:100%;margin-top:8px}.btn-primary.btn-sm{padding:6px 14px;font-size:13px;border-radius:8px}.btn-outline{display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--muted);padding:10px 24px;border-radius:var(--radius-sm);font-weight:500;font-size:14.5px;border:1px solid var(--border);cursor:pointer;text-decoration:none;transition:all .2s}.btn-outline:hover{border-color:rgba(var(--primary-rgb),.5);color:#a5b4fc;background:rgba(var(--primary-rgb),.06)}.btn-outline.btn-lg{padding:14px 36px;font-size:16px;border-radius:var(--radius)}.btn-outline.btn-sm{padding:6px 14px;font-size:13px}.btn-ghost{width:100%;background:transparent;color:var(--muted);border:1px dashed rgba(255,255,255,.12);border-radius:var(--radius-sm);padding:11px;font-size:14px;cursor:pointer;transition:all .2s;font-family:inherit}.btn-ghost:hover{border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc;background:rgba(var(--primary-rgb),.05)}.btn-sm{font-size:13px;padding:6px 14px}.form-group{margin-bottom:18px}.form-group label{display:block;margin-bottom:7px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.7px}input[type=text],input[type=email],input[type=password],input[type=range],textarea{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;color:var(--text);font-size:15px;font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s}input[type=range]{padding:6px 0}input:focus,textarea:focus{border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}.alert-error{background:#ef444414;border:1px solid rgba(239,68,68,.25);color:#fca5a5;padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:18px}.auth-body{display:flex;flex-direction:column}.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:80px 24px 40px;min-height:100vh}.auth-card{width:100%;max-width:420px;background:var(--card);border:1px solid var(--border);border-radius:24px;padding:44px 40px;box-shadow:0 24px 80px #0006;text-align:center}.auth-card .auth-form,.auth-card .auth-form *,.auth-card .alert-error{text-align:left}.auth-logo{text-align:center;font-size:15px;font-weight:800;letter-spacing:-.3px;margin-bottom:6px;color:var(--primary)}.auth-title{text-align:center;font-size:26px;font-weight:800;margin-bottom:30px;letter-spacing:-.5px}.auth-form{margin-top:8px}.auth-switch{text-align:center;color:var(--muted);font-size:14px;margin-top:22px}.auth-switch a{color:#a5b4fc;font-weight:600}.auth-divider{display:flex;align-items:center;gap:12px;margin:22px 0 6px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.5px}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--border)}main{padding-top:var(--topbar-h)}.container{max-width:900px;margin:0 auto;padding:0 24px}.section-title{font-size:24px;font-weight:800;margin-bottom:24px;letter-spacing:-.5px}.accent{color:var(--primary)}.hidden{display:none!important}.loading{color:var(--muted);padding:40px;text-align:center}.grad-text{background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glass-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg)}.hub-main{padding:64px 24px 80px;max-width:820px;margin:0 auto}.hub-hero{margin-bottom:60px;position:relative}.hub-hero-tag{display:inline-block;font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}.hub-welcome{font-size:14px;color:var(--muted);margin-bottom:10px;font-weight:500}.hub-name{font-size:52px;font-weight:900;letter-spacing:-2px;margin-bottom:12px;line-height:1.05;color:var(--text)}.hub-bio{color:var(--text-sub);font-size:17px;margin-bottom:28px;line-height:1.6}.hub-auth{display:flex;gap:14px;margin-top:8px;flex-wrap:wrap}.hub-user-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.stat-pill{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:8px 16px;font-size:13px;transition:border-color .2s}.stat-pill:hover{border-color:rgba(var(--primary-rgb),.4)}.stat-pill-label{color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.stat-pill strong{color:var(--text);font-weight:800}.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.hub-card{display:flex;align-items:center;gap:18px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;text-decoration:none;color:var(--text);transition:border-color .2s,transform .2s,box-shadow .2s,background .2s;cursor:pointer}.hub-card:hover{border-color:rgba(var(--primary-rgb),.35);background:var(--card-hover);transform:translateY(-2px);box-shadow:0 8px 32px #00000040}.hub-card--lang:hover{border-color:#6366f166}.hub-card--code:hover{border-color:#10b98166}.hub-card--tools:hover{border-color:#f59e0b66}.hub-card--arcade:hover{border-color:#ec489966}.hub-card--forum:hover{border-color:#06b6d466}.hub-card-body{flex:1}.hub-card-body h2{font-size:16px;font-weight:700;margin-bottom:4px;letter-spacing:-.2px}.hub-card-body p{font-size:13px;color:var(--muted);line-height:1.5}.hub-card-arrow{color:var(--muted);flex-shrink:0;font-size:20px;transition:all .2s}.hub-card:hover .hub-card-arrow{color:var(--text);transform:translate(3px)}.portfolio-lock{position:fixed;bottom:20px;right:20px;font-size:14px;opacity:.15;text-decoration:none;transition:opacity .2s;line-height:1}.portfolio-lock:hover{opacity:.45}.gate-wrap{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - var(--topbar-h))}.gate-card{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:52px 44px;width:100%;max-width:380px;text-align:center;box-shadow:0 24px 80px #0006}.gate-icon{font-size:2.8rem;margin-bottom:14px}.gate-title{font-size:1.6rem;font-weight:800;margin:0 0 8px;letter-spacing:-.5px}.gate-sub{color:var(--muted);font-size:14px;margin:0 0 30px}.gate-form{display:flex;flex-direction:column;gap:12px}.gate-input{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 18px;font-size:16px;color:var(--text);font-family:inherit;text-align:center;letter-spacing:.15em;outline:none;transition:border-color .2s,box-shadow .2s}.gate-input:focus{border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}.gate-input--err{border-color:#ef4444}.gate-error{color:#fca5a5;font-size:13px;margin:0}.section-header{margin-bottom:36px}.section-header h1{font-size:34px;font-weight:900;margin-bottom:8px;letter-spacing:-1px;color:var(--text)}.section-sub{color:var(--muted);font-size:14px;line-height:1.7}.auth-gate{background:#ffffff05;border:1px solid var(--border);border-radius:var(--radius);padding:30px;text-align:center;margin-bottom:32px;color:var(--muted)}.hobby-section{margin-bottom:44px}.hobby-section h2{font-size:20px;font-weight:800;margin-bottom:16px;letter-spacing:-.3px}.tool-section{margin-bottom:32px}.tool-cat{font-size:12px;font-weight:700;color:var(--text-sub);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border)}.hobby-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.hobby-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;transition:all .2s}.hobby-card:hover{border-color:rgba(var(--primary-rgb),.25);transform:translateY(-2px)}.hobby-card--dim{opacity:.55}.hobby-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.hobby-card-media{font-size:36px;margin-bottom:10px;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}.hobby-card h3{font-size:16px;font-weight:700;margin-bottom:6px}.hobby-card p{font-size:13px;color:var(--muted);line-height:1.5;margin-bottom:12px}.hobby-meta{font-size:12px;color:var(--muted)}.hobby-tag{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;background:#6c63ff26;color:#a5b4fc}.tag-web{background:#6c63ff26;color:#a78bfa}.tag-bot{background:#10b98126;color:#34d399}.hobby-status{font-size:12px;color:var(--muted)}.status-live{color:#34d399}.status-wip{color:#fbbf24}.status-plan{color:var(--muted)}.hobby-stack{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.hobby-stack span{font-size:11px;padding:3px 8px;border-radius:999px;background:#ffffff0d;color:var(--muted)}.skills-section{margin-top:44px}.skills-section h2{font-size:20px;font-weight:800;margin-bottom:16px}.skills-grid{display:flex;flex-wrap:wrap;gap:10px}.skill-chip{padding:8px 18px;border:1px solid var(--border);border-radius:999px;font-size:13.5px;font-weight:500;background:var(--card);transition:border-color .2s,color .2s}.skill-chip:hover{border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc}.portfolio-section{margin-bottom:44px}.portfolio-card{display:flex;align-items:center;gap:28px;background:var(--card);border:1px solid var(--border);border-radius:20px;padding:30px 26px}.portfolio-avatar{font-size:60px;flex-shrink:0}.portfolio-info{flex:1}.portfolio-name{font-size:28px;font-weight:900;margin-bottom:6px;letter-spacing:-.5px}.portfolio-bio{font-size:14px;color:var(--muted);margin-bottom:18px}.portfolio-links{display:flex;flex-wrap:wrap;gap:10px}.portfolio-link{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:14px;font-weight:500;transition:border-color .2s,color .2s}.portfolio-link:hover{border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc}.portfolio-link--discord:hover{border-color:#7289da80;color:#7289da}.landing{padding:0}.hero{padding:100px 24px 90px;text-align:center;position:relative}.hero-content{max-width:720px;margin:0 auto}.hero h1{font-size:58px;font-weight:900;line-height:1.1;margin-bottom:22px;letter-spacing:-2px;color:var(--text)}.hero-sub{font-size:18px;color:var(--text-sub);margin-bottom:40px;line-height:1.7}.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.lang-preview{padding:60px 24px;max-width:1000px;margin:0 auto}.lang-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.lang-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:30px 26px;transition:border-color .2s,transform .2s,box-shadow .2s}.lang-card:hover{border-color:rgba(var(--primary-rgb),.4);transform:translateY(-3px);box-shadow:0 12px 32px #00000040}.lang-card--featured{border-color:#6366f159;background:#6366f10d}.lang-flag{font-size:46px;margin-bottom:14px;display:block}.lang-card h3{font-size:20px;font-weight:800;margin-bottom:5px;letter-spacing:-.3px}.lang-card p{color:var(--muted);margin-bottom:12px;font-size:14px}.lang-meta{font-size:12px;color:#a5b4fc;margin-bottom:12px;font-weight:600}.lang-tags{display:flex;flex-wrap:wrap;gap:6px}.lang-tags span{background:#ffffff0d;padding:3px 10px;border-radius:999px;font-size:12px;color:var(--muted)}.features{padding:60px 24px;max-width:1000px;margin:0 auto;text-align:center}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:36px}.feature-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:32px 22px;transition:border-color .2s,transform .2s}.feature-card:hover{transform:translateY(-4px);border-color:rgba(var(--primary-rgb),.3);box-shadow:0 12px 40px #6366f11a}.feature-icon{font-size:38px;margin-bottom:16px;display:block}.feature-card h3{font-size:17px;font-weight:800;margin-bottom:10px}.feature-card p{color:var(--muted);font-size:14px;line-height:1.6}.cta{padding:90px 24px;text-align:center}.cta h2{font-size:36px;font-weight:900;margin-bottom:14px;letter-spacing:-1px}.cta p{color:var(--muted);margin-bottom:30px;font-size:16px}.home-main{padding:calc(var(--topbar-h) + 36px) 24px 60px;max-width:820px;margin:0 auto}.home-greeting{margin-bottom:24px}.home-greeting h1{font-size:32px;font-weight:900;margin-bottom:5px;letter-spacing:-.5px}.home-username{color:var(--primary)}.home-sub{color:var(--muted);font-size:15px}.home-stats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}.xp-bar-wrap{height:8px;background:#ffffff0f;border-radius:999px;overflow:hidden;margin-bottom:6px}.xp-bar-fill{height:100%;background:var(--grad);border-radius:999px;transition:width .5s ease}.xp-bar-label{font-size:12px;color:var(--muted);margin-bottom:36px}.lang-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.lhub-cats{display:flex;flex-direction:column;gap:12px;margin-bottom:36px}.lhub-cat{position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;padding:20px 22px;background:var(--card);border:1px solid var(--border);border-left:3px solid transparent;border-radius:16px;cursor:pointer;text-align:left;transition:all .22s;color:var(--text);width:100%}.lhub-cat-bg{position:absolute;inset:0;opacity:0;transition:opacity .3s;pointer-events:none}.lhub-cat--lang{border-left-color:var(--primary)}.lhub-cat--math{border-left-color:var(--warning)}.lhub-cat--code{border-left-color:var(--success)}.lhub-cat--lang .lhub-cat-bg{background:linear-gradient(135deg,#6366f11a,#8b5cf60f)}.lhub-cat--math .lhub-cat-bg{background:linear-gradient(135deg,#f59e0b1a,#fbbf240f)}.lhub-cat--code .lhub-cat-bg{background:linear-gradient(135deg,#10b9811a,#34d3990f)}.lhub-cat:hover .lhub-cat-bg{opacity:1}.lhub-cat:hover{transform:translate(4px);box-shadow:0 8px 28px #0000002e}.lhub-cat-icon{font-size:40px;line-height:1;flex-shrink:0}.lhub-cat-info{flex:1;min-width:0}.lhub-cat-name{font-size:19px;font-weight:800;letter-spacing:-.3px}.lhub-cat-sub{font-size:13px;color:var(--muted);margin-top:3px}.lhub-cat-count{font-size:11px;font-weight:700;margin-top:7px}.lhub-cat--lang .lhub-cat-count{color:var(--primary)}.lhub-cat--math .lhub-cat-count{color:var(--warning)}.lhub-cat--code .lhub-cat-count{color:var(--success)}.lhub-cat-arrow{font-size:18px;color:var(--muted);transition:transform .22s,color .22s}.lhub-cat:hover .lhub-cat-arrow{transform:translate(5px);color:var(--text)}.lhub-content{animation:fadeIn .2s ease}.lhub-content-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}.lhub-content-head h2{font-size:22px;font-weight:800;letter-spacing:-.3px}.lhub-lang-grid{display:flex;flex-direction:column;gap:10px}.lhub-lang-card{display:flex;align-items:center;gap:16px;padding:16px 18px;background:var(--card);border:1px solid var(--border);border-radius:14px;text-decoration:none;color:var(--text);transition:all .2s}.lhub-lang-card:hover{background:rgba(var(--primary-rgb),.06);border-color:rgba(var(--primary-rgb),.22);transform:translate(4px);box-shadow:0 6px 24px #00000026;color:var(--text)}.lhub-lang-flag{flex-shrink:0}.lhub-lang-flag img{border-radius:4px;display:block}.lhub-lang-flag--emoji{font-size:2.6rem;line-height:1}.lhub-lang-body{flex:1;min-width:0}.lhub-lang-name{font-size:16px;font-weight:800;margin-bottom:3px}.lhub-lang-desc{font-size:13px;color:var(--muted);margin-bottom:8px}.lhub-lang-cta{font-size:13px;font-weight:700;color:var(--primary);flex-shrink:0;transition:transform .2s;white-space:nowrap}.lhub-lang-card:hover .lhub-lang-cta{transform:translate(4px)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.cat-back-btn{background:#ffffff0a;border:1px solid rgba(255,255,255,.09);border-radius:10px;color:var(--muted);font-size:14px;padding:7px 15px;cursor:pointer;transition:all .15s}.cat-back-btn:hover{background:#ffffff14;color:var(--text)}.lang-levels{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}.lang-level-chip{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:#ffffff0f}.lv-green{color:var(--success)}.lv-blue{color:#3b82f6}.lv-amber{color:var(--warning)}.lv-red{color:var(--error)}.lv-purple{color:var(--accent)}.placement-banner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:rgba(var(--primary-rgb),.06);border:1px solid rgba(var(--primary-rgb),.2);border-radius:14px;padding:14px 20px;margin-bottom:22px}.placement-banner span{font-size:14px;color:var(--muted)}.placement-banner-links{display:flex;gap:8px}.placement-banner-btn{font-size:13px;font-weight:600;color:#a5b4fc;background:rgba(var(--primary-rgb),.1);border:1px solid rgba(var(--primary-rgb),.25);border-radius:8px;padding:5px 14px;text-decoration:none;transition:all .15s}.placement-banner-btn:hover{background:rgba(var(--primary-rgb),.18)}.home-hero{margin-bottom:36px}.greeting{font-size:34px;font-weight:900;margin-bottom:6px;letter-spacing:-.5px}.greeting-sub{color:var(--muted);font-size:16px}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:28px}.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px 18px;text-align:center;transition:border-color .2s,transform .2s}.stat-card:hover{border-color:rgba(var(--primary-rgb),.25);transform:translateY(-2px)}.stat-icon{font-size:30px;margin-bottom:8px}.stat-value{font-size:30px;font-weight:900;color:var(--text);letter-spacing:-.5px}.stat-label{font-size:11px;color:var(--muted);margin-top:4px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.xp-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:40px}.xp-label{display:flex;justify-content:space-between;font-size:14px;font-weight:600;margin-bottom:10px;color:var(--muted)}.xp-bar-wrap{height:10px;background:#ffffff0f;border-radius:999px;overflow:hidden}.xp-bar{height:100%;background:var(--grad);border-radius:999px;transition:width .6s ease}.xp-hint{font-size:12px;color:var(--muted);margin-top:8px;text-align:right}.lang-select{margin-bottom:44px}.lang-select-grid{display:flex;flex-direction:column;gap:12px}.lang-select-card{display:flex;align-items:center;gap:22px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;text-decoration:none;color:var(--text);transition:border-color .2s,background .2s,transform .15s}.lang-select-card:hover{border-color:rgba(var(--primary-rgb),.35);background:rgba(var(--primary-rgb),.04);color:var(--text);transform:translate(4px)}.ls-flag{font-size:38px;flex-shrink:0}.ls-info{flex:1}.ls-info h3{font-size:18px;font-weight:700;margin-bottom:2px}.ls-info p{font-size:13px;color:var(--muted)}.ls-arrow{font-size:22px;color:#a5b4fc;flex-shrink:0}.learn-main{padding:28px 24px 60px;max-width:800px;margin:0 auto}.lang-header{display:flex;align-items:center;gap:16px;margin-bottom:32px}.page-back{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;text-decoration:none;color:var(--text-sub);border:1px solid var(--border);background:var(--card);flex-shrink:0;transition:color .15s,border-color .15s,background .15s}.page-back:hover{color:var(--text);border-color:rgba(var(--primary-rgb),.4);background:var(--card-hover)}[data-theme=light] .page-back{background:rgba(var(--primary-rgb),.06);border-color:rgba(var(--primary-rgb),.3)}.lang-title-text{flex:1;font-size:26px;font-weight:800;letter-spacing:-.5px}.level-section{margin-bottom:40px}.level-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}.level-badge{font-size:12px;font-weight:800;letter-spacing:.08em;padding:4px 12px;border-radius:999px;background:#6c63ff26;color:#a5b4fc;border:1px solid rgba(108,99,255,.3)}.level-badge--a1,.level-badge--a2{background:#10b9811f;color:#10b981;border-color:#10b9814d}.level-badge--b1,.level-badge--b2{background:#f59e0b1f;color:#f59e0b;border-color:#f59e0b4d}.level-badge--c1,.level-badge--c2{background:#ef44441f;color:#ef4444;border-color:#ef44444d}.level-badge--n5,.level-badge--hsk1{background:#10b9811f;color:#10b981;border-color:#10b9814d}.level-badge--n4,.level-badge--hsk2{background:#3b82f61f;color:#3b82f6;border-color:#3b82f64d}.level-badge--n3,.level-badge--hsk3{background:#f59e0b1f;color:#f59e0b;border-color:#f59e0b4d}.level-badge--n2,.level-badge--n1,.level-badge--hsk4,.level-badge--hsk5,.level-badge--hsk6{background:#ef44441f;color:#ef4444;border-color:#ef44444d}.level-desc{font-size:13px;color:var(--muted)}.unit-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px 24px;margin-bottom:14px}.unit-header{display:flex;align-items:center;gap:14px;margin-bottom:14px}.unit-icon{font-size:30px;flex-shrink:0}.unit-title{font-size:17px;font-weight:700}.unit-desc{font-size:13px;color:var(--muted);margin-top:2px}.lesson-list{display:flex;flex-direction:column;gap:6px}.lesson-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;text-decoration:none;color:var(--text);transition:all .15s;border:1px solid transparent}.lesson-item.unlocked{background:#ffffff05;cursor:pointer}.lesson-item.unlocked:hover{background:rgba(var(--primary-rgb),.08);border-color:rgba(var(--primary-rgb),.2)}.lesson-item.completed{background:#10b9810f;border-color:#10b98126}.lesson-item.locked{opacity:.35;cursor:not-allowed}.lesson-icon{font-size:15px;flex-shrink:0;width:22px;text-align:center}.lesson-title{flex:1;font-size:14px;font-weight:500}.lesson-xp{font-size:11px;color:var(--primary);font-weight:700;flex-shrink:0}.lesson-body{background:var(--bg);min-height:100vh;display:flex;flex-direction:column}.lesson-body.exercise-mode{overflow:hidden;height:100vh}#lesson-container{display:flex;flex-direction:column;min-height:100vh;max-width:680px;margin:0 auto;width:100%;padding:0 20px}.exercise-mode #lesson-container{height:100vh;min-height:unset;overflow:hidden}#lesson-header{display:flex;align-items:center;gap:14px;padding:16px 0;flex-shrink:0}#exit-btn{background:none;border:none;color:var(--muted);font-size:20px;cursor:pointer;padding:4px;line-height:1;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}#exit-btn:hover{background:#ffffff14;color:var(--text)}#progress-bar-wrap{flex:1;height:8px;background:#ffffff12;border-radius:999px;overflow:hidden}#progress-bar{height:100%;background:var(--grad);border-radius:999px;width:0%;transition:width .4s ease}#progress-text{font-size:13px;color:var(--muted);font-weight:600;flex-shrink:0;min-width:40px;text-align:right}#intro-screen{flex:1;overflow-y:visible;padding:12px 0 24px}.intro-card{text-align:center;padding-bottom:8px}.intro-card h2{font-size:22px;font-weight:800;margin-bottom:6px}.intro-sub{font-size:14px;color:var(--muted);margin-bottom:22px}.intro-note-section{text-align:left;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px 22px;margin-bottom:14px}.intro-note-header{font-size:11px;font-weight:700;color:#a5b4fc;margin-bottom:12px;letter-spacing:.08em;text-transform:uppercase}.intro-note-body{font-size:13px;line-height:1.75;color:var(--text)}.intro-note-cultural{color:var(--muted);font-style:italic}.gn-header{font-weight:700;color:var(--text);font-size:13px;margin:10px 0 4px;border-left:3px solid var(--primary);padding-left:8px}.gn-item{display:flex;gap:8px;align-items:baseline;margin:5px 0}.gn-dot{color:#a5b4fc;font-size:10px;flex-shrink:0;line-height:2}.gn-item-text{color:var(--text-sub);font-size:13px;line-height:1.65}.gn-text{color:var(--muted);font-size:13px;line-height:1.65;margin:3px 0}.gn-spacer{height:6px}.vocab-section-hdr{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:10px;text-align:left;text-transform:uppercase;letter-spacing:.06em}.vocab-section{margin-bottom:24px;overflow-x:auto}.vocab-table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}.vocab-table thead th{padding:8px 12px;color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border)}.vocab-table tbody tr{transition:background .1s}.vocab-table tbody tr:hover{background:#ffffff06}.vocab-table td{padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.04);vertical-align:middle}.vocab-word{font-size:20px;font-weight:700;color:var(--text);letter-spacing:-.01em}.vocab-reading{font-size:12px;color:#a5b4fc;font-family:JetBrains Mono,monospace}.vocab-meaning{font-size:14px;color:var(--muted)}#flashcard-screen{flex:1;display:flex;flex-direction:column}.fc-topbar{display:flex;justify-content:flex-end;padding:4px 0 8px}.fc-skip{background:none;border:none;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:color .15s;padding:6px 0}.fc-skip:hover{color:var(--text)}.fc-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 0 24px}.fc-meta{width:100%;max-width:480px;display:flex;align-items:center;gap:12px;margin-bottom:20px}.fc-counter{font-size:12px;color:var(--muted);font-weight:600;flex-shrink:0;min-width:44px}.fc-prog-wrap{flex:1;height:4px;background:#ffffff12;border-radius:2px;overflow:hidden}.fc-prog-bar{height:100%;background:var(--grad);border-radius:2px;transition:width .4s ease}.fc-card{width:100%;max-width:480px;background:var(--card);border:1px solid var(--border);border-radius:24px;padding:40px 34px;text-align:center;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:20px}.fc-lang{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:12px}.fc-word{font-size:46px;font-weight:900;color:var(--text);line-height:1.2;margin-bottom:6px;letter-spacing:-.02em}.fc-reading{font-size:16px;color:#a5b4fc;font-family:JetBrains Mono,monospace;min-height:22px}.fc-divider{width:40px;height:2px;background:#ffffff14;border-radius:1px;margin:18px auto}.fc-meaning{font-size:20px;font-weight:600;color:var(--text-sub);line-height:1.4}.fc-actions{display:flex;flex-direction:column;gap:10px;width:100%;max-width:480px}.fc-btn{width:100%;padding:14px;font-size:16px;font-weight:700;border-radius:var(--radius)}.fc-tip{font-size:12px;color:var(--muted);margin-top:10px;text-align:center;min-height:18px}#exercise-area{flex:1;display:flex;flex-direction:column;justify-content:center;padding:16px 0;overflow-y:auto}#exercise-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:30px 26px}#answer-area{flex-shrink:0;padding-bottom:8px}.ex-prompt{font-size:22px;font-weight:700;line-height:1.4;margin-bottom:4px}.ex-instruction{font-size:13px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:16px}.ex-question{font-size:26px;font-weight:700;margin-bottom:8px;line-height:1.3}.ex-sentence{font-size:20px;font-weight:600;margin-bottom:8px}.ex-translation{font-size:14px;color:var(--muted);margin-bottom:20px}.ex-hint{font-size:14px;color:var(--muted);font-style:italic;margin-bottom:20px}.blank{background:#6366f12e;border-bottom:2px solid var(--primary);padding:0 8px;border-radius:4px;color:#a5b4fc;font-weight:700}.mc-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.mc-option{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:14px 16px;font-size:15px;font-weight:500;font-family:inherit;cursor:pointer;text-align:left;transition:all .15s;min-height:52px}.mc-option:hover:not(:disabled){border-color:rgba(var(--primary-rgb),.5);background:rgba(var(--primary-rgb),.08)}.mc-option.selected{border-color:var(--primary);background:rgba(var(--primary-rgb),.12);color:#a5b4fc}.mc-option.correct{border-color:var(--success);background:#10b9811f;color:var(--success)}.mc-option.wrong{border-color:var(--error);background:#ef44441f;color:var(--error)}.mc-option:disabled{cursor:not-allowed}.answer-slots{min-height:48px;border:1px dashed rgba(255,255,255,.12);border-radius:var(--radius-sm);padding:8px;display:flex;flex-wrap:wrap;gap:8px;margin:16px 0;background:#ffffff05}.word-bank{display:flex;flex-wrap:wrap;gap:8px;padding:8px 0}.word-chip{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:10px 16px;font-size:15px;font-weight:500;font-family:inherit;cursor:pointer;transition:all .15s}.word-chip:hover:not(.used){border-color:rgba(var(--primary-rgb),.5);background:rgba(var(--primary-rgb),.08)}.word-chip.used{opacity:.3;cursor:default}.answer-chip{background:rgba(var(--primary-rgb),.12);border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc}.answer-chip:hover{background:#ef44441f;border-color:#ef444466;color:var(--error)}.translate-input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:16px;font-size:18px;font-family:inherit;outline:none;width:100%;margin-top:16px;transition:border-color .2s,box-shadow .2s}.code-ex-wrap{margin-top:16px;display:flex;flex-direction:column;gap:10px}.code-ex-example{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--primary);border-radius:var(--radius-sm);padding:12px 14px}.code-ex-example-label{font-size:12px;font-weight:700;color:var(--text-sub);margin-bottom:8px}.code-ex-example-code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;white-space:pre-wrap;color:var(--text);background:var(--bg);border-radius:8px;padding:10px 12px;margin-bottom:8px;overflow-x:auto}.code-ex-example-explain{font-size:13px;color:var(--text-sub);line-height:1.5}.code-editor-mount{height:280px;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.code-ex-output{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;white-space:pre-wrap;padding:12px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);max-height:160px;overflow-y:auto}.code-ex-output.running{color:var(--text-sub)}.code-ex-output.ok{border-color:var(--success);color:var(--success)}.code-ex-output.err{border-color:var(--error);color:var(--error)}.translate-input:focus{border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.1)}.match-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.match-col{display:flex;flex-direction:column;gap:8px}.match-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:12px 14px;font-size:14px;font-weight:500;font-family:inherit;cursor:pointer;text-align:center;transition:all .15s}.match-item:hover:not(.matched):not(.match-wrong){border-color:rgba(var(--primary-rgb),.5);background:rgba(var(--primary-rgb),.08)}.match-item.selected{border-color:var(--primary);background:rgba(var(--primary-rgb),.15);color:#a5b4fc;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.2)}.match-item.matched{border-color:var(--success);background:#10b9811f;color:var(--success);cursor:default}.match-item.match-wrong{border-color:var(--error);background:#ef44441f;color:var(--error);cursor:default}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.match-item.shake{animation:shake .4s ease}.match-color-0{border-color:#818cf8!important;background:#818cf81f!important}.match-color-1{border-color:#34d399!important;background:#34d3991f!important}.match-color-2{border-color:#fbbf24!important;background:#fbbf241f!important}.match-color-3{border-color:#f472b6!important;background:#f472b61f!important}.match-color-4{border-color:#38bdf8!important;background:#38bdf81f!important}.match-color-5{border-color:#fb923c!important;background:#fb923c1f!important}#check-bar{padding:12px 0 16px;flex-shrink:0}#check-btn{width:100%;padding:16px;background:var(--grad);color:#fff;border:none;border-radius:var(--radius);font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .2s}#check-btn:disabled{background:#ffffff12;color:var(--muted);cursor:not-allowed}#check-btn:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(var(--primary-rgb),.35)}#check-btn:not(:disabled):active{transform:scale(.98)}#feedback-panel{position:fixed;bottom:0;left:0;right:0;padding:22px 24px 30px;transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:50}#feedback-panel.show{transform:translateY(0)}#feedback-panel.correct{background:#064e3bf2;border-top:2px solid var(--success);backdrop-filter:blur(16px)}#feedback-panel.wrong{background:#450a0af2;border-top:2px solid var(--error);backdrop-filter:blur(16px)}#feedback-header{display:flex;align-items:center;gap:10px;margin-bottom:8px}#feedback-icon{font-size:22px;font-weight:900}.correct #feedback-icon{color:var(--success)}.wrong #feedback-icon{color:var(--error)}#feedback-text{font-size:18px;font-weight:700}.correct #feedback-text{color:var(--success)}.wrong #feedback-text{color:var(--error)}#feedback-body{margin-bottom:14px}.fb-answer{font-size:14px;color:var(--muted);margin-bottom:4px}.fb-answer strong{color:var(--text);font-weight:700}.fb-reading{font-size:13px;color:#a5b4fc;font-family:JetBrains Mono,monospace}#continue-btn{width:100%;max-width:680px;margin:0 auto;display:block;padding:14px;background:transparent;color:var(--text);border:2px solid rgba(255,255,255,.3);border-radius:var(--radius);font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .2s}.correct #continue-btn{border-color:var(--success);color:var(--success)}.wrong #continue-btn{border-color:var(--error);color:var(--error)}#continue-btn:hover{background:#ffffff0f}#completion-screen{position:fixed;inset:0;background:#07070ff7;display:flex;align-items:center;justify-content:center;padding:24px;z-index:200}.completion-card{text-align:center;max-width:460px;width:100%;background:var(--card);border:1px solid var(--border);border-radius:28px;padding:52px 40px;box-shadow:0 24px 80px #00000080}.completion-star{font-size:42px;font-weight:900;color:var(--primary);margin-bottom:18px}.completion-card h2{font-size:30px;font-weight:900;margin-bottom:22px;letter-spacing:-.5px}.completion-stats{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.completion-stat{font-size:15px;color:var(--muted);padding:10px 20px;background:#ffffff0a;border-radius:var(--radius-sm);text-align:left}.completion-stat.highlight{color:#a5b4fc;font-weight:700;background:rgba(var(--primary-rgb),.08);border:1px solid rgba(var(--primary-rgb),.2)}.completion-card .btn-primary{margin-top:26px}.fc-main{padding:28px 24px 60px;max-width:560px;margin:0 auto}#flashcard-container{display:flex;flex-direction:column;gap:26px}#fc-header{display:flex;align-items:center;justify-content:space-between}#fc-progress{color:var(--muted);font-size:14px;font-weight:600}#card-area{display:flex;flex-direction:column;align-items:center;gap:20px}#flashcard{width:100%;background:var(--card);border:1px solid var(--border);border-radius:24px;padding:52px 34px;text-align:center;min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}#flashcard:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0000004d;border-color:rgba(var(--primary-rgb),.35)}.card-word{font-size:44px;font-weight:900;margin-bottom:10px;letter-spacing:-.5px}.card-lang{font-size:14px;color:var(--muted);font-weight:500}.card-flip-hint{font-size:12px;color:#ffffff26;margin-top:16px}.card-reading{font-size:22px;color:#a5b4fc;font-weight:600;margin-bottom:8px}.card-translation{font-size:34px;font-weight:900;margin-bottom:12px;letter-spacing:-.5px}.card-example{font-size:14px;color:var(--muted);font-style:italic;line-height:1.5}.rating-label{color:var(--muted);font-size:14px;font-weight:600;text-align:center}.rating-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.rating-buttons button{padding:14px 8px;border-radius:var(--radius-sm);font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;border:1px solid transparent;line-height:1.4;transition:all .15s}.rating-buttons button small{font-weight:400;opacity:.8}.btn-again{background:#ef44441f;color:var(--error);border-color:#ef44444d}.btn-again:hover{background:#ef444433}.btn-hard{background:#f59e0b1f;color:var(--warning);border-color:#f59e0b4d}.btn-hard:hover{background:#f59e0b33}.btn-good{background:#3b82f61f;color:#60a5fa;border-color:#3b82f64d}.btn-good:hover{background:#3b82f633}.btn-easy{background:#10b9811f;color:var(--success);border-color:#10b9814d}.btn-easy:hover{background:#10b98133}.done-card{text-align:center;padding:64px 34px;background:var(--card);border:1px solid var(--border);border-radius:24px}.done-emoji{font-size:68px;margin-bottom:18px}.done-card h2{font-size:30px;font-weight:900;margin-bottom:12px;letter-spacing:-.5px}.done-card p{color:var(--muted);margin-bottom:30px}.profile-main{padding:calc(var(--topbar-h) + 44px) 24px 60px;max-width:640px;margin:0 auto}.profile-card{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:44px 36px;text-align:center;margin-bottom:24px}.profile-avatar-wrap{position:relative;width:88px;margin:0 auto 18px;cursor:pointer}.profile-avatar-img{width:88px;height:88px;border-radius:50%;object-fit:cover;display:block;border:2px solid var(--border)}.profile-avatar{width:88px;height:88px;background:var(--primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:900;color:#fff}.profile-avatar-edit{position:absolute;bottom:2px;right:2px;background:var(--card-solid);border:1px solid var(--border);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;transition:background .2s}.profile-avatar-edit:hover{background:var(--card-hover)}.profile-username{font-size:28px;font-weight:900;margin-bottom:5px;letter-spacing:-.5px}.profile-email{color:var(--muted);font-size:14px;margin-bottom:14px}.profile-level{display:inline-block;background:rgba(var(--primary-rgb),.12);color:#a5b4fc;border:1px solid rgba(var(--primary-rgb),.3);padding:5px 16px;border-radius:999px;font-size:14px;font-weight:700}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}.profile-actions{display:flex;gap:12px;justify-content:center}.lb-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;margin-top:18px}.lb-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.lb-sub-label{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.6px}.lb-table{width:100%;border-collapse:collapse;font-size:14px}.lb-table thead th{text-align:left;padding:8px 12px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.06)}.lb-table tbody tr{border-bottom:1px solid rgba(255,255,255,.03);transition:background .15s}.lb-table tbody tr:hover{background:#ffffff06}.lb-table tbody td{padding:12px}.lb-rank{width:50px;font-weight:800;font-size:15px}.lb-username{font-weight:600}.lb-xp{color:#a5b4fc;font-weight:800;font-variant-numeric:tabular-nums}.lb-streak,.lb-lessons{color:var(--muted);font-variant-numeric:tabular-nums}.lb-row-me{background:rgba(var(--primary-rgb),.06)!important;outline:1px solid rgba(var(--primary-rgb),.25);border-radius:8px}.lb-you{font-size:10px;background:var(--grad);color:#fff;border-radius:4px;padding:1px 6px;margin-left:6px;vertical-align:middle;font-weight:700}.lb-empty{text-align:center;padding:36px;color:var(--muted);font-size:14px}.lb-podium{display:flex;align-items:flex-end;justify-content:center;gap:14px;margin:28px 0 0}.podium-slot{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:110px}.podium-medal{font-size:34px}.podium-name{font-size:13px;font-weight:700;text-align:center}.podium-xp{font-size:12px;color:#a5b4fc;font-weight:700}.podium-base{width:100%;border-radius:10px 10px 0 0}.rank-1 .podium-base{height:75px;background:linear-gradient(180deg,#facc154d,#facc1514);border:1px solid rgba(250,204,21,.4)}.rank-2 .podium-base{height:54px;background:linear-gradient(180deg,#9ca3af4d,#9ca3af14);border:1px solid rgba(156,163,175,.3)}.rank-3 .podium-base{height:38px;background:linear-gradient(180deg,#b453094d,#b4530914);border:1px solid rgba(180,83,9,.3)}.podium-me{outline:2px solid rgba(var(--primary-rgb),.6);border-radius:10px;padding:6px}.lang-flag img{display:block}.placement-main{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:calc(var(--topbar-h) + 24px) 16px 60px}.pt-card{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:44px 34px;max-width:560px;width:100%;text-align:center;box-shadow:0 24px 80px #0006}.pt-icon{font-size:56px;margin-bottom:14px}.pt-card h1{font-size:24px;font-weight:900;margin-bottom:10px}.pt-desc{font-size:14px;color:var(--muted);margin-bottom:22px;line-height:1.6}.pt-info-row{display:flex;gap:16px;justify-content:center;margin-bottom:30px;flex-wrap:wrap}.pt-info-row span{font-size:13px;color:var(--muted)}.pt-skip{display:block;margin-top:16px;font-size:13px;color:var(--muted);cursor:pointer;background:none;border:none;text-decoration:underline;font-family:inherit}.pt-skip:hover{color:var(--text)}.pt-progress-wrap{display:flex;align-items:center;gap:12px;margin-bottom:22px}.pt-progress-bar{flex:1;height:6px;background:#ffffff12;border-radius:3px;overflow:hidden}#pt-bar{height:100%;background:var(--grad);transition:width .3s;width:0;border-radius:3px}#pt-counter{font-size:13px;color:var(--muted);white-space:nowrap}.pt-level-tag{display:inline-block;font-size:11px;font-weight:800;padding:3px 10px;border-radius:999px;margin-bottom:18px;background:rgba(var(--primary-rgb),.12);color:#a5b4fc;border:1px solid rgba(var(--primary-rgb),.3)}.pt-level-tag--a1,.pt-level-tag--a2,.pt-level-tag--n5,.pt-level-tag--hsk1{background:#10b9811a;color:#10b981;border-color:#10b9814d}.pt-level-tag--b1,.pt-level-tag--b2,.pt-level-tag--n3,.pt-level-tag--hsk3{background:#f59e0b1a;color:#f59e0b;border-color:#f59e0b4d}.pt-level-tag--c1,.pt-level-tag--n1,.pt-level-tag--n2,.pt-level-tag--hsk4{background:#ef44441a;color:#ef4444;border-color:#ef44444d}.pt-question{font-size:20px;font-weight:700;margin-bottom:26px;line-height:1.5}.pt-options{display:flex;flex-direction:column;gap:10px}.pt-opt{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 18px;font-size:15px;color:var(--text);cursor:pointer;text-align:left;transition:all .15s;font-family:inherit}.pt-opt:hover:not(:disabled){border-color:rgba(var(--primary-rgb),.4);background:rgba(var(--primary-rgb),.06)}.pt-opt--correct{background:#10b9811a!important;border-color:#10b981!important;color:#10b981!important}.pt-opt--wrong{background:#ef44441a!important;border-color:#ef4444!important;color:#ef4444!important}.pt-result-label{font-size:14px;color:var(--muted);margin-bottom:6px;margin-top:16px}.pt-result-level{font-size:60px;font-weight:900;color:var(--primary);margin-bottom:10px}.pt-result-desc{font-size:15px;color:var(--text);margin-bottom:16px}.pt-result-detail{font-size:14px;color:var(--muted);margin-bottom:26px}.level-section--recommended{border:1px solid rgba(var(--primary-rgb),.2);border-radius:18px;padding:18px;background:rgba(var(--primary-rgb),.04)}.level-recommended-tag{margin-left:auto;font-size:12px;font-weight:700;color:#a5b4fc;background:rgba(var(--primary-rgb),.1);padding:3px 10px;border-radius:999px;border:1px solid rgba(var(--primary-rgb),.25)}.lang-header-actions{display:flex;gap:8px;align-items:center}.speak-btn{background:none;border:none;cursor:pointer;padding:3px 6px;border-radius:8px;font-size:14px;line-height:1;opacity:.55;transition:all .15s;vertical-align:middle;display:inline-flex;align-items:center;justify-content:center;color:var(--text)}.speak-btn:hover{opacity:1;background:#ffffff14}.speak-btn:active{transform:scale(.88);opacity:1}.speak-btn.speaking{opacity:1;animation:speak-pulse .6s ease-in-out infinite alternate}@keyframes speak-pulse{0%{opacity:.7}to{opacity:1}}.speak-btn-lg{font-size:22px;padding:6px 10px;margin:6px 0 2px;border-radius:12px;opacity:.7}.speak-btn-lg:hover{background:#ffffff1a;opacity:1}.vocab-word-cell{display:flex;align-items:center;gap:8px}.fb-speak-btn{margin-left:6px;vertical-align:middle}.hearts-display{display:flex;gap:5px;flex-shrink:0}.heart{font-size:20px;line-height:1;transition:transform .2s,opacity .3s}.heart-alive{color:#ef4444;filter:drop-shadow(0 0 6px rgba(239,68,68,.6))}.heart-dead{color:#2a2a3a;opacity:.4}@keyframes heart-lose{0%{transform:scale(1.4)}50%{transform:scale(.7) rotate(-15deg)}to{transform:scale(1)}}.heart-dying{animation:heart-lose .4s ease forwards}.combo-display{text-align:center;font-size:13px;font-weight:700;height:22px;line-height:22px;color:#fb923c;transition:opacity .3s;letter-spacing:.03em}.combo-display.combo-active{animation:combo-pop .35s ease}@keyframes combo-pop{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.mc-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;min-width:20px;background:#ffffff0f;border-radius:5px;font-size:11px;font-weight:700;color:var(--muted);margin-right:10px;flex-shrink:0;transition:background .15s}.mc-option.selected .mc-num,.mc-option:hover .mc-num{background:rgba(var(--primary-rgb),.2);color:#a5b4fc}.kb-hint{display:inline-block;background:#ffffff12;border:1px solid rgba(255,255,255,.1);border-radius:4px;font-size:10px;font-weight:600;color:var(--muted);padding:1px 5px;margin-left:8px;vertical-align:middle}.kb-hint-btn{display:inline-block;background:#ffffff17;border:1px solid rgba(255,255,255,.13);border-radius:4px;font-size:10px;font-weight:600;color:#ffffff80;padding:1px 6px;margin-left:8px;vertical-align:middle}.completion-stars{display:flex;justify-content:center;gap:10px;margin-bottom:14px}.comp-star{font-size:38px;line-height:1;transition:transform .3s,opacity .3s}.comp-star-on{color:#f59e0b;filter:drop-shadow(0 0 10px rgba(245,158,11,.7))}.comp-star-off{color:#2a2a3a;opacity:.35}.wrong-review{text-align:left;margin-top:22px;background:#ef44440d;border:1px solid rgba(239,68,68,.15);border-radius:14px;padding:16px;max-height:280px;overflow-y:auto}.wrong-review-title{font-size:12px;font-weight:700;color:var(--error);margin-bottom:12px;text-transform:uppercase;letter-spacing:.05em}.wrong-review-item{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.04)}.wrong-review-item:last-child{border-bottom:none}.wr-prompt{font-size:12px;color:var(--muted);margin-bottom:4px}.wr-answer{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}.wr-correct-label{color:var(--success);font-size:14px}#game-over-screen{position:fixed;inset:0;background:#07070ffa;display:flex;align-items:center;justify-content:center;z-index:200;padding:24px}#game-over-screen.hidden{display:none}.game-over-card{border:1px solid rgba(239,68,68,.35)}.go-icon{font-size:60px;margin-bottom:12px;animation:heart-lose .4s ease}.go-sub{color:var(--muted);font-size:15px;margin-top:-12px;margin-bottom:4px}.completion-actions{display:flex;flex-direction:column;gap:10px;margin-top:22px}.completion-actions .btn-outline{background:none;border:1px solid rgba(255,255,255,.1);color:var(--muted);padding:12px 24px;border-radius:var(--radius);font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit}.completion-actions .btn-outline:hover{border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc;background:rgba(var(--primary-rgb),.05)}.unit-progress{display:flex;align-items:center;gap:8px;margin:8px 0 12px;padding:0 2px}.unit-progress-bar{flex:1;height:5px;background:#ffffff0f;border-radius:999px;overflow:hidden}.unit-progress-fill{height:100%;background:var(--grad);border-radius:999px;transition:width .6s ease;min-width:0}.unit-progress-text{font-size:11px;color:var(--muted);font-weight:600;flex-shrink:0;min-width:36px;text-align:right}.unit-progress-pct{font-size:11px;font-weight:700;flex-shrink:0;min-width:28px}.unit-progress-pct.done{color:var(--success)}.unit-progress-pct.wip{color:#a5b4fc}.unit-progress-pct.none{color:var(--muted)}.xp-progress-wrap{margin-top:16px;width:100%;max-width:340px}.xp-progress-bar{height:8px;background:#ffffff0f;border-radius:999px;overflow:hidden;margin-bottom:5px}.xp-progress-fill{height:100%;background:var(--grad);border-radius:999px;transition:width .6s ease}.xp-progress-label{font-size:11px;color:var(--muted);display:flex;justify-content:space-between}.gm-options{display:flex;flex-direction:column;gap:10px;width:100%;padding:14px 0 4px}.gm-options-line{display:flex;align-items:center;gap:10px}.gm-options-label{font-size:12px;color:var(--muted);white-space:nowrap;width:48px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}.gm-option-group{display:flex;gap:6px;flex-wrap:wrap}.gm-option-btn{background:#ffffff0a;color:#ffffff80;border:1px solid rgba(255,255,255,.09);border-radius:8px;padding:6px 14px;font-size:13px;cursor:pointer;transition:all .15s;font-family:inherit}.gm-option-btn:hover:not(:disabled){background:#ffffff14;color:#fffc}.gm-option-btn.active{background:rgba(var(--primary-rgb),.15);border-color:rgba(var(--primary-rgb),.4);color:#a5b4fc;font-weight:600}.gm-option-btn:disabled{opacity:.35;cursor:default}@keyframes pageEnter{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.hub-main,.home-main,.learn-main,.profile-main,.placement-main,.gm-page,.auth-main,.learn-cat-grid,.section-header{animation:pageEnter .5s cubic-bezier(.16,1,.3,1) both}@keyframes authCardIn{0%{opacity:0;transform:translateY(28px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-card{animation:authCardIn .55s cubic-bezier(.16,1,.3,1) both}.lang-cards>*:nth-child(1){animation:pageEnter .5s .06s cubic-bezier(.16,1,.3,1) both}.lang-cards>*:nth-child(2){animation:pageEnter .5s .13s cubic-bezier(.16,1,.3,1) both}.lang-cards>*:nth-child(3){animation:pageEnter .5s .2s cubic-bezier(.16,1,.3,1) both}.feature-grid>*:nth-child(1){animation:pageEnter .5s .06s cubic-bezier(.16,1,.3,1) both}.feature-grid>*:nth-child(2){animation:pageEnter .5s .12s cubic-bezier(.16,1,.3,1) both}.feature-grid>*:nth-child(3){animation:pageEnter .5s .18s cubic-bezier(.16,1,.3,1) both}.feature-grid>*:nth-child(4){animation:pageEnter .5s .24s cubic-bezier(.16,1,.3,1) both}.stats-row>*:nth-child(1){animation:pageEnter .5s .06s cubic-bezier(.16,1,.3,1) both}.stats-row>*:nth-child(2){animation:pageEnter .5s .13s cubic-bezier(.16,1,.3,1) both}.stats-row>*:nth-child(3){animation:pageEnter .5s .2s cubic-bezier(.16,1,.3,1) both}.lang-select-grid>*:nth-child(1){animation:pageEnter .5s .06s cubic-bezier(.16,1,.3,1) both}.lang-select-grid>*:nth-child(2){animation:pageEnter .5s .12s cubic-bezier(.16,1,.3,1) both}.lang-select-grid>*:nth-child(3){animation:pageEnter .5s .18s cubic-bezier(.16,1,.3,1) both}.lang-select-grid>*:nth-child(4){animation:pageEnter .5s .24s cubic-bezier(.16,1,.3,1) both}.lang-select-grid>*:nth-child(5){animation:pageEnter .5s .3s cubic-bezier(.16,1,.3,1) both}.btn-outline:active,.btn-ghost:active{transform:scale(.97)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ffffff38}.skeleton{background:linear-gradient(90deg,#ffffff0a,#ffffff17,#ffffff0a);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:8px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}[data-theme=light]{--bg: #f0f2f5;--surface: #ffffff;--card: #ffffff;--card-solid: #ffffff;--card-hover: #f5f6f8;--text: #1c1e21;--text-sub: #606770;--muted: #8a8d91;--border: #dadde1;--border-solid: #dadde1}[data-theme=light] body{background:var(--bg)}[data-theme=light] ::-webkit-scrollbar-thumb{background:#00000026}[data-theme=light] .skeleton{background:linear-gradient(90deg,#0000000a,#00000014,#0000000a);background-size:200% 100%;animation:shimmer 1.5s infinite}.stories-row{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none;-ms-overflow-style:none}.stories-row::-webkit-scrollbar{display:none}.story-card{position:relative;width:88px;height:152px;border-radius:14px;overflow:hidden;cursor:pointer;flex-shrink:0;background:var(--card-solid);border:1px solid var(--border);transition:transform .18s;user-select:none;display:block;text-align:left}.story-card:hover{transform:scale(1.04)}.story-card-bg{position:absolute;inset:0;background-size:cover;background-position:center}.story-card-bg--text{background:linear-gradient(145deg,#6366f1,#8b5cf6)}.story-card-bg--nophoto{background:var(--surface)}.story-card-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,#0000000d 30%,#000000ad)}.story-card-avatar{position:absolute;top:8px;left:8px;z-index:2}.story-card .story-ring{width:34px;height:34px;padding:2px;box-shadow:0 0 0 1.5px var(--bg);transition:none}.story-card .story-ring-inner{border-width:1.5px}.story-card-name{position:absolute;bottom:8px;left:6px;right:6px;z-index:2;font-size:10.5px;font-weight:700;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.story-card-text{position:absolute;top:50%;left:6px;right:6px;z-index:2;transform:translateY(-50%);font-size:11.5px;font-weight:700;color:#fff;text-align:center;text-shadow:0 1px 6px rgba(0,0,0,.5);word-break:break-word;line-height:1.4;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.story-card--seen .story-card-bg{filter:brightness(.65) saturate(.6)}.story-card--add{border:none}.story-card-add-plus{position:absolute;bottom:30px;left:50%;transform:translate(-50%);z-index:2;width:30px;height:30px;border-radius:50%;background:var(--primary);border:3px solid var(--bg);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;line-height:1}.story-ring{width:56px;height:56px;border-radius:50%;padding:3px;background:var(--grad);cursor:pointer}.story-ring.seen{background:var(--border-solid)}.story-ring--reacted{background:var(--grad);box-shadow:0 0 0 2px #6366f180,0 0 14px #6366f18c}.story-ring-inner{width:100%;height:100%;border-radius:50%;overflow:hidden;border:2px solid var(--bg);background:var(--card-solid);display:flex;align-items:center;justify-content:center}.story-ring-inner img{width:100%;height:100%;object-fit:cover}.story-ring-inner .story-init{font-size:20px;font-weight:700;color:var(--primary)}.story-modal{position:fixed;inset:0;z-index:2000;background:#000000d9;display:flex;align-items:center;justify-content:center}.story-modal.hidden{display:none}.story-viewer{position:relative;width:min(400px,95vw);background:var(--card-solid);border-radius:var(--radius-lg);overflow:hidden}.story-viewer-head{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#0006;position:absolute;top:0;left:0;right:0;z-index:1}.story-viewer-close{margin-left:auto;background:none;border:none;color:#fff;font-size:20px;cursor:pointer;line-height:1}.story-viewer-img{width:100%;max-height:70vh;object-fit:contain;display:block}.story-viewer-text{padding:16px;font-size:16px;min-height:80px;display:flex;align-items:center;justify-content:center;text-align:center}.story-progress{height:3px;background:#ffffff4d;position:absolute;top:0;left:0;right:0}.story-progress-bar{height:100%;background:var(--primary);animation:story-timer 5s linear forwards}@keyframes story-timer{0%{width:0}to{width:100%}}.story-create-modal{position:fixed;inset:0;z-index:2000;background:#000000b3;display:flex;align-items:center;justify-content:center}.story-create-modal.hidden{display:none}.story-create-box{background:var(--card-solid);border-radius:var(--radius-lg);padding:24px;width:min(400px,95vw);display:flex;flex-direction:column;gap:12px}.story-create-box textarea{background:#ffffff0d;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-family:inherit;font-size:15px;padding:12px;resize:none;outline:none;width:100%}.story-create-actions{display:flex;gap:10px;justify-content:flex-end}.badges-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.badge-chip{display:flex;align-items:center;gap:6px;background:var(--card-hover);border:1px solid var(--border);border-radius:999px;padding:5px 12px;font-size:12px;cursor:default;transition:border-color .2s}.badge-chip:hover{border-color:var(--primary)}.badge-chip-icon{font-size:16px}.quick-match-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;margin-bottom:32px}.quick-match-title{font-size:18px;font-weight:700;margin-bottom:4px}.quick-match-sub{font-size:13px;color:var(--text-sub);margin-bottom:16px}.quick-match-grid{display:flex;flex-wrap:wrap;gap:8px}.qm-btn{display:flex;align-items:center;gap:8px;background:var(--card-solid);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:13px;font-weight:600;padding:8px 14px;cursor:pointer;transition:border-color .2s,background .2s}.qm-btn:hover{border-color:var(--primary);background:var(--card-hover)}.qm-btn.searching{border-color:var(--warning);color:var(--warning)}.qm-btn[data-qm=xo].searching{border-color:#818cf8;background:#818cf826;color:#818cf8}.qm-btn[data-qm=rps].searching{border-color:#fb923c;background:#fb923c26;color:#fb923c}.qm-btn[data-qm=checkers].searching{border-color:#f59e0b;background:#f59e0b26;color:#f59e0b}.qm-btn[data-qm=typerace].searching{border-color:#34d399;background:#34d39926;color:#34d399}.qm-btn[data-qm=wordbomb].searching{border-color:#f87171;background:#f8717126;color:#f87171}.qm-btn[data-qm=trivia].searching{border-color:#fbbf24;background:#fbbf2426;color:#fbbf24}.qm-status{margin-top:12px;font-size:13px;color:var(--text-sub);min-height:20px}.feed-empty{text-align:center;padding:60px 20px;color:var(--text-sub)}.feed-empty-icon{font-size:48px;margin-bottom:16px}.feed-empty h3{font-size:18px;font-weight:700;color:var(--text);margin-bottom:8px}.feed-empty p{font-size:14px;margin-bottom:20px}.theme-toggle-btn{background:none;border:none;cursor:pointer;color:var(--text-sub);padding:6px;border-radius:50%;transition:background .2s,color .2s;display:flex;align-items:center;justify-content:center}.theme-toggle-btn:hover{background:var(--card-hover);color:var(--text)}.search-dropdown{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--card-solid);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 8px 32px #0000004d;z-index:9999;overflow:hidden}.search-dropdown.hidden{display:none}.search-section-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;padding:10px 14px 4px}.search-result-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;transition:background .15s;text-decoration:none;color:inherit}.search-result-item:hover{background:var(--card-hover)}.search-result-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0;background:var(--primary);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff}.search-result-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.search-result-name{font-size:14px;font-weight:600}.search-result-sub{font-size:12px;color:var(--text-sub)}.search-no-results{padding:16px;text-align:center;font-size:13px;color:var(--muted)}.sfb-overlay{position:fixed;inset:0;z-index:20000;background:#000000eb;display:flex}.sfb-left{width:340px;flex-shrink:0;background:var(--card);padding:20px 12px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.sfb-left-title{font-size:22px;font-weight:800;padding:0 8px 4px}.sfb-left-sub{font-size:12px;color:var(--text-sub);font-weight:600;padding:8px 8px 4px;text-transform:uppercase;letter-spacing:.04em}.sfb-uitem{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:background .15s}.sfb-uitem:hover,.sfb-uitem.sfb-uactive{background:var(--hover)}.sfb-uavatar{position:relative;flex-shrink:0}.sfb-udot{position:absolute;top:0;right:0;width:10px;height:10px;background:var(--primary);border-radius:50%;border:2px solid var(--card)}.sfb-uname{font-size:14px;font-weight:600}.sfb-utime{font-size:12px;color:var(--text-sub)}.sfb-main{flex:1;display:flex;align-items:center;justify-content:center;gap:20px;padding:20px}.sfb-arrow{width:48px;height:48px;border-radius:50%;background:#ffffff26;border:none;color:#fff;font-size:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}.sfb-arrow:hover{background:#ffffff4d}.sfb-arrow-hidden{opacity:0;pointer-events:none}.sfb-card{position:relative;flex-shrink:0;width:min(380px,50vw);height:min(680px,85vh);border-radius:14px;overflow:hidden;background:#111;cursor:pointer;user-select:none}.sfb-bars{position:absolute;top:10px;left:10px;right:10px;display:flex;gap:4px;z-index:10}.sfb-bar{flex:1;height:3px;border-radius:2px;background:#ffffff59;overflow:hidden}.sfb-bfill{height:100%;width:0;background:#fff;border-radius:2px}.sfb-bdone{width:100%}.sfb-bactive{animation:sfb-prog 5s linear forwards}.sfb-paused .sfb-bactive{animation-play-state:paused}@keyframes sfb-prog{to{width:100%}}.sfb-head{position:absolute;top:22px;left:12px;right:12px;display:flex;align-items:center;gap:10px;z-index:10}.sfb-hinfo{flex:1;min-width:0}.sfb-hname{font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sfb-htime{font-size:11px;color:#ffffffa6}.sfb-del{background:none;border:none;font-size:18px;cursor:pointer;padding:4px;line-height:1}.sfb-x{background:none;border:none;color:#fff;font-size:20px;cursor:pointer;padding:4px;line-height:1}.sfb-img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.sfb-vid{width:100%;height:100%;object-fit:contain;display:block;background:#000}.sfb-overlay-text{position:absolute;bottom:90px;left:0;right:0;padding:16px 20px;font-size:20px;font-weight:700;color:#fff;text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.9);pointer-events:none;z-index:5}.sfb-textbg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary) 0%,#7c3aed 100%);padding:80px 24px}.sfb-textcontent{font-size:22px;font-weight:700;color:#fff;text-align:center;line-height:1.5}.sfb-foot{position:absolute;bottom:0;left:0;right:0;padding:16px 14px;z-index:10;background:linear-gradient(to top,rgba(0,0,0,.65) 0%,transparent 100%)}.sfb-reply-row{display:flex;align-items:center;gap:10px}.sfb-reply-in{flex:1;background:#ffffff26;border:1.5px solid rgba(255,255,255,.3);color:#fff;border-radius:22px;padding:10px 16px;font-size:14px;outline:none;font-family:inherit}.sfb-reply-in::placeholder{color:#ffffffa6}.sfb-emojis{font-size:22px;display:flex;gap:4px}.sfb-emoji{cursor:pointer;padding:4px 6px;border-radius:8px;transition:background .15s;user-select:none}.sfb-emoji:hover{background:#fff3}.sfb-emoji--active{background:#ffffff40;outline:2px solid rgba(255,255,255,.45)}.sfb-send-btn{background:none;border:none;color:#fff;font-size:20px;cursor:pointer;padding:4px 8px;opacity:.8;line-height:1;transition:opacity .15s}.sfb-send-btn:hover{opacity:1}.sfb-reply-sent{text-align:center;color:#fff;font-size:13px;padding:6px;opacity:.9}.sfb-ctrl-btn{background:#ffffff26;border:none;color:#fff;font-size:15px;cursor:pointer;padding:5px 8px;border-radius:8px;transition:background .15s;line-height:1}.sfb-ctrl-btn:hover{background:#ffffff4d}.sfb-create-ov{position:fixed;inset:0;z-index:2000;background:#000000bf;display:flex;align-items:center;justify-content:center}.sfb-create-ov.hidden{display:none}.sfb-create-box{background:var(--card-solid);border-radius:14px;padding:24px;width:min(480px,95vw);max-height:90vh;overflow-y:auto;border:1px solid var(--border)}.sfb-create-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.sfb-drop-area{border:2px dashed var(--border);border-radius:12px}.sfb-drop-area.hidden{display:none}.sfb-drop-inner{text-align:center;padding:48px 20px}.sfb-pv-wrap.hidden{display:none}.sfb-pv-card{position:relative;border-radius:10px;overflow:hidden;background:#111;max-height:380px;display:flex;align-items:center;justify-content:center}.sfb-pv-media{max-width:100%;max-height:340px;object-fit:contain;display:block}.sfb-pv-media.hidden{display:none}.sfb-pv-textrow{position:absolute;bottom:0;left:0;right:0;padding:12px 16px;background:linear-gradient(to top,rgba(0,0,0,.7),transparent)}.sfb-pv-txtinput{width:100%;background:transparent;border:none;border-bottom:1.5px solid rgba(255,255,255,.5);color:#fff;font-size:15px;outline:none;padding:6px 0;font-family:inherit}.sfb-pv-txtinput::placeholder{color:#ffffff8c}.sfb-create-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.sfb-cre-editor{display:flex;width:100%;height:100%;background:#000000eb;position:relative;overscroll-behavior:none}.sfb-cre-editor.hidden{display:none}.sfb-cre-left{width:360px;flex-shrink:0;background:var(--card-solid);display:flex;flex-direction:column;border-right:1px solid var(--border)}.sfb-cre-ltitle{font-size:20px;font-weight:700;padding:22px 20px 0}.sfb-cre-lbody{flex:1;padding:16px 20px;overflow-y:auto}.sfb-cre-label{display:block;font-size:13px;color:var(--text-sub);margin-bottom:8px}.sfb-cre-lfoot{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--border)}.sfb-cre-right{flex:1;display:flex;align-items:center;justify-content:center;padding:20px}.sfb-cre-card{position:relative;width:min(340px,calc((100vh - 60px)*.5625));height:min(604px,calc(100vh - 60px));border-radius:14px;overflow:hidden;background:#1a1a2e}.sfb-stage{position:absolute;inset:0;overflow:hidden;cursor:grab;touch-action:none}.sfb-stage:active{cursor:grabbing}.sfb-img-inner{position:absolute;inset:0;transform-origin:center center;will-change:transform}.sfb-img-inner img,.sfb-img-inner video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;user-select:none}.sfb-txt-drag{position:absolute;z-index:10;padding:6px 14px;font-size:20px;font-weight:700;color:#fff;text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.9);cursor:grab;user-select:none;max-width:90%;word-break:break-word;touch-action:none;background:#00000040;border-radius:6px}.sfb-txt-drag:active{cursor:grabbing}.sfb-cre-tools{margin-top:14px;display:flex;flex-direction:column;gap:10px}.sfb-tool-row{display:flex;flex-direction:column;gap:4px}.sfb-tool-lbl{font-size:12px;color:var(--text-sub)}.sfb-tool-slider{width:100%;accent-color:var(--primary)}.sfb-tool-btn{width:100%;margin-top:2px}.sfb-txt-input-row{display:flex;gap:8px;margin-bottom:0}.sfb-txt-input{flex:1;background:var(--input-bg,var(--surface));border:1.5px solid var(--border);border-radius:8px;padding:10px 12px;font-size:14px;color:var(--text);font-family:inherit;outline:none;min-width:0}.sfb-txt-input:focus{border-color:var(--primary)}.sfb-txt-trash{position:absolute;bottom:0;left:0;right:0;height:80px;display:flex;align-items:center;justify-content:center;background:#dc262626;z-index:20;border-top:2px solid rgba(220,38,38,.3);transition:background .15s,border-color .15s}.sfb-txt-trash.sfb-txt-trash-over{background:#dc2626b3;border-color:#dc2626e6}.sfb-txt-trash.hidden{display:none}.sfb-txt-trash span{font-size:34px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}.sfb-safe-guide{position:absolute;inset:68px 8px 96px;border:2px dashed rgba(255,255,255,.35);border-radius:6px;pointer-events:none;z-index:12}.sfb-safe-guide:before{content:"\e1e\e37\e49\e19\e17\e35\e48\e1b\e25\e2d\e14\e20\e31\e22";position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:11px;color:#ffffff80;white-space:nowrap;letter-spacing:.5px}.sfb-safe-guide:after{content:"UI \e02\e2d\e07\e1c\e39\e49\e14\e39";position:absolute;bottom:-20px;left:50%;transform:translate(-50%);font-size:11px;color:#ffffff80;white-space:nowrap;letter-spacing:.5px}.sfb-txt-input-ov{position:absolute;inset:0;z-index:30;background:#000000b8;display:flex;align-items:center;justify-content:center}.sfb-txt-input-ov.hidden{display:none}.sfb-txt-input-box{background:var(--card-solid);border-radius:14px;padding:20px;width:min(360px,90vw);border:1px solid var(--border)}.sfb-react-bar{display:flex;flex-wrap:wrap;gap:6px;padding-top:6px}.sfb-react-chip{background:#ffffff2e;border-radius:20px;padding:4px 10px;font-size:15px;cursor:pointer;white-space:nowrap}.sfb-react-chip b{font-size:13px;margin-left:2px}.sfb-del{background:#dc2626d9!important;border:none!important;color:#fff!important;border-radius:8px!important;padding:5px 9px!important}.sfb-del:hover{background:#dc2626!important}.sfb-create-textarea{width:100%;background:var(--input-bg,var(--surface));border:1.5px solid var(--border);border-radius:10px;padding:12px 14px;font-size:15px;color:var(--text);font-family:inherit;resize:vertical;outline:none}.sfb-create-textarea:focus{border-color:var(--primary)}.vip-check{display:inline-block;width:18px;height:18px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="92 0 24 24"><path fill="%231877f2" d="m109.207 9.707-6.5 6.5a.996.996 0 0 1-1.414 0l-3-3a1 1 0 1 1 1.414-1.414L102 14.086l5.793-5.793a1 1 0 1 1 1.414 1.414m6.68 4.768L114.618 12l1.267-2.474a1.02 1.02 0 0 0-.355-1.326l-2.334-1.51-.14-2.775a1.018 1.018 0 0 0-.97-.971l-2.778-.14-1.51-2.336a1.02 1.02 0 0 0-1.324-.354L104 1.38 101.526.114a1.02 1.02 0 0 0-1.326.354l-1.509 2.336-2.777.14a1.017 1.017 0 0 0-.97.97l-.14 2.777L92.468 8.2a1.02 1.02 0 0 0-.354 1.325L93.382 12l-1.268 2.474a1.02 1.02 0 0 0 .355 1.326l2.335 1.509.14 2.776c.025.528.443.945.97.971l2.777.14 1.51 2.336a1.02 1.02 0 0 0 1.324.354L104 22.62l2.474 1.267c.469.242 1.039.09 1.326-.355l1.51-2.335 2.776-.14c.527-.026.945-.443.97-.97l.14-2.777 2.336-1.51c.443-.286.595-.856.354-1.324"/></svg>') no-repeat center/contain;vertical-align:middle;margin-left:3px;flex-shrink:0;position:relative;top:-1px}.extlink-modal{position:fixed;inset:0;z-index:3000;background:#000000d9;display:flex;align-items:center;justify-content:center;padding:20px}.extlink-modal.hidden{display:none}.extlink-box{background:var(--card-solid);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;width:min(420px,95vw);display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 60px #000000b3}.extlink-icon{width:44px;height:44px;border-radius:50%;background:#f59e0b26;display:flex;align-items:center;justify-content:center;color:var(--warning)}.extlink-box h3{font-size:17px;font-weight:700;color:var(--text)}.extlink-box p{font-size:14px;color:var(--text-sub);line-height:1.5}.extlink-url{background:#ffffff0d;border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;color:var(--primary);word-break:break-all;font-family:JetBrains Mono,monospace}.extlink-checkbox{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-sub);cursor:pointer;user-select:none}.extlink-checkbox input{accent-color:var(--primary);cursor:pointer}.extlink-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}.extlink-cancel{background:var(--card-hover);border:1px solid var(--border);color:var(--text);padding:9px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;transition:border-color .2s}.extlink-cancel:hover{border-color:var(--text-sub)}.extlink-continue{background:var(--grad);border:none;color:#fff;padding:9px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;transition:opacity .2s}.extlink-continue:hover{opacity:.9}[data-theme=light] .extlink-box{box-shadow:0 20px 60px #00000026}