/* ── Detail sheet ── */
.detail-poster{margin:2px 0 14px;text-align:center;}
.detail-poster img{
  max-width:100%;max-height:40dvh;border-radius:12px;
  border:1px solid var(--border);box-shadow:var(--shadow);
}
.detail-title{
  -webkit-appearance:none;appearance:none;display:block;width:auto;max-width:100%;padding:0;border:0;background:transparent;
  font-family:var(--font-serif);font-size:22px;line-height:1.25;
  color:var(--text);margin-bottom:6px;text-align:left;cursor:pointer;
}
.detail-jump{
  -webkit-appearance:none;appearance:none;border:0;background:transparent;padding:0;color:inherit;
  font:inherit;line-height:inherit;text-align:left;cursor:pointer;
  transition:opacity .1s ease;-webkit-tap-highlight-color:transparent;
}
.detail-jump.detail-title{font-family:var(--font-serif);font-size:22px;line-height:1.25;}
.detail-jump.is-pressed{opacity:.6;}
.detail-jump:focus-visible{outline:1px solid var(--accent2);outline-offset:4px;}
.detail-jump-sep{color:var(--text3);}
.detail-stars{font-size:15px;letter-spacing:2px;margin-bottom:14px;}
.detail-rating-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:14px;}
.detail-rating-line .detail-stars{margin-bottom:0;}
.detail-feature-badge{
  display:inline-flex;align-items:center;width:max-content;
  font-family:var(--font-mono);font-size:8.5px;font-weight:600;line-height:1;letter-spacing:.7px;
  text-transform:uppercase;color:var(--text3);background:transparent;border:1px solid var(--border);
  border-radius:4px;padding:3px 6px;
}
.detail-viewing-badge{
  font-family:var(--font-mono);font-size:12px;font-weight:700;
  margin:-9px 0 14px;letter-spacing:0.3px;
}
.detail-rows{display:flex;flex-direction:column;}
.detail-row{
  display:flex;align-items:baseline;gap:14px;
  padding:9px 0;border-top:1px solid var(--border);
}
.detail-label{
  flex:0 0 76px;font-family:var(--font-display);font-size:11px;
  letter-spacing:2px;color:var(--text3);
}
.detail-value{font-size:13.5px;color:var(--text);min-width:0;line-height:1.5;}
.detail-num{font-family:var(--font-mono);color:var(--accent);}
.detail-num-total{color:var(--text3);}
.detail-viewings{margin-top:16px;}
.detail-viewings-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.detail-viewings-title{
  font-family:var(--font-display);font-size:11px;letter-spacing:2px;
  color:var(--text3);
}
.detail-viewings-count{font-family:var(--font-mono);font-size:9.5px;color:var(--text3);}
.detail-viewings-list{display:flex;flex-direction:column;gap:4px;margin:0 -6px;}
.detail-viewing{
  -webkit-appearance:none;appearance:none;width:100%;display:flex;align-items:center;gap:11px;
  border:0;border-radius:9px;background:transparent;color:var(--text2);
  padding:6px;margin:0;cursor:pointer;font-family:var(--font);font-size:12.5px;text-align:left;
  transition:background .18s ease;
}
.detail-viewing:active{background:var(--card-hover);}
.detail-viewing.is-current{
  background:color-mix(in srgb,var(--oc,var(--accent)) 9%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--oc,var(--accent)) 50%,transparent);
}
.detail-viewing.is-current:active{background:color-mix(in srgb,var(--oc,var(--accent)) 9%,transparent);}
.dv-poster{
  width:54px;height:30px;flex:0 0 auto;border-radius:5px;overflow:hidden;background:var(--bg2);
  display:flex;align-items:center;justify-content:center;
}
.dv-poster img{width:100%;height:100%;object-fit:cover;display:block;}
.dv-no-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--text3);}
.dv-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.dv-meta{display:flex;align-items:center;gap:4px;min-width:0;font-size:9.5px;line-height:14px;white-space:nowrap;}
.dv-date{
  flex:0 0 auto;font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.35px;text-transform:uppercase;color:var(--yc,var(--text3));
}
.dv-meta i{flex:0 0 auto;font-style:normal;color:var(--text3);}
.dv-loc{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;color:var(--text3);}
.dv-formats{display:flex;align-items:center;gap:4px;min-height:12px;overflow:hidden;}
.dv-formats .tag{font-size:8.5px;line-height:12px;padding:0 6px;margin:0;}
.dv-standard{font-family:var(--font-mono);font-size:8.5px;line-height:12px;letter-spacing:.4px;color:var(--text3);}
.dv-ord{
  flex:0 0 auto;min-width:28px;text-align:right;font-family:var(--font-mono);
  font-size:14px;font-weight:700;color:var(--oc,var(--text3));
}

/* ── On This Day (게이지 스트립 필 버튼 + 시트 — 데스크톱 모달 이식) ── */
.otd-pill{
  flex-shrink:0;display:flex;align-items:center;gap:5px;
  border:1px solid var(--border);border-radius:16px;background:var(--card);
  color:#d97f56;padding:6px 10px;cursor:pointer;
  font-size:10.5px;font-weight:600;letter-spacing:0.2px;white-space:nowrap;
  margin-left:auto;
}
.otd-pill:active{border-color:currentColor;}
[data-theme="dark"] .otd-pill{color:#f0a888;}
@media(prefers-color-scheme:dark){[data-theme="system"] .otd-pill{color:#f0a888;}}
.otd-dot{width:6px;height:6px;border-radius:50%;background:currentColor;display:inline-block;flex-shrink:0;box-shadow:0 0 0 2px rgba(217,127,86,0.18);}
.sheet h2.otd-sheet-title{font-family:var(--font-mono);font-size:14px;font-weight:700;letter-spacing:.5px;
  color:#d97f56;margin:0 2px 14px;}
[data-theme="dark"] .sheet h2.otd-sheet-title{color:#f0a888;}
@media(prefers-color-scheme:dark){[data-theme="system"] .sheet h2.otd-sheet-title{color:#f0a888;}}
.otd-list{display:flex;flex-direction:column;gap:4px;margin:0 -6px;}
.otd-no-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--text3);}
.otd-title-lane{flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap;}
.otd-title-txt{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;font-size:13px;color:var(--text);font-weight:500;will-change:transform;}
/* OTD와 주간 기록이 검색 상세 SESSIONS의 같은 행을 공유한다. */
.otd-list .otd-card.cl-srow{border:0;background:transparent;}
.otd-list .otd-card.cl-srow:active{background:var(--card-hover);}
.otd-list .otd-visual{position:relative;width:100px;flex:0 0 auto;}
.otd-list .otd-visual .sp{width:100%;flex:0 0 auto;}
/* 캡션은 포스터 아래에 보이되 flex 높이에서는 제외한다. 오른쪽 3줄은 캡션을 넣기 전
   SESSIONS의 포스터 중심에 그대로 맞고, 늘린 아래 패딩이 캡션 자리만 따로 확보한다. */
#otdList .otd-card.cl-srow,
#weekList .otd-card.cl-srow{padding-bottom:13px;}
#otdList .otd-age,
#weekList .otd-age{position:absolute;left:2px;top:calc(100% + 3px);display:block;max-width:calc(100% - 2px);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono);font-size:7.5px;font-weight:600;line-height:1;
  letter-spacing:.15px;text-transform:uppercase;}

/* ── 스트릭 시트 (콤보 주간 films-per-week — macOS 주간 차트 미러) ── */
.sheet h2.wk-sheet-title{font-family:var(--font-mono);font-size:15px;font-weight:700;letter-spacing:0.8px;color:#3DC9B0;margin:0 2px 5px;}
.sheet h2.wk-films-title{font-family:var(--font-mono);font-size:14px;font-weight:700;letter-spacing:0.5px;margin:0 2px 14px;}
[data-theme="dark"] .sheet h2.wk-sheet-title{color:#4FE0C5;}
@media(prefers-color-scheme:dark){[data-theme="system"] .sheet h2.wk-sheet-title{color:#4FE0C5;}}
.wk-rows{display:flex;flex-direction:column;gap:1px;}
.wk-row,.wk-axis{display:flex;align-items:center;gap:7px;}
.wk-axis{padding:0;}
.wk-label{flex:0 0 68px;display:flex;align-items:baseline;justify-content:flex-end;gap:3px;text-align:right;}
.wk-mo{font-family:var(--font-mono);font-size:8px;font-weight:700;color:var(--text2);white-space:nowrap;}
.wk-w{font-family:var(--font-mono);font-size:10px;font-weight:700;}
.wk-row{padding:2px 0;}
.wk-row.is-month-boundary{margin-top:3px;border-top:1px solid var(--border);padding-top:4px;}
.wk-track{flex:1;height:15px;background:var(--card);border-radius:3px;position:relative;display:flex;align-items:center;overflow:hidden;}
.wk-track .grid-line{position:absolute;top:0;bottom:0;width:1px;background:var(--border);opacity:.55;z-index:0;}
.wk-fill{position:relative;z-index:1;height:100%;min-width:20px;border-radius:3px;flex-shrink:0;display:flex;align-items:center;justify-content:flex-end;overflow:hidden;}
.wk-row[data-monday]{cursor:pointer;border-radius:4px;}
.wk-row[data-monday]:active{background:var(--card);}
.wk-val-in{color:#fff;font-family:var(--font-mono);font-size:9px;font-weight:700;padding-right:4px;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.35);}
.wk-val-out{position:relative;z-index:1;margin-left:5px;font-family:var(--font-mono);font-size:9.5px;font-weight:700;white-space:nowrap;}
.wk-axis-track{background:transparent;overflow:visible;}
.wk-axis-track span{position:absolute;bottom:1px;transform:translateX(-50%);font-family:var(--font-mono);font-size:8px;color:var(--text3);}
.wk-combo{flex:0 0 30px;position:relative;display:flex;align-items:center;justify-content:flex-end;padding-right:2px;}
.wk-combo::before{content:"";position:absolute;left:9px;top:-1px;bottom:-1px;width:2px;border-radius:1px;background:#3DC9B0;}
[data-theme="dark"] .wk-combo::before{background:#4FE0C5;}
@media(prefers-color-scheme:dark){[data-theme="system"] .wk-combo::before{background:#4FE0C5;}}
.wk-axis .wk-combo::before,.wk-row.is-empty .wk-combo::before{display:none;}
.wk-combo-num{position:relative;z-index:1;font-family:var(--font-mono);font-size:11px;font-weight:700;color:#3DC9B0;}
[data-theme="dark"] .wk-combo-num{color:#4FE0C5;}
@media(prefers-color-scheme:dark){[data-theme="system"] .wk-combo-num{color:#4FE0C5;}}
.wk-combo-broken{position:relative;z-index:1;font-family:var(--font-mono);font-size:11px;font-weight:700;color:#E85B7B;text-decoration:line-through;text-decoration-thickness:2px;}
[data-theme="dark"] .wk-combo-broken{color:#FF7A99;}
@media(prefers-color-scheme:dark){[data-theme="system"] .wk-combo-broken{color:#FF7A99;}}
.wk-combo-head{font-family:var(--font-mono);font-size:8px;color:var(--text3);letter-spacing:0.5px;}
@keyframes wk-live-pulse{0%,100%{text-shadow:0 0 0 rgba(61,201,176,0);}50%{text-shadow:0 0 7px rgba(61,201,176,0.8);}}
@keyframes wk-live-pulse-dark{0%,100%{text-shadow:0 0 0 rgba(79,224,197,0);}50%{text-shadow:0 0 8px rgba(79,224,197,0.85);}}
@keyframes wk-atrisk-pulse{0%,100%{text-shadow:0 0 0 rgba(232,91,123,0);}50%{text-shadow:0 0 7px rgba(232,91,123,0.8);}}
@keyframes wk-atrisk-pulse-dark{0%,100%{text-shadow:0 0 0 rgba(255,122,153,0);}50%{text-shadow:0 0 8px rgba(255,122,153,0.85);}}
.wk-row.is-current .wk-combo-num{animation:wk-live-pulse 2.4s ease-in-out infinite;}
[data-theme="dark"] .wk-row.is-current .wk-combo-num{animation-name:wk-live-pulse-dark;}
@media(prefers-color-scheme:dark){[data-theme="system"] .wk-row.is-current .wk-combo-num{animation-name:wk-live-pulse-dark;}}
.wk-row.is-atrisk .wk-combo-num{color:#E85B7B;animation:wk-atrisk-pulse 1.6s ease-in-out infinite;}
[data-theme="dark"] .wk-row.is-atrisk .wk-combo-num{color:#FF7A99;animation-name:wk-atrisk-pulse-dark;}
@media(prefers-color-scheme:dark){[data-theme="system"] .wk-row.is-atrisk .wk-combo-num{color:#FF7A99;animation-name:wk-atrisk-pulse-dark;}}
.wk-row.is-atrisk .wk-track{background:repeating-linear-gradient(45deg,var(--card),var(--card) 3px,transparent 3px,transparent 6px);}
.wk-legend-bottom{margin-top:14px;padding:10px 4px 0;border-top:1px solid var(--border);}

/* ── Settings ── */
.settings-section{margin-bottom:22px;}
.settings-title{
  font-family:var(--font-display);font-size:12px;letter-spacing:2.5px;
  color:var(--text3);margin-bottom:10px;
}
.data-status{font-family:var(--font-mono);font-size:12.5px;color:var(--text2);margin-bottom:10px;}
.btn{
  border:1px solid var(--border);border-radius:10px;background:var(--card);
  color:var(--text);font-size:13px;padding:9px 14px;cursor:pointer;
  font-family:var(--font);
}
.btn:active{background:var(--card-hover);}
.btn:disabled{opacity:.45;}
.btn.btn-accent{border-color:var(--accent2);color:var(--accent);}
.btn.active{border-color:var(--accent);color:var(--accent);}
.sync-actions{display:flex;gap:8px;}
.sync-actions .btn{flex:1;}
.toggle-row{
  display:flex;align-items:center;gap:9px;margin-top:11px;
  font-size:12.5px;color:var(--text2);cursor:pointer;
  -webkit-user-select:none;user-select:none;
}
.toggle-row input{accent-color:var(--accent);width:16px;height:16px;}
.field-row{display:flex;gap:8px;margin:10px 0;}
.field-row input{
  flex:1;min-width:0;padding:10px 12px;border-radius:10px;
  border:1px solid var(--border);background:var(--card);color:var(--text);
  font-size:13px;font-family:var(--font-mono);
}
.field-row input::placeholder{color:var(--text3);}
.field-row input:focus{outline:none;border-color:var(--accent2);}
.db-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 2px;border-bottom:1px solid var(--border);
}
.db-info{display:flex;flex-direction:column;gap:2px;min-width:0;}
.db-label{font-size:13.5px;font-weight:600;}
.db-id{font-family:var(--font-mono);font-size:10.5px;color:var(--text3);}
.db-last-sync{font-size:10.5px;color:var(--text3);}
.db-actions{display:flex;gap:5px;flex-shrink:0;}
.db-actions button{
  border:1px solid var(--border);border-radius:8px;background:transparent;
  color:var(--text2);font-size:11.5px;padding:6px 9px;cursor:pointer;
}
.db-actions .db-del{color:var(--red);border-color:transparent;}
.db-empty{font-size:12px;color:var(--text3);padding:6px 0;}
.sync-progress{margin-top:12px;}
.sync-progress-head{
  display:flex;justify-content:space-between;gap:8px;
  font-family:var(--font-mono);font-size:11px;color:var(--text2);margin-bottom:6px;
  min-height:14px;
}
.sync-progress-head span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sync-bar-track{height:3px;border-radius:3px;background:var(--border);overflow:hidden;}
.sync-bar{height:100%;width:0%;background:var(--accent);border-radius:3px;transition:width .25s;}
.sync-log{
  margin-top:10px;max-height:180px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  font-family:var(--font-mono);font-size:10.5px;line-height:1.65;color:var(--text2);
  background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:8px 10px;
  white-space:pre-wrap;word-break:break-all;
}
.sync-log:empty{display:none;}
.sync-log .log-ok{color:var(--green);}
.sync-log .log-err{color:var(--red);}
.sync-log .log-info{color:var(--text3);}
.notion-details summary{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:11px 13px;border:1px solid var(--border);border-radius:10px;
  background:var(--card);cursor:pointer;
  -webkit-user-select:none;user-select:none;list-style:none;
}
.notion-details summary::-webkit-details-marker{display:none;}
.notion-details summary::after{content:'▾';color:var(--text3);font-size:11px;}
.notion-details[open] summary::after{content:'▴';}
.notion-summary-meta{
  margin-left:auto;font-family:var(--font-mono);font-size:10.5px;color:var(--text3);
}
.notion-details-body{padding-top:10px;}
.import-details{margin-top:6px;}
.import-details summary{
  font-size:12px;color:var(--text3);cursor:pointer;padding:4px 0;
  -webkit-user-select:none;user-select:none;
}
.import-details textarea{
  width:100%;margin:8px 0;padding:10px 12px;border-radius:10px;
  border:1px solid var(--border);background:var(--card);color:var(--text);
  font-size:11.5px;font-family:var(--font-mono);resize:vertical;
}
.import-details textarea:focus{outline:none;border-color:var(--accent2);}
.theme-btns{display:flex;gap:8px;}
.theme-btns .btn{flex:1;font-family:var(--font-display);letter-spacing:1.5px;font-size:12px;}
.about-line{font-family:var(--font-mono);font-size:11.5px;color:var(--text3);}

/* ── Pace 풀차트 뷰 ── */
.pace-view{
  position:fixed;inset:0;z-index:190;background:var(--bg);
  display:none;flex-direction:column;
  padding:calc(10px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom));
  overscroll-behavior:none;
}
/* ── 전체화면 상세를 '문서'가 스크롤하게 하는 모드 ────────────────────────────
   iOS의 상태바 탭은 문서 스크롤만 맨 위로 보낸다. 안쪽 div가 스크롤을 쥐고 있으면
   그 제스처가 아예 닿지 않는다(MOST WATCHED 둘과 MILESTONES가 그랬다).
   그래서 이 셋은 화면을 덮는 대신 본문 자리를 차지하고, 문서가 스크롤한다.
   나머지 전체화면(PACE·CINEMAS·TREND 등)은 한 화면에 들어차는 차트라 그대로 둔다. */
body.docview{padding-top:0;padding-bottom:0;}
body.docview > .header,
body.docview > .gauge-strip,
body.docview > main,
body.docview > .safe-cap,
body.docview > .app-footer{display:none;}
/* 전체화면 상세가 열린 동안 뒤 메인 문서 스크롤 잠금(제스처가 문서로 새는 것 방지) */
html.vlock, html.vlock body{overflow:hidden;}
.pace-view.show{display:flex;}
.pace-view.doc-scroll{position:static;display:block;padding:0;overflow:visible;
  min-height:100dvh;}
.pace-view.doc-scroll > .fl-body,
.pace-view.doc-scroll > .md-body{flex:none;display:block;overflow:visible;}

.pace-view-head{display:flex;align-items:center;gap:10px;padding:4px 4px 10px;}
/* ── 페이스 상세(카드 확장판, 목업 A안) ──
   가로 패딩을 뷰/본문에서 제거하고 섹션별로 부여 — 차트는 아무 트릭 없이 width:100% = 화면 전폭.
   헤더는 노치 바로 아래(top 패딩 최소), 컨트롤은 우측 밀착. */
#paceView{padding:env(safe-area-inset-top) 0 calc(8px + env(safe-area-inset-bottom));}
#paceView .pace-view-head{padding:0 14px 6px;gap:6px;}
#paceView #paceCloseBtn{margin-top:-2px;} /* ✕ 노치 바로 밑 */
#paceView .pace-view-title{font-size:12px;letter-spacing:2.5px;color:var(--text3);} /* 카드 타이틀 문법 */
.pace-view-head .pd2-ctl{margin-left:auto;margin-right:0;}
.pd2-ctl .sb-date{font-size:10px;}
.pd2-ctl[data-st="idle"] .sb-date{display:inline;}
/* 순위 전용 화면도 같은 규칙 — 뷰에서 가로 패딩을 걷고 차트는 width:100% = 화면 전폭.
   헤드와 히트맵만 14px을 따로 받는다. */
#rankView{padding:env(safe-area-inset-top) 0 calc(8px + env(safe-area-inset-bottom));}
/* 위 블록(듀얼·포디움·차트)은 고정, 표만 자체 스크롤 — 연도가 늘어도 차트는 항상 한눈에 */
.pace-detail-body{flex:1;overflow:hidden;padding:2px 0 0;display:flex;flex-direction:column;gap:7px;}
.pace-detail-body > *{flex-shrink:0;} /* 세로 flex가 svg 높이를 누르면 뷰박스가 letterbox 축소되던 것 차단 */
.pace-detail-body > .pace-duel{margin:2px 14px 0;}
.pace-detail-body > .podium{margin:0 14px;}
.pace-detail-body > .pace-years{flex:0 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;margin:0 14px;padding-bottom:12px;}
.pace-detail-body .pace-year-row{padding:3.5px 2px;} /* 행 압축 */
.pace-detail-body .pace-gauge{margin-top:3px;height:2px;}
.pd2-chartwrap{line-height:0;}
/* PACE LEAD — 격차 차트(실선 실제 + 빗금 예측). 메인 차트처럼 풀블리드(좌우 끝까지)로 정렬 */
.pd2-lead{line-height:0;}
.pd2-lead .cn-laneh{line-height:normal;padding:0 16px;}
.pd2-leadsvg{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair;}
/* ── 가로 모드(2안): 좌 = 와이드 차트, 우 = 듀얼·표. 포디움 제거(사용자 확정 — 헤더 충돌 여지 제거),
   헤더는 우상단 플로팅(타이틀 숨김), 듀얼은 그 아래로 클리어런스 ── */
@media (orientation: landscape){
  /* 아래 인셋 확보 — 홈 인디케이터가 차트 월 라벨(Jan~Dec)과 겹치던 것 방지(CINEMAS와 동일) */
  #paceView{padding:0 env(safe-area-inset-right) calc(4px + env(safe-area-inset-bottom)) env(safe-area-inset-left);}
  #paceView .pace-view-head{position:absolute;top:6px;right:calc(10px + env(safe-area-inset-right));left:auto;padding:0;z-index:5;}
  #paceView .pace-view-title{display:none;}
  /* 좌:우 ≈ 56:44 — 표는 열 수가 적어 CINEMAS 사이드만큼 넓을 필요가 없고, 차트를 더 시원하게.
     비율 기반이라 안전영역으로 가용폭이 줄어드는 기기에서도 차트 우위가 유지된다(고정 상한 X). */
  .pace-detail-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(270px,1fr);grid-template-rows:auto minmax(0,1fr);gap:4px 10px;padding:4px 6px;overflow:hidden;}
  .pace-detail-body > .pd2-chartwrap{grid-column:1;grid-row:1/3;position:relative;min-height:0;}
  .pace-detail-body > .pd2-chartwrap .pd2-chart{position:absolute;inset:0;width:100%;height:100%;}
  .pace-detail-body > .podium{display:none;}
  .pace-detail-body > .pace-duel{grid-column:2;grid-row:1;margin:34px 0 0;}
  .pace-detail-body > .pace-years{grid-column:2;grid-row:2;margin:0;min-height:0;overflow-y:auto;}
  .pace-detail-body .pace-duel .pd-big{font-size:24px;}
}
.pd2-chart{display:block;width:100%;max-width:none;height:auto;touch-action:none;}
.podium{display:flex;gap:6px;}
/* 분할 알약 — 왼쪽 색면(순위/연도, 흰 글자), 오른쪽 값. 4개가 가로축을 균등 분할해 꽉 채움 */
.pod{display:flex;align-items:stretch;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--card);flex:1 1 0;min-width:0;}
.pod .pr{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5px;font-family:var(--font-mono);font-weight:700;color:#fff;background:var(--pc);padding:5px 7px;line-height:1;}
.pod .pr b{font-size:8px;letter-spacing:.3px;font-weight:700;}
.pod .pr i{font-style:normal;font-size:8.5px;font-weight:700;}
.pod .pv{display:flex;align-items:center;justify-content:center;flex:1;font-family:var(--font-mono);font-size:15.5px;font-weight:700;color:var(--pc);line-height:1;padding:0 6px;}
.pod-est{font-style:normal;font-size:6px;font-weight:700;margin-left:2px;position:relative;top:-3.5px;} /* 숫자 기준 상대 배치 — 값 글리프 윗선 정렬 */
.pace-detail-body .pace-years{margin-top:2px;}
.pace-detail-body .pace-year-row{cursor:pointer;}
.pace-detail-body .pace-year-row.dim{opacity:.35;}
.pace-view-title{
  font-family:var(--font-display);font-size:18px;letter-spacing:2.5px;color:var(--accent);
}
.pace-presets{display:flex;gap:5px;margin-left:auto;}
.pace-presets button{
  border:1px solid var(--border);border-radius:12px;background:var(--card);
  color:var(--text2);font-size:11px;padding:6px 10px;cursor:pointer;white-space:nowrap;
}
.pace-presets button.active{border-color:var(--accent);color:var(--accent);}
.pace-chart-wrap{
  position:relative;flex:1;min-height:0;display:flex;align-items:center;
  touch-action:none;
}
.pace-chart-wrap svg{width:100%;max-height:100%;}
.pv-axis{font-family:var(--font-mono);font-size:8.5px;fill:var(--text3);}
.pv-cursor-date{font-family:var(--font-mono);font-size:10px;font-weight:700;fill:#E85050;}
.pv-panel{
  position:absolute;top:10px;left:44px;
  background:var(--card);border:1px solid var(--border);border-radius:10px;
  padding:8px 11px;box-shadow:var(--shadow);pointer-events:none;
  min-width:104px;
}
.pv-panel-date{
  font-family:var(--font-mono);font-size:10.5px;color:var(--text2);
  padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid var(--border);
}
.pv-panel-row{display:flex;align-items:baseline;gap:6px;padding:2px 0;}
.pv-panel-row i{width:7px;height:7px;border-radius:2px;flex-shrink:0;align-self:center;}
.pv-panel-year{font-family:var(--font-display);font-size:11px;letter-spacing:1px;color:var(--text2);line-height:1;}
.pv-panel-row b{margin-left:auto;font-family:var(--font-mono);font-size:11px;font-weight:700;line-height:1;}
.pv-panel-gap{
  margin-top:4px;padding-top:4px;border-top:1px dashed var(--border);
  text-align:center;font-family:var(--font-gap);font-size:10.5px;color:#3DC9B0;font-weight:700;
}
.pace-legend{
  display:flex;flex-wrap:wrap;gap:7px;
  padding:10px 2px 2px;flex-shrink:0;
}
.pv-chip{
  flex-shrink:0;display:flex;align-items:baseline;gap:7px;
  border:1.5px solid var(--border);border-radius:15px;background:var(--card);
  color:var(--text);padding:9px 15px;cursor:pointer;
  font-family:var(--font-display);font-size:15px;letter-spacing:1.2px;line-height:1;
}
.pv-chip span{font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:0;line-height:1;position:relative;top:-0.5px;}
.pv-chip i{width:9px;height:9px;border-radius:2px;flex-shrink:0;align-self:center;}
.pv-chip.dimmed{opacity:.45;}

/* ── Pace 차트: 가로 폰 몰입 모드 (그래프가 화면 꽉 채움, 세로는 불변) ── */
@media (orientation: landscape) and (max-height: 520px) {
  .pace-view{
    padding:6px calc(10px + env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left));
  }
  .pace-view .pace-view-title,
  .pace-view .pace-presets,
  .pace-view .pace-legend{display:none;}
  .pace-view-head{
    position:fixed;z-index:6;padding:0;height:auto;width:auto;
    top:calc(4px + env(safe-area-inset-top));right:calc(4px + env(safe-area-inset-right));left:auto;
  }
  .pace-view-head .icon-btn{background:var(--bg2);border:1px solid var(--border);border-radius:50%;}
  .pace-view .pace-chart-wrap{padding:0;}
  .pace-view .pace-chart-wrap svg{width:100%;height:100%;max-height:100%;}
  .pace-view .pv-panel{top:6px;left:44px;}
}

/* ── iOS 설치 안내 배너 ── */
.install-banner{
  position:fixed;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom));
  z-index:150;display:flex;align-items:center;gap:10px;
  background:var(--card);border:1px solid var(--accent2);border-radius:14px;
  padding:12px 14px;box-shadow:var(--shadow);
}
.install-banner-text{font-size:12px;line-height:1.55;color:var(--text2);}
.install-banner-text b{color:var(--accent);}
.install-banner-close{
  flex-shrink:0;width:30px;height:30px;border:none;border-radius:8px;
  background:transparent;color:var(--text3);font-size:14px;cursor:pointer;
}

/* ── 하단 정보 푸터 (홈 인디케이터 세이프 존 겸 오터치 방지 데드존) ── */
.app-footer{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  padding:6px 0 max(11px, calc(env(safe-area-inset-bottom) - 8px)); /* iOS 안전영역이 홈바보다 넉넉 → 8px만 줄여 살짝 띄움 */
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;
  background:var(--bg); /* 솔리드 — 카드가 뒤에 안 비침 */
  font-family:var(--font-mono);
  /* pointer-events 기본값(auto): 이 띠가 탭을 흡수해 카드 오터치를 막는 데드존.
     홈 스와이프는 시스템 제스처라 그대로 동작. */
}
.app-footer:empty{display:none;}
.af-row-stats{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;justify-content:center;}
.af-stat{font-size:10.5px;letter-spacing:0.1px;white-space:nowrap;}
.af-stat i{color:var(--text);font-style:normal;font-weight:400;}
.af-stat b{font-weight:700;}
/* 왕관 탭 — 총계 대신 신전 등급 구성
   (Hall of Fame 175/286 · ★★★★★ 45/76 · ★★★★½ 130/210).
   묶음은 라벨·별·숫자까지 통째로 한 색이다 — 전체는 탭 색(민트), 등급은
   카드(.hof-sum)의 금/은. 가운뎃점은 뒤따르는 묶음의 색을 미리 입어
   어디서 갈라지는지 먼저 말한다. */
/* 라벨·별도 숫자와 같은 굵기 — 묶음 안에서 앞뒤 무게가 갈리지 않게 (폭은 모노라 그대로) */
.af-star i{letter-spacing:.4px;font-weight:700;}
.af-star em{font-style:normal;margin-right:6px;}
.af-star.total i,.af-star.total b{color:var(--hof-mint);}
.af-star.five i,.af-star.five em,.af-star.five b{color:#D4AF37;}
.af-star.half i,.af-star.half em,.af-star.half b{color:#969CA8;}
[data-theme="light"] .af-star.five i,[data-theme="light"] .af-star.five em,
[data-theme="light"] .af-star.five b{color:#9a7a1c;}
[data-theme="light"] .af-star.half i,[data-theme="light"] .af-star.half em,
[data-theme="light"] .af-star.half b{color:#6d747f;}
.af-row-sync{font-size:9px;color:var(--text3);letter-spacing:0.3px;}
.af-row-sync b{color:var(--text2);font-weight:700;}

/* ── Toast ── */
.toast{
  position:fixed;left:50%;bottom:calc(44px + env(safe-area-inset-bottom));z-index:300;
  transform:translateX(-50%) translateY(16px);
  background:var(--card);color:var(--text);border:1px solid var(--border);
  border-radius:12px;padding:10px 16px;font-size:13px;
  box-shadow:var(--shadow);opacity:0;pointer-events:none;
  transition:opacity .22s,transform .22s;max-width:92vw;text-align:center;white-space:nowrap;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.ok{border-color:var(--green);}
.toast.err{border-color:var(--red);}

/* ── iOS 포커스 자동 줌 방지 — 텍스트 입력이 16px 미만이면 포커스 때 페이지가 확대됨.
   (TMDB URL·Notion 토큰/DB 입력 등 전 필드 공통, range·color·checkbox는 무관) ── */
input:not([type="range"]):not([type="color"]):not([type="checkbox"]), textarea, select{font-size:16px;}