@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-primary:oklch(18% .01 255);--bg-secondary:oklch(22% .01 255);--bg-card:oklch(20% .01 255);--bg-card-hover:oklch(25% .01 255);--border-color:oklch(35% .01 255);--border-color-hover:oklch(45% .01 255);--text-primary:oklch(95% .01 250);--text-secondary:oklch(75% .01 250);--text-muted:oklch(55% .01 250);--accent-primary:oklch(62% .21 270);--accent-primary-hover:oklch(68% .21 270);--accent-secondary:oklch(25% .05 270);--accent-secondary-hover:oklch(30% .05 270);--color-success:oklch(65% .16 150);--color-success-bg:oklch(30% .05 150);--color-error:oklch(60% .18 15);--color-error-bg:oklch(28% .05 15);--color-warning:oklch(75% .15 75);--color-warning-bg:oklch(30% .05 75);--sidebar-width:240px;--sidebar-collapsed-width:68px;--transition-fast:all .15s ease-out;--radius-sm:8px;--radius-md:12px;--radius-lg:16px}[data-theme=light]{--bg-primary:oklch(98% .005 250);--bg-secondary:oklch(95% .005 250);--bg-card:oklch(100% 0 0);--bg-card-hover:oklch(96% .005 250);--border-color:oklch(90% .01 250);--border-color-hover:oklch(80% .01 250);--text-primary:oklch(25% .01 250);--text-secondary:oklch(45% .01 250);--text-muted:oklch(60% .01 250);--accent-primary:oklch(55% .21 270);--accent-primary-hover:oklch(50% .21 270);--accent-secondary:oklch(92% .02 270);--accent-secondary-hover:oklch(88% .02 270);--color-success:oklch(50% .16 150);--color-success-bg:oklch(95% .05 150);--color-error:oklch(50% .18 15);--color-error-bg:oklch(95% .05 15);--color-warning:oklch(60% .15 75);--color-warning-bg:oklch(95% .05 75)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}h1,h2,h3,h4,h5,h6{letter-spacing:-.01em;color:var(--text-primary);font-weight:600}.app-container{min-height:100vh;padding-bottom:calc(4.5rem + env(safe-area-inset-bottom,12px));flex-direction:column;display:flex}.main-content{flex-direction:column;gap:1.5rem;width:100%;min-width:0;max-width:100%;margin:0 auto;padding:1rem;display:flex}.glass-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:var(--transition-fast);padding:1.25rem}.btn-primary,.btn-secondary{border-radius:var(--radius-sm);cursor:pointer;min-height:48px;transition:var(--transition-fast);border:none;justify-content:center;align-items:center;gap:.6rem;padding:0 1.2rem;font-size:.95rem;font-weight:500;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent-primary);color:#fff}.btn-primary:active{background:var(--accent-primary-hover);transform:scale(.98)}.btn-secondary{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary)}.btn-secondary:active{background:var(--border-color);transform:scale(.98)}.select-input,.text-input{background:var(--bg-secondary);border:1px solid var(--border-color);min-height:48px;color:var(--text-primary);border-radius:var(--radius-sm);width:100%;transition:var(--transition-fast);outline:none;padding:0 1rem;font-family:inherit;font-size:1rem}.select-input:focus,.text-input:focus{border-color:var(--accent-primary)}.mobile-view-header{z-index:100;padding:calc(.5rem + env(safe-area-inset-top,0px)) 1rem .5rem;background:var(--bg-primary);border-bottom:1px solid var(--border-color);height:calc(3.5rem + env(safe-area-inset-top,0px));justify-content:space-between;align-items:center;width:calc(100% + 2rem);margin-top:-1rem;margin-left:-1rem;display:flex;position:sticky;top:0}.mobile-back-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;height:36px;padding:0;font-size:.9rem;font-weight:500;display:flex}.mobile-header-title{text-align:center;white-space:nowrap;text-overflow:ellipsis;flex:1;padding:0 .5rem;font-size:1rem;font-weight:600;overflow:hidden}.mobile-hub-hero h1{margin-bottom:.25rem;font-size:1.5rem;font-weight:700}.mobile-hub-hero p{color:var(--text-secondary);font-size:.9rem}.hub-hero-badge{color:var(--accent-primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem;font-size:.75rem;font-weight:600;display:block}.mobile-hub-grid{flex-direction:column;gap:.75rem;display:flex}.mobile-hub-card{cursor:pointer;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);text-align:left;transition:var(--transition-fast);align-items:center;gap:1rem;padding:1rem;display:flex}.mobile-hub-card:active{background:var(--bg-card-hover)}.hub-card-icon-wrapper{border-radius:var(--radius-sm);background:var(--accent-secondary);width:40px;height:40px;color:var(--accent-primary);flex-shrink:0;justify-content:center;align-items:center;font-size:1.25rem;display:flex}.hub-card-content h3{margin-bottom:.1rem;font-size:.95rem}.hub-card-content p{color:var(--text-muted);font-size:.8rem}.hub-card-arrow{color:var(--text-muted)}.mobile-bottom-nav{height:calc(4.5rem + env(safe-area-inset-bottom,12px));padding:.25rem .5rem calc(.25rem + env(safe-area-inset-bottom,12px));background:var(--bg-primary);border-top:1px solid var(--border-color);z-index:1000;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-nav-item{color:var(--text-muted);border-radius:var(--radius-sm);height:48px;transition:var(--transition-fast);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.25rem;font-size:.7rem;font-weight:500;display:flex}.mobile-nav-item.active{color:var(--accent-primary)}.mobile-nav-icon{font-size:1.25rem}.flashcard-deck{perspective:1200px;width:100%;max-width:500px;height:300px;margin:1.5rem auto}.flashcard-inner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;cursor:pointer;transition:transform .4s ease-out;position:relative}.flashcard-deck.flipped .flashcard-inner{transform:rotateY(180deg)}.flashcard-front,.flashcard-back{backface-visibility:hidden;border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-color);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:2rem 1.5rem;display:flex;position:absolute;box-shadow:0 4px 12px #0000000d}.flashcard-back{border-color:var(--accent-primary);transform:rotateY(180deg)}.flashcard-front h2,.flashcard-back h2{font-size:1.75rem;font-weight:600}.badge{text-transform:uppercase;letter-spacing:.05em;border-radius:4px;padding:.25rem .5rem;font-size:.7rem;font-weight:600;display:inline-block}.badge-indigo{background:var(--accent-secondary);color:var(--accent-primary)}.badge-emerald{background:var(--color-success-bg);color:var(--color-success)}.badge-rose{background:var(--color-error-bg);color:var(--color-error)}.badge-amber{background:var(--color-warning-bg);color:var(--color-warning)}.listening-tape-deck{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);flex-direction:column;gap:1rem;width:100%;padding:1rem;display:flex}.cassette-shell-body{display:none!important}.listening-controls{gap:.5rem;width:100%;display:flex}.listening-controls button{flex:1}@media (width>=769px){.app-container{grid-template-columns:var(--sidebar-width) 1fr;padding-bottom:0;display:grid}.app-container.sidebar-collapsed{grid-template-columns:var(--sidebar-collapsed-width) 1fr}.main-content{max-width:1200px;padding:2.5rem 3rem}.btn-primary:hover{background:var(--accent-primary-hover)}.btn-secondary:hover{background:var(--bg-card-hover)}.sidebar{background:var(--bg-secondary);border-right:1px solid var(--border-color);flex-direction:column;height:100vh;padding:1.5rem .75rem;display:flex;position:sticky;top:0;overflow:hidden}.sidebar-brand{align-items:center;gap:.75rem;margin-bottom:2rem;padding-left:.5rem;display:flex}.sidebar-logo{color:var(--text-primary);font-size:1.25rem;font-weight:700}.sidebar-collapsed .sidebar-brand{opacity:0;pointer-events:none}.nav-item{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:.75rem;width:100%;padding:.5rem .75rem;font-size:.9rem;font-weight:500;text-decoration:none;transition:none;display:flex}.nav-item:hover{background:var(--bg-card-hover);color:var(--text-primary)}.nav-item.active{background:var(--accent-secondary);color:var(--accent-primary);font-weight:600}.nav-icon{text-align:center;width:1.25rem;font-size:1.1rem}.sidebar-collapsed .nav-item{justify-content:center;padding:.75rem}.sidebar-collapsed .nav-text{display:none}.sidebar-footer{border-top:1px solid var(--border-color);margin-top:auto;padding-top:1rem}.sidebar-collapse-btn{border-radius:var(--radius-sm);width:100%;color:var(--text-muted);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;gap:.5rem;padding:.5rem;font-size:.9rem;display:flex}.sidebar-collapse-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}.page-fade-in[style*="280px"]{gap:2rem;grid-template-columns:280px 1fr!important}}