*,*:before,*:after{box-sizing:border-box}*{margin:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{line-height:1.5;min-height:100vh}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}button{cursor:pointer;background:none;border:none;padding:0}a{color:inherit;text-decoration:none}ul,ol{list-style:none;padding:0}:root{--primary-hue: 163;--primary-lightness: 72%;--primary-chroma: .15;--neutral-chroma: .005;--color-primary: oklch(var(--primary-lightness) var(--primary-chroma) var(--primary-hue));--color-primary-light: oklch(82% .12 var(--primary-hue));--color-primary-dark: oklch(55% .15 var(--primary-hue));--color-background: oklch(99% var(--neutral-chroma) 0);--color-surface: oklch(100% 0 0);--color-surface-variant: oklch(97% var(--neutral-chroma) 0);--color-text: oklch(10% var(--neutral-chroma) 0);--color-text-muted: oklch(45% var(--neutral-chroma) 0);--color-text-secondary: oklch(55% var(--neutral-chroma) 0);--color-border: oklch(88% var(--neutral-chroma) 0);--color-border-focus: var(--color-primary);--color-warning: oklch(75% .15 85);--color-success: oklch(72% .15 145);--color-info: oklch(65% .12 250);--color-error: oklch(55% .2 25)}@media(prefers-color-scheme:dark){:root{--primary-lightness: 75%;--color-background: oklch(8% var(--neutral-chroma) 0);--color-surface: oklch(12% var(--neutral-chroma) 0);--color-surface-variant: oklch(16% var(--neutral-chroma) 0);--color-text: oklch(95% var(--neutral-chroma) 0);--color-text-muted: oklch(60% var(--neutral-chroma) 0);--color-text-secondary: oklch(50% var(--neutral-chroma) 0);--color-border: oklch(25% var(--neutral-chroma) 0);--color-warning: oklch(80% .15 85);--color-success: oklch(78% .15 145);--color-info: oklch(72% .12 250);--color-error: oklch(65% .18 25)}}:root{--font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-xxl: 1.5rem;--font-size-3xl: 2rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--touch-target-min: 44px;--radius-sm: .375rem;--radius-md: .625rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--content-width: min(80ch, 100% - 2rem);--shadow-sm: 0 1px 2px oklch(0% 0 0 / .05);--shadow-md: 0 4px 6px oklch(0% 0 0 / .07), 0 2px 4px oklch(0% 0 0 / .05);--shadow-lg: 0 10px 15px oklch(0% 0 0 / .1), 0 4px 6px oklch(0% 0 0 / .05)}@media(prefers-color-scheme:dark){:root{--shadow-sm: 0 1px 2px oklch(0% 0 0 / .2);--shadow-md: 0 4px 6px oklch(0% 0 0 / .3), 0 2px 4px oklch(0% 0 0 / .2);--shadow-lg: 0 10px 15px oklch(0% 0 0 / .4), 0 4px 6px oklch(0% 0 0 / .25)}}body{font-family:var(--font-sans);background-color:var(--color-background);color:var(--color-text)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}h1{font-size:clamp(2rem,5vw,3rem)}h2{font-size:clamp(1.5rem,4vw,2.25rem)}h3{font-size:clamp(1.25rem,3vw,1.75rem)}code,pre{font-family:var(--font-mono)}.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}.container{max-width:var(--content-width);margin-inline:auto;padding-inline:var(--space-md)}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);min-height:var(--touch-target-min);padding:var(--space-sm) var(--space-lg);border:none;border-radius:var(--radius-md);font-weight:600;font-size:var(--font-size-base);text-decoration:none;cursor:pointer;transition:background-color .15s ease,box-shadow .15s ease,transform .15s ease,border-color .15s ease,color .15s ease;box-shadow:var(--shadow-sm)}.button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.button-primary{background:var(--color-primary);color:#fff}.button-primary:hover:not(:disabled){background:var(--color-primary-dark);box-shadow:var(--shadow-md)}.button-secondary{background:var(--color-surface);color:var(--color-text);border:2px solid var(--color-border)}.button-secondary:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.button-small{min-height:36px;padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm)}.button-large{min-height:52px;padding:var(--space-md) var(--space-xl);font-size:var(--font-size-lg)}.button-danger{background:var(--color-error);color:var(--color-surface)}.button-danger:hover:not(:disabled){background:#a30018;background:oklch(45% .2 25);box-shadow:var(--shadow-md)}.decks-page{max-width:var(--content-width);margin:0 auto;padding:var(--space-xl) var(--space-md)}.page-header{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-xl)}.page-header h1{margin:0}.header-actions{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.header-actions .button{flex:1 1 auto}@media(min-width:768px){.page-header{flex-direction:row;justify-content:space-between;align-items:center}.header-actions .button{flex:0 0 auto}}.empty-state{text-align:center;padding:var(--space-xl) var(--space-md);color:var(--color-text-muted)}@media(min-width:768px){.empty-state{padding:var(--space-2xl)}}.empty-state p{margin:var(--space-sm) 0;font-size:1.1rem}.empty-state-actions{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:var(--space-lg)}@media(min-width:768px){.empty-state-actions{flex-direction:row;justify-content:center;gap:var(--space-md)}}.empty-state .button-primary{margin-top:var(--space-lg)}.deck-list{display:grid;gap:var(--space-md)}.deck-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all .2s;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);overflow:hidden}.deck-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md)}.deck-main{padding:var(--space-lg);display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-md);flex-grow:1}.deck-link{text-decoration:none;color:inherit;flex-grow:1;min-width:0}.decks-page .deck-actions{flex-shrink:0}.decks-page .deck-actions .button{width:70px}.deck-header-row{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm)}.deck-card h2{margin:0;font-size:1.25rem;color:var(--color-text)}.indicator-dot{width:10px;height:10px;background-color:var(--color-warning);border-radius:50%;flex-shrink:0}.deck-description{margin:0;color:var(--color-text-muted)}.deck-stats{padding:var(--space-sm) var(--space-lg);background:var(--color-surface-variant);border-top:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:var(--space-md);font-size:.875rem;color:var(--color-text-muted)}.stat{display:flex;gap:.25em;align-items:center}.stat.due{color:var(--color-warning)}.stat.new{color:var(--color-primary)}.deck-detail-page{max-width:var(--content-width);margin:0 auto;padding:var(--space-xl) var(--space-md)}.breadcrumb{margin-bottom:var(--space-lg)}.breadcrumb a{color:var(--color-text-muted);text-decoration:none;transition:color .2s}.breadcrumb a:hover{color:var(--color-primary)}.deck-header{display:flex;flex-direction:column;gap:var(--space-lg);margin-bottom:var(--space-2xl);padding-bottom:var(--space-xl);border-bottom:1px solid var(--color-border)}.deck-info h1{margin:0 0 var(--space-sm) 0}.deck-info .deck-description{margin:0 0 var(--space-md) 0;color:var(--color-text-muted);max-width:65ch}.deck-info .deck-meta{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-lg);font-size:.875rem;color:var(--color-text-muted)}.study-stats{margin-top:var(--space-lg);background:var(--color-surface-variant);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md)}.study-stats h3{margin:0 0 var(--space-sm) 0;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted)}.study-stats ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--space-lg)}.study-stats li{display:flex;align-items:center;gap:var(--space-xs);font-size:.875rem}.study-stats .count{font-weight:700;font-size:1.125rem}.study-stats .count.new{color:var(--color-primary)}.study-stats .count.due{color:var(--color-warning)}.study-stats .count.learning{color:var(--color-info)}.study-stats .count.learned{color:var(--color-success)}.next-review{margin:var(--space-md) 0 0 0;font-size:.875rem;color:var(--color-text-muted)}.deck-detail-page .deck-actions{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.deck-detail-page .deck-actions .button{flex:1 1 calc(50% - var(--space-sm))}@media(min-width:768px){.deck-detail-page .deck-actions{gap:var(--space-md)}.deck-detail-page .deck-actions .button{flex:0 0 auto}}.cards-section{margin-top:var(--space-2xl)}.section-header{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.section-header h2{margin:0}.section-actions{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.section-actions .button{flex:1 1 auto}@media(min-width:768px){.section-header{flex-direction:row;justify-content:space-between;align-items:center}.section-actions .button{flex:0 0 auto}}.modal-overlay{position:fixed;inset:0;background:color-mix(in oklch,var(--color-text) 50%,transparent);display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-xl);max-width:500px;width:90%}.modal h2{margin:0 0 var(--space-md) 0}.modal p{margin:0 0 var(--space-xl) 0;color:var(--color-text-muted)}.modal-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.modal-actions form{display:inline}.cards-list{display:flex;flex-direction:column;gap:var(--space-md)}.card-item{display:flex;gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color .2s}.card-item:hover{border-color:var(--color-primary)}.card-number{flex-shrink:0;color:var(--color-text-muted);font-weight:500}.card-content{flex:1;display:flex;flex-direction:column;gap:var(--space-sm)}.card-front{font-weight:500}.card-back{color:var(--color-text-muted);font-size:.875rem;white-space:pre-wrap}.card-actions{flex-shrink:0;display:flex;align-items:flex-start}.button-small{padding:var(--space-xs) var(--space-sm);font-size:.875rem}.form-page{max-width:var(--content-width);margin:0 auto;padding:var(--space-xl) var(--space-md)}.form-header{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-xl)}.form-header h1{margin:0}@media(min-width:768px){.form-header{flex-direction:row;justify-content:space-between;align-items:center}}.deck-form{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-xl)}.form-field{margin-bottom:var(--space-lg)}.form-field:last-of-type{margin-bottom:var(--space-xl)}.form-field label{display:block;margin-bottom:var(--space-sm);font-weight:500;color:var(--color-text)}.required{color:var(--color-primary)}.form-field input[type=text],.form-field input[type=number],.form-field textarea{width:100%;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:1rem;background:var(--color-surface);color:var(--color-text);transition:border-color .2s}.form-field input[type=text]:focus,.form-field input[type=number]:focus,.form-field textarea:focus{outline:none;border-color:var(--color-border-focus)}.form-field textarea{resize:vertical;min-height:100px}.form-actions{display:flex;flex-wrap:wrap;gap:var(--space-sm);justify-content:stretch}.form-actions .button{flex:1 1 auto}@media(min-width:768px){.form-actions{gap:var(--space-md);justify-content:flex-end}.form-actions .button{flex:0 0 auto}}.error-message{padding:var(--space-md);background:color-mix(in oklch,var(--color-error) 10%,transparent);border:1px solid var(--color-error);border-radius:var(--radius-sm);color:var(--color-error);margin-bottom:var(--space-lg)}
