:root{--banner-height:108px;--drawer-width:290px;--ink:CanvasText;--muted:GrayText;--accent:LinkText;--line:color-mix(in srgb,CanvasText 20%,transparent);color-scheme:light dark;font-family:"Pretendard","Noto Sans KR",system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}body{margin:0;color:var(--ink)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;border:0}a,button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}
.skip-link{position:fixed;top:-80px;left:12px;z-index:100;padding:12px;background:transparent;color:CanvasText}.skip-link:focus{top:12px}
.banner{position:fixed;inset:0 0 auto;height:var(--banner-height);z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 32px;border-bottom:1px solid var(--line);box-shadow:0 4px 24px #050c2526}
.banner-left{display:flex;align-items:center;gap:22px}.brand{font-size:19px;font-weight:750;letter-spacing:-.6px}.brand span{display:block;font-size:12px;font-weight:400;color:#d4d5e9;margin-top:6px;letter-spacing:0}.control{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;min-width:42px;padding:9px 13px;border-radius:10px;border:1px solid var(--line);background:transparent;font-size:13px;transition:background .2s}.control:hover{background:transparent}.menu-button{font-size:21px}.page-controls{display:flex;gap:8px}.disabled{opacity:.35;pointer-events:none}
.drawer{position:fixed;left:0;top:var(--banner-height);bottom:0;width:var(--drawer-width);z-index:25;overflow:auto;padding:28px 16px 20px;background-image:url('/static/images/%EB%B3%84%EB%B9%9B%EA%B3%BC%20%EA%BD%83%EC%9D%B4%20%EB%A8%B8%EB%AC%B4%EB%8A%94%20%EB%B0%9C%EC%BD%94%EB%8B%88%20%ED%92%8D%EA%B2%BD.webp');background-position:left center;background-size:cover;border-right:1px solid var(--line);transition:transform .25s}.drawer-heading{display:flex;align-items:center;justify-content:space-between;padding:0 10px 22px;font-size:12px;letter-spacing:2px;color:#e3d5ed}.drawer-heading .control{display:none;font-size:24px}.tree{list-style:none;padding:0;margin:0}.tree .tree{padding-left:13px;margin:2px 0 10px 16px;border-left:1px solid var(--line)}.tree-row{display:flex;align-items:center;margin:3px 0}.tree-row>a{flex:1;min-width:0;padding:12px 10px;border-radius:8px;font-size:13px;line-height:1.6;color:#e0dded;display:flex;align-items:baseline;gap:9px}.tree-row>a:hover{background:transparent}.tree-row>a.active{background:transparent;color:#ffe0ae;box-shadow:inset 2px 0 #ffd39c}.tree-icon{opacity:.65;font-size:16px}.tree-toggle{background:transparent;min-width:36px;min-height:40px;font-size:20px;transition:transform .2s}.tree-toggle[aria-expanded=false]{transform:rotate(-90deg)}.drawer-footer{border-top:1px solid var(--line);margin:30px 10px 0;padding-top:18px;color:#d2c5d9;font-size:11px}
main{margin-top:var(--banner-height);margin-left:var(--drawer-width);min-height:calc(100dvh - var(--banner-height));transition:margin-left .25s}.drawer-hidden .drawer{transform:translateX(-100%)}.drawer-hidden main{margin-left:0}.home-hero{position:relative;isolation:isolate;min-height:calc(100dvh - var(--banner-height));display:flex;align-items:flex-start;padding:clamp(70px,10vh,125px) clamp(32px,6vw,110px);background-image:url('/static/images/%EB%B3%84%EB%B9%9B%20%EC%95%84%EB%9E%98%EC%9D%98%20%EC%95%84%EB%8A%91%ED%95%9C%20%EC%BD%94%EB%94%A9%20%EB%B0%9C%EC%BD%94%EB%8B%88.webp');background-size:contain;background-repeat:no-repeat;background-position:center center}.hero-copy{max-width:670px;text-shadow:0 2px 24px #10163366}.eyebrow{display:inline-block;font-size:11px;letter-spacing:3px;color:#ffe2c5;margin-bottom:25px}.hero-copy h1{font-size:clamp(42px,4.8vw,76px);line-height:1.25;letter-spacing:-3px;margin:0 0 24px;font-weight:800}.hero-copy p{font-size:clamp(16px,1.6vw,22px);line-height:1.8;color:#fff0ef;margin:0 0 36px}.hero-link{display:inline-flex;gap:30px;align-items:center;border:1px solid #ffe5d947;padding:14px 20px;background:transparent;backdrop-filter:blur(8px);border-radius:8px;font-size:13px}.hero-link:hover{background:transparent}.hero-link span{font-size:21px}.hero-caption{position:absolute;bottom:28px;left:clamp(32px,6vw,110px);font-size:11px;color:#ffe8da}.mobile-break{display:none}
.reading-area{max-width:1050px;margin:auto;padding:42px clamp(24px,5vw,70px) 64px}.breadcrumb{display:flex;gap:12px;color:var(--muted);font-size:12px;margin-bottom:36px}.breadcrumb a:hover{color:var(--accent)}.article{min-height:50vh}.article>h1{font-size:clamp(27px,3vw,42px);line-height:1.4;letter-spacing:-1.2px;margin:0 0 30px;padding-bottom:28px;border-bottom:1px solid var(--line)}.prose{font-size:16px;line-height:1.9;color:var(--ink);overflow-wrap:anywhere}.prose h1,.prose h2,.prose h3{color:var(--ink)}.prose a{color:var(--accent);text-decoration:underline}.prose img{max-width:100%;height:auto}.prose pre{overflow:auto;padding:20px;border-radius:8px;background:transparent}.prose code{background:transparent;border-radius:4px;padding:2px 5px}.prose pre code{padding:0;background:none}.prose table{display:block;max-width:100%;overflow:auto;border-collapse:collapse}.prose td,.prose th{border:1px solid var(--line);padding:8px 12px}.prose blockquote{margin-left:0;border-left:3px solid var(--accent);padding-left:20px}.article-pagination{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line);padding-top:25px;margin-top:40px}.article-pagination a{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--line);border-radius:10px}.article-pagination a:last-child{text-align:right}.article-pagination small{color:var(--muted)}.article-pagination span{font-size:14px}.article-pagination a:hover{border-color:var(--accent)}

@media(max-width:1100px){:root{--drawer-width:260px}.banner{padding:18px 22px}.banner-left{gap:14px}.brand{font-size:17px}.page-controls .control{padding:9px}.hero-copy h1{letter-spacing:-2px}}
@media(max-width:900px){:root{--banner-height:88px;--drawer-width:290px}.banner{padding:14px 18px}.brand{font-size:15px}.brand span{font-size:10px}.page-controls .control span{display:none}.drawer{transform:translateX(-100%);z-index:50;width:min(320px,85vw)}main,.drawer-hidden main{margin-left:0}.drawer-open .drawer{transform:translateX(0)}.drawer-heading .control{display:flex}.drawer-overlay{position:fixed;inset:var(--banner-height) 0 0;z-index:40;background:transparent;backdrop-filter:blur(3px)}.drawer-open{overflow:hidden}.home-hero{background-position:center center;padding-top:65px}.hero-copy h1{font-size:clamp(42px,7vw,64px)}}
@media(max-width:520px){:root{--banner-height:82px}.banner{gap:8px;padding:12px}.banner-left{gap:9px}.brand{font-size:13px}.brand span{display:none}.control{min-width:36px;min-height:38px;padding:8px}.page-controls{gap:4px}.home-hero{padding:56px 26px;background-position:center center}.hero-copy h1{font-size:43px}.hero-copy p{font-size:16px}.mobile-break{display:block}.hero-caption{left:26px;bottom:22px}.reading-area{padding:30px 22px 40px}.article-pagination{gap:10px}.article-pagination a{padding:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}

/* All screen sizes use an overlay drawer. */
main{margin-left:0}
.drawer{transform:translateX(-100%);z-index:50;width:min(var(--drawer-width),85vw)}
.drawer-open .drawer{transform:translateX(0)}
.drawer-heading .control{display:flex}
.drawer-overlay{position:fixed;inset:var(--banner-height) 0 0;z-index:40;background:transparent;backdrop-filter:blur(3px)}
.drawer-open{overflow:hidden}

/* Native light/dark canvas; uploaded artwork keeps its own colors. */
.banner,.drawer,.home-hero{--ink:white;--muted:#e0dded;--accent:#ffd8a6;--line:rgba(255,255,255,.25);color:var(--ink)}
.banner,.drawer{text-shadow:0 1px 4px rgba(0,0,0,.8)}
.skip-link{background:Canvas;color:CanvasText}
.tree-row>a.active{font-weight:700}
@media(prefers-color-scheme:dark){:root{color-scheme:dark}}

:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{color-scheme:dark}
/* Keep the mode icon visible when compact banner labels are hidden. */
.page-controls #theme-toggle .theme-icon{display:inline}
@media(max-width:520px){.banner{gap:4px;padding:8px}.banner-left{gap:5px}.brand{font-size:12px}.page-controls{gap:3px}.page-controls .control{min-width:32px;padding:6px}}

/* Mirror only the banner artwork, keeping its controls readable. */
.banner{isolation:isolate}
.banner::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:url('/static/images/%EB%B3%84%EB%B9%9B%EA%B3%BC%20%EC%B4%88%EC%8A%B9%EB%8B%AC%EC%9D%98%20%ED%99%A9%ED%98%BC%20%ED%95%98%EB%8A%98%20Re.webp');background-size:cover;background-position:center;transform:scaleX(-1)}

.document-frame{display:block;width:100%;min-height:70vh;border:0;color-scheme:normal}
.model-card-list{list-style:none;padding:0;display:grid;gap:12px}
.model-card-list a{display:block;padding:16px;border:1px solid var(--line);border-radius:8px;color:var(--accent)}

.child-pages{margin-top:28px}.child-pages h2{font-size:18px}.child-pages .model-card-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}.child-pages a{display:flex;justify-content:space-between;gap:16px}

/* Standalone responsive documents use the available viewport width. */
.reading-area-document{max-width:none;padding:32px clamp(12px,2vw,32px) 48px}
@media(max-width:520px){.reading-area-document{padding:24px 8px 32px}.reading-area-document>.breadcrumb,.reading-area-document .article>h1{margin-left:14px;margin-right:14px}}

/* Homepage content overview. */
.dashboard{max-width:1200px}.dashboard-label{color:var(--accent);font-size:11px;letter-spacing:2px;font-weight:700}.dashboard-intro h1{font-size:clamp(32px,5vw,48px);letter-spacing:-1.5px;margin:14px 0}.dashboard-intro p,.dashboard-section>p{color:var(--muted);line-height:1.7}.dashboard-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:32px}.dashboard-stats>div{padding:24px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,Canvas 96%,var(--accent))}.dashboard-stats span{font-size:13px;color:var(--muted)}.dashboard-stats strong{display:block;font-size:38px;margin-top:12px}.dashboard strong small{font-size:13px;font-weight:400;margin-left:8px;color:var(--muted)}.dashboard-caption{font-size:12px;line-height:1.8;color:var(--muted);margin-top:16px}.dashboard-section{margin-top:40px}.dashboard-section h2{font-size:23px;margin-bottom:12px}.dashboard-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}.dashboard-category{display:block;border:1px solid var(--line);border-radius:16px;padding:24px;transition:border-color .2s}.dashboard-category:hover,.dashboard-shortcuts a:hover{border-color:var(--accent)}.dashboard-category>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px}.dashboard-category h3{font-size:16px;margin:0 0 20px}.dashboard-category strong{font-size:30px}.dashboard-bar{height:6px;border-radius:6px;background:var(--line);margin-top:20px;overflow:hidden}.dashboard-bar span{display:block;height:100%;background:var(--accent);border-radius:6px}.dashboard-category p{color:var(--muted);font-size:12px;margin:12px 0 0}.dashboard-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}.dashboard-shortcuts a{border:1px solid var(--line);border-radius:12px;padding:20px;font-weight:600;line-height:1.6}.dashboard-shortcuts span{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:7px}@media(max-width:760px){.dashboard-stats,.dashboard-categories{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.dashboard-categories,.dashboard-shortcuts{grid-template-columns:1fr}.dashboard-stats{gap:10px}.dashboard-stats>div{padding:16px}.dashboard-stats strong{font-size:30px}}
.page-view-count{margin:0;padding:12px 24px;text-align:right;color:var(--muted);font-size:12px}.views-table{width:100%}.views-table td:last-child,.views-table th:last-child{text-align:right;white-space:nowrap}

/* Keep drawer text legible over detailed artwork. */
.drawer .tree-row>a,.drawer .tree-toggle,.drawer .drawer-heading,.drawer .drawer-footer{
  text-shadow:-1px -1px 0 #101426,1px -1px 0 #101426,-1px 1px 0 #101426,1px 1px 0 #101426,0 2px 4px #000,0 0 8px #000;
}
.drawer .tree-row>a{color:#fff;font-weight:600}
.drawer .tree-row>a.active{color:#ffe0ae;font-weight:750}
.drawer .tree-icon{opacity:1}
.drawer .tree-toggle,.drawer .drawer-heading,.drawer .drawer-footer{color:#f5f1ff}

/* Match drawer contrast in the fixed banner. */
.banner .brand,.banner .brand span,.banner .control{
  text-shadow:-1px -1px 0 #101426,1px -1px 0 #101426,-1px 1px 0 #101426,1px 1px 0 #101426,0 2px 4px #000,0 0 8px #000;
}
.banner .brand,.banner .control{color:#fff}
.banner .brand span{color:#f5f1ff;font-weight:500}
.banner .control{font-weight:600}
.report-pages{display:grid;gap:24px;margin-top:24px}.report-pages figure{margin:0}.report-pages img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px}.report-pages figcaption{text-align:center;color:var(--muted);font-size:12px;margin-top:8px}

/* Reserve a separate line for the fixed server notice. */
:root{--banner-height:136px}
.banner{padding-bottom:48px}
.banner-server-note{position:absolute;bottom:10px;left:32px;right:32px;margin:0;color:#fff0d8;font-size:12px;line-height:1.5;text-align:center;text-shadow:-1px -1px 0 #101426,1px 1px 0 #101426,0 2px 4px #000}
.home-server-note{max-width:470px;margin-top:28px;padding:16px 18px;border:1px solid #ffe5d947;border-radius:10px;background:rgba(16,20,38,.65);color:#fff0d8;text-shadow:0 1px 3px #000}
.home-server-note strong{font-size:14px}.hero-copy .home-server-note p{font-size:13px;line-height:1.8;margin:8px 0 0;color:#fff0d8}
@media(max-width:900px){:root{--banner-height:116px}.banner{padding-bottom:42px}.banner-server-note{left:14px;right:14px;font-size:11px}}
@media(max-width:520px){:root{--banner-height:116px}.banner{padding-bottom:40px}.banner-server-note{bottom:7px;left:12px;right:12px;font-size:10px}.home-server-note{padding:14px}.hero-copy .home-server-note p{font-size:12px}}

/* Fill the home viewport and anchor the desk scene at the lower right. */
.home-page main{position:relative}
.project-video{display:block;width:100%;max-height:75vh;aspect-ratio:16/9;background:#101426;border-radius:12px;margin-top:24px}
.home-page .page-view-count{position:absolute;top:0;right:0;z-index:2;color:#fff;text-shadow:0 1px 4px #000}
.home-hero{background-size:cover;background-position:right bottom;min-height:calc(100dvh - var(--banner-height));padding-bottom:80px}
.hero-copy{text-shadow:-1px -1px 0 #101426,1px 1px 0 #101426,0 2px 8px #000}
@media(max-width:900px){.home-hero{background-size:cover;background-position:right bottom}}
@media(max-width:520px){.home-hero{background-position:right bottom}}
.video-quality{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.video-quality button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);font-weight:700}