#pane-read {
    /* 값은 base.css 한 곳에 있다. 여기서는 이름만 이어 붙인다.
       예전엔 같은 색을 세 파일에 베껴 적어서, 한 곳만 고치면 탭 사이가 갈라졌다. */
    --brand:var(--c-brand); --brand-ink:var(--c-brand-d); --brand-600:var(--c-brand-d);
    --brand-100:#F6E6C6; --brand-50:var(--c-brand-50);
    --stamp:#2B3A67; --stamp-100:#E4E8F2;
    --paper:var(--c-bg); --paper-2:var(--c-soft); --card:var(--c-bg);
    --ink:var(--c-ink); --ink-2:var(--c-ink2); --ink-3:var(--c-ink3);
    --line:var(--c-line); --line-2:#DFE3E9;
    --green:var(--c-good);
    --shadow-sm:var(--sh-sm);
    --shadow-md:var(--sh-md);
    --shadow-lg:var(--sh-md);
    --mono:var(--mono); --fn:var(--fn); --ease:var(--ease);
    --canvas-w:480px;
  }
/* 좌우 여백은 main.wrap 한 곳에서만 준다.
   여기서 또 주면 홈은 16px, 매거진·지도는 32px 로 들여쓰여 같은 화면으로 안 읽힌다.
   그래서 이 안에서 쓰는 --pad 는 0 이다 (--pad 를 쓰는 자리들은 바깥 wrap 이 이미 벌려 준다). */
#pane-read { --pad:0; }

#pane-read * { box-sizing:border-box; margin:0; padding:0; }
  @media (prefers-reduced-motion: reduce){
#pane-read * { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }}

/* ⚠️ 바로 위 리셋은 `#pane-read *` 라 특정도가 (1,0,1) 이다.
   base.css 의 공통 부품 `.phead`·`.seg2` 는 (0,1,0) 이라 여기에 눌린다 —
   그래서 매거진 안에서만 제목·세그먼트의 여백이 통째로 0 이 되어
   "발리 매거진" 바로 밑에 검색창이 달라붙고 화면이 어수선해졌다 (2026.8.8 실제로 겪음).
   리셋을 지우면 h1·p·ul 의 브라우저 기본 여백이 되살아나 더 크게 틀어지므로,
   리셋은 그대로 두고 공통 부품만 같은 특정도로 되돌린다.
   base.css 에서 이 값들을 바꾸면 여기도 같이 고쳐야 한다. */
#pane-read .phead { padding:20px 0 12px; }
#pane-read .seg2 { padding:4px; margin:2px 0 14px; }
#pane-read .seg2 button { padding:10px 8px; }
  @media (min-width:820px){
#pane-read .phead { padding:26px 0 14px; }}
#pane-read html, #pane-read body { height:100%; }
#pane-read body {
    font-family:var(--fn); background:var(--paper-2); color:var(--ink);
    letter-spacing:-.01em; -webkit-font-smoothing:antialiased; line-height:1.5;
  }
#pane-read img { max-width:100%; display:block; }
#pane-read h1, #pane-read h2, #pane-read h3, #pane-read p, #pane-read .title, #pane-read .name { word-break:keep-all; overflow-wrap:break-word; }
#pane-read a { color:inherit; }
#pane-read button { font-family:inherit; }
#pane-read .canvas {
    max-width:var(--canvas-w); margin:0 auto; background:var(--paper);
    min-height:100vh; position:relative; overflow:hidden;
    padding-bottom:40px;
  }

  @media(min-width:820px){
#pane-read { --canvas-w:1180px; }
#pane-read .canvas { padding-bottom:40px; }}
/* 머리는 공통 .phead 하나를 쓴다 (base.css). 앱바·큰 제목 세 겹은 없앴다. */
#pane-read .phead p { max-width:44ch; }
/* 검색창은 홈·지도와 같은 .sbox (unified.css). 여기서는 자리만 잡는다.
   예전엔 매거진만 다른 모양이었고, 돋보기를 눌러야 펼쳐져 있는 줄도 몰랐다. */
#pane-read .search-wrap { padding:2px 0 12px; }
/* 한 줄로 흐르게 한다. 줄바꿈으로 두면 12개가 3줄이 되어 첫 화면의 3분의 1을 먹었다. */
#pane-read .chip-row { display:flex; flex-wrap:nowrap; gap:7px; padding:2px 0 12px;
    overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
#pane-read .chip-row::-webkit-scrollbar { display:none; }
#pane-read .chip {
    flex:0 0 auto; display:flex; align-items:center; gap:5px; font-size:12.5px; font-weight:700;
    padding:8px 14px; border-radius:var(--r-pill); border:1px solid var(--line); background:#fff; color:var(--ink-2);
    cursor:pointer; white-space:nowrap; transition:background .15s, color .15s, border-color .15s;
  }
#pane-read .chip.active { background:var(--ink); border-color:var(--ink); color:#fff; }
#pane-read .chip.soon { background:var(--paper-2); color:var(--ink-3); border-style:dashed; }
#pane-read .chip.soon .spark { font-size:10.5px; }
#pane-read .boarding { margin:4px 20px 8px; border-radius:var(--r-lg); overflow:hidden; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-lg); text-decoration:none; display:block; color:inherit; }
#pane-read .row-section { padding:22px 0 4px; }
#pane-read .row-head { display:flex; align-items:baseline; justify-content:space-between; padding:0 var(--pad); margin-bottom:10px; }
#pane-read .row-head h3 { font-size:15px; font-weight:800; }
/* margin-left 가 없으면 제목에 그대로 달라붙어 "핫이슈10건" 으로 읽힌다.
   위쪽 `#pane-read *` 리셋이 margin 을 0 으로 만들기 때문에 여기서 명시해야 한다. */
#pane-read .row-head .count { font-size:10.5px; color:var(--ink-3); margin-left:7px; }
#pane-read .tile-img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:var(--r-xs); margin-bottom:8px; background:var(--paper-2); }
#pane-read .row-head .nav { display:flex; gap:6px; margin-left:auto; }
#pane-read .row-nav { width:30px; height:30px; border-radius:50%; border:1px solid var(--line-2); background:#fff;
    color:var(--ink-2); font-size:14px; font-weight:800; cursor:pointer; display:flex; align-items:center; justify-content:center;
    box-shadow:var(--shadow-sm); transition:background .15s, color .15s; }
#pane-read .row-nav:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
#pane-read .row-nav:disabled { opacity:.3; cursor:default; }
/* 한 묶음은 6개까지만 보이고, 나머지는 이 버튼으로 편다 */
/* 폭은 100% 로 못박는다. 두 번 헛짚은 자리다 —
   ① calc(100% - var(--pad)*2) 는 --pad 가 단위 없는 0 이라 계산식이 통째로 무효가 되고
   ② button 은 width:auto 가 '늘어나기'가 아니라 '글자 폭'이라, 둘 다 쪼그라들었다.
   좌우 여백은 이 pane 에서 --pad 가 0 이라 bar 바깥 wrap 이 이미 벌려 준다. */
#pane-read .row-more { display:block; width:100%; margin:2px 0 0;
    padding:11px 0; border:1px solid var(--line-2); border-radius:var(--r-sm); background:#fff;
    color:var(--ink-2); font-size:13.5px; font-weight:700; cursor:pointer;
    transition:background .15s, color .15s, border-color .15s; }
#pane-read .row-more b { color:var(--brand); font-weight:800; }
#pane-read .row-more:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
#pane-read .row-more:hover b { color:#fff; }
/* '전체' 화면 챕터 4개 아래, 나머지 5개를 접어두는 버튼 */
#pane-read .chapters-expand { display:block; width:100%; margin:14px 0 0;
    padding:13px 0; border:1px dashed var(--line-2); border-radius:var(--r-sm); background:transparent;
    color:var(--ink-2); font-size:13.5px; font-weight:700; cursor:pointer;
    transition:background .15s, color .15s, border-color .15s; }
#pane-read .chapters-expand b { color:var(--brand); font-weight:800; }
#pane-read .chapters-expand:hover { background:var(--ink); color:#fff; border-color:var(--ink); }
#pane-read .chapters-expand:hover b { color:#fff; }
#pane-read .row-scroll { display:flex; gap:12px; overflow-x:auto; padding:2px var(--pad) 8px; margin:0; scroll-snap-type:x proximity; scrollbar-width:none; }
#pane-read .row-scroll::-webkit-scrollbar { display:none; }
#pane-read .pcard { flex:0 0 152px; scroll-snap-align:start; border-radius:var(--r-md); overflow:hidden; background:#fff; border:1px solid var(--line); text-decoration:none; color:inherit; transition:transform .15s var(--ease), box-shadow .15s; }
#pane-read .pcard:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); }
#pane-read .pcard img { width:100%; aspect-ratio:4/5; object-fit:cover; background:var(--paper-2); }
#pane-read .pcard-meta { padding:10px 11px 12px; }
#pane-read .pcard-badge { font-size:10.5px; font-weight:700; color:var(--stamp); text-transform:uppercase; }
#pane-read .pcard-title { font-size:12.5px; font-weight:700; line-height:1.4; margin-top:4px; }
#pane-read .tile-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 var(--pad) 4px; }
#pane-read .tile { background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:14px 14px 15px; text-align:left; cursor:pointer; transition:transform .15s var(--ease), box-shadow .15s; }
#pane-read .tile:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
#pane-read .tile .ic { font-size:20px; margin-bottom:8px; display:block; }
#pane-read .tile .t { font-size:12.5px; font-weight:800; line-height:1.35; margin-bottom:4px; }
#pane-read .tile .s { font-size:10.5px; color:var(--ink-3); line-height:1.5; }
#pane-read .soon-section { margin:30px 20px 4px; padding-top:18px; position:relative; }
#pane-read .soon-section::before { content:""; position:absolute; top:0; left:0; right:0; border-top:2px dashed var(--line-2); }
#pane-read .soon-section::after { content:""; position:absolute; top:-9px; left:-29px; width:18px; height:18px; border-radius:50%; background:var(--paper-2); }
#pane-read .map-tile { background:#fff; border:1px solid var(--line); border-radius:var(--r-sm); padding:14px 8px; text-align:center;
    text-decoration:none; color:inherit; transition:border-color .15s, transform .15s; }
#pane-read .map-tile:hover { border-color:var(--brand); transform:translateY(-2px); }
#pane-read .map-tile .ic { font-size:24px; display:block; margin-bottom:6px; }
#pane-read .map-tile .name { font-size:13.5px; font-weight:800; }
#pane-read .map-tile .cnt { font-size:10.5px; color:var(--ink-3); margin-top:2px; }
#pane-read .pv-cats { display:flex; flex-wrap:wrap; gap:7px; padding:10px var(--pad) 6px; }
#pane-read .pv-cats::-webkit-scrollbar { display:none; }
#pane-read .pv-cat { flex:0 0 auto; padding:9px 15px; border-radius:var(--r-pill); border:1px solid var(--line); background:#fff;
    font-size:13.5px; font-weight:800; color:var(--ink-2); cursor:pointer; white-space:nowrap; }
#pane-read .pv-cat.on { border-color:var(--brand); color:var(--brand); background:var(--brand-50); }
#pane-read .pv-filters { display:flex; flex-wrap:wrap; gap:6px; padding:0 var(--pad) 8px; }
#pane-read .pv-filters::-webkit-scrollbar { display:none; }
#pane-read .pv-chip { flex:0 0 auto; font-size:12.5px; font-weight:700; padding:6px 12px; border-radius:var(--r-pill);
    border:1px solid var(--line); background:#fff; color:var(--ink-2); cursor:pointer; white-space:nowrap; }
#pane-read .pv-chip.on { border-color:var(--brand); color:var(--brand); background:var(--brand-50); }
#pane-read .pv-map-wrap { margin:6px 20px; border-radius:var(--r-md); overflow:hidden; border:1px solid var(--line); }
#pane-read #pvMap { height:240px; width:100%; background:var(--paper-2); }
#pane-read .pv-count { padding:10px var(--pad) 4px; font-size:12.5px; color:var(--ink-3); }
#pane-read .pv-list { display:flex; flex-direction:column; background:#fff; border-top:1px solid var(--line); }
#pane-read .pv-item { padding:14px var(--pad) 12px; border-bottom:1px solid #F1F3F6; }
#pane-read .pv-item img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:var(--r-sm); margin-bottom:9px; background:var(--paper-2); }
#pane-read .pv-item h4 { font-size:15px; font-weight:800; }
#pane-read .pv-item .meta { font-size:12.5px; color:var(--ink-2); font-weight:600; margin:3px 0 4px; }
#pane-read .pv-item .star { color:#F5A623; font-weight:800; }
#pane-read .pv-item p { font-size:12.5px; color:var(--ink-2); line-height:1.6; margin-bottom:8px; }
#pane-read .pv-item a { font-size:12.5px; font-weight:800; color:#03C75A; text-decoration:none; }
  @media (min-width:1000px){
#pane-read .pv-list { display:grid; grid-template-columns:1fr 1fr; }
#pane-read #pvMap { height:340px; }}
#pane-read footer.mag-foot { text-align:center; padding:34px var(--pad) 0; }
#pane-read footer.mag-foot .t { font-size:11.5px; color:var(--ink-3); letter-spacing:.03em; }
/* 매거진 안의 화면 전환. 지도 탭의 카테고리 줄(.seg)과 같은 언어를 쓴다 —
   같은 앱 안에서 같은 일을 하는 버튼은 같은 모양이어야 한다. */
/* 읽을거리 / 내 여행 — 모양은 공통 .seg2 (base.css) 가 준다.
   예전엔 화면 맨 아래 고정 탭바여서, 통합 탭바와 겹쳐 하단에 탭 줄이 두 개였다. */
#pane-read .seg2 .tab { position:relative; }
#pane-read .sheet-backdrop { position:fixed; inset:0; background:rgba(20,16,8,.5); opacity:0; pointer-events:none; transition:opacity .25s var(--ease); z-index:90; }
#pane-read .sheet-backdrop.open { opacity:1; pointer-events:auto; }
#pane-read .sheet { position:fixed; left:50%; transform:translateX(-50%) translateY(100%); bottom:0; width:100%; max-width:var(--canvas-w);
    background:#fff; border-radius:24px 24px 0 0; box-shadow:var(--shadow-lg); z-index:91;
    transition:transform .32s var(--ease); max-height:86vh; overflow-y:auto; }
#pane-read .sheet.open { transform:translateX(-50%) translateY(0); }
#pane-read .sheet-handle { width:36px; height:4px; border-radius:99px; background:var(--line-2); margin:12px auto 4px; }
#pane-read .sheet-close { position:sticky; top:10px; float:right; margin:0 12px 0 0; width:34px; height:34px; border-radius:50%;
    border:0; background:rgba(25,25,28,.55); color:#fff; font-size:16px; font-weight:800; cursor:pointer; z-index:5;
    display:flex; align-items:center; justify-content:center; backdrop-filter:blur(4px); }
#pane-read .sheet-close:hover { background:rgba(25,25,28,.8); }
#pane-read .sheet-img { width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--paper-2); }
/* 사진 없는 글(병원·응급처럼 사진이 어울리지 않는 정보 글)의 머리.
   16:9 를 그대로 쓰면 넓은 화면에서 회색 판이 반 페이지를 먹는다. 높이를 고정한다. */
#pane-read .sheet-icon-hero { width:100%; min-height:120px; padding:26px 0; display:flex; align-items:center; justify-content:center; font-size:54px; background:var(--stamp-100); }
#pane-read .sheet-body { padding:18px 22px 26px; }
#pane-read .official-link { display:flex; align-items:center; gap:6px; background:#03C75A; color:#fff; font-size:13.5px; font-weight:800;
    padding:12px 14px; border-radius:var(--r-sm); text-decoration:none; margin:8px 0; justify-content:center; }
#pane-read .official-link:hover { filter:brightness(.94); }
#pane-read .pv-flabel { font-size:11.5px; font-weight:800; color:var(--ink-3); padding:10px var(--pad) 5px; letter-spacing:.2px; }
#pane-read .pv-frow { display:flex; gap:6px; padding:0 var(--pad) 4px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
#pane-read .pv-frow::-webkit-scrollbar { display:none; }
#pane-read .pv-frow .pv-chip { flex:0 0 auto; }
#pane-read .hobby { padding:22px 0 4px; }
#pane-read .nf-go { border:0; background:none; padding:0; font-family:inherit; cursor:pointer;
          font-size:11.5px; font-weight:800; color:var(--brand-ink); text-decoration:underline; }
#pane-read .nf-go:hover { color:#8A6A22; }
#pane-read .of { display:flex; gap:12px; align-items:center; padding:14px 0;
       border-bottom:1px solid var(--soft); text-decoration:none; }
#pane-read .of:last-child { border-bottom:0; }
#pane-read .of-i { flex:1; min-width:0; }
#pane-read .of-tag { font-size:11.5px; font-weight:800; color:var(--brand); letter-spacing:.2px; }
#pane-read .of-n { font-size:14px; font-weight:800; color:#15171A; margin-top:3px; line-height:1.35; }
#pane-read .of-d { font-size:12.5px; color:#4B5159; margin-top:4px; line-height:1.55; }
#pane-read .of-r { flex:0 0 auto; text-align:right; }
#pane-read .of-p { display:block; font-size:12.5px; font-weight:800; color:var(--brand-ink); white-space:nowrap; }
#pane-read .of-go { display:inline-block; margin-top:7px; padding:7px 12px; border-radius:var(--r-xs);
          background:var(--brand); color:#fff; font-size:11.5px; font-weight:800; white-space:nowrap; }
#pane-read .of:hover .of-go { background:#B08333; }
#pane-read .ofs { margin-top:18px; padding:15px 16px; border-radius:var(--r-sm);
        background:linear-gradient(135deg,#FDF8EF,var(--soft)); border:1px solid #EBD9B4; }
#pane-read .ofs-h { font-size:13.5px; font-weight:800; color:#15171A; }
#pane-read .ofs-s { font-size:12.5px; color:var(--ink-3); margin:4px 0 6px; }
#pane-read .theme-row { display:flex; gap:10px; overflow-x:auto; padding:2px 2px 4px; margin:0; scroll-snap-type:x proximity; scrollbar-width:none; }
#pane-read .theme-row::-webkit-scrollbar { display:none; }
#pane-read .tcard { flex:0 0 128px; scroll-snap-align:start; border-radius:var(--r-sm); overflow:hidden;
    background:#fff; border:1px solid #EBD9B4; text-decoration:none; color:inherit; transition:transform .15s var(--ease); }
#pane-read .tcard:hover { transform:translateY(-2px); }
#pane-read .tcard img { width:100%; aspect-ratio:1/1; object-fit:cover; background:var(--paper-2); display:block; }
#pane-read .tcard-ph { width:100%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
    font-size:30px; background:var(--stamp-100); position:relative; }
#pane-read .tcard-badge { position:absolute; left:5px; bottom:5px; font-size:10.5px; font-weight:800;
    padding:3px 6px; border-radius:var(--r-pill); background:var(--brand); color:#fff; letter-spacing:.02em; }
#pane-read .tcard-b { padding:8px 9px 10px; }
#pane-read .tcard-r { font-size:10.5px; font-weight:800; color:var(--brand-ink); letter-spacing:.02em; }
#pane-read .tcard-n { font-size:11.5px; font-weight:800; color:#15171A; line-height:1.35; margin-top:2px; }
#pane-read .tcard-s { font-size:10.5px; color:var(--ink-3); margin-top:3px; font-weight:600; }
#pane-read .src { margin-top:16px; padding:15px 16px; border-radius:var(--r-sm);
        background:var(--soft); border:1px solid var(--line); }
#pane-read .src-h { font-size:13.5px; font-weight:800; color:#15171A; }
#pane-read .src-s { font-size:12.5px; color:var(--ink-3); margin:5px 0 11px; line-height:1.6; }
#pane-read .src-i { display:block; padding:10px 0; border-top:1px solid #E9EFE2; text-decoration:none; }
#pane-read .src-i:first-of-type { border-top:0; padding-top:0; }
#pane-read .src-t { display:block; font-size:13.5px; font-weight:700; color:#8A6A22; line-height:1.45; }
#pane-read .src-m { display:block; font-size:11.5px; color:var(--ink-3); margin-top:3px; font-weight:600; }
#pane-read .src-i:hover .src-t { text-decoration:underline; }
#pane-read .qs { border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; overflow:hidden; margin-bottom:9px; }
#pane-read .qs.clear { background:var(--soft); border-color:#DFE7D6; }
#pane-read .qs.open { border-color:#DFE3E9; }
#pane-read .ck { margin:4px 20px 0; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; overflow:hidden; }
#pane-read .ck-s { font-size:12.5px; color:var(--ink-3); margin-top:4px; font-weight:700; }
#pane-read #phaseBar { margin:2px 20px 10px; }
#pane-read .ph-set { width:100%; padding:14px; border-radius:var(--r-sm); border:1px dashed #DFE3E9;
           background:var(--soft); font-size:13.5px; font-weight:700; color:#5C6352; cursor:pointer; }
#pane-read .ph-set b { color:var(--brand-ink); }
#pane-read .ph-set:hover { background:var(--soft); }
#pane-read .ph-in { display:flex; align-items:center; gap:10px; padding:13px 15px; border-radius:var(--r-sm);
          background:linear-gradient(135deg,var(--brand),#8A6A22); color:#fff; }
#pane-read .ph-l { flex:1; min-width:0; display:flex; flex-direction:column; }
#pane-read .ph-l b { font-size:14px; font-weight:800; }
#pane-read .ph-l span { font-size:12.5px; color:rgba(255,255,255,.78); margin-top:3px; line-height:1.45; }
#pane-read .ph-edit { flex:0 0 auto; padding:7px 11px; border-radius:var(--r-xs); border:1px solid rgba(255,255,255,.3);
            background:rgba(255,255,255,.12); color:#fff; font-size:11.5px; font-weight:800; cursor:pointer; }
#pane-read .ap-tile { display:flex; flex-direction:column; gap:2px; padding:14px 13px;
            border:1px solid var(--line); border-radius:var(--r-sm); background:#fff;
            text-decoration:none; color:inherit; transition:.15s; }
#pane-read .ap-tile:hover { border-color:#DFE3E9; transform:translateY(-1px);
                  box-shadow:0 4px 14px rgba(74,93,58,.09); }
#pane-read .ap-tile .ap-n { font-size:14px; font-weight:800; color:#15171A; }
#pane-read .rt-kind { grid-column:1 / -1; }
#pane-read .rt-card { grid-column:1 / -1; align-self:start; }
#pane-read .rt-empty { grid-column:1 / -1; }
#pane-read .rt-kind { display:flex; gap:8px; padding:14px var(--pad) 6px; }
#pane-read .rt-k { flex:1; padding:11px; border:1px solid var(--line); background:#fff; border-radius:11px;
         font-size:13.5px; font-weight:800; color:var(--brand-ink); cursor:pointer; }
#pane-read .rt-k.on { background:var(--brand); border-color:var(--brand); color:#fff; }
#pane-read .rt-card { margin:10px 20px 0; border:1px solid var(--line); border-radius:var(--r-sm); background:#fff; overflow:hidden; }
#pane-read .rt-card.open { border-color:#DFE3E9; }
#pane-read .rt-head { width:100%; display:flex; align-items:center; justify-content:space-between;
            gap:10px; padding:15px 16px; background:none; border:0; cursor:pointer; text-align:left; }
#pane-read .rt-title { font-size:15px; font-weight:800; color:#15171A; }
#pane-read .rt-sub { font-size:12.5px; color:var(--ink-3); margin-top:4px; font-weight:600; }
#pane-read .rt-arrow { font-size:13.5px; color:var(--ink-3); }
#pane-read .rt-body { padding:0 16px 16px; border-top:1px solid var(--soft); }
#pane-read .rt-desc { font-size:12.5px; color:#7A8270; line-height:1.6; margin:12px 0 14px; }
#pane-read .rt-stop { display:flex; gap:11px; align-items:flex-start; padding:9px 0; }
#pane-read .rt-num { flex:0 0 23px; width:23px; height:23px; margin-top:2px; border-radius:50%;
           background:var(--brand); color:#fff; font-size:11.5px; font-weight:800;
           display:flex; align-items:center; justify-content:center; }
#pane-read .rt-si { flex:1; min-width:0; }
#pane-read .rt-when { font-size:11.5px; font-weight:800; color:var(--brand); letter-spacing:.2px; }
#pane-read .rt-name { font-size:14px; font-weight:700; color:#15171A; margin-top:2px; line-height:1.35; }
#pane-read .rt-meta { font-size:11.5px; color:var(--ink-3); margin-top:3px; }
#pane-read .rt-map { flex:0 0 auto; font-size:15px; text-decoration:none; padding:3px; }
#pane-read .rt-leg { display:flex; align-items:center; gap:9px; padding-left:0; font-size:11.5px;
           color:#AEB5A2; font-weight:700; margin:-2px 0; }
#pane-read .rt-leg span { flex:0 0 23px; display:block; height:14px; margin:0 auto;
                border-left:2px dotted #DCE3D2; margin-left:11px; }
#pane-read .rt-add { width:100%; margin-top:14px; padding:13px; border:0; border-radius:var(--r-xs);
           background:var(--brand); color:#fff; font-size:13.5px; font-weight:800; cursor:pointer; }
#pane-read .rt-add:hover { background:#B08333; }
#pane-read .rt-empty { padding:44px var(--pad); text-align:center; font-size:13.5px; color:var(--ink-3); line-height:1.7; }
#pane-read .tab-dot { min-width:16px; height:16px; padding:0 4px; margin-left:2px;
            border-radius:var(--r-xs); background:var(--c-hot); color:#fff; font-size:10.5px; font-weight:800;
            line-height:16px; text-align:center; display:none; }
#pane-read .tab.active .tab-dot { background:var(--hot, var(--hot)); color:#fff; }
#pane-read .tab-dot.on { display:inline-block; }
#pane-read .tv-head { padding:22px var(--pad) 10px; }
#pane-read .tv-title { font-size:26px; font-weight:800; letter-spacing:-.5px; }
#pane-read .tv-sub { font-size:13.5px; color:#777; margin-top:6px; line-height:1.5; }
#pane-read .tv-map-wrap { margin:6px 20px 0; border-radius:var(--r-sm); overflow:hidden; border:1px solid #ECE6DC; }
#pane-read #tvMap { height:230px; }
#pane-read .tv-pin { display:flex; align-items:center; justify-content:center; width:26px; height:26px;
           border-radius:50%; background:var(--brand); color:#fff; font-size:12.5px; font-weight:800;
           box-shadow:0 2px 6px rgba(0,0,0,.28); border:2px solid #fff; }
#pane-read .tv-tabs { display:flex; gap:7px; padding:14px var(--pad) 4px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
#pane-read .tv-tabs::-webkit-scrollbar { display:none; }
#pane-read .tv-tab { flex:0 0 auto; border:1px solid #E6E0D6; background:#fff; border-radius:var(--r-pill);
           padding:8px 14px; font-size:13.5px; font-weight:700; color:#5C5148; cursor:pointer; white-space:nowrap; }
#pane-read .tv-tab.on { background:#15171A; border-color:#15171A; color:#fff; }
#pane-read .tv-tab-add { font-weight:800; color:var(--brand); border-style:dashed; }
#pane-read .tv-day-bar { display:flex; align-items:center; justify-content:space-between;
               padding:14px var(--pad) 2px; }
#pane-read .tv-day-n { font-size:15px; font-weight:800; }
#pane-read .tv-day-m { font-size:12.5px; color:#4B5159; font-weight:700; }
#pane-read .tv-row { display:flex; gap:11px; padding:12px var(--pad); align-items:flex-start; }
#pane-read .tv-num { flex:0 0 24px; width:24px; height:24px; margin-top:2px; border-radius:50%;
           background:var(--brand); color:#fff; font-size:12.5px; font-weight:800;
           display:flex; align-items:center; justify-content:center; }
#pane-read .tv-num.saved { background:#EDE7DE; color:#4B5159; }
#pane-read .tv-info { flex:1; min-width:0; }
#pane-read .tv-n { font-size:14px; font-weight:700; color:#1a1a1a; line-height:1.35; }
#pane-read .tv-d { font-size:12.5px; color:#4B5159; margin-top:3px; overflow:hidden;
         text-overflow:ellipsis; white-space:nowrap; }
#pane-read .tv-row img { width:54px; height:54px; border-radius:var(--r-xs); object-fit:cover; flex:0 0 54px; background:#f2efe9; }
#pane-read .tv-ops { display:flex; gap:5px; flex:0 0 auto; }
#pane-read .tv-op { border:1px solid #EAE4DA; background:#fff; border-radius:7px; width:28px; height:28px;
          font-size:13.5px; cursor:pointer; line-height:1; color:#6B6055; }
#pane-read .tv-op:hover { background:var(--soft); }
#pane-read .tv-leg { display:flex; align-items:center; gap:8px; padding:0 var(--pad) 0 var(--pad); margin:-4px 0; }
#pane-read .tv-leg-line { flex:0 0 24px; display:flex; justify-content:center; }
#pane-read .tv-leg-line span { width:2px; height:18px; background:#F0E7DC; display:block; }
#pane-read .tv-leg-t { font-size:11.5px; color:#B0A697; font-weight:700; }
#pane-read .tv-day-e { font-size:13.5px; color:#A79C8E; padding:26px var(--pad); text-align:center; line-height:1.6; }
#pane-read .tv-row-tour { background:#FFF8F4; }
#pane-read .tv-sug { margin:14px 20px 4px; padding:15px; border-radius:var(--r-sm);
           background:linear-gradient(135deg,#FDF8EF,#F6EBD4); border:1px solid #EBD9B4; }
#pane-read .tv-sug-h { font-size:13.5px; font-weight:800; color:#8A6A22; }
#pane-read .tv-sug-b { display:flex; gap:11px; margin-top:11px; align-items:center; }
#pane-read .tv-sug-b img { width:62px; height:62px; border-radius:var(--r-xs); object-fit:cover; flex:0 0 62px; background:#f3ece6; }
#pane-read .tv-sug-i { flex:1; min-width:0; }
#pane-read .tv-sug-n { font-size:15px; font-weight:800; color:#15171A; }
#pane-read .tv-sug-d { font-size:12.5px; color:#6B5A34; margin-top:3px; line-height:1.45; }
#pane-read .tv-sug-p { font-size:11.5px; color:var(--ink-3); margin-top:4px; }
#pane-read .tv-sug-r { display:flex; gap:7px; margin-top:12px; }
#pane-read .tv-sug-btn { flex:1; text-align:center; padding:11px 6px; border-radius:var(--r-xs); font-size:13.5px;
               font-weight:800; cursor:pointer; text-decoration:none;
               background:#fff; color:#3A2A20; border:1px solid #E3D6B8; }
#pane-read .tv-sug-btn:hover { background:#FFFFFF; }
#pane-read .tv-sug-main { background:var(--brand); border-color:var(--brand); color:#fff; }
#pane-read .tv-sug-main:hover { background:#f05b26; }
#pane-read .tv-sug-alt { font-size:11.5px; color:var(--ink-3); margin-top:10px; text-align:center; }
#pane-read .tv-sug-link { background:none; border:0; padding:0 2px; font-size:11.5px; font-weight:800;
                color:#8A6A22; cursor:pointer; text-decoration:underline; }
#pane-read .tv-foot { display:flex; gap:8px; padding:16px var(--pad) 8px; }
#pane-read .tv-fbtn { flex:1; border:1px solid #E6E0D6; background:#fff; border-radius:var(--r-xs); padding:11px 8px;
            font-size:13.5px; font-weight:800; color:#4A4038; cursor:pointer; }
#pane-read .tv-fbtn:hover { background:var(--soft); }
#pane-read .tv-fbtn-main { background:var(--brand); border-color:var(--brand); color:#fff; }
#pane-read .tv-fbtn-main:hover { background:#f05b26; }
#pane-read .tv-btn { border:1px solid #e2e2e2; background:#fff; border-radius:var(--r-pill); padding:10px 16px;
           font-size:13.5px; font-weight:700; cursor:pointer; color:#333; }
#pane-read .tv-btn-main { background:var(--brand); border-color:var(--brand); color:#fff; }
#pane-read .tv-empty { text-align:center; padding:52px 32px 40px; }
#pane-read .tv-empty-ic { font-size:40px; }
#pane-read .tv-empty-t { font-size:16px; font-weight:800; margin-top:12px; }
#pane-read .tv-empty-s { font-size:13.5px; color:#888; margin:8px 0 20px; line-height:1.6; }
#pane-read .pv-fav { position:absolute; top:10px; right:10px; }
#pane-read .pv-item { position:relative; }
#pane-read .fav { border:0; background:rgba(255,255,255,.92); border-radius:50%; width:32px; height:32px;
        font-size:15px; cursor:pointer; line-height:1; box-shadow:0 1px 4px rgba(0,0,0,.14); }
#pane-read .fav.on { background:var(--brand); }
#pane-read .sheet-fav { position:absolute; top:14px; right:14px; z-index:5; }
#pane-read .today { display:flex; gap:8px; margin:2px 20px 0; padding:12px 4px;
          border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
#pane-read .today-i { flex:1; display:flex; flex-direction:column; gap:3px; align-items:center; text-align:center;
            border-right:1px solid #f2ece3; }
#pane-read .today-i:last-child { border-right:0; }
#pane-read .today-k { font-size:11.5px; color:#9a8f82; font-weight:700; letter-spacing:.2px; }
#pane-read .today-v { font-size:12.5px; font-weight:800; color:#15171A; white-space:nowrap; }
#pane-read #sheetNote { margin-top:18px; padding:15px 16px; border-radius:var(--r-sm);
              background:#FAF7F1; border:1px solid #E6ECE0; }
#pane-read .note-top { display:flex; gap:10px; align-items:center; }
#pane-read .note-av { width:36px; height:36px; border-radius:50%; background:#15171A; color:#fff;
            display:flex; align-items:center; justify-content:center; font-size:17px; flex:0 0 36px; }
#pane-read .note-who { font-size:13.5px; font-weight:800; color:#15171A; }
#pane-read .note-role { font-size:11.5px; color:#93887A; margin-top:2px; }
#pane-read .note-body { font-size:13.5px; color:#3C332B; line-height:1.65; margin-top:11px; white-space:pre-wrap; }
#pane-read #sheetCta { margin-top:20px; padding:16px 16px 14px; border-radius:var(--r-sm);
             background:linear-gradient(135deg,#FDF8EF,#F6EBD4); border:1px solid #EBD9B4; }
#pane-read .cta-t { font-size:15px; font-weight:800; color:#15171A; }
#pane-read .cta-s { font-size:12.5px; color:#6B5A34; margin-top:5px; line-height:1.5; }
#pane-read .cta-row { display:flex; gap:8px; margin-top:12px; }
#pane-read .cta-btn { flex:1; text-align:center; padding:12px 8px; border-radius:var(--r-xs); font-size:13.5px;
            font-weight:800; text-decoration:none; }
#pane-read .cta-main { background:var(--brand); color:#fff; }
#pane-read .cta-main:hover { background:#f05b26; }
#pane-read .cta-sub { background:#fff; color:#3A2A20; border:1px solid #E3D6B8; }
#pane-read .cta-sub:hover { background:#FFFFFF; }
#pane-read #sheetNaver { margin-top:18px; padding-top:16px; border-top:1px solid #eee; }
#pane-read .nv-head { font-size:14px; font-weight:800; color:#111; margin-bottom:10px; }
#pane-read .nv-item { display:block; padding:11px 0; border-bottom:1px solid #f2f2f2; text-decoration:none; color:inherit; }
#pane-read .nv-item:last-child { border-bottom:0; }
#pane-read .nv-t { font-size:14px; font-weight:700; color:#1a1a1a; line-height:1.4; }
#pane-read .nv-s { font-size:12.5px; color:#666; line-height:1.5; margin-top:4px;
         display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
#pane-read .nv-m { font-size:11.5px; color:#03C75A; font-weight:700; margin-top:5px; }
#pane-read .nv-note { font-size:11.5px; color:#999; margin-top:10px; }
#pane-read .nv-more { display:block; margin-top:12px; text-align:center; padding:10px; border-radius:var(--r-xs);
            background:#F5F5F5; color:#333; font-size:12.5px; font-weight:700; text-decoration:none; }
#pane-read .nv-more:hover { background:#eee; }
#pane-read .nv-naver { display:flex; align-items:center; justify-content:center; gap:7px; margin-top:10px;
             padding:13px; border-radius:var(--r-xs); background:#03C75A; color:#fff;
             font-size:13.5px; font-weight:800; text-decoration:none; }
#pane-read .nv-naver:hover { filter:brightness(.94); }
#pane-read .nv-logo { display:inline-flex; align-items:center; justify-content:center; width:19px; height:19px;
            border-radius:4px; background:#fff; color:#03C75A; font-size:12.5px; font-weight:900; }
#pane-read .sheet-body .badge { font-size:10.5px; font-weight:700; color:var(--stamp); text-transform:uppercase; }
#pane-read .sheet-body h3 { font-size:19px; font-weight:800; line-height:1.4; margin:8px 0 10px; }
#pane-read .sheet-body p { white-space:pre-wrap;  font-size:13.5px; color:var(--ink-2); line-height:1.75; }
#pane-read .sheet-actions { display:flex; gap:8px; margin-top:20px; }
#pane-read .sheet-actions button { flex:1; border:1px solid var(--line); background:#fff; border-radius:var(--r-sm); padding:12px; font-size:12.5px; font-weight:700; color:var(--ink-2); cursor:pointer; }
#pane-read .sheet-actions button:disabled { opacity:.35; cursor:default; }
#pane-read .sheet-actions button:not(:disabled):hover { border-color:var(--brand); color:var(--brand); }
#pane-read .sheet-cta { display:block; margin-top:10px; text-align:center; background:var(--brand); color:#fff; font-weight:700; font-size:13.5px; padding:14px; border-radius:var(--r-md); text-decoration:none; }
#pane-read .sheet-cta:hover { background:var(--brand-600); }
#pane-read .sheet-map { margin-top:16px; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; }
#pane-read .sheet-map iframe { display:block; width:100%; height:150px; border:0; }
#pane-read .sheet-map-links { display:flex; border-top:1px solid var(--line); }
#pane-read .sheet-map-link { flex:1; display:block; padding:10px 14px; font-size:12.5px; font-weight:700; color:var(--ink-2); text-decoration:none; text-align:center; background:none; border:0; font-family:inherit; cursor:pointer; }
#pane-read .sheet-map-link:hover { color:var(--brand); }
#pane-read .sheet-map-ours { color:var(--brand-600); border-right:1px solid var(--line); }
#pane-read .sheet-map-ours:hover { background:color-mix(in srgb, var(--brand) 12%, transparent); }
#pane-read .sheet-review { margin-top:12px; border:1px solid var(--line); border-radius:var(--r-sm); padding:13px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--paper-2,var(--soft)); }
#pane-read .sheet-review-stars { font-size:12.5px; font-weight:700; color:var(--ink-2); }
#pane-read .sheet-review a { font-size:12.5px; font-weight:800; color:var(--brand); text-decoration:none; white-space:nowrap; }
#pane-read .sheet-review a:hover { text-decoration:underline; }
#pane-read .toast { position:fixed; left:50%; bottom:92px; transform:translate(-50%,10px); max-width:calc(var(--canvas-w) - 40px);
    background:var(--ink); color:#fff; font-size:12.5px; font-weight:600; padding:11px 18px; border-radius:var(--r-pill);
    box-shadow:var(--shadow-lg); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; z-index:95; text-align:center; }
#pane-read .toast.show { opacity:1; transform:translate(-50%,0); }
#pane-read .empty { padding:40px var(--pad); text-align:center; color:var(--ink-3); font-size:12.5px; }
#pane-read .bst-nav { position:sticky; top:0; z-index:200; display:flex; align-items:center; justify-content:space-between;
    gap:10px; padding:9px 16px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(0,0,0,.07); font-family:'Pretendard Variable',Pretendard,-apple-system,sans-serif; }
  
  @media(min-width:820px){
#pane-read .bst-nav { max-width:var(--canvas-w); margin:0 auto; }}
  @media (max-width:420px){
#pane-read .bst-nav { padding:8px 12px; }}
#pane-read .nf {margin:0 0 26px;padding:18px 18px 8px;border:1px solid var(--line);border-radius:var(--r-md);
      background:linear-gradient(180deg,#FDFBF6 0%,var(--paper) 70%)}
#pane-read .nf-h {display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
#pane-read .nf-t {font-size:17px;font-weight:800;letter-spacing:-.02em}
#pane-read .nf-s {font-size:12.5px;color:var(--ink-3);margin-top:3px;line-height:1.5}
#pane-read .nf-live {flex:0 0 auto;font-size:11.5px;font-weight:800;color:var(--gold);
           border:1px solid #EBD9B4;background:#FDF8EF;border-radius:var(--r-pill);padding:4px 10px}
#pane-read .nf-l {list-style:none;margin:0;padding:0;counter-reset:nf}
#pane-read .nf-i {counter-increment:nf;padding:11px 0 11px 30px;border-top:1px solid var(--line);position:relative}
#pane-read .nf-i:first-child {border-top:none}
#pane-read .nf-i::before {content:counter(nf);position:absolute;left:0;top:12px;font-size:11.5px;
                font-weight:800;color:var(--ink-3);font-variant-numeric:tabular-nums}
#pane-read .nf-i a {font-size:14px;font-weight:700;color:var(--ink);text-decoration:none;line-height:1.45;
          display:block;word-break:keep-all}
#pane-read .nf-i a:hover {text-decoration:underline}
#pane-read .nf-m {font-size:11.5px;color:var(--ink-3);margin-top:4px}
#pane-read .nf-m b {color:var(--gold);font-weight:800}
  @media(max-width:600px){
#pane-read .nf {padding:15px 14px 6px}
#pane-read .nf-i a {font-size:14px}}
  /* 매거진 첫 화면용 — 여기 주인공은 글이지 뉴스가 아니다 */
#pane-read .nf-mini {margin:0 0 4px;padding:14px 14px 4px}
#pane-read .nf-mini .nf-h {margin-bottom:6px}
#pane-read .nf-mini .nf-t {font-size:14px}
#pane-read .nf-mini .nf-i {padding:9px 0 9px 26px}
#pane-read .nf-mini .nf-i::before {top:10px}
#pane-read .nf-mini .nf-i a {font-size:13.5px}
  /* 프로모션 섹션 — 뉴스와 같은 틀에 직접 등록 카드가 위에 얹힌다 */
#pane-read .pm {padding-bottom:14px}
#pane-read .pm-cards {display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin-bottom:12px}
#pane-read .pm-card {display:flex;flex-direction:column;gap:5px;padding:13px 14px;border:1px solid var(--line);
           border-radius:var(--r-sm);background:#fff;text-decoration:none;color:var(--ink);
           transition:border-color .15s, box-shadow .15s}
#pane-read .pm-card:hover {border-color:#D9C99A;box-shadow:0 4px 16px rgba(0,0,0,.06)}
#pane-read .pm-card.hot {border-color:#EBD9B4;background:#FDF8EF}
#pane-read .pm-card strong {font-size:14px;font-weight:800;line-height:1.4;word-break:keep-all}
#pane-read .pm-tag {align-self:flex-start;font-size:10.5px;font-weight:800;color:var(--gold);
           border:1px solid #EBD9B4;background:#FDF8EF;border-radius:var(--r-pill);padding:3px 8px}
#pane-read .pm-card.hot .pm-tag {background:#fff}
#pane-read .pm-d {font-size:12.5px;color:var(--ink-2);line-height:1.55;word-break:keep-all}
#pane-read .pm-m {font-size:11.5px;color:var(--ink-3)}
#pane-read .pm-note {margin:10px 0 2px;font-size:11.5px;color:var(--ink-3);line-height:1.5}
/* 발리 사람들 이야기 — 뉴스 목록과 같은 판을 쓰되, 번호 대신 성격 딱지를 단다.
   뉴스는 '몇 번째 소식'이 의미가 있지만 사람 이야기에는 순위가 없다. */
#pane-read .vc {padding-bottom:14px}
#pane-read .vc-l {list-style:none;margin:0;padding:0}
#pane-read .vc-i {padding:12px 0;border-top:1px solid var(--line)}
#pane-read .vc-i:first-child {border-top:none}
#pane-read .vc-i > a {display:flex;flex-wrap:wrap;align-items:baseline;gap:7px;text-decoration:none}
#pane-read .vc-i > a:hover strong {text-decoration:underline}
#pane-read .vc-k {flex:0 0 auto;font-size:10.5px;font-weight:800;color:var(--gold);
         border:1px solid #EBD9B4;background:#FDF8EF;border-radius:var(--r-pill);padding:2px 8px;white-space:nowrap}
#pane-read .vc-i strong {font-size:14px;font-weight:700;color:var(--ink);line-height:1.45;word-break:keep-all}
#pane-read .vc-g {margin:5px 0 0;font-size:12.5px;color:var(--ink-2);line-height:1.55;word-break:keep-all}
@media (max-width:520px){ #pane-read .vc-i strong {font-size:14px}}
  /* 매거진 표지(.kick)와 그 배경 애니메이션(kickPan)은 화면과 함께 걷어냈다.
     홈 히어로 영상이 이미 그 역할을 한다 — 두 군데 다 두면 힘만 나뉜다. */
#pane-read .sec { margin:0 0 26px; padding:0 var(--pad); }
#pane-read .sec-p { font-size:12.5px; color:var(--ink-2); line-height:1.6; margin-bottom:14px; word-break:keep-all; }
#pane-read .who { display:grid; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)); gap:9px; }
#pane-read .who a { background:var(--card); border:1px solid var(--line); border-radius:15px; padding:15px 11px;
          text-align:center; text-decoration:none; color:inherit; transition:transform .18s var(--ease); }
#pane-read .who a:active { transform:scale(.97); }
#pane-read .who .e { font-size:24px; display:block; margin-bottom:6px; }
#pane-read .who .n { font-size:13.5px; font-weight:800; display:block; }
#pane-read .who .d { font-size:11.5px; color:var(--ink-3); display:block; margin-top:3px; word-break:keep-all; }
#pane-read #sheetNext3 { margin-top:22px; padding-top:17px; border-top:1px solid var(--line); }
#pane-read .nx-h { font-size:12.5px; font-weight:800; letter-spacing:.02em; color:var(--ink-3); margin-bottom:11px; }
#pane-read .nx-l { display:grid; gap:8px; }
#pane-read .nx-i { display:grid; grid-template-columns:52px 1fr; gap:11px; align-items:center;
         background:var(--brand-50); border:1px solid var(--line); border-radius:var(--r-sm);
         padding:9px; cursor:pointer; text-align:left; font-family:inherit; color:inherit; width:100%;
         transition:transform .16s var(--ease); }
#pane-read .nx-i:active { transform:scale(.985); }
#pane-read .nx-i img { width:52px; height:52px; border-radius:var(--r-xs); object-fit:cover; background:var(--card); }
#pane-read .nx-i .ic { width:52px; height:52px; border-radius:var(--r-xs); display:grid; place-items:center;
             background:var(--card); font-size:22px; }
#pane-read .nx-i b { display:block; font-size:13.5px; font-weight:800; line-height:1.4;
           letter-spacing:-.015em; word-break:keep-all; }
#pane-read .nx-i span { display:block; font-size:11.5px; color:var(--ink-3); margin-top:3px; }
#pane-read .sv { margin:0 20px 26px; padding:20px 18px 18px; border-radius:var(--r-md);
       background:linear-gradient(160deg,#FDFBF6 0%,var(--card) 65%);
       border:1px solid var(--line); box-shadow:var(--shadow-sm); }
  @keyframes fshP{ 0%,100%{opacity:1} 50%{opacity:.3} }


/* ── 통합 앱 안에서의 조정 ── */
/* body 스코프가 사라졌으니 pane 자체에 배경을 준다 */
#pane-read{ background:var(--paper); display:none; }
#pane-read.on{ display:block; }