:root{--yellow: #FFE500;--blue: #00D4FF;--pink: #FF6B9D;--green: #7CFF6B;--orange: #FF9F43;--purple: #C56BFF;--white: #FFFFFF;--black: #1A1A1A;--bg: #F5F0E8;--card-bg: #FFFFFF;--a1-color: #7CFF6B;--a2-color: #00D4FF;--b1-color: #FFE500;--b2-color: #FF9F43;--c1-color: #FF6B9D;--border: 3px solid var(--black);--border-thick: 4px solid var(--black);--shadow: 4px 4px 0px var(--black);--shadow-hover: 6px 6px 0px var(--black);--shadow-active: 2px 2px 0px var(--black);--font: "Space Grotesk", sans-serif;--radius: 8px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background-color:var(--bg);color:var(--black);min-height:100vh;overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}.header{background:var(--yellow);border-bottom:var(--border-thick);padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;position:sticky;top:0;z-index:100}.header__menu-btn{display:none;background:var(--white);border:2px solid var(--black);font-size:1.2rem;font-weight:700;cursor:pointer;padding:4px 10px;border-radius:var(--radius);box-shadow:2px 2px 0 var(--black);margin-right:15px}.header__menu-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--black)}.header__logo{font-size:1.8rem;font-weight:700;letter-spacing:-1px;display:flex;align-items:center;gap:8px}.header__logo span{font-size:2rem}.header__stats{display:flex;gap:12px;align-items:center}.stat-badge{background:var(--white);border:var(--border);border-radius:var(--radius);padding:6px 14px;font-weight:600;font-size:.85rem;box-shadow:var(--shadow)}.app-layout{display:flex;flex:1;min-height:calc(100vh - 72px)}.sidebar{width:260px;background:var(--white);border-right:var(--border-thick);padding:20px 16px;overflow-y:auto;flex-shrink:0}.main-content{flex:1;padding:32px;display:flex;flex-direction:column;align-items:center;gap:24px}.level-selector{margin-bottom:20px}.level-selector__title{font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;color:var(--black)}.level-selector__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.level-btn{font-family:var(--font);font-size:.95rem;font-weight:700;padding:10px 12px;border:var(--border);border-radius:var(--radius);cursor:pointer;transition:all .12s ease;box-shadow:var(--shadow);text-align:center}.level-btn:hover{box-shadow:var(--shadow-hover);transform:translate(-2px,-2px)}.level-btn:active{box-shadow:var(--shadow-active);transform:translate(2px,2px)}.level-btn--active{transform:translate(2px,2px);box-shadow:var(--shadow-active)}.level-btn--A1{background:var(--a1-color)}.level-btn--A2{background:var(--a2-color)}.level-btn--B1{background:var(--b1-color)}.level-btn--B2{background:var(--b2-color)}.level-btn--C1{background:var(--c1-color)}.chapter-nav{margin-bottom:20px}.chapter-nav__title{font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.chapter-btn{font-family:var(--font);width:100%;text-align:left;padding:10px 14px;margin-bottom:6px;background:var(--bg);border:var(--border);border-radius:var(--radius);cursor:pointer;font-size:.85rem;font-weight:500;transition:all .12s ease;box-shadow:2px 2px 0 var(--black)}.chapter-btn:hover{box-shadow:var(--shadow);transform:translate(-1px,-1px)}.chapter-btn--active{background:var(--yellow);font-weight:700;box-shadow:var(--shadow-active);transform:translate(1px,1px)}.chapter-btn{display:flex;align-items:center;gap:8px}.chapter-btn__num{font-weight:800;font-size:.9rem;min-width:20px;flex-shrink:0}.chapter-btn__title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}.chapter-btn__count{font-size:.72rem;font-weight:700;background:var(--black);color:var(--white);border-radius:20px;padding:1px 7px;flex-shrink:0;opacity:.6}.chapter-btn--active .chapter-btn__count{background:var(--white);color:var(--black);opacity:1}.level-btn--locked{opacity:.4;cursor:not-allowed;filter:grayscale(.7)}.level-btn--locked:hover{transform:none;box-shadow:var(--shadow)}.progress-section{margin-top:auto;padding-top:20px;border-top:2px dashed var(--black)}.progress-section__title{font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.progress-bar__container{background:var(--bg);border:var(--border);border-radius:20px;height:24px;overflow:hidden;margin-bottom:8px}.progress-bar__fill{height:100%;border-radius:20px;background:var(--green);transition:width .5s ease;min-width:2px}.progress-bar__text{font-size:.8rem;font-weight:600;text-align:center}.flashcard-area{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%;max-width:560px}.flashcard-counter{font-size:1rem;font-weight:600;color:var(--black)}.flashcard-wrapper{perspective:1200px;width:100%;max-width:500px;height:320px;cursor:pointer}.flashcard{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.25,.46,.45,.94)}.flashcard--flipped{transform:rotateY(180deg)}.flashcard__face{position:absolute;width:100%;height:100%;backface-visibility:hidden;border:var(--border-thick);border-radius:16px;box-shadow:var(--shadow-hover);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:32px;text-align:center;gap:16px}.flashcard__front{background:var(--card-bg)}.flashcard__back{background:#1e1e2e;color:#fff;transform:rotateY(180deg)}.flashcard__word{font-size:2.4rem;font-weight:800;line-height:1.15;letter-spacing:-.5px}.flashcard__plural{font-size:.95rem;font-weight:600;color:var(--black);background:var(--blue);border:2px solid var(--black);border-radius:20px;padding:3px 14px;margin-top:-4px}.flashcard__german-small{font-size:1rem;font-weight:600;opacity:.55;letter-spacing:.3px}.flashcard__definition{font-size:1.45rem;font-weight:700;line-height:1.35;text-align:center;max-width:420px}.flashcard__subsection{font-size:.78rem;font-weight:600;background:#ffffff26;border:1px solid rgba(255,255,255,.3);border-radius:20px;padding:4px 14px;opacity:.85}.flashcard__pos-badge{position:absolute;top:16px;right:16px;border:2px solid var(--black);border-radius:20px;padding:4px 12px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.flashcard__pos-badge--noun{background:var(--blue)}.flashcard__pos-badge--verb{background:var(--green)}.flashcard__pos-badge--adjective{background:var(--orange)}.flashcard__pos-badge--other{background:var(--yellow)}.flashcard__pos-badge--name{background:var(--purple);color:#fff}.flashcard__hint{position:absolute;bottom:16px;font-size:.75rem;font-weight:500;opacity:.5}.flashcard__audio-btn{position:absolute;top:16px;left:16px;background:none;border:none;font-size:1.5rem;cursor:pointer;padding:4px;transition:transform .2s}.flashcard__audio-btn:hover{transform:scale(1.2)}.card-nav{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:center}.btn{font-family:var(--font);font-size:.95rem;font-weight:700;padding:12px 24px;border:var(--border);border-radius:var(--radius);cursor:pointer;transition:all .12s ease;box-shadow:var(--shadow);display:flex;align-items:center;gap:8px}.btn:hover{box-shadow:var(--shadow-hover);transform:translate(-2px,-2px)}.btn:active{box-shadow:var(--shadow-active);transform:translate(2px,2px)}.btn--primary{background:var(--yellow)}.btn--success{background:var(--green)}.btn--danger{background:var(--pink)}.btn--secondary{background:var(--white)}.btn--sm{font-size:.8rem;padding:8px 16px}.word-info{width:100%;max-width:560px;background:var(--white);border:var(--border-thick);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.word-info--animated{animation:slideIn .4s cubic-bezier(.25,.46,.45,.94)}@keyframes slideIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.word-info__header{background:var(--purple);padding:14px 20px;border-bottom:var(--border);font-weight:700;font-size:1rem;display:flex;align-items:center;gap:8px}.word-info__content{padding:20px}.word-info__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.word-info__item{background:var(--bg);border:2px solid var(--black);border-radius:var(--radius);padding:12px}.word-info__item--full{grid-column:1 / -1}.word-info__label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;opacity:.6;margin-bottom:4px}.word-info__value{font-size:1rem;font-weight:600}.word-info__conjugation{font-size:.9rem;font-weight:500;line-height:1.6}.word-info__preposition{color:#6b21a8;font-weight:700}.word-info__examples{list-style:none;padding:0}.word-info__examples li{padding:5px 0;font-size:.9rem;font-style:italic;border-bottom:1px dashed #ccc}.word-info__examples li:last-child{border-bottom:none}.word-info__example-text{font-size:1.05rem;font-style:italic;line-height:1.6;color:#2d2d2d}.word-info__pos{text-transform:capitalize;font-weight:700;color:#6b21a8}.word-info__synonyms{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.word-info__synonym-chip{background:var(--yellow);border:2px solid var(--black);border-radius:20px;padding:3px 12px;font-size:.82rem;font-weight:600}.word-info__section-tag{margin-left:auto;background:var(--black);color:var(--white);border-radius:20px;padding:2px 10px;font-size:.72rem;font-weight:700}.word-info__item--example{background:#fafff4;border-color:var(--green)}.enriched-notice{font-size:.8rem;font-weight:600;color:var(--black);background:var(--yellow);border:2px solid var(--black);border-radius:var(--radius);padding:6px 16px;text-align:center;box-shadow:2px 2px 0 var(--black)}.word-info__example-translation{font-size:.88rem;color:#555;margin-top:6px;font-style:normal;padding-top:6px;border-top:1px dashed #c8e6c9}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 20px;gap:16px}.empty-state__icon{font-size:4rem}.empty-state__title{font-size:1.5rem;font-weight:700}.empty-state__text{font-size:1rem;opacity:.6;max-width:400px}@media(max-width:768px){.header{flex-wrap:nowrap;padding:12px 16px}.header__menu-btn{display:block}.header__logo{display:flex;align-items:center;font-size:1.4rem}.header__logo span{display:none}.app-layout{flex-direction:column}.sidebar{position:fixed;top:73px;left:0;bottom:0;z-index:100;transform:translate(-100%);transition:transform .3s ease;width:280px;border-right:3px solid var(--black);max-height:none}.sidebar.sidebar--open{transform:translate(0);box-shadow:4px 0 15px #0003}.main-content{padding:16px}.flashcard-wrapper{height:280px}.flashcard__word{font-size:1.8rem}.word-info__grid{grid-template-columns:1fr}}@media(max-width:480px){.flashcard-wrapper{height:250px}.flashcard__word{font-size:1.5rem}.flashcard__face{padding:20px}.card-nav{gap:8px}.btn{padding:10px 16px;font-size:.85rem}}