*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;background-color:var(--bg-app);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100dvh}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}[hidden]{display:none!important}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}a{color:inherit;text-decoration:none}button{cursor:pointer;background:none;border:none}ul,ol{list-style:none}#root{isolation:isolate}.page-loader{display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--text-secondary);font-size:var(--text-sm)}:root{--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--radius-pill: 999px;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--z-base: 0;--z-raised: 10;--z-overlay: 100;--z-modal: 200;--z-toast: 300;--color-srs-apprentice: #dd0093;--color-srs-guru: #882d9e;--color-srs-master: #294ddb;--color-srs-enlightened: #0891b2;--color-srs-burned: #faac05;--color-srs-locked: #a0a0a0;--color-difficulty-beginner: #4caf50;--color-difficulty-intermediate: #ffc107;--color-difficulty-advanced: #ff9800;--color-difficulty-expert: #f44336;--font-item: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif}[data-theme=mangaka-pencil]{--color-radical: #6b8ca3;--color-kanji: #8a3b3b;--color-vocabulary: #6e5a8a;--color-grammar: #4f7a5a;--color-anki: #7a6040;--bg-app: #f4f1ea;--bg-card: #ffffff;--bg-card-hover: #f8f6f0;--bg-card-border: rgba(0, 0, 0, .08);--bg-elevated: #ffffff;--text-primary: #1c1c1c;--text-secondary: #4a4a4a;--text-muted: #7a7a7a;--text-inverse: #ffffff;--color-correct: #3a7a57;--color-incorrect: #a64a3b;--color-warning: #8a6a2a;--color-error: #a64a3b;--color-quality-perfect: var(--color-correct);--color-quality-assisted: #8a6a2a;--color-quality-recognition: #7a5a30;--color-quality-failure: var(--color-incorrect);--color-accent: #2f2f2f;--color-accent-hover: #000000;--glass-bg: rgba(255, 255, 255, .6);--glass-border: rgba(0, 0, 0, .08);--glass-blur: 2px;--surface-card: #ffffff;--surface-input: #fdfcf9;--border-subtle: rgba(0, 0, 0, .1);--shadow-soft: 0 2px 6px rgba(0, 0, 0, .08);--shadow-medium: 0 4px 12px rgba(0, 0, 0, .12);--shadow-card: 0 2px 8px rgba(0, 0, 0, .06)}[data-theme=sakura-light]{--color-radical: #0077cc;--color-kanji: #cc1f2b;--color-vocabulary: #7b3fa0;--color-grammar: #1e7e44;--color-anki: #b35900;--bg-app: #f6f1f4;--bg-card: rgba(255, 255, 255, .8);--bg-card-hover: rgba(255, 255, 255, .95);--bg-card-border: rgba(0, 0, 0, .06);--bg-elevated: #ffffff;--text-primary: #1a1a2e;--text-secondary: #4a4a6a;--text-muted: #7a7aa0;--text-inverse: #ffffff;--color-correct: #1e7e44;--color-incorrect: #cc1f2b;--color-warning: #b35900;--color-error: #cc1f2b;--color-quality-perfect: var(--color-correct);--color-quality-assisted: #b8860b;--color-quality-recognition: #c76f00;--color-quality-failure: var(--color-incorrect);--color-accent: #c1404a;--color-accent-hover: #a83540;--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(193, 64, 74, .08);--glass-blur: 12px;--surface-card: #ffffff;--surface-input: #ffffff;--border-subtle: rgba(0, 0, 0, .08);--shadow-soft: 0 2px 12px rgba(26, 26, 46, .04);--shadow-medium: 0 4px 24px rgba(26, 26, 46, .08);--shadow-card: 0 4px 24px rgba(26, 26, 46, .06)}[data-theme=colorblind]{--color-radical: #56b4e9;--color-kanji: #e69f00;--color-vocabulary: #009e73;--color-grammar: #0072b2;--color-anki: #cc79a7;--bg-app: #0f1117;--bg-card: #161a22;--bg-card-hover: #1c2130;--bg-card-border: rgba(255, 255, 255, .08);--bg-elevated: #1c2130;--text-primary: #e6e8ef;--text-secondary: #b0b4c4;--text-muted: #8b90a7;--text-inverse: #0f1117;--color-correct: #009e73;--color-incorrect: #d55e00;--color-warning: #e69f00;--color-error: #d55e00;--color-quality-perfect: var(--color-correct);--color-quality-assisted: #e69f00;--color-quality-recognition: #cc79a7;--color-quality-failure: var(--color-incorrect);--color-accent: #56b4e9;--color-accent-hover: #7dc8f0;--color-srs-master: #0072b2;--color-srs-enlightened: #009e73;--color-srs-burned: #cc79a7;--glass-bg: rgba(22, 26, 34, .85);--glass-border: rgba(255, 255, 255, .06);--glass-blur: 4px;--surface-card: #161a22;--surface-input: #1c2130;--border-subtle: rgba(255, 255, 255, .08);--shadow-soft: 0 2px 8px rgba(0, 0, 0, .3);--shadow-medium: 0 4px 16px rgba(0, 0, 0, .4);--shadow-card: 0 4px 16px rgba(0, 0, 0, .4)}[data-theme=mangaka-pencil] body:before,html[data-theme=mangaka-pencil]:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url(/textures/paper-fibers.png);opacity:.2;pointer-events:none;z-index:0}[data-theme=mangaka-pencil] .app-layout{position:relative;z-index:1}[data-theme=mangaka-pencil] .app-nav{background:#ffffffeb;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-bottom:1px solid rgba(0,0,0,.1)}[data-theme=mangaka-pencil] .btn--primary{box-shadow:none}[data-theme=mangaka-pencil] .btn--primary:hover{filter:brightness(.85)}[data-theme=mangaka-pencil] input,[data-theme=mangaka-pencil] select,[data-theme=mangaka-pencil] textarea{background:var(--surface-input);border:2px solid var(--border-subtle)}[data-theme=mangaka-pencil] input:focus,[data-theme=mangaka-pencil] select:focus,[data-theme=mangaka-pencil] textarea:focus{border-color:var(--color-accent);outline:none;box-shadow:none}[data-theme=mangaka-pencil] .review-card__character,[data-theme=mangaka-pencil] .lesson-card__character{filter:contrast(1.05) saturate(.9)}[data-theme=mangaka-pencil] .dashboard-hero__title,[data-theme=mangaka-pencil] .dashboard-preview__title,[data-theme=mangaka-pencil] .library__title,[data-theme=mangaka-pencil] .progress-page__title{position:relative}[data-theme=mangaka-pencil] .dashboard-hero__title:after,[data-theme=mangaka-pencil] .library__title:after,[data-theme=mangaka-pencil] .progress-page__title:after{content:"";position:absolute;left:0;bottom:-4px;width:40px;height:2px;background:var(--color-accent);opacity:.6}body.review-mode[data-theme=mangaka-pencil]{--bg-app: #ebe7df}[data-theme=mangaka-pencil] .sakura-bg,[data-theme=mangaka-pencil] .sakura-bg:before,[data-theme=mangaka-pencil] .sakura-bg:after{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;border:1px solid transparent;cursor:pointer;transition:background var(--transition-fast),opacity var(--transition-fast);text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--sm{padding:3px var(--space-sm);font-size:var(--text-xs)}.btn--lg{padding:var(--space-md) var(--space-lg);font-size:var(--text-base)}.btn--primary{background:var(--color-accent);color:var(--text-inverse)}.btn--primary:hover:not(:disabled){background:var(--color-accent-hover)}.btn--ghost{background:transparent;border-color:var(--bg-card-border);color:var(--text-secondary)}.btn--ghost:hover:not(:disabled){border-color:var(--text-secondary);color:var(--text-primary)}.btn--accent{background:var(--color-correct);color:var(--text-inverse)}.btn--accent:hover:not(:disabled){background:color-mix(in srgb,var(--color-correct) 85%,#000)}.btn--danger{background:var(--color-error, #ef4444);color:var(--text-inverse)}.btn--danger:hover:not(:disabled){background:color-mix(in srgb,var(--color-error, #ef4444) 85%,#000)}.toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.5rem;pointer-events:none}.toast{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border-radius:var(--radius-md, 8px);font-size:.875rem;font-weight:500;box-shadow:0 4px 12px #0000004d;animation:toast-in .25s ease-out;pointer-events:auto}.toast--success{background:var(--color-success, #10b981);color:var(--text-inverse)}.toast--error{background:var(--color-error, #ef4444);color:var(--text-inverse)}.toast--info{background:var(--color-surface-raised, #2a2a3a);color:var(--color-text, #e8e8e8);border:1px solid var(--color-border, #3a3a4a)}.toast__icon{font-size:1rem;line-height:1}.toast__message{flex:1}@keyframes toast-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}.app-layout{display:flex;flex-direction:column;min-height:100dvh;background:var(--bg-app)}.app-nav{position:sticky;top:0;z-index:var(--z-overlay);display:flex;align-items:center;gap:var(--space-md);height:56px;padding:0 var(--space-xl);background:var(--glass-bg);border-bottom:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur, 12px));-webkit-backdrop-filter:blur(var(--glass-blur, 12px))}.app-nav__brand{font-size:var(--text-lg);font-weight:700;color:var(--color-accent);text-decoration:none;white-space:nowrap;flex-shrink:0;transition:color var(--transition-fast)}.app-nav__brand:hover{color:var(--color-accent-hover)}.app-nav__links{display:flex;align-items:center;gap:var(--space-xs);flex:1;overflow:hidden}.app-nav__links a:not(.app-nav__study-cta){font-size:var(--text-sm);color:var(--text-secondary);text-decoration:none;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);white-space:nowrap;transition:color var(--transition-fast),background var(--transition-fast)}.app-nav__links a:not(.app-nav__study-cta):hover{color:var(--text-primary);background:var(--bg-card-hover)}.app-nav__links a:not(.app-nav__study-cta).active{color:var(--text-primary);background:var(--bg-card-hover);font-weight:600}.app-nav__study-cta{font-size:var(--text-sm);font-weight:600;color:var(--color-accent);background:transparent;border:1px solid var(--border-subtle);text-decoration:none;padding:var(--space-xs) var(--space-md);border-radius:var(--radius-pill);white-space:nowrap;transition:background var(--transition-fast),border-color var(--transition-fast)}.app-nav__study-cta:hover{background:var(--bg-card-hover);border-color:var(--color-accent)}.app-nav__actions{display:flex;align-items:center;gap:var(--space-sm);margin-left:auto;flex-shrink:0}.app-nav__admin-link{font-size:var(--text-sm);color:var(--color-accent);text-decoration:none;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);border:1px solid var(--color-accent);white-space:nowrap;transition:color var(--transition-fast),background var(--transition-fast)}.app-nav__admin-link:hover,.app-nav__admin-link.active{background:var(--color-accent);color:var(--text-inverse)}.app-nav__theme-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:var(--radius-pill);background:transparent;cursor:pointer;font-size:var(--text-lg);transition:background var(--transition-fast)}.app-nav__theme-toggle:hover{background:var(--bg-card-hover)}.app-nav__avatar{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-pill);background:var(--color-accent);color:var(--text-inverse);font-size:var(--text-sm);font-weight:700;flex-shrink:0;-webkit-user-select:none;user-select:none}.app-nav__signout{font-size:var(--text-sm);color:var(--text-secondary);background:none;border:none;cursor:pointer;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:color var(--transition-fast),background var(--transition-fast);white-space:nowrap}.app-nav__signout:hover{color:var(--text-primary);background:var(--bg-card-hover)}.app-content{flex:1;padding:var(--space-xl) var(--space-2xl);max-width:1200px;width:100%;margin:0 auto;box-sizing:border-box}@media (max-width: 640px){.app-nav{position:fixed;top:auto;bottom:var(--space-md);left:var(--space-md);right:var(--space-md);height:48px;padding:0 var(--space-sm);gap:0;border-radius:var(--radius-pill);border:1px solid var(--bg-card-border);box-shadow:var(--shadow-medium);z-index:var(--z-overlay);justify-content:center}.app-nav__brand{display:none}.app-nav__links{flex:1;justify-content:space-around;gap:0}.app-nav__links a:not(.app-nav__study-cta){font-size:var(--text-xs);padding:var(--space-xs);flex:1;text-align:center;border-radius:var(--radius-md);min-height:44px;display:flex;align-items:center;justify-content:center}.app-nav__study-cta{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);padding:var(--space-xs) var(--space-sm)}.app-nav__actions{display:none}.app-content{padding:var(--space-md) var(--space-md) calc(48px + var(--space-xl) + var(--space-md))}.app-nav--hidden{display:none}}.login-bg{min-height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--bg-app);padding:var(--space-md)}.login-card{width:100%;max-width:420px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--space-2xl) var(--space-xl);backdrop-filter:blur(var(--glass-blur, 12px));-webkit-backdrop-filter:blur(var(--glass-blur, 12px));box-shadow:var(--shadow-medium)}.login-header{text-align:center;margin-bottom:var(--space-xl)}.login-title{font-size:var(--text-3xl);font-weight:700;color:var(--text-primary);margin:0 0 var(--space-xs);letter-spacing:-.02em}.login-subtitle{font-size:var(--text-xl);color:var(--text-muted);margin:0}.login-form{display:flex;flex-direction:column;gap:var(--space-md)}.login-field{display:flex;flex-direction:column;gap:var(--space-xs)}.login-field label{font-size:var(--text-sm);font-weight:500;color:var(--text-secondary)}.login-field input{background:#ffffff0f;border:1px solid var(--bg-card-border);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--text-base);padding:var(--space-sm) var(--space-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none;width:100%;box-sizing:border-box}.login-field input::placeholder{color:var(--text-muted)}.login-field input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-accent) 20%,transparent)}.login-error{font-size:var(--text-sm);color:var(--color-incorrect);margin:0;padding:var(--space-sm) var(--space-md);background:color-mix(in srgb,var(--color-incorrect) 12%,transparent);border-radius:var(--radius-sm)}.login-info{font-size:var(--text-sm);color:var(--color-correct);margin:0;padding:var(--space-sm) var(--space-md);background:color-mix(in srgb,var(--color-correct) 12%,transparent);border-radius:var(--radius-sm)}.login-btn{margin-top:var(--space-xs);padding:var(--space-sm) var(--space-md);background:var(--color-accent);color:var(--text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:600;cursor:pointer;transition:background var(--transition-fast),opacity var(--transition-fast)}.login-btn:hover:not(:disabled){background:var(--color-accent-hover)}.login-btn:disabled{opacity:.6;cursor:not-allowed}.login-toggle{margin-top:var(--space-lg);text-align:center;font-size:var(--text-sm);color:var(--text-muted)}.login-toggle button{background:none;border:none;color:var(--color-accent);cursor:pointer;font-size:inherit;padding:0;text-decoration:underline;text-underline-offset:2px}.login-toggle button:hover{color:var(--color-accent-hover)}