.app-footer{text-align:center;color:var(--color-text-tertiary);border-top:1px solid var(--color-border);background:#f8fafc;padding:16px;font-size:12px}.app-header{background:var(--color-surface);border-bottom:2px solid var(--color-badge-bg);z-index:20;position:sticky;top:0}.app-header__bar{justify-content:space-between;align-items:center;padding:16px;display:flex}.app-header__left{align-items:center;gap:12px;display:flex}.app-header__menu-btn{color:var(--color-text);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;padding:4px;display:inline-flex}.app-header__menu-btn:hover{background:var(--color-secondary-bg)}.app-header__right{align-items:center;gap:10px;display:flex}.app-header__logout-btn{color:var(--color-text-secondary);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;align-items:center;padding:4px;display:inline-flex}.app-header__logout-btn:hover{background:var(--color-secondary-bg);color:var(--color-danger-text)}.app-header__title{background:var(--gradient-primary);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700}@media (width>=768px){.app-header__bar{padding:16px 24px}.app-header__menu-btn{display:none}}.app-sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);z-index:50;width:240px;height:100vh;padding:24px 12px;transition:transform .25s;position:fixed;top:0;left:0;overflow-y:auto;transform:translate(-100%)}.app-sidebar--open{box-shadow:var(--shadow-lift);transform:translate(0)}.app-sidebar__backdrop{z-index:40;background:#0f172a66;position:fixed;inset:0}.app-sidebar__nav{flex-direction:column;gap:4px;display:flex}.app-sidebar__nav a{border-radius:var(--radius);color:var(--color-text-secondary);border-left:4px solid #0000;align-items:center;gap:10px;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;transition:background-color .15s;display:flex}.app-sidebar__nav a:hover{background:var(--color-secondary-bg)}.app-sidebar__nav a.active{background:var(--color-badge-bg);color:var(--color-accent-1);border-left:4px solid var(--color-accent-1);font-weight:600}@media (width>=768px){.app-sidebar{height:100vh;box-shadow:none;flex-shrink:0;position:sticky;top:0;transform:none}.app-sidebar__backdrop{display:none}}@media (width>=768px) and (width<=1023px){.app-sidebar{width:72px;padding:24px 8px}.app-sidebar__nav a{justify-content:center;padding:12px}.app-sidebar__nav a span{display:none}}.topic-picker{flex-direction:column;gap:16px;display:flex}.topic-picker__title{color:var(--color-text-secondary);margin:0;font-size:14px}.topic-picker__grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}@media (width>=768px){.topic-picker__grid{grid-template-columns:repeat(4,1fr)}}.topic-picker__option{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);cursor:pointer;padding:16px 12px;font-size:14px;font-weight:500;transition:border-color .2s,box-shadow .2s,transform .2s}.topic-picker__option:hover{border-color:var(--color-accent-1);box-shadow:var(--shadow);transform:scale(1.02)}.chat-page{flex-direction:column;gap:12px;height:calc(100vh - 170px);min-height:0;display:flex}@media (width>=768px){.chat-page{height:calc(100vh - 180px)}}.chat-header{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.chat-header__topic{color:var(--color-primary);font-size:16px;font-weight:600}.chat-starters{flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;display:flex}.chat-starters__hint{width:100%;color:var(--color-text-tertiary);font-size:12px}.message-list{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);flex-direction:column;flex:1;gap:12px;min-height:0;padding:16px;display:flex;overflow-y:auto}.message-group{flex-direction:column;gap:6px;max-width:75%;animation:.3s slide-up;display:flex}.message-group--user{align-self:flex-end;align-items:flex-end}.message-group--bot{align-self:flex-start;align-items:flex-start}.message-bubble{flex-direction:column;gap:4px;width:100%;display:flex}.message-bubble__label{text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary);font-size:10px;font-weight:500}.message-bubble__content{border-radius:var(--radius);padding:10px 16px;font-size:14px;line-height:1.5}.message-bubble--user .message-bubble__content{background:var(--gradient-primary);color:#fff}.message-bubble--bot .message-bubble__content{background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border)}.message-bubble--error .message-bubble__content{background:var(--color-danger-bg);color:var(--color-danger-text);border:1px solid var(--color-danger-border)}.correction-callout{border-radius:var(--radius);border:1px solid var(--color-accent-1);background:#6366f114;flex-direction:column;gap:8px;width:100%;padding:10px 14px;font-size:13px;display:flex}.correction-callout__section{flex-direction:column;gap:4px;display:flex}.correction-callout__title{text-transform:uppercase;letter-spacing:.04em;color:var(--color-accent-1);font-size:11px;font-weight:600}.correction-callout__list{color:var(--color-text);flex-direction:column;gap:4px;margin:0;padding-left:18px;display:flex}.correction-callout__wrong{color:var(--color-danger-text);text-decoration:line-through}.correction-callout__correct{color:var(--color-text);font-weight:600}.correction-callout__explanation{color:var(--color-text-tertiary);font-style:italic}.correction-callout__sentence{color:var(--color-text);margin:0;font-weight:500}.message-input{flex-shrink:0;gap:8px;display:flex}.message-input input{border:2px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);flex:1;padding:12px 16px;font-size:14px;transition:border-color .2s,box-shadow .2s}.message-input input::placeholder{color:var(--color-text-tertiary)}.message-input input:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.message-input__submit{padding:12px 24px}.dictionary-page{flex-direction:column;gap:14px;display:flex}.dictionary-page__subtitle{color:var(--color-text-secondary);margin:0;font-size:14px}.dictionary-page__empty{text-align:center;color:var(--color-text-tertiary);padding:24px 0;font-size:14px}.dictionary-filters{flex-wrap:wrap;gap:8px;display:flex}.dictionary-filters select{border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);background:var(--color-surface);padding:10px 14px;font-size:14px}.dictionary-filters select:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.dictionary-search-row{flex:1;align-items:center;min-width:160px;display:flex;position:relative}.dictionary-search-icon{color:var(--color-text-tertiary);pointer-events:none;position:absolute;left:14px}.dictionary-search-row input{border:1px solid var(--color-border);border-radius:var(--radius);width:100%;color:var(--color-text);padding:10px 16px 10px 40px;font-size:14px}.dictionary-search-row input::placeholder{color:var(--color-text-tertiary)}.dictionary-search-row input:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.dictionary-list{flex-direction:column;max-height:60vh;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.dictionary-list__item{border-bottom:1px solid var(--color-border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 8px;display:flex}.dictionary-list__item:last-child{border-bottom:none}.dictionary-list__item:hover{background:var(--color-bg)}.dictionary-list__text{align-items:baseline;gap:8px;min-width:160px;display:flex}.dictionary-list__english{color:var(--color-primary);font-size:14px;font-weight:500}.dictionary-list__turkish{color:var(--color-text-secondary);font-size:14px}.dictionary-list__tags{flex-wrap:wrap;gap:6px;display:flex}.login-page{background:var(--color-bg);justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}.login-card{flex-direction:column;gap:14px;width:100%;max-width:360px;display:flex}.login-card__brand{color:var(--color-primary);align-items:center;gap:8px;font-weight:600;display:flex}.login-card h2{margin:0}.login-field{color:var(--color-text-secondary);flex-direction:column;gap:6px;font-size:.9rem;display:flex}.login-field input{border-radius:var(--radius);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);padding:10px 12px;font-size:1rem}.login-field input:focus{border-color:var(--color-accent-1);outline:none}.settings-page{flex-direction:column;gap:16px;display:flex}.settings-page__loading{text-align:center;color:var(--color-text-secondary)}.settings-section{flex-direction:column;gap:16px;display:flex}.settings-section__subtitle{color:var(--color-text-secondary);margin:0;font-size:14px}.settings-row{color:var(--color-text);justify-content:space-between;align-items:center;font-size:14px;display:flex}.settings-actions{flex-wrap:wrap;gap:12px;display:flex}.settings-form{flex-direction:column;gap:16px;display:flex}.settings-form__field{flex-direction:column;gap:6px;font-size:14px;font-weight:500;display:flex}.settings-form__field input,.settings-form__field select{border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);background:var(--color-surface);padding:10px 16px;font-size:14px;font-weight:400}.settings-form__field input:focus,.settings-form__field select:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.settings-form__field small{color:var(--color-text-secondary);font-size:12px;font-weight:400}.settings-form__key-row{gap:8px;display:flex}.settings-form__key-row input{flex:1}.settings-feedback{border-radius:var(--radius);text-align:center;padding:12px 14px;font-size:14px;animation:.3s slide-up}.settings-feedback--success{background:var(--color-success-bg);color:var(--color-success-text);border:1px solid var(--color-success-border)}.settings-feedback--error{background:var(--color-danger-bg);color:var(--color-danger-text);border:1px solid var(--color-danger-border)}.toggle{cursor:pointer;align-items:center;gap:10px;display:inline-flex}.toggle input{display:none}.toggle__track{background:var(--color-secondary-bg-hover);border-radius:999px;flex-shrink:0;width:40px;height:22px;transition:background .2s;position:relative}.toggle input:checked+.toggle__track{background:var(--gradient-primary)}.toggle__thumb{width:18px;height:18px;box-shadow:var(--shadow);background:#fff;border-radius:50%;transition:transform .2s;position:absolute;top:2px;left:2px}.toggle input:checked+.toggle__track .toggle__thumb{transform:translate(18px)}.toggle__label{color:var(--color-text);font-size:14px}.stats-page{flex-direction:column;gap:16px;display:flex}.stats-page__loading{text-align:center;color:var(--color-text-secondary)}.stats-grid{grid-template-columns:1fr;gap:16px;display:grid}@media (width>=1024px){.stats-grid{grid-template-columns:repeat(3,1fr)}}.stat-card,.stats-section{border-top:4px solid #0000;flex-direction:column;gap:4px;display:flex}.stat-card--accent-1{border-top-color:var(--color-accent-1)}.stat-card--accent-2{border-top-color:var(--color-accent-2)}.stat-card--accent-3{border-top-color:var(--color-accent-3)}.stat-card__value-row{align-items:baseline;gap:6px;display:flex}.stat-card__value{color:var(--color-accent-1);font-size:36px;font-weight:700}.stat-card__value-unit{color:var(--color-text-secondary);font-size:14px}.stat-card__growth{color:var(--color-success-text);font-size:13px;font-weight:500}.stats-section h3{margin:2px 0 8px}.stats-section__empty{color:var(--color-text-tertiary);margin:0;font-size:14px}.stats-section__empty--icon{align-items:center;gap:8px;display:flex}.word-rank-list,.mistake-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.word-rank-list li{flex-direction:column;gap:4px;display:flex}.word-rank-list__row{color:var(--color-text);justify-content:space-between;font-size:14px;display:flex}.word-rank-list__bar{background:var(--color-secondary-bg);border-radius:999px;height:6px;overflow:hidden}.word-rank-list__bar-fill{background:var(--color-accent-1);border-radius:999px;height:100%}.mistake-list li{color:var(--color-text);border-bottom:1px solid var(--color-border);padding:8px 0;font-size:14px}.mistake-list li:last-child{border-bottom:none}.mistake-list li span{color:var(--color-text-secondary)}.upload-page{flex-direction:column;gap:16px;display:flex}.upload-page__accent{background:var(--gradient-primary);border-radius:999px;width:40px;height:4px}.upload-page__subtitle{color:var(--color-text-secondary);margin:0;font-size:14px}.drop-zone{border:2px dashed var(--color-border-dashed);border-radius:var(--radius);background:var(--color-bg);text-align:center;flex-direction:column;align-items:center;gap:10px;padding:32px 16px;transition:background-color .2s,border-color .2s;display:flex}.drop-zone:hover,.drop-zone--active{background:#f3e8ff;border-color:#818cf8}.drop-zone__icon{color:var(--color-accent-1)}.drop-zone__text{color:var(--color-accent-1);margin:0;font-size:14px;font-weight:500}.drop-zone__or{color:var(--color-text-tertiary);margin:0;font-size:12px}.file-info{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);justify-content:space-between;padding:10px 14px;font-size:14px;display:flex}.file-info__size{color:var(--color-text-secondary)}.upload-banner{border-radius:var(--radius);text-align:center;padding:12px 14px;font-size:14px;animation:.3s slide-up}.upload-banner--success{background:var(--color-success-bg);color:var(--color-success-text);border:1px solid var(--color-success-border)}.upload-banner--error{background:var(--color-danger-bg);color:var(--color-danger-text);border:1px solid var(--color-danger-border)}.progress-bar{background:var(--color-secondary-bg);border-radius:999px;height:20px;position:relative;overflow:hidden}.progress-bar__fill{background:var(--gradient-primary);height:100%;transition:width .2s}.progress-bar__label{color:var(--color-text);justify-content:center;align-items:center;font-size:12px;font-weight:500;display:flex;position:absolute;inset:0}.words-page{flex-direction:column;gap:14px;display:flex}.words-page__header{justify-content:space-between;align-items:center;display:flex}.words-page__header h2{margin:0}.words-page__subtitle{color:var(--color-text-secondary);margin:0;font-size:14px}.add-word-form{flex-wrap:wrap;gap:8px;display:flex}.add-word-form input{border:1px solid var(--color-border);border-radius:var(--radius);min-width:140px;color:var(--color-text);flex:1;padding:10px 16px;font-size:14px}.add-word-form input::placeholder{color:var(--color-text-tertiary)}.add-word-form input:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.words-feedback{border-radius:var(--radius);padding:10px 14px;font-size:14px;animation:.3s slide-up}.words-feedback--success{background:var(--color-success-bg);color:var(--color-success-text);border:1px solid var(--color-success-border)}.words-feedback--error{background:var(--color-danger-bg);color:var(--color-danger-text);border:1px solid var(--color-danger-border)}.words-page__search-row{align-items:center;display:flex;position:relative}.words-page__search-icon{color:var(--color-text-tertiary);pointer-events:none;position:absolute;left:14px}.words-page__search{border:1px solid var(--color-border);border-radius:var(--radius);width:100%;color:var(--color-text);padding:10px 16px 10px 40px;font-size:14px}.words-page__search::placeholder{color:var(--color-text-tertiary)}.words-page__search:focus{border-color:var(--color-accent-1);outline:none;box-shadow:0 0 0 3px #6366f11a}.words-page__empty{text-align:center;color:var(--color-text-tertiary);padding:24px 0;font-size:14px}.words-list__head{grid-template-columns:1fr 1fr auto;gap:12px;padding:0 8px;display:grid}.words-list{flex-direction:column;max-height:60vh;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.words-list__item{border-bottom:1px solid var(--color-border);grid-template-columns:1fr 1fr auto;align-items:center;gap:12px;padding:10px 8px;transition:background-color .15s;display:grid}.words-list__item:last-child{border-bottom:none}.words-list__item:hover{background:var(--color-bg)}.words-list__english{color:var(--color-primary);font-size:14px;font-weight:500}.words-list__turkish{color:var(--color-text-secondary);font-size:14px}.app-loading{min-height:100vh;color:var(--color-text-secondary);justify-content:center;align-items:center;display:flex}.app-shell{flex-direction:column;min-height:100vh;display:flex}.app-body{flex:1;display:flex}.app-main{flex-direction:column;flex:1;min-width:0;display:flex}.app-content{box-sizing:border-box;flex:1;width:100%;max-width:960px;margin:0 auto;padding:16px}@media (width>=768px){.app-content{padding:24px}}:root{--color-primary:#0f172a;--color-accent-1:#6366f1;--color-accent-1-hover:#4f46e5;--color-accent-2:#8b5cf6;--color-accent-3:#ec4899;--color-bg:#faf5ff;--color-surface:#fff;--color-text:#1e293b;--color-text-secondary:#64748b;--color-text-tertiary:#94a3b8;--color-border:#e2e8f0;--color-border-dashed:#c7d2fe;--color-badge-bg:#e0e7ff;--color-badge-text:#6366f1;--color-secondary-bg:#f1f5f9;--color-secondary-bg-hover:#e2e8f0;--color-danger-bg:#fef2f2;--color-danger-bg-hover:#fee2e2;--color-danger-text:#dc2626;--color-danger-border:#fecaca;--color-success-bg:#f0fdf4;--color-success-text:#10b981;--color-success-border:#bbf7d0;--gradient-primary:linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);--gradient-vivid:linear-gradient(135deg, #f43f5e 0%, #ec4899 100%);--gradient-success:linear-gradient(135deg, #10b981 0%, #34d399 100%);--radius:12px;--shadow:0 4px 6px -1px #0000001a;--shadow-lift:0 8px 25px -6px #0000001a;--font-sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}[data-theme=dark]{--color-primary:#e0e7ff;--color-bg:#0f0c1d;--color-surface:#1a1730;--color-text:#e2e8f0;--color-text-secondary:#a1a8c3;--color-text-tertiary:#6b7299;--color-border:#2d2a4a;--color-border-dashed:#3f3a66;--color-badge-bg:#2d2a4a;--color-secondary-bg:#241f3d;--color-secondary-bg-hover:#2d2a4a;--color-danger-bg:#2a1620;--color-danger-bg-hover:#3a1c29;--color-danger-border:#4a2030;--color-success-bg:#122a22;--color-success-border:#1c4a38}*{box-sizing:border-box}html{--base-font-size:14px}body{font-family:var(--font-sans);font-size:var(--base-font-size,14px);background:var(--color-bg);color:var(--color-text);min-height:100vh;margin:0;font-weight:400;transition:background-color .2s,color .2s}h1,h2,h3{color:var(--color-text);margin:0}h1{font-size:28px;font-weight:700}h2{font-size:22px;font-weight:700}h3{font-size:16px;font-weight:600}small{font-size:12px;font-weight:400}.label{text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary);font-size:10px;font-weight:500}button,input,select{font-family:inherit}.btn{border-radius:var(--radius);cursor:pointer;border:none;align-items:center;gap:6px;padding:10px 16px;font-size:14px;font-weight:500;transition:transform .2s,box-shadow .2s,background-color .2s;display:inline-flex}.btn:hover:not(:disabled){transform:scale(1.02)}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow)}.btn--secondary{background:var(--color-secondary-bg);color:var(--color-text)}.btn--secondary:hover:not(:disabled){background:var(--color-secondary-bg-hover)}.btn--danger{background:var(--color-danger-bg);color:var(--color-danger-text)}.btn--danger:hover:not(:disabled){background:var(--color-danger-bg-hover)}.btn--rounded{border-radius:999px}.btn--small{padding:6px 12px;font-size:13px}.btn--block{justify-content:center;width:100%}.link{color:var(--color-accent-1);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:0;font-size:14px;display:inline-flex}.link:hover{text-decoration:underline}.card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;transition:box-shadow .3s}.card:hover{box-shadow:var(--shadow-lift)}.badge{background:var(--color-badge-bg);color:var(--color-badge-text);border-radius:999px;align-items:center;padding:4px 10px;font-size:13px;font-weight:500;display:inline-flex}@keyframes slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
