/* LUCENTA WEEKLY — 주간 차트 지면
   위계는 크기가 아니라 반전·무게·괘선이 만든다. 색은 등락에만 산다. */

:root{
  --ink:#14161c; --paper:#f1f2ee; --rule:#cbcec6; --soft:#e5e7e1;
  --muted:#54585f; --up:#c22f16; --down:#17399b;
  --band:22px; --gut:clamp(1.1rem,4vw,2.4rem); --max:64rem;
  --t:15.5px; --lh:1.72;
}
:root:not([data-theme="light"]){ color-scheme:light dark; }
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ink:#eef0ea; --paper:#131519; --rule:#2f333a; --soft:#1c1f26;
    --muted:#9ba1a9; --up:#ff6b49; --down:#93a9ff;
  }
}
[data-theme="dark"]{
  --ink:#eef0ea; --paper:#131519; --rule:#2f333a; --soft:#1c1f26;
  --muted:#9ba1a9; --up:#ff6b49; --down:#93a9ff;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:var(--t)/var(--lh) Archivo,"Gothic A1",system-ui,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased;
  text-underline-offset:.18em; text-decoration-thickness:from-font;
}
::selection{background:var(--ink);color:var(--paper);}
:focus-visible{outline:2.5px solid var(--up);outline-offset:2px;}
*{scrollbar-color:var(--rule) transparent;scrollbar-width:thin;}
::-webkit-scrollbar{height:9px;width:9px;}
::-webkit-scrollbar-thumb{background:var(--rule);}
::-webkit-scrollbar-track{background:transparent;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}

/* ── 제호 밴드 ─────────────────────────────────────────────── */
.mast{background:var(--ink);color:var(--paper);}
.mast-in{
  max-width:var(--max);margin:0 auto;padding:1.15rem var(--gut) 1rem;
  display:grid;grid-template-columns:1fr auto auto;align-items:end;gap:.4rem 1.5rem;
}
.mh-id{display:flex;flex-direction:column;gap:.18rem;min-width:0;}
.mh-site{
  font-weight:700;font-size:1.06rem;letter-spacing:.13em;text-transform:uppercase;
  color:inherit;text-decoration:none;white-space:nowrap;
}
.mh-beat{color:var(--paper);opacity:.62;font-size:.8rem;letter-spacing:.02em;}
.mh-dates{display:flex;flex-direction:column;align-items:flex-end;gap:.1rem;font-size:.8rem;opacity:.78;white-space:nowrap;}
.mh-obs{opacity:.72;}
.mh-issue{display:flex;align-items:flex-start;gap:.1em;line-height:.82;}
.mh-no{font-size:.9rem;font-weight:600;opacity:.6;padding-top:.35em;}
.mh-n{font-size:clamp(2.9rem,8.5vw,4.6rem);font-weight:700;letter-spacing:-.045em;}

/* ── 부문 레일 ─────────────────────────────────────────────── */
.rail{
  position:sticky;top:0;z-index:20;
  background:var(--paper);border-bottom:1px solid var(--rule);
}
.rail-in{
  max-width:var(--max);margin:0 auto;padding:.55rem var(--gut);
  display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;
}
.rail-lab{font-size:.72rem;letter-spacing:.16em;color:var(--muted);text-transform:uppercase;margin-right:.35rem;}
.chip{
  display:inline-flex;align-items:center;gap:.42rem;
  font:inherit;font-size:.83rem;font-weight:500;
  background:none;color:var(--ink);cursor:pointer;
  border:1px solid var(--rule);border-radius:2px;padding:.26rem .55rem;
  transition:background .14s ease-out,border-color .14s ease-out;
}
.chip:hover:not(:disabled){background:var(--soft);border-color:var(--muted);}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.chip:disabled{opacity:.38;cursor:default;}
.chip-sw{width:9px;height:9px;display:block;flex:none;}
.chip-sw svg{width:100%;height:100%;display:block;}
.chip-n{font-size:.74rem;color:var(--muted);font-weight:600;}
.chip[aria-pressed="true"] .chip-n{color:var(--paper);opacity:.7;}
.chip-clear{margin-left:auto;color:var(--muted);border-style:dashed;}

/* ── 지면 ──────────────────────────────────────────────────── */
.sheet{max-width:var(--max);margin:0 auto;padding:0 var(--gut) 3rem;}
.issue-title{
  font-size:clamp(1.5rem,4vw,2.1rem);font-weight:700;letter-spacing:-.03em;
  line-height:1.22;margin:2rem 0 0;text-wrap:balance;
}
.stand{margin:.85rem 0 0;max-width:44rem;color:var(--muted);}
.stand p{margin:.5rem 0;}
.stand strong{color:var(--ink);font-weight:600;}

/* 절 — 크기가 아니라 전폭 반전이 위계를 만든다 */
.sec{margin-top:2.6rem;transition:opacity .18s ease-out;}
.sec-h{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:var(--ink);color:var(--paper);
  margin:0 calc(var(--gut) * -1);padding:.5rem var(--gut);
  font-size:var(--t);font-weight:700;letter-spacing:.02em;
}
.sec-t{min-width:0;}
.sec-tag{
  display:inline-flex;align-items:center;gap:.36rem;flex:none;
  font-size:.76rem;font-weight:500;opacity:.72;letter-spacing:.05em;
}
.sec-sw{width:8px;height:8px;display:block;}
.sec-sw svg{width:100%;height:100%;display:block;}
.sec-b{padding-top:1.15rem;}
.sec-b>*:first-child{margin-top:0;}
.sec-b p,.sec-b li{max-width:44rem;overflow-wrap:break-word;}
.sec-b p{margin:.9rem 0;}
.sec-b h3{
  font-size:var(--t);font-weight:700;margin:2rem 0 .6rem;
  padding-bottom:.3rem;border-bottom:1px solid var(--rule);max-width:44rem;
}
.sec-b ul,.sec-b ol{padding-left:1.15rem;margin:.9rem 0;}
.sec-b li{margin:.3rem 0;}
.sec-b li::marker{color:var(--muted);}
.sec-b strong{font-weight:700;}
.sec-b a{color:var(--ink);text-decoration-color:var(--rule);}
.sec-b a:hover{text-decoration-color:var(--up);color:var(--up);}
.sec-b hr{border:0;border-top:1px solid var(--rule);margin:2rem 0;}
.sec-b code{background:var(--soft);padding:.1em .34em;border-radius:2px;font-size:.9em;}

/* 필터 — 이 지면의 유일한 연출 */
body[data-bumon] .sec[data-bumon]:not([data-bumon="all"]){opacity:.26;}
body[data-bumon="draw"] .sec[data-bumon="draw"],
body[data-bumon="make"] .sec[data-bumon="make"],
body[data-bumon="sell"] .sec[data-bumon="sell"]{opacity:1;}
body[data-bumon] .sec[data-bumon]:not([data-bumon="all"]) .sec-h{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule);}
body[data-bumon="draw"] .sec[data-bumon="draw"] .sec-h,
body[data-bumon="make"] .sec[data-bumon="make"] .sec-h,
body[data-bumon="sell"] .sec[data-bumon="sell"] .sec-h{background:var(--ink);color:var(--paper);box-shadow:none;}
@media (prefers-reduced-motion:reduce){*{transition:none !important;}}

/* ── 차트표 ────────────────────────────────────────────────── */
.chart-wrap,.grid-wrap{overflow-x:auto;margin:1.2rem 0;}
.chart{width:100%;border-collapse:collapse;min-width:26rem;}
.chart thead th{
  font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);text-align:left;padding:0 .6rem .45rem;
  border-bottom:1.5px solid var(--ink);white-space:nowrap;
}
.chart tbody tr{border-bottom:1px solid var(--rule);}
.chart tbody tr:hover{background:var(--soft);}
.chart td{padding:.62rem .6rem;vertical-align:baseline;}
.c-rank{width:1%;padding-left:0 !important;}
.rank{
  font-size:2rem;font-weight:700;letter-spacing:-.05em;line-height:1;
  display:block;min-width:1.6ch;
}
.c-name{font-weight:600;}
.c-val{color:var(--muted);white-space:nowrap;}
.c-delta{width:1%;white-space:nowrap;text-align:right;padding-right:0 !important;}
.d-mark{display:inline-block;width:9px;height:8px;margin-right:.34em;vertical-align:baseline;}
.d-mark svg{width:100%;height:100%;display:block;}
.d-num{font-weight:600;}
.d-up{color:var(--up);}
.d-down{color:var(--down);}
.d-flat{color:var(--muted);}
.d-new .d-num{
  font-size:.72rem;font-weight:700;letter-spacing:.1em;
  background:var(--ink);color:var(--paper);padding:.16em .45em;border-radius:2px;
}

/* 일반 표 */
.grid{width:100%;border-collapse:collapse;min-width:22rem;font-size:var(--t);}
.grid th,.grid td{padding:.55rem .7rem;text-align:left;border-bottom:1px solid var(--rule);}
.grid th{
  font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);border-bottom:1.5px solid var(--ink);white-space:nowrap;
}
.grid td:not(:first-child){color:var(--muted);white-space:nowrap;}
.grid tbody tr:hover{background:var(--soft);}

/* 콜아웃 — 근거의 상태를 형태로 드러낸다 */
.note{
  margin:1.3rem 0;padding:.75rem .95rem;max-width:44rem;
  background:var(--soft);border:1px solid var(--rule);
}
.note p{margin:.35rem 0;}
.note p:first-of-type{display:inline;}
.n-tag{
  display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-right:.6rem;
}
.n-gap{border-style:dashed;}
.n-gap .n-tag{color:var(--up);}

/* ── 지난 호 ───────────────────────────────────────────────── */
.index{padding-top:1.6rem;}
.ix{
  display:grid;grid-template-columns:7.5rem 1fr;gap:0 1.4rem;
  padding:1.1rem 0;border-bottom:1px solid var(--rule);
  text-decoration:none;color:inherit;
}
.ix:first-child{border-top:1.5px solid var(--ink);}
.ix:hover{background:var(--soft);}
.ix-meta{display:flex;flex-direction:column;gap:.1rem;color:var(--muted);font-size:.8rem;}
.ix-no{font-size:1.5rem;font-weight:700;color:var(--ink);letter-spacing:-.04em;line-height:1;}
.ix-body{display:flex;flex-direction:column;gap:.22rem;min-width:0;}
.ix-t{font-weight:600;letter-spacing:-.01em;}
.ix-s{color:var(--muted);}
.is-latest .ix-t::after{
  content:"최신";font-size:.68rem;font-weight:700;letter-spacing:.12em;
  background:var(--ink);color:var(--paper);padding:.15em .45em;margin-left:.6rem;
  border-radius:2px;vertical-align:.12em;
}
.empty{color:var(--muted);}

.foot{max-width:var(--max);margin:0 auto;padding:0 var(--gut) 4rem;}
.foot a{color:var(--muted);font-size:.85rem;text-decoration-color:var(--rule);}
.foot a:hover{color:var(--up);}

@media (max-width:32rem){
  :root{--t:15px;}
  .mast-in{grid-template-columns:1fr auto;}
  .mh-dates{grid-column:1;align-items:flex-start;}
  .mh-issue{grid-row:1/3;grid-column:2;align-self:center;}
  .rank{font-size:1.65rem;}
  .ix{grid-template-columns:1fr;gap:.35rem;}
  .ix-meta{flex-direction:row;align-items:baseline;gap:.6rem;}
}

/* 라벨/값 행 — 목록이 아니라 두 칸이다 */
.sec-b ul:has(> li.def){list-style:none;padding-left:0;max-width:46rem;}
li.def{
  display:grid;grid-template-columns:minmax(6rem,11rem) 1fr;gap:0 1.1rem;
  padding:.5rem 0;border-bottom:1px solid var(--rule);margin:0;
}
li.def:first-child{border-top:1px solid var(--rule);}
.def-t{font-weight:700;}
.def-t strong,.def-t a{font-weight:700;}
.def-t a{color:var(--ink);text-decoration-color:var(--rule);}
.def-d{color:var(--muted);min-width:0;}
.def-d strong{color:var(--ink);font-weight:600;}
@media (max-width:32rem){
  li.def{grid-template-columns:1fr;gap:.15rem;}
}

/* 인용 — 원문과 출처를 붙여 쓰지 않는다 */
.sec-b ul:has(> li.cite){list-style:none;padding-left:0;max-width:46rem;}
li.cite{
  display:block;margin:0;padding:.7rem 0 .7rem .95rem;
  border-left:1px solid var(--rule);
}
li.cite + li.cite{border-top:1px solid var(--rule);}
.q{display:block;}
.src{display:block;margin-top:.3rem;font-size:.82rem;color:var(--muted);}
.src a{color:var(--muted);text-decoration-color:var(--rule);}
.src a:hover{color:var(--up);}
