*{box-sizing:border-box;margin:0;padding:0}body{color:#e4e4e7;background:#0f0f14;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.hex-loading,.hex-error{color:#a1a1aa;justify-content:center;align-items:center;min-height:60vh;font-size:1.125rem;display:flex}.hex-error{color:#f87171}.hex-back-link{color:#71717a;margin-bottom:1rem;font-size:.8125rem;text-decoration:none;transition:color .15s;display:inline-block}.hex-back-link:hover{color:#f4f4f5}.hex-selector{max-width:640px;margin:0 auto;padding:2rem 1rem}.hex-selector-title{color:#f4f4f5;margin-bottom:.25rem;font-size:1.75rem;font-weight:700}.hex-selector-subtitle{color:#71717a;margin-bottom:1.5rem;font-size:.9375rem}.hex-lesson-grid{flex-direction:column;gap:.5rem;display:flex}.hex-lesson-card{cursor:pointer;text-align:left;width:100%;color:inherit;background:#1a1a24;border:1px solid #27272a;border-radius:.5rem;align-items:center;gap:.875rem;padding:.875rem 1rem;font-family:inherit;transition:background .15s,border-color .15s;display:flex}.hex-lesson-card:hover{background:#222230;border-color:#3f3f46}.hex-lesson-card:active{background:#2a2a38}.hex-lesson-badge{color:#fff;border-radius:.375rem;flex-shrink:0;justify-content:center;align-items:center;width:2.25rem;height:2.25rem;font-size:.875rem;font-weight:700;display:flex}.hex-lesson-info{flex-direction:column;gap:.125rem;min-width:0;display:flex}.hex-lesson-title{color:#f4f4f5;font-size:1rem;font-weight:600}.hex-lesson-meta{color:#71717a;font-size:.8125rem}.hex-lesson-themes{color:#52525b;font-size:.75rem}.hex-player{flex-direction:column;max-width:640px;min-height:100vh;margin:0 auto;padding:1rem;display:flex}.hex-player-header{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.hex-back-btn{color:#a1a1aa;cursor:pointer;background:0 0;border:1px solid #3f3f46;border-radius:.375rem;padding:.375rem .75rem;font-family:inherit;font-size:.875rem;transition:color .15s,border-color .15s}.hex-back-btn:hover{color:#f4f4f5;border-color:#52525b}.hex-player-title{flex-direction:column;align-items:center;gap:.125rem;display:flex}.hex-player-lesson-num{color:#71717a;text-transform:uppercase;letter-spacing:.05em;font-size:.75rem}.hex-player-lesson-name{color:#f4f4f5;font-size:1rem;font-weight:600}.hex-player-progress{color:#71717a;font-variant-numeric:tabular-nums;font-size:.8125rem}.hex-progress-bar{background:#27272a;border-radius:2px;width:100%;height:3px;margin-bottom:1.5rem;overflow:hidden}.hex-progress-fill{background:#6366f1;border-radius:2px;height:100%;transition:width .3s}.hex-lang-selector{justify-content:center;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.hex-lang-select{color:#e4e4e7;cursor:pointer;background:#1a1a24;border:1px solid #3f3f46;border-radius:.375rem;padding:.375rem .75rem;font-family:inherit;font-size:.875rem}.hex-lang-select:focus{border-color:#6366f1;outline:none}.hex-translating{color:#6366f1;font-size:.8125rem;animation:1.5s ease-in-out infinite hex-pulse}@keyframes hex-pulse{0%,to{opacity:1}50%{opacity:.4}}.hex-translation{text-align:center}.hex-translation-text{color:#a78bfa;font-size:1.5rem;font-weight:500;line-height:1.3}.hex-romanization{color:#71717a;margin-top:.25rem;font-size:.9375rem;font-style:italic}.hex-scene{color:#71717a;text-align:center;margin-bottom:2rem;padding:0 1rem;font-size:.875rem;font-style:italic}.hex-line-display{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1.5rem;min-height:40vh;padding:2rem 0;display:flex}.hex-character-badge{letter-spacing:.02em;font-size:.9375rem;font-weight:700}.hex-line-text{color:#f4f4f5;text-align:center;word-wrap:break-word;max-width:100%;font-size:2rem;font-weight:600;line-height:1.3}.hex-new-words{color:#6366f1;text-align:center;font-size:.8125rem}.hex-nav{gap:.75rem;padding:1rem 0 2rem;display:flex}.hex-nav-btn{cursor:pointer;color:#a1a1aa;background:#1a1a24;border:1px solid #3f3f46;border-radius:.5rem;flex:1;padding:.75rem 1rem;font-family:inherit;font-size:1rem;font-weight:500;transition:background .15s,border-color .15s}.hex-nav-btn:hover:not(:disabled){color:#f4f4f5;background:#222230}.hex-nav-btn:disabled{opacity:.3;cursor:not-allowed}.hex-nav-btn-primary{color:#fff;background:#6366f1;border-color:#6366f1}.hex-nav-btn-primary:hover:not(:disabled){background:#4f46e5}@media (width>=640px){.hex-line-text{font-size:2.5rem}.hex-selector{padding:3rem 1.5rem}.hex-lesson-grid{grid-template-columns:repeat(2,1fr);gap:.625rem;display:grid}}.auth-page{background:#0f0f14;justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.auth-card{background:#1a1a24;border:1px solid #27272a;border-radius:.75rem;width:100%;max-width:400px;padding:2.5rem 2rem}.auth-brand{text-align:center;color:#6366f1;letter-spacing:-.02em;margin-bottom:.125rem;font-size:1.5rem;font-weight:700}.auth-tagline{text-align:center;color:#52525b;margin-bottom:2rem;font-size:.8125rem}.auth-heading{text-align:center;color:#f4f4f5;margin-bottom:.25rem;font-size:1.25rem;font-weight:600}.auth-subheading{text-align:center;color:#71717a;margin-bottom:1.5rem;font-size:.875rem}.auth-error{color:#f87171;text-align:center;background:#ef44441a;border:1px solid #ef44444d;border-radius:.375rem;margin-bottom:1rem;padding:.625rem .75rem;font-size:.875rem}.auth-form{flex-direction:column;gap:1.25rem;display:flex}.auth-field{flex-direction:column;gap:.375rem;display:flex}.auth-label{color:#a1a1aa;font-size:.8125rem;font-weight:500}.auth-input-wrapper{position:relative}.auth-input{color:#e4e4e7;background:#0f0f14;border:1px solid #3f3f46;border-radius:.375rem;width:100%;padding:.625rem .75rem;font-family:inherit;font-size:.9375rem;transition:border-color .15s}.auth-input::placeholder{color:#52525b}.auth-input:focus{border-color:#6366f1;outline:none}.auth-input-wrapper .auth-input{padding-right:3.5rem}.auth-toggle-pw{color:#52525b;cursor:pointer;background:0 0;border:none;border-radius:.25rem;padding:.25rem .375rem;font-family:inherit;font-size:.75rem;transition:color .15s;position:absolute;top:50%;right:.5rem;transform:translateY(-50%)}.auth-toggle-pw:hover{color:#a1a1aa}.auth-submit{color:#fff;cursor:pointer;background:#6366f1;border:none;border-radius:.375rem;width:100%;margin-top:.5rem;padding:.75rem 1rem;font-family:inherit;font-size:1rem;font-weight:500;transition:background .15s}.auth-submit:hover:not(:disabled){background:#4f46e5}.auth-submit:disabled{opacity:.5;cursor:not-allowed}.auth-switch{text-align:center;color:#71717a;margin-top:1.5rem;font-size:.875rem}.auth-switch-btn{color:#6366f1;font-family:inherit;font-size:inherit;cursor:pointer;text-underline-offset:3px;background:0 0;border:none;text-decoration:underline;transition:color .15s}.auth-switch-btn:hover{color:#818cf8}.app-nav{background:#0f0f14;border-bottom:1px solid #1e1e28;padding:0 1rem}.app-nav-inner{justify-content:space-between;align-items:center;max-width:960px;height:3rem;margin:0 auto;display:flex}.app-nav-brand{align-items:center;gap:.5rem;display:flex}.app-nav-logo{color:#6366f1;letter-spacing:-.02em;font-size:.9375rem;font-weight:700}.app-nav-sep{color:#3f3f46;font-size:.875rem}.app-nav-module{color:#71717a;font-size:.8125rem}.app-nav-user{align-items:center;gap:.75rem;display:flex}.app-nav-name{color:#a1a1aa;font-size:.8125rem}.app-nav-logout{color:#71717a;cursor:pointer;background:0 0;border:1px solid #3f3f46;border-radius:.25rem;padding:.25rem .5rem;font-family:inherit;font-size:.75rem;transition:color .15s,border-color .15s}.app-nav-logout:hover{color:#f4f4f5;border-color:#52525b}.gs-container{max-width:640px;margin:0 auto;padding:2rem 1rem}.gs-title{color:#f4f4f5;margin-bottom:.25rem;font-size:1.75rem;font-weight:700}.gs-subtitle{color:#71717a;margin-bottom:1.5rem;font-size:.9375rem}.gs-grid{flex-direction:column;gap:.5rem;display:flex}.gs-card{color:inherit;background:#1a1a24;border:1px solid #27272a;border-radius:.5rem;align-items:center;gap:.875rem;padding:1rem;text-decoration:none;transition:background .15s,border-color .15s;display:flex}.gs-card:hover:not(.gs-card-disabled){background:#222230;border-color:#3f3f46}.gs-card-disabled{opacity:.4;cursor:default}.gs-card-dot{border-radius:50%;flex-shrink:0;width:.75rem;height:.75rem}.gs-card-info{flex-direction:column;flex:1;gap:.125rem;min-width:0;display:flex}.gs-card-name{color:#f4f4f5;font-size:1rem;font-weight:600}.gs-card-desc{color:#71717a;font-size:.8125rem}.gs-card-badge{color:#52525b;white-space:nowrap;border:1px solid #27272a;border-radius:.25rem;padding:.125rem .375rem;font-size:.6875rem}