@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&family=Noto+Sans+JP:wght@400;500;700;900&display=swap";:root,[data-theme=light],.force-light-theme{--bg-color:#f0f4f8;--bg-pattern:url("data:image/svg+xml,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cpattern id='waves' x='0' y='0' width='40' height='40' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='20' cy='20' r='20' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='20' cy='20' r='14' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='20' cy='20' r='8' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='0' cy='40' r='20' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='0' cy='40' r='14' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='0' cy='40' r='8' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='40' cy='40' r='20' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='40' cy='40' r='14' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3Ccircle cx='40' cy='40' r='8' fill='none' stroke='%232563eb' stroke-width='2' stroke-opacity='0.08'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='40' height='40' fill='url(%23waves)'/%3E%3C/svg%3E");--surface-color:#fff;--surface-hover:#f1f5f9;--border-color:#e2e8f0;--sidebar-bg:#1e3a5f;--sidebar-active:#2d5186;--sidebar-text:#cbd5e1;--sidebar-text-active:#fff;--sidebar-icon:#94a3b8;--sidebar-width:220px;--text-primary:#1e293b;--text-secondary:#64748b;--text-muted:#94a3b8;--accent-color:#2563eb;--accent-light:#eff6ff;--accent-hover:#1d4ed8;--success-color:#10b981;--success-light:#ecfdf5;--warning-color:#f59e0b;--warning-light:#fffbeb;--danger-color:#ef4444;--danger-light:#fef2f2;--font-ui:"Be Vietnam Pro", sans-serif;--font-jp:"Noto Sans JP", sans-serif;--shadow-xs:0 1px 2px 0 #0000000d;--shadow-sm:0 1px 3px 0 #00000012, 0 1px 2px -1px #00000012;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #00000012;--shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #00000014;--shadow-xl:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px}[data-theme=dark]{--bg-color:#0f172a;--bg-pattern:url("data:image/svg+xml,%3Csvg width='28' height='49' viewBox='0 0 28 49' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%233b82f6' stroke-opacity='0.1' fill='none' fill-rule='evenodd'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/svg%3E");--surface-color:#1e293b;--surface-hover:#334155;--border-color:#334155;--sidebar-bg:#090d16;--sidebar-active:#1d314f;--sidebar-text:#94a3b8;--sidebar-text-active:#fff;--sidebar-icon:#64748b;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#64748b;--accent-color:#3b82f6;--accent-light:#3b82f626;--accent-hover:#60a5fa;--success-color:#10b981;--success-light:#10b98126;--warning-color:#fbbf24;--warning-light:#fbbf2426;--danger-color:#f87171;--danger-light:#f8717126}[data-theme=sepia]{--bg-color:#f4ecd8;--bg-pattern:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 0h2v2H5V0zm4 0h2v2H9V0zm-4 4h2v2H5V4zm4 0h2v2H9V4zm-4 4h2v2H5V8zm4 0h2v2H9V8zm-4 4h2v2H5v-2zm4 0h2v2H9v-2zM1 0h2v2H1V0zm0 4h2v2H1V4zm0 4h2v2H1V8zm0 4h2v2H1v-2z' fill='%23b58900' fill-opacity='0.08' fill-rule='evenodd'/%3E%3C/svg%3E");--surface-color:#fdf6e3;--surface-hover:#eee8d5;--border-color:#e4dbbf;--sidebar-bg:#433422;--sidebar-active:#5c4730;--sidebar-text:#b9a997;--sidebar-text-active:#fdf6e3;--sidebar-icon:#8b7964;--text-primary:#5b4636;--text-secondary:#826c59;--text-muted:#a38f7d;--accent-color:#b58900;--accent-light:#f7eed2;--accent-hover:#cb4b16;--success-color:#859900;--success-light:#ebf1d5;--warning-color:#cb4b16;--warning-light:#fbebe3;--danger-color:#d33682;--danger-light:#fbe5f0}[data-theme=sakura]{--bg-color:#fff0f3;--bg-pattern:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ff4d6d' fill-opacity='0.1'%3E%3Ccircle cx='20' cy='20' r='5'/%3E%3Ccircle cx='20' cy='11' r='4'/%3E%3Ccircle cx='20' cy='29' r='4'/%3E%3Ccircle cx='11' cy='20' r='4'/%3E%3Ccircle cx='29' cy='20' r='4'/%3E%3C/g%3E%3C/svg%3E");--surface-color:#fff;--surface-hover:#ffe3e8;--border-color:#ffccd5;--sidebar-bg:#590d22;--sidebar-active:#800f2f;--sidebar-text:#ffccd5;--sidebar-text-active:#fff;--sidebar-icon:#c9184a;--text-primary:#4a0d1b;--text-secondary:#8c2f39;--text-muted:#c97d8b;--accent-color:#ff4d6d;--accent-light:#fff0f3;--accent-hover:#ff758f;--success-color:#2ec4b6;--success-light:#e6f9f8;--warning-color:#ff9f1c;--warning-light:#fff5e6;--danger-color:#e63946;--danger-light:#ffebeb}html,html body{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%232563eb%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,auto}a,button,select,[role=button],.btn-primary,.btn-secondary,.btn-icon,.nav-item,.theme-dot,.notification-bell-btn,.notification-item,[style*="cursor: pointer"]{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%231d4ed8%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,pointer!important}html[data-theme=dark],html[data-theme=dark] body{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%233b82f6%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,auto}html[data-theme=dark] a,html[data-theme=dark] button,html[data-theme=dark] select,html[data-theme=dark] [role=button],html[data-theme=dark] .btn-primary,html[data-theme=dark] .btn-secondary,html[data-theme=dark] .btn-icon,html[data-theme=dark] .nav-item,html[data-theme=dark] .theme-dot,html[data-theme=dark] .notification-bell-btn,html[data-theme=dark] .notification-item,html[data-theme=dark] [style*="cursor: pointer"]{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%2360a5fa%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,pointer!important}html[data-theme=sepia],html[data-theme=sepia] body{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%23b58900%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,auto}html[data-theme=sepia] a,html[data-theme=sepia] button,html[data-theme=sepia] select,html[data-theme=sepia] [role=button],html[data-theme=sepia] .btn-primary,html[data-theme=sepia] .btn-secondary,html[data-theme=sepia] .btn-icon,html[data-theme=sepia] .nav-item,html[data-theme=sepia] .theme-dot,html[data-theme=sepia] .notification-bell-btn,html[data-theme=sepia] .notification-item,html[data-theme=sepia] [style*="cursor: pointer"]{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%23cb4b16%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,pointer!important}html[data-theme=sakura],html[data-theme=sakura] body{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%23ff4d6d%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,auto}html[data-theme=sakura] a,html[data-theme=sakura] button,html[data-theme=sakura] select,html[data-theme=sakura] [role=button],html[data-theme=sakura] .btn-primary,html[data-theme=sakura] .btn-secondary,html[data-theme=sakura] .btn-icon,html[data-theme=sakura] .nav-item,html[data-theme=sakura] .theme-dot,html[data-theme=sakura] .notification-bell-btn,html[data-theme=sakura] .notification-item,html[data-theme=sakura] [style*="cursor: pointer"]{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M 2 2 L 2 20 L 7 15 L 12 23 L 15 21 L 10 13 L 17 13 Z%22 fill=%22%23c9184a%22 stroke=%22%23ffffff%22 stroke-width=%221.5%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 2 2,pointer!important}html{scrollbar-gutter:stable}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-ui);background-color:var(--bg-color);background-image:var(--bg-pattern);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-attachment:fixed;min-height:100vh;line-height:1.6}.jp-text{font-family:var(--font-jp)}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:700;line-height:1.25}.app-layout{width:100%;min-height:100vh;position:relative;overflow-x:hidden}.app-sidebar{width:var(--sidebar-width);background-color:var(--sidebar-bg);z-index:100;flex-direction:column;flex-shrink:0;min-height:100vh;transition:width .3s;display:flex;position:fixed;top:0;bottom:0;left:0}.app-main{margin-left:var(--sidebar-width);scrollbar-gutter:stable;background-color:#0000;min-height:100vh;padding-top:60px;transition:margin-left .3s;overflow-y:auto}.app-layout.no-sidebar .app-main{width:100%;margin-left:0;padding-top:0}.app-header{background-color:var(--surface-color);border-bottom:1px solid var(--border-color);height:60px;top:0;right:0;left:var(--sidebar-width);z-index:90;box-shadow:var(--shadow-xs);justify-content:space-between;align-items:center;padding:0 24px;transition:left .3s;display:flex;position:fixed}.app-layout.sidebar-collapsed .app-header{left:60px}.app-layout.no-sidebar .app-header{display:none;left:0}.header-left{align-items:center;gap:12px;display:flex}.header-streak-badge{background:var(--accent-light);border:1px solid var(--border-color);color:var(--accent-color);box-shadow:var(--shadow-xs);border-radius:20px;align-items:center;gap:6px;padding:5px 14px;font-size:.84rem;font-weight:700;display:flex}.streak-icon{color:#ef4444;fill:#f59e0b}.header-right{align-items:center;gap:20px;display:flex}.header-theme-selector{border-right:1px solid var(--border-color);align-items:center;gap:6px;padding-right:16px;display:flex}.theme-dot{cursor:pointer;border:1px solid #00000026;border-radius:50%;width:14px;height:14px;padding:0;transition:transform .15s,border-color .15s}.theme-dot:hover{transform:scale(1.2)}html[data-custom-bg=true] body:before{content:"";background-image:var(--custom-bg-image);filter:blur(8px)brightness(.6);z-index:-2;background-position:50%;background-size:cover;background-attachment:fixed;position:fixed;inset:-10px}html[data-custom-bg=true] body{background-color:#0000!important;background-image:none!important}.theme-dot.active{border:2px solid var(--accent-color);transform:scale(1.1)}[data-theme=dark] .theme-dot.active{border-color:#fff}.light-dot{background-color:#fff}.dark-dot{background-color:#0f172a}.sepia-dot{background-color:#f4ecd8}.sakura-dot{background-color:#fff0f3}.header-profile-section{align-items:center;gap:16px;display:flex}.header-user-info{cursor:pointer;border-radius:var(--radius-sm);align-items:center;gap:8px;padding:4px 8px;transition:background-color .15s;display:flex}.header-user-info:hover{background-color:var(--surface-hover)}.header-avatar{color:#fff;background:linear-gradient(135deg,#60a5fa,#3b82f6);border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:.8rem;font-weight:700;display:flex;overflow:hidden}.header-user-details{flex-direction:column;display:flex}.header-username{color:var(--text-primary);font-size:.8rem;font-weight:600;line-height:1.2}.header-role{color:var(--text-secondary);font-size:.65rem;line-height:1.2}.header-logout-btn{border-radius:var(--radius-sm);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;background:0 0;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;font-weight:500;transition:all .15s;display:flex}.header-logout-btn:hover{background-color:var(--danger-light);border-color:var(--danger-color);color:var(--danger-color)}.container{max-width:1100px;margin:0 auto;padding:0 24px}.page-content{max-width:1100px;margin:0 auto;padding:32px 24px}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.sidebar-header{border-bottom:1px solid #ffffff14;padding:24px 20px 20px}.sidebar-logo{cursor:pointer;align-items:center;gap:10px;text-decoration:none;display:flex}.sidebar-logo-icon{color:#fff;background:linear-gradient(135deg,#60a5fa,#3b82f6);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.1rem;font-weight:900;display:flex}.sidebar-logo-text h1{color:#fff;letter-spacing:.5px;white-space:nowrap;text-overflow:ellipsis;font-size:.92rem;font-weight:800;line-height:1.2;overflow:hidden}.sidebar-logo-text span{color:var(--sidebar-text);white-space:nowrap;text-overflow:ellipsis;font-size:.68rem;font-weight:400;display:block;overflow:hidden}.sidebar-nav{scrollbar-width:none;flex-direction:column;flex:1;gap:3px;padding:16px 12px;display:flex;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{display:none}.sidebar-section-label{color:var(--sidebar-icon);text-transform:uppercase;letter-spacing:1px;white-space:nowrap;text-overflow:ellipsis;flex-shrink:0;padding:12px 8px 4px;font-size:.65rem;font-weight:700;overflow:hidden}.sidebar-link{border-radius:var(--radius-md);cursor:pointer;color:var(--sidebar-text);font-size:.875rem;font-weight:500;font-family:var(--font-ui);text-align:left;background:0 0;border:none;flex-shrink:0;align-items:center;gap:10px;width:100%;padding:10px 12px;transition:all .15s;display:flex}.sidebar-link:hover{color:#fff;background-color:#ffffff14}.sidebar-link.active{background-color:var(--sidebar-active);color:var(--sidebar-text-active)}.sidebar-link svg{opacity:.75;flex-shrink:0}.sidebar-link.active svg{opacity:1}.sidebar-link span{white-space:nowrap;text-overflow:ellipsis;transition:opacity .2s;overflow:hidden}.sidebar-footer{border-top:1px solid #ffffff14;padding:16px 12px}.sidebar-user{border-radius:var(--radius-md);cursor:pointer;align-items:center;gap:10px;margin-bottom:8px;padding:10px 12px;transition:background .15s;display:flex}.sidebar-user:hover{background-color:#ffffff14}.sidebar-avatar{color:#fff;background:linear-gradient(135deg,#60a5fa,#3b82f6);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;font-weight:700;display:flex;overflow:hidden}.sidebar-user-info{flex:1;overflow:hidden}.sidebar-user-name{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:.83rem;font-weight:600;overflow:hidden}.sidebar-user-role{color:var(--sidebar-text);font-size:.7rem}.sidebar-btn{border-radius:var(--radius-md);width:100%;color:var(--sidebar-text);font-family:var(--font-ui);cursor:pointer;text-align:left;background:#ffffff12;border:none;align-items:center;gap:8px;padding:9px 12px;font-size:.83rem;font-weight:500;transition:all .15s;display:flex}.sidebar-btn:hover{color:#fff;background:#ffffff21}.sidebar-btn span{white-space:nowrap;text-overflow:ellipsis;transition:opacity .2s;overflow:hidden}.sidebar-toggle-btn{background-color:var(--surface-color);color:var(--sidebar-bg);border:1px solid var(--border-color);cursor:pointer;z-index:100;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:all .2s;display:flex;position:absolute;top:30px;right:-14px;box-shadow:0 2px 5px #00000014}.sidebar-toggle-btn:hover{color:var(--accent-color);background-color:var(--surface-hover);transform:scale(1.1)}.btn{border-radius:var(--radius-md);cursor:pointer;font-size:.88rem;font-weight:600;font-family:var(--font-ui);white-space:nowrap;border:none;justify-content:center;align-items:center;gap:8px;padding:9px 18px;transition:all .2s;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--accent-color);color:#fff;box-shadow:0 2px 8px #2563eb40}.btn-primary:hover:not(:disabled){background-color:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 12px #2563eb59}.btn-primary:active{transform:translateY(0)}.btn-secondary{background-color:var(--surface-color);color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover:not(:disabled){background-color:var(--surface-hover);border-color:#cbd5e1}.btn-success{background-color:var(--success-color);color:#fff}.btn-danger{background-color:var(--danger-color);color:#fff}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border-color);background:0 0}.btn-ghost:hover:not(:disabled){background-color:var(--surface-hover);color:var(--text-primary)}.btn-icon{border-radius:var(--radius-md);background-color:var(--surface-color);width:36px;height:36px;color:var(--text-secondary);border:1px solid var(--border-color);cursor:pointer;font-family:var(--font-ui);justify-content:center;align-items:center;padding:0;transition:all .2s;display:flex}.btn-icon:hover{background-color:var(--surface-hover);color:var(--text-primary)}.btn-login{background-color:var(--accent-color);color:#fff;box-shadow:0 2px 8px #2563eb40}.btn-login:hover{background-color:var(--accent-hover)}.btn-logout{color:var(--danger-color);background-color:#0000;border:1px solid #ef44444d;padding:6px 12px;font-size:.82rem}.btn-logout:hover{background-color:var(--danger-light)}.card{background-color:var(--surface-color);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);padding:24px;transition:box-shadow .2s}.card:hover{box-shadow:var(--shadow-md)}input,textarea,select{font-family:var(--font-ui);color:var(--text-primary)}.input-field{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:var(--surface-color);width:100%;color:var(--text-primary);font-size:.88rem;font-family:var(--font-ui);outline:none;padding:10px 14px;transition:border-color .2s,box-shadow .2s}.input-field:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px #2563eb1a}.input-field::placeholder{color:var(--text-muted)}.flashcard-container{perspective:1200px;cursor:pointer;width:100%;max-width:920px;height:480px;margin:0 auto}.card-swipe-wrapper{z-index:5;width:100%;position:relative;overflow:visible!important}.card-swipe-out-right{pointer-events:none;z-index:20;animation:.35s cubic-bezier(.4,0,.2,1) forwards cardTossRight!important}.card-swipe-out-left{pointer-events:none;z-index:20;animation:.35s cubic-bezier(.4,0,.2,1) forwards cardTossLeft!important}.card-swipe-in-new{animation:.35s cubic-bezier(.175,.885,.32,1.25) forwards cardPopIn}@keyframes cardTossRight{0%{opacity:1;transform:translate(0)rotate(0)scale(1)}40%{opacity:.9}to{opacity:0;transform:translate(120vw,-100px)rotate(35deg)scale(.85)}}@keyframes cardTossLeft{0%{opacity:1;transform:translate(0)rotate(0)scale(1)}40%{opacity:.9}to{opacity:0;transform:translate(-120vw,-100px)rotate(-35deg)scale(.85)}}@keyframes cardPopIn{0%{opacity:.1;transform:translateY(40px)scale(.93)}to{opacity:1;transform:translateY(0)scale(1)}}.flashcard-back-content{box-sizing:border-box;flex-direction:row;align-items:stretch;gap:18px;height:100%;padding:16px 20px;display:flex}.flashcard-back-left{border-right:1px solid var(--border-color);flex-direction:column;flex:0 0 250px;justify-content:space-between;padding-right:16px;display:flex}.flashcard-back-right{box-sizing:border-box;flex-direction:column;flex:auto;justify-content:flex-start;gap:14px;height:100%;max-height:100%;display:flex}.flashcard{width:100%;height:100%;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,.2,.2,1);position:relative}.flashcard.is-flipped{transform:rotateY(180deg)}.flashcard-page-premium-bg{background:radial-gradient(circle at 0% 0%, #3b82f626 0%, transparent 50%), radial-gradient(circle at 100% 100%, #8b5cf626 0%, transparent 50%), var(--background-color);background-attachment:fixed;flex-direction:column;align-items:center;min-height:calc(100vh - 64px);display:flex;position:relative;overflow:hidden}.flashcard-content-wrapper{z-index:10;width:100%;max-width:1100px;padding:20px}.flashcard-face{backface-visibility:hidden;border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(24px);background:#fff9;border:1px solid #ffffff80;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:40px;display:flex;position:absolute;top:0;left:0;box-shadow:0 12px 40px #00000014}[data-theme=dark] .flashcard-face{background:#1e293ba6;border:1px solid #ffffff1a;box-shadow:0 12px 40px #0006}.flashcard-face:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#ffffffb3,#fff0);padding:2px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}[data-theme=dark] .flashcard-face:before{background:linear-gradient(135deg,#fff3,#fff0)}.flashcard-front{transform:rotateY(0)}.flashcard-back{transform:rotateY(180deg)}.progress-bg{background-color:var(--border-color);border-radius:3px;width:100%;height:6px;overflow:hidden}.progress-fill{background-color:var(--accent-color);border-radius:3px;height:100%;transition:width .3s}.level-badge{text-transform:uppercase;background-color:var(--accent-light);color:var(--accent-color);border:1px solid #2563eb33;border-radius:20px;padding:3px 10px;font-size:.75rem;font-weight:700;display:inline-block}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px;display:flex}.page-title{color:var(--text-primary);font-size:1.45rem;font-weight:800}.page-subtitle{color:var(--text-secondary);margin-top:3px;font-size:.85rem}.stat-card{background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-xs);padding:20px 24px}.stat-value{color:var(--text-primary);font-size:1.9rem;font-weight:800;line-height:1}.stat-label{color:var(--text-secondary);margin-top:4px;font-size:.8rem;font-weight:500}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.35s forwards fadeIn}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.grid{gap:16px;display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}.table-clean{border-collapse:collapse;width:100%;font-size:.875rem}.table-clean th{text-align:left;background-color:var(--surface-hover);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-color);padding:11px 14px;font-size:.75rem;font-weight:600}.table-clean td{border-bottom:1px solid var(--border-color);color:var(--text-primary);padding:11px 14px}.table-clean tr:last-child td{border-bottom:none}.table-clean tbody tr:hover{background-color:var(--accent-light);cursor:pointer}.custom-scrollbar::-webkit-scrollbar{width:5px}.custom-scrollbar::-webkit-scrollbar-track{background:0 0}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#cbd5e1}.hide-scrollbar::-webkit-scrollbar{display:none}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.mobile-menu-toggle-btn{color:var(--text-primary);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;padding:6px;transition:background-color .15s;display:none}.mobile-menu-toggle-btn:hover{background-color:var(--surface-hover)}.sidebar-mobile-close-btn{color:#fff;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff26;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:none;position:absolute;top:20px;right:14px}.sidebar-mobile-close-btn:hover{background:#fff3;transform:scale(1.05)}.sidebar-mobile-backdrop{-webkit-backdrop-filter:blur(4px);z-index:998;opacity:0;background:#0000008c;transition:opacity .3s;display:none;position:fixed;inset:0}.sidebar-mobile-backdrop.active{opacity:1;display:block}@media (width<=900px){.grid-cols-4,.grid-cols-3{grid-template-columns:repeat(2,1fr)}.grid-cols-2{grid-template-columns:1fr}.flashcard-container{max-height:calc(100vh - 160px);height:clamp(520px,76vh,680px)!important}.flashcard-face.flashcard-back{-webkit-overflow-scrolling:touch;display:block!important;overflow-y:auto!important}.flashcard-back-content{flex-direction:column!important;gap:14px!important;height:auto!important;min-height:100%!important;padding:14px 10px!important}.flashcard-back-left{border-right:none!important;border-bottom:1px solid var(--border-color)!important;flex:none!important;width:100%!important;padding-bottom:14px!important;padding-right:0!important}.flashcard-back-right{flex:auto!important;width:100%!important;height:auto!important;min-height:320px!important;overflow-y:visible!important}}@media (width<=768px){.app-sidebar{transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;transform:translate(-100%);box-shadow:4px 0 25px #0000004d;z-index:1000!important;width:280px!important;max-width:85vw!important;position:fixed!important;top:0!important;bottom:0!important;left:0!important}.app-sidebar.mobile-open{transform:translate(0)!important}.sidebar-toggle-btn{display:none!important}.sidebar-mobile-close-btn,.mobile-menu-toggle-btn{display:flex!important}.sidebar-logo-text,.sidebar-user-info,.sidebar-section-label,.sidebar-link span,.sidebar-btn span{display:inline!important}.sidebar-link{justify-content:flex-start!important;gap:12px!important;padding:12px 16px!important;font-size:.95rem!important}.sidebar-header{padding:20px 16px 18px!important}.sidebar-logo{justify-content:flex-start!important}.sidebar-user{justify-content:flex-start!important;padding:12px 16px!important}.app-main{padding-top:60px;width:100%!important;margin-left:0!important}.app-header{width:100%!important;padding:0 12px!important;left:0!important}.container{padding:0 12px!important}.page-content{padding:20px 12px!important}.kanji-detail-overlay{padding:16px 8px!important;left:0!important}}.app-layout.sidebar-collapsed .app-sidebar{width:60px}.app-layout.sidebar-collapsed .app-main{margin-left:60px}.app-layout.sidebar-collapsed .sidebar-logo-text,.app-layout.sidebar-collapsed .sidebar-user-info,.app-layout.sidebar-collapsed .sidebar-section-label,.app-layout.sidebar-collapsed .sidebar-link span,.app-layout.sidebar-collapsed .sidebar-btn span{display:none}.app-layout.sidebar-collapsed .sidebar-link{justify-content:center;padding:12px}.app-layout.sidebar-collapsed .sidebar-header{padding:16px 12px}.app-layout.sidebar-collapsed .sidebar-logo{justify-content:center}.app-layout.sidebar-collapsed .sidebar-user,.app-layout.sidebar-collapsed .sidebar-btn{justify-content:center;padding:10px}.app-layout.no-sidebar .app-sidebar{display:none}.app-layout.no-sidebar .app-main{margin-left:0}@media (width<=640px){.header-user-details,.header-logout-text{display:none!important}.header-logout-btn{padding:6px 8px!important}.header-right{gap:10px!important}.header-theme-selector{gap:4px!important;padding-right:8px!important}.header-streak-badge{padding:4px 10px!important;font-size:.76rem!important}.page-title{font-size:1.25rem!important}.stat-card{padding:14px 16px!important}.stat-value{font-size:1.5rem!important}.flashcard-face{border-radius:16px!important;padding:20px 14px!important}.glass-pill-btn{padding:10px 4px!important;font-size:.78rem!important}}@media (width<=480px){.grid-cols-4,.grid-cols-3,.grid-cols-2{grid-template-columns:1fr!important}.header-theme-selector{gap:3px!important;padding-right:6px!important}.theme-dot{width:12px!important;height:12px!important}.header-avatar{width:28px!important;height:28px!important;font-size:.75rem!important}.page-header{margin-bottom:18px!important}}.kanji-detail-overlay{z-index:999;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-sizing:border-box;background:#0a0f1eb8;justify-content:center;align-items:flex-start;padding:40px 24px;transition:left .3s cubic-bezier(.4,0,.2,1);display:flex;inset:0 0 0 240px;overflow-y:auto;position:fixed!important}.app-layout.sidebar-collapsed .kanji-detail-overlay{left:60px}@media (width<=768px){.kanji-detail-overlay{padding:16px 8px!important;left:0!important}}.table-responsive-wrapper{-webkit-overflow-scrolling:touch;width:100%;margin-bottom:12px;overflow-x:auto}.glass-pill-btn{-webkit-backdrop-filter:blur(8px);cursor:pointer;background:#ffffff80;border:1px solid #fff3;border-radius:20px;flex:1;justify-content:center;align-items:center;min-height:44px;padding:10px 4px;font-size:.85rem;font-weight:600;transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;box-shadow:0 4px 12px #0000000d}[data-theme=dark] .glass-pill-btn{background:#0000004d;border:1px solid #ffffff1a}.glass-pill-btn:hover{transform:translateY(-3px)scale(1.02);box-shadow:0 8px 16px #0000001a}.glass-pill-btn:active{transform:translateY(1px)scale(.98)}.glass-pill-forgot{color:#ef4444;border-color:#ef44444d}.glass-pill-forgot:hover{background:#ef44441a;box-shadow:0 6px 20px #ef444433}.glass-pill-hard{color:#f59e0b;border-color:#f59e0b4d}.glass-pill-hard:hover{background:#f59e0b1a;box-shadow:0 6px 20px #f59e0b33}.glass-pill-good{color:#3b82f6;border-color:#3b82f64d}.glass-pill-good:hover{background:#3b82f61a;box-shadow:0 6px 20px #3b82f633}.glass-pill-easy{color:#10b981;border-color:#10b9814d}.glass-pill-easy:hover{background:#10b9811a;box-shadow:0 6px 20px #10b98133}.daily-study-page-bg{background:radial-gradient(circle at 80% 20%, #f59e0b26 0%, transparent 40%), radial-gradient(circle at 20% 80%, #10b9811a 0%, transparent 40%), var(--background-color);background-attachment:fixed;min-height:calc(100vh - 64px);position:relative;overflow:hidden}.glass-card{-webkit-backdrop-filter:blur(12px);background:#fff6;border:1px solid #fff6;border-radius:20px;transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:0 4px 16px #0000000d}[data-theme=dark] .glass-card{background:#1e293b66;border:1px solid #ffffff0d;box-shadow:0 4px 16px #00000026}.glass-card:hover{background:#fff9;border-color:#ffffffb3;transform:translateY(-4px)scale(1.02);box-shadow:0 12px 32px #00000014}[data-theme=dark] .glass-card:hover{background:#1e293b99;border-color:#ffffff26;box-shadow:0 12px 32px #0000004d}.virtual-row{content-visibility:auto;contain-intrinsic-size:0 72px}.virtual-card{content-visibility:auto;contain-intrinsic-size:0 160px}.virtual-grid-item{content-visibility:auto;contain-intrinsic-size:150px 180px}.gpu-accelerated{will-change:transform, opacity;backface-visibility:hidden;transform:translateZ(0)}.notification-bell-container{display:inline-block;position:relative}.notification-bell-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:background-color .2s;display:flex;position:relative}.notification-bell-btn:hover{background-color:var(--surface-hover);color:var(--text-primary)}.notification-badge{background-color:var(--danger-color);color:#fff;border:2px solid var(--surface-color);border-radius:10px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.65rem;font-weight:700;display:flex;position:absolute;top:2px;right:2px;transform:scale(.9)}.notification-dropdown{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);width:340px;box-shadow:var(--shadow-lg);z-index:100;margin-top:8px;animation:.2s dropdown-fade-in;position:absolute;top:100%;right:0;overflow:hidden}@keyframes dropdown-fade-in{0%{opacity:0;transform:translateY(-10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.notification-header{border-bottom:1px solid var(--border-color);background-color:var(--surface-hover);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.notification-title{color:var(--text-primary);margin:0;font-size:.95rem;font-weight:700}.notification-mark-all{color:var(--accent-color);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;align-items:center;gap:4px;padding:4px 8px;font-size:.75rem;font-weight:600;display:flex}.notification-mark-all:hover{background-color:var(--accent-light)}.notification-list{max-height:400px;overflow-y:auto}.notification-empty{text-align:center;color:var(--text-secondary);flex-direction:column;align-items:center;gap:8px;padding:32px 16px;display:flex}.notification-item{border-bottom:1px solid var(--border-color);gap:12px;padding:14px 16px;transition:background-color .2s;display:flex;position:relative}.notification-item:last-child{border-bottom:none}.notification-item.unread{background-color:var(--accent-light)}.notification-item:hover{background-color:var(--surface-hover)}.notification-icon-wrapper{flex-shrink:0;margin-top:2px}.notification-content-wrapper{flex-grow:1}.notification-item-header{justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px;display:flex}.notification-item-title{color:var(--text-primary);margin:0;font-size:.85rem;font-weight:600}.notification-item-time{color:var(--text-secondary);white-space:nowrap;font-size:.7rem}.notification-item-message{color:var(--text-secondary);margin:0;font-size:.8rem;line-height:1.4}.notification-item.unread .notification-item-message{color:var(--text-primary)}.notification-read-btn{cursor:pointer;color:var(--accent-color);background:0 0;border:none;border-radius:50%;justify-content:center;align-self:center;align-items:center;padding:6px;transition:background-color .2s;display:flex}.notification-read-btn:hover{background-color:#0000000d}[data-theme=dark] .notification-read-btn:hover{background-color:#ffffff1a}.notification-read-dot{background-color:var(--accent-color);border-radius:50%;width:8px;height:8px}@media (width<=480px){.notification-dropdown{width:auto;max-width:calc(100vw - 24px);position:fixed;top:60px;left:12px;right:12px}}.ai-chat-fab{color:#fff;width:60px;height:60px;box-shadow:none;cursor:pointer;z-index:9999;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),box-shadow .3s,background .3s;display:flex;position:fixed;bottom:92px;right:22px}.ai-chat-fab:hover{box-shadow:none;transform:scale(1.15)}.ai-chat-fab:active{transform:scale(.94)}.ai-chat-fab.open{background:0 0;transform:rotate(0)}@keyframes mascot-float{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-4px)rotate(-2deg)}75%{transform:translateY(-4px)rotate(2deg)}}.ai-chat-fab img{animation:3s ease-in-out infinite mascot-float}.ai-fab-ring{border:2.5px solid #a78bfab3;border-top-color:#0000;border-radius:50%;animation:.9s linear infinite fabRingSpin;position:absolute;inset:-4px}@keyframes fabRingSpin{to{transform:rotate(360deg)}}.ai-chat-panel{background:var(--surface-color);border:1px solid var(--border-color);width:420px;max-height:650px;box-shadow:var(--shadow-xl);z-index:9998;transform-origin:100% 100%;border-radius:20px;flex-direction:column;animation:.28s cubic-bezier(.16,1,.3,1) forwards aiPanelOpen;display:flex;position:fixed;bottom:164px;right:24px;overflow:hidden}@keyframes aiPanelOpen{0%{opacity:0;transform:scale(.85)translateY(16px)}to{opacity:1;transform:scale(1)translateY(0)}}.ai-chat-header{background:var(--accent-color);color:#fff;flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.ai-chat-header-info{align-items:center;gap:10px;display:flex}.ai-chat-avatar-sm{background:#fff3;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.ai-chat-title{letter-spacing:.01em;align-items:center;gap:5px;font-size:.9rem;font-weight:700;display:flex}.ai-chat-sparkle{color:#fde68a;animation:2s infinite sparkleAnim}@keyframes sparkleAnim{0%,to{opacity:1;transform:scale(1)rotate(0)}50%{opacity:.6;transform:scale(1.2)rotate(20deg)}}.ai-chat-subtitle{opacity:.85;margin-top:1px;font-size:.72rem}.ai-chat-header-actions{align-items:center;gap:4px;display:flex}.ai-chat-icon-btn{color:#fff;cursor:pointer;background:#ffffff26;border:none;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;transition:background .2s;display:flex}.ai-chat-icon-btn:hover{background:#ffffff47}.ai-chat-messages{scroll-behavior:smooth;flex-direction:column;flex:1;gap:10px;padding:14px 12px;display:flex;overflow-y:auto}.ai-chat-messages::-webkit-scrollbar{width:4px}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.ai-bubble{align-items:flex-start;gap:7px;max-width:92%;animation:.22s bubbleIn;display:flex}@keyframes bubbleIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.ai-bubble.user{flex-direction:row-reverse;align-self:flex-end}.ai-bubble-avatar{background:var(--accent-color);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;margin-top:2px;display:flex}.ai-bubble-text{word-break:break-word;border-radius:14px;padding:8px 12px;font-size:.84rem;line-height:1.55}.ai-bubble.assistant .ai-bubble-text{background:var(--surface-hover);color:var(--text-primary);border:1px solid var(--border-color);border-radius:4px 14px 14px}.ai-bubble.user .ai-bubble-text{background:var(--accent-color);color:#fff;border-radius:14px 4px 14px 14px}.ai-bubble-text p{margin:0 0 8px}.ai-bubble-text p:last-child{margin-bottom:0}.ai-bubble-text ul,.ai-bubble-text ol{margin:4px 0 8px;padding-left:20px}.ai-bubble-text li{margin-bottom:4px}.ai-bubble-text strong{color:inherit;font-weight:600}.ai-bubble-text code{background:#0000001a;border-radius:4px;padding:2px 4px;font-family:monospace;font-size:.9em}.ai-bubble-text hr{border:none;border-top:1px solid var(--border-color);margin:10px 0}.ai-typing{background:var(--surface-hover);border:1px solid var(--border-color);border-radius:4px 14px 14px;align-items:center;gap:4px;padding:10px 14px;display:flex}.ai-typing span{background:var(--accent-color);border-radius:50%;width:7px;height:7px;animation:1.2s infinite typingDot}.ai-typing span:nth-child(2){animation-delay:.2s}.ai-typing span:nth-child(3){animation-delay:.4s}@keyframes typingDot{0%,80%,to{opacity:.4;transform:translateY(0)}40%{opacity:1;transform:translateY(-5px)}}.ai-quick-prompts{flex-wrap:wrap;gap:6px;padding:0 12px 10px;display:flex}.ai-quick-chip{border:1.5px solid var(--accent-color);color:var(--accent-color);cursor:pointer;white-space:nowrap;background:0 0;border-radius:20px;padding:5px 11px;font-size:.75rem;font-weight:500;transition:all .2s}.ai-quick-chip:hover{background:var(--accent-color);color:#fff;transform:translateY(-1px)}.ai-chat-input-area{border-top:1px solid var(--border-color);background:var(--bg-color);flex-direction:column;flex-shrink:0;gap:4px;padding:8px 12px 12px;display:flex}.ai-chat-input-meta{justify-content:flex-end;font-size:.71rem;display:flex}.ai-char-ok{color:var(--text-muted)}.ai-char-warn{color:var(--danger-color);font-weight:600}.ai-chat-input-row{align-items:flex-end;gap:8px;display:flex}.ai-chat-textarea{border:1.5px solid var(--border-color);font-size:.84rem;font-family:var(--font-ui);background:var(--surface-color);color:var(--text-primary);resize:none;border-radius:12px;flex:1;max-height:90px;padding:8px 11px;line-height:1.45;transition:border-color .2s,box-shadow .2s;overflow-y:auto}.ai-chat-textarea:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px var(--accent-light);outline:none}.ai-chat-textarea:disabled{opacity:.55}.ai-chat-send{background:var(--accent-color);color:#fff;cursor:pointer;width:38px;height:38px;box-shadow:var(--shadow-sm);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;transition:transform .2s,opacity .2s;display:flex}.ai-chat-send:hover:not(:disabled){transform:scale(1.1)}.ai-chat-send:disabled{opacity:.38;cursor:not-allowed;box-shadow:none}@media (width<=480px){.ai-chat-panel{width:auto;max-height:55vh;bottom:145px;left:12px;right:12px}.ai-chat-fab{width:52px;height:52px;bottom:80px;right:18px}}.study-timer-fab{color:#fff;cursor:pointer;z-index:9999;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#3b82f6,#2563eb);border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s,background .3s;display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 4px 18px #2563eb61,inset 0 1px 2px #ffffff40}.study-timer-fab:hover{transform:scale(1.08);box-shadow:0 6px 22px #2563eb80}.study-timer-fab:active{transform:scale(.95)}.study-timer-fab.open{background:linear-gradient(135deg,#1e40af,#1d4ed8)}.study-timer-fab.running{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 0 0 3px #3b82f640,0 4px 18px #2563eb73}.study-timer-fab-inner{flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex}.study-timer-fab-time{letter-spacing:-.02em;font-size:.65rem;font-weight:800;font-family:var(--font-jp,sans-serif);line-height:1}.study-timer-fab-pulse{pointer-events:none;border:2px solid #3b82f699;border-radius:50%;animation:2s cubic-bezier(.24,0,.38,1) infinite timerFabPulse;position:absolute;inset:-4px}@keyframes timerFabPulse{0%{opacity:.8;transform:scale(1)}70%{opacity:0;transform:scale(1.22)}to{opacity:0;transform:scale(1.22)}}.study-timer-panel{background:var(--surface-color,#fff);border:1px solid var(--border-color,#e2e8f0);width:340px;max-height:calc(100vh - 48px);box-shadow:var(--shadow-xl,0 20px 25px -5px #0000001a);z-index:9998;transform-origin:100% 100%;border-radius:20px;flex-direction:column;animation:.26s cubic-bezier(.16,1,.3,1) forwards timerPanelIn;display:flex;position:fixed;bottom:24px;right:92px;overflow:hidden}@keyframes timerPanelIn{0%{opacity:0;transform:scale(.92)translate(12px)}to{opacity:1;transform:scale(1)translate(0)}}.study-timer-panel.phase-focus{border-top:3px solid #3b82f6}.study-timer-panel.phase-short-break{border-top:3px solid #10b981}.study-timer-panel.phase-long-break{border-top:3px solid #8b5cf6}.study-timer-header{border-bottom:1px solid var(--border-color,#e2e8f0);background:var(--surface-color,#fff);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.study-timer-header-title{color:var(--text-primary,#1e293b);font-size:.95rem;font-weight:700;font-family:var(--font-jp,sans-serif);align-items:center;gap:8px;display:flex}.study-timer-title-icon{color:var(--accent-color,#2563eb)}.study-timer-header-actions{align-items:center;gap:4px;display:flex}.study-timer-icon-btn{width:32px;height:32px;color:var(--text-secondary,#64748b);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex}.study-timer-icon-btn:hover{background:var(--surface-hover,#f1f5f9);color:var(--text-primary,#1e293b)}.study-timer-phase-badge-container{flex-direction:column;align-items:center;padding:16px 18px 4px;display:flex}.study-timer-phase-badge{letter-spacing:.02em;font-size:.82rem;font-weight:700;font-family:var(--font-jp,sans-serif);border-radius:20px;align-items:center;gap:6px;padding:5px 14px;display:inline-flex}.study-timer-phase-badge.phase-focus{color:#2563eb;background:#3b82f61f;border:1px solid #3b82f640}.study-timer-phase-badge.phase-short-break{color:#059669;background:#10b9811f;border:1px solid #10b98140}.study-timer-phase-badge.phase-long-break{color:#7c3aed;background:#8b5cf61f;border:1px solid #8b5cf640}.study-timer-phase-sub{color:var(--text-muted,#94a3b8);font-size:.76rem;font-family:var(--font-jp,sans-serif);margin-top:4px}.study-timer-display-card{flex-direction:column;align-items:center;padding:16px 20px;display:flex}.study-timer-time{font-variant-numeric:tabular-nums;font-size:3.4rem;font-weight:800;font-family:var(--font-jp,-apple-system, sans-serif);color:var(--text-primary,#1e293b);letter-spacing:-.04em;text-shadow:0 1px 2px #0000000a;line-height:1.1}.study-timer-progress-track{background:var(--border-color,#e2e8f0);border-radius:3px;width:100%;height:6px;margin-top:14px;overflow:hidden}.study-timer-progress-bar{background:var(--accent-color,#2563eb);border-radius:3px;height:100%;transition:width .4s}.phase-short-break .study-timer-progress-bar{background:var(--success-color,#10b981)}.phase-long-break .study-timer-progress-bar{background:#8b5cf6}.study-timer-sessions{flex-direction:column;align-items:center;gap:4px;margin-top:14px;display:flex}.study-timer-dots{align-items:center;gap:7px;font-size:1.1rem;display:flex}.study-timer-dot{color:var(--text-muted,#94a3b8);line-height:1;transition:color .2s,transform .2s}.study-timer-dot.active{color:var(--accent-color,#2563eb);transform:scale(1.15)}.study-timer-dot.completed{color:var(--accent-color,#2563eb)}.study-timer-session-label{color:var(--text-secondary,#64748b);font-size:.78rem;font-weight:600;font-family:var(--font-jp,sans-serif)}.study-timer-controls{flex-direction:column;gap:10px;padding:4px 20px 16px;display:flex}.study-timer-btn-primary{background:var(--accent-color,#2563eb);color:#fff;width:100%;font-size:.95rem;font-weight:700;font-family:var(--font-jp,sans-serif);cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 18px;transition:transform .15s,background .2s,box-shadow .2s;display:flex;box-shadow:0 4px 14px #2563eb4d}.study-timer-btn-primary:hover{background:var(--accent-hover,#1d4ed8);transform:translateY(-1px);box-shadow:0 6px 18px #2563eb66}.study-timer-btn-primary:active{transform:translateY(0)}.study-timer-btn-primary.warning{background:#f59e0b;box-shadow:0 4px 14px #f59e0b4d}.study-timer-btn-primary.warning:hover{background:#d97706}.study-timer-btn-primary.resume{background:#10b981;box-shadow:0 4px 14px #10b9814d}.study-timer-btn-primary.resume:hover{background:#059669}.study-timer-sub-controls{align-items:center;gap:8px;display:flex}.study-timer-btn-sub{border:1px solid var(--border-color,#e2e8f0);background:var(--surface-color,#fff);color:var(--text-secondary,#64748b);font-size:.85rem;font-weight:600;font-family:var(--font-jp,sans-serif);cursor:pointer;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:6px;padding:9px 12px;transition:background .15s,border-color .15s,color .15s;display:flex}.study-timer-btn-sub:hover{background:var(--surface-hover,#f1f5f9);border-color:var(--text-muted,#94a3b8);color:var(--text-primary,#1e293b)}.study-timer-footer{background:var(--surface-hover,#f8fafc);border-top:1px solid var(--border-color,#e2e8f0);color:var(--text-secondary,#64748b);text-align:center;font-size:.75rem;font-family:var(--font-jp,sans-serif);padding:10px 18px}.study-timer-footer strong{color:var(--accent-color,#2563eb)}.study-timer-settings-view{flex-direction:column;max-height:480px;padding:0;display:flex;overflow-y:auto}.study-timer-settings-header{border-bottom:1px solid var(--border-color,#e2e8f0);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.study-timer-settings-title{color:var(--text-primary,#1e293b);font-size:.95rem;font-weight:700;font-family:var(--font-jp,sans-serif);margin:0}.study-timer-error-banner{background:var(--danger-light,#fef2f2);border:1px solid var(--danger-color,#ef4444);color:var(--danger-color,#ef4444);font-size:.78rem;font-weight:600;font-family:var(--font-jp,sans-serif);border-radius:8px;margin:10px 16px 0;padding:8px 12px}.study-timer-settings-form{flex-direction:column;gap:16px;padding:14px 16px;display:flex}.study-timer-field-group{grid-template-columns:1fr 1fr;gap:10px;display:grid}.study-timer-field{flex-direction:column;gap:4px;display:flex}.study-timer-field label{color:var(--text-secondary,#64748b);font-size:.75rem;font-weight:600;font-family:var(--font-jp,sans-serif)}.study-timer-input-unit{align-items:center;display:flex;position:relative}.study-timer-input-unit input{border:1px solid var(--border-color,#e2e8f0);background:var(--surface-color,#fff);width:100%;color:var(--text-primary,#1e293b);font-size:.9rem;font-weight:600;font-family:var(--font-jp,sans-serif);border-radius:8px;outline:none;padding:8px 30px 8px 10px;transition:border-color .15s}.study-timer-input-unit input:focus{border-color:var(--accent-color,#2563eb)}.study-timer-input-unit span{color:var(--text-muted,#94a3b8);pointer-events:none;font-size:.75rem;font-family:var(--font-jp,sans-serif);position:absolute;right:10px}.study-timer-toggles-group{border-top:1px solid var(--border-color,#e2e8f0);flex-direction:column;gap:10px;padding-top:12px;display:flex}.study-timer-toggle-item{cursor:pointer;justify-content:space-between;align-items:center;gap:10px;display:flex}.study-timer-toggle-label{flex-direction:column;gap:1px;display:flex}.study-timer-toggle-label span{color:var(--text-primary,#1e293b);font-size:.82rem;font-weight:600;font-family:var(--font-jp,sans-serif)}.study-timer-toggle-label small{color:var(--text-muted,#94a3b8);font-size:.7rem;font-family:var(--font-jp,sans-serif)}.study-timer-toggle-item input[type=checkbox]{cursor:pointer;width:18px;height:18px;accent-color:var(--accent-color,#2563eb)}.study-timer-save-btn{background:var(--accent-color,#2563eb);color:#fff;width:100%;font-size:.9rem;font-weight:700;font-family:var(--font-jp,sans-serif);cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:10px 16px;transition:background .15s;display:flex}.study-timer-save-btn:hover{background:var(--accent-hover,#1d4ed8)}.study-timer-backdrop{display:none}@media (width<=640px){.study-timer-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:9997;background:#0006;display:block;position:fixed;inset:0}.study-timer-panel{transform-origin:bottom;border-radius:24px 24px 0 0;width:100%;max-height:85vh;animation:.28s cubic-bezier(.16,1,.3,1) forwards timerSheetIn;bottom:0;left:0;right:0}@keyframes timerSheetIn{0%{transform:translateY(100%)}to{transform:translateY(0)}}.study-timer-fab{width:52px;height:52px;bottom:18px;right:18px}}.selection-translator-trigger{z-index:99999;color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%);border:1px solid #ffffff40;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;font-weight:700;transition:transform .15s,box-shadow .15s;animation:.2s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;transform:translate(-50%,-100%);box-shadow:0 8px 24px #4f46e559,0 2px 6px #00000026}.selection-translator-trigger:hover{transform:translate(-50%,-108%)scale(1.05);box-shadow:0 12px 28px #4f46e573}.selection-translator-trigger:active{transform:translate(-50%,-96%)scale(.96)}.selection-translator-popup{z-index:100000;background:var(--surface-color,#1e293b);border:1px solid var(--border-color,#ffffff1f);width:380px;max-width:calc(100vw - 32px);color:var(--text-primary,#f8fafc);-webkit-user-select:text;user-select:text;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:20px;padding:18px 20px;animation:.25s cubic-bezier(.16,1,.3,1) slideUpFade;position:absolute;transform:translate(-50%,10px);box-shadow:0 20px 40px #00000059,0 0 0 1px #ffffff0d}@keyframes popIn{0%{opacity:0;transform:translate(-50%,-80%)scale(.7)}to{opacity:1;transform:translate(-50%,-100%)scale(1)}}@keyframes slideUpFade{0%{opacity:0;transform:translate(-50%,20px)scale(.95)}to{opacity:1;transform:translate(-50%,10px)scale(1)}}.quick-trans-header{border-bottom:1px solid var(--border-color,#ffffff1a);justify-content:space-between;align-items:flex-start;gap:10px;padding-bottom:12px;display:flex}.quick-trans-word{color:var(--text-primary,#fff);font-size:1.5rem;font-weight:800;line-height:1.2}.quick-trans-reading{color:var(--accent-color,#818cf8);letter-spacing:.5px;margin-top:3px;font-size:1.05rem;font-weight:700}.quick-trans-romaji{color:var(--text-muted,#94a3b8);font-size:.8rem;font-style:italic}.quick-trans-icon-btn{background:var(--surface-hover,#ffffff0f);border:1px solid var(--border-color,#ffffff1a);color:var(--text-secondary,#cbd5e1);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .15s;display:flex}.quick-trans-icon-btn:hover{background:var(--accent-color,#6366f1);color:#fff;border-color:#0000;transform:translateY(-1px)}.quick-trans-segments{background:var(--bg-color,#0003);border-radius:12px;flex-wrap:wrap;gap:6px;margin:12px 0;padding:8px 10px;display:flex}.quick-trans-seg-chip{background:var(--surface-color,#1e293b);border:1px solid var(--border-color,#ffffff1a);color:var(--text-secondary,#94a3b8);cursor:pointer;border-radius:6px;padding:3px 8px;font-size:.85rem;font-weight:600;transition:all .15s}.quick-trans-seg-chip:hover{background:var(--surface-hover,#ffffff1a);color:var(--text-primary,#fff)}.quick-trans-seg-chip.active{background:var(--accent-color,#6366f1);color:#fff;border-color:var(--accent-color,#6366f1)}.quick-trans-results{flex-direction:column;gap:10px;max-height:260px;margin:12px 0;padding-right:4px;display:flex;overflow-y:auto}.quick-trans-card{background:var(--bg-color,#00000040);border:1px solid var(--border-color,#ffffff14);border-radius:12px;flex-direction:column;gap:4px;padding:10px 14px;display:flex}.quick-trans-card-title{justify-content:space-between;align-items:center;display:flex}.quick-trans-badge{color:var(--accent-color,#818cf8);background:#6366f126;border-radius:4px;padding:2px 6px;font-size:.72rem;font-weight:700}.quick-trans-meaning{color:var(--text-primary,#fff);font-size:.95rem;font-weight:600;line-height:1.4}.quick-trans-hanviet{color:#10b981;font-size:.8rem;font-weight:700}.quick-trans-example{color:var(--text-secondary,#94a3b8);margin-top:4px;font-size:.82rem;font-style:italic;line-height:1.35}.quick-trans-footer{border-top:1px solid var(--border-color,#ffffff14);justify-content:space-between;align-items:center;margin-top:4px;padding-top:10px;display:flex}.quick-trans-save-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;border-radius:10px;align-items:center;gap:6px;padding:6px 14px;font-size:.85rem;font-weight:700;transition:all .15s;display:flex}.quick-trans-save-btn:hover{opacity:.92;transform:translateY(-1px)}.quick-trans-save-btn.saved{background:var(--surface-hover,#ffffff1a);color:#10b981;border:1px solid #10b9814d}.quick-trans-live-box{background:linear-gradient(135deg,#6366f11f 0%,#a855f714 100%);border:1.5px solid #6366f140;border-radius:14px;flex-direction:column;gap:6px;margin:12px 0 10px;padding:12px 14px;display:flex}.quick-trans-live-title{color:var(--accent-color,#818cf8);text-transform:uppercase;letter-spacing:.5px;justify-content:space-between;align-items:center;font-size:.76rem;font-weight:800;display:flex}.quick-trans-live-text{color:var(--text-primary,#fff);font-size:1.05rem;font-weight:700;line-height:1.45}.quick-trans-hanviet-tag{color:#10b981;letter-spacing:.5px;background:#10b98126;border:1px solid #10b9814d;border-radius:6px;align-items:center;gap:4px;padding:2px 8px;font-size:.8rem;font-weight:800;display:inline-flex}.quick-trans-dict-divider{color:var(--text-muted,#94a3b8);align-items:center;gap:8px;margin:10px 0 6px;font-size:.75rem;font-weight:700;display:flex}.quick-trans-dict-divider:after{content:"";background:var(--border-color,#ffffff1a);flex:1;height:1px}