@font-face{font-family:"Pretendard";src:url("/assets/pretendard.woff2") format("woff2");font-weight:45 920;font-display:swap}/* The Purple Times web tokens (#32). Source: design reference artifact v7
   (https://claude.ai/artifact/VWxARK4A17rrhh85YH7XY6, 2026-11-09). Since
   PT-23 this file is the baseline; update the artifact when values change.
   Components use these variables only, never raw colour values. */
:root{
  --bg:#FBFAFE; --surface:#FFFFFF; --sunk:#F3EFFA;
  --ink:#241052; --ink-2:#4A4263; --ink-3:#655D80; --line:#E4DDF2;
  --rule:#5932B3; --accent:#8050D0; --lav:#E6D7FC; --accent-ink:#5932B3;
  --band:#241052; --on-band:#F4EEFF; --on-band-2:#CFC2EE;
  --good:#17663F; --good-bg:#E3F3EA; --warn:#8A4B00; --warn-bg:#FCEFD9;
  --bad:#B3261E; --bad-bg:#FCE8E6; --mute:#4B4560; --mute-bg:#F2EEF8;
  --shadow:rgba(36,16,82,.14);
  /* Paper (newspaper page) stays white in both themes. */
  --p-bg:#FFFFFF; --p-ink:#241052; --p-ink2:#3D3654; --p-ink3:#5E5873; --p-line:#E4DDF2; --p-rule:#5932B3; --p-accent:#8050D0; --p-wash:#F7F3FD; --p-bad:#B3261E;
  --f-body:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --f-masthead:"Playfair Display","Times New Roman",Georgia,serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#110A22; --surface:#1A1230; --sunk:#150E28;
  --ink:#EEE8FA; --ink-2:#C3B9DA; --ink-3:#A097BB; --line:#30264A;
  --rule:#A98BEA; --accent:#B394F0; --lav:#2E1F55; --accent-ink:#CDB8FA;
  --band:#0B0618; --on-band:#F4EEFF; --on-band-2:#CFC2EE;
  --good:#6AD39C; --good-bg:#12301F; --warn:#EDB963; --warn-bg:#33240C;
  --bad:#F49A91; --bad-bg:#3A1512; --mute:#C3B9DA; --mute-bg:#241B3A;
  --shadow:rgba(0,0,0,.45); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#110A22; --surface:#1A1230; --sunk:#150E28;
  --ink:#EEE8FA; --ink-2:#C3B9DA; --ink-3:#A097BB; --line:#30264A;
  --rule:#A98BEA; --accent:#B394F0; --lav:#2E1F55; --accent-ink:#CDB8FA;
  --band:#0B0618; --on-band:#F4EEFF; --on-band-2:#CFC2EE;
  --good:#6AD39C; --good-bg:#12301F; --warn:#EDB963; --warn-bg:#33240C;
  --bad:#F49A91; --bad-bg:#3A1512; --mute:#C3B9DA; --mute-bg:#241B3A;
  --shadow:rgba(0,0,0,.45); color-scheme:dark}
/* Shared components for site, admin and email previews (#32). Class names
   match the design reference UI kit. Requires tokens.css. */
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;text-wrap:balance;letter-spacing:-.015em}
p{margin:0}
a{color:var(--accent-ink)}
button,input,textarea,select{font-family:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.small{font-size:12.5px;color:var(--ink-3);line-height:1.55}
/* Web masthead is CSS text; the original PNG is for Instagram pages only. */
.wm{font-family:var(--f-masthead);font-weight:900;letter-spacing:-.005em;line-height:1;text-transform:uppercase;white-space:nowrap;color:var(--ink);display:inline-block}
.slogan{font-size:13px;font-weight:600;color:var(--accent-ink);letter-spacing:.04em}
.dbl{border:0;border-top:3px double var(--rule);margin:0}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--accent-ink);text-transform:uppercase}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.st-mute{background:var(--mute-bg);color:var(--mute)}
.st-lav{background:var(--lav);color:var(--ink)}
.st-good{background:var(--good-bg);color:var(--good)}
.st-warn{background:var(--warn-bg);color:var(--warn)}
.st-bad{background:var(--bad-bg);color:var(--bad)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;border:1px solid transparent;text-decoration:none}
.btn-pri{background:var(--ink);color:var(--bg)}
.btn-pri:hover{background:var(--rule)}
.btn-line{background:var(--surface);color:var(--ink);border-color:var(--line)}
.btn-line:hover{background:var(--sunk)}
.btn-bad{background:var(--surface);color:var(--bad);border-color:var(--bad-bg)}
.btn[disabled]{opacity:.45;cursor:default}
@media (max-width:560px){.btn{min-height:48px}}
.fld{display:grid;gap:6px;width:100%}
.fld label{font-size:14px;font-weight:700}
.inp{width:100%;min-height:46px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:15px;color:var(--ink);background:var(--surface)}
textarea.inp{padding:12px;min-height:88px;resize:vertical}
.inp:focus{outline:2px solid var(--accent);outline-offset:1px}
.inp[aria-invalid="true"]{border-color:var(--bad)}
.fld .help{font-size:12.5px;color:var(--ink-3)}
.fld .err{font-size:12.5px;color:var(--bad);font-weight:600}
.cbx{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer}
.cbx input{width:18px;height:18px;margin-top:2px;accent-color:var(--accent);flex:none}
.note-warn,.note-bad,.note-info{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;padding:12px;border-radius:10px;font-size:13px;line-height:1.55}
.note-warn{background:var(--warn-bg);color:var(--warn)}
.note-bad{background:var(--bad-bg);color:var(--bad)}
.note-info{background:var(--lav);color:var(--ink)}
.toast{display:flex;align-items:center;gap:12px;width:100%;background:var(--ink);color:var(--bg);border-radius:12px;padding:12px 14px;font-size:14px;font-weight:600}
.sk{height:12px;border-radius:6px;background:linear-gradient(90deg,var(--sunk) 0%,var(--line) 50%,var(--sunk) 100%);background-size:200% 100%;animation:sk 1.4s linear infinite}
@keyframes sk{from{background-position:100% 0}to{background-position:-100% 0}}
.spin{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.empty{border:1px dashed var(--line);border-radius:12px;padding:18px;display:grid;gap:8px;justify-items:start;width:100%}
.empty b{font-size:15px}
.dialog{width:100%;max-width:460px;background:var(--surface);color:var(--ink);border-radius:16px;padding:24px;display:grid;gap:14px;box-shadow:0 24px 60px rgba(0,0,0,.3);border:0}
dialog.dialog:not([open]){display:none}
.dialog::backdrop{background:rgba(36,16,82,.42)}
.dialog h4{font-size:20px;font-weight:800}
.dialog ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.dialog li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.scroll-x{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th,.tbl td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-size:12px;color:var(--ink-3);font-weight:700;background:var(--sunk)}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.kv{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 14px;margin:0;font-size:14.5px}
.kv dt{color:var(--ink-3);font-size:12.5px;font-weight:700;padding-top:2px}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
@media (max-width:560px){.g2{grid-template-columns:1fr}.kv{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Public briefing site (#24), from the design reference "브리핑 사이트"
   section. The reference shows the site as white paper; the live site
   maps the paper tokens to the theme tokens so dark mode also works.
   No status chips, hashes or other admin information appear here. */
body.public{background:var(--bg)}
.public{--p-bg:var(--surface);--p-ink:var(--ink);--p-ink2:var(--ink-2);--p-ink3:var(--ink-3);--p-line:var(--line);--p-rule:var(--rule);--p-accent:var(--accent-ink);--p-wash:var(--sunk);--p-bad:var(--bad)}
.site{padding:24px clamp(16px,4vw,40px) 32px;display:grid;gap:18px}
.public .site{max-width:1080px;margin:0 auto;min-height:100vh;align-content:start}
.site a{color:var(--p-rule)}
.site .snav a{color:var(--p-ink2);font-size:12.5px;text-decoration:none;min-height:24px}
.site .snav a:hover,.site .snav a[aria-current="page"]{color:var(--p-rule);text-decoration:underline}
.site .ai a{text-decoration:none;color:inherit;display:grid;gap:4px}
.site .ai a>span{font-size:14px;line-height:1.6;color:var(--p-ink2)}
.site .ai a:hover b{color:var(--p-rule);text-decoration:underline}
.site .sbtn{text-decoration:none}
.site .foot{border-top:1px solid var(--p-line);padding-top:14px;font-size:12.5px;color:var(--p-ink3);line-height:1.7}
.paper{background:var(--p-bg);color:var(--p-ink)}
.site .top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--p-ink3)}
.site .np{display:grid;justify-items:center;gap:6px;border-top:2px solid var(--p-ink);padding-top:12px}
.site .np .slg{font-size:14px;font-weight:600;color:var(--p-accent)}
.site .dbl{border-top-color:var(--p-rule)}
.site .k{font-size:13px;font-weight:700;color:var(--p-accent)}
.site h3{font-size:clamp(24px,3.4vw,36px);line-height:1.25;font-weight:800}
.site .lead{font-size:17px;color:var(--p-ink2);line-height:1.6}
.site .cols{display:flex;flex-wrap:wrap;gap:28px;border-top:1px solid var(--p-ink);padding-top:20px}
.site .main{flex:999 1 380px;min-width:0;display:grid;gap:14px;font-size:15.5px;line-height:1.85;color:var(--p-ink2)}
.site .main img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px}
.site .zoom{display:block;cursor:zoom-in;border-radius:3px;scroll-margin-top:16px}
.site .zoom img{display:block}
.site .zoom:focus-visible,.site .zoom-view:focus-visible{outline:2px solid var(--p-accent);outline-offset:2px}
/* Enlarged image (#43): shown while the URL targets it; any click closes it. */
.site .zoom-view{display:none}
.site .zoom-view:target{position:fixed;inset:0;z-index:20;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;align-content:center;gap:12px;padding:16px;background:rgba(17,10,34,.88);cursor:zoom-out;text-decoration:none}
.site .main .zoom-view img{width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 80px);aspect-ratio:auto;object-fit:contain;border-radius:3px}
.site .zoom-view span{color:#fff;font-size:14px;font-weight:700;border:1px solid rgba(255,255,255,.6);border-radius:10px;padding:8px 16px}
.site .main h4{font-size:18px;font-weight:800;color:var(--p-ink)}
.site aside{flex:1 1 220px;min-width:0;display:grid;gap:16px;align-content:start;border-left:1px solid var(--p-line);padding-left:22px}
.site aside h5{margin:0;font-size:15px;font-weight:800}
.site aside p{font-size:14px;line-height:1.7;color:var(--p-ink2)}
.site .num{display:grid;gap:8px;border-top:1px solid var(--p-ink);padding-top:12px}
.site .num b{font-size:28px;line-height:1.1;font-weight:800;display:block}
.site .num span{font-size:12.5px;color:var(--p-ink3)}
.site .src{background:var(--p-wash);border-radius:6px;padding:12px;font-size:12.5px;color:var(--p-ink3);display:grid;gap:4px}
.site .src a{color:#5932B3;font-weight:700;font-size:13.5px}
.site .arch{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0 24px;border-top:3px double var(--p-rule);padding-top:4px}
.site .arch div{padding:12px 0;border-bottom:1px solid var(--p-line);display:grid;gap:4px}
.site .arch small{font:600 11.5px var(--f-mono);color:var(--p-accent)}
.site .arch b{font-size:15px;line-height:1.45}
.site .snav{display:flex;flex-wrap:wrap;gap:4px 14px}
.site .snav button{all:unset;cursor:pointer;color:var(--p-ink2);font-size:12.5px}
.site .snav button:hover{color:var(--p-rule);text-decoration:underline}
.site .lnk{all:unset;cursor:pointer;color:var(--p-rule);text-decoration:underline}
.site button:focus-visible,.site input:focus-visible{outline:2px solid var(--p-accent);outline-offset:2px}
.site .hl{display:flex;flex-wrap:wrap;gap:20px 28px;align-items:center}
.site .hl img{flex:1 1 300px;min-width:0;max-width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px}
.site .art{display:block;min-width:0;border-radius:3px}
.site .art img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:3px}
.site .art:focus-visible{outline:2px solid var(--p-accent);outline-offset:2px}
.site .hl .art{flex:1 1 300px}
.site .bl-t .art{justify-self:stretch;max-width:560px}
.site .hl-t{flex:1 1 300px;min-width:0;display:grid;gap:10px;justify-items:start}
.site .why{display:grid;gap:4px;justify-self:stretch;border-top:1px solid var(--p-line);padding-top:12px;font-size:15px;line-height:1.7;color:var(--p-ink2)}
.site .why b{font-size:12.5px;color:var(--p-accent)}
.site .acts{display:flex;flex-wrap:wrap;gap:10px}
.site .sbtn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:10px;background:var(--p-ink);color:var(--p-bg);font-size:14.5px;font-weight:700}
.site .sbtn.ghost{background:var(--p-bg);color:var(--p-ink);border:1px solid var(--p-line)}
.site .sh{font:600 12px var(--f-mono);letter-spacing:.06em;color:var(--p-ink3);border-top:2px solid var(--p-ink);padding-top:10px}
.site .tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0 24px}
.site .tgrid>div{display:grid;align-content:start;min-width:0}
.site .tl-h{all:unset;cursor:pointer;font-weight:800;font-size:15px;color:var(--p-ink);padding:12px 0 2px}
.site .tl-h:hover{color:var(--p-rule)}
.site .alist{display:grid;min-width:0}
.site .ai{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid var(--p-line)}
.site button.ai{all:unset;box-sizing:border-box;display:grid;gap:4px;padding:12px 0;border-bottom:1px solid var(--p-line);cursor:pointer}
.site .ai small{display:flex;flex-wrap:wrap;gap:10px;font:600 11.5px var(--f-mono);color:var(--p-accent)}
.site .ai small span{color:var(--p-ink3)}
.site .ai b{font-size:15.5px;line-height:1.45;color:var(--p-ink)}
.site button.ai:hover b{color:var(--p-rule);text-decoration:underline}
.site .ai mark{background:var(--p-wash);color:var(--p-ink);box-shadow:inset 0 -2px 0 var(--p-accent)}
.site .sub{display:grid;gap:10px;background:var(--p-wash);border-radius:8px;padding:16px}
.site .sub>div{display:grid;gap:2px}
.site .sub b{font-size:16px}
.site .sub>div span{font-size:14px;color:var(--p-ink2)}
.site .sub-f{display:flex;flex-wrap:wrap;gap:8px}
.site .sinp{flex:1 1 220px;min-width:0;min-height:44px;border:1px solid var(--p-line);border-radius:10px;padding:0 12px;font:inherit;font-size:15px;color:var(--p-ink);background:var(--p-bg)}
.site .sinp[aria-invalid="true"]{border-color:var(--p-bad)}
.site .s-note{font-size:12.5px;color:var(--p-ink3)}
.site .s-note.bad{color:var(--p-bad);font-weight:600}
.site .fchips{display:flex;flex-wrap:wrap;gap:8px}
.site .fchips button{all:unset;box-sizing:border-box;cursor:pointer;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--p-line);font-size:13.5px;font-weight:700;color:var(--p-ink2);display:inline-flex;align-items:center}
.site .fchips button[aria-pressed="true"]{background:var(--p-ink);border-color:var(--p-ink);color:var(--p-bg)}
.site .blist{list-style:none;margin:0;padding:0;border-top:1px solid var(--p-ink)}
.site .blist li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--p-line)}
.site .blist .no{font-size:28px;line-height:1;font-weight:800;color:var(--p-rule)}
.site .bl-t{display:grid;gap:8px;justify-items:start;min-width:0}
.site .bl-t b{font-size:20px;line-height:1.35}
.site .bl-t p{font-size:15px;line-height:1.7;color:var(--p-ink2)}
.site .pn{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;font-size:13.5px;color:var(--p-ink3);border-top:1px solid var(--p-line);padding-top:12px}
.site .s-empty{display:grid;gap:4px;border:1px dashed var(--p-line);border-radius:8px;padding:16px;font-size:14px;color:var(--p-ink2)}
.site .mo{display:grid;gap:2px}