@charset "utf-8";
/* ==========================================================================
   OP. SILENT NIGHT — Tistory skin
   A classified dossier on Christmas Eve, 1999. Cold war, 1984, telescreens.
   Single dark look by design. Accent: signal red.
   ========================================================================== */
:root{
  --bg:#08080a; --paper:#0e0e11; --card:#121216; --line:rgba(214,219,225,.16); --line2:rgba(214,219,225,.42);
  --fg:#d6dbe1; --fg2:#a4abb3; --muted:#6c727a; --red:#c8001c; --red2:#ec0a2a; --green:#5f8f76;
  --mono:"IBM Plex Mono","Nanum Gothic Coding","Pretendard","Courier New",ui-monospace,monospace;
  --type:"Special Elite","Nanum Gothic Coding","Courier New",monospace;
  --sans:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --g:clamp(16px,3vw,40px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.sn-open{overflow:hidden}
::selection{background:var(--red);color:#fff}
::-moz-selection{background:var(--red);color:#fff}
body{margin:0;background:var(--bg);color:var(--fg);font:400 15px/1.75 var(--sans);word-break:keep-all;overflow-wrap:anywhere}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
button{font:inherit;color:inherit;cursor:pointer}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.r{color:var(--red2)}
.blink{animation:sn-blink 1s steps(1) infinite}
@keyframes sn-blink{50%{opacity:0}}
:focus-visible{outline:1px dashed var(--red2);outline-offset:3px}
.sn-grain{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:overlay;opacity:.22;z-index:90}

/* ---------- top bar ---------- */
.sn-top{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:12px var(--g);padding-top:calc(12px + env(safe-area-inset-top,0px));background:rgba(8,8,10,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line);font:500 .72rem/1.2 var(--mono);letter-spacing:.14em}
.sn-brand{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg2)}
.sn-brand i{font-style:normal;color:var(--muted);margin:0 .3em}
.sn-brand b{color:var(--fg);font-weight:600}
.sn-eye{width:46px;height:auto;color:var(--fg);overflow:visible}
.sn-eye>path,.sn-eye clipPath path{transform-origin:0 0;transition:transform .12s}
.sn-eye.shut>path{transform:scaleY(.06)}
.sn-eye.shut g{opacity:0}
.sn-topr{display:flex;justify-content:flex-end;align-items:center;gap:14px}
.sn-clock{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.sn-clock b{color:var(--fg);font-weight:500}
.sn-menu{display:none;background:none;border:1px solid var(--line2);padding:6px 10px;letter-spacing:.14em}

/* ---------- masthead ---------- */
.sn-mast{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:28px;max-width:1240px;margin:0 auto;padding:clamp(36px,7vw,84px) var(--g) clamp(24px,4vw,40px);border-bottom:1px solid var(--line);position:relative}
.sn-mast::before{content:"";position:absolute;left:var(--g);top:0;width:min(220px,40%);height:3px;background:var(--red)}
.sn-kicker{margin:0 0 14px;font:500 .7rem/1.4 var(--mono);letter-spacing:.2em;color:var(--red2)}
.sn-title{margin:0;font:700 clamp(2.2rem,6.4vw,5rem)/1.05 var(--mono);letter-spacing:-.02em;text-transform:uppercase;text-wrap:balance}
.sn-desc{margin:16px 0 0;max-width:46ch;color:var(--fg2);font-size:.95rem}
.sn-dday{width:min(270px,100%);border-top:2px solid var(--red);padding-top:9px;font-family:var(--mono);font-variant-numeric:tabular-nums}
.sn-dday .k{display:flex;justify-content:space-between;gap:10px;font-size:.6rem;letter-spacing:.18em;color:var(--muted)}
.sn-dday .k b{color:var(--red2);font-weight:600}
.sn-dday .n{display:flex;align-items:flex-end;gap:10px;margin-top:2px}
.sn-dday .n strong{font-size:clamp(2.6rem,5vw,3.6rem);font-weight:600;line-height:1;letter-spacing:-.01em}
.sn-dday .n strong i{font-style:normal;color:var(--red2)}
.sn-dday .n small{font-size:.6rem;line-height:1.4;letter-spacing:.16em;color:var(--muted);padding-bottom:.6em}
.sn-dday .bar{height:3px;margin-top:10px;background:var(--line)}
.sn-dday .bar i{display:block;height:100%;width:0;background:var(--red)}
.sn-dday .t{display:flex;justify-content:space-between;margin-top:6px;font-size:.6rem;letter-spacing:.12em;color:var(--fg2)}

/* ---------- layout ---------- */
.sn-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(28px,4vw,56px);max-width:1240px;margin:0 auto;padding:clamp(28px,4vw,48px) var(--g) 64px}
.sn-main{min-width:0;display:flex;flex-direction:column;gap:22px}
.sn-sec-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.sn-sec-h .lab{font:500 .64rem/1 var(--mono);letter-spacing:.2em;color:var(--red2)}
.sn-sec-h h2{margin:0;font:600 1.15rem/1.3 var(--sans)}
.sn-sec-h .cnt{margin-left:auto;font:500 .66rem/1 var(--mono);letter-spacing:.14em;color:var(--muted)}

/* ---------- home cards ---------- */
.sn-card{background:var(--card);border:1px solid var(--line);transition:border-color .2s}
.sn-card:hover{border-color:var(--line2)}
.sn-card-a{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:0}
.sn-card-a:not(:has(.sn-thumb)){grid-template-columns:minmax(0,1fr)}
.sn-thumb{position:relative;display:block;aspect-ratio:4/3;max-width:100%;overflow:hidden;background:#000}
.sn-thumb img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.35) brightness(.85);transition:filter .45s,transform .6s}
.sn-thumb .scan{position:absolute;inset:14%;border:1.5px dashed rgba(236,10,42,.7);transition:inset .3s,border .2s}
.sn-thumb em{position:absolute;right:10px;bottom:8px;font:500 .62rem/1 var(--mono);letter-spacing:.12em;font-style:normal;color:var(--red2);opacity:0;transition:opacity .2s}
.sn-card:hover .sn-thumb img{filter:none;transform:scale(1.03)}
.sn-card:hover .sn-thumb .scan{inset:6px;border-style:solid;box-shadow:0 0 14px rgba(236,10,42,.35)}
.sn-card:hover .sn-thumb em{opacity:1}
.sn-card-b{display:flex;flex-direction:column;gap:8px;padding:18px 22px 20px;min-width:0}
.sn-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font:500 .64rem/1.4 var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.sn-meta b{color:var(--red2);font-weight:600}
.sn-card-t{font:600 1.2rem/1.4 var(--sans);text-wrap:balance}
.sn-card:hover .sn-card-t{color:#fff}
.sn-card-s{color:var(--fg2);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- category list: shared ---------- */
.sn-main:has(.sn-list) .sn-card{display:none!important}
.sn-list-desc{margin:-6px 0 18px;color:var(--fg2);font-size:.9rem}
.sn-ls{list-style:none;margin:0;padding:0}
.sn-ls a{display:block;min-width:0}
.sn-ls .th{position:relative;display:block;overflow:hidden;background:#050506;max-width:100%}
.sn-ls .th img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.3) brightness(.85);transition:filter .45s,transform .6s}
.sn-ls .th .nosig{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:500 .6rem/1 var(--mono);font-style:normal;letter-spacing:.2em;color:var(--muted);background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px)}
.sn-ls .th .scan{position:absolute;z-index:2;inset:12%;border:1.5px dashed rgba(236,10,42,.65);transition:inset .3s,border .2s;pointer-events:none}
.sn-ls .th .play{display:none}
.sn-ls a:hover .th img{filter:none;transform:scale(1.03)}
.sn-ls a:hover .th .scan{inset:6px;border-style:solid;box-shadow:0 0 14px rgba(236,10,42,.35)}
.sn-ls .mt{display:flex;flex-wrap:wrap;gap:4px 12px;font:500 .62rem/1.4 var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.sn-ls .mt .cat{color:var(--red2)}
.sn-ls .tt{display:block;font-weight:600;line-height:1.45}
.sn-ls a:hover .tt{color:#fff}
.sn-ls .sm{color:var(--fg2);font-size:.88rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sn-ls .no{font:500 .7rem/1 var(--mono);letter-spacing:.1em;color:var(--red2);font-variant-numeric:tabular-nums}
.sn-ls .rp{font:400 .68rem/1 var(--mono);color:var(--muted)}
.ls-now{display:none}

/* 1. LIST — plain index rows */
.ls-list .sn-ls li{border-bottom:1px solid var(--line)}
.ls-list .sn-ls a{display:grid;grid-template-columns:3em minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:14px 4px;transition:background .15s}
.ls-list .sn-ls a:hover{background:rgba(255,255,255,.03)}
.ls-list .th,.ls-list .sm{display:none}
.ls-list .tx{display:flex;flex-direction:column-reverse;gap:4px;min-width:0}
.ls-list .tt{font-weight:500}

/* 2. PLAYLIST — a tape of intercepted tracks */
.ls-playlist .ls-now{display:flex;align-items:center;gap:14px;margin:0 0 14px;padding:12px 14px;border:1px solid var(--line);background:var(--card);font:500 .66rem/1 var(--mono);letter-spacing:.14em;color:var(--muted)}
.ls-playlist .ls-now b{color:var(--fg);font-weight:600}
.ls-playlist .ls-now .tc{margin-left:auto;color:var(--red2);font-variant-numeric:tabular-nums}
.ls-playlist .eq{display:flex;align-items:flex-end;gap:2px;height:14px}
.ls-playlist .eq i{width:3px;background:var(--red2);animation:sn-eq 1s ease-in-out infinite}
.ls-playlist .eq i:nth-child(2){animation-delay:-.3s}.ls-playlist .eq i:nth-child(3){animation-delay:-.6s}.ls-playlist .eq i:nth-child(4){animation-delay:-.15s}
@keyframes sn-eq{0%,100%{height:20%}50%{height:100%}}
.ls-playlist .sn-ls{counter-reset:none}
.ls-playlist .sn-ls li{border-bottom:1px solid var(--line)}
.ls-playlist .sn-ls a{display:grid;grid-template-columns:2.4em 52px minmax(0,1fr) auto;gap:14px;align-items:center;padding:10px 6px;transition:background .15s}
.ls-playlist .sn-ls a:hover{background:rgba(200,0,28,.08)}
.ls-playlist .th{width:52px;height:52px}
.ls-playlist .th .scan{display:none}
.ls-playlist .th .play{display:flex;position:absolute;inset:0;z-index:3;align-items:center;justify-content:center;background:rgba(0,0,0,.55);color:#fff;font-style:normal;font-size:.9rem;opacity:0;transition:opacity .2s}
.ls-playlist a:hover .th .play{opacity:1}
.ls-playlist .th .nosig{font-size:.44rem;letter-spacing:.06em;text-align:center}
.ls-playlist .no{text-align:right}
.ls-playlist a:hover .no{color:#fff}
.ls-playlist .tx{display:flex;flex-direction:column-reverse;gap:3px;min-width:0}
.ls-playlist .tt{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ls-playlist .sm{display:none}
.ls-playlist .mt .d{order:-1}
.ls-playlist .rp::before{content:"◷ "}

/* 3. WEBZINE — a bulletin: lead story, then rows */
.ls-webzine .sn-ls{display:flex;flex-direction:column;gap:0}
.ls-webzine .sn-ls li{border-bottom:1px solid var(--line)}
.ls-webzine .sn-ls a{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:22px;align-items:center;padding:20px 0}
.ls-webzine .no,.ls-webzine .rp{display:none}
.ls-webzine .th{aspect-ratio:4/3;grid-column:2;grid-row:1}
.ls-webzine .tx{display:flex;flex-direction:column;gap:8px;min-width:0;grid-column:1;grid-row:1}
.ls-webzine .tt{font-size:1.2rem;text-wrap:balance}
.ls-webzine .sm{-webkit-line-clamp:3}
.ls-webzine li:not(.has-th) a{grid-template-columns:minmax(0,1fr)}
.ls-webzine li:not(.has-th) .th{display:none}
.ls-webzine li:first-child a{grid-template-columns:minmax(0,1fr);padding-top:0}
.ls-webzine li:first-child .th{grid-column:1;grid-row:1;aspect-ratio:16/8}
.ls-webzine li:first-child .tx{grid-row:2}
.ls-webzine li:first-child .tt{font-size:clamp(1.4rem,2.6vw,1.9rem)}
.ls-webzine li:first-child .mt::before{content:"LEAD STORY";color:#fff;background:var(--red);padding:2px 6px;letter-spacing:.16em}

/* 4. GALLERY — square evidence photos */
.ls-gallery .sn-ls{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.ls-gallery .sn-ls a{position:relative;aspect-ratio:1/1;overflow:hidden;border:1px solid var(--line)}
.ls-gallery .th{position:absolute;inset:0}
.ls-gallery .no{position:absolute;z-index:4;left:8px;top:8px;background:rgba(8,8,10,.8);padding:4px 6px}
.ls-gallery .tx{position:absolute;z-index:4;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:4px;padding:28px 12px 12px;background:linear-gradient(transparent,rgba(5,5,6,.92));transform:translateY(30%);opacity:0;transition:transform .3s,opacity .3s}
.ls-gallery a:hover .tx,.ls-gallery a:focus-visible .tx{transform:none;opacity:1}
.ls-gallery li:not(.has-th) .tx{transform:none;opacity:1;background:none}
.ls-gallery .tt{font-size:.92rem}
.ls-gallery .sm,.ls-gallery .rp,.ls-gallery .mt .d{display:none}

/* 5. POSTER — 2:3 propaganda posters with captions */
.ls-poster .sn-ls{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:26px 16px}
.ls-poster .sn-ls a{display:flex;flex-direction:column;gap:10px}
.ls-poster .th{aspect-ratio:2/3;border:1px solid var(--line);box-shadow:0 14px 28px rgba(0,0,0,.55);transition:transform .3s}
.ls-poster a:hover .th{transform:translateY(-4px)}
.ls-poster .th .scan{inset:8%}
.ls-poster .no{position:absolute;z-index:4;margin:8px;font-size:.62rem;background:var(--red);color:#fff;padding:3px 6px}
.ls-poster li{position:relative}
.ls-poster .tx{display:flex;flex-direction:column-reverse;gap:4px;min-width:0}
.ls-poster .tt{font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ls-poster .sm,.ls-poster .rp{display:none}

.sn-empty{color:var(--muted);font-family:var(--type);letter-spacing:.06em}

/* ---------- post ---------- */
.sn-post{background:var(--paper);border:1px solid var(--line);padding:clamp(22px,4vw,48px)}
.sn-post-h{margin-bottom:clamp(24px,4vw,40px)}
.sn-post-h .strip{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding-bottom:12px;margin-bottom:22px;border-bottom:1px dashed var(--line2);font:500 .64rem/1 var(--mono);letter-spacing:.2em;color:var(--muted)}
.sn-post-h .stamp{margin-left:auto;font-family:var(--type);font-size:.82rem;letter-spacing:.16em;color:var(--red2);border:1.5px solid var(--red2);padding:3px 9px;transform:rotate(-4deg)}
.sn-post-h .cat{display:inline-block;font:500 .7rem/1 var(--mono);letter-spacing:.16em;color:var(--red2);margin-bottom:12px}
.sn-post-h h1{margin:0;font:700 clamp(1.6rem,3.4vw,2.4rem)/1.3 var(--sans);letter-spacing:-.01em;text-wrap:balance}
.sn-post-h .meta{display:flex;flex-wrap:wrap;gap:4px 18px;margin:14px 0 0;font:400 .7rem/1.5 var(--mono);letter-spacing:.12em;color:var(--muted)}
.sn-post-h .admin{margin:10px 0 0;display:flex;gap:10px;font:500 .7rem/1 var(--mono)}
.sn-post-h .admin a{border:1px solid var(--line2);padding:5px 9px}

/* article body (tistory editor output) */
.sn-body{font-size:1.02rem;line-height:1.95;color:#cfd4da;max-width:72ch}
:where(.sn-body) p{margin:0 0 1.1em}
.sn-body .tt_article_useless_p_margin p{margin:0}
.sn-body.sn-ke h2,.sn-body.sn-ke h3,.sn-body.sn-ke h4{color:#fff;line-height:1.4;margin:2em 0 .7em;text-wrap:balance}
.sn-body.sn-ke h2{font-size:1.45rem;padding-bottom:.4em;border-bottom:1px solid var(--line)}
.sn-body.sn-ke h2::before{content:"§ ";color:var(--red2);font-family:var(--mono)}
.sn-body.sn-ke h3{font-size:1.2rem}
.sn-body.sn-ke h4{font-size:1.05rem;color:var(--fg)}
.sn-body.sn-ke a{color:#fff;border-bottom:1px solid var(--red)}
.sn-body.sn-ke a:hover{background:rgba(200,0,28,.18)}
.sn-body.sn-ke strong,.sn-body.sn-ke b{color:#fff}
.sn-body.sn-ke hr{border:0;border-top:1px dashed var(--line2);margin:2.4em 0}
:where(.sn-body) figure{margin:1.8em 0}
:where(.sn-body) :where(figure img,.imageblock img){display:block;margin:0 auto}
.sn-body.sn-ke figcaption{margin-top:8px;text-align:center;font:400 .72rem/1.5 var(--mono);letter-spacing:.08em;color:var(--muted)}
.sn-body.sn-ke table{width:100%;border-collapse:collapse;font-size:.92rem;margin:1.4em 0;display:block;overflow-x:auto}
.sn-body.sn-ke th,.sn-body.sn-ke td{border:1px solid var(--line2);padding:8px 12px}
.sn-body.sn-ke th{background:rgba(255,255,255,.04);font-family:var(--mono);font-weight:500;letter-spacing:.06em}
.sn-body .another_category{margin-top:3em;border:1px solid var(--line)!important;background:transparent!important;padding:14px 18px!important}
.sn-body .another_category h4{margin:0 0 8px;font-size:.9rem!important;color:var(--fg)!important}
.sn-body .another_category a{border:0;color:var(--fg2)!important}
.sn-body .another_category th,.sn-body .another_category td{border:0!important;padding:4px 0!important;color:var(--muted)!important;background:none!important}
.sn-body .another_category,.sn-body .container_postbtn,.sn-body .postbtn_like,.sn-body .wrap_btn,.sn-body .revenue_unit_wrap,#tt-body-page .tt-comment-cont,#tt-body-page [data-tistory-react-app="Comment"]{display:none!important}

.sn-tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:36px;padding-top:18px;border-top:1px dashed var(--line2)}
.sn-tags .lab{font:500 .64rem/1 var(--mono);letter-spacing:.2em;color:var(--red2);margin-right:4px}
.sn-tags a{font:400 .78rem/1 var(--mono);border:1px solid var(--line2);padding:6px 10px;color:var(--fg2)}
.sn-tags a:hover{border-color:var(--red2);color:#fff}
.sn-tags a::before{content:"#"}

.sn-pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:32px}
.sn-pn a{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);padding:14px 16px;min-width:0}
.sn-pn a:hover{border-color:var(--red2)}
.sn-pn .next{text-align:right;grid-column:2}
.sn-pn small{font:500 .62rem/1 var(--mono);letter-spacing:.16em;color:var(--muted)}
.sn-pn b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.sn-related{margin-top:44px}
.sn-related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.sn-related a{display:flex;flex-direction:column;gap:6px;min-width:0}
.sn-related img{aspect-ratio:4/3;width:100%;object-fit:cover;filter:grayscale(1) contrast(1.3);transition:filter .3s}
.sn-related a:hover img{filter:none}
.sn-related b{font-weight:500;font-size:.9rem;line-height:1.45}
.sn-related small{font:400 .64rem/1 var(--mono);color:var(--muted)}

.sn-comments{margin-top:52px}
.sn-protected .sn-lock p{font-family:var(--type);letter-spacing:.06em;color:var(--fg2)}
.sn-lock .row{display:flex;gap:8px;max-width:420px}
.sn-lock input{flex:1;min-width:0;background:#050506;border:1px solid var(--line2);color:var(--fg);padding:11px 12px;font:400 .85rem var(--mono);letter-spacing:.14em}
.sn-lock button{background:var(--red);border:0;color:#fff;padding:0 18px;font:600 .74rem var(--mono);letter-spacing:.2em}

/* tistory comment / guestbook app (generic) */
.tt-comment-cont,[data-tistory-react-app="Comment"]{color:var(--fg)}
.tt-comment-cont textarea,.tt-comment-cont input[type=text],.tt-comment-cont input[type=password]{background:#050506!important;border:1px solid var(--line2)!important;color:var(--fg)!important;border-radius:0!important}
.tt-comment-cont button,.tt-comment-cont .tt-btn_register{border-radius:0!important}
.tt-comment-cont .tt-btn_register{background:var(--red)!important;color:#fff!important;border:0!important}
.tt-comment-cont .tt-link-user,.tt-comment-cont .tt_desc{color:var(--fg)!important}
.tt-comment-cont .tt_date{color:var(--muted)!important;font-family:var(--mono)}


/* ==========================================================================
   EDITOR BLOCKS — quote · list · link · file · code · 글감 · video
   ========================================================================== */
/* --- quotes: three editor styles, three kinds of record --- */
.sn-body.sn-ke blockquote{margin:1.8em 0;color:var(--fg);font-style:normal}
.sn-body.sn-ke blockquote p{margin:0}
/* style1 · intercepted line: big red quote mark, centered */
.sn-body.sn-ke blockquote,.sn-body.sn-ke blockquote[data-ke-style="style1"]{position:relative;padding:44px 8% 6px;text-align:center;font-size:1.12em;line-height:1.8;border:0;background:none}
.sn-body.sn-ke blockquote[data-ke-style="style1"]::before,.sn-body.sn-ke blockquote:not([data-ke-style])::before{content:"“";position:absolute;left:50%;top:-6px;transform:translateX(-50%);font:700 3.4rem/1 Georgia,serif;color:var(--red2)}
.sn-body.sn-ke blockquote[data-ke-style="style1"]::after,.sn-body.sn-ke blockquote:not([data-ke-style])::after{content:"— INTERCEPTED";display:block;margin-top:14px;font:500 .62rem/1 var(--mono);letter-spacing:.24em;color:var(--muted)}
/* style2 · field note: red rule on the left */
.sn-body.sn-ke blockquote[data-ke-style="style2"]{padding:2px 0 2px 20px;text-align:left;font-size:1em;border-left:3px solid var(--red);color:var(--fg2)}
.sn-body.sn-ke blockquote[data-ke-style="style2"]::before,.sn-body.sn-ke blockquote[data-ke-style="style2"]::after{content:none}
/* style3 · transcript: typed record with a header strip */
.sn-body.sn-ke blockquote[data-ke-style="style3"]{padding:40px 22px 18px;text-align:left;font-size:.98em;border:1px solid var(--line2);background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 30px);font-family:var(--type);letter-spacing:.02em}
.sn-body.sn-ke blockquote[data-ke-style="style3"]::before{content:"TRANSCRIPT · RECORDED 24.XII.1999";position:absolute;left:0;right:0;top:0;padding:8px 22px;border-bottom:1px dashed var(--line2);font:500 .6rem/1 var(--mono);letter-spacing:.2em;color:var(--red2)}
.sn-body.sn-ke blockquote[data-ke-style="style3"]::after{content:none}

/* --- lists --- */
.sn-body.sn-ke ul,.sn-body.sn-ke ol{list-style:none;margin:0 0 1.3em;padding-left:1.9em}
.sn-body.sn-ke li{position:relative;margin:.35em 0}
.sn-body.sn-ke ul>li::before{content:"";position:absolute;left:-1.3em;top:.78em;width:7px;height:7px;background:var(--red2)}
.sn-body.sn-ke ul[data-ke-list-type="circle"]>li::before{background:none;border:1.5px solid var(--red2);width:6px;height:6px}
.sn-body.sn-ke ul[data-ke-list-type="square"]>li::before,.sn-body.sn-ke ul ul>li::before{content:"—";background:none;width:auto;height:auto;top:0;font-family:var(--mono);color:var(--red2)}
.sn-body.sn-ke ol{counter-reset:sn-ol}
.sn-body.sn-ke ol>li{counter-increment:sn-ol}
.sn-body.sn-ke ol>li::before{content:counter(sn-ol,decimal-leading-zero);position:absolute;left:-2em;top:0;font:600 .78rem/1.95rem var(--mono);color:var(--red2);letter-spacing:.04em}
.sn-body.sn-ke ol[data-ke-list-type="lower-alpha"]>li::before{content:"(" counter(sn-ol,lower-alpha) ")"}
.sn-body.sn-ke ol[data-ke-list-type="upper-roman"]>li::before{content:counter(sn-ol,upper-roman) "."}

/* --- link card (opengraph) --- */
.sn-body figure[data-ke-type="opengraph"]{margin:1.8em 0}
.sn-body figure[data-ke-type="opengraph"] a{position:relative;display:flex;align-items:stretch;min-height:132px;border:1px solid var(--line2)!important;background:var(--card);color:var(--fg);text-decoration:none;overflow:hidden}
.sn-body figure[data-ke-type="opengraph"] a:hover{background:#17171c;border-color:var(--red2)!important}
.sn-body figure[data-ke-type="opengraph"] a::after{content:"↗";position:absolute;right:14px;top:10px;font:500 1rem/1 var(--mono);color:var(--red2)}
.sn-body figure[data-ke-type="opengraph"] .og-image{position:relative;flex:0 0 clamp(96px,26%,200px);background-size:cover;background-position:center;filter:grayscale(1) contrast(1.3) brightness(.85);transition:filter .4s;border-right:1px solid var(--line)}
.sn-body figure[data-ke-type="opengraph"] .og-image::after{content:"";position:absolute;inset:12%;border:1.5px dashed rgba(236,10,42,.7);transition:inset .3s}
.sn-body figure[data-ke-type="opengraph"] a:hover .og-image{filter:none}
.sn-body figure[data-ke-type="opengraph"] a:hover .og-image::after{inset:6px;border-style:solid}
.sn-body figure[data-ke-type="opengraph"] .og-image button{display:none}
.sn-body figure[data-ke-type="opengraph"] .og-text{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:18px 40px 18px 20px}
.sn-body figure[data-ke-type="opengraph"] .og-text::before{content:"EXTERNAL RECORD";font:500 .58rem/1 var(--mono);letter-spacing:.22em;color:var(--red2)}
.sn-body figure[data-ke-type="opengraph"] .og-title{margin:0;font:600 1.02rem/1.45 var(--sans);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sn-body figure[data-ke-type="opengraph"] .og-desc{margin:0;font-size:.84rem;line-height:1.55;color:var(--fg2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sn-body figure[data-ke-type="opengraph"] .og-host{margin:0;font:400 .66rem/1 var(--mono);letter-spacing:.12em;color:var(--muted);text-transform:uppercase}

/* --- file attachment --- */
.sn-body figure.fileblock{position:relative;width:min(520px,100%);height:auto;margin:1.6em 0;border:1px solid var(--line2);background:var(--card);box-shadow:none;border-radius:0}
.sn-body figure.fileblock[data-ke-align="alignCenter"]{margin-left:auto;margin-right:auto}
.sn-body figure.fileblock a{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;border:0;color:var(--fg);text-decoration:none}
.sn-body figure.fileblock a:hover{background:rgba(200,0,28,.08)}
.sn-body figure.fileblock .image{float:none;width:44px;height:54px;margin:0;background:none!important;position:relative;border:1.5px solid var(--fg2);clip-path:polygon(0 0,70% 0,100% 22%,100% 100%,0 100%)}
.sn-body figure.fileblock .image::before{content:"";position:absolute;right:-1px;top:-1px;width:30%;height:22%;background:var(--fg2)}
.sn-body figure.fileblock .image::after{content:"FILE";position:absolute;left:0;right:0;bottom:6px;text-align:center;font:600 .5rem/1 var(--mono);letter-spacing:.1em;color:var(--red2)}
.sn-body figure.fileblock .desc{position:static;min-width:0}
.sn-body figure.fileblock .desc::before{content:"ATTACHMENT · EVIDENCE";display:block;margin-bottom:4px;font:500 .56rem/1 var(--mono);letter-spacing:.22em;color:var(--red2)}
.sn-body figure.fileblock .filename{margin:0;height:auto;width:auto}
.sn-body figure.fileblock .name{display:block;max-width:100%;height:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:500 .9rem/1.4 var(--mono);color:#fff}
.sn-body figure.fileblock .size{height:auto;font:400 .7rem/1.4 var(--mono);color:var(--muted);letter-spacing:.08em}
.sn-body figure.fileblock a::after{content:"↓ GET";position:static;width:auto;height:auto;background:var(--red)!important;color:#fff;font:600 .66rem/1 var(--mono);letter-spacing:.16em;padding:9px 11px}

/* --- code block --- */
.sn-body.sn-ke code{font-family:var(--mono);font-size:.88em;background:rgba(236,10,42,.1);color:#ffb0ba;padding:.1em .4em}
.sn-body.sn-ke pre{position:relative;margin:1.8em 0;padding:44px 0 0;background:#040405;border:1px solid var(--line2);overflow:hidden;line-height:1.7}
.sn-body.sn-ke pre::before{content:"● ● ●   TERMINAL — " attr(data-ke-language);position:absolute;left:0;right:0;top:0;padding:10px 14px;border-bottom:1px solid var(--line);font:500 .6rem/1.2 var(--mono);letter-spacing:.2em;color:var(--muted);text-transform:uppercase;background:#0b0b0e}
.sn-body.sn-ke pre:not([data-ke-language])::before{content:"● ● ●   TERMINAL"}
.sn-body.sn-ke pre code,.sn-body.sn-ke pre code.hljs{display:block;padding:16px 18px 18px;overflow-x:auto;background:transparent!important;color:#cfd4da;font:400 .84rem/1.75 var(--mono);white-space:pre}
.sn-body.sn-ke pre code::after{content:"█";color:var(--red2);animation:sn-blink 1s steps(1) infinite;margin-left:2px}
.sn-body.sn-ke .hljs-keyword,.sn-body.sn-ke .hljs-selector-tag,.sn-body.sn-ke .hljs-built_in,.sn-body.sn-ke .hljs-name,.sn-body.sn-ke .hljs-tag{color:#ff3348}
.sn-body.sn-ke .hljs-string,.sn-body.sn-ke .hljs-attr,.sn-body.sn-ke .hljs-symbol,.sn-body.sn-ke .hljs-bullet,.sn-body.sn-ke .hljs-addition{color:#8fc7a7}
.sn-body.sn-ke .hljs-number,.sn-body.sn-ke .hljs-literal,.sn-body.sn-ke .hljs-type,.sn-body.sn-ke .hljs-variable,.sn-body.sn-ke .hljs-template-variable{color:#e8c37a}
.sn-body.sn-ke .hljs-title,.sn-body.sn-ke .hljs-section,.sn-body.sn-ke .hljs-function .hljs-title,.sn-body.sn-ke .hljs-attribute{color:#fff}
.sn-body.sn-ke .hljs-comment,.sn-body.sn-ke .hljs-quote,.sn-body.sn-ke .hljs-meta,.sn-body.sn-ke .hljs-deletion{color:#5d636b;font-style:italic}

/* --- 글감 (content search: book / movie / music cards) --- */
.sn-body figure[data-ke-type="contentSearch"]{position:relative;margin:1.8em 0;border:1px solid var(--line2);background:var(--card);padding:34px 18px 18px;overflow:hidden}
.sn-body figure[data-ke-type="contentSearch"]::before{content:"ARCHIVE REFERENCE · " attr(data-content-type);position:absolute;left:0;right:0;top:0;padding:9px 18px;border-bottom:1px dashed var(--line2);font:500 .58rem/1.2 var(--mono);letter-spacing:.22em;color:var(--red2);text-transform:uppercase}
.sn-body figure[data-ke-type="contentSearch"]:not([data-content-type])::before{content:"ARCHIVE REFERENCE"}
.sn-body figure[data-ke-type="contentSearch"] a{display:flex;gap:18px;align-items:flex-start;border:0;color:var(--fg);text-decoration:none}
.sn-body figure[data-ke-type="contentSearch"] img{flex:0 0 auto;width:96px!important;height:auto!important;max-height:144px;object-fit:cover;filter:grayscale(1) contrast(1.25);border:1px solid var(--line);transition:filter .4s;margin:0}
.sn-body figure[data-ke-type="contentSearch"]:hover img{filter:none}
.sn-body figure[data-ke-type="contentSearch"] p,.sn-body figure[data-ke-type="contentSearch"] span,.sn-body figure[data-ke-type="contentSearch"] div{color:var(--fg2)!important;font-size:.84rem;line-height:1.6;margin:0;background:none!important}
.sn-body figure[data-ke-type="contentSearch"] strong,.sn-body figure[data-ke-type="contentSearch"] [class*="title"]{color:#fff!important;font-size:1.02rem!important;font-weight:600}

/* --- video: a surveillance monitor --- */
.sn-body figure[data-ke-type="video"],.sn-body figure[data-video-host]{position:relative;width:100%;max-width:100%;margin:1.8em 0;padding:30px 0 0;background:#000;border:1px solid var(--line2)}
.sn-body figure[data-ke-type="video"]::before,.sn-body figure[data-video-host]::before{content:"● REC   CAM 06 — " attr(data-video-host);position:absolute;left:0;right:0;top:0;padding:8px 12px;font:500 .6rem/1.2 var(--mono);letter-spacing:.2em;color:var(--red2);text-transform:uppercase;border-bottom:1px solid var(--line);background:#0b0b0e}
.sn-body figure[data-ke-type="video"] iframe,.sn-body figure[data-video-host] iframe{display:block;width:100%!important;height:auto!important;aspect-ratio:16/9;max-width:100%;border:0}
.sn-body figure[data-ke-type="video"]>iframe[width="0"][height="0"]{display:none}
.sn-body figure[data-ke-type="video"]::after{content:"";position:absolute;inset:30px 0 0;pointer-events:none;background:linear-gradient(var(--red2),var(--red2)) left 10px top 10px/18px 2px,linear-gradient(var(--red2),var(--red2)) left 10px top 10px/2px 18px,linear-gradient(var(--red2),var(--red2)) right 10px top 10px/18px 2px,linear-gradient(var(--red2),var(--red2)) right 10px top 10px/2px 18px,linear-gradient(var(--red2),var(--red2)) left 10px bottom 10px/18px 2px,linear-gradient(var(--red2),var(--red2)) left 10px bottom 10px/2px 18px,linear-gradient(var(--red2),var(--red2)) right 10px bottom 10px/18px 2px,linear-gradient(var(--red2),var(--red2)) right 10px bottom 10px/2px 18px;background-repeat:no-repeat;opacity:.8}
.sn-body figure[data-ke-type="video"] figcaption{padding:8px 12px;background:#0b0b0e;border-top:1px solid var(--line);margin:0}
@media (max-width:600px){
  .sn-body figure[data-ke-type="opengraph"] .og-desc{display:none}
  .sn-body figure[data-ke-type="opengraph"] .og-image{flex-basis:92px}
}


/* ==========================================================================
   HOME COVERS
   ========================================================================== */
.sn-covers{display:flex;flex-direction:column;gap:clamp(36px,5vw,56px)}
.cv-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.cv-h .lab{font:500 .64rem/1 var(--mono);letter-spacing:.2em;color:var(--red2)}
.cv-h h2{margin:0;font:600 1.15rem/1.3 var(--sans)}
.cv-h .more{margin-left:auto;font:500 .64rem/1 var(--mono);letter-spacing:.16em;color:var(--muted)}
.cv-h .more:hover{color:var(--red2)}
.cv-items{min-width:0}
.cv-it{display:block;min-width:0;color:var(--fg)}
.cv-th{position:relative;display:block;overflow:hidden;background:#050506;max-width:100%}
.cv-th img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.3) brightness(.85);transition:filter .45s,transform .6s}
.cv-th .nosig{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:500 .6rem/1 var(--mono);font-style:normal;letter-spacing:.2em;color:var(--muted);background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px)}
.cv-th .scan{position:absolute;z-index:2;inset:12%;border:1.5px dashed rgba(236,10,42,.65);transition:inset .3s;pointer-events:none}
a.cv-it:hover .cv-th img,.cv-it[open] .cv-th img{filter:none;transform:scale(1.03)}
a.cv-it:hover .cv-th .scan{inset:6px;border-style:solid}
.cv-tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.cv-tx strong,.cv-it>strong{font-weight:600;line-height:1.45}
a.cv-it:hover strong{color:#fff}
.cv-it .sm{color:var(--fg2);font-size:.88rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cv-meta{display:flex;flex-wrap:wrap;gap:4px 10px;font:500 .62rem/1.4 var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.cv-meta b{color:var(--red2);font-weight:500}
.cv .no{font:500 .7rem/1 var(--mono);color:var(--red2);letter-spacing:.1em;font-variant-numeric:tabular-nums}

/* webzine */
.cv-webzine .cv-items{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:22px 18px}
.cv-webzine .cv-it .cv-th{aspect-ratio:4/3}
.cv-webzine .cv-it{display:flex;flex-direction:column;gap:10px}
.cv-webzine .cv-it:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:center}
.cv-webzine .cv-it:first-child .cv-th{aspect-ratio:16/10}
.cv-webzine .cv-it:first-child strong{font-size:clamp(1.3rem,2.4vw,1.75rem);text-wrap:balance}
.cv-webzine .cv-it:first-child .sm{-webkit-line-clamp:4}
.cv-webzine .cv-it:first-child .cv-meta::before{content:"LEAD";color:#fff;background:var(--red);padding:2px 6px}
.cv-webzine .cv-it:not(:first-child) .sm{display:none}

/* reel */
.cv-reel{position:relative}
.cv-reel .cv-items{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:2px}
.cv-reel .cv-items::-webkit-scrollbar{display:none}
.cv-reel .cv-it{position:relative;flex:0 0 clamp(220px,34%,320px);scroll-snap-align:start;border:1px solid var(--line)}
.cv-reel .cv-th{aspect-ratio:16/10}
.cv-reel .cv-cam{position:absolute;z-index:3;left:8px;top:8px;font:500 .58rem/1 var(--mono);letter-spacing:.16em;color:var(--red2);background:rgba(5,5,6,.75);padding:4px 6px}
.cv-reel .cv-tx{padding:10px 12px}
.cv-reel .cv-tx strong{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-nav{position:absolute;top:0;right:0;display:flex;gap:6px}
.cv-reel .cv-h{padding-right:84px}
.cv-nav button{width:34px;height:26px;background:none;border:1px solid var(--line2);font-size:.6rem}
.cv-nav button:hover{border-color:var(--red2);color:var(--red2)}

/* grid */
.cv-grid .cv-items{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:8px}
.cv-grid .cv-it{position:relative;aspect-ratio:1/1;overflow:hidden;border:1px solid var(--line)}
.cv-grid .cv-th{position:absolute;inset:0}
.cv-grid .cv-tx{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:24px 10px 10px;background:linear-gradient(transparent,rgba(5,5,6,.92));opacity:0;transform:translateY(20%);transition:.3s}
.cv-grid .cv-it:hover .cv-tx,.cv-grid .cv-it:not(.has-th) .cv-tx{opacity:1;transform:none}
.cv-grid .cv-tx strong{font-size:.85rem}

/* accordion */
.cv-accordion .cv-it{border-bottom:1px solid var(--line)}
.cv-accordion summary{display:grid;grid-template-columns:2.6em minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 4px;cursor:pointer;list-style:none}
.cv-accordion summary::-webkit-details-marker{display:none}
.cv-accordion summary strong{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-accordion summary:hover strong{color:#fff}
.cv-accordion .tg{font-style:normal;font-family:var(--mono);color:var(--red2);transition:transform .25s}
.cv-accordion .cv-it[open] .tg{transform:rotate(45deg)}
.cv-accordion .cv-it[open] summary{background:rgba(200,0,28,.07)}
.cv-accordion .cv-panel{display:grid;grid-template-columns:200px minmax(0,1fr);gap:18px;padding:6px 4px 20px calc(2.6em + 16px);animation:sn-drop .3s ease-out}
.cv-accordion .cv-it:not(.has-th) .cv-panel{grid-template-columns:minmax(0,1fr)}
.cv-accordion .cv-it:not(.has-th) .cv-th{display:none}
.cv-accordion .cv-th{aspect-ratio:4/3}
.cv-accordion .sm{-webkit-line-clamp:4}
.cv-accordion .go{align-self:flex-start;margin-top:4px;font:600 .66rem/1 var(--mono);letter-spacing:.16em;color:#fff;background:var(--red);padding:8px 10px}

/* progress */
.cv-progress .cv-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cv-progress .cv-it{border:1px solid var(--line);background:var(--card);padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.cv-progress .cv-it:hover{border-color:var(--line2)}
.cv-pl{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cv-pl strong{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-pl .pct{font:600 1.4rem/1 var(--mono);color:var(--red2);font-variant-numeric:tabular-nums}
.cv-bar{display:block;height:6px;background:repeating-linear-gradient(90deg,var(--line) 0 6px,transparent 6px 8px)}
.cv-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,var(--red2) 0 6px,transparent 6px 8px);transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.cv-st{font:500 .6rem/1 var(--mono);letter-spacing:.18em;color:var(--muted)}
.cv-st em{font-style:normal;color:var(--fg2)}
.cv-progress .done .pct,.cv-progress .done .cv-st em{color:var(--green)}
.cv-progress .done .cv-bar i{background:repeating-linear-gradient(90deg,var(--green) 0 6px,transparent 6px 8px)}

/* dispatch */
.cv-dispatch .cv-it{display:grid;grid-template-columns:2.6em minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:13px 4px;border-bottom:1px solid var(--line)}
.cv-dispatch .cv-it:hover{background:rgba(255,255,255,.03)}
.cv-dispatch .cv-it>strong{font-weight:500}

/* broadcast */
.cv-broadcast .cv-items{display:flex;flex-direction:column;gap:12px}
.cv-broadcast .cv-it{position:relative;padding:clamp(24px,4vw,44px);border:1px solid var(--line2);background:radial-gradient(ellipse at 20% 0%,rgba(200,0,28,.16),transparent 60%),var(--card);overflow:hidden}
.cv-broadcast .cv-it::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px);pointer-events:none}
.cv-on{display:inline-block;font:600 .62rem/1 var(--mono);letter-spacing:.22em;color:#fff;background:var(--red);padding:5px 8px;margin-bottom:14px}
.cv-big{display:block;font:700 clamp(1.5rem,3.6vw,2.6rem)/1.25 var(--mono);text-wrap:balance;margin-bottom:10px}
.cv-broadcast .sm{-webkit-line-clamp:3;font-family:var(--type);letter-spacing:.04em}

/* ==========================================================================
   SIDEBAR WIDGETS
   ========================================================================== */
.sn-links ul{list-style:none;margin:0;padding:0}
.sn-links li{border-bottom:1px solid var(--line)}
.sn-links a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:9px 0}
.sn-links b{font-weight:500;font-size:.88rem}
.sn-links small{grid-column:1;font:400 .64rem/1.2 var(--mono);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-links i{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;color:var(--red2)}
.sn-links a:hover b{color:var(--red2)}

/* reader text size */
.sn-post-h .fs{display:inline-flex;align-items:center;border:1px solid var(--line2);margin-left:auto}
.sn-post-h .fs+.stamp{margin-left:6px}
.sn-post-h .fs button{background:none;border:0;padding:5px 9px;font:600 .66rem/1 var(--mono);letter-spacing:.06em;color:var(--fg2)}
.sn-post-h .fs button:hover{color:var(--red2)}
.sn-post-h .fs-v{min-width:3.6em;text-align:center;font:500 .6rem/1 var(--mono);color:var(--muted);border-left:1px solid var(--line);border-right:1px solid var(--line);padding:5px 0}

@media (max-width:720px){
  .cv-webzine .cv-items{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cv-webzine .cv-it:first-child{grid-template-columns:minmax(0,1fr)}
  .cv-grid .cv-items{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cv-grid .cv-tx{opacity:1;transform:none}
  .cv-reel .cv-it{flex-basis:72%}
  .cv-accordion .cv-panel{grid-template-columns:minmax(0,1fr);padding-left:4px}
  .cv-progress .cv-items{grid-template-columns:minmax(0,1fr)}
  .cv-dispatch .cv-meta span{display:none}
  .sn-post-h .stamp{display:none}
}

/* ---------- tag cloud ---------- */
.sn-cloud .cloud,.sn-tagw .cloud{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline}
.cloud a{font-family:var(--mono);color:var(--fg2)}
.cloud a:hover{color:var(--red2)}
.cloud .cloud1{font-size:1.3rem;color:#fff}.cloud .cloud2{font-size:1.1rem;color:var(--fg)}.cloud .cloud3{font-size:.95rem}.cloud .cloud4{font-size:.85rem}.cloud .cloud5{font-size:.76rem;color:var(--muted)}

/* ---------- paging ---------- */
.sn-paging{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:18px;font:500 .74rem/1 var(--mono);letter-spacing:.12em}
.sn-paging a{border:1px solid var(--line);padding:9px 12px;min-width:38px;text-align:center}
.sn-paging a:hover{border-color:var(--red2)}
.sn-paging .no-more-prev,.sn-paging .no-more-next{opacity:.3;pointer-events:none}
.sn-paging .numbox{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.sn-paging .num .selected{background:none!important;color:inherit;padding:0;border:0}
.sn-paging a.num:has(.selected),.sn-paging a.selected{background:var(--red);border-color:var(--red)!important;color:#fff;pointer-events:none}

/* ---------- sidebar ---------- */
.sn-side{min-width:0;display:flex;flex-direction:column;gap:30px}
.sn-side-x{display:none}
.sn-w h3{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.sn-w h3 span{font:500 .62rem/1 var(--mono);letter-spacing:.2em;color:var(--red2)}
.sn-w h3 b{font:600 .82rem/1 var(--sans);color:var(--fg2)}
.sn-profile .ph{position:relative;display:block;aspect-ratio:1/1;max-width:100%;overflow:hidden;background:#000;border:1px solid var(--line)}
.sn-profile .ph.none{display:none}
.sn-profile img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.3) brightness(.9);transition:filter .4s}
.sn-profile .ph i{position:absolute;inset:12%;border:1.5px dashed rgba(236,10,42,.75);font:500 .6rem/1 var(--mono);font-style:normal;color:var(--red2);display:flex;align-items:flex-end;justify-content:flex-end;padding:6px;transition:inset .3s}
.sn-profile .ph:hover img{filter:none}
.sn-profile .ph:hover i{inset:6px;border-style:solid}
.sn-search .f{display:flex;border:1px solid var(--line2)}
.sn-search input{flex:1;min-width:0;background:transparent;border:0;color:var(--fg);padding:10px 12px;font:400 .78rem var(--mono);letter-spacing:.1em}
.sn-search input:focus{outline:none}
.sn-search .f:focus-within{border-color:var(--red2)}
.sn-search button{background:var(--fg);color:var(--bg);border:0;padding:0 14px;font:600 .68rem var(--mono);letter-spacing:.18em}
.sn-cat summary{list-style:none;cursor:pointer}
.sn-cat summary::-webkit-details-marker{display:none}
.sn-cat summary h3{margin-bottom:0;transition:border-color .2s}
.sn-cat summary:hover h3{border-bottom-color:var(--red2)}
.sn-cat .tg{display:inline-block;width:1.1em;font-style:normal;font-family:var(--mono);color:var(--red2);text-align:center;transition:transform .25s}
.sn-cat[open] .tg{transform:rotate(45deg)}
.sn-cat[open] summary h3{margin-bottom:6px}
.sn-cat-body{animation:sn-drop .3s ease-out}
@keyframes sn-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.sn-cat ul{list-style:none;margin:0;padding:0}
.sn-cat .tt_category>li>a{display:none}
.sn-cat .category_list>li{border-bottom:1px solid var(--line)}
.sn-cat .category_list>li>a{display:flex;justify-content:space-between;padding:9px 0;font-weight:500;font-size:.9rem}
.sn-cat .sub_category_list{padding:0 0 8px 14px}
.sn-cat .sub_category_list a{display:flex;gap:6px;padding:4px 0;font-size:.84rem;color:var(--fg2)}
.sn-cat .sub_category_list .c_cnt{margin-left:auto}
.sn-cat .sub_category_list a::before{content:"└ ";color:var(--muted);font-family:var(--mono)}
.sn-cat a:hover{color:var(--red2)}
.sn-cat .c_cnt{font:400 .7rem/1 var(--mono);color:var(--muted);align-self:center}
.sn-cat img{display:none}
.sn-rlist ul{list-style:none;margin:0;padding:0}
.sn-rlist li{border-bottom:1px solid var(--line)}
.sn-rlist a{display:flex;flex-direction:column;gap:2px;padding:9px 0}
.sn-rlist a:hover b{color:var(--red2)}
.sn-rlist b{font-weight:500;font-size:.88rem;line-height:1.5}
.sn-rlist small{font:400 .64rem/1 var(--mono);color:var(--muted)}
.sn-count dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-family:var(--mono);font-variant-numeric:tabular-nums}
.sn-count dt{font-size:.64rem;letter-spacing:.18em;color:var(--muted);align-self:center}
.sn-count dd{margin:0;text-align:right;font-size:.95rem;color:var(--fg)}
.sn-count dd:first-of-type{color:var(--red2);font-size:1.2rem}

/* ---------- footer ---------- */
.sn-foot{border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.sn-ticker{overflow:hidden;white-space:nowrap;border-bottom:1px solid var(--line);padding:9px 0;font:400 .78rem/1 var(--type);letter-spacing:.16em;color:var(--muted)}
.sn-ticker span{display:inline-block;padding-left:100%;animation:sn-tick 50s linear infinite}
@keyframes sn-tick{to{transform:translateX(-100%)}}
.sn-foot-b{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;max-width:1240px;margin:0 auto;padding:18px var(--g) 26px;font:500 .64rem/1.5 var(--mono);letter-spacing:.16em;color:var(--muted)}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .sn-wrap{grid-template-columns:minmax(0,1fr)}
  .sn-menu{display:inline-block}
  .sn-side{position:fixed;inset:0 0 0 auto;width:min(360px,88vw);z-index:60;background:var(--bg);border-left:1px solid var(--line);padding:64px 22px 40px;overflow-y:auto;transform:translateX(100%);transition:transform .35s cubic-bezier(.6,0,.2,1)}
  html.sn-open .sn-side{transform:none;box-shadow:-30px 0 60px rgba(0,0,0,.7)}
  .sn-side-x{display:block;position:absolute;top:18px;right:18px;background:none;border:1px solid var(--line2);width:34px;height:34px}
}
@media (max-width:720px){
  .sn-top{grid-template-columns:minmax(0,1fr) auto auto}
  .sn-eye{width:36px}
  .sn-clock{display:none}
  .sn-mast{grid-template-columns:minmax(0,1fr)}
  .sn-card-a{grid-template-columns:minmax(0,1fr)}
  .sn-thumb{aspect-ratio:16/9}
  .ls-webzine .sn-ls a{grid-template-columns:minmax(0,1fr) 110px;gap:14px}
  .ls-webzine .tt{font-size:1.02rem}
  .ls-webzine .sm{display:none}
  .ls-gallery .sn-ls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ls-gallery .tx{transform:none;opacity:1}
  .ls-poster .sn-ls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ls-playlist .ls-now span:nth-child(2){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .sn-pn{grid-template-columns:1fr}
  .sn-pn .next{grid-column:auto}
  .g-hud.t span:last-child{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* ==========================================================================
   MODERN LAYER — quieter surfaces, more air, one red accent
   ========================================================================== */
:root{
  --bg:#0b0b0d; --paper:#101013; --card:#131316; --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.16);
  --fg:#ececee; --fg2:#a3a7ae; --muted:#6c7078;
  --r:12px; --r-s:8px;
}
body{font-size:16px;letter-spacing:-.005em;line-height:1.75}
.sn-grain{opacity:.05}

/* labels: lowercase-friendly, less tracking */
.sn-sec-h .lab,.cv-h .lab,.sn-w h3 span,.sn-kicker,.sn-meta,.cv-meta,.sn-ls .mt,.sn-post-h .strip{letter-spacing:.1em}

/* top bar */
.sn-top{background:rgba(11,11,13,.72);border-bottom-color:var(--line);font-weight:500;letter-spacing:.08em;padding-block:14px}
.sn-brand b{font-family:var(--sans);font-weight:700;letter-spacing:-.01em;font-size:.86rem}
.sn-eye{width:40px;color:#d7d9dd}
.sn-menu{border-radius:999px;padding:7px 14px}

/* masthead */
.sn-mast{padding-block:clamp(56px,9vw,120px) clamp(36px,5vw,56px);border-bottom:0}
.sn-mast::before{display:none}
.sn-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.68rem;color:var(--muted);margin-bottom:18px}
.sn-kicker::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red2);box-shadow:0 0 10px var(--red2)}
.sn-title{font-family:var(--sans);font-weight:800;font-size:clamp(2.6rem,6.6vw,5.2rem);line-height:1.02;letter-spacing:-.045em;text-transform:none}
.sn-desc{font-size:1.02rem;margin-top:20px}
.sn-dday{width:min(280px,100%);border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));padding:16px 18px 14px}
.sn-dday .k{font-size:.6rem;letter-spacing:.1em}
.sn-dday .n strong{font-family:var(--sans);font-weight:800;letter-spacing:-.04em}
.sn-dday .bar{height:2px;border-radius:2px;overflow:hidden}
.sn-dday .t{letter-spacing:.06em}

/* layout + section heads */
.sn-wrap{gap:clamp(36px,5vw,72px);padding-top:8px}
.sn-main{gap:28px}
.sn-sec-h,.cv-h{border-bottom:0;padding-bottom:0;margin-bottom:20px;gap:6px 12px}
.sn-sec-h .lab,.cv-h .lab{font-size:.62rem;color:var(--red2)}
.sn-sec-h h2,.cv-h h2{font-size:1.4rem;font-weight:700;letter-spacing:-.025em}
.sn-sec-h .cnt,.cv-h .more{letter-spacing:.08em}
.sn-covers{gap:clamp(48px,6vw,72px)}

/* thumbnails everywhere: rounded, softly desaturated, no dashed boxes */
.sn-thumb,.sn-ls .th,.cv-th,.sn-profile .ph{border-radius:var(--r);border:0}
.sn-thumb .scan,.sn-ls .th .scan,.cv-th .scan,.sn-profile .ph i,.sn-thumb em{display:none}
.sn-thumb img,.sn-ls .th img,.cv-th img,.sn-profile img,.sn-related img{filter:grayscale(.85) contrast(1.05) brightness(.9)}
.sn-card:hover .sn-thumb img,.sn-ls a:hover .th img,a.cv-it:hover .cv-th img,.cv-it[open] .cv-th img,.sn-profile .ph:hover img{filter:none}
.sn-ls .th .nosig,.cv-th .nosig{background:linear-gradient(135deg,#17171b,#0f0f12);letter-spacing:.14em}

/* home cards */
.sn-card{background:transparent;border:0}
.sn-card-a{grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:24px;align-items:center}
.sn-card-b{padding:6px 0}
.sn-card-t{font-size:1.3rem;font-weight:700;letter-spacing:-.02em}
.sn-card+.sn-card{border-top:1px solid var(--line);padding-top:28px}

/* category lists */
.ls-list .sn-ls li,.ls-playlist .sn-ls li,.ls-webzine .sn-ls li{border-bottom-color:var(--line)}
.ls-playlist .ls-now{border-radius:var(--r);border-color:var(--line)}
.ls-playlist .th{border-radius:var(--r-s)}
.ls-gallery .sn-ls a,.ls-poster .th{border-radius:var(--r);border-color:var(--line)}
.ls-gallery .no,.ls-poster .no{border-radius:6px}

/* covers */
.cv-reel .cv-it,.cv-grid .cv-it{border:0;border-radius:var(--r);overflow:hidden}
.cv-reel .cv-tx{padding:12px 2px}
.cv-reel .cv-cam{border-radius:6px}
.cv-nav button{border-radius:999px;width:32px;height:32px}
.cv-accordion .cv-it{border-bottom-color:var(--line)}
.cv-accordion .go{border-radius:999px;padding:9px 14px}
.cv-progress .cv-it,.cv-broadcast .cv-it{border-radius:var(--r);border-color:var(--line)}
.cv-bar,.cv-bar i{border-radius:3px}
.cv-webzine .cv-it:first-child .cv-meta::before,.ls-webzine li:first-child .mt::before{border-radius:4px}
.cv-big{font-family:var(--sans);font-weight:800;letter-spacing:-.035em}

/* post */
.sn-post{background:transparent;border:0;padding:0}
.sn-post-h{padding-bottom:28px;margin-bottom:36px;border-bottom:1px solid var(--line)}
.sn-post-h .strip{border-bottom:0;padding-bottom:0;margin-bottom:26px;font-size:.62rem}
.sn-post-h .stamp{transform:none;border-radius:999px;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;padding:5px 10px;border-width:1px}
.sn-post-h .fs{border-radius:999px;border-color:var(--line2);overflow:hidden}
.sn-post-h h1{font-weight:800;font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.22;letter-spacing:-.035em}
.sn-post-h .meta{letter-spacing:.06em;margin-top:18px}
.sn-body{color:#d9dbe0;line-height:1.95}
.sn-body.sn-ke h2{border-bottom:0;padding-bottom:0;font-weight:700;letter-spacing:-.02em}
.sn-body.sn-ke h2::before{content:"";display:inline-block;width:8px;height:8px;margin:0 12px .2em 0;border-radius:2px;background:var(--red2)}
.sn-body figure img,.sn-body .imageblock img{border-radius:var(--r)}
.sn-body figure[data-ke-type="opengraph"] a,.sn-body figure.fileblock,.sn-body.sn-ke pre,.sn-body figure[data-ke-type="contentSearch"],.sn-body figure[data-ke-type="video"],.sn-body figure[data-video-host],.sn-body.sn-ke blockquote[data-ke-style="style3"]{border-radius:var(--r);border-color:var(--line2)!important;overflow:hidden}
.sn-body figure[data-ke-type="opengraph"] .og-image::after{display:none}
.sn-body figure.fileblock a::after,.sn-body .cv-on{border-radius:999px}
.sn-body.sn-ke pre::before{background:#0d0d10}
.sn-body.sn-ke code{border-radius:5px}
.sn-protected .sn-lock input,.sn-lock button{border-radius:var(--r-s)}

/* sidebar */
.sn-side{gap:36px}
.sn-w h3{border-bottom:0;padding-bottom:0;margin-bottom:14px}
.sn-w h3 b{font-size:.8rem;color:var(--muted);font-weight:600}
.sn-search .f{border-radius:999px;overflow:hidden;border-color:var(--line2)}
.sn-search input{padding:11px 16px;letter-spacing:.04em}
.sn-search button{border-radius:999px;margin:4px;padding:0 14px}
.sn-cat .category_list>li{border-bottom-color:var(--line)}
.sn-links li{border-bottom-color:var(--line)}

/* paging + footer */
.sn-paging a{border-radius:var(--r-s);border-color:var(--line)}
.sn-ticker{font-size:.72rem;letter-spacing:.12em;opacity:.7}
.sn-foot-b{letter-spacing:.1em}

@media (max-width:720px){
  .sn-card-a{grid-template-columns:minmax(0,1fr);gap:14px}
  .sn-title{font-size:clamp(2.2rem,11vw,3rem)}
}


/* ==========================================================================
   SUB-CATEGORY TOGGLE
   ========================================================================== */
.sn-cat .category_list>li{position:relative}
.sn-cat .category_list>li.has-sub>a{padding-right:34px}
.sn-cat .sc-tg{position:absolute;right:-6px;top:6px;width:30px;height:30px;border:0;background:none;border-radius:50%;transition:background .2s}
.sn-cat .sc-tg:hover{background:rgba(255,255,255,.06)}
.sn-cat .sc-tg i,.sn-cat .sc-tg i::after{position:absolute;left:50%;top:50%;width:10px;height:1.5px;margin:-.75px 0 0 -5px;background:var(--fg2);transition:transform .3s cubic-bezier(.6,0,.2,1),background .2s}
.sn-cat .sc-tg i::after{content:"";left:0;margin:0;top:0;transform:rotate(90deg)}
.sn-cat .sc-open .sc-tg i{background:var(--red2);transform:rotate(180deg)}
.sn-cat .sc-open .sc-tg i::after{transform:rotate(0);background:var(--red2)}
.sn-cat .category_list>li.has-sub>a .c_cnt{margin-right:4px}
.sn-cat .sc-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.6,0,.2,1)}
.sn-cat .sc-open .sc-wrap{grid-template-rows:1fr}
.sn-cat .sc-inner{overflow:hidden;min-height:0}
.sn-cat .sc-wrap .sub_category_list{opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .35s}
.sn-cat .sc-open .sc-wrap .sub_category_list{opacity:1;transform:none;transition-delay:.06s}
.sn-cat .sub_category_list a{transition:color .2s,padding-left .25s}
.sn-cat .sub_category_list a:hover{padding-left:6px}
.sn-cat .sub_category_list a.here{color:var(--red2)}
.sn-cat .category_list>li>a{transition:color .2s}

/* ==========================================================================
   MOTION
   ========================================================================== */
@keyframes sn-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes sn-fade{from{opacity:0}to{opacity:1}}
/* page load */
.sn-top{animation:sn-fade .6s ease-out both}
.sn-title{animation:sn-rise .9s cubic-bezier(.2,.8,.2,1) both .1s}
.sn-desc{animation:sn-rise .9s cubic-bezier(.2,.8,.2,1) both .22s}
.sn-kicker{animation:sn-fade .8s ease-out both}
.sn-dday .bar i{transition:width 1.6s cubic-bezier(.2,.8,.2,1) .4s}
/* scroll reveal (only when JS marks .rv) */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0ms)}
.rv.in{opacity:1;transform:none}
/* hover */
.sn-card-a,.cv-it,.sn-ls a,.sn-pn a,.sn-related a{transition:transform .35s cubic-bezier(.2,.8,.2,1),background .2s,border-color .2s}
.sn-card:hover .sn-card-a{transform:translateX(4px)}
.ls-gallery .sn-ls a:hover,.ls-poster .sn-ls a:hover,.cv-grid .cv-it:hover,.cv-reel .cv-it:hover{transform:translateY(-4px)}
.sn-card-t,.cv-tx strong,.sn-ls .tt{background:linear-gradient(var(--red2),var(--red2)) 0 100%/0 1.5px no-repeat;transition:background-size .4s cubic-bezier(.2,.8,.2,1),color .2s}
.sn-card:hover .sn-card-t,a.cv-it:hover .cv-tx strong,.sn-ls a:hover .tt{background-size:100% 1.5px}
.sn-paging a,.sn-search button,.sn-menu,.cv-nav button,.sn-post-h .fs button{transition:transform .2s,background .2s,border-color .2s,color .2s}
.sn-paging a:not(.no-more-prev):not(.no-more-next):hover,.cv-nav button:hover{transform:translateY(-2px)}
.sn-paging a:active,.sn-search button:active,.cv-nav button:active,.sn-post-h .fs button:active{transform:scale(.94)}
.sn-eye{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.sn-top:hover .sn-eye{transform:scale(1.08)}
.sn-brand b{background:linear-gradient(var(--red2),var(--red2)) 0 100%/0 1px no-repeat;transition:background-size .35s}
.sn-brand:hover b{background-size:100% 1px}
.sn-dday{transition:border-color .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.sn-dday:hover{border-color:rgba(236,10,42,.45);transform:translateY(-3px)}
.sn-cat-body{animation:sn-drop .35s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}


/* ==========================================================================
   PROFILE CARD (twitter-style)
   ========================================================================== */
.sn-profile .pf{margin-top:16px}
.sn-profile .pf p{margin:0}
.pf-name{display:flex;align-items:center;gap:5px;min-width:0}
.pf-nick{font:800 1.18rem/1.3 var(--sans);letter-spacing:-.02em;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-check{flex:0 0 auto;width:19px;height:19px;fill:var(--red2);filter:drop-shadow(0 0 6px rgba(236,10,42,.45))}
.pf-check .tick{fill:#fff}
.sn-profile .pf .pf-handle{margin-top:1px;font:400 .82rem/1.4 var(--sans);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-profile .pf .pf-bio{margin-top:12px;font-size:.9rem;line-height:1.65;color:var(--fg2);word-break:keep-all}
.sn-profile .ph{animation:none}
.pf-check{animation:sn-pop .5s cubic-bezier(.3,1.6,.5,1) both .5s}
@keyframes sn-pop{from{transform:scale(0) rotate(-30deg)}to{transform:none}}

/* ==========================================================================
   RED SCROLLBAR
   ========================================================================== */
html{scrollbar-color:var(--red) var(--bg);scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--red);border-radius:10px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--red2)}
::-webkit-scrollbar-corner{background:var(--bg)}
.sn-side{scrollbar-color:var(--red) transparent}


/* ==========================================================================
   HERO IMAGE (netflix-style)
   ========================================================================== */
.sn-hero{position:relative;isolation:isolate;overflow:hidden}
.sn-hero-bg{position:absolute;inset:0;z-index:-2}
.sn-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;animation:sn-kenburns 18s ease-out both}
@keyframes sn-kenburns{from{transform:scale(1.08)}to{transform:scale(1)}}
.sn-hero[data-pos="top"] .sn-hero-bg img{object-position:center 20%}
.sn-hero[data-pos="bottom"] .sn-hero-bg img{object-position:center 80%}
.sn-hero[data-pos="right"] .sn-hero-bg img{object-position:right center}
.sn-hero[data-pos="left"] .sn-hero-bg img{object-position:left center}
.sn-hero[data-tone="mono"] .sn-hero-bg img{filter:grayscale(1) contrast(1.1)}
.sn-hero[data-tone="red"] .sn-hero-bg img{filter:grayscale(1) contrast(1.15) brightness(.9)}
.sn-hero[data-tone="red"] .sn-hero-bg::after{content:"";position:absolute;inset:0;background:var(--red);mix-blend-mode:multiply;opacity:.85}
/* the shade only exists when there is an image */
.sn-hero-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;display:none}
.sn-hero:has(.sn-hero-bg) .sn-hero-shade{display:block;background:
  linear-gradient(90deg,rgba(11,11,13,.92) 0%,rgba(11,11,13,.72) 32%,rgba(11,11,13,.2) 62%,rgba(11,11,13,0) 80%),
  linear-gradient(0deg,var(--bg) 0%,rgba(11,11,13,.55) 22%,rgba(11,11,13,0) 52%),
  linear-gradient(180deg,rgba(11,11,13,.65) 0%,rgba(11,11,13,0) 22%)}
.sn-hero:has(.sn-hero-bg) .sn-mast{min-height:clamp(440px,72vh,760px);align-items:end;padding-top:clamp(120px,18vh,200px)}
.sn-hero:has(.sn-hero-bg) .sn-title{text-shadow:0 2px 30px rgba(0,0,0,.45)}
.sn-hero:has(.sn-hero-bg) .sn-desc{color:#d6d8dc;text-shadow:0 1px 16px rgba(0,0,0,.6)}
.sn-hero:has(.sn-hero-bg) .sn-dday{background:rgba(11,11,13,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:rgba(255,255,255,.12)}
.sn-hero:has(.sn-hero-bg)+.sn-wrap{margin-top:-8px}
@media (max-width:720px){
  .sn-hero:has(.sn-hero-bg) .sn-hero-shade{background:linear-gradient(0deg,var(--bg) 0%,rgba(11,11,13,.82) 38%,rgba(11,11,13,.35) 70%,rgba(11,11,13,.55) 100%)}
  .sn-hero:has(.sn-hero-bg) .sn-mast{min-height:0;padding-top:clamp(180px,40vh,300px)}
}
@media (prefers-reduced-motion:reduce){.sn-hero-bg img{animation:none}}
.sn-hero:has(.sn-hero-bg) .sn-kicker{color:#c9ccd1;text-shadow:0 1px 10px rgba(0,0,0,.7)}


/* ==========================================================================
   BROADCAST BANNER WITH IMAGE
   ========================================================================== */
.cv-broadcast .cv-it{isolation:isolate;min-height:clamp(220px,28vw,320px);display:flex;flex-direction:column;justify-content:center}
.cv-broadcast .cv-bg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.cv-broadcast .cv-bg img{width:100%;height:100%;object-fit:cover;object-position:right center;display:block;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.cv-broadcast .cv-it:hover .cv-bg img{transform:scale(1.04)}
.cv-broadcast .cv-it:has(.cv-bg){background:var(--card)}
.cv-broadcast .cv-it:has(.cv-bg)::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(90deg,rgba(11,11,13,.96) 0%,rgba(11,11,13,.85) 28%,rgba(11,11,13,.35) 58%,rgba(11,11,13,0) 82%),
  linear-gradient(0deg,rgba(11,11,13,.5) 0%,rgba(11,11,13,0) 40%)}
.cv-broadcast .cv-it:has(.cv-bg) .cv-big,.cv-broadcast .cv-it:has(.cv-bg) .sm{max-width:min(560px,62%);text-shadow:0 2px 18px rgba(0,0,0,.6)}
.cv-broadcast .cv-it:has(.cv-bg) .sm{color:#d0d3d8}
.cv-on{align-self:flex-start}
@media (max-width:720px){
  .cv-broadcast .cv-it:has(.cv-bg)::before{background:linear-gradient(0deg,rgba(11,11,13,.95) 0%,rgba(11,11,13,.7) 45%,rgba(11,11,13,.2) 100%)}
  .cv-broadcast .cv-it:has(.cv-bg){justify-content:flex-end;min-height:300px}
  .cv-broadcast .cv-it:has(.cv-bg) .cv-big,.cv-broadcast .cv-it:has(.cv-bg) .sm{max-width:100%}
}

/* ==========================================================================
   HIDE TISTORY FLOATING MENU (the round ⋮ button, top right)
   Blog admin is still reachable at  내블로그주소/manage
   ========================================================================== */
#menubar,#menubar_wrapper,.menu_toolbar,.tt_menubar,.btn_menu_toolbar,#tistorytoolbarid,.tistory_toolbar,div[id^="tistory-toolbar"]{display:none!important}
.cv-broadcast .cv-on{border-radius:999px;padding:6px 12px}


/* ==========================================================================
   PLAYLIST DRAWER (fixed, left edge)
   ========================================================================== */
.sn-pl{--plw:min(300px,86vw);position:fixed;left:0;top:calc(76px + env(safe-area-inset-top,0px));z-index:55;width:var(--plw);max-height:calc(100vh - 100px);display:flex;transform:translateX(0);transition:transform .55s cubic-bezier(.7,0,.2,1)}
.sn-pl.closed{transform:translateX(calc(-100% + 30px))}
.sn-pl.no-anim,.sn-pl.no-anim *{transition:none!important}
.pl-box{flex:1;min-width:0;overflow-y:auto;scrollbar-width:thin;background:rgba(13,13,16,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line2);border-left:0;border-radius:0 var(--r) var(--r) 0;padding:16px 16px 14px;box-shadow:20px 0 50px rgba(0,0,0,.5)}
.pl-h{display:flex;flex-direction:column;gap:3px;margin-bottom:12px}
.pl-h .lab{display:flex;align-items:center;gap:7px;font:500 .58rem/1 var(--mono);letter-spacing:.18em;color:var(--red2)}
.pl-h .rec{width:7px;height:7px;border-radius:50%;background:var(--muted)}
.sn-pl.is-playing .pl-h .rec{background:var(--red2);box-shadow:0 0 8px var(--red2);animation:sn-blink 1s steps(1) infinite}
.pl-h b{font:700 1rem/1.35 var(--sans);letter-spacing:-.01em;color:#fff}
.pl-meta{font:400 .6rem/1 var(--mono);letter-spacing:.14em;color:var(--muted)}
.pl-screen{position:relative;aspect-ratio:16/9;max-width:100%;border-radius:var(--r-s);overflow:hidden;background:#050506;border:1px solid var(--line)}
.pl-screen::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px)}
.pl-frame,.pl-frame iframe{position:absolute;inset:0;width:100%!important;height:100%!important;border:0}
.pl-idle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.pl-idle small{font:500 .56rem/1 var(--mono);letter-spacing:.2em;color:var(--muted)}
.pl-idle .reel{display:flex;gap:18px}
.pl-idle .reel i{width:26px;height:26px;border-radius:50%;border:2px solid var(--line2);position:relative;animation:sn-spin 3s linear infinite}
.pl-idle .reel i::after{content:"";position:absolute;inset:7px;border-radius:50%;border:2px dashed var(--muted)}
@keyframes sn-spin{to{transform:rotate(360deg)}}
.pl-stamp{position:absolute;right:8px;top:8px;z-index:2;font:600 .5rem/1 var(--mono);letter-spacing:.16em;color:var(--red2);border:1px solid var(--red2);border-radius:999px;padding:3px 6px;background:rgba(5,5,6,.7);pointer-events:none}
.sn-pl.is-playing .pl-stamp{display:none}
.pl-now{display:flex;align-items:center;gap:10px;margin:12px 0 8px;min-width:0}
.pl-now .t{font:500 .74rem/1.4 var(--mono);color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-now .eq{display:flex;align-items:flex-end;gap:2px;height:12px;flex:0 0 auto}
.pl-now .eq i{width:3px;height:30%;background:var(--muted)}
.sn-pl.is-playing .pl-now .eq i{background:var(--red2);animation:sn-eq 1s ease-in-out infinite}
.sn-pl.is-playing .pl-now .eq i:nth-child(2){animation-delay:-.3s}.sn-pl.is-playing .pl-now .eq i:nth-child(3){animation-delay:-.6s}.sn-pl.is-playing .pl-now .eq i:nth-child(4){animation-delay:-.15s}
.pl-ctl{display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:12px}
.pl-ctl button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:none;font-size:.62rem;letter-spacing:-.1em;color:var(--fg2);transition:transform .2s,background .2s,color .2s,border-color .2s}
.pl-ctl button:hover{color:#fff;border-color:var(--fg2)}
.pl-ctl button:active{transform:scale(.92)}
.pl-ctl .pp{width:46px;height:46px;background:var(--red);border-color:var(--red);color:#fff;font-size:.86rem;letter-spacing:0}
.pl-ctl .pp:hover{background:var(--red2);border-color:var(--red2)}
.pl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.pl-list li{border-bottom:1px solid var(--line)}
.pl-list button{display:grid;grid-template-columns:1.8em 46px minmax(0,1fr);gap:10px;align-items:center;width:100%;padding:8px 2px;background:none;border:0;text-align:left;transition:background .2s}
.pl-list button:hover{background:rgba(255,255,255,.04)}
.pl-list .n{font:500 .64rem/1 var(--mono);color:var(--muted)}
.pl-list .th{display:block;width:46px;aspect-ratio:16/9;border-radius:4px;overflow:hidden;background:#050506}
.pl-list .th img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.8);transition:filter .3s}
.pl-list .nm{font-size:.82rem;line-height:1.4;color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-list button:hover .th img,.pl-list li.on .th img{filter:none}
.pl-list li.on .n{color:var(--red2)}
.pl-list li.on .nm{color:#fff;font-weight:600}
.pl-foot{margin:10px 0 0;font:400 .54rem/1 var(--mono);letter-spacing:.18em;color:var(--muted);text-align:center}
/* the tab that stays on the edge */
.pl-tab{flex:0 0 auto;align-self:flex-start;margin-top:18px;display:flex;flex-direction:column;align-items:center;gap:10px;width:30px;padding:12px 0;background:var(--red);border:0;border-radius:0 8px 8px 0;color:#fff;box-shadow:6px 4px 16px rgba(0,0,0,.4);transition:background .2s,width .2s}
.pl-tab:hover{background:var(--red2);width:34px}
.pl-tab .ar{font-size:.58rem}
.pl-tab .tx{writing-mode:vertical-rl;font:600 .58rem/1 var(--mono);letter-spacing:.24em}
.sn-pl.closed.is-playing .pl-tab .ar::after{content:"";display:block;width:6px;height:6px;margin:6px auto 0;border-radius:50%;background:#fff;animation:sn-blink 1s steps(1) infinite}
@media (max-width:720px){.sn-pl{top:auto;bottom:calc(16px + env(safe-area-inset-bottom,0px));max-height:70vh}.pl-tab{align-self:flex-end;margin:0 0 18px}}
@media (prefers-reduced-motion:reduce){.sn-pl{transition:none}.pl-idle .reel i{animation:none}}

/* on wide screens the open drawer pushes the page over instead of covering it */
.sn-mast,.sn-wrap,.sn-foot-b{transition:margin .55s cubic-bezier(.7,0,.2,1),max-width .55s cubic-bezier(.7,0,.2,1)}
@media (min-width:1500px){
  html.has-pl:not(.pl-closed) .sn-mast,html.has-pl:not(.pl-closed) .sn-wrap,html.has-pl:not(.pl-closed) .sn-foot-b{margin-left:max(350px,calc((100% - 1240px)/2));margin-right:max(24px,calc((100% - 1240px)/2 - 330px))}
}


/* ==========================================================================
   RED CURSORS — reticle / target lock / I-beam
   ========================================================================== */
html,body{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cg fill='none' stroke='%23000' stroke-opacity='.55' stroke-width='3.5'%3E%3Ccircle cx='14' cy='14' r='7'/%3E%3Cpath d='M14 1v7M14 20v7M1 14h7M20 14h7'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ec0a2a' stroke-width='1.6'%3E%3Ccircle cx='14' cy='14' r='7'/%3E%3Cpath d='M14 1v7M14 20v7M1 14h7M20 14h7'/%3E%3C/g%3E%3Ccircle cx='14' cy='14' r='1.8' fill='%23ec0a2a'/%3E%3C/svg%3E") 14 14,crosshair}
a,button,summary,label,[role="button"],.sn-pl .pl-list button,.cv-it,.g-fig.red,select{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='%23000' stroke-opacity='.55' stroke-width='3.5'%3E%3Cpath d='M4 11V4h7M21 4h7v7M28 21v7h-7M11 28H4v-7'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ec0a2a' stroke-width='2'%3E%3Cpath d='M4 11V4h7M21 4h7v7M28 21v7h-7M11 28H4v-7'/%3E%3C/g%3E%3Ccircle cx='16' cy='16' r='5' fill='%23ec0a2a' stroke='%23000' stroke-opacity='.5'/%3E%3C/svg%3E") 16 16,pointer!important}
input[type="text"],input[type="password"],input[type="search"],textarea,.sn-body p,.sn-body li,.sn-body blockquote,.sn-body h2,.sn-body h3,.sn-body td{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='24' viewBox='0 0 16 24'%3E%3Cpath d='M4 2h8M8 2v20M4 22h8' fill='none' stroke='%23000' stroke-opacity='.55' stroke-width='3.5'/%3E%3Cpath d='M4 2h8M8 2v20M4 22h8' fill='none' stroke='%23ec0a2a' stroke-width='1.6'/%3E%3C/svg%3E") 8 12,text}
.sn-body a,.sn-body button{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='%23000' stroke-opacity='.55' stroke-width='3.5'%3E%3Cpath d='M4 11V4h7M21 4h7v7M28 21v7h-7M11 28H4v-7'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ec0a2a' stroke-width='2'%3E%3Cpath d='M4 11V4h7M21 4h7v7M28 21v7h-7M11 28H4v-7'/%3E%3C/g%3E%3Ccircle cx='16' cy='16' r='5' fill='%23ec0a2a' stroke='%23000' stroke-opacity='.5'/%3E%3C/svg%3E") 16 16,pointer!important}
/* trailing lock-on ring (fine pointers only) */
.sn-ring{position:fixed;left:0;top:0;z-index:120;width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid rgba(236,10,42,.55);border-radius:50%;pointer-events:none;opacity:0;transition:width .25s,height .25s,margin .25s,border-color .25s,opacity .3s,background .25s}
.sn-ring.on{opacity:1}
.sn-ring.hot{width:52px;height:52px;margin:-26px 0 0 -26px;border-color:var(--red2);background:rgba(236,10,42,.08)}
.sn-ring.down{width:22px;height:22px;margin:-11px 0 0 -11px;background:rgba(236,10,42,.25)}
@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.sn-ring{display:none}}


/* profile photo shape */
.sn-profile .ph.circle{border-radius:50%;width:min(220px,78%);margin:4px auto 0;box-shadow:0 0 0 1px var(--line2),0 0 0 6px var(--bg),0 0 0 7px rgba(236,10,42,.55)}
.sn-profile .ph.circle img{border-radius:50%}
.sn-profile .ph.circle~.pf{text-align:center}
.sn-profile .ph.circle~.pf .pf-name{justify-content:center}
.sn-profile .ph.square{border-radius:var(--r)}

/* ===== 마크다운·HTML 모드 글: 스킨이 인용구·글씨 효과를 덧입히지 않음 =====
   기본 모드(에디터)로 쓴 글에만 .sn-ke가 붙어 스킨 효과가 적용됩니다.
   그 밖의 글은 읽기 좋은 기본값만 남기고(:where로 우선순위 0), 직접 쓴 태그·클래스·인라인 스타일이 항상 이깁니다. */
:where(.sn-body:not(.sn-ke)) a{color:inherit;text-decoration:underline;text-underline-offset:2px}
:where(.sn-body:not(.sn-ke)) blockquote{margin:1em 0 1em 2em;padding:0;border:0;background:none;text-align:inherit;font-size:inherit}
:where(.sn-body:not(.sn-ke)) ul{list-style:disc;padding-left:2em}
:where(.sn-body:not(.sn-ke)) ol{list-style:decimal;padding-left:2em}
:where(.sn-body:not(.sn-ke)) pre{overflow-x:auto}
:where(.sn-body:not(.sn-ke)) img{max-width:100%;height:auto}
:where(.sn-body:not(.sn-ke)) table{border-collapse:collapse}

/* ==========================================================================
   EXCERPT IMAGE (PC): drag text in a post → quote card PNG
   ========================================================================== */
.sn-ex-btn{position:fixed;z-index:70;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;background:#0e0e11;border:1px solid var(--red2);color:var(--fg);font:600 .78rem/1 var(--sans);letter-spacing:.02em;box-shadow:0 8px 22px rgba(0,0,0,.55);animation:sn-ex-pop .18s ease-out}
.sn-ex-btn[hidden]{display:none}
.sn-ex-btn i{width:7px;height:7px;border-radius:50%;background:var(--red2)}
.sn-ex-btn:hover{background:var(--red2);color:#fff}
.sn-ex-btn:hover i{background:#fff}
@keyframes sn-ex-pop{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
html.sn-ex-open{overflow:hidden}
.sn-ex{position:fixed;inset:0;z-index:110;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.sn-ex[hidden]{display:none}
.sn-ex-box{width:min(940px,100%);max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line2);box-shadow:0 30px 80px rgba(0,0,0,.7)}
.sn-ex-h{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.sn-ex-h .lab{font:500 .62rem/1 var(--mono);letter-spacing:.22em;color:var(--red2)}
.sn-ex-h b{font:700 .95rem/1.2 var(--sans);color:#fff}
.sn-ex-x{margin-left:auto;width:32px;height:32px;background:none;border:1px solid var(--line2);color:var(--fg2)}
.sn-ex-x:hover{border-color:var(--red2);color:#fff}
.sn-ex-main{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:22px;padding:20px;min-height:0;overflow:auto}
.sn-ex-pv{display:flex;align-items:center;justify-content:center;min-height:0;background:repeating-linear-gradient(45deg,#101013 0 8px,#0c0c0f 8px 16px);border:1px solid var(--line);padding:14px}
.sn-ex-pv canvas{display:block;max-width:100%;max-height:min(560px,calc(100vh - 220px));width:auto;height:auto;box-shadow:0 10px 30px rgba(0,0,0,.6)}
.sn-ex-set{display:flex;flex-direction:column;gap:16px}
.sn-ex-set .k{display:block;margin-bottom:7px;font:500 .62rem/1 var(--mono);letter-spacing:.18em;color:var(--muted)}
.sn-ex-set .seg{display:flex;border:1px solid var(--line2)}
.sn-ex-set .seg button{flex:1;padding:9px 4px;background:none;border:0;color:var(--fg2);font:500 .8rem/1 var(--sans)}
.sn-ex-set .seg button+button{border-left:1px solid var(--line2)}
.sn-ex-set .seg button:hover{color:#fff;background:rgba(255,255,255,.04)}
.sn-ex-set .seg button[aria-pressed="true"]{color:#fff;background:rgba(236,10,42,.14);box-shadow:inset 0 -2px 0 var(--red2);font-weight:700}
.sn-ex-set .note{margin:0;font:400 .76rem/1.6 var(--sans);color:var(--muted)}
.sn-ex-set .note.ok{color:var(--red2)}
.sn-ex-set .acts{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.sn-ex-set .acts button{height:42px;border:1px solid var(--red2);font:700 .84rem/1 var(--sans)}
.sn-ex-set .save{background:var(--red2);color:#fff}
.sn-ex-set .save:hover{background:var(--red)}
.sn-ex-set .copy{background:none;color:var(--fg)}
.sn-ex-set .copy:hover{background:rgba(236,10,42,.12)}
.sn-ex-set .copy[hidden]{display:none}
.sn-ex-set .seg.sz{align-items:stretch}
.sn-ex-set .seg.sz .v{flex:1.6;display:flex;align-items:center;justify-content:center;border-left:1px solid var(--line2);border-right:1px solid var(--line2);font:500 .74rem/1 var(--mono);color:#fff;font-variant-numeric:tabular-nums}
.sn-ex-set .seg.sz .v+button{border-left:0}
@media (max-width:899px),(hover:none),(pointer:coarse){.sn-ex-btn{display:none!important}}

/* ==========================================================================
   PROFILE: small photo beside the name
   ========================================================================== */
.sn-profile{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:14px;align-items:center}
.sn-profile .ph img{background:transparent}
.sn-profile>h3{grid-column:1/-1}
.sn-profile .ph,.sn-profile .ph.circle{grid-column:1;grid-row:2/span 2;width:76px;height:76px;margin:0;aspect-ratio:auto;background:transparent;border:0}
.sn-profile .ph.circle{box-shadow:0 0 0 1px var(--line2),0 0 0 4px var(--bg),0 0 0 5px rgba(236,10,42,.55)}
.sn-profile .pf{display:contents}
.sn-profile .pf .pf-name{grid-column:2;grid-row:2;align-self:end;margin:0 0 1px}
.sn-profile .pf .pf-handle{grid-column:2;grid-row:3;align-self:start;margin:0}
.sn-profile .pf .pf-bio{grid-column:1/-1;grid-row:4;margin-top:14px}
.sn-profile .ph.none~.pf .pf-name,.sn-profile .ph.none~.pf .pf-handle{grid-column:1/-1}
.sn-profile .ph.circle~.pf{text-align:left}
.sn-profile .ph.circle~.pf .pf-name{justify-content:flex-start}

/* ==========================================================================
   COVER · FEATURE — one big story: title, large photo, caption; the rest as rows
   ========================================================================== */
.cv-feature .cv-items{display:flex;flex-direction:column}
.cv-feature .cv-it{display:flex;flex-direction:column;gap:18px;color:var(--fg)}
.cv-feature .cv-it:first-child .ft-t{font:700 clamp(1.25rem,2.2vw,1.55rem)/1.35 var(--sans);letter-spacing:-.02em;color:#fff;text-wrap:balance}
.cv-feature .cv-it:first-child .cv-th{position:relative;display:block;aspect-ratio:auto;height:auto;border-radius:var(--r);overflow:hidden;background:transparent}
.cv-feature .cv-it:first-child:not(.has-th) .cv-th{display:none}
.cv-feature .cv-it:first-child .cv-th img{width:100%;height:auto;max-width:100%;object-fit:initial;display:block}
/* the photo keeps its own shape, so the 'no image' stripes are never needed underneath it */
.cv-feature .cv-it:first-child.has-th .cv-th .nosig{display:none}
.cv-feature .cv-it:first-child:hover .cv-th img{transform:none}
.cv-feature .cv-it:first-child .sm{font-size:1.02rem;line-height:1.85;color:var(--fg2);display:block;-webkit-line-clamp:unset;overflow:visible}
.cv-feature .cv-it:first-child .cv-meta{order:-1;margin-bottom:-8px}
.cv-feature .cv-it:first-child:hover .ft-t{color:var(--red2)}
.cv-feature .cv-it:nth-child(2){margin-top:30px;border-top:1px solid var(--line)}
.cv-feature .cv-it:not(:first-child){display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px;row-gap:3px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cv-feature .cv-it:not(:first-child) .cv-th{grid-column:1;grid-row:1/3;width:64px;height:64px;border-radius:var(--r-s);overflow:hidden;background:#000}
.cv-feature .cv-it:not(:first-child) .cv-th img{width:100%;height:100%;object-fit:cover}
.cv-feature .cv-it:not(:first-child) .ft-t{grid-column:2;grid-row:1;align-self:end;font:600 .98rem/1.4 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-feature .cv-it:not(:first-child) .cv-meta{grid-column:2;grid-row:2;align-self:start}
.cv-feature .cv-it:not(:first-child) .sm{display:none!important}
.cv-feature .cv-it:not(:first-child):not(.has-th){grid-template-columns:minmax(0,1fr)}
.cv-feature .cv-it:not(:first-child):not(.has-th) .cv-th{display:none}
.cv-feature .cv-it:not(:first-child):not(.has-th) .ft-t,.cv-feature .cv-it:not(:first-child):not(.has-th) .cv-meta{grid-column:1}
.cv-feature .cv-it:not(:first-child):hover .ft-t{color:var(--red2)}

/* ==========================================================================
   COVER · CASE BOXES — boxed accordion, one open at a time
   ========================================================================== */
.cv-casebox .cv-items{display:flex;flex-direction:column;gap:14px}
.cv-casebox .cv-it{border:1px solid var(--line);background:var(--paper);border-radius:var(--r-s);overflow:hidden;transition:border-color .2s}
.cv-casebox .cv-it:hover{border-color:var(--line2)}
.cv-casebox summary{display:flex;align-items:center;gap:18px;padding:20px 24px;cursor:pointer;list-style:none;transition:background .2s}
.cv-casebox summary::-webkit-details-marker{display:none}
.cv-casebox summary strong{flex:1;min-width:0;font:600 1rem/1.55 var(--sans);color:var(--fg);transition:color .2s}
.cv-casebox .chev{flex:0 0 auto;width:9px;height:9px;margin-top:-4px;border-right:1.8px solid var(--fg2);border-bottom:1.8px solid var(--fg2);transform:rotate(45deg);transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .2s,margin .3s}
.cv-casebox summary:hover strong{color:#fff}
.cv-casebox .cv-it[open]{border-color:var(--line2)}
.cv-casebox .cv-it[open] summary{background:rgba(255,255,255,.035);border-bottom:1px solid var(--line)}
.cv-casebox .cv-it[open] summary strong{color:var(--red2)}
.cv-casebox .cv-it[open] .chev{transform:rotate(-135deg);margin-top:4px;border-color:var(--red2)}
.cv-casebox .cb-body{display:flex;flex-direction:column;gap:14px;padding:22px 24px 24px;animation:sn-drop .3s ease-out}
.cv-casebox .cb-body .sm{margin:0;font-size:.98rem;line-height:1.85;color:var(--fg2);display:block;-webkit-line-clamp:unset;overflow:visible;white-space:pre-line}
.cv-casebox .go{align-self:flex-start;font:600 .7rem/1 var(--mono);letter-spacing:.12em;color:var(--red2);border-bottom:1px solid currentColor;padding-bottom:3px}
.cv-casebox .go:hover{color:#fff}
@media (max-width:720px){
  .cv-casebox summary{padding:16px 18px}
  .cv-casebox .cb-body{padding:18px}
}

/* ==========================================================================
   DECORATIVE MOTION (skin option "꾸밈 애니메이션"; off for reduced motion)
   ========================================================================== */
/* decoding text keeps a steady width while glyphs scramble */
.fx .fx-dec{font-variant-numeric:tabular-nums}
.fx .sn-title a.fx-dec{color:#e9ecef;text-shadow:2px 0 0 rgba(236,10,42,.55),-2px 0 0 rgba(120,200,255,.18)}

/* masthead: blinking cursor after the description, slow red pulse on the title */
.fx .sn-desc::after{content:"▌";margin-left:6px;color:var(--red2);animation:sn-blink 1.05s steps(1) infinite}
.fx .sn-title a{animation:fx-breathe 7s ease-in-out infinite 1.6s}
@keyframes fx-breathe{0%,100%{text-shadow:0 0 0 rgba(236,10,42,0)}50%{text-shadow:0 0 28px rgba(236,10,42,.22)}}

/* section heads: a red rule draws in from the left */
.fx .cv-h,.fx .sn-sec-h{position:relative}
.fx .cv-h::after,.fx .sn-sec-h::after{content:"";position:absolute;left:0;bottom:-1px;width:min(160px,40%);height:1px;background:var(--red2);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.8,.2,1) .15s}
.fx .cv-h.fx-in::after,.fx .sn-sec-h.fx-in::after{transform:scaleX(1)}
.fx .cv-h .lab::before,.fx .sn-sec-h .lab::before{content:"";display:inline-block;width:6px;height:6px;margin:0 8px 1px 0;border-radius:50%;background:var(--red2);vertical-align:middle;animation:sn-blink 1.6s steps(1) infinite}

/* reading progress */
.fx-progress{position:fixed;left:0;top:0;z-index:95;width:100%;height:2px;background:linear-gradient(90deg,var(--red),var(--red2));transform:scaleX(0);transform-origin:left;pointer-events:none;box-shadow:0 0 10px rgba(236,10,42,.6)}

/* a faint CRT sweep travels down the screen now and then */
.fx-sweep{position:fixed;left:0;right:0;top:-30vh;z-index:89;height:30vh;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(255,255,255,.028) 60%,rgba(236,10,42,.05) 98%,transparent);animation:fx-sweep 11s linear infinite 2s}
@keyframes fx-sweep{0%{transform:translateY(0)}35%,100%{transform:translateY(160vh)}}

/* film grain shivers */
.fx .sn-grain{animation:fx-grain .9s steps(5) infinite}
@keyframes fx-grain{0%{transform:translate(0,0)}20%{transform:translate(-1.5%,1%)}40%{transform:translate(1%,-1.5%)}60%{transform:translate(-1%,-.5%)}80%{transform:translate(1.5%,1%)}100%{transform:translate(0,0)}}

/* thumbnails: lock-on corner brackets on hover */
.fx .cv-th,.fx .sn-thumb,.fx .sn-ls .th{position:relative}
.fx .cv-th::before,.fx .sn-thumb::before,.fx .sn-ls .th::before{content:"";position:absolute;inset:14px;z-index:3;pointer-events:none;opacity:0;transition:inset .35s cubic-bezier(.2,.8,.2,1),opacity .25s;
  background:
   linear-gradient(var(--red2),var(--red2)) left top/14px 1.5px,linear-gradient(var(--red2),var(--red2)) left top/1.5px 14px,
   linear-gradient(var(--red2),var(--red2)) right top/14px 1.5px,linear-gradient(var(--red2),var(--red2)) right top/1.5px 14px,
   linear-gradient(var(--red2),var(--red2)) left bottom/14px 1.5px,linear-gradient(var(--red2),var(--red2)) left bottom/1.5px 14px,
   linear-gradient(var(--red2),var(--red2)) right bottom/14px 1.5px,linear-gradient(var(--red2),var(--red2)) right bottom/1.5px 14px;background-repeat:no-repeat}
.fx a:hover .cv-th::before,.fx .cv-it[open] .cv-th::before,.fx a:hover .sn-thumb::before,.fx .sn-ls a:hover .th::before{inset:7px;opacity:1}

/* post stamp slams down; red pulse on the record dot */
.fx .sn-post-h .stamp{animation:fx-stamp .55s cubic-bezier(.2,1.6,.4,1) both .7s}
@keyframes fx-stamp{0%{opacity:0;transform:scale(2.4) rotate(-14deg)}60%{opacity:1}100%{opacity:1;transform:scale(1) rotate(-4deg)}}
.fx .sn-brand .r{animation:fx-pulse 1.8s ease-in-out infinite;text-shadow:0 0 8px rgba(236,10,42,.8)}
@keyframes fx-pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* D-day number flickers once like a tube warming up */
.fx .sn-dday .n strong{animation:fx-tube 1.4s steps(1) both .4s}
@keyframes fx-tube{0%{opacity:0}10%{opacity:1}14%{opacity:.2}20%{opacity:1}26%{opacity:.4}32%,100%{opacity:1}}

/* sidebar + list rows: a red bar slides in on hover */
.fx .sn-cat a,.fx .sn-ls .it a,.fx .cv-dispatch .cv-it{background-image:linear-gradient(90deg,rgba(236,10,42,.14),transparent);background-repeat:no-repeat;background-size:0 100%;transition:background-size .35s cubic-bezier(.2,.8,.2,1)}
.fx .sn-cat a:hover,.fx .sn-ls .it a:hover,.fx .cv-dispatch .cv-it:hover{background-size:100% 100%}

/* case boxes: chevron nudges, open body slides */
.fx .cv-casebox summary:hover .chev{margin-top:0}
.fx .cv-casebox .cv-it[open] .cb-body{animation:fx-open .45s cubic-bezier(.2,.8,.2,1)}
@keyframes fx-open{from{opacity:0;transform:translateY(-8px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}

@media (prefers-reduced-motion:reduce){.fx-sweep,.fx-progress{display:none}}

/* ==========================================================================
   COVER · MESSAGES — an intercepted chat log. received: left/grey, replies: right/red
   ========================================================================== */
.msg-log{border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(180deg,rgba(255,255,255,.018),transparent 30%),var(--paper);overflow:hidden}
.msg-bar{display:flex;justify-content:space-between;gap:10px;padding:11px 18px;border-bottom:1px solid var(--line);font:500 .6rem/1 var(--mono);letter-spacing:.2em;color:var(--muted)}
.msg-bar i{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--red2);vertical-align:1px;animation:sn-blink 1.4s steps(1) infinite}
.msg-list{display:flex;flex-direction:column;gap:6px;padding:20px 18px 22px}
.msg{display:flex;align-items:flex-end;gap:10px;max-width:100%}
.msg.cont{margin-top:-2px}
.msg .av{flex:0 0 auto;width:34px;height:34px;border-radius:50%;overflow:hidden;background:#1c1c22;display:flex;align-items:center;justify-content:center;font:600 .8rem/1 var(--sans);color:var(--fg2)}
.msg .av img{width:100%;height:100%;object-fit:cover;display:block}
.msg.cont .av{visibility:hidden;height:0}
.msg .bx{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:min(78%,520px)}
.msg .who{font:500 .66rem/1 var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase;padding:0 4px}
.msg.cont .who,.msg.anon .who{display:none}
.msg .bub{margin:0;padding:11px 15px;font-size:.95rem;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere;border-radius:18px;white-space:normal}
/* received */
.msg.them .bub{background:#1b1b21;color:var(--fg);border:1px solid var(--line);border-bottom-left-radius:5px}
.msg.them.cont .bub{border-top-left-radius:6px}
/* replies (mine) */
.msg.me{flex-direction:row-reverse;align-self:flex-end}
.msg.me .bx{align-items:flex-end}
.msg.me .av{display:none}
.msg.me .bub{background:var(--red);color:#fff;border:1px solid var(--red);border-bottom-right-radius:5px;box-shadow:0 6px 18px rgba(200,0,28,.22)}
.msg.me.cont .bub{border-top-right-radius:6px}
.msg.has-link .bub{cursor:pointer;transition:filter .2s,transform .2s}
.msg.has-link .bub:hover{filter:brightness(1.15);transform:translateY(-1px)}
.msg.has-link .bub::after{content:" ↗";opacity:.6;font-size:.8em}
/* typing reveal */
.msg-wait .msg:not(.typing):not(.shown){display:none}
.msg.shown{animation:msg-in .38s cubic-bezier(.2,.9,.3,1.2) both}
.msg.me.shown{transform-origin:right bottom}
@keyframes msg-in{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
.msg.typing .bub{display:flex;gap:5px;align-items:center;padding:14px 16px}
.msg.typing .bub i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.4;animation:msg-dot 1s ease-in-out infinite}
.msg.typing .bub i:nth-child(2){animation-delay:.15s}.msg.typing .bub i:nth-child(3){animation-delay:.3s}
.msg.typing .av{visibility:hidden}
@keyframes msg-dot{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-4px);opacity:1}}
@media (max-width:720px){.msg .bx{max-width:84%}.msg-list{padding:16px 12px 18px}}
.cv-msg .msg.rv{opacity:1;transform:none;transition:none}
/* messages: bubbles only — no sender name, no profile photo */
.cv-msg .msg .who,.cv-msg .msg .av{display:none!important}
.cv-msg .msg.cont{margin-top:-1px}
.cv-msg .msg:not(.cont){margin-top:6px}
.cv-msg .msg:first-child{margin-top:0}