*,*: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}[data-theme=dark]{--color-radical: #00aaff;--color-kanji: #e63946;--color-vocabulary: #9b59b6;--color-grammar: #27ae60;--color-anki: #e67e22;--bg-app: #1a1a2e;--bg-card: rgba(255, 255, 255, .07);--bg-card-hover: rgba(255, 255, 255, .1);--bg-card-border: rgba(255, 255, 255, .12);--text-primary: #ebebf5;--text-secondary: rgba(235, 235, 245, .6);--text-muted: rgba(235, 235, 245, .3);--color-correct: #4caf50;--color-incorrect: #e53935;--color-warning: #ff9800;--color-error: #e53935;--color-accent: #7c6af7;--color-accent-hover: #9d8fff;--surface-card: rgba(255, 255, 255, .07);--surface-input: rgba(255, 255, 255, .07);--border-subtle: rgba(255, 255, 255, .12);--shadow-card: 0 4px 24px rgba(0, 0, 0, .3)}[data-theme=light]{--color-radical: #0077cc;--color-kanji: #cc1f2b;--color-vocabulary: #7b3fa0;--color-grammar: #1e7e44;--color-anki: #b35900;--bg-app: #f0f0f8;--bg-card: rgba(0, 0, 0, .03);--bg-card-hover: rgba(0, 0, 0, .06);--bg-card-border: rgba(0, 0, 0, .1);--text-primary: #1a1a2e;--text-secondary: rgba(26, 26, 46, .65);--text-muted: rgba(26, 26, 46, .4);--color-correct: #1e7e44;--color-incorrect: #cc1f2b;--color-warning: #b35900;--color-error: #cc1f2b;--color-accent: #5b48e8;--color-accent-hover: #4737c8;--surface-card: #ffffff;--surface-input: #ffffff;--border-subtle: rgba(0, 0, 0, .12);--shadow-card: 0 4px 24px rgba(0, 0, 0, .08)}[data-theme=colorblind]{--color-radical: #56b4e9;--color-kanji: #e69f00;--color-vocabulary: #009e73;--color-grammar: #0072b2;--color-anki: #cc79a7;--bg-app: #1a1a2e;--bg-card: rgba(255, 255, 255, .07);--bg-card-hover: rgba(255, 255, 255, .1);--bg-card-border: rgba(255, 255, 255, .12);--text-primary: #ebebf5;--text-secondary: rgba(235, 235, 245, .6);--text-muted: rgba(235, 235, 245, .3);--color-correct: #009e73;--color-incorrect: #d55e00;--color-warning: #e69f00;--color-error: #d55e00;--color-accent: #56b4e9;--color-accent-hover: #7dc8f0;--color-srs-master: #0072b2;--color-srs-enlightened: #009e73;--color-srs-burned: #cc79a7;--surface-card: rgba(255, 255, 255, .07);--surface-input: rgba(255, 255, 255, .07);--border-subtle: rgba(255, 255, 255, .12);--shadow-card: 0 4px 24px rgba(0, 0, 0, .3)}.app-layout{display:flex;flex-direction:column;min-height:100vh;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(--bg-card);border-bottom:1px solid var(--bg-card-border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.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{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:hover{color:var(--text-primary);background:var(--bg-card-hover)}.app-nav__links a.active{color:var(--text-primary);background:var(--bg-card-hover);font-weight:600}.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:#fff}.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:#fff;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:0 4px 24px #00000040;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{font-size:var(--text-xs);padding:var(--space-xs);flex:1;text-align:center;border-radius:var(--radius-md)}.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:100vh;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(--bg-card);border:1px solid var(--bg-card-border);border-radius:var(--radius-lg);padding:var(--space-2xl) var(--space-xl);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 8px 32px #00000052}.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:#fff;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)}