:root{--bg: #f3f4f6;--panel: #ffffff;--text: #111827;--muted: #6b7280;--border: #e5e7eb;--primary: #111827;--primary-pressed: #000000;--secondary: #f9fafb;--secondary-text: #374151;--danger: #b91c1c;--warning: #b45309;--success: #15803d;--radius: 18px;--font-body: "Segoe UI Variable Text", "Noto Sans KR", "Malgun Gothic", sans-serif;--font-heading: "Segoe UI Variable Display", "Noto Sans KR", "Malgun Gothic", sans-serif;color:var(--text);background:var(--bg);font-family:var(--font-body);font-size:16px;line-height:1.5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--bg)}button,input,textarea{font:inherit}a{color:inherit}.app-shell{min-height:100svh;padding:16px}.page-chrome{width:min(100%,720px);margin:0 auto;display:grid;gap:12px;padding-bottom:24px}.install-fab-wrap{position:sticky;top:12px;z-index:10;display:grid;justify-items:end;gap:8px}.install-fab{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--border);border-radius:999px;background:#fffffff0;color:var(--text);font-weight:700;box-shadow:0 8px 24px #11182714;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer}.install-fab-ready{border-color:var(--primary)}.install-fab-icon{width:18px;height:18px}.install-hint{margin:0;max-width:min(280px,80vw);padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:#fffffff5;color:var(--muted);font-size:13px;text-align:right;box-shadow:0 8px 24px #1118270f}.install-helper{margin:0;max-width:min(320px,82vw);padding:10px 12px;border-radius:14px;background:#ffffffe6;color:var(--muted);font-size:13px;text-align:right}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.eyebrow{display:inline-flex;padding:4px 10px;border-radius:999px;background:#f3f4f6;color:var(--secondary-text);font-size:12px;font-weight:700}.hero-title{margin:10px 0 0;font-family:var(--font-heading);font-size:clamp(28px,7vw,38px);line-height:1.05;letter-spacing:-.04em}.hero-copy,.support-text,.status-copy,.empty-state p,.article-excerpt,.article-note,.article-body,.voice-label{color:var(--muted)}.url-form,.playback-panel,.status-banner,.article-card,.empty-state{display:grid;gap:12px}.mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.compact-mode-switch{margin-top:0}.mode-button{min-height:44px;padding:0 14px;border:1px solid var(--border);border-radius:14px;background:#fff;color:var(--secondary-text);font-weight:700;cursor:pointer}.mode-button-active{background:var(--primary);color:#fff;border-color:var(--primary)}.field-label,.slider-meta,.article-meta{font-size:13px;font-weight:700}.field-row{display:grid;gap:8px}.url-input,.text-input{width:100%;border:1px solid var(--border);border-radius:14px;background:#fff;color:var(--text)}.url-input{min-height:48px;padding:0 14px}.text-input{min-height:220px;padding:14px;resize:vertical}.url-input::placeholder,.text-input::placeholder{color:#9ca3af}.button-row,.status-actions,.playback-actions{display:flex;flex-wrap:wrap;gap:8px}.primary-button,.secondary-button,.ghost-button,.text-link{min-height:44px;padding:0 14px;border-radius:14px;border:1px solid var(--border);background:#fff;color:var(--secondary-text);text-decoration:none;font-weight:700;cursor:pointer}.primary-button{background:var(--primary);border-color:var(--primary);color:#fff}.primary-button:hover,.primary-button:focus-visible{background:var(--primary-pressed)}.secondary-button{background:var(--secondary)}.ghost-button,.text-link{background:#fff}.primary-button:disabled,.secondary-button:disabled,.ghost-button:disabled{cursor:not-allowed;opacity:.55}.support-text{margin:0;font-size:13px}.status-header,.section-header,.article-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.status-title,.section-header h2,.article-title,.empty-state h2{margin:0;font-family:var(--font-heading);font-size:20px;line-height:1.2}.status-pill{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;min-width:68px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700}.tone-neutral .status-pill{background:#f3f4f6;color:var(--secondary-text)}.tone-success .status-pill{background:#dcfce7;color:var(--success)}.tone-warning .status-pill{background:#fef3c7;color:var(--warning)}.tone-error .status-pill{background:#fee2e2;color:var(--danger)}.slider-wrap{display:grid;gap:6px}.slider-meta{display:flex;justify-content:space-between}.rate-slider{width:100%;accent-color:var(--primary)}.voice-label{font-size:13px}.article-excerpt{margin:0}.article-note{margin:0;padding:10px 12px;border-radius:12px;background:#f9fafb;border:1px solid var(--border)}.article-body{margin:0;white-space:pre-wrap;word-break:break-word}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:720px){.field-row{grid-template-columns:1fr auto}.primary-button{min-width:120px}}