.field{display:flex;flex-direction:column;gap:var(--s-1)}.field__label{font-size:var(--t-sm);color:var(--ink-muted)}.field__hint{font-size:var(--t-xs);color:var(--ink-faint)}.field__error{font-size:var(--t-xs);color:var(--danger)}.input,.textarea,.select{width:100%;min-height:40px;padding:0 var(--s-3);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-control);color:var(--ink);transition:border-color var(--dur-fast) var(--ease-out-expo)}.textarea{min-height:80px;padding:var(--s-2) var(--s-3);resize:vertical;line-height:1.6}.select{cursor:pointer}.input:hover:not(:disabled),.textarea:hover:not(:disabled),.select:hover:not(:disabled){border-color:var(--line-strong)}.input:focus-visible,.textarea:focus-visible,.select:focus-visible{outline:2px solid var(--focus);outline-offset:1px;border-color:var(--line-strong)}.input:disabled,.textarea:disabled,.select:disabled{opacity:.5;cursor:not-allowed}.input::placeholder,.textarea::placeholder{color:var(--ink-muted)}.error-banner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);background:var(--danger-weak);color:var(--danger);border-radius:var(--r-control);padding:var(--s-3) var(--s-4);font-size:var(--t-sm)}.error-banner__text{overflow-wrap:anywhere}.error-banner__close{flex-shrink:0;background:transparent;border:none;color:inherit;font-size:var(--t-lg);line-height:1;cursor:pointer;padding:0 var(--s-1);border-radius:var(--r-control)}.error-banner__close:hover{opacity:.8}.status-pill{display:inline-flex;align-items:center;gap:var(--s-1);padding:2px var(--s-2);border-radius:var(--r-pill);font-size:var(--t-xs);border:1px solid var(--line-strong);color:var(--ink-muted)}.status-pill__dot{width:6px;height:6px;border-radius:50%;background:currentColor}.status-pill--pending .status-pill__dot,.status-pill--running .status-pill__dot{animation:status-pulse 1.4s var(--ease-out-expo) infinite}.status-pill--done{color:var(--success);border-color:var(--success)}.status-pill--error{color:var(--danger);border-color:var(--danger)}@keyframes status-pulse{0%,to{opacity:1}50%{opacity:.35}}@media (prefers-reduced-motion: reduce){.status-pill__dot{animation:none}}.attempt-pipeline{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}.attempt-pipeline__stage{display:inline-flex;align-items:center;gap:var(--s-1)}.attempt-pipeline__stage-label{font-size:var(--t-xs);color:var(--ink-faint)}.attempt-pipeline__label,.raw-output{font-size:var(--t-sm);color:var(--ink-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);border-radius:var(--r-control);border:1px solid transparent;font-size:var(--t-base);font-weight:500;cursor:pointer;white-space:nowrap;transition:background-color var(--dur-fast) var(--ease-out-expo),border-color var(--dur-fast) var(--ease-out-expo),color var(--dur-fast) var(--ease-out-expo),transform var(--dur-fast) var(--ease-out-expo)}.btn--md{height:40px;padding:0 var(--s-4)}.btn--sm{height:32px;padding:0 var(--s-3);font-size:var(--t-sm)}.btn--primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn--primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn--primary:active:not(:disabled){transform:translateY(1px)}.btn--default{background:transparent;color:var(--ink);border-color:var(--line-strong)}.btn--default:hover:not(:disabled){background:var(--surface)}.btn--default:active:not(:disabled){transform:translateY(1px)}.btn--ghost{background:transparent;color:var(--ink-muted);border-color:transparent}.btn--ghost:hover:not(:disabled){background:var(--surface);color:var(--ink)}.btn--danger{background:transparent;color:var(--danger);border-color:var(--danger)}.btn--danger:hover:not(:disabled){background:var(--danger-weak)}.btn--danger:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn__spinner{width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;animation:btn-spin .7s linear infinite}.btn--loading .btn__label{opacity:.85}@keyframes btn-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.btn__spinner{animation:none;opacity:.6}}.empty-state{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3);padding:var(--s-5) 0;color:var(--ink-muted)}.empty-state__message{font-size:var(--t-base);max-width:68ch}.skeleton-list{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-2) 0}.skeleton-row{height:40px;border-radius:var(--r-control);background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 37%,var(--surface) 63%);background-size:400% 100%;animation:skeleton-shimmer 1.4s ease-in-out infinite}@keyframes skeleton-shimmer{0%{background-position:100% 0}to{background-position:0 0}}@media (prefers-reduced-motion: reduce){.skeleton-row{animation:none;background:var(--surface)}}.practice-question-pick{display:block;width:100%;text-align:left;cursor:pointer}.practice-question{font-size:var(--t-md);font-weight:600;line-height:1.5;color:var(--ink)}.practice-question__hint{margin-top:var(--s-2);font-size:var(--t-sm);color:var(--ink-muted)}.practice-record{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;min-height:44px}.practice-record__btn{min-width:200px;height:56px;border-radius:var(--r-pill);font-size:var(--t-base);font-weight:600}.practice-record__live{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px}.practice-record__tally{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 var(--accent-weak);animation:tally-pulse 1.4s var(--ease-out-expo) infinite}.practice-record__elapsed{font-size:var(--t-sm);color:var(--ink-muted);font-variant-numeric:tabular-nums}@keyframes tally-pulse{0%{box-shadow:0 0 0 0 var(--accent-weak)}70%{box-shadow:0 0 0 10px transparent}to{box-shadow:0 0 0 0 transparent}}@media (prefers-reduced-motion: reduce){.practice-record__tally{animation:none}}.save-to-note{display:inline-flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}.save-to-note__done{font-size:var(--t-sm);color:var(--success)}.correct-result__text{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}.raw-output{font-size:var(--t-sm);color:var(--ink-muted)}.raw-output summary{cursor:pointer;color:var(--ink-muted)}.raw-output pre{margin-top:var(--s-2);padding:var(--s-3);background:var(--surface);border-radius:var(--r-control);overflow-x:auto;font-size:var(--t-xs);white-space:pre-wrap;overflow-wrap:anywhere}.history-page__heading{display:flex;flex-direction:column;gap:var(--s-2)}.history-page__heading h2{font-size:var(--t-xl)}.history-tabs{display:flex;flex-wrap:wrap;gap:var(--s-2)}.history-page__list{min-width:0}.history-list{border-top:1px solid var(--line)}.history-entry{display:block;padding:0}.history-entry__toggle{display:flex;align-items:center;width:100%;min-height:64px;gap:var(--s-3);padding:var(--s-3) 0;text-align:left;color:var(--ink);cursor:pointer;overflow:hidden;transition:background-color var(--dur-fast) var(--ease-out-expo)}.history-entry__toggle:hover{background:var(--surface)}.history-entry__main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.history-entry__title{overflow-wrap:anywhere}.history-entry__meta{color:var(--ink-faint);font-size:var(--t-xs);overflow-wrap:anywhere}.history-entry__chevron{width:24px;flex-shrink:0;color:var(--ink-muted);font-size:var(--t-lg);line-height:1;text-align:center}.history-entry__detail{display:flex;flex-direction:column;gap:var(--s-4);min-width:0;padding:var(--s-4) 0 var(--s-5);border-top:1px solid var(--line)}.history-entry__audio{display:block;width:min(100%,30rem);max-width:100%}.history-entry__actions{display:flex;flex-wrap:wrap;gap:var(--s-2)}.history-detail__content{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}.history-detail__content h3{margin-bottom:var(--s-2);font-size:var(--t-md)}.history-detail__corrected{font-size:var(--t-md);overflow-wrap:anywhere}.history-detail__status{display:flex;align-items:center;gap:var(--s-2);color:var(--ink-muted)}@media (max-width: 30rem){.history-entry__toggle{align-items:flex-start}.history-entry__toggle .status-pill{flex-shrink:0}.history-entry__meta{line-height:1.4}}.app{max-width:var(--content-max);margin:0 auto;min-height:100%;display:flex;flex-direction:column}.auth-screen{min-height:100%;display:grid;place-items:center;padding:var(--s-5) var(--s-4)}.auth-screen__panel{width:min(100%,24rem);display:grid;gap:var(--s-5);padding:var(--s-6);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card)}.auth-screen__intro{display:grid;gap:var(--s-2)}.auth-screen__brand{color:var(--accent);font-size:var(--t-sm);font-weight:700;letter-spacing:.04em}.auth-screen__intro h1{font-size:var(--t-xl)}.auth-screen__intro p{color:var(--ink-muted);font-size:var(--t-sm)}.auth-screen__submit{width:100%}.auth-screen__checking{color:var(--ink-muted)}.app__header{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 var(--s-4);background:var(--surface-2);border-bottom:1px solid var(--line)}.app__brand{font-size:var(--t-lg);font-weight:600;letter-spacing:-.015em}.app__status{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-xs);color:var(--ink-muted)}.app__status-dot{width:8px;height:8px;border-radius:50%;background:var(--ink-faint)}.app__status-dot--online{background:var(--success)}.app__status-dot--offline{background:var(--danger)}.app__main{flex:1;width:100%;padding:var(--s-4);padding-bottom:calc(var(--tab-bar-height) + env(safe-area-inset-bottom) + var(--s-4))}.app__tabbar{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-sticky);display:flex;max-width:var(--content-max);margin:0 auto;background:var(--surface-2);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.app__tab{position:relative;flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--ink-muted);font-size:var(--t-sm);cursor:pointer;transition:color var(--dur-fast) var(--ease-out-expo)}.app__tab:before{content:"";position:absolute;top:0;left:22%;right:22%;height:2px;background:var(--accent);border-radius:var(--r-pill);transform:scaleX(0);transition:transform var(--dur-base) var(--ease-out-expo)}.app__tab--active{color:var(--accent);font-weight:600}.app__tab--active:before{transform:scaleX(1)}.app__tab:hover:not(.app__tab--active){color:var(--ink)}@media (prefers-reduced-motion: reduce){.app__tab:before{transition:none}}:root{color-scheme:dark;--bg: oklch(.16 .008 50);--surface: oklch(.21 .01 50);--surface-2: oklch(.25 .012 50);--line: oklch(.32 .012 50);--line-strong: oklch(.42 .014 50);--ink: oklch(.97 .004 50);--ink-muted: oklch(.76 .01 50);--ink-faint: oklch(.62 .01 50);--accent: oklch(.74 .155 50);--accent-hover: oklch(.79 .155 50);--accent-ink: oklch(.18 .02 50);--accent-weak: oklch(.74 .155 50 / .14);--danger: oklch(.7 .17 25);--danger-weak: oklch(.7 .17 25 / .14);--success: oklch(.74 .13 155);--focus: oklch(.8 .12 240);--font-sans: system-ui, -apple-system, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;--t-xs: .75rem;--t-sm: .8125rem;--t-base: .9375rem;--t-md: 1.0625rem;--t-lg: 1.25rem;--t-xl: 1.5rem;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 24px;--s-6: 32px;--s-7: 48px;--r-control: 8px;--r-card: 12px;--r-pill: 999px;--z-sticky: 10;--z-popover: 20;--z-modal: 30;--z-toast: 40;--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--dur-fast: .15s;--dur-base: .2s;--dur-slow: .22s;--content-max: 44rem;--tab-bar-height: 56px}@media (prefers-color-scheme: light){:root{color-scheme:light;--bg: oklch(1 0 0);--surface: oklch(.975 .003 50);--surface-2: oklch(.95 .004 50);--line: oklch(.88 .006 50);--line-strong: oklch(.78 .01 50);--ink: oklch(.22 .01 50);--ink-muted: oklch(.45 .012 50);--ink-faint: oklch(.58 .01 50);--accent: oklch(.55 .15 50);--accent-hover: oklch(.5 .15 50);--accent-ink: oklch(1 0 0);--accent-weak: oklch(.55 .15 50 / .12);--danger: oklch(.55 .19 25);--danger-weak: oklch(.55 .19 25 / .12);--success: oklch(.5 .14 155);--focus: oklch(.55 .15 240)}}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-sans);font-size:var(--t-base);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4{margin:0;line-height:1.25;letter-spacing:-.015em;text-wrap:balance;font-weight:600}p{margin:0;max-width:68ch;text-wrap:pretty;-webkit-hyphens:none;hyphens:none}button,input,textarea,select{font:inherit;color:inherit}ul{list-style:none;margin:0;padding:0}a{color:inherit}button{background:none;border:none;padding:0}:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-control)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}.page{display:flex;flex-direction:column;gap:var(--s-6)}.section{display:flex;flex-direction:column;gap:var(--s-3)}.section--compact{padding-bottom:var(--s-4);border-bottom:1px solid var(--line)}.section__title{font-size:var(--t-lg)}.section__row{display:flex;gap:var(--s-2);align-items:flex-start;flex-wrap:wrap}.section__row--between{align-items:center;justify-content:space-between}.section__hint{color:var(--ink-muted);font-size:var(--t-sm)}.section__row>*{min-width:0}.row-list{display:flex;flex-direction:column}.row-list__item{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:var(--s-3) 0;border-bottom:1px solid var(--line);transition:background-color var(--dur-fast) var(--ease-out-expo)}.row-list__item:last-child{border-bottom:none}.row-list__item:hover{background:var(--surface)}.row-list__main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.row-list__text{font-size:var(--t-base);color:var(--ink);overflow-wrap:anywhere}.row-list__meta{font-size:var(--t-xs);color:var(--ink-faint)}.row-list__actions{display:flex;gap:var(--s-2);flex-shrink:0}.row-list__edit-form{display:flex;gap:var(--s-2);flex:1;align-items:center}.muted{color:var(--ink-muted)}.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}
