:root{--bg:#d8dcdd;--plate:#c3c8ca;--ink:#1f262b;--sub:#4b565d;--rust:#a8481f;--line:#8c969b;
--disp:'Big Shoulders Display','Black Han Sans','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
--body:'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#1a1f23;--plate:#262d32;--ink:#e6e9ea;--sub:#9aa5ab;--rust:#e08558;--line:#475057}}
:root[data-theme="dark"]{--bg:#1a1f23;--plate:#262d32;--ink:#e6e9ea;--sub:#9aa5ab;--rust:#e08558;--line:#475057}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.6 var(--body)}
main{max-width:66rem;margin:0 auto;padding:2.5rem 1.25rem 4rem}
h1{font:900 clamp(2.6rem,11vw,4.6rem)/1.05 var(--disp);font-synthesis:none;margin:0 0 .6rem}
.lead{margin:0 0 3rem;color:var(--sub);max-width:34rem}
h2{font:900 1.7rem/1.2 var(--disp);font-synthesis:none;margin:0 0 1.2rem;padding-bottom:.5rem;border-bottom:3px solid var(--ink)}
section{margin-bottom:3.5rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.2rem}
.chip{font:500 .9rem var(--body);padding:.3rem .8rem;border:2px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:1.4rem}
.card{display:flex;flex-direction:column;border:2px solid var(--ink);background:var(--plate)}
.poster{display:block;width:100%;padding:0;border:0;border-bottom:2px solid var(--ink);background:var(--bg);cursor:pointer;line-height:0}
.poster img{width:100%;height:auto;display:block}
.cbody{display:flex;flex-direction:column;flex:1;padding:1rem}
.card h3{margin:0 0 .7rem;font-size:1.15rem;line-height:1.35}
dl{margin:0}
dt{font-size:.8rem;color:var(--sub);margin-top:.55rem}
dd{margin:0;font-size:.95rem}
dd.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.more{margin-top:auto;align-self:flex-start;font:700 .95rem var(--body);padding:.45rem 1rem;border:2px solid var(--ink);background:var(--ink);color:var(--bg);cursor:pointer}
.cbody .more{margin-top:1rem}
.poster:focus-visible,.more:focus-visible,.chip:focus-visible,#vclose:focus-visible,.vlink:focus-visible{outline:3px solid var(--rust);outline-offset:3px}
.empty{padding:1.2rem 0;color:var(--sub)}
#viewer{width:min(94vw,42rem);max-height:92vh;padding:.8rem;border:2px solid var(--ink);background:var(--bg);color:var(--ink)}
#viewer::backdrop{background:rgba(0,0,0,.72)}
#vclose{font:700 .95rem var(--body);padding:.4rem .9rem;border:2px solid var(--ink);background:var(--plate);color:var(--ink);cursor:pointer}
#vbody img{width:100%;height:auto;display:block;margin-top:.7rem}
.vinfo{margin-top:1rem}
.vinfo h3{font:900 1.5rem/1.3 var(--disp);font-synthesis:none;margin:0 0 .5rem}
.vinfo dd p{margin:0 0 .35rem}
.vlink{display:inline-block;margin-top:.8rem;color:var(--rust);font-weight:700}


[hidden]{display:none!important}
.panel h3.sub{margin:1.8rem 0 .6rem;font-size:1.3rem;line-height:1.4}
.mdet{flex:1 1 20rem;min-width:0}
.mdet summary{cursor:pointer;color:var(--rust);font-weight:500}
.mdet summary:focus-visible{outline:2px solid var(--rust);outline-offset:2px}
.mtext{margin:.7rem 0 0;line-height:1.85;max-width:44rem}
html[lang=en] h1{font-size:clamp(3.2rem,14vw,6rem);line-height:.95;text-transform:uppercase;letter-spacing:.01em}
html[lang=en] h2{font-size:2.1rem;text-transform:uppercase;letter-spacing:.02em}
html[lang=en] .vinfo h3{font-size:1.9rem;text-transform:uppercase;letter-spacing:.01em}
main section>h2[data-fold]{cursor:pointer;display:flex;align-items:center;gap:.7rem;user-select:none;-webkit-tap-highlight-color:transparent}
main section>h2[data-fold]::after{content:'';flex:none;width:.6rem;height:.6rem;border-right:3px solid currentColor;border-bottom:3px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .15s}
main section.collapsed>h2[data-fold]::after{transform:rotate(-45deg)}
main section>h2[data-fold]:focus-visible{outline:2px solid var(--rust);outline-offset:3px}
main section.collapsed>:not(h2){display:none!important}
.langbar{display:flex;justify-content:flex-end;gap:.4rem;margin-bottom:.75rem}
.seal.top{box-shadow:inset 0 0 0 2px var(--rust),inset 0 0 0 3px var(--bg);padding:.2rem .65rem}
.seal{display:inline-block;align-self:flex-start;margin:0 0 .5rem;font:700 .8rem var(--body);padding:.2rem .55rem;background:var(--rust);color:var(--bg);letter-spacing:.01em}
.vh{margin:1.1rem 0 .4rem;font-size:.95rem}
.mlist{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.mlist a,.mgroup a{color:var(--rust);text-underline-offset:3px;overflow-wrap:anywhere}
.mgroup{margin:0 0 1.25rem}.mgroup h3{margin:0 0 .5rem}
.mitem{display:flex;gap:.6rem;align-items:baseline;flex-wrap:wrap;padding:.35rem 0;border-bottom:1px solid var(--line)}
.myear{font-weight:700;min-width:3rem}.msrc{color:var(--sub);font-size:.85rem}
.decl h3{margin:.2rem 0 .8rem}.decl .sign{margin-top:1rem;text-align:right;color:var(--sub)}
.decl .pre{line-height:1.85}
.jump{display:flex;flex-wrap:wrap;gap:.4rem;margin:-1.6rem 0 2.6rem}
a.chip{text-decoration:none;display:inline-block}
.panel p{margin:0 0 .8rem;max-width:46rem}
.panel h3{margin:0 0 .6rem;font-size:1.25rem;line-height:1.4}
.pre{white-space:pre-wrap;overflow-wrap:anywhere}
.notice{padding:1rem 0;border-bottom:1px solid var(--line)}
.notice.pin{border-left:4px solid var(--rust);padding-left:.9rem}
.nh{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.nh h3{margin:0;font-size:1.1rem}
.tag{font:700 .75rem var(--body);padding:.05rem .45rem;background:var(--rust);color:var(--bg)}
.nd{display:block;font-size:.85rem;color:var(--sub);margin:.15rem 0 .4rem}
.nb{margin:0}
.pgroup{display:grid;grid-template-columns:5rem 1fr;gap:.4rem 1rem;padding:.7rem 0;border-bottom:1px solid var(--line)}
.pgroup dt{margin:0;font-weight:700;color:var(--ink);font-size:.95rem}
.pgroup dd{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;font-size:1rem}
.pgroup a{color:var(--rust);font-weight:700}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:1rem}
.scard{border:2px solid var(--ink);background:var(--plate);padding:.9rem 1rem}
.scard b{display:block;font-size:1.05rem}
.scard span{display:block;color:var(--sub);font-size:.9rem}
.row{display:flex;gap:.6rem;align-items:flex-start;justify-content:space-between}
.row>:first-child{flex:1;min-width:0}
.foot{max-width:66rem;margin:0 auto;padding:0 1.25rem 3rem}
.cta{border:2px solid var(--ink);background:var(--plate);padding:1.4rem 1.3rem 1.5rem;margin:0 0 1.6rem;border-left:10px solid var(--rust)}
.cta h3{font:900 clamp(1.5rem,5vw,2rem)/1.2 var(--disp);font-synthesis:none;margin:0 0 .6rem}
.cta p{margin:0 0 .9rem;max-width:40rem}
.cta ul.ways{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1rem;padding:0;list-style:none}
.cta ul.ways li{border:2px solid var(--ink);padding:.2rem .7rem;font-weight:700;font-size:.92rem}
.cta .acts{display:flex;flex-wrap:wrap;gap:.6rem}
.cta a.btn{text-decoration:none;display:inline-block}
.cta .note{color:var(--sub);font-size:.9rem;margin:.9rem 0 0}
a.chip.hot{background:var(--rust);border-color:var(--rust);color:#fff}
.aside{margin:2.2rem 0 0;padding:.2rem 1.1rem 1rem;border:2px solid var(--ink);border-left:10px solid var(--rust);background:var(--bg)}
.aside h3.sub{margin-top:1rem}
.gloss{margin:-.2rem 0 1.2rem;padding-left:.8rem;border-left:3px solid var(--rust);color:var(--sub);font-size:.9rem;line-height:1.6}
.cta .addr{align-self:center;font-weight:700;overflow-wrap:anywhere}
.snsrow{display:flex;flex-wrap:wrap;gap:.6rem}.snsrow a.btn{text-decoration:none;display:inline-block}
.btn{font:700 .9rem var(--body);padding:.4rem .9rem;border:2px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.btn.primary{background:var(--ink);color:var(--bg)}
.btn.danger{border-color:var(--rust);color:var(--rust)}
.btn.small{padding:.2rem .6rem;font-size:.8rem;flex:none}
.btn:focus-visible,.fld input:focus-visible,.fld textarea:focus-visible,.fld select:focus-visible,a:focus-visible{outline:3px solid var(--rust);outline-offset:2px}
.btn:disabled{opacity:.5;cursor:default}
.admin-bar{margin:0 0 1rem;padding:.6rem .8rem;border:2px dashed var(--rust);color:var(--rust);font-size:.9rem}
.edit{margin:.8rem 0 1.2rem;padding:1rem;border:2px solid var(--ink);background:var(--plate);display:grid;gap:.7rem;max-width:42rem}
.fld{display:grid;gap:.25rem}
.fld .fl{font-size:.85rem;color:var(--sub)}
.fld input[type=text],.fld input[type=date],.fld input[type=number],.fld textarea,.fld select{width:100%;font:400 1rem var(--body);padding:.45rem .6rem;border:2px solid var(--ink);background:var(--bg);color:var(--ink)}
.fld input[type=checkbox]{width:1.1rem;height:1.1rem;justify-self:start}
.bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.msg{font-size:.85rem;color:var(--sub)}