/* ========================================================================== 
   Paw Network — bespoke page surfaces
   Loaded after the shared system. Every section targets one real PHP route
   and reshapes that page's own components without changing its behavior.
   ========================================================================== */

/* Motion and focus shared by the bespoke surfaces. */
.paw-page :is(.card,.pkg-card,.note-card,.countdown-card,.vcc-card,.vault-card,.glucose-card) {
  transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.paw-page :is(button,a,input,select,textarea):focus-visible {
  outline: 2px solid color-mix(in srgb,var(--page-accent,#ff58c5) 80%,white);
  outline-offset: 2px;
}

/* ── Attendance: shift overview + live status rail ───────────────────── */
.paw-route-attendance .attendance-layout {
  grid-template-columns: minmax(0,1.3fr) minmax(300px,.7fr);
  gap: 20px;
}
.paw-route-attendance .attendance-left,
.paw-route-attendance .attendance-right {
  padding: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background: rgba(13,16,23,.68);
}
.paw-route-attendance .attendance-status-grid { gap: 12px; }
.paw-route-attendance .attendance-status-grid > * {
  border-radius: 17px;
  background: linear-gradient(145deg,rgba(140,214,179,.09),rgba(255,255,255,.018));
}
.paw-route-attendance .attendance-log-card { border-radius: 18px !important; overflow: hidden; }

/* ── Calendar: floating month board ──────────────────────────────────── */
.paw-route-calendar .cal-monthnav {
  margin-bottom: 14px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(12,15,22,.72);
}
.paw-route-calendar .cal-month-label { font-size: 1.15rem; letter-spacing: -.025em; }
.paw-route-calendar .cal-nav-btn { width: 40px; height: 40px; border-radius: 12px; }
.paw-route-calendar .cal-grid-wrap {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background: rgba(12,15,22,.64);
  box-shadow: 0 24px 70px rgba(0,0,0,.2);
}
.paw-route-calendar .cal-day {
  min-height: 118px;
  border-color: rgba(255,255,255,.065);
  border-radius: 13px;
  background: rgba(255,255,255,.016);
}
.paw-route-calendar .cal-day:hover { border-color: rgba(140,214,179,.35); background: rgba(140,214,179,.055); }

/* ── Tasks: kanban-like command surface ──────────────────────────────── */
.paw-route-tasks .status-pills {
  padding: 5px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(8,10,15,.52);
}
.paw-route-tasks .status-pill { min-height: 38px; padding: 8px 14px; border-radius: 11px; }
.paw-route-tasks .status-pill.active { background: rgba(140,214,179,.14); color: #b9f0d6; box-shadow: none; }
.paw-route-tasks :is(.task-card,.task-row) {
  border-radius: 18px;
  background: linear-gradient(145deg,rgba(255,255,255,.025),transparent),rgba(15,18,26,.82);
}
.paw-route-tasks :is(.task-card,.task-row):hover { transform: translateY(-3px); border-color: rgba(140,214,179,.3); }
.paw-route-task_view .task-view-card { max-width: 1060px; margin-inline: auto; padding: 24px; }

/* ── Notes: colorful notebook grid ───────────────────────────────────── */
.paw-route-notes .notes-section-label { margin: 6px 0 14px; color: #ff9cdc; letter-spacing: .12em; }
.paw-route-notes .notes-grid { grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); gap: 15px; }
.paw-route-notes .note-card {
  min-height: 190px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 21px;
  background: linear-gradient(150deg,color-mix(in srgb,var(--note-color,#ff58c5) 8%,transparent),transparent 48%),rgba(16,19,27,.9);
}
.paw-route-notes .note-card:hover { transform: translateY(-4px) rotate(-.15deg); box-shadow: 0 24px 55px rgba(0,0,0,.25); }
.paw-route-notes .note-color-bar { height: 5px; border-radius: 99px; }
.paw-route-notes .notes-empty { min-height: 360px; border-radius: 24px; }

/* ── Docs: knowledge-base split view ─────────────────────────────────── */
.paw-route-docs .docs-layout { gap: 18px; }
.paw-route-docs .docs-folder-sidebar {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px;
  background: rgba(12,15,22,.84);
}
.paw-route-docs .docs-folder-head { padding: 5px 5px 13px; }
.paw-route-docs .docs-folder-item { min-height: 42px; border-radius: 11px; }
.paw-route-docs .docs-folder-item.active { background: linear-gradient(90deg,rgba(140,214,179,.16),rgba(140,214,179,.04)); color: #b9f0d6; }
.paw-route-docs :is(.doc-card,.docs-main) { border-radius: 21px; }

/* ── Countdown: luminous timer tiles ─────────────────────────────────── */
.paw-route-countdown .countdown-grid { grid-template-columns: repeat(auto-fill,minmax(290px,1fr)); gap: 15px; }
.paw-route-countdown .countdown-card {
  padding: 20px;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 22px;
  background: radial-gradient(circle at 100% 0,rgba(140,214,179,.12),transparent 15rem),rgba(15,18,26,.9);
}
.paw-route-countdown .countdown-card:hover { transform: translateY(-4px); border-color: rgba(140,214,179,.34); }
.paw-route-countdown .countdown-tick { font-size: clamp(1.7rem,4vw,2.6rem); letter-spacing: -.045em; font-variant-numeric: tabular-nums; }

/* ── Shopping: receipt-inspired list ─────────────────────────────────── */
.paw-route-shopping .shop-hero .pkg-hero { border-radius: 23px; }
.paw-route-shopping .shop-filter {
  padding: 5px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(8,10,15,.55);
}
.paw-route-shopping :is(.shop-item,.shopping-item) {
  margin-bottom: 9px;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 16px;
  background: rgba(16,19,27,.8);
}
.paw-route-shopping :is(.shop-item,.shopping-item):hover { border-color: rgba(140,214,179,.3); transform: translateX(3px); }
.paw-route-shopping .shop-empty { min-height: 340px; border-radius: 23px; }

/* ── Closing and Work: modern checklist workspace ───────────────────── */
body:is(.paw-route-closing,.paw-route-work,.paw-route-work_view,.paw-route-work_history) .closing-card {
  margin-bottom: 15px;
  border-radius: 22px;
  overflow: hidden;
}
body:is(.paw-route-closing,.paw-route-work,.paw-route-work_view,.paw-route-work_history) .closing-card-header {
  padding: 17px 19px;
  background: linear-gradient(90deg,rgba(140,214,179,.08),transparent);
}
body:is(.paw-route-closing,.paw-route-work,.paw-route-work_view,.paw-route-work_history) .closing-item {
  margin: 8px 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  background: rgba(255,255,255,.018);
}
body:is(.paw-route-closing,.paw-route-work,.paw-route-work_view,.paw-route-work_history) .closing-progress-bar { height: 8px; border-radius: 99px; }
.paw-route-work_history :is(.history-card,.hist-entry) { border-radius: 18px; }

/* ── Chat: floating messenger panes ──────────────────────────────────── */
.paw-route-chat .chat-shell { gap: 16px; padding: 18px 22px 22px; background: transparent; }
.paw-route-chat .chat-sidebar,
.paw-route-chat .chat-main {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 22px;
  background: rgba(13,16,23,.85);
  box-shadow: 0 22px 60px rgba(0,0,0,.2);
}
.paw-route-chat .chat-side-head,
.paw-route-chat .chat-head { min-height: 62px; padding: 14px 16px; background: rgba(255,255,255,.018); }
.paw-route-chat .chat-item { margin: 3px 7px; border-radius: 12px; }
.paw-route-chat .chat-item.active { background: linear-gradient(90deg,rgba(255,79,189,.17),rgba(255,79,189,.04)); }
.paw-route-chat .chat-composer { margin: 12px; border: 1px solid rgba(255,255,255,.09); border-radius: 17px; background: rgba(6,8,13,.72); }

/* ── Watch Together: cinema lounge ───────────────────────────────────── */
.paw-route-watch .watch-lobby { max-width: 1050px; margin-inline: auto; }
.paw-route-watch .watch-lobby-card {
  padding: 28px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 24px;
  background: radial-gradient(circle at 100% 0,rgba(255,98,199,.14),transparent 23rem),rgba(14,17,25,.9);
}
.paw-route-watch .watch-lobby-icon { width: 78px; height: 78px; border-radius: 24px; background: rgba(255,98,199,.13); }
.paw-route-watch .watch-player-page { gap: 16px; }
.paw-route-watch :is(.watch-stage,.watch-chat) { border-radius: 21px; overflow: hidden; }

/* ── Blood Sugar: clinical clarity without losing warmth ────────────── */
.paw-route-glucose .glucose-layout { grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: 20px; }
.paw-route-glucose .glucose-card {
  padding: 19px;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 21px;
  background: rgba(15,18,26,.88);
}
.paw-route-glucose .glucose-current {
  border-radius: 23px;
  background: radial-gradient(circle at 100% 0,rgba(255,123,147,.16),transparent 18rem),rgba(14,17,25,.9);
}
.paw-route-glucose .glucose-zone { border-radius: 12px; }
.paw-route-glucose .glucose-warning { border-radius: 15px; }

/* ── Code Editor: modern IDE frame ───────────────────────────────────── */
.paw-route-code .code-page-main { padding: 14px 18px 18px; gap: 12px; background: transparent; }
.paw-route-code .code-toolbar {
  min-height: 54px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 16px;
  background: rgba(13,16,23,.9);
}
.paw-route-code :is(.code-sidebar,.code-editor-wrap) {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  background: rgba(10,12,18,.9);
}
.paw-route-code .code-tb-btn { border-radius: 10px; }
.paw-route-code .code-status-item:last-child { color: #b9b0ff; }

/* ── Code Generator: module rail + form canvas ───────────────────────── */
.paw-route-codegen .cg-layout { grid-template-columns: 265px minmax(0,1fr); gap: 18px; }
.paw-route-codegen .cg-sidebar {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px;
  background: rgba(12,15,22,.86);
}
.paw-route-codegen .cg-mod-btn { min-height: 48px; margin-bottom: 5px; border-radius: 12px; }
.paw-route-codegen .cg-mod-btn.active { background: linear-gradient(90deg,rgba(142,125,255,.18),rgba(142,125,255,.04)); color: #c8c1ff; }
.paw-route-codegen :is(.cg-main,.cg-panel,.cg-form-panel) { border-radius: 21px; }

/* ── Shared image-tool workbench foundations ────────────────────────── */
body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-workspace,.cr-workspace,.em-workspace,.pe-workspace) {
  grid-template-columns: minmax(0,1fr) 330px;
  gap: 18px;
}
body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-canvas-wrap,.cr-canvas-wrap,.em-canvas-wrap,.pe-canvas-wrap) {
  min-height: 520px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background-color: #080a0f;
  box-shadow: 0 26px 70px rgba(0,0,0,.25);
}
body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-rail,.cr-rail,.em-rail,.pe-rail) { gap: 12px; }
body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-card,.cr-card,.em-card,.pe-card) {
  padding: 16px;
  border-radius: 18px;
  background: rgba(14,17,25,.88);
}

/* BG Remover: transparent checkerboard and mint completion state. */
.paw-route-bg-remover { --page-accent:#8cd6b3; --page-accent-soft:#baf1d7; }
.paw-route-bg-remover .bgr-empty { border-radius: 18px; }
.paw-route-bg-remover .bgr-row { padding: 10px 0; }

/* Color Replacer: dual-color comparison cards. */
.paw-route-color-replace { --page-accent:#ff65c9; --page-accent-soft:#ffa3df; }
.paw-route-color-replace .cr-swap { width: 44px; height: 44px; border-radius: 14px; background: rgba(255,101,201,.12); }
.paw-route-color-replace .cr-row { gap: 12px; }

/* Emission Map: neon preview frame. */
.paw-route-emission-map { --page-accent:#9b7cff; --page-accent-soft:#c3b3ff; }
.paw-route-emission-map .em-canvas-wrap { box-shadow: 0 26px 75px rgba(94,62,255,.12),inset 0 0 55px rgba(122,82,255,.045); }
.paw-route-emission-map .em-row { padding: 9px 0; }

/* Palette Extractor: swatch-forward controls. */
.paw-route-palette-extract { --page-accent:#ff8bca; --page-accent-soft:#ffc0e2; }
.paw-route-palette-extract .pe-palette { gap: 9px; padding: 10px; border-radius: 16px; background: rgba(6,8,13,.54); }
.paw-route-palette-extract .pe-count-row { padding: 9px 0; }

/* ── Batch Resize: upload-first processing queue ─────────────────────── */
.paw-route-batch-resize .br-drop {
  min-height: 290px;
  border: 1.5px dashed rgba(193,124,255,.34);
  border-radius: 24px;
  background: radial-gradient(circle at 50% 100%,rgba(193,124,255,.13),transparent 60%),rgba(13,16,23,.62);
}
.paw-route-batch-resize .br-drop:hover { transform: translateY(-2px); border-color: #c17cff; }
.paw-route-batch-resize .br-controls {
  padding: 17px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 19px;
  background: rgba(14,17,25,.85);
}

/* ── Normal Map: two-panel material laboratory ───────────────────────── */
.paw-route-normal-map .nm-controls {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  background: rgba(14,17,25,.84);
}
.paw-route-normal-map .nm-canvas-row { gap: 18px; }
.paw-route-normal-map .nm-canvas-col { padding: 12px; border: 1px solid rgba(255,255,255,.075); border-radius: 21px; background: rgba(10,12,18,.7); }
.paw-route-normal-map .nm-canvas-wrap { border-radius: 15px; overflow: hidden; }
.paw-route-normal-map .nm-toggle { border-radius: 99px; }

/* ── Pixel Scaler: crisp pixel-console treatment ─────────────────────── */
.paw-route-pixel-art-scaler .pas-controls { padding: 15px; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; background: rgba(13,16,23,.82); }
.paw-route-pixel-art-scaler .pas-scale-group { padding: 5px; border-radius: 14px; background: rgba(5,7,11,.58); }
.paw-route-pixel-art-scaler .pas-scale-btn { min-width: 46px; min-height: 40px; border-radius: 10px; }
.paw-route-pixel-art-scaler .pas-scale-btn.active { background: rgba(193,124,255,.18); color: #ddaaff; }
.paw-route-pixel-art-scaler .pas-panels { gap: 18px; }
.paw-route-pixel-art-scaler .pas-panels > * { border-radius: 20px; overflow: hidden; }

/* ── Seamless Tiler: single focused texture stage ────────────────────── */
.paw-route-seamless-tiler .st-controls { padding: 15px; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; background: rgba(14,17,25,.84); }
.paw-route-seamless-tiler .st-canvas-wrap { min-height: 520px; border-radius: 22px; overflow: hidden; box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.paw-route-seamless-tiler .st-gal-grid { gap: 10px; }
.paw-route-seamless-tiler .st-gal-thumb { border-radius: 13px; }

/* ── Sprite Cutter: production cutting desk ──────────────────────────── */
.paw-route-sprite-cutter .sc-main { grid-template-columns: minmax(0,1fr) 330px; gap: 18px; }
.paw-route-sprite-cutter .sc-canvas-col { padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; background: rgba(9,11,17,.74); }
.paw-route-sprite-cutter .sc-canvas-wrap { min-height: 520px; border-radius: 15px; overflow: hidden; }
.paw-route-sprite-cutter .sc-sidebar { gap: 12px; }
.paw-route-sprite-cutter .sc-panel { padding: 16px; border-radius: 18px; }

/* ── Scene Generator / Setup: cinematic builder panels ───────────────── */
body:is(.paw-route-scene,.paw-route-scene_setup) .scene-layout { grid-template-columns: minmax(300px,.72fr) minmax(0,1.28fr); gap: 20px; }
body:is(.paw-route-scene,.paw-route-scene_setup) .scene-selector {
  padding: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px;
  background: rgba(13,16,23,.84);
}
body:is(.paw-route-scene,.paw-route-scene_setup) .scene-result {
  min-height: 450px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 23px;
  background: radial-gradient(circle at 100% 0,rgba(193,124,255,.14),transparent 22rem),rgba(11,14,21,.88);
}
body:is(.paw-route-scene,.paw-route-scene_setup) .scene-result-row { margin: 8px 0; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.025); }
body.paw-route-scene_setup .scene-setup-grid > * { padding: 17px; }

/* ── Packages: storefront catalogue + detail showroom ────────────────── */
.paw-route-packages .pkg-grid { grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 18px; }
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card {
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 24px !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.025),transparent 35%),
    rgba(15,18,26,.94) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.025);
  transform: translateZ(0);
  transition: transform .22s cubic-bezier(.2,.8,.2,1),border-color .22s,box-shadow .22s;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  z-index: 3;
  opacity: .7;
  background: linear-gradient(90deg,var(--paw-mint),var(--paw-pink),#b775ff);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255,99,199,.31) !important;
  box-shadow: 0 27px 65px rgba(0,0,0,.31),0 0 0 1px rgba(255,79,189,.05);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-thumb {
  aspect-ratio: 16 / 10;
  margin: 8px 8px 0;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 17px;
  background:
    radial-gradient(circle at 70% 20%,rgba(255,79,189,.16),transparent 46%),
    rgba(7,9,14,.8);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-thumb::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 38%;
  pointer-events: none;
  background: linear-gradient(transparent,rgba(6,8,13,.58));
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-thumb-placeholder {
  color: rgba(255,172,224,.62);
  background:
    radial-gradient(circle at 68% 28%,rgba(255,79,189,.2),transparent 42%),
    linear-gradient(145deg,#202531,#11151e);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-body {
  gap: 7px;
  padding: 15px 17px 13px;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-title {
  color: #f6f7fb;
  font-size: 1.02rem;
  font-weight: 780;
  letter-spacing: -.018em;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-author {
  color: rgba(184,191,205,.68);
  font-size: .74rem;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-author span {
  color: var(--paw-mint);
  font-weight: 700;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-tag {
  padding: 4px 8px;
  border-radius: 999px;
  font-size: .62rem;
  font-weight: 750;
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-meta {
  gap: 6px;
  min-height: 48px;
  padding: 9px 13px;
  border-top-color: rgba(255,255,255,.065);
  background: rgba(5,7,11,.36);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-meta-item {
  min-height: 27px;
  padding: 4px 8px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-fav {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border: 1px solid rgba(255,116,207,.16);
  border-radius: 10px;
  background: rgba(255,79,189,.06);
}
body:is(.paw-route-packages,.paw-route-package_details) .pkg-card-fav:is(:hover,.active) {
  color: #ff79ce;
  border-color: rgba(255,116,207,.4);
  background: rgba(255,79,189,.14);
}
.paw-route-packages .pkg-card-lock {
  top: 11px;
  left: 11px;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 10px;
  background: rgba(6,8,13,.78);
  backdrop-filter: blur(10px);
}
.pkg-card-health {
  position: absolute;
  top: 11px;
  right: 11px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
  backdrop-filter: blur(12px);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .015em;
}
.pkg-card-health > span { white-space: nowrap; }
.pkg-card-lock + .pkg-card-health { top: 48px; }
.pkg-card-thumb:has(.pkg-card-menu) .pkg-card-health { right: 50px; }
.pkg-health-healthy {
  border: 1px solid rgba(121,222,175,.32);
  color: #a8eccb;
  background: rgba(10,43,31,.84);
}
.pkg-health-warning {
  border: 1px solid rgba(255,191,77,.4);
  color: #ffd27a;
  background: rgba(42,28,8,.86);
}
.pkg-health-broken {
  border: 1px solid rgba(255,104,128,.4);
  color: #ff9cae;
  background: rgba(48,13,20,.88);
}
.pkg-health-paw {
  display: inline-block;
  transform-origin: 55% 70%;
  transition: transform .2s cubic-bezier(.2,.8,.2,1);
}
.pkg-card:hover .pkg-health-paw { transform: rotate(-9deg) scale(1.13); }
.pkg-detail-health {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 31px;
  padding: 5px 10px;
  border-radius: 10px;
  font-size: .72rem;
  font-weight: 800;
}
.pkg-integrity-warning {
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 0 15px;
  padding: 13px 15px;
  border: 1px solid rgba(255,188,71,.27);
  border-radius: 15px;
  color: #f5d99b;
  background:
    radial-gradient(circle at 100% 0,rgba(255,185,65,.09),transparent 20rem),
    rgba(40,27,9,.5);
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.pkg-integrity-warning-icon {
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,198,91,.25);
  border-radius: 12px;
  color: #ffd16f;
  background: rgba(255,184,48,.1);
  font-size: 1.05rem;
}
.pkg-integrity-warning-copy { display: grid; gap: 3px; min-width: 0; }
.pkg-integrity-warning-copy strong { color: #ffe5ad; font-size: .82rem; }
.pkg-integrity-warning-copy span { color: rgba(245,222,172,.75); font-size: .76rem; line-height: 1.45; }
.paw-route-packages .pkg-browse { gap: 20px; }
.paw-route-packages .pkg-sidebar {
  position: sticky;
  top: calc(var(--paw-topbar) + 16px);
  align-self: start;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 22px;
  background: rgba(11,14,21,.76);
  box-shadow: 0 18px 45px rgba(0,0,0,.16);
  backdrop-filter: blur(16px);
}
.paw-route-packages .pkg-sidebar-search { min-height: 45px; border-radius: 13px; background: rgba(5,7,12,.58); }
.paw-route-packages .pkg-filter-group { padding: 13px; border: 1px solid rgba(255,255,255,.065); border-radius: 16px; background: rgba(255,255,255,.018); }
.paw-route-packages .pkg-filter-title { color: rgba(255,163,220,.86); font-size: .67rem; letter-spacing: .09em; }
.paw-route-packages .pkg-filter-item { margin: 3px 0; padding: 8px 10px; border-radius: 10px; transition: color .15s,background .15s,transform .15s; }
.paw-route-packages .pkg-filter-item:hover { color: #fff; background: rgba(255,79,189,.075); transform: translateX(2px); }
.paw-route-packages .pkg-filter-item.active { color: #ffc1e7; background: linear-gradient(90deg,rgba(255,79,189,.16),rgba(140,214,179,.045)); }
.paw-route-packages .pkg-filter-count { min-width: 24px; padding: 3px 7px; border-radius: 8px; text-align: center; background: rgba(255,255,255,.055); }
.paw-route-packages .pkg-sort-bar { padding: 5px; border: 1px solid rgba(255,255,255,.075); border-radius: 15px; background: rgba(8,10,16,.62); }
.paw-route-packages .pkg-sort-tab { min-height: 38px; padding-inline: 14px; border: 0; border-radius: 11px; }
.paw-route-packages .pkg-sort-tab.active { background: rgba(255,79,189,.13); box-shadow: inset 0 0 0 1px rgba(255,113,205,.15); }

/* Package pop-ups use a roomy command-panel layout rather than a legacy box. */
body:is(.paw-route-packages,.paw-route-package_details) .pkg-modal { max-width: 620px; }
.paw-route-packages #pkg-sync-modal .pkg-modal { width: min(900px,94vw); max-width: 900px; }
.paw-route-packages .pkg-sync-dirs {
  gap: 7px;
  padding: 5px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 15px;
  background: rgba(5,7,12,.42);
}
.paw-route-packages .pkg-sync-dir { min-height: 42px; border: 0; border-radius: 11px; }
.paw-route-packages .pkg-sync-dir.active {
  color: #fff;
  background: linear-gradient(135deg,#ff4fbd,#b766ff);
  box-shadow: 0 10px 24px rgba(255,79,189,.18),inset 0 1px rgba(255,255,255,.22);
}
.paw-route-packages .pkg-sync-hint { padding: 10px 12px; border-radius: 11px; background: rgba(140,214,179,.055); }
.paw-route-packages .pkg-sync-panes { gap: 12px; }
.paw-route-packages .pkg-sync-pane {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  background: rgba(6,8,13,.42);
}
.paw-route-packages .pkg-sync-pane-head { min-height: 30px; }
.paw-route-packages .pkg-sync-list { min-height: 120px; border-radius: 12px; background: rgba(4,6,10,.56); }
.paw-route-packages .pkg-sync-onlyup { margin-top: 13px !important; padding: 11px 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 12px; background: rgba(255,255,255,.02); }

/* Create package: editorial form canvas with a visible three-step journey. */
.paw-route-create_packages .pkg-create-page { max-width: 920px; padding-top: 24px; }
.paw-route-create_packages .pkg-detail-breadcrumb { margin-bottom: 17px; }
.paw-route-create_packages .pkg-wizard-steps {
  gap: 8px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  background: rgba(8,10,16,.68);
  box-shadow: 0 17px 42px rgba(0,0,0,.16);
}
.paw-route-create_packages .pkg-wizard-step {
  position: relative;
  min-height: 58px;
  border: 0;
  border-radius: 14px;
  background: transparent;
}
.paw-route-create_packages .pkg-wizard-step.active {
  color: #ffd0ec;
  background: linear-gradient(135deg,rgba(255,79,189,.18),rgba(183,102,255,.08));
  box-shadow: inset 0 0 0 1px rgba(255,111,205,.16);
}
.paw-route-create_packages .pkg-wizard-step.done { color: var(--paw-mint); background: rgba(140,214,179,.055); }
.paw-route-create_packages .pkg-wizard-num { width: 29px; height: 29px; border-radius: 10px; }
.paw-route-create_packages .pkg-wizard-step.active .pkg-wizard-num { color: #fff; background: linear-gradient(145deg,#ff4fbd,#bd69ff); box-shadow: 0 7px 18px rgba(255,79,189,.2); }
.paw-route-create_packages .pkg-wizard-card {
  position: relative;
  overflow: hidden;
  padding: clamp(22px,4vw,34px);
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 25px;
  background:
    radial-gradient(circle at 100% 0,rgba(255,79,189,.08),transparent 24rem),
    rgba(15,18,27,.9);
  box-shadow: 0 25px 70px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.025);
}
.paw-route-create_packages .pkg-wizard-card::before {
  content: 'WORKSHOP';
  display: inline-flex;
  margin-bottom: 10px;
  color: #ff91d3;
  font-size: .64rem;
  font-weight: 850;
  letter-spacing: .13em;
}
.paw-route-create_packages .pkg-wizard-title { margin-bottom: 7px; font-size: 1.45rem; letter-spacing: -.025em; }
.paw-route-create_packages .pkg-wizard-desc { margin-bottom: 25px; font-size: .88rem; }
.paw-route-create_packages .pkg-wizard-card > label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 19px 0 8px;
  color: rgba(239,242,249,.77);
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.paw-route-create_packages .pkg-wizard-input { min-height: 49px; margin-bottom: 0; padding: 12px 14px; border-radius: 14px; }
.paw-route-create_packages .pkg-bb-bar { min-height: 43px; padding: 5px; border-radius: 14px 14px 0 0; }
.paw-route-create_packages .pkg-bb-bar button { min-width: 32px; min-height: 31px; border-radius: 9px; }
.paw-route-create_packages .pkg-bb-textarea { min-height: 150px; padding: 14px; border-radius: 0 0 14px 14px !important; }
.paw-route-create_packages .pkg-upload-zone {
  min-height: 280px;
  display: grid;
  place-content: center;
  border-color: rgba(255,110,205,.27);
  border-radius: 20px;
  background: radial-gradient(circle at 50% 70%,rgba(255,79,189,.09),transparent 55%),rgba(6,8,13,.5);
}
.paw-route-create_packages .pkg-upload-zone:hover { border-color: rgba(255,110,205,.65); background-color: rgba(255,79,189,.045); }
.paw-route-create_packages .pkg-upload-icon { font-size: 3rem; filter: drop-shadow(0 10px 22px rgba(255,79,189,.2)); }
.paw-route-create_packages .pkg-wizard-nav {
  position: sticky;
  bottom: 12px;
  z-index: 5;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 17px;
  background: rgba(10,12,18,.86);
  box-shadow: 0 18px 45px rgba(0,0,0,.26);
  backdrop-filter: blur(18px);
}
.paw-route-create_packages .pkg-wizard-btn { justify-content: center; min-height: 46px; padding-inline: 18px; border-radius: 12px; }
.paw-route-create_packages .pkg-wizard-btn-primary { color: #fff; background: linear-gradient(135deg,#ff4fbd,#bd68ff); border-color: transparent; box-shadow: 0 11px 27px rgba(255,79,189,.18); }
.paw-route-create_packages .pkg-tagpick { min-height: 35px; padding: 6px 10px !important; border-radius: 11px !important; background: rgba(255,255,255,.025); }
.paw-route-package_details .pkg-detail-hero { border-radius: 24px; overflow: hidden; }
.paw-route-package_details .pkg-detail-info-row { padding: 10px 0; border-color: rgba(255,255,255,.065); }
.paw-route-create_packages .pkg-wizard-btn { min-height: 48px; border-radius: 13px; }

/* ── Gallery and Files finishing details ─────────────────────────────── */
.paw-route-gallery #gallery-page .empty-state,
.paw-route-files #files-page .empty-state {
  min-height: 300px;
  border: 1px dashed rgba(255,100,201,.2) !important;
  border-radius: 23px !important;
  background: radial-gradient(circle at 50% 100%,rgba(255,79,189,.08),transparent 60%),rgba(13,16,23,.54) !important;
}
.paw-route-gallery #gallery-page .pagination,
.paw-route-files #files-page .pagination { margin-top: 18px; padding: 11px; border-radius: 15px; background: rgba(13,16,23,.64); }

/* ── Teams: identity-rich workspace cards ────────────────────────────── */
.paw-route-teams .teams-grid { grid-template-columns: repeat(auto-fill,minmax(350px,1fr)); gap: 16px; }
.paw-route-teams .team-card {
  border-radius: 22px !important;
  background: radial-gradient(circle at 100% 0,rgba(255,98,199,.12),transparent 17rem),rgba(15,18,26,.88) !important;
}
.paw-route-teams .tc-head { padding: 20px; }
.paw-route-teams .tc-avatar { width: 58px; height: 58px; border-radius: 18px; }
.paw-route-teams .tc-footer { padding: 12px 16px; background: rgba(7,9,14,.42); }
.paw-route-teams .tc-action-btn { min-height: 38px; border-radius: 11px; }

/* ── Team Admin: horizontal control deck ─────────────────────────────── */
.paw-route-team-admin .ta-tabs {
  margin-bottom: 18px;
  padding: 5px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(7,9,14,.48);
}
.paw-route-team-admin .ta-tab { margin: 0; border: 0; border-radius: 11px; }
.paw-route-team-admin .ta-tab.active { background: rgba(255,98,199,.14); color: #ffa0dc; }
.paw-route-team-admin .ta-panel > .card { border-radius: 22px !important; }
.paw-route-team-admin .ta-member-row { min-height: 58px; padding-inline: 8px; }

/* ── Team Policy: document + sticky table of contents ───────────────── */
.paw-route-team_policy .policy-layout { grid-template-columns: minmax(0,1fr) 270px; gap: 20px; }
.paw-route-team_policy .policy-doc { padding: 24px; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; background: rgba(14,17,25,.84); }
.paw-route-team_policy .policy-doc-group { margin-bottom: 24px; }
.paw-route-team_policy .policy-doc-item { padding: 15px; border-radius: 15px; background: rgba(255,255,255,.022); }
.paw-route-team_policy .policy-toc { top: calc(var(--paw-topbar) + 18px); padding: 16px; border-radius: 19px; background: rgba(13,16,23,.88); }

/* ── Vault: secure card wall ─────────────────────────────────────────── */
.paw-route-vault .vault-entries-grid { grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 14px; }
.paw-route-vault .vault-card {
  min-height: 155px;
  padding: 17px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  background: linear-gradient(145deg,rgba(111,220,192,.075),transparent 42%),rgba(14,17,25,.9);
}
.paw-route-vault .vault-card:hover { transform: translateY(-4px); border-color: rgba(111,220,192,.3); }
.paw-route-vault .vault-card-favicon { width: 42px; height: 42px; border-radius: 13px; }
.paw-route-vault .vault-gate { max-width: 580px; margin: 40px auto; padding: 28px; border-radius: 24px; }

/* ── Pairing keys: device identity cards ─────────────────────────────── */
.paw-route-pairings .pr-group {
  margin-bottom: 15px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px;
  background: rgba(14,17,25,.86);
}
.paw-route-pairings .pr-group-head { padding: 16px 18px; background: linear-gradient(90deg,rgba(111,220,192,.08),transparent); }
.paw-route-pairings .pr-avatar { width: 48px; height: 48px; border-radius: 15px; }
.paw-route-pairings .pr-alert { border-radius: 15px; }

/* ── Profile: account dashboard instead of stacked settings ─────────── */
.paw-route-profile .profile-settings-grid { gap: 18px; }
.paw-route-profile .settings-section {
  padding: 20px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px !important;
  background: linear-gradient(145deg,rgba(111,220,192,.055),transparent 45%),rgba(14,17,25,.86);
}
.paw-route-profile .avatar-wrap { padding: 6px; border-radius: 50%; background: linear-gradient(135deg,#6fdcc0,#ff62c7); }

/* ── Username Finder: search engine results sheet ────────────────────── */
.paw-route-username-finder .uf-searchbar { max-width: 880px; margin: 0 auto 18px; padding: 8px; border: 1px solid rgba(255,255,255,.09); border-radius: 18px; background: rgba(11,14,21,.82); }
.paw-route-username-finder .uf-input { min-height: 50px; border-radius: 13px; }
.paw-route-username-finder .uf-results { max-width: 1080px; margin-inline: auto; }
.paw-route-username-finder .uf-row { margin-bottom: 9px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.075); border-radius: 16px; background: rgba(15,18,26,.82); }
.paw-route-username-finder .uf-row:hover { transform: translateX(3px); border-color: rgba(255,107,187,.3); }

/* ── VCC Repos: marketplace cards ───────────────────────────────────── */
.paw-route-vcc .vcc-tabs { padding: 5px; border: 1px solid rgba(255,255,255,.075); border-radius: 15px; background: rgba(7,9,14,.5); }
.paw-route-vcc .vcc-tab { border-radius: 11px; }
.paw-route-vcc .vcc-tab.active { background: rgba(255,107,187,.15); color: #ffa6d7; }
.paw-route-vcc .vcc-grid { grid-template-columns: repeat(auto-fill,minmax(290px,1fr)); gap: 15px; }
.paw-route-vcc .vcc-card { padding: 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 21px; background: rgba(14,17,25,.88); }
.paw-route-vcc .vcc-card:hover { transform: translateY(-4px); border-color: rgba(255,107,187,.3); }

/* ── Manga: shelf, series and reading room ───────────────────────────── */
body:is(.paw-route-manga,.paw-route-manga_series,.paw-route-manga_sort) .mg-body { gap: 20px; }
body:is(.paw-route-manga,.paw-route-manga_series,.paw-route-manga_sort) .mg-rail-block { padding: 15px; border-radius: 19px; }
.paw-route-manga .mg-card { border-radius: 21px; overflow: hidden; }
.paw-route-manga .mg-card:hover { transform: translateY(-4px); border-color: rgba(255,110,159,.32); }
.paw-route-manga_series .mg-head { padding: 20px; border-radius: 22px; background: radial-gradient(circle at 100% 0,rgba(255,110,159,.14),transparent 18rem),rgba(14,17,25,.84); }
.paw-route-manga_read { background: #05060a; }
.paw-route-manga_read .mg-reader { max-width: 1500px; margin-inline: auto; }
.paw-route-manga_sort .mg-sort-grid { gap: 10px; }

/* ── Trash: recoverable-content staging area ─────────────────────────── */
.paw-route-trash .trash-grid { grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 14px; }
.paw-route-trash :is(.trash-card,.trash-item) { padding: 17px; border-radius: 19px; background: rgba(15,18,26,.84); }
.paw-route-trash :is(.trash-card,.trash-item):hover { border-color: rgba(255,107,187,.28); }

/* ── Admin: dense controls in a modern operations console ───────────── */
.paw-route-admin .admin-wrap { max-width: 1640px; }
.paw-route-admin :is(.admin-tabs,.admin-subtabs) { padding: 5px; border: 1px solid rgba(255,255,255,.075); border-radius: 15px; background: rgba(7,9,14,.48); }
.paw-route-admin :is(.admin-tab,.admin-subtab) { border-radius: 10px; }
.paw-route-admin :is(.admin-tab,.admin-subtab).active { background: rgba(255,107,187,.14); color: #ffa6d7; }
.paw-route-admin :is(.admin-panel,.adm-section,.admin-item) { border-radius: 19px; }

/* ── Standalone entry and status pages ──────────────────────────────── */
.paw-register-page .register-card,
.paw-share-page .share-card,
.paw-suspended-page .suspended-card {
  border-radius: 24px !important;
  box-shadow: 0 35px 100px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.045);
}

/* Responsive refinements for every bespoke two-pane layout. */
@media (max-width: 980px) {
  .paw-route-attendance .attendance-layout,
  .paw-route-glucose .glucose-layout,
  .paw-route-codegen .cg-layout,
  body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-workspace,.cr-workspace,.em-workspace,.pe-workspace),
  .paw-route-sprite-cutter .sc-main,
  body:is(.paw-route-scene,.paw-route-scene_setup) .scene-layout,
  .paw-route-team_policy .policy-layout { grid-template-columns: 1fr; }
  .paw-route-team_policy .policy-toc { position: static; }
}

@media (max-width: 680px) {
  .paw-route-chat .chat-shell { padding: 10px; gap: 9px; }
  .paw-route-calendar .cal-grid-wrap { padding: 6px; border-radius: 16px; overflow-x: auto; }
  .paw-route-calendar .cal-days,
  .paw-route-calendar .cal-weekdays { min-width: 670px; }
  .paw-route-calendar .cal-day { min-height: 92px; }
  .paw-route-notes .notes-grid,
  .paw-route-countdown .countdown-grid,
  .paw-route-packages .pkg-grid,
  .paw-route-vault .vault-entries-grid,
  .paw-route-vcc .vcc-grid,
  .paw-route-teams .teams-grid { grid-template-columns: 1fr; }
  body:is(.paw-route-bg-remover,.paw-route-color-replace,.paw-route-emission-map,.paw-route-palette-extract) :is(.bgr-canvas-wrap,.cr-canvas-wrap,.em-canvas-wrap,.pe-canvas-wrap),
  .paw-route-seamless-tiler .st-canvas-wrap,
  .paw-route-sprite-cutter .sc-canvas-wrap { min-height: 340px; }
  .paw-route-normal-map .nm-canvas-row { grid-template-columns: 1fr; }
}