:root{--accent:#8fbc8f;--accent-strong:#477a59;--accent-wash:#e8f1e9;--neutral:#dce4df;--neutral-dark:#66746c;--ink:#17211b;--paper:#f6f8f6;--surface:#fbfcfb;--radius:28px}*{box-sizing:border-box}html{background:var(--paper);color:var(--ink);font-variant-numeric:tabular-nums;word-break:keep-all;font-family:Pretendard,Apple SD Gothic Neo,Noto Sans KR,sans-serif}body{background:var(--paper);min-width:320px;min-height:100vh;margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 70%, transparent);outline-offset:4px}.shell{width:min(1180px,100% - 48px);margin-inline:auto}.public-header,.library-header{z-index:3;justify-content:space-between;align-items:center;min-height:104px;display:flex;position:relative}.brand{align-items:center;gap:12px;min-height:44px;padding-block:5px;display:inline-flex}.brand-network{width:42px;height:34px;display:inline-block;position:relative}.brand-network:before,.brand-network:after{background:var(--accent-strong);content:"";transform-origin:0;width:25px;height:1px;position:absolute;left:9px}.brand-network:before{top:9px;transform:rotate(28deg)}.brand-network:after{bottom:9px;transform:rotate(-28deg)}.brand-network i{z-index:1;border:2px solid var(--accent-strong);background:var(--paper);border-radius:50%;width:9px;height:9px;position:absolute}.brand-network i:first-child{top:2px;left:3px}.brand-network i:nth-child(2){bottom:2px;left:3px}.brand-network i:nth-child(3){background:var(--accent);width:11px;height:11px;top:12px;right:1px}.brand>span:last-child{gap:2px;display:grid}.brand strong{letter-spacing:.06em;font-size:1rem}.brand small{color:var(--neutral-dark);letter-spacing:.12em;font-size:.75rem}.header-note{color:var(--neutral-dark);font-size:.9rem}.context-label{color:var(--accent-strong);letter-spacing:.11em;text-transform:uppercase;margin:0 0 18px;font-size:.84rem;font-weight:800}.login-page{background:var(--paper);min-height:100vh;position:relative;overflow:hidden}.ambient-network{opacity:.35;pointer-events:none;width:420px;height:420px;position:absolute;top:104px;right:-90px}.ambient-node{z-index:1;border:2px solid var(--accent);background:var(--paper);border-radius:50%;width:18px;height:18px;position:absolute}.node-a{top:42px;left:50px}.node-b{top:195px;left:7px}.node-c{background:var(--accent);bottom:68px;right:70px}.ambient-edge{background:var(--accent);transform-origin:0;height:1px;position:absolute}.edge-a{width:305px;top:58px;left:66px;transform:rotate(43deg)}.edge-b{width:315px;top:207px;left:24px;transform:rotate(20deg)}.login-stage{z-index:2;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);align-items:center;gap:clamp(48px,8vw,112px);min-height:calc(100vh - 204px);padding-block:64px 92px;display:grid;position:relative}.login-copy h1,.identity-required h1,.library-intro h1{letter-spacing:-.055em;margin:0;font-size:clamp(3rem,6vw,5.6rem);line-height:.98}.login-lead{max-width:580px;color:var(--neutral-dark);margin:30px 0 34px;font-size:1.125rem;line-height:1.72}.auth-action{width:min(100%,400px)}.google-id-button{align-items:center;width:100%;min-height:44px;transition:opacity .14s;display:flex}.google-id-button>div{max-width:100%}.google-id-button[data-pending=true]{opacity:.7;pointer-events:none}.google-button-placeholder{background:var(--ink);width:100%;min-height:44px;color:var(--surface);border:0;border-radius:999px;place-items:center;font-size:.95rem;font-weight:700;display:grid}.google-login-status,.google-config-error{color:var(--neutral-dark);margin:12px 0 0;font-size:.9rem;line-height:1.6}.google-config-error{color:#9b3a34}.logout-button:disabled{cursor:wait;opacity:.7}.auth-error{color:#9b3a34;margin:12px 0 0;font-size:.9rem;line-height:1.6}.privacy-note{color:var(--neutral-dark);margin:18px 0 0;font-size:.875rem;line-height:1.6}.login-visual{margin:0;position:relative}.login-visual-link{gap:22px;display:grid}.login-visual-media{border-radius:var(--radius);background:var(--accent-wash);display:block;overflow:hidden}.login-visual img{object-fit:cover;width:100%;height:auto;transition:opacity .18s,transform .24s;display:block}.login-visual-link:hover img{opacity:.9;transform:scale(1.015)}.login-visual-caption{color:var(--neutral-dark);justify-content:space-between;align-items:flex-end;gap:24px;padding-inline:6px;display:flex}.login-visual-caption>span:first-child{gap:6px;display:grid}.login-visual-caption small{color:var(--accent-strong);font-size:.875rem;font-weight:750}.login-visual-caption strong{color:var(--ink);font-size:1.25rem;line-height:1.35}.login-visual-caption>span:last-child{font-size:.95rem;font-weight:750}.public-footer,.library-footer{z-index:2;min-height:92px;color:var(--neutral-dark);justify-content:space-between;align-items:center;font-size:.86rem;display:flex;position:relative}.identity-required{flex-direction:column;justify-content:center;max-width:760px;min-height:calc(100vh - 92px);padding-block:80px;display:flex}.identity-required h1{font-size:clamp(2.8rem,7vw,5rem)}.identity-required>p:not(.context-label){max-width:600px;color:var(--neutral-dark);margin:28px 0 34px;font-size:1.02rem;line-height:1.8}.identity-marker{justify-content:space-between;width:176px;margin-bottom:36px;display:flex;position:relative}.identity-marker:before{background:var(--accent);content:"";height:1px;position:absolute;top:11px;left:12px;right:12px}.identity-marker span{z-index:1;border:2px solid var(--accent-strong);background:var(--paper);border-radius:50%;width:23px;height:23px;position:relative}.identity-marker span:last-child{background:var(--accent)}.library-page,.course-detail-page{background:var(--paper);min-height:100vh}.account-line{color:var(--neutral-dark);align-items:center;gap:20px;font-size:.9rem;display:flex}.logout-button{border-radius:var(--radius);background:var(--accent-wash);min-height:44px;color:var(--ink);cursor:pointer;border:0;padding:0 18px}.logout-button:hover:not(:disabled){background:color-mix(in srgb, var(--accent) 34%, var(--paper))}.library-main{padding-block:68px 112px}.library-intro{grid-template-columns:minmax(280px,.82fr) minmax(320px,1.18fr);align-items:end;padding-bottom:8px;display:grid}.library-intro .context-label{grid-column:1/-1}.library-intro h1{font-size:clamp(3.5rem,6vw,5.3rem)}.library-intro>p:last-child{max-width:580px;color:var(--neutral-dark);justify-self:end;margin:0 0 8px;font-size:1.125rem;line-height:1.72}.course-catalog{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;padding-top:64px;display:grid}.course-catalog-entry{min-width:0}.course-catalog-entry:only-child{grid-column:1/-1}.course-catalog-link{border-radius:var(--radius);background:var(--ink);min-height:100%;color:var(--surface);flex-direction:column;display:flex;overflow:hidden}.course-catalog-entry:only-child .course-catalog-link{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);min-height:580px;display:grid}.course-media-art{aspect-ratio:16/10;background:var(--accent-wash);display:block;position:relative;overflow:hidden}.course-catalog-entry:only-child .course-media-art{aspect-ratio:auto;min-height:580px}.course-media-art img{object-fit:cover;object-position:center;transition:opacity .18s}.course-catalog-link:hover .course-media-art img{opacity:.86}.course-media-fallback{width:100%;height:100%;color:var(--accent-strong);letter-spacing:-.08em;place-items:center;font-size:clamp(4rem,10vw,8rem);font-weight:800;display:grid}.course-media-body{flex-direction:column;min-width:0;min-height:340px;padding:34px;display:flex}.course-catalog-entry:only-child .course-media-body{min-height:580px;padding:clamp(44px,5vw,72px)}.course-media-heading{gap:16px;display:grid}.course-media-heading>span{color:var(--accent);font-size:1rem;font-weight:800}.course-media-heading>strong{letter-spacing:-.055em;font-size:clamp(2.75rem,4vw,4rem);line-height:1.08}.course-media-heading>small{color:var(--neutral);font-size:1.125rem;line-height:1.7}.course-media-meta{color:var(--neutral);flex-wrap:wrap;gap:10px 0;margin-top:30px;font-size:1rem;font-weight:700;display:flex}.course-media-meta span+span:before{color:var(--neutral-dark);content:"/";margin-inline:12px}.course-media-footer{justify-content:space-between;align-items:flex-end;gap:26px;margin-top:auto;padding-top:48px;display:flex}.course-media-progress{width:min(100%,300px);color:var(--neutral);gap:12px;font-size:.9375rem;font-weight:700;display:grid}.course-media-progress progress{appearance:none;background:color-mix(in srgb, var(--surface) 22%, transparent);border:0;border-radius:0;width:100%;height:6px;overflow:hidden}.course-media-progress progress::-webkit-progress-bar{background:color-mix(in srgb, var(--surface) 22%, transparent)}.course-media-progress progress::-webkit-progress-value{background:var(--accent)}.course-media-progress progress::-moz-progress-bar{background:var(--accent)}.course-media-action{background:var(--accent);border-radius:50%;flex:0 0 58px;place-items:center;width:58px;height:58px;transition:background-color .14s;display:grid}.course-media-action i{border-top:8px solid #0000;border-bottom:8px solid #0000;border-left:13px solid var(--ink);width:0;height:0;margin-left:4px}.learning-context-nav{box-shadow:inset 0 -1px var(--neutral);grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:clamp(32px,5vw,72px);padding:18px 0 28px;display:grid}.learning-context-path{--learning-step-gap:clamp(24px, 4vw, 52px);gap:var(--learning-step-gap);grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;margin:0;padding:0;list-style:none;display:grid}.learning-context-nav.has-lesson .learning-context-path{grid-template-columns:repeat(3,minmax(0,1fr))}.learning-context-step{min-width:0;position:relative}.learning-context-step:not(:last-child):after{top:7px;right:calc(-1 * var(--learning-step-gap));background:var(--accent);content:"";height:1px;position:absolute;left:10px}.learning-context-node{z-index:1;border:2px solid var(--paper);background:var(--accent);outline:1px solid var(--accent-strong);border-radius:50%;width:11px;height:11px;position:absolute;top:2px;left:1px}.learning-context-step-link{align-content:end;gap:3px;min-width:0;min-height:58px;padding-top:22px;display:grid}.learning-context-step-link>span{color:var(--neutral-dark);letter-spacing:.06em;font-size:.74rem;font-weight:750}.learning-context-step-link>strong{text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;line-height:1.4;overflow:hidden}.learning-context-step-link:hover>strong,.learning-context-step-link[aria-current=page]>strong{color:var(--accent-strong)}.learning-context-step:has(.learning-context-step-link[aria-current=page]) .learning-context-node{background:var(--ink);outline-color:var(--ink);width:13px;height:13px;top:1px;left:0}.learning-context-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px 22px;display:flex}.learning-context-action{border-bottom:2px solid var(--accent-strong);min-height:44px;color:var(--ink);align-items:center;padding:0 2px;font-size:.88rem;font-weight:750;display:inline-flex}.learning-context-action:hover{color:var(--accent-strong)}.course-catalog-link:hover .course-media-action{background:var(--surface)}.course-detail-main{padding-block:42px 116px}.catalog-back{min-height:44px;color:var(--neutral-dark);align-items:center;margin-bottom:42px;font-size:.95rem;font-weight:750;display:inline-flex}.catalog-back:hover{color:var(--ink)}.system-actions{align-items:center;gap:24px;display:flex}.system-actions .catalog-back{margin:0}.course-detail-intro{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:clamp(54px,8vw,110px);padding-block:34px 70px;display:grid}.course-provider{color:var(--accent-strong);letter-spacing:.08em;margin:0 0 18px;font-size:.9rem;font-weight:800}.course-detail-copy h1{letter-spacing:-.06em;margin:0;font-size:clamp(3.6rem,7vw,6.8rem);line-height:.98}.course-detail-copy>p:last-child{max-width:680px;color:var(--neutral-dark);margin:28px 0 0;font-size:1.125rem;line-height:1.78}.course-detail-meta{align-self:end;gap:24px;margin:0;display:grid}.course-detail-meta div{grid-template-columns:96px minmax(0,1fr);gap:16px;display:grid}.course-detail-meta dt{color:var(--neutral-dark);font-size:.875rem;font-weight:700}.course-detail-meta dd{margin:0;font-size:1rem;font-weight:750}.course-curriculum{grid-template-columns:minmax(210px,.42fr) minmax(0,1.58fr);gap:clamp(46px,7vw,92px);padding-top:80px;display:grid}.curriculum-heading h2{letter-spacing:-.045em;margin:0;font-size:clamp(2.1rem,3.7vw,3.6rem);line-height:1.04}.curriculum-heading>p:last-child{max-width:260px;color:var(--neutral-dark);margin:22px 0 0;font-size:1rem;line-height:1.7}.lesson-path{gap:0;margin:0;padding:0 0 0 66px;list-style:none;display:grid;position:relative}.lesson-path:before{background:var(--accent);content:"";width:1px;position:absolute;top:0;bottom:0;left:19px}.lesson{border-bottom:1px solid var(--neutral);position:relative}.lesson:first-child{border-top:1px solid var(--neutral)}.lesson-node{z-index:1;border:3px solid var(--paper);background:var(--neutral);outline:1px solid var(--neutral-dark);border-radius:50%;width:15px;height:15px;position:absolute;top:50%;left:-54px;transform:translateY(-50%)}.lesson.is-open .lesson-node{background:var(--accent);outline-color:var(--accent-strong)}.lesson-content{grid-template-columns:100px minmax(0,1fr) 100px;align-items:center;gap:24px;min-height:124px;padding:20px 22px;display:grid}a.lesson-content{background:var(--accent-wash);transition:background-color .14s}a.lesson-content:hover{background:color-mix(in srgb, var(--accent) 28%, var(--paper))}.lesson-day{color:var(--neutral-dark);letter-spacing:.09em;font-size:.85rem;font-weight:800}.lesson.is-open .lesson-day{color:var(--accent-strong)}.lesson-copy{gap:7px;min-width:0;display:grid}.lesson-copy strong{text-overflow:ellipsis;white-space:nowrap;font-size:1.15rem;overflow:hidden}.lesson-copy small{color:var(--neutral-dark);text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;line-height:1.55;overflow:hidden}.lesson-state{color:var(--neutral-dark);justify-self:end;font-size:.875rem;font-weight:750}.lesson.is-open .lesson-state{color:var(--ink)}.empty-state{border-radius:var(--radius);background:var(--accent-wash);margin-top:64px;padding:42px}.empty-state h2{margin:0 0 10px;font-size:1.3rem}.empty-state p{color:var(--neutral-dark);margin:0}@media (max-width:900px){.login-stage{grid-template-columns:1fr;gap:58px;padding-top:76px}.login-copy{max-width:680px}.login-visual{width:min(100%,700px)}.ambient-network{opacity:.2}.library-intro,.course-detail-intro,.course-curriculum{grid-template-columns:1fr}.library-intro>p:last-child{justify-self:start;margin-top:24px}.course-catalog{grid-template-columns:1fr;gap:32px}.course-catalog-entry:only-child{grid-column:auto}.course-catalog-entry:only-child .course-catalog-link{min-height:100%;display:flex}.course-catalog-entry:only-child .course-media-art{aspect-ratio:16/10;min-height:0}.course-catalog-entry:only-child .course-media-body{min-height:340px;padding:34px}.course-detail-intro,.course-curriculum{gap:46px}.learning-context-nav{grid-template-columns:1fr;gap:16px}.learning-context-actions{justify-content:flex-start}.curriculum-heading>p:last-child{max-width:520px}}@media (max-width:640px){.shell{width:min(100% - 32px,1180px)}.public-header,.library-header{min-height:78px}.brand-network{transform-origin:0;width:36px;transform:scale(.88)}.brand strong{font-size:.9rem}.brand small,.header-note,.account-line>span{display:none}.login-stage{min-height:auto;padding-block:62px 72px}.login-copy h1,.identity-required h1{font-size:clamp(2.35rem,11vw,3.4rem);line-height:1.02}.login-lead{margin-top:24px;font-size:1.05rem}.auth-action{width:100%}.login-visual-caption{flex-direction:column;align-items:flex-start;gap:12px;padding-inline:2px}.public-footer,.library-footer{flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;min-height:96px}.library-main{padding-block:54px 80px}.library-intro{padding-bottom:38px}.library-intro h1{font-size:3.6rem}.course-catalog{gap:24px;padding-top:46px}.course-media-body,.course-catalog-entry:only-child .course-media-body{min-height:320px;padding:26px}.course-media-heading{gap:13px}.course-media-heading>strong{font-size:clamp(2.35rem,12vw,3.15rem)}.course-media-heading>small{font-size:1.05rem}.course-media-meta{margin-top:24px;font-size:1rem}.course-media-meta span+span:before{margin-inline:8px}.course-media-footer{gap:18px;padding-top:38px}.course-media-action{flex-basis:52px;width:52px;height:52px}.course-detail-main{padding-block:30px 80px}.learning-context-nav{gap:12px;padding:10px 0 22px}.learning-context-path,.learning-context-nav.has-lesson .learning-context-path{grid-template-columns:1fr;gap:0;display:grid}.learning-context-step{min-height:54px}.learning-context-step:not(:last-child):after{width:1px;height:auto;inset:14px auto -14px 6px}.learning-context-node{top:9px;left:1px}.learning-context-step:has(.learning-context-step-link[aria-current=page]) .learning-context-node{top:9px;left:1px}.learning-context-step-link{align-content:start;gap:2px;min-height:54px;padding:4px 0 6px 28px}.learning-context-step-link>strong{white-space:normal}.learning-context-actions{gap:8px 20px;padding-left:28px}.catalog-back{margin-bottom:34px}.course-detail-intro{gap:38px;padding-block:42px 48px}.course-detail-copy h1{font-size:clamp(3rem,15vw,4.2rem)}.course-detail-copy>p:last-child{font-size:1.05rem}.course-detail-meta div{grid-template-columns:88px minmax(0,1fr)}.course-curriculum{gap:34px;padding-top:58px}.lesson-path{padding-left:42px}.lesson-path:before{left:10px}.lesson-node{left:-38px}.lesson-content{grid-template-columns:1fr auto;gap:8px 16px;min-height:132px;padding:22px 8px 22px 12px}.lesson-day{grid-column:1/-1}.lesson-copy strong,.lesson-copy small{white-space:normal}.lesson-copy small{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.lesson-state{align-self:start;padding-top:2px}.empty-state{padding-left:42px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
