@import "https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap";:root{--ink:#173b43;--accent:#087f83;--ground:#f4f6f3;--soft:#e3eeea;--muted:#556b70;--border:#c8d6d0}*{box-sizing:border-box}body{color:var(--ink);background:var(--ground);margin:0;font-family:Noto Sans KR,-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.75}a{color:inherit;text-decoration:none}button,input{font:inherit}button,.button{min-height:44px;color:var(--ink);background:var(--soft);cursor:pointer;border:0;border-radius:4px;justify-content:center;align-items:center;gap:8px;padding:11px 20px;font-weight:600;line-height:1.5;display:inline-flex}button:hover,.button:hover{filter:brightness(.95)}.primary{color:#fff!important;background:var(--accent)!important}.button:focus-visible{outline-offset:4px;outline:3px solid #d98037}a:focus-visible{outline-offset:4px;outline:3px solid #d98037}button:focus-visible{outline-offset:4px;outline:3px solid #d98037}input:focus-visible{outline-offset:4px;outline:3px solid #d98037}summary:focus-visible{outline-offset:4px;outline:3px solid #d98037}button:disabled{cursor:wait;opacity:.55}.site-header{justify-content:space-between;align-items:center;gap:22px;max-width:1380px;margin:auto;padding:28px 48px;display:flex}.wordmark{letter-spacing:-1px;font-size:27px;font-weight:800}.wordmark span{color:var(--accent);margin-left:6px;font-weight:400}.site-header nav{gap:30px;font-size:14px;display:flex}.site-header nav a:hover{text-decoration:underline}.container{max-width:1284px;min-height:75vh;margin:auto;padding:32px 48px 80px}.page-intro{justify-content:space-between;align-items:center;gap:25px;padding:30px 0 42px;display:flex}.page-intro h1{margin-bottom:15px}.page-intro p{color:var(--muted);margin:0}h1{letter-spacing:-1.8px;margin:0 0 20px;font-size:clamp(34px,4vw,52px);font-weight:750;line-height:1.25}h2{letter-spacing:-.7px;margin:0 0 18px;font-size:25px;line-height:1.45}h3{margin:26px 0 10px;font-size:18px}p{margin:0 0 18px}.greeting{color:var(--accent)!important;margin-bottom:16px!important;font-size:14px!important}.catalog-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:25px;padding:22px 0;display:flex}.search-label{font-size:14px;font-weight:600;display:block}.search-label input{border:1px solid var(--border);background:#fff;border-radius:4px;width:320px;max-width:100%;margin-top:9px;padding:12px 16px;display:block}.filters{flex-wrap:wrap;gap:7px;display:flex}.filters button{background:0 0;min-height:36px;padding:8px 13px;font-size:13px}.filters .selected{background:var(--ink);color:#fff}.result-count{color:var(--muted);margin:15px 0;font-size:13px}.course-list{gap:20px;display:grid}.course-row{background:#fff;border-radius:5px;grid-template-columns:215px 1fr auto;align-items:center;gap:30px;padding:24px;transition:background .2s;display:grid}.course-row:hover{background:#ebf0ed}.course-cover{background:var(--ink);color:#fff;flex-direction:column;justify-content:space-between;align-self:stretch;min-height:200px;padding:26px;display:flex}.course-cover span,.course-cover small{color:#bbdcd2;font-size:13px}.course-cover strong{letter-spacing:-1px;font-size:42px;font-weight:600}.tags{flex-wrap:wrap;gap:9px;margin-bottom:14px;display:flex}.tags span{background:var(--soft);border-radius:3px;padding:3px 8px;font-size:12px}.course-info h2{max-width:650px;margin-bottom:14px;font-size:26px}.course-info p{color:var(--muted);max-width:650px;font-size:14px}.course-meta{color:var(--muted);flex-wrap:wrap;gap:20px;font-size:13px;display:flex}.course-link{white-space:nowrap;align-self:end;padding:0 8px 5px;font-size:14px}.site-footer{max-width:1284px;color:var(--muted);justify-content:space-between;margin:auto;padding:30px 48px 45px;font-size:13px;display:flex}.welcome{grid-template-columns:1.2fr 1fr;align-items:center;gap:80px;padding:65px 0;display:grid}.welcome h1{margin-bottom:27px;font-size:clamp(40px,5vw,68px);line-height:1.25}.welcome>div>p{font-size:19px}.welcome .note{margin-top:20px;font-size:13px}.welcome-panel{background:var(--soft);padding:42px}.welcome-panel li{padding:10px 0}.welcome-panel p{margin:6px 0;font-size:14px}.welcome-panel ol{padding-left:22px}.back-link{color:var(--muted);margin:6px 0 30px;font-size:14px;display:inline-block}.course-heading{max-width:920px;margin-bottom:42px}.course-heading h1{font-size:42px;line-height:1.35}.course-heading>p{color:var(--muted);margin:22px 0;font-size:17px}.detail-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}.panel{background:#fff;border-radius:5px;min-width:0;margin-bottom:24px;padding:32px}.tint{background:var(--soft)}.objectives{margin:0 0 25px;padding-left:22px}.objectives li{margin-bottom:13px}.file-list{margin:22px 0}.file-list a{justify-content:space-between;gap:15px;padding:13px 0;font-size:14px;display:flex}.file-list a:hover{color:var(--accent)}.file-list small{color:var(--accent);background:var(--soft);margin-left:9px;padding:2px 5px;font-size:11px;display:inline-block}.note{color:var(--muted);font-size:13px}.lesson-section{margin-top:42px}.lesson-heading{justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;display:flex}.lesson-heading h2{margin-bottom:8px}.lesson-heading p{color:var(--muted);margin:0;font-size:14px}.button-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.button-row>*{font-size:13px}.notice{background:var(--soft);padding:18px 22px;font-size:14px}.lesson-frame{background:#fff;border:0;border-radius:5px;width:100%;height:850px}.admin-grid{grid-template-columns:1.1fr 1fr;align-items:start;gap:25px;display:grid}.dropzone{background:var(--ground);border:2px dashed var(--border);text-align:center;border-radius:4px;padding:38px 20px}.dropzone p{color:var(--muted);margin:10px 0 22px;font-size:13px}.file-button input{opacity:0;width:1px;height:1px;position:absolute}.file-button:focus-within{outline-offset:4px;outline:3px solid #d98037}.upload-preview{margin-top:30px}.upload-preview h3{margin:0 0 12px;font-size:23px}.upload-preview>p{font-size:14px}dl{grid-template-columns:110px 1fr;gap:10px 12px;font-size:14px;display:grid}dt{color:var(--muted)}dd{overflow-wrap:anywhere;margin:0}.admin-grid li{margin-bottom:12px}.admin-grid p,.admin-grid li{font-size:14px}pre{background:#fff;padding:18px;font-size:12px;line-height:1.7;overflow:auto}code{font-size:.9em}summary{cursor:pointer;font-weight:600}.admin-course{justify-content:space-between;align-items:center;gap:25px;padding:22px 0;display:flex}.admin-course .note{margin:7px 0 0}.admin-course-list .admin-course+.admin-course{border-top:1px solid var(--border)}.error{color:#943d21;background:#fae9e1;margin:20px 0 0;padding:16px;font-size:14px}.success{background:#e0f0e5;margin:20px 0 0;padding:16px}.success a{text-decoration:underline}.empty{text-align:center;background:#fff;padding:70px 20px}.empty h2{font-size:23px}.empty p{color:var(--muted)}@media (max-width:1050px){.course-row{grid-template-columns:175px 1fr;gap:25px}.course-link{grid-column:2;justify-self:end}.course-cover{grid-row:1/3}.welcome{gap:40px}.detail-grid,.admin-grid{grid-template-columns:1fr}.course-heading h1{font-size:36px}}@media (max-width:650px){.site-header{padding:20px}.site-header nav{gap:17px;font-size:12px}.wordmark{font-size:23px}.container{padding:20px 20px 45px}.page-intro{padding:20px 0 25px;display:block}.page-intro .button{margin-top:20px}h1{font-size:33px}.catalog-toolbar{display:block}.search-label input{width:100%}.filters{margin-top:20px}.course-row{padding:18px;display:block}.course-cover{grid-template-columns:1fr auto;gap:15px;min-height:140px;margin-bottom:24px;padding:22px;display:grid}.course-cover strong{grid-area:1/2/3;align-self:center;font-size:36px}.course-info h2{font-size:24px}.course-link{text-align:right;margin-top:16px;display:block}.welcome{padding:25px 0;display:block}.welcome h1{font-size:43px}.welcome-panel{margin-top:40px;padding:25px}.welcome>div>p{font-size:17px}.panel{padding:23px}.course-heading h1{font-size:30px}.lesson-heading{display:block}.lesson-heading .button-row{margin-top:20px}.lesson-frame{height:780px}.admin-course{display:block}.admin-course .button-row{margin-top:16px}.site-footer{padding:25px 20px}.course-heading>p{font-size:16px}.course-meta{gap:15px}}.site-header nav a,.wordmark{white-space:nowrap}@media (max-width:650px){.site-header{flex-wrap:wrap;gap:12px}.site-header nav{justify-content:flex-end;gap:22px;width:100%}}
