/* Company notices: formal document layout (news detail + layer) and header ticker item. */
.notice-doc{max-width:780px;margin:28px auto 0;padding:clamp(24px,5vw,56px);border:1px solid var(--theme-line,#2b384c);border-radius:18px;background:var(--theme-surface,#101c2d);color:var(--theme-ink,#edf3fb)}
.notice-doc :is(h1,h2){margin:0 0 28px;text-align:center;font-size:clamp(24px,3.4vw,34px);font-weight:900;line-height:1.35;color:var(--theme-ink,#edf3fb)}
:is(#detail,.notice-layer) .notice-doc .notice-body{margin-top:0;font-size:16px;line-height:1.9;color:var(--theme-ink,#edf3fb)}
:is(#detail,.notice-layer) .notice-body p{margin:0 0 1em}
/* "- 다 음 -" sits right before the item list; date, company and signer follow it. */
:is(#detail,.notice-layer) .notice-body p:has(+ :is(ol,ul)){margin:26px 0 18px;text-align:center;font-weight:700;letter-spacing:.3em}
:is(#detail,.notice-layer) .notice-body :is(ol,ul)~p{margin:0;text-align:center}
:is(#detail,.notice-layer) .notice-body :is(ol,ul)+p{margin-top:36px}
:is(#detail,.notice-layer) .notice-body :is(ol,ul)~p:nth-last-child(2){font-size:18px;font-weight:800}
:is(#detail,.notice-layer) .notice-body :is(ol,ul){list-style:none;counter-reset:notice-item;margin:0;padding:0;border-top:1px solid var(--theme-line,#2b384c)}
:is(#detail,.notice-layer) .notice-body li{counter-increment:notice-item;position:relative;display:grid;grid-template-columns:minmax(0,1fr);padding:14px 4px 14px 30px;border-bottom:1px solid var(--theme-line,#2b384c);font-size:15px}
:is(#detail,.notice-layer) .notice-body li::before{content:counter(notice-item) '.';position:absolute;left:4px;top:14px;color:var(--theme-accent,#ff9a4d);font-weight:800}
:is(#detail,.notice-layer) .notice-body li:has(.notice-item-label){grid-template-columns:190px minmax(0,1fr);gap:16px}
.notice-item-label{font-weight:700}
@media(max-width:640px){:is(#detail,.notice-layer) .notice-body li:has(.notice-item-label){grid-template-columns:minmax(0,1fr);gap:2px}}

/* The wide spacing suits "- 다 음 -" but not "- Details -". */
html:lang(en) :is(#detail,.notice-layer) .notice-body p:has(+ :is(ol,ul)){letter-spacing:.08em}

/* Layer */
html.notice-layer-open{overflow:hidden}
.notice-layer{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:16px}
.notice-layer[hidden]{display:none}
.notice-layer-backdrop{position:absolute;inset:0;background:#020711c7}
html[data-theme=light] .notice-layer-backdrop{background:#1b263499}
.notice-layer-panel{position:relative;display:flex;flex-direction:column;width:min(660px,100%);max-height:calc(100dvh - 32px);border:1px solid var(--theme-line,#2b384c);border-radius:16px;background:var(--theme-surface,#101c2d);box-shadow:0 30px 80px #0009;overflow:hidden}
.notice-layer-panel:focus{outline:none}
.notice-layer-doc{flex:1 1 auto;min-height:0;overflow:auto;margin:0;max-width:none;border:0;border-radius:0;background:transparent;padding:26px clamp(18px,5vw,32px) 18px}
.notice-layer-doc h2{margin-bottom:12px;font-size:22px}
.notice-layer-meta{display:flex;justify-content:center;align-items:center;gap:8px;margin:0 0 6px;font-size:12px}
.notice-layer-meta .nd{color:var(--theme-link,#6edcf7);font-weight:700}
.notice-layer-x{position:absolute;top:6px;right:6px;z-index:1;width:40px;height:40px;border:0;border-radius:50%;background:transparent;color:var(--theme-ink,#edf3fb);font-size:22px;line-height:1;cursor:pointer}
.notice-layer-x:hover{background:#ffffff14}
.notice-layer-foot{flex:none;display:flex;justify-content:space-between;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:10px clamp(16px,5vw,24px);border-top:1px solid var(--theme-line,#2b384c);background:var(--theme-bg,#070d18)}
.notice-layer-today{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-size:13px;color:var(--theme-muted,#b2c1d4);cursor:pointer}
.notice-layer-today input{width:18px;height:18px;accent-color:var(--theme-accent,#ff9a4d);cursor:pointer}
.notice-layer-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.notice-layer-actions :is(a,button){display:inline-flex;align-items:center;gap:4px;min-height:40px;padding:0 16px;border-radius:999px;font:inherit;font-size:13px;font-weight:700;text-decoration:none;cursor:pointer}
.notice-layer-more{background:#f07f2e;color:#1c0d00}
.notice-layer-actions button{border:1px solid var(--theme-line,#2b384c);background:transparent;color:var(--theme-ink,#edf3fb)}
.notice-layer :is(a,button,input):focus-visible{outline:2px solid var(--theme-accent,#ff9a4d);outline-offset:3px}
/* Compact body inside the layer so the whole notice fits without scrolling. */
:is(#detail,.notice-layer) .notice-layer-doc .notice-body{font-size:14px;line-height:1.65}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body p{margin:0 0 .5em}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body p:has(+ :is(ol,ul)){margin:12px 0 8px}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body :is(ol,ul)~p{margin:0}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body :is(ol,ul)+p{margin-top:16px}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body :is(ol,ul)~p:nth-last-child(2){font-size:15px}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body li{padding:7px 4px 7px 24px;font-size:13.5px;line-height:1.55}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body li::before{top:7px}
:is(#detail,.notice-layer) .notice-layer-doc .notice-body li:has(.notice-item-label){grid-template-columns:130px minmax(0,1fr);gap:12px}
@media(max-width:640px){:is(#detail,.notice-layer) .notice-layer-doc .notice-body{font-size:13px;line-height:1.55}:is(#detail,.notice-layer) .notice-layer-doc .notice-body li:has(.notice-item-label){grid-template-columns:92px minmax(0,1fr);gap:8px}:is(#detail,.notice-layer) .notice-layer-doc .notice-body li{padding:5px 2px 5px 20px;font-size:12.5px;line-height:1.45}:is(#detail,.notice-layer) .notice-layer-doc .notice-body li::before{top:5px;left:2px}:is(#detail,.notice-layer) .notice-layer-doc .notice-body p:has(+ :is(ol,ul)){margin:8px 0 6px}:is(#detail,.notice-layer) .notice-layer-doc .notice-body :is(ol,ul)+p{margin-top:10px}}
@media(max-width:640px){.notice-layer{padding:12px}.notice-layer-panel{max-height:calc(100dvh - 24px)}.notice-layer-doc{padding:20px 16px 12px}.notice-layer-doc h2{font-size:19px;margin-bottom:8px}.notice-layer-foot{flex-wrap:nowrap;gap:6px;padding:8px 12px}.notice-layer-today{font-size:12px;gap:6px;white-space:nowrap}.notice-layer-today input{width:16px;height:16px}.notice-layer-actions{gap:6px}.notice-layer-actions :is(a,button){min-height:36px;padding:0 11px;font-size:12px;white-space:nowrap}}

/* Header ticker item */
.news-ticker-notice{display:inline-flex;align-items:center;gap:10px;flex:none;margin-right:28px;padding-right:28px;border-right:1px solid #ff9a4d40}
.news-ticker-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:5px;background:#f07f2e;color:#1c0d00;font-size:11px;font-weight:800;line-height:1}
.news-ticker-notice-title{font-weight:700}
@media(max-width:400px){.notice-layer-more [aria-hidden]{display:none}}
/* The layer already shows the whole notice; on very narrow phones keep only 닫기. */
@media(max-width:360px){.notice-layer-more{display:none!important}}
