:root{font-size:calc(100% * var(--font-scale, 1));font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,sans-serif;color:#19313b;background:#f7f5ef;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #19313b;--ink-muted: #60727a;--ink-faint: #60727a;--paper: #fffefa;--paper-warm: #f7f5ef;--line: #dfe6e1;--teal: #176b63;--teal-dark: #0e4c48;--teal-soft: #e4f0eb;--coral: #bd644c;--coral-soft: #f8e9e1;--coral-ink: #8f4232;--control-line: #7b8e86;--shadow-soft: 0 10px 28px rgba(25, 49, 59, .06)}*{box-sizing:border-box}html{min-width:320px;background:var(--paper-warm)}body{margin:0;min-width:320px;min-height:100vh;background:var(--paper-warm)}button,input,select{font:inherit}button{touch-action:manipulation}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.app-shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;overflow-wrap:anywhere}.app-header{border-bottom:1px solid var(--line);background:#fffefae0}.header-inner,.main-content,.app-footer{width:min(100% - 32px,1080px);margin:0 auto}.header-inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:760;letter-spacing:-.03em}.brand-mark{width:34px;height:34px;display:inline-grid;place-items:center;color:var(--paper);background:var(--teal);border-radius:10px 10px 10px 3px}.header-context{color:var(--ink-faint);font-size:.8125rem}.main-content{flex:1;padding:48px 0 72px;outline:none}.page-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.eyebrow,.section-label,.caution-label{margin:0;color:var(--teal);font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}h1,h2,p{margin-top:0}.page-intro h1{margin:0 0 8px;color:var(--ink);font-size:2rem;line-height:1.25;letter-spacing:-.04em;text-wrap:balance}.intro-copy{max-width:540px;margin-bottom:0;color:var(--ink-muted);font-size:1.125rem;line-height:1.65}.intro-count{min-width:92px;padding:16px 18px;border-left:2px solid var(--coral);color:var(--ink)}.intro-count span{display:block;font-size:2.5rem;line-height:1;font-weight:760;letter-spacing:-.06em}.intro-count small{display:block;margin-top:7px;color:var(--ink-muted);font-size:.8125rem}.notice-banner{display:flex;gap:14px;align-items:flex-start;padding:17px 20px;margin-bottom:28px;border:1px solid #ead6c3;border-radius:12px;background:#fff8ee}.notice-dot{flex:0 0 auto;width:10px;height:10px;margin-top:5px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px #f8e8d6}.notice-banner strong{display:block;color:#7f432e;font-size:.875rem}.notice-banner p{margin:5px 0 0;color:#8d6759;font-size:.875rem;line-height:1.55}.list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.search-field{display:flex;align-items:center;gap:10px;width:min(100%,440px);min-height:48px;padding:0 15px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink-muted);transition:border-color .18s ease,box-shadow .18s ease}.search-field:focus-within{border-color:var(--teal);box-shadow:0 0 0 3px #176b631f}.search-field input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:1rem}.search-field input::placeholder{color:var(--ink-faint)}.search-field input::-webkit-search-cancel-button{cursor:pointer}.result-count{color:var(--ink-muted);font-size:.875rem;white-space:nowrap}.concept-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}.concept-list li{min-width:0}.concept-card{width:100%;position:relative;display:flex;min-height:222px;flex-direction:column;align-items:stretch;padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);text-align:left;box-shadow:var(--shadow-soft);cursor:pointer;animation:card-enter .28s ease-out both;animation-delay:calc(var(--card-index) * 55ms);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.concept-card:before{position:absolute;inset:0 auto 0 0;width:4px;border-radius:12px 0 0 12px;background:var(--teal);content:"";opacity:0;transition:opacity .18s ease}.concept-card:hover{border-color:#a9c8c1;box-shadow:0 15px 30px #19313b1a;transform:translateY(-2px)}.concept-card:hover:before,.concept-card:focus-visible:before{opacity:1}.card-topline,.card-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.card-topline{color:var(--ink-faint);font-size:.75rem}.status-pill{display:inline-flex;align-items:center;min-height:25px;padding:4px 9px;border-radius:999px;background:var(--teal-soft);color:var(--teal-dark);font-size:.6875rem;font-weight:800;letter-spacing:.02em;white-space:nowrap}.status-pill-large{min-height:32px;padding:7px 12px;font-size:.75rem}.concept-card-title{margin:24px 0 9px;font-size:1.3125rem;font-weight:760;line-height:1.28;letter-spacing:-.04em}.concept-card-summary{color:var(--ink-muted);font-size:1rem;line-height:1.6}.card-footer{margin-top:auto;padding-top:22px;color:var(--ink-faint);font-size:.75rem}.card-action{display:inline-flex;align-items:center;gap:3px;color:var(--teal);font-weight:760}.empty-state,.error-state{padding:64px 24px;border:1px dashed #bdcbc5;border-radius:12px;background:#fffefa94;text-align:center}.empty-icon{width:56px;height:56px;display:grid;place-items:center;margin:0 auto 17px;border-radius:50%;background:var(--teal-soft);color:var(--teal)}.empty-state h2{margin-bottom:8px;font-size:1.375rem;letter-spacing:-.04em}.empty-state p{margin-bottom:20px;color:var(--ink-muted);font-size:1rem;line-height:1.6}.button{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 15px;border:1px solid transparent;border-radius:9px;font-size:.9375rem;font-weight:750;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}.button:not(:disabled):active{transform:scale(.98)}.button:disabled{cursor:not-allowed;opacity:.52}.button-primary{background:var(--teal);color:var(--paper)}.button-primary:not(:disabled):hover{background:var(--teal-dark)}.button-secondary{border-color:var(--line);background:var(--paper);color:var(--ink)}.button-secondary:not(:disabled):hover{border-color:#a7beb7;background:#f9fcfa}.back-button{min-height:44px;display:inline-flex;align-items:center;gap:7px;margin-bottom:20px;padding:8px 4px;border:0;background:transparent;color:var(--teal-dark);font-size:.9375rem;font-weight:760;cursor:pointer}.back-button:hover{color:var(--coral)}.detail-card{padding:clamp(22px,5vw,48px);border:1px solid var(--line);border-radius:14px;background:var(--paper);box-shadow:var(--shadow-soft)}.detail-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:30px;border-bottom:1px solid var(--line)}.detail-heading h1{max-width:720px;margin:10px 0 0;font-size:clamp(1.875rem,calc(4.5vw * var(--font-scale, 1)),3rem);line-height:1.15;letter-spacing:-.06em}.summary-block{padding:28px 0 4px}.summary-block p{max-width:700px;margin:9px 0 0;color:var(--teal-dark);font-size:clamp(1.25rem,calc(3vw * var(--font-scale, 1)),1.6875rem);line-height:1.45;font-weight:650;letter-spacing:-.04em}.detail-section{max-width:700px;padding:28px 0 8px}.detail-section h2{margin-bottom:14px;font-size:1.125rem;letter-spacing:-.03em}.explanation-copy p{margin-bottom:12px;color:var(--ink-muted);font-size:1.125rem;line-height:1.75}.explanation-copy p:last-child{margin-bottom:0}.caution-block{max-width:700px;padding:18px 20px;margin:26px 0 32px;border-left:3px solid var(--coral);background:var(--coral-soft)}.caution-block p{margin:6px 0 0;color:#75483d;font-size:1rem;line-height:1.65}.caution-label{color:var(--coral)}.detail-divider{height:1px;background:var(--line)}.detail-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:24px 0}.detail-meta div{display:flex;flex-direction:column;gap:6px}.detail-meta span{color:var(--ink-faint);font-size:.75rem}.detail-meta strong{color:var(--ink);font-size:.875rem;line-height:1.45}.source-note{display:flex;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:9px;background:#f7faf7;color:var(--teal)}.source-note>div{min-width:0}.source-note details{margin-top:8px;overflow-wrap:anywhere}.source-note summary{min-height:44px;display:list-item;padding:12px 0;cursor:pointer;font-size:.875rem}.page-intro>div:first-child{min-width:0}.source-note strong{display:block;color:var(--teal-dark);font-size:.8125rem}.source-note p,.source-note span{display:block;margin:3px 0 0;color:var(--ink-muted);font-size:.75rem;line-height:1.5}.detail-actions{display:flex;flex-wrap:wrap;gap:10px;padding-top:24px}.detail-actions .button span{color:inherit;font-size:.6875rem;font-weight:600;opacity:.8}.error-state{max-width:720px;margin:40px auto;border-color:#e1bdb3;background:#fff7f4;text-align:left}.error-mark{width:34px;height:34px;display:grid;place-items:center;margin-bottom:17px;border-radius:50%;background:var(--coral);color:#fff;font-weight:800}.error-state h1{margin-bottom:10px;font-size:1.75rem;letter-spacing:-.05em}.error-state>p{color:var(--ink-muted);font-size:1rem;line-height:1.6}.error-state summary{color:var(--coral);font-size:.875rem;font-weight:700;cursor:pointer}.error-state ul{margin:12px 0 0;padding-left:20px;color:var(--ink-muted);font-size:.8125rem;line-height:1.6}.app-footer{display:flex;justify-content:space-between;gap:16px;padding:18px 0 28px;color:var(--ink-faint);font-size:.75rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes card-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}[hidden]{display:none!important}.resume-practice,.study-actions{margin-bottom:24px}.study-action-buttons{display:flex;flex-wrap:wrap;gap:8px}.study-action-buttons .button{flex:0 1 auto}.study-action-help{margin:8px 0 0;font-size:.875rem;color:var(--ink-muted);line-height:1.6}.continue-concept{margin-bottom:12px;text-align:left}.concept-list+.progress-panel,.empty-state+.progress-panel{margin-top:32px}.practice-card{max-width:720px;margin:0 auto;padding:24px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.practice-card h1{margin:12px 0;font-size:1.75rem;line-height:1.35;letter-spacing:-.04em}.practice-card h1:focus{outline:none}.practice-concept,.practice-help{color:var(--ink-muted);line-height:1.6}.practice-concept{font-size:1rem}.practice-help{font-size:.875rem;margin:12px 0}.cloze-sentence{padding:24px 0;margin:0 0 16px;font-size:1.375rem;line-height:1.8;overflow-wrap:anywhere}.cloze-blank{color:var(--teal);font-weight:800;padding:0 8px}.answer-label{display:block;margin-bottom:8px;font-size:1rem;font-weight:700}.answer-input{width:100%;min-height:48px;border:1px solid var(--ink-muted);border-radius:8px;padding:12px;background:var(--paper);color:var(--ink);font-size:1.125rem}.answer-input:disabled{background:var(--paper-warm);opacity:1;-webkit-text-fill-color:var(--ink)}.answer-error{color:#8f362c;font-size:1rem;line-height:1.6}.practice-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.practice-actions>.button{flex:1 1 120px}.practice-navigation{border-top:1px solid var(--line);padding-top:20px;margin-top:24px}.answer-result{margin-top:24px;padding:20px;background:var(--teal-soft);border-left:4px solid var(--teal);border-radius:4px;overflow-wrap:anywhere}.answer-result:focus{outline:2px solid var(--teal);outline-offset:3px}.answer-result h2{font-size:1.375rem;margin:0 0 12px}.answer-result h3{font-size:1.125rem;margin:20px 0 8px}.answer-result p{font-size:1.125rem;line-height:1.65;margin-bottom:12px}.result-incorrect{background:var(--coral-soft);border-color:var(--coral)}.result-revealed{background:var(--paper-warm);border-color:var(--ink-muted)}.practice-metadata{margin-top:24px;font-size:.875rem;color:var(--ink-muted);line-height:1.6}.practice-metadata summary{min-height:44px;padding:12px 0;cursor:pointer}.progress-panel,.storage-notice{border:1px solid var(--line);padding:20px;margin-bottom:24px;border-radius:8px;background:var(--paper);overflow-wrap:anywhere}.progress-panel summary{min-height:44px;padding:12px 0;cursor:pointer;font-weight:700}.progress-panel h2{font-size:1.375rem;margin-top:24px}.progress-panel p,.storage-notice p{line-height:1.7}.progress-panel input{max-width:100%;min-height:44px;font:inherit}.backup-label{display:block;margin:20px 0 8px}.backup-preview{border:1px solid var(--teal);padding:16px;margin-top:20px}.backup-preview .button,.storage-notice .button{margin:8px 8px 0 0}.storage-notice{background:var(--coral-soft)}.recent-results{padding:0;list-style:none}.offline-panel li{line-height:1.7;margin-block:12px}.offline-version{color:var(--ink-muted);font-size:.875rem}.offline-panel .button[aria-disabled=true]{opacity:.6;cursor:wait}.recent-results li{display:flex;flex-direction:column;gap:8px;padding:16px 0;border-bottom:1px solid var(--line)}.practice-card h1{word-break:keep-all;overflow-wrap:anywhere}@media(max-width:767px){.header-inner,.main-content,.app-footer{width:min(100% - 28px,1080px)}.header-inner{min-height:60px}.header-context{display:none}.main-content{padding:32px 0 48px}.page-intro{align-items:flex-start;margin-bottom:24px;gap:16px}.intro-copy{font-size:1.0625rem}.intro-count{min-width:44px;padding:10px 0 10px 12px}.intro-count span{font-size:2rem}.concept-list{grid-template-columns:1fr;gap:12px}.concept-card{min-height:204px;padding:19px}.detail-heading{display:block;padding-bottom:22px}.detail-heading .status-pill{margin-top:18px}.detail-meta{grid-template-columns:1fr;gap:13px}.detail-actions{flex-direction:column}.detail-actions .button{width:100%}.app-footer{flex-direction:column;gap:4px}}.font-settings{padding:0 12px;margin-bottom:20px;border:1px solid var(--line);border-radius:8px;background:var(--paper)}.font-settings[open]{padding-bottom:12px}.font-settings summary,.error-state summary{min-height:44px;padding:12px 0;cursor:pointer}.font-settings label{display:block;margin:12px 0 8px}.font-settings select{min-height:48px;max-width:100%;padding:8px;border:1px solid var(--control-line);border-radius:8px;background:var(--paper);color:var(--ink);font-size:1rem}.font-settings p{font-size:.875rem;line-height:1.65;margin:12px 0 0}.font-settings summary:hover,.progress-panel summary:hover{color:var(--teal-dark);background:var(--teal-soft)}.search-field{border-color:var(--control-line)}.search-field input{min-height:46px}.button,.back-button{max-width:100%;min-width:44px;font-size:1rem;white-space:normal;overflow-wrap:anywhere}.progress-panel input::file-selector-button{min-height:44px;font:inherit}.caution-label,.error-state summary,.back-button:hover{color:var(--coral-ink)}.card-topline,.card-footer,.list-toolbar{flex-wrap:wrap}.card-action,.status-pill{white-space:normal}.source-note>svg{flex-shrink:0}input,select,[tabindex="-1"]{scroll-margin-block:24px}.skip-link{position:absolute;left:12px;top:12px;z-index:10;padding:12px 16px;min-height:44px;background:var(--teal);color:var(--paper);transform:translateY(-200%)}.skip-link:focus{transform:none}@media(max-width:767px){.page-intro{flex-wrap:wrap}.page-intro>div:first-child{flex:1 1 240px}.detail-card,.practice-card{padding:20px}.practice-actions>.button{flex-basis:140px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
