@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--bg-primary: #0F0F23;--bg-secondary: #1B1B30;--bg-tertiary: #27273B;--glass-bg: rgba(27, 27, 48, .85);--glass-border: rgba(67, 56, 202, .2);--text-primary: #F8FAFC;--text-secondary: #94A3B8;--text-muted: #64748B;--border-color: #312E81;--primary: #6366F1;--primary-hover: #818CF8;--primary-light: #A5B4FC;--on-primary: #FFFFFF;--secondary: #818CF8;--secondary-hover: #A5B4FC;--on-secondary: #FFFFFF;--tertiary: #06b6d4;--tertiary-hover: #22d3ee;--on-tertiary: #0F172A;--accent: #F97316;--accent-green: #22C55E;--accent-red: #FF473A;--accent-red-hover: #FF6B61;--accent-pink: #FF8A9B;--accent-purple: #a855f7;--accent-cyan: #00b4d8;--accent-blue: #6366F1;--accent-blue-light: #818CF8;--success: #22C55E;--success-bg: rgba(5, 196, 107, .15);--success-bg-light: rgba(5, 196, 107, .2);--error: #ef4444;--error-bg: rgba(255, 94, 87, .15);--error-bg-light: rgba(255, 94, 87, .2);--on-success: #ffffff;--on-error: #ffffff;--background: #0F0F23;--foreground: #F8FAFC;--card: #1B1B30;--card-foreground: #F8FAFC;--muted: #27273B;--muted-foreground: #94A3B8;--border-new: #4338CA;--n5-color: #87a96b;--n4-color: #e67e22;--n3-color: #c0392b;--sidebar-width: 280px;--header-height: 70px;--border-radius-sm: 8px;--border-radius-md: 12px;--border-radius-lg: 20px;--border-radius-xl: 24px;--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-md: 0 8px 24px rgba(211, 84, 0, .04);--shadow-lg: 0 16px 36px rgba(211, 84, 0, .08);--font-primary: "Baloo 2", "Outfit", sans-serif;--font-japanese: "Noto Sans JP", sans-serif;--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1);--shadow-clay: 8px 8px 16px rgba(0, 0, 0, .25), -8px -8px 16px rgba(255, 255, 255, .05);--shadow-clay-hover: 12px 12px 24px rgba(0, 0, 0, .3), -8px -8px 16px rgba(255, 255, 255, .05)}:root.light-theme{--bg-primary: #f8fafc;--bg-secondary: #ffffff;--bg-tertiary: #f1f5f9;--glass-bg: rgba(255, 255, 255, .8);--glass-border: rgba(15, 23, 42, .08);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #64748B;--border-color: #e2e8f0;--primary: #6366F1;--primary-hover: #818CF8;--primary-light: #A5B4FC;--secondary: #818CF8;--secondary-hover: #A5B4FC;--tertiary: #06b6d4;--tertiary-hover: #22d3ee;--accent-red: #FF473A;--accent-red-hover: #FF6B61;--accent-pink: #FF8A9B;--accent-purple: #a855f7;--accent-cyan: #06b6d4;--accent-blue: #6366F1;--accent-blue-light: #818CF8;--success: #16a34a;--success-bg: rgba(5, 196, 107, .2);--success-bg-light: rgba(5, 196, 107, .25);--error: #dc2626;--error-bg: rgba(255, 94, 87, .2);--error-bg-light: rgba(255, 94, 87, .25);--on-success: #ffffff;--on-error: #ffffff;--shadow-sm: 0 4px 6px -1px rgba(15, 23, 42, .05), 0 2px 4px -1px rgba(15, 23, 42, .03);--shadow-md: 0 10px 15px -3px rgba(15, 23, 42, .08), 0 4px 6px -2px rgba(15, 23, 42, .04);--shadow-lg: 0 20px 25px -5px rgba(15, 23, 42, .1), 0 10px 10px -5px rgba(15, 23, 42, .04);--shadow-clay: 6px 6px 12px rgba(0, 0, 0, .08), -6px -6px 12px rgba(255, 255, 255, .95);--shadow-clay-hover: 10px 10px 20px rgba(0, 0, 0, .12), -6px -6px 12px rgba(255, 255, 255, .95)}:root:not(.light-theme){background-color:var(--bg-primary)}:root:not(.light-theme) .logo-icon{border-radius:8px!important;background:linear-gradient(135deg,var(--primary),var(--primary-light))!important;box-shadow:0 4px 10px #6366f14d!important}:root:not(.light-theme) .nav-item.active{background:linear-gradient(90deg,rgba(99,102,241,.2) 0%,transparent 100%)!important;color:var(--primary-light)!important;border-left-color:var(--primary)!important}:root:not(.light-theme) .timeline-container:after{border-color:var(--primary)!important}:root:not(.light-theme) .btn-primary,:root:not(.light-theme) .pronounce-btn{background:linear-gradient(135deg,var(--primary),var(--primary-hover))!important;box-shadow:0 4px 12px #6366f140!important;color:var(--on-primary)!important}:root:not(.light-theme) .btn-primary:hover,:root:not(.light-theme) .pronounce-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px #6366f159!important}:root.light-theme button:active,:root.light-theme .btn-primary:active,:root.light-theme .pronounce-btn:active,:root.light-theme .deck-btn:active,:root.light-theme .lang-btn:active,:root.light-theme .kana-tab:active,:root.light-theme .hub-tab:active,:root.light-theme .level-filter-btn:active{opacity:.7;transform:scale(.98);color:var(--primary)!important}:root:not(.light-theme) button:active{color:var(--primary)!important}:root.light-theme button:focus-visible,:root.light-theme .btn-primary:focus-visible,:root.light-theme .pronounce-btn:focus-visible,:root.light-theme .btn-cta-secondary:focus-visible{outline:2px solid var(--primary);outline-offset:2px}:root:not(.light-theme) button:focus-visible,:root:not(.light-theme) .btn-primary:focus-visible,:root:not(.light-theme) .btn-cta-primary:focus-visible,:root:not(.light-theme) .btn-cta-secondary:focus-visible,:root:not(.light-theme) .pronounce-btn:focus-visible,:root:not(.light-theme) .kana-cell:focus-visible,:root:not(.light-theme) .modal-close:focus-visible,:root:not(.light-theme) .resource-nav:focus-visible,:root:not(.light-theme) .mobile-nav-toggle:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}:root:not(.light-theme) .kanji-box-card:hover,:root:not(.light-theme) .kana-card:not(.empty-card):hover{border-color:var(--primary)!important;background-color:#6366f105!important}*{box-sizing:border-box;margin:0;padding:0}h1,h2,h3{color:var(--primary)!important}body{font-family:var(--font-primary);background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden;transition:background-color .3s,color .3s}a{text-decoration:none;color:inherit}strong,b,h4{color:var(--primary);font-weight:600}button,input,select{font-family:inherit}button{cursor:pointer;border:none;background:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none}button:focus{outline:none}button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.jlpt-level-selector select:focus-visible{outline:2px solid var(--primary);outline-offset:2px}input:focus,select:focus,textarea:focus{outline:none}.form-group input:focus-visible,.form-group select:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-color:var(--primary)}#post-editor-form input:focus-visible,#post-editor-form textarea:focus-visible,#post-editor-form select:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.content-editor-wrapper textarea:focus-visible{outline:2px solid var(--primary);outline-offset:2px}#post-tags-input:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.admin-login-form input:focus-visible{outline:2px solid var(--primary);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--border-radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.app-layout{display:flex;min-height:100vh;position:relative;width:100%}.logo{display:flex;align-items:center;gap:12px;flex-shrink:0}.logo-icon{font-family:var(--font-japanese);font-size:24px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-light));width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--border-radius-sm);box-shadow:0 4px 10px #6366f166}.logo-text{font-size:20px;font-weight:700;color:var(--text-primary);letter-spacing:-.5px}.logo-text span{color:var(--primary)}.header-nav{display:flex;align-items:center;gap:4px;margin-left:24px}.nav-item{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--border-radius-md);color:var(--text-secondary);font-weight:500;font-size:14px;transition:var(--transition-smooth);white-space:nowrap}.nav-item svg{color:var(--text-muted);transition:var(--transition-smooth);width:16px;height:16px}.nav-item:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.nav-item:hover svg{color:var(--text-primary)}.nav-item.active{background:linear-gradient(90deg,#6366f126,#6366f105);color:var(--primary)}.nav-item.active svg{color:var(--primary)}.nav-dropdown{position:relative}.nav-dropdown-toggle{cursor:pointer}.nav-dropdown-toggle .dropdown-arrow{width:14px;height:14px;transition:transform .2s ease}.nav-dropdown:hover .nav-dropdown-toggle .dropdown-arrow{transform:rotate(180deg)}.nav-dropdown-menu{position:absolute;top:100%;left:0;min-width:200px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);box-shadow:var(--shadow-lg);padding:8px;display:none;flex-direction:column;gap:4px;z-index:100}.nav-dropdown:hover .nav-dropdown-menu{display:flex}.nav-dropdown-menu .nav-item{padding:10px 14px;font-size:13px}.nav-dropdown-menu .nav-item.subpage{padding-left:14px}.nav-dropdown-menu .nav-item.subpage i{width:14px;height:14px}.mobile-nav-toggle{display:none;background:none;border:none;color:var(--text-primary);cursor:pointer;padding:8px;border-radius:var(--border-radius-md);transition:background .2s}.mobile-nav-toggle:hover{background:var(--bg-tertiary)}.mobile-nav-toggle i{width:24px;height:24px}.mobile-nav-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:100}.mobile-nav-overlay.active{display:block}.mobile-nav-drawer{display:none;position:fixed;top:0;left:0;width:280px;height:100vh;background:var(--bg-secondary);z-index:101;flex-direction:column;transform:translate(-100%);transition:transform .3s ease;overflow-y:auto}.mobile-nav-drawer.active{transform:translate(0)}.mobile-nav-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color)}.mobile-nav-title{font-size:18px;font-weight:600;color:var(--text-primary)}.mobile-nav-close{background:none;border:none;color:var(--text-primary);cursor:pointer;padding:8px;border-radius:var(--border-radius-md);display:flex;align-items:center;justify-content:center}.mobile-nav-close:hover{background:var(--bg-tertiary)}.mobile-nav-close i{width:20px;height:20px}.mobile-nav-menu{display:flex;flex-direction:column;padding:12px 0}.mobile-nav-item{display:flex;align-items:center;gap:12px;padding:12px 20px;color:var(--text-secondary);font-size:14px;font-weight:500;transition:all .2s;border-left:3px solid transparent}.mobile-nav-item:hover{background:var(--bg-tertiary);color:var(--text-primary);border-left-color:var(--primary)}.mobile-nav-item.active{background:var(--bg-tertiary);color:var(--primary);border-left-color:var(--primary)}.mobile-nav-item i{width:18px;height:18px;flex-shrink:0}.theme-toggle-btn{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--border-radius-md);color:var(--text-secondary);font-weight:500;font-size:13px;transition:var(--transition-smooth);background-color:var(--bg-tertiary);border:1px solid var(--border-color)}.theme-toggle-btn:hover{color:var(--text-primary);background-color:var(--border-color)}.theme-toggle-btn .sun-icon{display:none}:root.light-theme .theme-toggle-btn .moon-icon{display:none}:root.light-theme .theme-toggle-btn .sun-icon{display:block}.header-lang-toggle{display:flex;background-color:var(--bg-tertiary);border-radius:var(--border-radius-sm);padding:3px;gap:2px;border:1px solid var(--border-color)}.header-lang-toggle .lang-btn{padding:4px 10px;font-size:12px;font-weight:600;border-radius:4px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;transition:var(--transition-smooth)}.header-lang-toggle .lang-btn:hover{color:var(--text-primary)}.header-lang-toggle .lang-btn.active{background-color:var(--primary);color:#fff}.lang-dropdown{position:relative}.lang-dropdown-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:var(--transition-smooth)}.lang-dropdown-btn:hover{color:var(--text-primary);background:var(--border-color)}.lang-dropdown-btn svg{width:16px;height:16px}.lang-dropdown-btn .dropdown-arrow{width:14px;height:14px}.lang-dropdown.open .lang-dropdown-btn .dropdown-arrow{transform:rotate(180deg)}.lang-dropdown-menu{position:absolute;top:calc(100% + 4px);right:0;min-width:140px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);box-shadow:var(--shadow-lg);padding:6px;display:none;flex-direction:column;gap:2px;z-index:100}.lang-dropdown.open .lang-dropdown-menu{display:flex}.lang-option{padding:8px 12px;background:transparent;border:none;border-radius:var(--border-radius-sm);color:var(--text-secondary);font-size:13px;font-weight:500;text-align:left;cursor:pointer;transition:var(--transition-smooth)}.lang-option:hover{background:var(--bg-tertiary);color:var(--text-primary)}.lang-option.active{background:var(--primary);color:#fff}.header-right .theme-toggle-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:var(--border-radius-md);background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;transition:var(--transition-smooth)}.header-right .theme-toggle-btn:hover{color:var(--text-primary);background:var(--border-color)}.header-right .theme-toggle-btn .sun-icon{display:none}:root.light-theme .header-right .theme-toggle-btn .moon-icon{display:none}:root.light-theme .header-right .theme-toggle-btn .sun-icon{display:block}.app-main{flex-grow:1;min-height:100vh;display:flex;flex-direction:column;transition:var(--transition-smooth);width:100%}.app-header{height:var(--header-height);background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 40px;position:sticky;top:0;z-index:90}.header-left{display:flex;align-items:center;gap:0;flex:1;min-width:0}.current-section-title{display:none}.header-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.header-stat{display:flex;align-items:center;gap:8px;background-color:#6366f11a;color:var(--primary);padding:8px 16px;border-radius:var(--border-radius-lg);font-size:14px;font-weight:600;border:1px solid rgba(99,102,241,.15)}.header-login-btn,.kofi-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--border-radius-md);font-size:13px;font-weight:600;text-decoration:none;transition:var(--transition-smooth);cursor:pointer}.header-login-btn{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color)}.header-login-btn:hover{background:var(--primary);color:var(--on-primary);border-color:var(--primary);transform:translateY(-2px)}.kofi-btn{background:linear-gradient(135deg,var(--tertiary),var(--tertiary-hover));color:var(--on-tertiary);border:none;box-shadow:0 4px 12px #00b4c84d}.kofi-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00b4c866}.join-class-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--border-radius-md);background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border:none;box-shadow:0 4px 12px #6366f14d;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s ease}.join-class-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.header-right{display:flex;align-items:center;gap:12px}.sidebar-lang-toggle{display:flex;gap:4px;padding:4px;background:var(--bg-tertiary);border-radius:var(--border-radius-md);margin-bottom:12px;width:100%}.sidebar-lang-toggle .lang-btn{flex:1;padding:8px 12px;border-radius:var(--border-radius-sm);background:transparent;color:var(--text-secondary);font-size:13px;font-weight:600;border:none;cursor:pointer;transition:var(--transition-smooth)}.sidebar-lang-toggle .lang-btn:hover{color:var(--primary)}.sidebar-lang-toggle .lang-btn.active{background:var(--primary);color:var(--on-primary)}.jlpt-level-selector{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:8px 12px;background:var(--bg-tertiary);border-radius:var(--border-radius-md);width:100%}.jlpt-level-selector label{font-size:12px;color:var(--text-secondary);font-weight:500;white-space:nowrap}.jlpt-level-selector select{flex:1;padding:6px 8px;border-radius:var(--border-radius-sm);border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);font-size:13px;font-weight:600;cursor:pointer}.jlpt-level-selector select:focus{outline:none;border-color:var(--primary)}.signup-modal-container{max-width:900px!important;width:calc(100% - 32px);max-height:90vh;overflow-y:auto;border-radius:var(--border-radius-lg)}.signup-modal-body{padding:24px}.form-group.error{border-left:3px solid var(--accent-red);padding-left:12px;background:#ff473a0a;border-radius:0 var(--border-radius-sm) var(--border-radius-sm) 0}.form-group.error input{border-color:var(--accent-red)!important;background-color:#ff473a0d}#signup-phone:not(:placeholder-shown):invalid{border-color:var(--accent-red)!important;background-color:#ff473a0d}label.required:after{content:" *";color:var(--accent-red)}.signup-title{font-size:24px;font-weight:700;color:var(--text-primary);margin-bottom:8px;text-align:center}.signup-subtitle{font-size:14px;color:var(--text-secondary);text-align:center;margin-bottom:24px}.class-info-screen{display:flex;flex-direction:column;gap:20px}.class-info-desc{font-size:14px;color:var(--text-secondary);text-align:center;line-height:1.6;margin:0}.class-info-includes{background:var(--bg-secondary);border-radius:var(--border-radius-lg);padding:16px 20px}.class-info-includes h4{margin:0 0 12px;font-size:15px;font-weight:600;color:var(--text-primary)}.class-info-includes ul{margin:0;padding-left:20px;list-style:disc}.class-info-includes ul li{font-size:13px;color:var(--text-secondary);margin-bottom:6px;line-height:1.5}.class-info-pricing{background:var(--bg-secondary);border-radius:var(--border-radius-lg);padding:16px 20px}.class-info-pricing h4{margin:0 0 12px;font-size:15px;font-weight:600;color:var(--text-primary)}.pricing-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.pricing-card{display:flex;flex-direction:column;gap:4px;padding:12px;background:var(--bg-primary);border-radius:var(--border-radius-md);border:1px solid var(--border-color)}.pricing-title{font-size:13px;font-weight:600;color:var(--text-primary)}.pricing-price{font-size:18px;font-weight:700;color:var(--accent-primary)}.pricing-desc{font-size:11px;color:var(--text-secondary);line-height:1.4}.class-info-note{font-size:12px;color:var(--text-secondary);text-align:center;margin:0;font-style:italic}#class-info-start-btn{display:block;width:100%;padding:14px 28px;background:#6366f1;color:#fff;border:none;border-radius:var(--border-radius-md);font-size:16px;font-weight:700;cursor:pointer;transition:all .2s ease;margin-top:8px;box-shadow:0 4px 14px #6366f14d}#class-info-start-btn:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.signup-form{display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:14px;font-weight:600;color:var(--text-primary)}.form-group input,.form-group select{padding:10px 12px;border:1px solid var(--border-color);border-radius:var(--border-radius-md);background:var(--bg-secondary);color:var(--text-primary);font-size:14px;transition:border-color .2s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--primary)}.form-group input::placeholder{color:var(--text-muted)}.required{color:var(--primary)}.checkbox-group{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.checkbox-label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:400;color:var(--text-secondary);cursor:pointer}.checkbox-label input{width:16px;height:16px;accent-color:var(--primary)}.schedule-header span{font-size:11px;color:var(--text-muted);text-align:center;font-weight:500}.day-label{font-size:12px;font-weight:600;color:var(--text-primary)}.form-step-indicator{display:flex;justify-content:space-between;margin-bottom:28px;padding:0 16px;position:relative}.form-step-indicator:before{content:"";position:absolute;top:14px;left:40px;right:40px;height:3px;background:var(--bg-tertiary);border-radius:2px;z-index:0}.step-item{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;position:relative;z-index:1}.step-item span{width:32px;height:32px;border-radius:50%;background:var(--bg-tertiary);border:3px solid var(--bg-tertiary);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--text-muted);transition:all .3s cubic-bezier(.34,1.56,.64,1)}.step-item.active span{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 0 4px rgba(var(--primary-rgb, 99, 102, 241),.2)}.step-item.completed span{background:var(--success);border-color:var(--success);color:#fff}.form-section{display:none}.form-section.active{display:block;animation:fadeIn .3s ease}.section-title{font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--border-color)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.form-section .form-group{margin-bottom:24px}.form-section .form-group:last-child{margin-bottom:0}.form-section label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.card-selector{display:flex;flex-wrap:wrap;gap:10px}.card-selector.compact{gap:8px}.card-option{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 16px;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--border-radius-md);cursor:pointer;transition:all .2s ease;min-width:90px;flex:1;color:var(--text-secondary);font-size:13px;font-weight:500}.card-selector.compact .card-option{padding:10px 12px;min-width:70px}.card-option:hover{border-color:var(--primary);background:var(--bg-secondary);transform:translateY(-2px)}.card-option.selected{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 4px 12px rgba(var(--primary-rgb, 99, 102, 241),.3);transform:translateY(-2px)}.card-option .card-title{font-weight:600;font-size:14px}.card-option .card-sub{font-size:11px;opacity:.8}.card-option .card-icon{font-size:20px}.chip-selector{display:flex;flex-wrap:wrap;gap:8px}.chip-option{padding:8px 16px;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:999px;cursor:pointer;transition:all .2s ease;color:var(--text-secondary);font-size:13px;font-weight:500}.chip-option:hover{border-color:var(--primary);color:var(--primary);background:var(--bg-secondary)}.chip-option.selected{background:var(--primary);border-color:var(--primary);color:#fff}.sub-field{margin-top:12px}.sub-text-input{width:100%;padding:10px 14px;border:2px solid var(--border-color);border-radius:var(--border-radius-md);background:var(--bg-primary);color:var(--text-primary);font-size:14px;font-family:inherit;transition:border-color .2s ease}.sub-text-input:focus{outline:none;border-color:var(--primary)}.sub-text-input::placeholder{color:var(--text-muted)}.form-nav{display:flex;justify-content:space-between;gap:12px;margin-top:32px;padding-top:20px;border-top:1px solid var(--border-color)}.form-nav-btn{padding:14px 28px;border:none;border-radius:var(--border-radius-md);font-weight:700;font-size:14px;cursor:pointer;transition:all .2s ease;letter-spacing:.3px}.back-btn{background:var(--bg-tertiary);color:var(--text-secondary);border:2px solid var(--border-color)}.back-btn:hover{background:var(--bg-secondary);border-color:var(--text-muted);color:var(--text-primary)}.next-btn,.submit-btn{background:#6366f1;color:#fff;flex:1;font-weight:700;box-shadow:0 4px 14px #6366f14d}.next-btn:hover,.submit-btn:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 6px 20px rgba(var(--primary-rgb, 99, 102, 241),.4)}.next-btn:disabled,.submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.schedule-grid{display:flex;flex-direction:column;gap:4px;margin-top:8px;overflow-x:auto}.schedule-header{display:grid;grid-template-columns:52px repeat(6,1fr);gap:4px;padding:0 2px}.schedule-header span{font-size:11px;color:var(--text-muted);text-align:center;font-weight:600}.schedule-row{display:grid;grid-template-columns:52px repeat(6,1fr);gap:4px;align-items:center;padding:4px 2px;border-radius:var(--border-radius-sm)}.schedule-row:nth-child(2n){background:var(--bg-tertiary)}.day-label{font-size:12px;font-weight:700;color:var(--text-primary)}.schedule-row .checkbox-label{display:flex;justify-content:center;padding:2px}.schedule-grid.error{outline:2px solid var(--accent-red);outline-offset:4px;border-radius:var(--border-radius-sm)}.form-section textarea{width:100%;padding:12px 14px;border:2px solid var(--border-color);border-radius:var(--border-radius-md);background:var(--bg-primary);color:var(--text-primary);font-size:14px;font-family:inherit;resize:vertical;transition:border-color .2s ease}.form-section textarea:focus{outline:none;border-color:var(--primary)}.form-section textarea::placeholder{color:var(--text-muted)}.form-section.error{animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.signup-submit-btn{padding:12px 24px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border:none;border-radius:var(--border-radius-md);font-weight:600;font-size:16px;cursor:pointer;transition:all .2s ease;margin-top:8px}.signup-submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.signup-note{font-size:11px;color:var(--text-muted);text-align:center;margin-top:12px}.app-body{padding:40px;flex-grow:1;display:flex;flex-direction:column;max-width:1400px;margin:0 auto;width:100%;box-sizing:border-box}.app-footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:24px 40px;margin-top:auto}.footer-content{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.footer-brand{display:flex;align-items:center;gap:16px}.footer-logo{display:flex;align-items:center;gap:8px}.footer-logo .logo-icon{width:28px;height:28px;font-size:16px}.footer-logo .logo-text{font-size:16px}.footer-tagline{color:var(--text-secondary);font-size:13px}.footer-links{display:flex;gap:24px}.footer-links a{color:var(--text-secondary);text-decoration:none;font-size:13px;transition:color .2s ease}.footer-links a:hover{color:var(--primary)}.footer-copyright{color:var(--text-muted);font-size:12px;flex-shrink:0}@media (max-width: 768px){.app-footer{padding:20px 24px}.footer-content{flex-direction:column;text-align:center;gap:16px}.footer-brand{flex-direction:column;gap:8px}.footer-links{flex-wrap:wrap;justify-content:center;gap:16px}}.fade-in{animation:fadeIn .4s ease-out forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero-card{background:linear-gradient(135deg,#6366f133,#121420cc);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--border-radius-lg);padding:40px;margin-bottom:40px;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}.hero-card:before{content:"";position:absolute;top:-50%;right:-10%;width:300px;height:300px;background:radial-gradient(circle,rgba(99,102,241,.15) 0%,transparent 70%);border-radius:50%;z-index:0}.hero-tag{display:inline-block;background-color:var(--primary);color:var(--on-primary);font-size:12px;font-weight:700;padding:4px 12px;border-radius:var(--border-radius-sm);text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;position:relative;z-index:1}.hero-card h1{font-size:36px;font-weight:700;margin-bottom:12px;color:var(--text-primary);position:relative;z-index:1}.hero-card p{font-size:16px;color:var(--text-secondary);max-width:600px;line-height:1.6;position:relative;z-index:1}.dashboard-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:32px}.dashboard-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px;box-shadow:var(--shadow-md)}.dashboard-card h3{font-size:18px;font-weight:600;margin-bottom:24px;color:var(--text-primary);display:flex;justify-content:space-between;align-items:center}.kana-toggle-container{display:flex;background-color:var(--bg-tertiary);padding:4px;border-radius:var(--border-radius-sm);gap:4px}.kana-toggle-btn{padding:6px 16px;font-size:13px;font-weight:600;color:var(--text-secondary);border-radius:4px;transition:var(--transition-smooth)}.kana-toggle-btn.active{background-color:var(--bg-secondary);color:var(--primary);box-shadow:var(--shadow-sm)}.kana-chart-wrapper{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:24px;margin-bottom:32px}.kana-grid-container{max-height:700px;overflow-y:auto;padding-right:8px;max-width:100%}.kana-tips-section{margin-top:16px}.kana-tips-section>h2{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:20px;display:flex;align-items:center;gap:10px}.kana-tips-section>h2 svg{width:24px;height:24px;color:var(--primary);stroke-width:2}.kana-tips-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.kana-tip-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px 24px}.kana-tip-card h3{font-size:16px;font-weight:700;color:var(--primary);margin-bottom:10px}.kana-tip-card p{font-size:14px;color:var(--text-secondary);line-height:1.6}.kana-tip-card.tip-full{grid-column:1 / -1}.tip-desc{margin-bottom:16px}.pronunciation-comparison{display:flex;flex-direction:column;gap:12px}.pron-comparison-row{display:flex;align-items:center;gap:16px}.pron-kana-box{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--primary);border-radius:var(--radius-md);padding:16px 24px;min-width:100px}.pron-kana-char{font-family:var(--font-japanese);font-size:36px;font-weight:700;color:#fff;line-height:1}.pron-romaji{font-size:13px;color:#ffffffd9;font-weight:600}.pron-vs{font-size:14px;color:var(--text-muted);font-weight:600}.pron-wrong-box{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--bg-tertiary);border:2px dashed var(--accent-red);border-radius:var(--radius-md);padding:16px 24px;min-width:100px;opacity:.7}.pron-wrong-char{font-size:24px;color:var(--accent-red);font-weight:600;text-decoration:line-through}.pron-wrong-label{font-size:11px;color:var(--text-muted)}.kana-table{width:100%;border-collapse:separate;border-spacing:8px;table-layout:fixed}.kana-corner{width:48px}.kana-consonant-header{font-family:var(--font-primary);font-size:14px;font-weight:700;color:var(--primary-light);text-align:center;padding:12px 8px;border-bottom:3px solid var(--primary);min-width:60px;letter-spacing:1px;text-transform:lowercase}.kana-table thead tr{text-align:center}.kana-cell{background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--border-radius-xl);padding:16px 8px;text-align:center;transition:all .2s ease-out;cursor:pointer;box-shadow:var(--shadow-clay)}:root.light-theme .kana-cell{background:var(--bg-secondary);border-color:var(--border-new)}.kana-cell:not(.empty):hover{transform:translateY(-4px) scale(1.02);border-color:var(--primary);box-shadow:var(--shadow-clay-hover)}.kana-cell:not(.empty):active{transform:translateY(-2px) scale(.98);transition:all .1s ease-out}.kana-cell.empty{background:transparent;border:none;box-shadow:none;cursor:default}.kana-cell .kana-char{font-family:var(--font-japanese);font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:6px;text-shadow:0 2px 4px rgba(0,0,0,.1)}.kana-cell:not(.empty):hover .kana-char{color:var(--primary);text-shadow:0 0 20px rgba(79,70,229,.3)}.kana-cell .kana-romaji{font-size:13px;font-weight:500;color:var(--text-muted);text-transform:lowercase;letter-spacing:.5px}.intro-bio{display:flex;flex-direction:column;gap:20px}.profile-avatar-container{display:flex;align-items:center;gap:16px;margin-bottom:8px}.profile-avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-light));display:flex;align-items:center;justify-content:center;font-size:28px;color:#fff;box-shadow:0 4px 10px #3867d666}.profile-info h4{font-size:18px;font-weight:600;color:var(--text-primary)}.profile-info p{font-size:13px;color:var(--text-muted)}.bio-text{font-size:14px;color:var(--text-secondary);line-height:1.7}.bio-highlights{display:flex;flex-direction:column;gap:12px}.highlight-item{display:flex;align-items:flex-start;gap:12px}.highlight-icon{width:24px;height:24px;border-radius:50%;background-color:#6366f11a;color:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.highlight-text p{font-size:14px;color:var(--text-secondary)}.highlight-text strong{color:var(--text-primary)}.roadmap-intro{max-width:700px;margin-bottom:40px}.roadmap-intro h1{font-size:32px;font-weight:700;margin-bottom:12px}.roadmap-intro p{font-size:16px;color:var(--text-secondary);line-height:1.6}.roadmap-disclaimer{margin-top:16px!important;padding:14px 16px;background:#6366f126;border:1px solid rgba(99,102,241,.3);border-radius:var(--border-radius-md);font-size:14px!important;color:var(--text-primary)!important;line-height:1.5}.small-kana-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px;margin-bottom:40px}.small-kana-header{display:flex;align-items:center;gap:16px;margin-bottom:16px}.small-kana-header h2{font-size:22px;font-weight:700;color:var(--text-primary);margin:0}.small-kana-badge{background:var(--primary);color:#fff;font-size:12px;font-weight:600;padding:4px 12px;border-radius:20px}.small-kana-desc{font-size:15px;color:var(--text-secondary);line-height:1.6;margin-bottom:24px}.small-kana-section h3{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.small-kana-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:24px}.small-kana-card{background:var(--bg-tertiary);border-radius:var(--border-radius-md);padding:16px;display:flex;flex-direction:column;gap:6px}.small-kana-char{font-size:28px;font-weight:700;color:var(--primary)}.small-kana-romaji{font-size:14px;color:var(--text-muted)}.small-kana-used{font-size:12px;color:var(--text-muted)}.small-kana-hiragana{background:var(--bg-tertiary);border-radius:var(--border-radius-md);padding:16px}.small-kana-hiragana h4{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:8px}.small-kana-hiragana p{font-size:13px;color:var(--text-secondary);line-height:1.5;margin:0}.roadmap-go-btn{display:inline-block;margin-top:16px;padding:10px 20px;background:var(--primary);color:#fff;border-radius:var(--border-radius-md);font-size:14px;font-weight:600;text-decoration:none;transition:var(--transition-smooth)}.roadmap-go-btn:hover{background:var(--primary-hover);transform:translateY(-2px)}.roadmap-timeline{position:relative;max-width:800px;margin:0 auto;padding:20px 0}.roadmap-timeline:after{content:"";position:absolute;width:4px;background-color:var(--border-color);top:0;bottom:0;left:50%;margin-left:-2px;z-index:1}.timeline-container{padding:10px 40px;position:relative;background-color:inherit;width:50%;z-index:2}.timeline-container:after{content:"";position:absolute;width:20px;height:20px;right:-10px;background-color:var(--bg-primary);border:4px solid var(--primary);top:25px;border-radius:50%;z-index:3;transition:var(--transition-smooth)}.timeline-left{left:0}.timeline-right{left:50%}.timeline-right:after{left:-10px}.timeline-card{padding:24px;background-color:var(--bg-secondary);border:1px solid var(--border-color);position:relative;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);cursor:pointer;transition:var(--transition-smooth)}.timeline-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.timeline-container:hover:after{background-color:var(--primary);box-shadow:0 0 12px var(--primary)}.timeline-phase{font-size:11px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}.timeline-card h3{font-size:18px;font-weight:600;margin-bottom:8px;color:var(--text-primary)}.timeline-card p{font-size:14px;color:var(--text-secondary);line-height:1.5;margin-bottom:12px}.timeline-meta{display:flex;gap:16px;font-size:12px;color:var(--text-muted)}.timeline-meta span{display:flex;align-items:center;gap:4px}.roadmap-drawer{display:none;background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:16px;margin-top:12px;animation:fadeIn .3s ease-out}.roadmap-drawer.active{display:block}.roadmap-drawer h4{font-size:14px;font-weight:600;margin-bottom:8px;color:var(--text-primary)}.roadmap-drawer ul{list-style:none}.roadmap-drawer li{font-size:13px;color:var(--text-secondary);margin-bottom:6px;display:flex;align-items:center;gap:8px}.roadmap-drawer li:before{content:"•";color:var(--primary);font-weight:700}.level-header{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:32px;margin-bottom:32px;box-shadow:var(--shadow-md);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.level-title-section{max-width:600px}.level-title-section h1{font-size:30px;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:16px}.level-badge{font-size:14px;font-weight:700;padding:4px 12px;border-radius:var(--border-radius-sm);color:#fff}.level-badge.n5{background-color:var(--n5-color)}.level-badge.n4{background-color:var(--n4-color)}.level-badge.n3{background-color:var(--n3-color)}.level-title-section p{font-size:15px;color:var(--text-secondary);line-height:1.5}.hub-tabs{display:flex;border-bottom:1px solid var(--border-color);margin-bottom:32px;gap:8px;overflow-x:auto}.hub-tab{padding:12px 24px;font-size:15px;font-weight:600;color:var(--text-secondary);position:relative;transition:var(--transition-smooth)}.hub-tab:hover{color:var(--text-primary)}.hub-tab.active{color:var(--primary)}.hub-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background-color:var(--primary);border-radius:3px 3px 0 0}.hub-panel{display:none;animation:fadeIn .4s ease-out}.hub-panel.active{display:block}.kanji-grid-layout{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}.kanji-box-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:var(--shadow-sm);transition:var(--transition-smooth);position:relative}.kanji-box-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-md)}.kanji-character{font-family:var(--font-japanese);font-size:48px;font-weight:700;color:var(--text-primary);margin-bottom:12px}.kanji-meaning{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.kanji-readings-mini{font-size:14px;color:var(--text-secondary);width:100%;margin-bottom:16px;text-align:left;display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--border-color);padding-top:12px}.kanji-readings-mini span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kanji-draw-btn{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);width:100%;padding:8px 12px;border-radius:var(--border-radius-md);font-size:13px;font-weight:600;transition:var(--transition-smooth);display:flex;align-items:center;justify-content:center;gap:6px}.kanji-draw-btn:hover{border-color:var(--primary);color:var(--primary);background-color:#6366f10d}.grammar-container{display:flex;flex-direction:column;gap:20px}.grammar-item-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px;box-shadow:var(--shadow-sm)}.grammar-header-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding-bottom:16px;margin-bottom:16px;flex-wrap:wrap;gap:12px}.grammar-title{font-size:18px;font-weight:700;color:var(--primary)}.grammar-rule-badge{background-color:var(--bg-tertiary);color:var(--text-secondary);font-family:var(--font-japanese);font-size:13px;padding:6px 14px;border-radius:var(--border-radius-sm);border:1px solid var(--border-color)}.grammar-desc{font-size:15px;color:var(--text-secondary);line-height:1.6;margin-bottom:20px}.grammar-examples{display:flex;flex-direction:column;gap:16px}.grammar-ex-item{background-color:var(--bg-tertiary);border-radius:var(--border-radius-md);padding:16px;border-left:4px solid var(--primary)}.grammar-japanese-sentence{font-family:var(--font-japanese);font-size:18px;font-weight:500;line-height:1.8;color:var(--text-primary);margin-bottom:6px}ruby rt{font-size:10px;color:var(--primary-light);-webkit-user-select:none;user-select:none;transition:opacity .2s}body.hide-furigana ruby rt{opacity:0}.grammar-english-sentence{font-size:14px;color:var(--text-secondary)}.grammar-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}.furigana-toggle{display:flex;align-items:center;gap:8px;background-color:var(--bg-secondary);padding:8px 16px;border-radius:var(--border-radius-md);border:1px solid var(--border-color);font-size:14px;color:var(--text-secondary);cursor:pointer;font-weight:600}.toggle-switch{width:36px;height:20px;background-color:var(--border-color);border-radius:10px;position:relative;transition:var(--transition-smooth)}.toggle-switch:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background-color:var(--text-muted);top:3px;left:3px;transition:var(--transition-smooth)}.furigana-toggle.active .toggle-switch{background-color:var(--primary)}.furigana-toggle.active .toggle-switch:after{left:19px;background-color:#fff}.vocab-workspace{display:flex;flex-direction:column;gap:32px}.flashcard-deck{max-width:420px;width:100%;margin:0 auto;perspective:1000px;height:260px}.flashcard{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1);cursor:pointer}.flashcard.flipped{transform:rotateY(180deg)}.card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:var(--border-radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;box-shadow:var(--shadow-lg);border:1px solid var(--border-color)}.card-front{background-color:var(--bg-secondary);color:var(--text-primary)}.card-back{background-color:var(--bg-tertiary);color:var(--text-primary);transform:rotateY(180deg);border-color:#6366f133}.card-japanese{font-family:var(--font-japanese);font-size:42px;font-weight:700;margin-bottom:8px}.card-furigana{font-size:16px;color:var(--primary-light);margin-bottom:24px}.card-meaning{font-size:22px;font-weight:600;margin-bottom:12px;text-align:center}.card-type{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);background-color:var(--border-color);padding:4px 12px;border-radius:var(--border-radius-sm)}.card-hint{position:absolute;bottom:20px;font-size:11px;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}.deck-controls{display:flex;justify-content:center;align-items:center;gap:24px}.deck-btn{background-color:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);transition:var(--transition-smooth)}.deck-btn:hover{transform:scale(1.1);border-color:var(--primary);color:var(--primary)}.deck-btn:active{transform:scale(.95)}.deck-progress{font-size:14px;font-weight:600;color:var(--text-secondary)}.vocab-list-container{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px;box-shadow:var(--shadow-md)}.vocab-table-wrapper{overflow-x:auto}.vocab-table{width:100%;border-collapse:collapse;text-align:left}.vocab-table th{padding:16px;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);border-bottom:2px solid var(--border-color)}.vocab-table td{padding:16px;font-size:15px;border-bottom:1px solid var(--border-color);color:var(--text-secondary)}.vocab-table tr:last-child td{border-bottom:none}.vocab-table tr:hover td{background-color:#ffffff03}.vocab-jp-cell{font-family:var(--font-japanese);font-size:18px!important;font-weight:700;color:var(--text-primary)}.vocab-audio-btn{color:var(--text-muted);transition:var(--transition-smooth);display:inline-flex;align-items:center}.vocab-audio-btn:hover{color:var(--primary);transform:scale(1.1)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;min-height:100vh;background-color:#000000d9;z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease}.modal-overlay.active{opacity:1;pointer-events:all}.modal-container{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:32px;position:relative;max-width:900px;width:calc(100% - 32px);box-shadow:var(--shadow-lg);transform:scale(.9);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.modal-overlay.active .modal-container{transform:scale(1)}.modal-close{position:absolute;top:20px;right:20px;color:var(--text-muted);transition:var(--transition-smooth)}.modal-close:hover{color:var(--text-primary);transform:rotate(90deg)}.hero-section{background:linear-gradient(135deg,#4f46e526,#121420e6 60%,#121420f2);border:1px solid var(--glass-border);border-radius:var(--border-radius-lg);padding:48px;margin-bottom:40px;position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;top:-30%;right:-5%;width:400px;height:400px;background:radial-gradient(circle,rgba(79,70,229,.2) 0%,transparent 70%);border-radius:50%;z-index:0}.hero-section:after{content:"";position:absolute;bottom:-20%;left:10%;width:300px;height:300px;background:radial-gradient(circle,rgba(129,140,248,.1) 0%,transparent 70%);border-radius:50%;z-index:0}.hero-content{position:relative;z-index:1;max-width:700px}.hero-tag{display:inline-block;background-color:var(--primary);color:var(--on-primary);font-size:12px;font-weight:700;padding:6px 14px;border-radius:var(--border-radius-sm);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:20px}.hero-section h1{font-size:40px;font-weight:700;line-height:1.2;margin-bottom:16px;color:var(--text-primary)}.hero-section p{font-size:17px;color:var(--text-secondary);line-height:1.7;max-width:580px}.hero-actions{display:flex;gap:16px;margin-top:28px;flex-wrap:wrap}:root.light-theme .hero-section{background:linear-gradient(135deg,#6366f11f,#f8fafcf2 60%,#f8fafcfa);border-color:#6366f126}:root.light-theme .hero-section:before{background:radial-gradient(circle,rgba(99,102,241,.15) 0%,transparent 70%)}:root.light-theme .hero-section:after{background:radial-gradient(circle,rgba(129,140,248,.08) 0%,transparent 70%)}:root.light-theme .hero-card{background:linear-gradient(135deg,#6366f11a,#ffffffe6);border-color:#6366f11f;box-shadow:0 4px 24px #6366f114}:root.light-theme .hero-card:before{background:radial-gradient(circle,rgba(99,102,241,.1) 0%,transparent 70%)}.btn-cta-primary{background-color:var(--primary);color:var(--on-primary);border:1px solid var(--primary);padding:14px 28px;border-radius:var(--border-radius-md);font-weight:600;font-size:15px;transition:var(--transition-smooth);display:inline-flex;align-items:center;gap:8px}.btn-cta-primary:hover{background-color:var(--primary-hover);border-color:var(--primary-hover)}.btn-cta-secondary{background-color:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color);padding:14px 28px;border-radius:var(--border-radius-md);font-weight:600;font-size:15px;transition:var(--transition-smooth);display:inline-flex;align-items:center;gap:8px}.btn-cta-secondary:hover{border-color:var(--primary);color:var(--primary)}.featured-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-bottom:40px}.featured-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px;transition:var(--transition-smooth);cursor:pointer;display:flex;flex-direction:column}.featured-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.featured-card-icon{width:52px;height:52px;border-radius:var(--border-radius-md);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:20px}.featured-card-icon.grammar{background:linear-gradient(135deg,#6366f126,#6366f10d)}.featured-card-icon.culture{background:linear-gradient(135deg,#3867d626,#3867d60d)}.featured-card-icon.blog{background:linear-gradient(135deg,#f8a5c226,#f8a5c20d)}.featured-card h3{font-size:18px;font-weight:600;color:var(--text-primary);margin-bottom:8px}.featured-card p{font-size:14px;color:var(--text-secondary);line-height:1.6;flex-grow:1}.featured-card-link{margin-top:16px;font-size:14px;font-weight:600;color:var(--primary);display:flex;align-items:center;gap:6px}.stats-row{display:flex;gap:32px;flex-wrap:wrap;margin-bottom:40px}.stat-item{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px 28px;display:flex;align-items:center;gap:16px;flex:1;min-width:180px}.stat-icon{width:44px;height:44px;border-radius:50%;background-color:#6366f11a;color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:20px}.stat-info h4{font-size:22px;font-weight:700;color:var(--text-primary)}.stat-info p{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.home-section-title{font-size:20px;font-weight:700;margin-bottom:16px;margin-top:40px;color:var(--text-primary)}.home-quickstart{margin-bottom:32px}.quickstart-steps{display:flex;flex-direction:column;gap:12px}.quickstart-card{display:flex;align-items:center;gap:16px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:16px 20px;text-decoration:none;color:var(--text-primary);transition:var(--transition-smooth);box-shadow:var(--shadow-clay)}:root.light-theme .quickstart-card{border-color:var(--border-new)}.quickstart-card:hover{border-color:var(--primary);transform:translate(4px);box-shadow:var(--shadow-clay-hover)}.quickstart-card svg{color:var(--text-muted);flex-shrink:0;transition:var(--transition-smooth)}.quickstart-card:hover svg{color:var(--primary);transform:translate(4px)}.quickstart-num{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:var(--on-primary);font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 10px #4f46e54d}.quickstart-content{flex:1}.quickstart-content h3{font-size:15px;font-weight:600;margin-bottom:2px}.quickstart-content p{font-size:13px;color:var(--text-secondary);margin:0}.home-sections-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}.home-section-card{display:flex;align-items:center;gap:14px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:18px;text-decoration:none;color:var(--text-primary);transition:var(--transition-smooth);box-shadow:var(--shadow-clay)}:root.light-theme .home-section-card{border-color:var(--border-new)}.home-section-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:var(--shadow-clay-hover)}.home-section-icon{width:48px;height:48px;border-radius:var(--border-radius-md);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;font-family:var(--font-japanese);font-weight:700;box-shadow:var(--shadow-sm)}.kana-icon{background:linear-gradient(135deg,#4f46e526,#818cf81a);color:var(--primary)}.kanji-icon{background:linear-gradient(135deg,#4f46e533,#818cf81f);color:var(--primary-light)}.anki-icon{background:linear-gradient(135deg,#16a34a26,#22c55e1a);color:var(--accent-green)}.grammar-icon{background:linear-gradient(135deg,#4f46e51f,#818cf814);color:var(--primary-light)}.vocab-icon{background:linear-gradient(135deg,#a855f726,#c084fc1a);color:var(--accent-purple)}.culture-icon{background:linear-gradient(135deg,#ec489926,#f472b61a);color:var(--primary-light)}.home-section-text h3{font-size:14px;font-weight:600;margin-bottom:3px}.home-section-text p{font-size:12px;color:var(--text-secondary);margin:0;line-height:1.5}.home-blog-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:40px}.home-blog-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:24px;text-decoration:none;color:var(--text-primary);transition:var(--transition-smooth)}.home-blog-card:hover{border-color:var(--primary);transform:translateY(-3px)}.blog-card-tag{display:inline-block;font-size:11px;font-weight:600;color:var(--primary);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}.home-blog-card h3{font-size:16px;font-weight:600;margin-bottom:8px}.home-blog-card p{font-size:13px;color:var(--text-secondary);margin:0 0 12px;line-height:1.6}.home-blog-link{font-size:13px;font-weight:600;color:var(--primary)}.home-why-section{margin-bottom:48px}.home-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.home-why-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:24px;text-align:center}.home-why-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;background:linear-gradient(135deg,var(--primary-dark),var(--primary));border-radius:var(--border-radius-md);margin-bottom:16px;color:var(--text-inverse)}.home-why-card h3{font-size:15px;font-weight:600;margin-bottom:8px}.home-why-card p{font-size:13px;color:var(--text-secondary);margin:0;line-height:1.6}.home-quick-nav{margin-bottom:48px}.home-quick-nav-subtitle{font-size:14px;color:var(--text-secondary);margin:-8px 0 24px}.page-header{margin-bottom:32px}.page-header h1{font-size:32px;font-weight:700;color:var(--primary);margin-bottom:8px}.page-header p{font-size:16px;color:var(--text-secondary)}.page-header-icon h1{display:flex;align-items:center;gap:12px}.page-header-icon h1 svg{width:36px;height:36px;color:var(--primary)}.principles-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.self-study-principle{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px;transition:var(--transition-smooth)}.self-study-principle:hover{border-color:var(--primary);transform:translateY(-2px)}.self-study-principle h4{font-size:15px;font-weight:700;color:var(--primary);margin-bottom:8px}.self-study-principle p{font-size:13px;color:var(--text-secondary);line-height:1.6}.routine-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.routine-slot{background:linear-gradient(135deg,var(--bg-tertiary),var(--bg-secondary));border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px;text-align:center}.routine-slot h4{font-size:14px;font-weight:700;color:var(--primary);margin-bottom:10px;padding:6px 12px;background:#6366f11a;border-radius:20px;display:inline-block}.routine-slot p{font-size:13px;color:var(--text-secondary);line-height:1.5}.resources-level-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.resource-level-card{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px}.resource-level-card h4{font-size:14px;font-weight:700;color:var(--text-primary);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-color)}.resource-level-card ul{list-style:none;padding:0;margin:0}.resource-level-card li{font-size:13px;color:var(--text-secondary);padding:6px 0 6px 20px;position:relative}.resource-level-card li:before{content:"▸";position:absolute;left:0;color:var(--primary)}.tips-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.tip-item{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:16px 20px;font-size:14px;color:var(--text-secondary);line-height:1.6}.tip-item strong{color:var(--primary);font-weight:700}.grammar-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px}.search-box{display:flex;align-items:center;gap:10px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:10px 16px;min-width:280px}.search-box svg{color:var(--text-muted);flex-shrink:0}.search-box input{background:transparent;border:none;color:var(--text-primary);font-size:14px;width:100%;outline:none}.search-box input::placeholder{color:var(--text-muted)}.level-filter-tabs{display:flex;gap:8px;flex-wrap:wrap}.level-filter-btn{padding:8px 18px;font-size:13px;font-weight:600;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);background-color:var(--bg-secondary);transition:var(--transition-smooth)}.level-filter-btn:hover{border-color:var(--text-muted);color:var(--text-primary)}.level-filter-btn.active{background-color:var(--primary);border-color:var(--primary);color:var(--on-primary)}.grammar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.grammar-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:24px;transition:var(--transition-smooth);cursor:pointer}.grammar-card:hover{transform:translateY(-3px);border-color:var(--primary);box-shadow:var(--shadow-md)}.grammar-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.grammar-pattern{font-family:var(--font-japanese);font-size:22px;font-weight:700;color:var(--primary)}.grammar-level-badge{font-size:11px;font-weight:700;padding:4px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.grammar-level-badge.n5{background-color:#05c46b26;color:var(--n5-color)}.grammar-level-badge.n4{background-color:#ffc04826;color:var(--n4-color)}.grammar-level-badge.n3{background-color:#ff5e5726;color:var(--n3-color)}.grammar-level-badge.n2{background-color:#626cf526;color:#6266f1}.grammar-level-badge.n1{background-color:#a855f726;color:#a855f7}.grammar-card h3{font-size:15px;font-weight:500;color:var(--text-secondary);line-height:1.5;margin-bottom:16px}.grammar-card-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border-color);padding-top:14px}.grammar-learned{font-size:12px;color:var(--n5-color);display:flex;align-items:center;gap:4px}.grammar-learned svg{width:14px;height:14px}.culture-detail{width:100%}.culture-detail-header{margin-bottom:32px}.culture-detail-back{display:inline-flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:14px;font-weight:500;margin-bottom:16px;transition:var(--transition-smooth)}.culture-detail-back:hover{color:var(--primary)}.culture-detail-title{display:flex;align-items:center;gap:16px;margin-bottom:12px;flex-wrap:wrap}.culture-detail-title h1{font-family:var(--font-japanese);font-size:36px;font-weight:700;color:var(--primary)}.culture-detail-content{display:flex;flex-direction:column;gap:32px}.grammar-section{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:28px}.grammar-section h2{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:16px;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:8px}.grammar-section h2 svg{color:var(--primary)}.bilingual-explanation{display:grid;grid-template-columns:1fr 1fr;gap:24px}.lang-column{padding:20px;background-color:var(--bg-tertiary);border-radius:var(--border-radius-md)}.lang-column h4{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:12px}.lang-column p{font-size:15px;color:var(--text-secondary);line-height:1.7}.lang-column.en,.lang-column.my{border-left:3px solid var(--primary)}.formation-display{font-family:var(--font-japanese);font-size:20px;color:var(--text-primary);background-color:var(--bg-tertiary);padding:20px 24px;border-radius:var(--border-radius-md);text-align:center}.example-sentences{display:flex;flex-direction:column;gap:16px}.example-item{background-color:var(--bg-tertiary);border-radius:var(--border-radius-md);padding:20px;border-left:4px solid var(--primary)}.example-japanese{font-family:var(--font-japanese);font-size:20px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.example-romaji{font-size:14px;color:var(--primary-light);margin-bottom:8px}.example-malay{font-size:14px;color:var(--text-secondary)}.mistakes-box{background-color:#ff5e5714;border:1px solid rgba(255,94,87,.2);border-radius:var(--border-radius-md);padding:20px}.mistakes-box h3{font-size:14px;font-weight:700;color:var(--n3-color);margin-bottom:12px;display:flex;align-items:center;gap:8px}.mistakes-box p{font-size:14px;color:var(--text-secondary);line-height:1.6}.mark-learned-btn{display:flex;align-items:center;gap:10px;padding:14px 24px;background-color:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-secondary);font-weight:600;font-size:15px;transition:var(--transition-smooth);cursor:pointer}.mark-learned-btn:hover{border-color:var(--n5-color);color:var(--n5-color)}.lesson-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}.lesson-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);overflow:hidden;transition:var(--transition-smooth);cursor:pointer}.lesson-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.lesson-card-image{height:140px;display:flex;align-items:center;justify-content:center;font-size:48px}.lesson-card-image.hololive{background:linear-gradient(135deg,#ff6b9d,#c44569)}.lesson-card-image.food{background:linear-gradient(135deg,#ffa06d,#ff6b6b)}.lesson-card-image.seasonal{background:linear-gradient(135deg,#a8e6cf,#88d8b0)}.lesson-card-image.daily{background:linear-gradient(135deg,#74b9ff,#0984e3)}.lesson-card-image.social{background:linear-gradient(135deg,#fd79a8,#e84393)}.lesson-card-content{padding:24px}.lesson-card-meta{display:flex;gap:12px;margin-bottom:12px}.lesson-theme-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:4px 8px;border-radius:4px;background-color:var(--bg-tertiary);color:var(--text-muted)}.lesson-card h3{font-size:17px;font-weight:600;color:var(--text-primary);margin-bottom:8px;line-height:1.4}.lesson-card p{font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:16px}.lesson-card-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border-color);padding-top:16px}.lesson-vocab-count{font-size:12px;color:var(--text-muted)}.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px}.blog-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);overflow:hidden;transition:var(--transition-smooth);cursor:pointer}.blog-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.blog-card-header{padding:24px;display:flex;flex-direction:column;gap:12px}.blog-card-date{font-size:12px;color:var(--text-muted)}.blog-card h3{font-size:18px;font-weight:600;color:var(--text-primary);line-height:1.4}.blog-card-excerpt{font-size:14px;color:var(--text-secondary);line-height:1.6}.blog-card-footer{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-top:1px solid var(--border-color)}.blog-card-tags{display:flex;flex-wrap:wrap;gap:8px}.blog-tag{font-size:11px;padding:4px 8px;border-radius:4px;background-color:var(--bg-tertiary);color:var(--text-muted)}.blog-read-time{font-size:12px;color:var(--text-muted)}.blog-culture-filters{display:flex;gap:12px;margin-bottom:32px;flex-wrap:wrap}.filter-btn{padding:8px 20px;border:1px solid var(--border-color);border-radius:24px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;font-size:14px;transition:all .2s ease}.filter-btn:hover{border-color:var(--primary);color:var(--text-primary)}.filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.blog-culture-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px}.blog-culture-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);overflow:hidden;cursor:pointer;transition:var(--transition-smooth);display:flex;flex-direction:column}.blog-culture-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.blog-card-accent{height:5px;width:100%}.blog-card-blog .blog-card-accent{background:linear-gradient(90deg,var(--primary),var(--primary-light))}.blog-card-culture .blog-card-accent{background:linear-gradient(90deg,var(--accent),var(--accent-light, var(--accent)))}.blog-card-body{padding:20px 24px 24px;display:flex;flex-direction:column;flex:1}.blog-card-top{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}.blog-culture-type-badge{font-size:10px;padding:3px 9px;border-radius:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.blog-culture-type-badge.blog{background:var(--primary);color:#fff}.blog-culture-type-badge.culture{background:var(--accent);color:#fff}.blog-card-tags{display:flex;gap:6px;flex-wrap:wrap}.blog-tag{font-size:10px;padding:2px 8px;border-radius:10px;background:var(--bg-tertiary);color:var(--text-muted);border:1px solid var(--border-color);font-weight:500;text-transform:lowercase;letter-spacing:.3px}.blog-culture-card h3{font-size:17px;font-weight:700;color:var(--text-primary);margin-bottom:10px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.blog-culture-card p{font-size:14px;color:var(--text-secondary);line-height:1.65;margin-bottom:20px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.blog-card-footer{display:flex;align-items:center;gap:16px;margin-top:auto;padding-top:16px;border-top:1px solid var(--border-color)}.blog-card-date{font-size:12px;color:var(--text-muted);font-weight:500}.blog-card-meta{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:5px}.blog-meta-icon{display:flex;align-items:center;flex-shrink:0}.article-header{margin-bottom:32px}.article-header-accent{height:5px;border-radius:4px;margin-bottom:28px;width:80px}.article-header-accent.blog{background:linear-gradient(90deg,var(--primary),var(--primary-light))}.article-header-accent.culture{background:linear-gradient(90deg,var(--accent),var(--accent-light, var(--accent)))}.article-meta{display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}.article-type-badge{font-size:10px;padding:3px 9px;border-radius:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.article-type-badge.blog{background:var(--primary);color:#fff}.article-type-badge.culture{background:var(--accent);color:#fff}.article-date{font-size:13px;color:var(--text-muted);font-weight:500}.article-read-time{font-size:13px;color:var(--text-muted);display:flex;align-items:center;gap:5px}.article-title{font-size:clamp(24px,5vw,36px);font-weight:700;color:var(--text-primary);margin:12px 0 16px;line-height:1.3}.article-tags{display:flex;gap:8px;flex-wrap:wrap}.article-content{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:40px}.article-content h1{font-size:26px;font-weight:700;color:var(--text-primary);margin:0 0 20px;line-height:1.35}.article-content h2{font-size:20px;font-weight:700;color:var(--text-primary);margin:36px 0 14px;padding-bottom:8px;border-bottom:1px solid var(--border-color)}.article-content h3{font-size:17px;font-weight:600;color:var(--text-primary);margin:28px 0 10px}.article-content p{font-size:16px;color:var(--text-secondary);line-height:1.85;margin-bottom:20px}.article-content strong{color:var(--text-primary);font-weight:600}.article-content em{font-style:italic;color:var(--text-secondary)}.article-content ul,.article-content ol{margin:0 0 20px;padding-left:24px}.article-content li{font-size:16px;color:var(--text-secondary);line-height:1.8;margin-bottom:8px}.article-content li::marker{color:var(--primary)}.article-content code{font-family:Fira Code,Consolas,monospace;font-size:14px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:4px;padding:2px 6px;color:var(--primary-light)}.article-content pre{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px 24px;overflow-x:auto;margin:0 0 20px}.article-content pre code{background:none;border:none;padding:0;font-size:14px;color:var(--text-secondary)}.article-content blockquote{border-left:4px solid var(--primary);margin:0 0 20px;padding:4px 0 4px 20px;background:#6366f10d;border-radius:0 4px 4px 0}.article-content blockquote p{margin-bottom:0;color:var(--text-secondary);font-style:italic}.article-content a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}.article-content a:hover{color:var(--primary-light)}.article-content hr{border:none;border-top:1px solid var(--border-color);margin:32px 0}.article-content table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:15px}.article-content table th{background:var(--bg-tertiary);padding:10px 16px;text-align:left;font-weight:600;color:var(--text-primary);border:1px solid var(--border-color)}.article-content table td{padding:10px 16px;color:var(--text-secondary);border:1px solid var(--border-color)}.resources-container{display:flex;flex-direction:column;gap:48px}.resource-section{position:relative;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:24px;overflow:visible}.resource-section-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border-color)}.resource-section-header i{width:24px;height:24px;color:var(--primary)}.resource-section-header img.resource-section-icon{width:24px;height:24px;object-fit:contain}.resource-section-header h2{font-size:18px;font-weight:700;color:var(--text-primary);flex:1}.resource-count{background:var(--primary);color:#fff;font-size:12px;font-weight:600;padding:4px 10px;border-radius:12px}.resource-cards-outer{position:relative;overflow:visible}.resource-cards-wrapper{overflow:visible;width:100%;max-width:1268px}.resource-cards{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:8px}.resource-cards::-webkit-scrollbar{display:none}.resource-cards .resource-card{flex-shrink:0}.resource-nav{position:absolute;top:0;bottom:0;margin:auto;z-index:10;width:36px;height:36px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:50%;color:var(--text-primary);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000004d;opacity:0;pointer-events:none}.resource-cards-outer:hover .resource-nav{opacity:1;pointer-events:auto}.resource-nav:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff}.resource-nav:active:not(:disabled){transform:scale(.95)}.resource-nav:disabled{opacity:0;pointer-events:none}.resource-cards-outer:hover .resource-nav:disabled{opacity:0;pointer-events:none}.resource-nav i{width:18px;height:18px;pointer-events:none}.resource-nav-prev{left:8px}.resource-nav-next{right:8px}.resource-card{display:flex;align-items:center;gap:14px;padding:16px;background:var(--bg-tertiary);border:1px solid transparent;border-radius:var(--border-radius-md);text-decoration:none;transition:all .2s ease;min-width:280px;max-width:280px;flex-shrink:0}.resource-card:hover{background:var(--bg-primary);border-color:var(--primary)}.resource-card:hover .resource-card-arrow{opacity:1;transform:translate(0)}.resource-card-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);border-radius:10px;flex-shrink:0;overflow:hidden}.resource-card-icon img{width:100%;height:100%;object-fit:contain;padding:4px}.resource-card-icon i,.resource-card-icon svg{width:22px;height:22px;color:#fff}.resource-card-content{flex:1;min-width:0}.resource-card-content h3{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.resource-card-content p{font-size:12px;color:var(--text-secondary);line-height:1.4}.resource-card-arrow{width:20px;height:20px;color:var(--text-muted);opacity:0;transform:translate(-8px);transition:all .2s ease;flex-shrink:0}.info-content,.jlpt-info-content{width:100%}section.info-content{margin-bottom:40px}section.info-content:last-child{margin-bottom:0}.overview-list{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px 24px;margin-top:16px;list-style:none}.overview-list li{font-size:14px;color:var(--text-secondary);line-height:1.7;padding:10px 0 10px 28px;position:relative}.overview-list li:not(:last-child){border-bottom:1px solid var(--border-color)}.overview-list li:before{content:"→";position:absolute;left:0;color:var(--primary);font-weight:700}.overview-list li strong{color:var(--text-primary);font-weight:700}.info-section{margin-bottom:48px}.info-section>h2{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--primary);display:flex;align-items:center;gap:10px}.info-section>h2 svg{width:24px;height:24px;color:var(--primary);stroke-width:2}.info-card,.jlpt-whatis-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 28px;margin-top:16px}.i1-scale-visual{margin-top:20px;padding:20px;background:var(--bg-tertiary);border-radius:var(--radius-md)}.i1-scale-labels{display:flex;justify-content:space-between;margin-bottom:10px}.i1-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.i1-too-easy{color:var(--text-muted)}.i1-sweet-spot{color:var(--success)}.i1-too-hard{color:var(--accent-red)}.i1-scale-bar{display:flex;height:12px;border-radius:6px;overflow:hidden;position:relative}.i1-scale-segment{height:100%}.i1-easy{width:33.33%;background:linear-gradient(90deg,var(--text-muted),var(--text-secondary));opacity:.4}.i1-target{width:33.33%;background:linear-gradient(90deg,var(--success),var(--accent-green))}.i1-hard{width:33.34%;background:linear-gradient(90deg,var(--accent-red),var(--accent-red-hover));opacity:.4}.i1-scale-marker{position:absolute;left:50%;top:-6px;transform:translate(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--success)}.i1-scale-levels{display:flex;justify-content:space-between;margin-top:12px}.i1-level{font-size:14px;font-weight:700;color:var(--text-secondary);font-family:monospace}.i1-level-center{color:var(--success)}.immersion-comparison{display:flex;align-items:stretch;gap:16px;margin-top:20px;padding:20px;background:var(--bg-tertiary);border-radius:var(--radius-md)}.immersion-type{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border-color)}.immersion-type.passive{border-color:var(--text-muted);opacity:.85}.immersion-type.active{border-color:var(--success);box-shadow:0 0 20px #22c55e1a}.immersion-icon{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:12px}.passive .immersion-icon{background:var(--bg-tertiary);color:var(--text-muted)}.active .immersion-icon{background:var(--success-bg);color:var(--success)}.immersion-label{font-size:16px;font-weight:700;margin-bottom:8px}.passive .immersion-label{color:var(--text-secondary)}.active .immersion-label{color:var(--success)}.immersion-tags{display:flex;gap:6px;margin-bottom:12px}.immersion-tags .tag{font-size:10px;padding:3px 8px;border-radius:12px;background:var(--bg-tertiary);color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}.active .immersion-tags .tag{background:var(--success-bg);color:var(--success)}.immersion-traits{list-style:none;padding:0;margin:0;font-size:12px;color:var(--text-secondary);line-height:1.6;flex:1}.immersion-traits li{margin-bottom:4px}.immersion-result{margin-top:12px;padding-top:12px;border-top:1px solid var(--border-color);width:100%}.result-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.result-value{display:block;font-size:13px;font-weight:600;margin-top:4px}.result-value.limited{color:var(--text-muted)}.result-value.real{color:var(--success)}.immersion-divider{display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--text-muted);padding:0 8px}.prompt-examples{display:flex;flex-direction:column;gap:16px;margin-top:16px}.prompt-box{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:16px}.prompt-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.prompt-label{font-size:12px;font-weight:600;color:var(--primary);text-transform:uppercase;letter-spacing:.5px;flex:1}.prompt-copied{font-size:12px;color:var(--success, #22c55e);font-weight:600;opacity:0;transition:opacity .2s}.prompt-copied.show{opacity:1}.prompt-copy-btn{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:4px 12px;font-size:12px;color:var(--text-secondary);cursor:pointer;transition:border-color .2s,color .2s}.prompt-copy-btn:hover{border-color:var(--primary);color:var(--primary)}.prompt-box code{font-size:13px;color:var(--text-secondary);line-height:1.6;word-break:break-word;white-space:pre-wrap}.prompt-description{color:#334155;font-size:15px;line-height:1.6;margin-bottom:16px}.ai-tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:16px}.ai-tool-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:20px}.ai-tool-card h4{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.ai-tool-card p{font-size:13px;color:var(--text-secondary);line-height:1.5;margin:0}.writing-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:16px}.writing-example-item{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 20px;text-align:center;transition:var(--transition-smooth)}.writing-example-item:hover{border-color:var(--primary);transform:translateY(-2px)}.dakuten-section{margin-top:24px}.dakuten-row{display:flex;flex-direction:column;gap:0;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:16px}.dakuten-row-header{display:flex;align-items:center;gap:16px;padding:16px 20px;background:var(--bg-tertiary);border-bottom:1px solid var(--border-color)}.dakuten-row-badge{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--primary);color:#fff;font-weight:700;font-size:16px;border-radius:10px}.dakuten-row-label{font-weight:600;color:var(--text-secondary);font-size:14px;text-transform:uppercase;letter-spacing:.5px}.dakuten-kana-group{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:16px 20px}.dakuten-kana-group.base{border-bottom:1px dashed var(--border-color)}.dakuten-kana-group.voiced{background:#a855f70d}.dakuten-kana-group.semivoiced{background:#06b6d40d}.kana-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 8px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .2s ease;min-height:80px}.kana-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 8px 20px #6366f126}.kana-card:active{transform:translateY(-1px)}.kana-card .kana-char{font-size:24px;font-weight:500;line-height:1.2}.kana-card .kana-romaji{font-size:12px;color:var(--text-secondary);margin-top:4px}.kana-card.voiced .kana-char{color:var(--accent-purple)}.kana-card.semivoiced .kana-char{color:var(--tertiary)}.dakuten-arrow{display:flex;align-items:center;justify-content:center;padding:8px;color:var(--text-muted)}.dakuten-arrow svg{width:24px;height:24px}.handakuten-section{margin-top:32px;padding-top:24px;border-top:1px solid var(--border-color)}.handakuten-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.handakuten-badge{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--tertiary);color:var(--on-tertiary);font-weight:700;font-size:14px;border-radius:8px}.handakuten-title{font-size:18px;font-weight:600;color:var(--text-primary)}.example-char{font-family:var(--font-japanese);font-size:48px;font-weight:700;display:block;margin-bottom:12px;color:var(--primary)}.example-label{font-size:14px;font-weight:600;color:var(--text-primary);display:block;margin-bottom:4px}.example-desc{font-size:12px;color:var(--text-muted)}.structure-compare{display:flex;flex-direction:column;gap:24px;margin-bottom:24px}.structure-compare-row{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 28px}.structure-compare-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.structure-lang-label{font-size:18px;font-weight:700;color:var(--text-primary)}.structure-lang-order{font-size:13px;color:var(--text-muted);font-family:var(--font-mono)}.structure-compare-flow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.structure-box{padding:10px 20px;border-radius:var(--radius-md);font-weight:600;font-size:15px;min-width:80px;text-align:center}.subject-box{background:#3b82f626;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.verb-box{background:#22c55e26;color:#22c55e;border:1px solid rgba(34,197,94,.3)}.object-box{background:#f9731626;color:#f97316;border:1px solid rgba(249,115,22,.3)}.flow-arrow{width:20px;height:20px;color:var(--text-muted);stroke-width:2;flex-shrink:0}.structure-compare-sentence{margin-top:16px;font-size:15px;color:var(--text-secondary);font-style:italic}.structure-notes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.structure-note-item{display:flex;align-items:center;gap:16px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:16px 20px}.structure-note-icon{width:40px;height:40px;border-radius:var(--radius-md);background:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.structure-note-icon svg{width:20px;height:20px;color:#fff;stroke-width:2}.structure-note-text{display:flex;flex-direction:column;gap:2px}.structure-note-label{font-size:14px;font-weight:600;color:var(--text-primary)}.structure-note-example{font-size:12px;color:var(--text-muted);font-family:var(--font-japanese)}.mora-explainer{display:flex;flex-direction:column;gap:24px}.mora-intro{display:flex;align-items:flex-start;gap:16px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px 24px}.mora-icon{width:44px;height:44px;border-radius:var(--radius-md);background:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.mora-icon svg{width:22px;height:22px;color:#fff;stroke-width:2}.mora-intro-text h3{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:6px}.mora-intro-text p{font-size:14px;color:var(--text-secondary);line-height:1.5}.mora-visual{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 28px}.mora-visual-label{font-size:15px;font-weight:600;color:var(--text-secondary);margin-bottom:20px;text-align:center}.mora-breakdown{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.mora-unit{display:flex;flex-direction:column;align-items:center;gap:6px}.mora-char{width:64px;height:64px;border-radius:var(--radius-md);background:var(--primary);display:flex;align-items:center;justify-content:center;font-family:var(--font-japanese);font-size:32px;font-weight:700;color:#fff}.mora-label{font-size:14px;color:var(--text-secondary)}.mora-count{font-size:11px;font-weight:600;color:var(--primary);background:#6366f11a;padding:2px 8px;border-radius:10px}.mora-connector,.mora-equals{display:flex;align-items:center;color:var(--text-muted)}.mora-connector svg,.mora-equals svg{width:24px;height:24px;stroke-width:2}.mora-total{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 20px;background:var(--bg-tertiary);border-radius:var(--radius-md);border:1px solid var(--border-color)}.mora-total-num{font-size:32px;font-weight:700;color:var(--primary);line-height:1}.mora-total-label{font-size:12px;color:var(--text-muted)}.mora-audio-player{display:flex;align-items:center;gap:16px;margin-top:20px;padding-top:16px;border-top:1px dashed var(--border-color)}.mora-audio-btn{display:flex;align-items:center;gap:8px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-md);padding:10px 20px;font-size:14px;font-weight:600;cursor:pointer;transition:var(--transition-smooth)}.mora-audio-btn:hover{background:var(--primary-hover, #4f46e5);transform:translateY(-1px)}.mora-audio-btn svg{flex-shrink:0}.mora-audio-note{font-size:13px;color:var(--text-secondary);font-style:italic}.mora-rules{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.mora-rule{display:flex;align-items:flex-start;gap:14px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:16px 20px}.mora-rule-icon{width:36px;height:36px;border-radius:var(--radius-md);background:#6366f11a;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mora-rule-icon svg{width:18px;height:18px;color:var(--primary);stroke-width:2}.mora-rule-text{display:flex;flex-direction:column;gap:4px}.mora-rule-text strong{font-size:14px;font-weight:600;color:var(--text-primary)}.mora-rule-text span{font-size:12px;color:var(--text-muted);font-family:var(--font-japanese)}.mora-points{margin-top:8px;padding-left:20px;display:flex;flex-direction:column;gap:8px}.mora-points li{font-size:14px;color:var(--text-secondary)}.sound-features{display:grid;grid-template-columns:1fr;gap:20px;margin-top:8px}.sound-feature-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px;display:flex;gap:16px}.sound-feature-icon{width:44px;height:44px;border-radius:var(--radius-md);background:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sound-feature-icon svg{width:22px;height:22px;color:#fff;stroke-width:2}.sound-feature-content h3{font-size:15px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.sound-feature-content>p{font-size:13px;color:var(--text-secondary);line-height:1.5;margin-bottom:14px}.pitch-visual{display:flex;gap:20px}.pitch-example{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 24px;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:var(--border-radius-lg);cursor:pointer;transition:all .2s}.pitch-example:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow-clay-hover)}.pitch-word{font-family:var(--font-japanese);font-size:18px;font-weight:700;color:var(--text-primary)}.pitch-bars{display:flex;align-items:flex-end;gap:6px}.pitch-bar{width:10px;height:10px;background:var(--border-color);border-radius:50%;transition:background .2s}.pitch-bar.active{background:var(--primary);margin-bottom:12px}.pitch-meaning{font-size:12px;color:var(--text-secondary)}.levels-grid,.jlpt-levels-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:24px}.level-card,.jlpt-level-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 20px;transition:var(--transition-smooth);position:relative;overflow:hidden}.level-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.level-card.n5:before{background:var(--primary)}.level-card.n4:before{background:var(--accent)}.level-card.n3:before{background:var(--accent-red)}.level-card.card-indigo:before{background:var(--primary)}.jlpt-level-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.jlpt-level-card.n5:before{background:var(--primary)}.jlpt-level-card.n4:before{background:var(--accent)}.jlpt-level-card.n3:before{background:var(--accent-red)}.jlpt-level-card.n2:before{background:var(--accent-purple)}.jlpt-level-card.n1:before{background:var(--accent-green)}.jlpt-level-card.card-indigo:before{background:var(--primary)}.level-card:hover,.jlpt-level-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary)}.level-card h3,.jlpt-level-card h3{font-size:18px;font-weight:700;margin-bottom:12px;color:var(--text-primary);display:flex;align-items:center;gap:8px}.level-card.n5 h3{color:var(--primary)}.level-card.n4 h3{color:var(--accent)}.level-card.n3 h3{color:var(--accent-red)}.level-card.card-indigo h3,.jlpt-level-card.n5 h3{color:var(--primary)}.jlpt-level-card.n4 h3{color:var(--accent)}.jlpt-level-card.n3 h3{color:var(--accent-red)}.jlpt-level-card.n2 h3{color:var(--accent-purple)}.jlpt-level-card.n1 h3{color:var(--accent-green)}.jlpt-level-card.card-indigo h3{color:var(--primary)}.level-card p{font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:16px}.level-card ul{list-style:none;padding:0;margin:0}.level-card ul li{font-size:13px;color:var(--text-secondary);padding:6px 0;border-top:1px solid var(--border-color);display:flex;align-items:center;gap:8px}.level-card ul li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--primary);flex-shrink:0}.jlpt-level-card p{font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:16px}.jlpt-level-card ul{list-style:none;padding:0;margin:0}.jlpt-level-card ul li{font-size:13px;color:var(--text-secondary);padding:6px 0;border-top:1px solid var(--border-color);display:flex;align-items:center;gap:8px}.jlpt-level-card ul li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--primary);flex-shrink:0}.format-grid,.jlpt-format-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:20px}.format-item,.jlpt-format-item{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px;transition:var(--transition-smooth)}.format-item:hover{border-color:var(--primary);background:var(--bg-primary)}.format-item h4{font-size:15px;font-weight:600;color:var(--primary);margin-bottom:8px;display:flex;align-items:center;gap:8px}.format-item h4 svg{width:18px;height:18px;stroke-width:2}.format-item p{font-size:13px;color:var(--text-secondary);line-height:1.5}.vowel-extension-table{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);overflow:hidden;margin-top:20px}.vowel-ext-header{display:grid;grid-template-columns:80px 80px 100px 100px 100px;gap:8px;padding:14px 20px;background:var(--primary);color:#fff;font-weight:600;font-size:13px;text-align:center}.vowel-ext-row{display:grid;grid-template-columns:80px 80px 100px 100px 100px;gap:8px;padding:14px 20px;border-bottom:1px solid var(--border-color);align-items:center;text-align:center;transition:var(--transition-fast)}.vowel-ext-row:last-child{border-bottom:none}.vowel-ext-row:hover{background:var(--bg-primary)}.vowel-label{font-weight:600;font-size:16px;color:var(--primary)}.kana-base,.kana-result{font-size:24px;font-family:Noto Sans JP,sans-serif;color:var(--text-primary)}.kana-result{color:var(--primary);font-weight:700}.ext-arrow{color:var(--primary);font-size:14px}.pronunciation{font-size:14px;color:var(--primary);font-weight:500}.long-vowel-example{display:flex;flex-direction:column;gap:4px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--border-color);cursor:pointer;transition:opacity .2s}.long-vowel-example:hover{opacity:.8}.long-vowel-example .word-example{font-size:22px;font-family:Noto Sans JP,sans-serif;color:var(--primary);font-weight:700}.long-vowel-example .romaji{font-size:14px;color:var(--text-secondary);font-style:italic}.long-vowel-example .meaning{font-size:13px;color:var(--text-primary)}.long-vowel-compare{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--border-color)}.long-vowel-box{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 20px;border-radius:var(--radius-md);min-width:120px;cursor:pointer;transition:all .2s}.long-vowel-box:hover{transform:translateY(-2px);box-shadow:0 4px 12px #6366f133}.long-vowel-box.short{background:var(--bg-tertiary);border:1px solid var(--border-color);opacity:.85}.long-vowel-box.long{background:var(--primary)}.long-vowel-word{font-family:var(--font-japanese);font-size:26px;font-weight:700}.long-vowel-box.short .long-vowel-word{color:var(--text-primary)}.long-vowel-box.long .long-vowel-word{color:#fff}.long-vowel-romaji{font-size:14px;font-weight:500;color:var(--text-secondary)}.long-vowel-box.long .long-vowel-romaji{color:#ffffffe6}.long-vowel-meaning{font-size:13px;color:var(--text-muted)}.long-vowel-box.long .long-vowel-meaning{color:#ffffffbf}.long-vowel-vs{font-size:14px;font-weight:700;color:var(--text-muted)}.purpose-cta,.jlpt-purpose-cta{background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:32px;text-align:center}.purpose-cta p,.jlpt-purpose-cta p{font-size:15px;color:var(--text-secondary);margin-bottom:20px;max-width:600px;margin-left:auto;margin-right:auto;line-height:1.6}.btn-cta-primary{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;background:var(--primary);color:var(--on-primary);border:1px solid var(--primary);border-radius:var(--border-radius-md);font-weight:600;font-size:14px;text-decoration:none;transition:var(--transition-smooth)}.btn-cta-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}@media (max-width: 768px){.levels-grid,.jlpt-levels-grid{grid-template-columns:1fr;gap:16px}.format-grid,.jlpt-format-grid{grid-template-columns:1fr}.info-section>h2{font-size:18px}.purpose-cta,.jlpt-purpose-cta{padding:24px 20px}.structure-compare-header{flex-direction:column;align-items:flex-start;gap:4px}.structure-compare-flow{gap:8px}.structure-box{padding:8px 14px;font-size:14px;min-width:60px}.flow-arrow{width:16px;height:16px}.structure-notes,.mora-rules{grid-template-columns:1fr}.mora-breakdown{gap:8px}.mora-char{width:52px;height:52px;font-size:26px}.mora-connector svg,.mora-equals svg{width:20px;height:20px}.vowel-extension-table{overflow-x:auto}.vowel-ext-header,.vowel-ext-row{grid-template-columns:60px 60px 80px 80px 70px;padding:12px 14px;font-size:13px}.kana-base,.kana-result{font-size:20px}.sound-features{grid-template-columns:1fr}.pitch-visual{flex-direction:column;gap:16px}}.kanji-intro-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px 28px;margin-top:16px}.kanji-intro-card p{font-size:15px;color:var(--text-secondary);line-height:1.7}.intro-step{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border-color)}.intro-step:last-child{border-bottom:none}.intro-step svg{width:20px;height:20px;color:var(--primary);flex-shrink:0}.intro-step span{font-size:14px;color:var(--text-secondary)}.i1-scale-labels{flex-wrap:wrap;gap:4px}.immersion-comparison{flex-direction:column;gap:12px}.immersion-divider{padding:4px 0}.immersion-type{padding:12px}.about-grid,.about-grid-layout{display:grid;grid-template-columns:1fr 1fr;gap:32px}.about-left{display:flex;flex-direction:column;gap:32px}.about-grid-layout>.about-card:first-child{grid-column:1 / -1}.about-grid-layout>.about-card:first-child .about-profile-img{margin-bottom:0}@media (max-width: 768px){.about-grid,.about-grid-layout{grid-template-columns:1fr;gap:20px}.about-grid-layout>.about-card:first-child{grid-column:auto}.about-card{padding:24px}.about-card h3{font-size:16px}.about-bio{font-size:14px;line-height:1.6}}.about-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:32px}.about-card h3{font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:20px;display:flex;align-items:center;gap:10px}.about-card h3 svg{color:var(--primary)}.about-card-center{display:flex;flex-direction:column;align-items:center;text-align:center}.about-profile-img{width:150px;height:150px;border-radius:50%;object-fit:cover;margin-bottom:20px;border:3px solid var(--primary)}.about-bio{font-size:15px;color:var(--text-secondary);line-height:1.8;margin-bottom:20px}.social-links{display:flex;flex-direction:column;gap:12px}.social-link{display:flex;align-items:center;gap:12px;padding:14px 18px;background-color:var(--bg-tertiary);border-radius:var(--border-radius-md);color:var(--text-primary);font-weight:500;font-size:14px;transition:var(--transition-smooth)}.social-link:hover{background-color:#6366f11a;color:var(--primary)}.social-link svg{width:20px;height:20px}@media (max-width: 1024px){.app-header{padding:0 24px}.header-nav{display:none}.mobile-nav-toggle{display:flex;align-items:center;justify-content:center}.app-body{padding:24px;max-width:none}}@media (max-width: 768px){.dashboard-grid{grid-template-columns:1fr}.timeline-timeline:after{left:31px}.timeline-container{width:100%;padding-left:70px;padding-right:25px}.timeline-container:after{left:21px;right:auto}.timeline-right{left:0%}.hero-card{padding:24px}.hero-card h1{font-size:28px}.level-header{padding:20px;flex-direction:column;align-items:flex-start}.roadmap-timeline:after{left:20px}.timeline-left,.timeline-right{left:0}.timeline-left:after,.timeline-right:after{left:10px;right:auto}.timeline-card{padding:16px}.resource-cards-wrapper{overflow-x:auto}.resource-cards{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media (max-width: 768px){.kana-grid-container{overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0}.kana-table{font-size:.75em;border-collapse:separate;border-spacing:6px}.kana-cell{padding:10px 4px;border-radius:var(--border-radius-lg)}.kana-cell .kana-char{font-size:16px}.kana-vowel-label{font-size:11px;padding:4px;width:36px}.kana-consonant-header{font-size:14px;padding:8px 4px}.kana-chart-wrapper{padding:16px}.kana-tips-grid{grid-template-columns:1fr}.pron-comparison-row{flex-wrap:wrap;justify-content:center;text-align:center;gap:10px}.pron-kana-box,.pron-wrong-box{min-width:80px;padding:12px 16px}.pron-kana-char{font-size:28px}.pron-wrong-char{font-size:20px}.pron-vs{width:100%;text-align:center}.long-vowel-compare{flex-wrap:wrap;gap:8px}.long-vowel-box{min-width:85px;padding:10px 12px}.long-vowel-word{font-size:16px}.long-vowel-vs{width:100%;text-align:center}.deck-controls{gap:16px}.results-actions{flex-direction:column;gap:10px}.home-sections-grid,.home-blog-row{grid-template-columns:1fr}.hero-section{padding:32px 24px}.hero-section h1{font-size:28px}.stats-row{flex-direction:column;gap:12px}.quickstart-card{padding:14px 16px}}.kana-tabs{display:flex;gap:12px;margin-bottom:20px}.kana-tab{padding:10px 24px;border-radius:var(--border-radius-lg);background:var(--bg-tertiary);border:2px solid var(--border-color);color:var(--text-secondary);font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-clay)}:root.light-theme .kana-tab{background:var(--bg-secondary)}.kana-tab.active{background:linear-gradient(135deg,var(--primary),var(--primary-hover))!important;border-color:var(--primary)!important;color:var(--on-primary)!important;box-shadow:0 4px 15px #4f46e559!important}.kana-tab.active:active{color:var(--on-primary)}.kana-tab:hover:not(.active){border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}.kana-instruction{font-size:14px}.kanji-rules-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:24px}.kanji-rules-section h2{margin-bottom:12px;color:var(--primary);font-size:20px}.section-intro{font-size:15px;color:var(--text-secondary);line-height:1.8;margin-bottom:20px}.rules-content{margin-top:16px}.stroke-rule-card{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:16px;margin-bottom:12px;overflow:hidden}.stroke-rule-card img{max-width:100%;height:auto;max-height:150px;object-fit:contain}.stroke-rule-card h4{color:var(--primary);margin-bottom:8px}.stroke-rule-card code{display:block;margin-top:8px;padding:8px 12px;background:var(--bg-secondary);border-radius:var(--radius-sm);font-size:13px;font-family:Noto Sans JP,sans-serif}.stroke-patterns-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}.stroke-pattern-item{text-align:center;padding:16px;background:var(--bg-tertiary);border-radius:var(--border-radius-md);border:1px solid var(--border-color)}.pattern-char{font-size:28px;margin-bottom:4px;font-family:Noto Sans JP,sans-serif}.pattern-meaning{font-size:12px;color:var(--text-secondary)}.direction-rules-list{display:flex;flex-direction:column;gap:12px}.direction-rule{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-tertiary);border-radius:var(--border-radius-md)}.direction-num{width:28px;height:28px;background:var(--primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}.anki-intro-section{padding:20px 24px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);margin-bottom:32px;line-height:1.7}.anki-section{margin-bottom:48px}.anki-section h2{display:flex;align-items:center;gap:10px;margin-bottom:20px;color:var(--primary);font-size:20px}.anki-decks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.anki-deck-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px}.deck-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.deck-header h3{font-size:16px}.deck-level{padding:4px 10px;background:var(--primary);color:#fff;border-radius:20px;font-size:11px;font-weight:700}.anki-deck-card p{font-size:14px;color:var(--text-secondary);margin-bottom:12px}.mining-intro{font-size:15px;color:var(--text-secondary);margin-bottom:24px;line-height:1.7}.mining-steps{display:flex;flex-direction:column;gap:20px}.mining-step{display:flex;gap:16px;padding:20px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md)}.step-number{width:36px;height:36px;background:var(--primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.step-content h4{margin-bottom:8px}.step-content p{color:var(--text-secondary);font-size:14px;line-height:1.6}.step-tip{margin-top:10px;font-size:13px;color:var(--primary)}.mining-example{margin-top:12px;padding:12px;background:var(--bg-tertiary);border-radius:var(--radius-sm);font-size:13px}.example-front{margin-bottom:4px}.mining-tools-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.mining-tool{padding:16px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md)}.mining-tool h4{margin-bottom:6px;font-size:15px}.mining-tool p{font-size:13px;color:var(--text-secondary)}.mark-learned-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-primary);font-weight:600;cursor:pointer;transition:all .2s ease}.mark-learned-btn:hover{border-color:var(--primary);color:var(--primary)}.vocab-learn-btn-small{padding:4px;background:transparent;border:none;cursor:pointer;color:var(--text-muted);transition:color .2s}.vocab-learn-btn-small:hover{color:var(--primary)}.admin-login-container{display:flex;justify-content:center;align-items:center;min-height:400px;padding:40px 20px}.admin-login-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:48px;max-width:420px;width:100%;text-align:center}.admin-login-icon{width:80px;height:80px;border-radius:50%;background:#6366f11a;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:var(--primary)}.admin-login-card h1{font-size:24px;font-weight:700;margin-bottom:8px}.admin-login-card p{color:var(--text-secondary);font-size:14px;margin-bottom:32px}.admin-login-form .form-group{text-align:left;margin-bottom:20px}.admin-login-form label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:6px}.admin-login-form input{width:100%;padding:12px 16px;border:1px solid var(--border-color);border-radius:var(--border-radius-md);background:var(--bg-tertiary);color:var(--text-primary);font-size:14px;box-sizing:border-box}.admin-login-form input:focus{outline:none;border-color:var(--primary)}.btn-admin-login{width:100%;padding:14px;background:linear-gradient(135deg,var(--primary),var(--primary-hover));color:var(--on-primary);border:none;border-radius:var(--border-radius-md);font-size:15px;font-weight:600;cursor:pointer;transition:var(--transition-smooth)}.btn-admin-login:hover{transform:translateY(-2px);box-shadow:0 4px 15px #6366f159}.form-error{color:#f44;font-size:13px;margin-bottom:12px;padding:8px 12px;background:#ff44441a;border-radius:var(--border-radius-sm)}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--border-color)}.admin-header h1{font-size:26px;font-weight:700;margin-bottom:4px}.admin-header p{color:var(--text-secondary);font-size:14px}.admin-header-actions{display:flex;gap:12px;align-items:center}.btn-admin-logout{padding:10px 20px;background:transparent;border:1px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-secondary);font-size:13px;cursor:pointer;transition:var(--transition-smooth)}.btn-admin-logout:hover{border-color:var(--primary);color:var(--primary)}.admin-posts-list{display:flex;flex-direction:column;gap:16px}.admin-post-item{display:flex;justify-content:space-between;align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px 24px;transition:var(--transition-smooth)}.admin-post-item:hover{border-color:#6366f14d}.admin-post-info{flex:1}.admin-post-info h3{font-size:16px;font-weight:600;margin-bottom:6px}.admin-post-info p{font-size:13px;color:var(--text-secondary);margin-bottom:8px}.admin-post-meta{display:flex;gap:16px;flex-wrap:wrap}.admin-post-meta span{font-size:12px;color:var(--text-muted)}.admin-post-meta .tag-chip{color:#111}.local-badge,.cloud-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px!important;font-weight:600}.local-badge{background:#ffa50026;color:orange}.cloud-badge{background:#00b4c826;color:#00b4c8}.type-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px!important;font-weight:600}.type-badge.blog{background:#6450c826;color:#87f}.type-badge.culture{background:#00b46426;color:#00b464}.admin-post-actions{display:flex;gap:8px;flex-shrink:0}.btn-edit-post,.btn-delete-post{padding:8px 16px;border-radius:var(--border-radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:var(--transition-smooth)}.btn-edit-post{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary)}.btn-edit-post:hover{border-color:var(--primary);color:var(--primary)}.btn-delete-post{background:transparent;border:1px solid rgba(255,68,68,.4);color:#ff6464}.btn-delete-post:hover{background:#ff44441a;border-color:#f44}.admin-loading,.admin-empty{text-align:center;padding:60px 20px;color:var(--text-muted);font-size:15px}.admin-tabs{display:flex;gap:8px;margin-bottom:24px;border-bottom:1px solid var(--border-color);padding-bottom:16px}.admin-tab-btn{padding:10px 24px;border-radius:var(--border-radius-md);font-size:14px;font-weight:600;cursor:pointer;transition:var(--transition-smooth);background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-secondary)}.admin-tab-btn:hover{border-color:var(--primary);color:var(--primary)}.admin-tab-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.admin-tab-content{display:none}.admin-tab-content.active{display:block}.admin-type-filter{display:flex;gap:6px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border-color)}.type-filter-btn{padding:6px 16px;border-radius:var(--border-radius-md);font-size:13px;font-weight:500;cursor:pointer;transition:var(--transition-smooth);background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-secondary)}.type-filter-btn:hover{border-color:var(--primary);color:var(--primary)}.type-filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.admin-section-header{margin-bottom:20px}.admin-section-header h2{font-size:18px;font-weight:600;margin-bottom:4px}.admin-signups-list{display:flex;flex-direction:column;gap:16px}.admin-signup-item{display:flex;justify-content:space-between;align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);padding:20px 24px;transition:var(--transition-smooth)}.admin-signup-item:hover{border-color:#6366f14d}.admin-signup-info{flex:1}.admin-signup-info h3{font-size:16px;font-weight:600;margin-bottom:6px}.admin-signup-info p{font-size:13px;color:var(--text-secondary);margin-bottom:4px}.signup-date{font-size:12px!important;color:var(--text-muted)!important;margin-top:8px!important}.admin-signup-actions{display:flex;gap:8px;flex-shrink:0}.btn-delete-signup{padding:8px 16px;border-radius:var(--border-radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:var(--transition-smooth);background:transparent;border:1px solid rgba(255,68,68,.4);color:#ff6464}.btn-delete-signup:hover{background:#ff44441a;border-color:#f44}.post-editor-container{max-width:960px!important;width:calc(100% - 32px);max-height:90vh;overflow-y:auto;padding:28px}.post-editor-container h2{font-size:20px;font-weight:700;margin-bottom:20px}#post-editor-form{display:flex;flex-direction:column;gap:20px}.post-editor-modal .form-actions{display:flex;gap:12px;justify-content:flex-end;padding-top:20px;border-top:1px solid var(--border-color)}#post-editor-form .form-group{margin-bottom:0}#post-editor-form label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}#post-editor-form input,#post-editor-form textarea,#post-editor-form select{width:100%;padding:10px 14px;border:1px solid var(--border-color);border-radius:var(--border-radius-md);background:var(--bg-tertiary);color:var(--text-primary);font-size:14px;font-family:inherit;box-sizing:border-box;transition:border-color .2s}#post-editor-form input:focus,#post-editor-form textarea:focus,#post-editor-form select:focus{outline:none;border-color:var(--primary)}#post-editor-form textarea{resize:vertical}#post-editor-form small{font-size:11px;color:var(--text-muted);display:block;margin-top:4px}.field-error{font-size:11px;color:var(--danger, #e53e3e);display:block;margin-top:4px}.slug-input-row{display:flex;gap:6px}.slug-input-row input{flex:1}.slug-lock-btn{padding:8px 10px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-muted);cursor:pointer;transition:all .2s;display:flex;align-items:center;flex-shrink:0}.slug-lock-btn:hover,.slug-lock-btn.locked{border-color:var(--primary);color:var(--primary)}.slug-hint{font-size:11px;color:var(--primary);margin-top:4px}.tag-input-wrapper{display:flex;flex-wrap:wrap;gap:6px;padding:8px;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);min-height:44px;align-items:center;position:relative}.tag-chips{display:flex;flex-wrap:wrap;gap:6px}.tag-chip{display:inline-flex;align-items:center;gap:4px;color:#333;font-size:12px;padding:3px 8px;border-radius:12px;font-weight:500}.tag-chip-remove{background:none;border:none;color:#555;cursor:pointer;padding:0;font-size:14px;line-height:1;opacity:.7}.tag-chip-remove:hover{opacity:1}.tag-suggestions{position:absolute;top:100%;left:0;right:0;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-md);margin-top:4px;max-height:160px;overflow-y:auto;z-index:100;box-shadow:0 4px 12px #00000026}.tag-suggestion-item{display:block;width:100%;text-align:left;padding:8px 12px;background:none;border:none;border-bottom:1px solid var(--border-color);cursor:pointer;font-size:13px;color:var(--text-primary);transition:background .15s}.tag-suggestion-item:last-child{border-bottom:none}.tag-suggestion-item:hover{background:var(--bg-tertiary)}#post-tags-input{border:none;background:transparent;padding:2px 4px;flex:1;min-width:100px;font-size:13px}#post-tags-input:focus{outline:none}.lang-section{border:1px solid var(--border-color);border-radius:var(--border-radius-md);overflow:hidden}.lang-tabs{display:flex;border-bottom:1px solid var(--border-color);background:var(--bg-secondary)}.lang-tab-btn{flex:1;padding:10px 16px;background:none;border:none;color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.lang-tab-btn:hover{color:var(--text-primary)}.lang-tab-btn.active{color:var(--primary);background:var(--bg-tertiary);border-bottom:2px solid var(--primary);margin-bottom:-1px}.lang-panel{padding:16px;display:flex;flex-direction:column;gap:12px}.lang-panel.hidden{display:none}.content-editor-wrapper{border:1px solid var(--border-color);border-radius:var(--border-radius-md);overflow:hidden}.content-toolbar{display:flex;align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:6px 8px;gap:0}.content-format-buttons{display:flex;gap:2px;padding-right:8px;border-right:1px solid var(--border-color);margin-right:8px}.content-mode-buttons{display:flex;gap:4px}.content-format-btn{padding:4px 8px;background:none;border:1px solid transparent;border-radius:4px;color:var(--text-muted);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;min-width:28px}.content-format-btn:hover{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-primary)}.content-mode-btn{padding:4px 12px;background:none;border:1px solid transparent;border-radius:4px;color:var(--text-muted);font-size:12px;cursor:pointer;transition:all .2s}.content-mode-btn:hover{color:var(--text-primary)}.content-mode-btn.active{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-primary)}.content-editor-wrapper textarea{border:none;border-radius:0;background:var(--bg-tertiary);resize:vertical}.content-editor-wrapper textarea:focus{border:none}.content-preview{padding:14px;background:var(--bg-tertiary);min-height:200px;font-size:14px;line-height:1.7}.content-preview.hidden,.content-editor-wrapper textarea.hidden{display:none}.content-preview h1,.content-preview h2,.content-preview h3{margin-top:16px;margin-bottom:8px}.content-preview p{margin-bottom:12px}.content-preview code{background:var(--bg-secondary);padding:2px 6px;border-radius:4px;font-size:13px}.content-preview pre{background:var(--bg-secondary);padding:12px;border-radius:6px;overflow-x:auto;margin-bottom:12px}.content-preview pre code{background:none;padding:0}.content-preview ul,.content-preview ol{margin-bottom:12px;padding-left:24px}.content-preview blockquote{border-left:3px solid var(--primary);padding-left:12px;color:var(--text-secondary);margin-bottom:12px}#post-editor-form .form-row{display:flex;gap:12px}#post-editor-form .form-row .form-group{flex:1}.btn-cancel{padding:10px 20px;background:transparent;border:1px solid var(--border-color);border-radius:var(--border-radius-md);color:var(--text-secondary);font-size:14px;cursor:pointer;transition:all .2s}.btn-cancel:hover{border-color:var(--text-primary);color:var(--text-primary)}.post-editor-page{padding:0 0 48px}.post-editor-header{display:flex;align-items:center;gap:16px;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--border-color)}.post-editor-header h1{font-size:24px;font-weight:700;display:flex;align-items:center;gap:12px}.type-select{font-size:13px;padding:4px 10px;border-radius:12px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;font-weight:600}.btn-back{display:inline-flex;align-items:center;gap:4px;background:none;border:1px solid var(--border-color);color:var(--text-secondary);font-size:13px;padding:8px 14px;border-radius:var(--border-radius-md);text-decoration:none;transition:all .2s;cursor:pointer}.btn-back:hover{color:var(--text-primary);border-color:var(--text-primary)}.editor-layout{display:flex;flex-direction:column;gap:20px}.editor-meta-column{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.editor-content-column{display:flex;flex-direction:column;gap:16px}.post-editor-full-form{display:flex;flex-direction:column;gap:0}.post-editor-full-form .form-actions{display:flex;gap:12px;justify-content:flex-end;padding-top:20px;border-top:1px solid var(--border-color);margin-top:20px}@media (max-width: 700px){.post-editor-page{padding:0 0 32px}}@media (max-width: 600px){.admin-header,.admin-post-item{flex-direction:column;align-items:flex-start;gap:16px}.admin-post-actions{width:100%}.btn-edit-post,.btn-delete-post{flex:1;text-align:center}.form-row,#post-editor-form .form-row{flex-direction:column;gap:0}.admin-login-card{padding:32px 24px}}.analytics-header{margin-bottom:32px}.analytics-header h2{font-size:24px;font-weight:700;margin-bottom:4px}.analytics-subtitle{color:var(--text-muted);font-size:14px}.analytics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;margin-bottom:40px}.analytics-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:20px;text-align:center}.analytics-card.highlight{border-color:var(--primary);background:linear-gradient(135deg,#7c4dff14,#7c4dff05)}.analytics-card-label{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-weight:600;margin-bottom:8px}.analytics-card-value{font-size:32px;font-weight:700;color:var(--text-primary)}.analytics-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);padding:24px}.analytics-section h3{font-size:16px;font-weight:600;margin-bottom:16px}.analytics-table{width:100%;border-collapse:collapse}.analytics-table th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-weight:600;padding:8px 12px;border-bottom:1px solid var(--border-color)}.analytics-table td{padding:10px 12px;font-size:14px;border-bottom:1px solid var(--border-color)}.analytics-table tr:last-child td{border-bottom:none}.analytics-table td:last-child{text-align:right;font-weight:600;color:var(--primary)}.analytics-no-data{color:var(--text-muted);font-size:14px;text-align:center;padding:20px}.analytics-loading{text-align:center;padding:60px;color:var(--text-muted)}