*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;color:var(--color-text);background-color:var(--color-bg)}:root{--color-primary: #2563eb;--color-primary-dark: #1e40af;--color-bg: #ffffff;--color-surface: #f9fafb;--color-text: #111827;--color-text-muted: #6b7280;--color-border: #e5e7eb;--color-success: #10b981;--color-error: #ef4444;--space-2: .125rem;--space-4: .25rem;--space-8: .5rem;--space-12: .75rem;--space-16: 1rem;--space-24: 1.5rem;--space-32: 2rem;--space-48: 3rem;--space-64: 4rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-16)}h1{font-size:clamp(var(--font-size-3xl),5vw,var(--font-size-4xl))}h2{font-size:clamp(var(--font-size-2xl),4vw,var(--font-size-3xl))}h3{font-size:clamp(var(--font-size-xl),3vw,var(--font-size-2xl))}p{margin-bottom:var(--space-16)}code{font-family:Courier New,Courier,monospace;background-color:var(--color-surface);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-primary)}.app{min-height:100vh;display:flex;flex-direction:column}.u-container{width:100%;max-width:1280px;margin-left:auto;margin-right:auto;padding-left:var(--space-16);padding-right:var(--space-16)}.u-stack-16>*+*{margin-top:var(--space-16)}.u-stack-24>*+*{margin-top:var(--space-24)}.u-stack-32>*+*{margin-top:var(--space-32)}.u-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit;line-height:inherit}button:disabled{cursor:not-allowed;opacity:.6}input,textarea{font-family:inherit;font-size:inherit;line-height:inherit}input:focus,textarea:focus,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:var(--space-16)}.login-page__container{width:100%;max-width:400px;background:#fff;border-radius:var(--radius-lg);padding:var(--space-32);box-shadow:var(--shadow-lg);animation:fadeInUp .5s ease-out}.login-page__header{text-align:center;margin-bottom:var(--space-32)}.login-page__title{color:var(--color-primary);margin-bottom:var(--space-8)}.login-page__subtitle{color:var(--color-text-muted);font-size:var(--font-size-base);margin-bottom:0}.login-form{display:flex;flex-direction:column;gap:var(--space-16)}.login-form__error{background-color:#fee;color:var(--color-error);padding:var(--space-12);border-radius:var(--radius-sm);font-size:var(--font-size-sm);border:1px solid var(--color-error)}.login-form__field{display:flex;flex-direction:column;gap:var(--space-8)}.login-form__label{font-weight:var(--font-weight-medium);color:var(--color-text);font-size:var(--font-size-sm)}.login-form__input{padding:var(--space-12) var(--space-16);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);transition:border-color .2s}.login-form__input:hover:not(:disabled){border-color:var(--color-primary)}.login-form__input:disabled{background-color:var(--color-surface);cursor:not-allowed}.login-form__submit{padding:var(--space-12) var(--space-24);background-color:var(--color-primary);color:#fff;border-radius:var(--radius-sm);font-weight:var(--font-weight-medium);font-size:var(--font-size-base);transition:background-color .2s,transform .1s;margin-top:var(--space-8);min-height:44px}.login-form__submit:hover:not(:disabled){background-color:var(--color-primary-dark)}.login-form__submit:active:not(:disabled){transform:scale(.98)}.demo-banner{background-color:#e3f2fd;border:1px solid #90caf9;border-radius:var(--radius-md);padding:var(--space-16);margin-bottom:var(--space-16)}.demo-banner__header{display:flex;align-items:center;gap:var(--space-8);margin-bottom:var(--space-12)}.demo-banner__icon{width:20px;height:20px;color:#1976d2;flex-shrink:0}.demo-banner__title{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:#1565c0;margin:0}.demo-banner__description{font-size:var(--font-size-sm);color:#424242;margin:0 0 var(--space-12) 0}.demo-banner__accounts{display:flex;flex-direction:column;gap:var(--space-12)}.demo-banner__account{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-8);background-color:#fff;border-radius:var(--radius-sm);border:1px solid #bbdefb}.demo-banner__credential{display:flex;align-items:center;gap:var(--space-8);font-size:var(--font-size-sm)}.demo-banner__label{font-weight:var(--font-weight-medium);color:#616161;min-width:50px}.demo-banner__value{background-color:#f5f5f5;padding:var(--space-4) var(--space-8);border-radius:var(--radius-sm);font-family:Courier New,monospace;font-size:var(--font-size-sm);color:#1565c0;border:1px solid #e0e0e0}.app-shell{min-height:100vh;display:flex;flex-direction:column;background-color:var(--color-surface)}.app-shell__main{flex:1;padding:var(--space-24) var(--space-16);max-width:1280px;margin:0 auto;width:100%}.header-bar{background-color:var(--color-bg);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:10}.header-bar__container{max-width:1280px;margin:0 auto;padding:var(--space-16);display:flex;align-items:center;justify-content:space-between;gap:var(--space-16)}.header-bar__brand{flex:1;min-width:0}.header-bar__title{font-size:var(--font-size-xl);color:var(--color-primary);margin-bottom:var(--space-4)}.header-bar__subtitle{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:0}.header-bar__counter{display:flex;flex-direction:column;align-items:center;padding:var(--space-8) var(--space-16);background-color:var(--color-surface);border-radius:var(--radius-md);min-width:80px}.header-bar__count{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-primary);line-height:1}.header-bar__count-label{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:var(--space-4)}.header-bar__sign-out{padding:var(--space-8) var(--space-16);background-color:transparent;color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);transition:background-color .2s,color .2s;min-height:44px;min-width:44px}.header-bar__sign-out:hover:not(:disabled){background-color:var(--color-surface);color:var(--color-text)}.session-banner{padding:var(--space-12) var(--space-16);display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);border-bottom:1px solid transparent}.session-banner--warning{background-color:#fffbeb;color:#92400e;border-bottom-color:#fde68a}.session-banner--error{background-color:#fee;color:var(--color-error);border-bottom-color:#fca5a5}.session-banner__message{flex:1;margin:0;font-size:var(--font-size-sm)}.session-banner__close{padding:var(--space-4);font-size:var(--font-size-2xl);line-height:1;color:inherit;opacity:.7;transition:opacity .2s;min-height:44px;min-width:44px}.session-banner__close:hover{opacity:1}.global-loader{position:fixed;inset:0;background-color:#ffffffe6;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999;gap:var(--space-16)}.global-loader__spinner{width:48px;height:48px;border:4px solid var(--color-surface);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}.global-loader__text{color:var(--color-text-muted);font-size:var(--font-size-lg);margin:0}.import-section{background-color:var(--color-bg);border-radius:var(--radius-lg);padding:var(--space-24);margin-bottom:var(--space-32);box-shadow:var(--shadow-md)}.import-instructions{margin-bottom:var(--space-24)}.import-instructions__title{color:var(--color-text);margin-bottom:var(--space-12)}.import-instructions__text{color:var(--color-text-muted);margin-bottom:var(--space-16);line-height:1.6}.import-instructions__example{background-color:var(--color-surface);padding:var(--space-16);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.import-instructions__example strong{display:block;margin-bottom:var(--space-8);color:var(--color-text)}.import-instructions__code{margin:0;padding:var(--space-12);background-color:var(--color-bg);border-radius:var(--radius-sm);border:1px solid var(--color-border);font-size:var(--font-size-sm);line-height:1.6;overflow-x:auto}.import-form{display:flex;flex-direction:column;gap:var(--space-16)}.persisted-textarea{display:flex;flex-direction:column;gap:var(--space-8)}.persisted-textarea__input{width:100%;padding:var(--space-12);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);line-height:1.6;resize:vertical;min-height:200px;transition:border-color .2s}.persisted-textarea__input:hover:not(:disabled){border-color:var(--color-primary)}.persisted-textarea__input:disabled{background-color:var(--color-surface);cursor:not-allowed}.persisted-textarea__counter{display:flex;gap:var(--space-8);font-size:var(--font-size-sm);color:var(--color-text-muted);justify-content:flex-end}.persisted-textarea__separator{color:var(--color-border)}.parser-stats{padding:var(--space-16);background-color:var(--color-surface);border-radius:var(--radius-sm);border:1px solid var(--color-border)}.parser-stats__counts{display:flex;gap:var(--space-24);margin-bottom:var(--space-12)}.parser-stats__item{display:flex;gap:var(--space-8);align-items:baseline}.parser-stats__label{font-size:var(--font-size-sm);color:var(--color-text-muted)}.parser-stats__value{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.parser-stats__item--valid .parser-stats__value{color:var(--color-success)}.parser-stats__item--invalid .parser-stats__value{color:var(--color-error)}.parser-stats__warning{display:flex;gap:var(--space-8);align-items:flex-start;padding:var(--space-12);background-color:#fffbeb;border-radius:var(--radius-sm);border:1px solid #fde68a;margin-top:var(--space-12)}.parser-stats__warning-icon{font-size:var(--font-size-lg);line-height:1}.parser-stats__warning-text{flex:1;margin:0;font-size:var(--font-size-sm);color:#92400e;line-height:1.5}.parser-stats__progress{margin-top:var(--space-12);position:relative;height:24px;background-color:var(--color-border);border-radius:var(--radius-sm);overflow:hidden}.parser-stats__progress-bar{position:absolute;top:0;left:0;height:100%;background-color:var(--color-success);transition:width .3s ease-out}.parser-stats__progress-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text);z-index:1}.feedback-banner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);padding:var(--space-12) var(--space-16);border-radius:var(--radius-sm);animation:slideDown .3s ease-out}.feedback-banner--success{background-color:#d1fae5;color:#065f46;border:1px solid var(--color-success)}.feedback-banner--error{background-color:#fee;color:var(--color-error);border:1px solid var(--color-error)}.feedback-banner__message{flex:1;margin:0;font-size:var(--font-size-sm)}.feedback-banner__close{padding:var(--space-4);font-size:var(--font-size-2xl);line-height:1;color:inherit;opacity:.7;transition:opacity .2s;min-height:44px;min-width:44px}.feedback-banner__close:hover{opacity:1}.import-button{padding:var(--space-12) var(--space-24);background-color:var(--color-primary);color:#fff;border-radius:var(--radius-sm);font-weight:var(--font-weight-medium);font-size:var(--font-size-base);transition:background-color .2s,transform .1s;display:flex;align-items:center;justify-content:center;gap:var(--space-8);min-height:44px}.import-button:hover:not(:disabled){background-color:var(--color-primary-dark)}.import-button:active:not(:disabled){transform:scale(.98)}.import-button__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}.flashcard-section{background-color:var(--color-bg);border-radius:var(--radius-lg);padding:var(--space-24);box-shadow:var(--shadow-md)}.flashcard-section__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-24);gap:var(--space-16)}.flashcard-section__title{color:var(--color-text);margin-bottom:0}.flashcard-section__refetch-indicator{font-size:var(--font-size-sm);color:var(--color-text-muted);font-style:italic}.flashcard-section__content{min-height:200px}.empty-state{text-align:center;padding:var(--space-48) var(--space-24)}.empty-state__icon{font-size:4rem;margin-bottom:var(--space-16)}.empty-state__title{color:var(--color-text);margin-bottom:var(--space-8)}.empty-state__text{color:var(--color-text-muted);margin-bottom:0}.error-alert{display:flex;gap:var(--space-16);padding:var(--space-24);background-color:#fee;border:1px solid var(--color-error);border-radius:var(--radius-sm);align-items:flex-start}.error-alert__icon{font-size:var(--font-size-2xl);line-height:1}.error-alert__content{flex:1}.error-alert__title{color:var(--color-error);margin-bottom:var(--space-8);font-size:var(--font-size-lg)}.error-alert__message{color:var(--color-text);margin-bottom:var(--space-16)}.error-alert__retry{padding:var(--space-8) var(--space-16);background-color:var(--color-error);color:#fff;border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:opacity .2s,transform .1s;min-height:44px}.error-alert__retry:hover:not(:disabled){opacity:.9}.error-alert__retry:active:not(:disabled){transform:scale(.98)}.flashcard-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-16)}.flashcard-list__item{margin:0}.flashcard-item{position:relative;background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-24);transition:transform .2s,box-shadow .2s,border-color .2s;cursor:pointer}.flashcard-item:hover:not(.flashcard-item--deleting){transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--color-primary)}.flashcard-item:active:not(.flashcard-item--deleting){transform:translateY(0)}.flashcard-item--revealed{background-color:var(--color-bg);border-color:var(--color-success);cursor:default}.flashcard-item--revealed:hover{transform:none}.flashcard-item--deleting{opacity:.5;pointer-events:none}.flashcard-item__question{margin-bottom:var(--space-16)}.flashcard-item__question-text{font-size:var(--font-size-lg);color:var(--color-text);margin:0;margin-right:var(--space-48)}.flashcard-item__answer{padding-top:var(--space-16);border-top:1px solid var(--color-border);animation:fadeIn .3s ease-out}.flashcard-item__answer-text{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0;line-height:1.6}.delete-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:#fff;border:1px solid var(--color-border);border-radius:50%;font-size:var(--font-size-xl);color:var(--color-text-muted);transition:background-color .2s,color .2s,border-color .2s;min-height:44px;min-width:44px;flex-shrink:0}.delete-button:hover:not(:disabled){background-color:var(--color-error);color:#fff;border-color:var(--color-error)}.delete-button__icon{line-height:1}.delete-button__spinner{width:14px;height:14px;border:2px solid var(--color-border);border-top-color:var(--color-text-muted);border-radius:50%;animation:spin .6s linear infinite}.flashcard-item__actions{position:absolute;top:var(--space-12);right:var(--space-12);display:flex;gap:var(--space-8)}.flashcard-item__edit-button{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:#fff;border:1px solid var(--color-border);border-radius:50%;color:var(--color-text-muted);transition:background-color .2s,color .2s,border-color .2s;min-height:44px;min-width:44px;cursor:pointer;flex-shrink:0}.flashcard-item__edit-button:hover:not(:disabled){background-color:var(--color-primary);color:#fff;border-color:var(--color-primary)}.flashcard-item__edit-button:disabled{opacity:.5;cursor:not-allowed}.flashcard-item--editing{position:relative;background-color:var(--color-surface);border:2px solid var(--color-primary);border-radius:var(--radius-md);padding:var(--space-24);box-shadow:var(--shadow-md)}.flashcard-item__edit-form{display:flex;flex-direction:column;gap:var(--space-16)}.flashcard-item__edit-field{display:flex;flex-direction:column}.flashcard-item__edit-textarea{width:100%;padding:var(--space-12);border:2px solid var(--color-border);border-radius:var(--radius-sm);font-family:inherit;font-size:var(--font-size-base);line-height:1.5;color:var(--color-text);background-color:#fff;resize:vertical;transition:border-color .2s;min-height:80px}.flashcard-item__edit-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.flashcard-item__edit-textarea:disabled{background-color:var(--color-bg);opacity:.6;cursor:not-allowed}.flashcard-item__edit-error{color:var(--color-error);font-size:var(--font-size-sm);margin:0;padding:var(--space-8) var(--space-12);background-color:#ef44441a;border-radius:var(--radius-sm);border-left:3px solid var(--color-error)}.flashcard-item__edit-actions{display:flex;gap:var(--space-12);justify-content:flex-end}.flashcard-item__edit-save,.flashcard-item__edit-cancel{padding:var(--space-12) var(--space-24);border-radius:var(--radius-sm);font-size:var(--font-size-base);font-weight:500;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s;min-height:44px;min-width:80px}.flashcard-item__edit-save{background-color:var(--color-primary);color:#fff;border:2px solid var(--color-primary)}.flashcard-item__edit-save:hover:not(:disabled){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.flashcard-item__edit-save:disabled{opacity:.5;cursor:not-allowed}.flashcard-item__edit-cancel{background-color:#fff;color:var(--color-text);border:2px solid var(--color-border)}.flashcard-item__edit-cancel:hover:not(:disabled){background-color:var(--color-bg);border-color:var(--color-text-muted)}.flashcard-item__edit-cancel:disabled{opacity:.5;cursor:not-allowed}.delete-all-button{padding:var(--space-8) var(--space-16);background-color:var(--color-error);color:#fff;border-radius:var(--radius-sm);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);transition:opacity .2s,transform .1s;display:flex;align-items:center;justify-content:center;gap:var(--space-8);min-height:44px;white-space:nowrap}.delete-all-button:hover:not(:disabled){opacity:.9}.delete-all-button:active:not(:disabled){transform:scale(.98)}.delete-all-button__spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}.delete-all-button__text{line-height:1}.flashcard-skeleton{display:flex;flex-direction:column;gap:var(--space-16)}.flashcard-skeleton__item{background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-24);animation:pulse 1.5s ease-in-out infinite}.flashcard-skeleton__question{height:24px;background-color:var(--color-border);border-radius:var(--radius-sm);margin-bottom:var(--space-12);width:70%}.flashcard-skeleton__line{height:16px;background-color:var(--color-border);border-radius:var(--radius-sm);width:50%}.hello-world{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:var(--space-32)}.hello-world__header{text-align:center;margin-bottom:var(--space-48);animation:fadeInDown .6s ease-out}.hello-world__title{font-size:clamp(var(--font-size-3xl),6vw,var(--font-size-4xl));margin-bottom:var(--space-16);text-shadow:0 2px 10px rgba(0,0,0,.2)}.hello-world__subtitle{font-size:var(--font-size-lg);opacity:.9;max-width:600px;margin:0 auto}.hello-world__content{flex:1;max-width:800px;margin:0 auto;width:100%;animation:fadeInUp .8s ease-out}.hello-world__section{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-lg);padding:var(--space-32);margin-bottom:var(--space-24);box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.2)}.hello-world__section h2,.hello-world__section h3{margin-bottom:var(--space-16)}.hello-world__list{list-style:none;padding-left:0}.hello-world__list li{padding:var(--space-8) 0;padding-left:var(--space-24);position:relative}.hello-world__list li:before{content:"→";position:absolute;left:0;color:#ffffffb3;font-weight:var(--font-weight-bold)}.hello-world__status{line-height:1.8;font-size:var(--font-size-base)}.hello-world__footer{text-align:center;margin-top:var(--space-48);opacity:.8;font-size:var(--font-size-sm)}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(min-width:480px){.hello-world,.login-page__container{padding:var(--space-48)}.header-bar__container{padding:var(--space-16) var(--space-24)}}@media(min-width:768px){.hello-world__section{padding:var(--space-48)}.app-shell__main{padding:var(--space-32) var(--space-24)}.import-section,.flashcard-section{padding:var(--space-32)}.header-bar__title{font-size:var(--font-size-2xl)}.flashcard-item{padding:var(--space-32)}.parser-stats__counts{gap:var(--space-32)}.header-bar__subtitle{display:block}}@media(min-width:1024px){.hello-world{padding:var(--space-64)}.app-shell__main{padding:var(--space-48) var(--space-32)}.flashcard-list{gap:var(--space-24)}}@media(min-width:1280px){.hello-world__content{max-width:900px}.import-section,.flashcard-section{padding:var(--space-48)}}