:root{--color-bg: #f8f9fa;--color-surface: #ffffff;--color-surface-hover: #f0f1f3;--color-border: #e2e4e8;--color-text: #1a1d23;--color-text-secondary: #6b7280;--color-text-muted: #9ca3af;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-light: #eff6ff;--color-green: #059669;--color-green-light: #ecfdf5;--color-red: #dc2626;--color-red-light: #fef2f2;--color-yellow: #d97706;--color-yellow-light: #fffbeb;--color-purple: #7c3aed;--color-purple-light: #f5f3ff;--color-cyan: #0891b2;--color-cyan-light: #ecfeff;--color-orange: #ea580c;--color-orange-light: #fff7ed;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", Roboto, sans-serif;--font-mono: "SF Mono", "Fira Code", "Cascadia Code", monospace;--radius-sm: 6px;--radius: 8px;--radius-lg: 12px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .05);--transition: .15s ease;--max-width: 900px}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}kbd{display:inline-block;padding:1px 5px;font-family:var(--font-mono);font-size:11px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-secondary)}::selection{background:var(--color-primary);color:#fff}.app{min-height:100vh;display:flex;flex-direction:column}.header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:0 24px;position:sticky;top:0;z-index:10}.header__inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:56px;gap:16px}.header__brand{font-weight:600;font-size:17px;color:var(--color-text);display:flex;align-items:center;gap:8px}.header__brand span{color:var(--color-primary)}.header__nav{display:flex;align-items:center;gap:16px}.header__tag{font-size:12px;color:var(--color-text-muted);font-family:var(--font-mono)}.header__link{font-size:13px;color:var(--color-text-secondary);display:flex;align-items:center;gap:4px;padding:6px 12px;border-radius:var(--radius);transition:background var(--transition)}.header__link:hover{background:var(--color-surface-hover);text-decoration:none}.main{flex:1;max-width:var(--max-width);margin:0 auto;padding:32px 24px 64px;width:100%}.hero{text-align:center;padding:48px 0 40px}.hero__eyebrow{display:inline-block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-primary);background:var(--color-primary-light);padding:4px 12px;border-radius:20px;margin-bottom:16px}.hero__title{font-size:36px;font-weight:700;line-height:1.15;color:var(--color-text);margin-bottom:12px}.hero__title-accent{color:var(--color-primary)}.hero__subtitle{font-size:16px;color:var(--color-text-secondary);max-width:560px;margin:0 auto 24px;line-height:1.5}.hero__tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.tag{font-size:12px;font-family:var(--font-mono);color:var(--color-text-secondary);background:var(--color-surface);border:1px solid var(--color-border);padding:3px 10px;border-radius:20px}.input-section{margin-bottom:24px}.input-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.input-card__textarea{width:100%;min-height:120px;padding:14px 16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text);font-family:var(--font-sans);font-size:15px;line-height:1.6;resize:vertical;outline:none;transition:border-color var(--transition),box-shadow var(--transition)}.input-card__textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.input-card__textarea::placeholder{color:var(--color-text-muted)}.input-card__controls{display:flex;align-items:flex-end;gap:16px;margin-top:16px;flex-wrap:wrap}.input-card__hint{font-size:12px;color:var(--color-text-muted);margin-top:10px}.lang-selector{flex:1;min-width:200px}.lang-selector__label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-secondary);margin-bottom:6px}.lang-selector__options{display:flex;gap:4px;flex-wrap:wrap}.lang-btn{font-size:13px;padding:7px 14px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition);font-family:var(--font-sans)}.lang-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.lang-btn--active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.lang-btn--active:hover{background:var(--color-primary-hover)}.samples{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.samples__label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-secondary)}.samples__grid{display:flex;flex-wrap:wrap;gap:4px}.sample-btn{font-size:12px;padding:5px 12px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-bg);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition);font-family:var(--font-sans)}.sample-btn:hover{background:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:500;line-height:1;border-radius:var(--radius);padding:10px 20px;white-space:nowrap;cursor:pointer;transition:all var(--transition);border:1px solid transparent;font-family:var(--font-sans);min-width:140px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn--primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn__spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-banner{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--color-red-light);border:1px solid #fecaca;border-radius:var(--radius);color:var(--color-red);font-size:14px;margin-bottom:20px}.results-section{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:32px}@media(max-width:700px){.results-section{grid-template-columns:1fr}}.result-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.result-card__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.result-card__title{font-size:15px;font-weight:600;color:var(--color-text)}.badge{display:inline-flex;font-size:11px;font-weight:500;padding:2px 8px;border-radius:20px;font-family:var(--font-mono)}.badge--ml{background:var(--color-purple-light);color:var(--color-purple)}.badge--lexicon,.badge--keyword{background:var(--color-yellow-light);color:var(--color-yellow)}.result-card__hero{display:flex;align-items:center;gap:12px;margin-bottom:20px}.result-card__emoji{font-size:36px;line-height:1}.result-card__value{font-size:22px;font-weight:600}.result-card__bars{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.bar{display:grid;grid-template-columns:80px 1fr 36px;align-items:center;gap:8px}.bar__label{font-size:11px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.03em;font-weight:500}.bar__track{height:8px;background:var(--color-bg);border-radius:4px;overflow:hidden}.bar__fill{height:100%;border-radius:4px;transition:width .3s ease}.bar__value{font-size:11px;color:var(--color-text-muted);text-align:right;font-family:var(--font-mono)}.result-card__meta{display:flex;flex-direction:column;gap:3px;padding-top:12px;border-top:1px solid var(--color-border)}.result-card__meta span{font-size:12px;color:var(--color-text-muted);font-family:var(--font-mono)}.result-card__meta strong{color:var(--color-text-secondary);font-weight:500}.status-footer{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;padding:12px 20px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);font-size:12px;color:var(--color-text-muted);margin-bottom:24px}.status-footer strong{color:var(--color-text-secondary)}.feedback{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:24px}.feedback--submitted{background:var(--color-green-light);border-color:#a7f3d0}.feedback__prompt{font-size:15px;font-weight:500;color:var(--color-text-secondary)}.feedback__thanks{font-size:15px;font-weight:500;color:var(--color-green)}.feedback__buttons{display:flex;gap:12px}.feedback__btn{display:inline-flex;align-items:center;gap:8px;padding:10px 24px;border:1px solid var(--color-border);border-radius:var(--radius);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition);background:var(--color-surface);font-family:var(--font-sans)}.feedback__btn:disabled{opacity:.5;cursor:not-allowed}.feedback__btn--up{color:var(--color-green)}.feedback__btn--up:hover:not(:disabled){background:var(--color-green-light);border-color:var(--color-green)}.feedback__btn--down{color:var(--color-red)}.feedback__btn--down:hover:not(:disabled){background:var(--color-red-light);border-color:var(--color-red)}.footer{text-align:center;padding:24px 0;font-size:13px;color:var(--color-text-muted);border-top:1px solid var(--color-border);margin-top:auto}.footer a{color:var(--color-primary)}