:root{--ink:#233d3a;--muted:#627671;--green:#226b54;--paper:#fff;--bg:#f6f8f4;--line:#dde6df;--light:#eaf3eb;--blue:#d9e9ff;--purple:#ece0ff;--orange:#ffe4c1;--verb:#d9f2e3;color-scheme:light;font-family:"Noto Sans TC","Microsoft JhengHei","PingFang TC",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.8}button,input,select,textarea{font:inherit}button,summary,select{cursor:pointer}button,a,input,select,summary,textarea{-webkit-tap-highlight-color:transparent}button{line-height:1.35}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--green);text-underline-offset:4px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #427fcd;outline-offset:4px}[hidden]{display:none!important}.skip{position:fixed;left:12px;top:-100px;background:white;z-index:10;padding:8px}.skip:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.topbar{height:80px;border-bottom:1px solid var(--line);background:#fcfdfb;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;gap:16px}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);font-size:19px;font-weight:800;letter-spacing:.03em;text-decoration:none}.brand-light{font-weight:400;margin-left:8px;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:20px}.test-tag{font-size:12px;letter-spacing:.08em;color:var(--muted)}.button{border:1px solid transparent;border-radius:9px;padding:12px 18px;font-weight:650;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;transition:background .15s}.primary{background:var(--green);color:white}.primary:hover{background:#185540}.secondary{background:white;border-color:var(--line);color:var(--ink)}.secondary:hover{background:var(--light)}.text{background:none;color:var(--green)}.text:hover{background:var(--light)}.small{padding:7px 12px}.icon-button{width:44px;height:44px;background:var(--bg);border:1px solid var(--line);border-radius:50%;font-size:26px;color:var(--ink);flex-shrink:0}
.app-layout{max-width:1480px;margin:auto;display:grid;grid-template-columns:265px minmax(0,1fr);gap:56px;padding:34px 4vw 0}.sidebar{position:sticky;top:22px;align-self:start;max-height:calc(100dvh - 44px);overflow:auto;padding-bottom:25px}.book-label{font-size:12px;letter-spacing:.15em;color:var(--green);font-weight:800}.book-label span{margin-left:12px;font-weight:500;color:var(--muted);letter-spacing:0}.sidebar h2{font-size:22px;line-height:1.5;margin:8px 0 3px}.subtle{color:var(--muted);font-size:13px}.sidebar>.subtle{margin:0 0 28px}.mode-nav{display:grid;gap:6px}.mode-nav button{border:0;background:none;color:var(--muted);border-radius:9px;text-align:left;padding:14px 12px;display:grid;grid-template-columns:24px 1fr;align-items:center;font-size:15px;gap:3px 8px}.mode-nav button>span:first-child{font-size:21px;grid-row:span 2}.mode-nav button[aria-pressed=true]{background:#e6f0e7;color:var(--green);font-weight:800;box-shadow:inset 3px 0 var(--green)}.nav-hint{font-size:11px;font-weight:400;color:var(--muted)}.reading-nav{margin-top:28px;border-top:1px solid var(--line);padding-top:14px}.nav-title{font-size:11px;letter-spacing:.12em;color:var(--muted);margin:0 0 8px}.reading-nav a{display:block;text-decoration:none;font-size:13px;line-height:1.5;padding:8px 10px;border-left:2px solid transparent;color:var(--muted)}.reading-nav a:hover,.reading-nav a[aria-current]{color:var(--green);border-color:var(--green);background:#edf3ec}.sidebar-note{font-size:11px;line-height:1.8;color:var(--muted);border-top:1px solid var(--line);margin-top:24px;padding-top:18px}.dot{display:inline-block;width:6px;height:6px;background:#73a88b;border-radius:50%;margin-right:6px}main{min-width:0;max-width:1000px}.alert{font-size:13px;background:#edf4ed;border:1px solid #d9e7d7;border-radius:9px;padding:10px 15px;margin-bottom:16px;color:#42624d;overflow-wrap:anywhere}.danger{background:#fff4e9;border-color:#ecd3b6;color:#8e4c1d}.reading-meta{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.07em;color:var(--muted);margin:8px 0 16px;gap:12px}.reading-meta span:first-child{font-weight:800;color:var(--green)}
.lesson .sheet{background:white;border:1px solid var(--line);border-radius:16px;margin-bottom:28px;padding:34px 38px;scroll-margin-top:25px;overflow-wrap:anywhere}.lesson .cover{padding:0;border:0;background:none}.lesson .cover>div:last-child{margin:20px 4px 30px}.lesson .hero{background:linear-gradient(120deg,#e8f2e4,#edf4e8 60%,#f5efdf);border:1px solid #d4e2ce;border-radius:18px;padding:42px 38px;position:relative;overflow:hidden}.lesson .hero:after{content:"ㄱ";font-family:"Malgun Gothic",sans-serif;font-size:150px;line-height:1;position:absolute;right:15px;top:8px;opacity:.035;pointer-events:none}.kicker,.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:800;color:var(--green)}h1{font-size:clamp(27px,3vw,42px);line-height:1.4;letter-spacing:-.04em;margin:14px 0;color:#254b3e}.lesson h2{font-size:25px;line-height:1.5;color:#284d45;margin:12px 0 18px}.lesson h3{font-size:18px;color:#306b5f;margin:26px 0 12px}.lead{font-size:18px;color:#586d60;margin:12px 0 20px}p{margin:10px 0 18px}.tag{display:inline-block;font-size:11px;border:1px solid #cddcc9;border-radius:5px;padding:4px 8px;margin:0 6px 6px 0;background:#ffffff70;color:#52714f}.chapter{font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--green);padding-bottom:10px;border-bottom:1px solid var(--line)}.note,.caution,.source,.ext{border-left:3px solid #599780;background:#f1f8f3;border-radius:0 8px 8px 0;padding:14px 18px;font-size:14px;line-height:1.9;margin:20px 0}.caution{border-color:#cb8c4d;background:#fff8ed}.source{border-color:#7f9cc5;background:#f0f5fc}.ext{border-color:#519a75;background:#eff8f1}.hero .note{background:#ffffff80;margin-bottom:0}.g2,.g3{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.card{border:1px solid var(--line);border-radius:10px;background:#f8faf7;padding:16px;font-size:14px}.card small{display:block;font-size:12px;color:var(--muted);margin-top:4px}.card strong{color:#3c607f}.card.orange{background:#fff7ec;border-color:#edddc5}.card.purple{background:#f8f3ff;border-color:#e5dbee}.card.green{background:#eff8f1;border-color:#d5e5d6}.card.purple strong{color:#71578a}.card.green strong{color:#3a745b}.card.orange strong{color:#8a6940}.card.blue{background:#f0f5fc;border-color:#ccdced}.lego{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:22px 0}.tile{padding:12px 16px;border-radius:9px;display:inline-block;font-size:19px;font-weight:750;border:1px solid #00000009;font-family:"Malgun Gothic","Apple SD Gothic Neo","Noto Sans KR",sans-serif;line-height:1.6}.tile small{font-family:"Microsoft JhengHei",sans-serif;display:block;font-size:11px;font-weight:400;color:#4d6362;margin-top:2px}.subject{background:var(--blue);color:#285e96}.obj{background:var(--purple);color:#63438d}.verb{background:var(--verb);color:#23654a}.part{background:#d6eff1;color:#24616a}.time{background:var(--orange);color:#7a4b12}.place{background:#f8e1d1;color:#8b4a24}.arrow{color:#82978c;font-size:21px}.ko{font-family:"Malgun Gothic","Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:1.1em;line-height:1.9}.korean-click{display:inline}.speak-pair{display:inline-flex;gap:2px;vertical-align:middle;margin:2px 0 2px 6px}.speak-pair button{border:1px solid #d5e4da;background:#f8fcf8;color:#326b53;border-radius:6px;min-width:34px;min-height:36px;font:11px "Microsoft JhengHei",sans-serif;padding:4px 6px}.speak-pair button:hover,.speak-pair button[aria-pressed=true]{background:#dceee1;border-color:#80a88d}.tile .speak-pair{display:flex;margin:8px 0 0}.tile .speak-pair button{background:#ffffff80}.table-wrap{width:100%;overflow:auto;margin:20px 0}table{width:100%;border-collapse:collapse;font-size:14px;text-align:left;line-height:1.9}td,th{padding:14px 15px;border:1px solid var(--line);vertical-align:top}th{background:#f0f5f0;font-size:12px;color:#51705e}td:first-child:has(.ko){min-width:38%}.divider{border-top:1px solid var(--line);margin:20px 0}.footnote{color:var(--muted);font-size:12px;line-height:1.9}.q{margin:20px 0;border:1px solid var(--line);border-radius:12px;padding:18px;font-size:16px}.qn{font-weight:800;color:var(--green);margin-right:10px}.line{height:6px}.q textarea{width:100%;min-height:74px;resize:vertical;background:#fafbf8;border:1px solid var(--line);border-radius:7px;padding:12px;font-family:"Malgun Gothic","Microsoft JhengHei",sans-serif;margin:16px 0 6px;font-size:17px}.q details{font-size:14px}.q summary,.answer-bank>summary{color:var(--green);font-size:13px;padding:10px 0;font-weight:700;min-height:44px}.answer-content{padding:14px;background:#f0f7ef;border-radius:8px}.answer-content p{margin:4px 0}.answer-content .ko{font-size:20px}.answer-bank .table-wrap{margin-top:8px}summary{list-style-position:inside}.caption{font-size:12px;color:var(--muted)}ul,ol{padding-left:24px}
.listen-intro{padding:24px 0 18px}.listen-intro h1{margin:8px 0;font-size:35px}.listen-intro p{font-size:14px;color:var(--muted)}.player-card{background:white;border:1px solid var(--line);border-radius:17px;padding:30px;position:relative}.player-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.player-heading label{font-size:13px;font-weight:700}select{width:100%;border:1px solid #cbdacd;border-radius:8px;background:#fff;padding:12px 35px 12px 12px;min-height:46px;color:var(--ink);font-size:14px;text-overflow:ellipsis}label{font-size:14px;font-weight:650}.check-option{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:13px}.check-option input{width:18px;height:18px;accent-color:var(--green)}.micro{font-size:11px;color:var(--muted);line-height:1.8;margin:8px 0;overflow-wrap:anywhere}.now-playing{background:#f2f6ef;border:1px solid #e0e9db;border-radius:12px;padding:24px;margin:22px 0;min-height:220px;display:flex;flex-direction:column;justify-content:center}.now-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;align-items:center;color:var(--muted)}.state-pill{border-radius:20px;background:white;border:1px solid #d2e0cf;padding:3px 9px;font-size:10px;color:var(--green);white-space:nowrap}.current-text{font-size:21px;line-height:1.9;word-break:normal;margin:20px 0;font-family:"Malgun Gothic","Microsoft JhengHei",sans-serif}.current-text:lang(ko){font-size:30px}.silence-display{display:flex;align-items:baseline;gap:16px;color:var(--green)}#silence-count{font:500 40px ui-monospace,monospace;font-variant-numeric:tabular-nums}.silence-display>span:last-child{font-size:12px}.progress-label{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted)}progress{width:100%;height:6px;display:block;margin:12px 0 24px;border:0;border-radius:10px;overflow:hidden;background:#e3eae1;accent-color:var(--green)}progress::-webkit-progress-bar{background:#e3eae1}progress::-webkit-progress-value{background:var(--green)}.transport{display:flex;justify-content:center;gap:12px}.transport .primary{flex:1;max-width:320px}.secondary-transport{justify-content:space-between;margin-top:14px}.secondary-transport button{font-size:12px;padding:10px}.script-panel{margin-top:26px;border:1px solid var(--line);border-radius:12px;background:white}.script-panel>summary{padding:18px 22px;font-size:14px;color:var(--green);font-weight:700}.script-panel>summary .subtle{font-size:11px;margin-left:8px;font-weight:400}#script-list{list-style:none;margin:0;padding:0;max-height:570px;overflow:auto;border-top:1px solid var(--line)}#script-list li+li{border-top:1px solid #edf1e9}#script-list button{width:100%;text-align:left;display:grid;grid-template-columns:28px 1fr;gap:4px 12px;border:0;background:none;color:var(--ink);padding:16px 22px;font-size:14px;line-height:1.8}#script-list .segment-no{grid-row:span 2;font-size:10px;padding-top:3px;color:var(--muted)}#script-list .segment-meta{font-size:10px;color:var(--muted)}#script-list li.current{background:#eaf3e5;box-shadow:inset 3px 0 var(--green)}#script-list li.silence button{font-size:12px;color:var(--muted)}.solo-status{position:sticky;top:12px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid #bad3be;background:#f7fcf5ee;backdrop-filter:blur(8px);box-shadow:0 4px 20px #263b3410;border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:16px}.solo-status span{overflow-wrap:anywhere}.solo-status button{flex-shrink:0}.app-footer{border-top:1px solid var(--line);margin-top:45px;padding:24px 0 35px;color:var(--muted);font-size:11px}.app-footer>span{font-weight:700}.app-footer p{margin:8px 0}dialog{border:1px solid var(--line);border-radius:18px;width:min(570px,calc(100% - 24px));padding:28px;max-height:90dvh;overflow:auto;color:var(--ink);box-shadow:0 20px 80px #18392c30}dialog::backdrop{background:#1d322d66}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.dialog-top h2{font-size:22px;margin:8px 0;line-height:1.5}.voice-field{display:grid;grid-template-columns:1fr auto;gap:8px;margin:22px 0}.voice-field label{grid-column:span 2}.voice-field small{color:var(--muted);font-weight:400;font-size:11px;margin-left:8px}.voice-field select{min-width:0}#rate{margin:10px 0 0}#voice-detail{margin-top:18px}.setting-note{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:16px;line-height:1.9}
.lesson h2 .ko,.lesson h3 .ko{white-space:nowrap}pre{white-space:pre-wrap;overflow-wrap:anywhere}
@media(min-width:1600px){.app-layout{padding-left:50px;padding-right:50px}}@media(max-width:1050px){.app-layout{grid-template-columns:220px minmax(0,1fr);gap:28px;padding:28px 24px 0}.lesson .sheet{padding:28px}.lesson .hero{padding:32px 28px}.brand-light{display:none}.topbar{padding:0 24px}.lesson .g3{grid-template-columns:1fr}.tile{padding:10px 12px;font-size:18px}}
@media(max-width:760px){.topbar{height:68px;padding:0 18px}.brand{font-size:16px;gap:8px}.brand img{width:29px;height:29px}.test-tag{display:none}#open-settings{font-size:12px;padding:10px 12px}.app-layout{display:block;padding:20px 16px 0}.sidebar{position:static;max-height:none;overflow:visible;padding:0}.sidebar h2{font-size:17px;display:inline-block;margin:6px 0 10px}.book-label{font-size:10px}.sidebar>.subtle{font-size:11px;display:inline;margin-left:8px}.mode-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:10px 0 20px;border:1px solid var(--line);border-radius:11px;padding:4px;background:#fff}.mode-nav button{display:flex;justify-content:center;font-size:13px;gap:6px;padding:12px 4px;white-space:nowrap;min-height:46px}.mode-nav button>span:first-child{font-size:16px}.mode-nav button[aria-pressed=true]{box-shadow:none}.nav-hint{display:none}.sidebar-note{display:none}.reading-nav{margin:0 0 18px;padding:0;border:0;display:flex;gap:6px;overflow:auto;scrollbar-width:thin}.nav-title{display:none}.reading-nav a{white-space:nowrap;padding:7px 11px;border:1px solid var(--line);border-radius:6px;font-size:11px;background:white}.reading-meta{font-size:10px;margin-top:4px}.reading-meta span:last-child{max-width:65%;text-align:right}.lesson .sheet{padding:24px 20px;border-radius:12px;margin-bottom:20px;scroll-margin-top:16px}.lesson .hero{padding:28px 23px}.lesson .hero h1{font-size:30px;margin:12px 0}.lead{font-size:15px}.lesson h2{font-size:22px}.lesson h3{font-size:18px}.lesson p{font-size:15px}.lesson .note,.lesson .caution,.lesson .source,.lesson .ext{font-size:14px;padding:12px 14px}.lesson .footnote{font-size:12px}.g2{gap:9px;margin-top:16px!important}.card{padding:12px}.card strong{font-size:13px}.card small{font-size:11px}.lego{gap:6px}.tile{font-size:18px;padding:10px 12px}.tile small{font-size:10px}.arrow{font-size:18px}.lesson table.responsive-table thead{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.lesson table.responsive-table,.lesson table.responsive-table tbody,.lesson table.responsive-table tr,.lesson table.responsive-table td{display:block;width:100%}.lesson table.responsive-table tr{border:1px solid var(--line);border-radius:9px;margin-bottom:12px;overflow:hidden}.lesson table.responsive-table td{border:0;padding:9px 13px;font-size:14px}.lesson table.responsive-table td+td{border-top:1px solid #edf1e9}.lesson table.responsive-table td:before{content:attr(data-label);display:block;font-size:10px;letter-spacing:.04em;color:#748b7c;margin-bottom:3px}.lesson table.responsive-table tr td:first-child{background:#f5f8f2}.lesson table.rule-table th,.lesson table.rule-table td{padding:10px 8px;font-size:13px}.q{padding:15px;font-size:15px}.listen-intro{padding:16px 4px}.listen-intro h1{font-size:29px}.player-card{padding:22px 18px}.player-heading{align-items:start}.player-heading .subtle{font-size:10px}.now-playing{padding:20px 17px;min-height:230px}.current-text{font-size:19px}.current-text:lang(ko){font-size:25px}.transport{gap:7px}.transport .button{padding:12px 13px;font-size:14px}.secondary-transport button{font-size:11px;padding:10px 5px}.progress-label{font-size:9px}.progress-label>span:last-child{max-width:56%;text-align:right}#script-list button{padding:14px 17px;font-size:13px}.script-panel>summary{padding:16px;font-size:13px}.script-panel>summary .subtle{font-size:10px;display:block;margin:6px 0 0 16px}.solo-status{top:8px;font-size:12px;gap:8px}dialog{padding:22px 18px}.dialog-top h2{font-size:20px}.voice-field{grid-template-columns:minmax(0,1fr) auto}.voice-field button{font-size:12px;padding:10px}.silence-display{gap:12px}#silence-count{font-size:36px}.silence-display>span:last-child{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media print{.topbar,.sidebar,.reading-meta,.alert,.solo-status,.app-footer,.speak-pair,dialog{display:none!important}.app-layout{display:block;padding:0}.lesson .sheet{border:0;padding:12px;break-after:page}.q textarea{display:none}.answer-bank:not([open])>*:not(summary){display:block}body{background:white}}