/* Tsubasa web/iPad compatibility + compositor performance overrides. */

/* Android's enhanced glass uses url(#milk-refract) in backdrop-filter. WebKit
   does not reliably accept that combination, so Safari/iPad can fall back to
   translucency without blur. Force the native blur path on the web build. */
.dict-popup,
.dict-panel,
.kpop-wrap {
  -webkit-backdrop-filter: blur(16px) saturate(150%) !important;
  backdrop-filter: blur(16px) saturate(150%) !important;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.reader-scroll,
.dict-panel-scroll,
.dict-popup-scrollable,
.sidebar-toc,
.vocab-list {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.dict-panel-scroll,
.dict-popup-scrollable { touch-action: pan-y; }

/* Touch devices pay a high compositor cost when every persistent surface has
   a 22px backdrop blur while the EPUB moves underneath. Preserve strong glass
   on the dictionary, but make the always-visible chrome/cards cheaper. */
@media (hover: none), (pointer: coarse) {
  .topbar,
  .bottombar,
  .vocab-header,
  .library-header,
  .anki-header {
    -webkit-backdrop-filter: blur(8px) saturate(125%) !important;
    backdrop-filter: blur(8px) saturate(125%) !important;
  }

  .book-card,
  .vocab-card,
  .stats-card,
  .dropzone,
  .hint-row {
    -webkit-backdrop-filter: blur(6px) saturate(125%) !important;
    backdrop-filter: blur(6px) saturate(125%) !important;
  }

  .book-card::after,
  .vocab-card::after,
  .stats-card::after,
  .dict-popup::after,
  .dict-panel::after,
  .kpop-wrap::after,
  .nav-btn::after,
  .toggle::after,
  .library-import-btn::after,
  .topbar-btn::after { transition: none !important; }
}


/* v4: configurable dictionary sizing + desktop/touch geometry support. */
/* The panel root gets a persisted px font-size from JS. Use em ratios so this
   works on Safari/iPad without relying on calc() multiplication support. */
.dict-panel .dict-word { font-size: 1.7143em; }
.dict-panel .dict-reading,
.dict-panel .dict-sense-gloss,
.dict-panel .dict-meaning { font-size: 1em; }
.dict-panel .dict-num { font-size: .8571em; }
.dict-panel .dict-pos,
.dict-panel .dict-badge { font-size: .7143em; }
.dict-panel .jd-example-ja,
.dict-panel .dict-panel-inflected,
.dict-panel .dict-sentence-text,
.dict-panel .dict-pitch { font-size: .9286em; }
.dict-panel .jd-example-en,
.dict-panel .dict-reasons,
.dict-panel .dict-info,
.dict-panel .dict-note,
.dict-panel .dict-reference,
.dict-panel .dict-forms,
.dict-panel .dict-component-reading,
.dict-panel .dict-component-meaning,
.dict-panel .dict-expand-btn { font-size: .7857em; }
.dict-panel .dict-component-word { font-size: 1.1429em; }
.dict-panel .dict-definition-toggle,
.dict-panel .dict-components-label { font-size: .7143em; }
.dict-panel .dict-audio-status { font-size: .6429em; }

/* A half-screen touch sheet is intentionally edge-flush. Keep the glass but
   remove the little desktop edge gaps that read as a floating card. */
@media (max-width: 1400px) and (pointer: coarse) {
  .dict-panel {
    max-width: none !important;
    border-left: 0;
    border-right: 0;
  }
}