*, *::before, *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    :root {
      /* HindPDF brand */
      --brand: #e91d48;
      --brand-hover: #cc173d;
      --brand-soft: #fff2f5;

      /* Text */
      --text-primary: #0b1220;
      --text-secondary: #60708a;

      /* Surfaces */
      --background: #fafbfc;
      --surface: #ffffff;
      --surface-secondary: #f6f8fb;

      /* Borders */
      --border: #dfe6ef;
      --border-strong: #cbd5e1;

      /* Functional */
      --success: #079455;
      --success-soft: #ecfdf3;
      --warning: #dc8a00;
      --warning-soft: #fff8e6;
      --danger: #d92d20;
      --danger-soft: #fff1f0;
      --info: #2563c7;
      --info-soft: #eff6ff;

      /* Existing component aliases */
      --primary: var(--brand);
      --primary-hover: var(--brand-hover);
      --primary-subtle: var(--brand-soft);
      --primary-border: #fecdd3;
      --ring-glow: rgba(233, 29, 72, 0.16);
      
      --text-main: var(--text-primary);
      --text-muted: var(--text-secondary);
      --text-subtle: #94a3b8;
      
      --bg-page: var(--background);
      --bg-surface: var(--surface);
      --bg-alt: var(--surface-secondary);
      --border-hover: var(--border-strong);

      --gold: var(--warning);
      --gold-surface: var(--warning-soft);
      --gold-border: #fef3c7;
      --gold-gradient: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
      
      --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
      --font-mono: 'JetBrains Mono', monospace;

      --radius-sm: 8px;
      --radius-md: 12px;
      --radius-lg: 18px;
      --radius-full: 9999px;

      --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
      --shadow-sm: 0 4px 6px -1px rgba(15, 23, 42, 0.05), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
      --shadow-md: 0 12px 16px -4px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.03);
      --shadow-lg: 0 24px 38px -12px rgba(15, 23, 42, 0.12);
    }

    body.mode-govt {
      --primary: #0f3d64;
      --primary-hover: #0a2942;
      --primary-subtle: #f0f6fa;
      --primary-border: #b8d4e9;
      --ring-glow: rgba(15, 61, 100, 0.18);
      
      --bg-page: #f4f7fa;
      --bg-surface: #ffffff;
      --bg-alt: #ebf1f6;
      --border: #d4e0ea;
      --border-hover: #b5c7d5;
      --text-main: #0c1a26;
      --text-muted: #516272;
    }

    body {
      font-family: var(--font-sans);
      background-color: var(--bg-page);
      color: var(--text-main);
      line-height: 1.5;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
      transition: background-color 0.25s ease, color 0.25s ease;
    }

    a { text-decoration: none; color: inherit; cursor: pointer; }
    button, input, select { font-family: inherit; }
    button { cursor: pointer; border: none; outline: none; background: transparent; }

    body.user-is-pro {
      --primary: #d97706;
      --primary-hover: #b45309;
      --primary-subtle: #fffbeb;
      --primary-border: #fde68a;
      --ring-glow: rgba(217, 119, 6, 0.18);
    }
    body.user-is-pro #navUpgradeBtn { display: none !important; }

    .badge-pro {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      background: var(--primary-subtle);
      color: var(--primary);
      border: 1px solid var(--primary-border);
      font-size: 0.61rem;
      font-weight: 700;
      line-height: 1.15;
      padding: 3px 6px;
      border-radius: 999px;
      letter-spacing: 0.35px;
      text-transform: uppercase;
      white-space: nowrap;
      transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
    }
    .badge-free {
      background: #f0fdf4;
      color: #16a34a;
      border: 1px solid #bbf7d0;
      font-size: 0.68rem;
      font-weight: 700;
      padding: 3px 8px;
      border-radius: var(--radius-sm);
    }
    .tool-breadcrumb { display:flex; grid-column:1 / -1; justify-content:flex-start; align-items:center; gap:6px; margin-bottom:0; color:var(--text-subtle); font-size:.72rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .tool-breadcrumb a { color:var(--text-muted); text-decoration:none; }
    .tool-breadcrumb a:hover, .tool-breadcrumb a:focus-visible { color:var(--primary); text-decoration:underline; }

    .page-view {
      display: none;
      opacity: 0;
      transform: translateY(4px);
      transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .page-view.active {
      display: block;
      opacity: 1;
      transform: translateY(0);
    }

    /* --- TOP HEADER --- */
    .header {
      background: rgba(255, 255, 255, 0.94);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      border-bottom: 1px solid var(--border);
      position: sticky;
      top: 0;
      z-index: 100;
      width: 100%;
    }
    .nav-container {
      max-width: 1240px;
      margin: 0 auto;
      padding: 0.55rem 0.85rem;
      min-height: 60px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem 0.6rem;
    }
    .brand-logo {
      display: flex;
      align-items: center;
      gap: 0.7rem;
      min-width: 0;
      flex-shrink: 0;
      order: 1;
      cursor: pointer;
    }
    .brand-logo-icon { display: block; width: 40px; height: 30px; flex: 0 0 40px; overflow: visible; }
    .brand-name {
      font-size: 1.05rem;
      font-weight: 800;
      letter-spacing: -0.4px;
      color: #0f172a;
      display: flex;
      align-items: center;
      gap: 5px;
      white-space: nowrap;
      line-height: 1;
    }
    .brand-name span { color: var(--primary); }

    /* Top Center Segmented Switcher */
    .nav-center-toggle-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      order: 4;
      flex-basis: 100%;
      width: 100%;
      padding-top: 0.55rem;
      margin-top: 0.15rem;
      border-top: 1px dashed var(--border);
    }
    .nav-segmented-pill {
      display: flex;
      width: 100%;
      max-width: 420px;
      background: #f1f5f9;
      border: 1px solid var(--border);
      padding: 3px;
      border-radius: var(--radius-full);
      box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    }
    .nav-segmented-btn {
      display: inline-flex;
      flex: 1;
      align-items: center;
      justify-content: center;
      gap: 5px;
      padding: 0.4rem 0.6rem;
      font-size: 0.74rem;
      font-weight: 700;
      color: var(--text-muted);
      border-radius: var(--radius-full);
      transition: all 0.2s ease;
      cursor: pointer;
      white-space: nowrap;
    }
    .nav-segmented-btn .label-full { display: none; }
    .nav-segmented-btn .label-short { display: inline; }
    .nav-segmented-btn.active {
      background: #fff;
      color: var(--primary);
      box-shadow: var(--shadow-xs);
      border: 1px solid var(--border);
    }
    body.mode-govt .nav-segmented-btn.active {
      color: #0f3d64;
      border-color: #b8d4e9;
    }

    .nav-links { display: none; align-items: center; gap: 0.4rem; order: 3; }
    .nav-links a {
      font-size: 0.85rem;
      font-weight: 600;
      color: var(--text-muted);
      padding: 0.5rem 0.85rem;
      border-radius: var(--radius-sm);
      transition: all 0.15s ease;
      cursor: pointer;
    }
    .nav-links a:hover {
      color: var(--primary);
      background: var(--primary-subtle);
    }

    .nav-actions { display: flex; align-items: center; gap: 0.4rem; flex-shrink: 0; order: 2; margin-left: auto; }
    #navLoginBtn { display: none; }
    .btn-login {
      padding: 0.5rem 0.85rem;
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--text-main);
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      box-shadow: var(--shadow-xs);
      transition: all 0.15s ease;
      cursor: pointer;
    }
    .btn-login:hover { border-color: var(--border-hover); background: var(--bg-alt); }

    .btn-get-pro {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      padding: 0.42rem 0.75rem;
      font-size: 0.78rem;
      font-weight: 700;
      color: #fff;
      background: var(--primary);
      border-radius: var(--radius-sm);
      box-shadow: 0 2px 8px var(--ring-glow);
      transition: all 0.2s ease;
      white-space: nowrap;
      line-height: 1;
      cursor: pointer;
    }
    .btn-get-pro:hover {
      background: var(--primary-hover);
      transform: translateY(-1px);
    }

    .nav-member-badge {
      display: none;
      align-items: center;
      gap: 4px;
      padding: 0.38rem 0.65rem;
      font-size: 0.72rem;
      font-weight: 700;
      color: var(--gold);
      background: var(--gold-surface);
      border: 1px solid var(--gold-border);
      border-radius: var(--radius-full);
      white-space: nowrap;
    }

    .user-profile-btn {
      display: none;
      align-items: center;
      gap: 6px;
      padding: 0.25rem 0.65rem 0.25rem 0.3rem;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-full);
      font-size: 0.78rem;
      font-weight: 700;
      color: var(--text-main);
      box-shadow: var(--shadow-xs);
      cursor: pointer;
    }
    .user-avatar-sm {
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: var(--primary);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.72rem;
      font-weight: 800;
    }
    #navUsernameDisplay { max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    .btn-mobile-menu {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      color: var(--text-main);
      background: #fff;
      flex-shrink: 0;
      cursor: pointer;
    }

    .mobile-drawer {
      display: none;
      background: #fff;
      border-bottom: 1px solid var(--border);
      padding: 1rem;
      flex-direction: column;
      gap: 0.4rem;
    }
    .mobile-drawer.open { display: flex; }
    .mobile-drawer a {
      font-size: 0.9rem;
      font-weight: 600;
      padding: 0.65rem 0.85rem;
      border-radius: var(--radius-sm);
      color: var(--text-main);
      cursor: pointer;
    }
    .mobile-drawer a:hover { background: var(--primary-subtle); color: var(--primary); }
    #mobileAuthMenu { display: flex; flex-direction: column; gap: 0.4rem; margin-top: 0.4rem; padding-top: 0.55rem; border-top: 1px solid var(--border); }
    #mobileAuthMenu:empty { display: none; }
    #mobileAuthMenu .mobile-signout { margin-top: 0.25rem; color: var(--danger, #d92d20); }
    #mobileAuthMenu .mobile-signout:hover { background: var(--danger-soft, #fff1f0); color: var(--danger, #d92d20); }

    .hero {
      padding: 3rem 1.25rem 2rem;
      text-align: center;
      background: radial-gradient(circle at 50% -20%, var(--primary-subtle) 0%, transparent 60%);
    }
    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 6px 14px;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-full);
      font-size: 0.74rem;
      font-weight: 700;
      color: var(--text-muted);
      margin-bottom: 1.25rem;
      box-shadow: var(--shadow-xs);
    }
    .hero-title {
      font-size: 2.15rem;
      font-weight: 800;
      letter-spacing: -0.8px;
      color: #090d16;
      line-height: 1.2;
      max-width: 800px;
      margin: 0 auto 0.85rem;
    }
    .hero-title span {
      background: linear-gradient(135deg, var(--primary) 0%, #be123c 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    body.mode-govt .hero-title span {
      background: linear-gradient(135deg, #0f3d64 0%, #032038 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .hero-desc {
      font-size: 0.95rem;
      color: var(--text-muted);
      max-width: 600px;
      margin: 0 auto;
      line-height: 1.55;
    }

    .search-box-wrap { max-width: 580px; margin: 1.75rem auto 0; position: relative; }
    .search-box {
      background: #fff;
      border: 1.5px solid var(--border);
      border-radius: var(--radius-md);
      padding: 0.35rem 0.35rem 0.35rem 1rem;
      display: flex;
      align-items: center;
      gap: 0.65rem;
      box-shadow: var(--shadow-sm);
      transition: all 0.2s ease;
    }
    .search-box:focus-within {
      border-color: var(--primary);
      box-shadow: 0 0 0 4px var(--ring-glow);
    }
    .search-box input {
      flex: 1;
      border: none;
      outline: none;
      font-size: 0.88rem;
      color: var(--text-main);
      background: transparent;
    }
    .search-box button {
      background: var(--primary);
      color: #fff;
      padding: 0.6rem 1.15rem;
      font-size: 0.82rem;
      font-weight: 700;
      border-radius: var(--radius-sm);
      transition: background 0.15s ease;
      cursor: pointer;
    }
    .search-box button:hover { background: var(--primary-hover); }

    /* Live Instant Search Dropdown */
    .search-dropdown-menu {
      position: absolute;
      top: calc(100% + 8px);
      left: 0;
      right: 0;
      background: #fff;
      border: 1.5px solid var(--border);
      border-radius: var(--radius-md, 12px);
      box-shadow: 0 14px 30px -4px rgba(15, 23, 42, 0.16), 0 4px 12px -2px rgba(15, 23, 42, 0.08);
      z-index: 150;
      max-height: 380px;
      overflow-y: auto;
      text-align: left;
    }
    .search-result-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 10px 14px;
      border-bottom: 1px solid #f1f5f9;
      cursor: pointer;
      transition: background 0.15s ease;
    }
    .search-result-item:last-child {
      border-bottom: none;
    }
    .search-result-item:hover, .search-result-item:active {
      background: var(--brand-soft, #fff2f5);
    }
    .search-result-icon {
      width: 34px;
      height: 34px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: #fff;
    }
    .search-result-icon svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
    }
    .search-result-info {
      flex: 1;
      min-width: 0;
    }
    .search-result-title {
      font-size: 0.88rem;
      font-weight: 700;
      color: var(--text-primary, #0f172a);
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .search-result-title strong {
      color: var(--brand, #e91d48);
    }
    .search-result-desc {
      font-size: 0.76rem;
      color: var(--text-secondary, #64748b);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-top: 1px;
    }
    .search-result-arrow {
      font-size: 0.88rem;
      color: #94a3b8;
      font-weight: 700;
      transition: transform 0.15s ease;
    }
    .search-result-item:hover .search-result-arrow {
      color: var(--brand, #e91d48);
      transform: translateX(3px);
    }
    .search-no-results {
      padding: 18px 14px;
      font-size: 0.85rem;
      color: var(--text-secondary, #64748b);
      text-align: center;
    }
    .search-no-results a {
      color: var(--brand, #e91d48);
      font-weight: 700;
      text-decoration: none;
    }
    .search-dropdown-footer {
      padding: 8px 14px;
      background: var(--surface-secondary, #f8fafc);
      border-top: 1px solid var(--border);
      text-align: right;
      font-size: 0.78rem;
      border-radius: 0 0 10px 10px;
    }
    .search-dropdown-footer a {
      color: var(--brand, #e91d48);
      font-weight: 700;
      text-decoration: none;
    }

    .lifetime-stats-strip {
      max-width: 760px;
      margin: 1.75rem auto 0;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 0.75rem 0.5rem;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      box-shadow: var(--shadow-xs);
    }
    .stat-badge-col {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      border-right: 1px solid var(--border);
      padding: 0 0.25rem;
    }
    .stat-badge-col:last-child { border-right: none; }
    .stat-metric-val { font-size: 1.1rem; font-weight: 800; color: #0f172a; font-family: var(--font-mono); }
    .stat-metric-label { font-size: 0.65rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.4px; text-align: center; }

    /* Expandable Categories for Govt View */
    .govt-expandable-card {
      background: var(--bg-surface);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      margin-bottom: 0.85rem;
      overflow: hidden;
      box-shadow: var(--shadow-xs);
    }
    .govt-expandable-header {
      padding: 1rem 1.25rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;
      font-weight: 800;
      font-size: 0.95rem;
      color: var(--text-main);
      background: #fff;
    }
    .govt-expandable-header:hover { background: var(--bg-alt); }
    .govt-badge-counter {
      font-size: 0.7rem;
      font-weight: 700;
      background: var(--bg-alt);
      color: var(--text-muted);
      border: 1px solid var(--border);
      padding: 2px 8px;
      border-radius: var(--radius-full);
      margin-left: 8px;
    }
    .govt-expandable-body {
      display: none;
      padding: 1.15rem;
      background: var(--bg-alt);
      border-top: 1px solid var(--border);
    }
    .govt-expandable-card.open .govt-expandable-body {
      display: block;
    }
    .govt-expandable-card.open .govt-arrow {
      transform: rotate(180deg);
      color: var(--primary);
    }
    .govt-arrow {
      transition: transform 0.2s ease;
      font-size: 0.75rem;
      color: var(--text-muted);
    }

    .persona-tabs-wrap { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 2rem 0 0.5rem; }
    .persona-tab-btn {
      padding: 0.45rem 1rem;
      border-radius: var(--radius-full);
      font-size: 0.78rem;
      font-weight: 700;
      background: #fff;
      border: 1px solid var(--border);
      color: var(--text-muted);
      box-shadow: var(--shadow-xs);
      transition: all 0.2s ease;
      cursor: pointer;
    }
    .persona-tab-btn.active {
      background: var(--primary);
      color: #fff;
      border-color: var(--primary);
      box-shadow: 0 4px 12px var(--ring-glow);
    }

    .section-wrap { max-width: 1200px; margin: 2.5rem auto; padding: 0 1.25rem; }
    .section-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1.25rem; }
    .section-title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.4px; color: #090d16; }
    .section-link { font-size: 0.82rem; font-weight: 700; color: var(--primary); cursor: pointer; }

    .tools-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
    .tool-card {
      background: var(--bg-surface);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 1.15rem;
      display: flex;
      align-items: flex-start;
      gap: 0.9rem;
      box-shadow: var(--shadow-xs);
      transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
      cursor: pointer;
      position: relative;
    }
    .tool-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow-md);
      border-color: var(--border-hover);
    }
    .tool-card-icon-wrap {
      width: 42px;
      height: 42px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      flex-shrink: 0;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
    }
    .tool-card-content h3 {
      font-size: 0.94rem;
      font-weight: 800;
      color: #0f172a;
      margin-bottom: 0.2rem;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .tool-card-content p { font-size: 0.8rem; color: var(--text-muted); line-height: 1.45; }

    .all-tools-wrap { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }
    .all-tools-category-block { margin-bottom: 2.75rem; }
    .all-tools-category-title {
      font-size: 1.1rem;
      font-weight: 800;
      color: #0f172a;
      margin-bottom: 1.15rem;
      display: flex;
      align-items: center;
      gap: 10px;
      border-bottom: 1.5px solid var(--border);
      padding-bottom: 0.65rem;
    }
    .category-title-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: 8px;
      background: #f1f5f9;
      color: #334155;
      flex-shrink: 0;
    }
    .all-tools-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }

    .feature-banner-wrap {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 2.5rem 1.25rem;
      text-align: center;
      box-shadow: var(--shadow-sm);
    }
    .feature-grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; width: 100%; margin-top: 1.75rem; }
    .feature-card {
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 1.5rem 1.25rem;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    .feature-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-sm); }
    .feature-card-icon {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 0.85rem;
    }
    .feature-card h4 { font-size: 1rem; font-weight: 800; color: #0f172a; margin-bottom: 0.35rem; }
    .feature-card p { font-size: 0.82rem; color: var(--text-muted); line-height: 1.45; }

    .faq-accordion-wrap { display: flex; flex-direction: column; gap: 0.65rem; text-align: left; margin-top: 1.75rem; }
    .faq-item {
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 1.1rem 1.2rem;
      cursor: pointer;
      transition: all 0.2s ease;
    }
    .faq-item:hover, .faq-item.active { background: #fff; border-color: var(--border-hover); }
    .faq-item.active { border-color: var(--primary); box-shadow: var(--shadow-xs); }
    .faq-question { display: flex; justify-content: space-between; align-items: center; font-size: 0.94rem; font-weight: 700; color: #0f172a; }
    .faq-arrow { font-size: 0.75rem; color: var(--text-muted); transition: transform 0.2s ease; }
    .faq-item.active .faq-arrow { transform: rotate(180deg); color: var(--primary); }
    .faq-answer {
      display: none;
      margin-top: 0.65rem;
      font-size: 0.85rem;
      color: #475569;
      line-height: 1.55;
      border-top: 1px solid var(--border);
      padding-top: 0.65rem;
    }
    .faq-item.active .faq-answer { display: block; }

    .banner {
      background: linear-gradient(145deg, #090d16 0%, #171c2a 100%);
      border-radius: var(--radius-lg);
      padding: 2.25rem 1.5rem;
      color: #fff;
      display: flex;
      flex-direction: column;
      gap: 1.25rem;
      box-shadow: var(--shadow-lg);
    }
    .banner h3 { font-size: 1.4rem; font-weight: 800; }
    .banner p { font-size: 0.85rem; color: #94a3b8; margin-top: 0.25rem; max-width: 600px; }
    .banner-actions { display: flex; flex-direction: column; gap: 0.65rem; }
    .btn-banner-pro {
      background: var(--gold-gradient);
      color: #fff;
      padding: 0.75rem 1.25rem;
      font-size: 0.82rem;
      font-weight: 800;
      border-radius: var(--radius-sm);
      text-align: center;
      box-shadow: 0 4px 14px rgba(217, 119, 6, 0.3);
      cursor: pointer;
    }
    .btn-banner-ghost {
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.18);
      color: #fff;
      padding: 0.75rem 1.25rem;
      font-size: 0.82rem;
      font-weight: 700;
      border-radius: var(--radius-sm);
      text-align: center;
      cursor: pointer;
    }

    .tool-page-wrap { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
    .tool-page-header {
      display:grid;
      grid-template-columns:minmax(0, 1fr) auto;
      gap:1rem 1.5rem;
      align-items:start;
      padding:0 0 1.1rem;
      margin-bottom:1.35rem;
      border-bottom:1px solid var(--border);
    }
    .tool-header-title-row { display:flex; align-items:center; gap:.85rem; }
    .tool-header-icon { display:grid; place-items:center; flex:0 0 auto; width:52px; height:52px; border-radius:14px; background:var(--primary-subtle); border:1px solid var(--primary-border); color:var(--primary); }
    .tool-header-icon svg { width:27px; height:27px; }
    .tool-page-header h1 { font-size:1.65rem; line-height:1.12; font-weight:800; color:var(--text-main); }
    .tool-header-description { margin:.35rem 0 0; max-width:650px; color:var(--text-muted); font-size:.84rem; line-height:1.45; }
    .tool-header-processing { display:flex; flex-direction:column; align-items:flex-end; gap:.28rem; padding:.65rem .85rem; border-radius:999px; background:var(--info-soft); border:1px solid #dbeafe; color:var(--info); font-size:.72rem; font-weight:800; white-space:nowrap; }
    .tool-header-processing small { color:var(--text-muted); font-size:.65rem; font-weight:600; }
    .tool-header-benefits { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:.55rem 1.35rem; color:var(--text-muted); font-size:.72rem; font-weight:700; }
    .tool-header-benefits span::before { content:'✓'; margin-right:.35rem; color:var(--success); }
    @media (max-width:680px) { .tool-page-header { grid-template-columns:1fr; gap:.8rem; } .tool-header-processing { justify-self:start; align-items:flex-start; } .tool-header-benefits { gap:.45rem .9rem; } }
    .tool-load-error { padding:1rem; border:1px solid #fecdd3; border-radius:var(--radius-md); background:#fff7f8; color:var(--text-main); }
    .tool-load-error strong { display:block; color:#9f1239; font-size:.9rem; }
    .tool-load-error p { margin:.4rem 0 .75rem; color:var(--text-muted); font-size:.72rem; line-height:1.4; }
    .tool-load-error-actions { display:flex; flex-wrap:wrap; gap:.5rem; }
    /* Merge PDF workspace */
    .merge-brief { display:none; margin:0 0 1.35rem; padding:0; border:0; background:transparent; }
    .merge-brief-top { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
    .merge-breadcrumb { display:flex; align-items:center; gap:.55rem; margin-bottom:1rem; color:var(--text-muted); font-size:.74rem; font-weight:700; }
    .merge-breadcrumb a { color:var(--text-muted); }
    .merge-breadcrumb span:last-child { color:var(--text-main); }
    .merge-title-row { display:flex; align-items:center; gap:.85rem; }
    .merge-pdf-mark { display:grid; place-items:center; flex:0 0 auto; width:54px; height:54px; border-radius:14px; background:var(--primary-subtle); border:1px solid var(--primary-border); color:var(--primary); font-size:.72rem; font-weight:900; letter-spacing:.02em; }
    .merge-brief h2 { margin:0; font-size:1.65rem; line-height:1.1; color:var(--text-main); }
    .merge-brief p { margin:.35rem 0 0; color:var(--text-muted); font-size:.84rem; max-width:620px; }
    .merge-processing { display:flex; flex-direction:column; align-items:flex-end; gap:.35rem; padding:.7rem .9rem; border-radius:999px; background:#ecfdf5; color:#047857; font-size:.72rem; }
    .merge-processing strong { font-size:.76rem; }
    .merge-processing span { color:var(--text-muted); font-size:.66rem; }
    .merge-benefits { display:flex; flex-wrap:wrap; gap:.9rem 1.5rem; margin-top:1rem; color:var(--text-muted); font-size:.72rem; font-weight:700; }
    .merge-benefits span::first-letter { color:#059669; }
    .merge-toolbar { display:none; align-items:center; justify-content:space-between; gap:1rem; padding:0 0 1rem; margin-bottom:1rem; border-bottom:1px solid var(--border); background:transparent; }
    .merge-toolbar strong { color:var(--text-main); font-size:.95rem; }
    .merge-toolbar p { margin:.22rem 0 0 2.45rem; color:var(--text-muted); font-size:.72rem; }
    .merge-step { display:inline-grid; place-items:center; width:30px; height:30px; margin-right:.55rem; border-radius:50%; background:#1758c7; color:#fff; font-size:.76rem; font-weight:800; vertical-align:middle; }
    .merge-add-btn { flex:0 0 auto; padding:.63rem .9rem; border:1px solid #7aa7ff; border-radius:8px; color:#1758c7; background:#fff; font-size:.76rem; font-weight:800; }
    .merge-add-btn:hover { background:#f4f8ff; }
    .merge-config-card { display:none; margin-bottom:1rem; padding:1rem; border:1px solid var(--border); border-radius:var(--radius-md); background:#fff; }
    .merge-config-card h3 { margin:0 0 .9rem; font-size:.92rem; color:var(--text-main); }
    .merge-config-card label { display:block; margin-bottom:.35rem; font-size:.7rem; color:var(--text-muted); font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
    .merge-config-card input { width:100%; padding:.65rem .7rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:#fff; color:var(--text-main); font-size:.82rem; outline:none; }
    .merge-config-note { display:flex; align-items:flex-start; gap:.5rem; margin-top:.8rem; color:#047857; font-size:.72rem; line-height:1.4; }
    .merge-option { display:flex; align-items:flex-start; gap:.55rem; padding:.55rem 0; border-top:1px solid var(--border); color:var(--text-main); font-size:.72rem; font-weight:700; }
    .merge-option input { width:14px; height:14px; margin:1px 0 0; accent-color:var(--primary); }
    .merge-option small { display:block; color:var(--text-muted); font-size:.64rem; font-weight:500; margin-top:2px; line-height:1.3; }
    .merge-more { width:100%; display:flex; justify-content:space-between; align-items:center; padding:.65rem 0; border-top:1px solid var(--border); color:var(--text-main); font-size:.72rem; font-weight:800; text-align:left; }
    .merge-more-content { display:none; padding:.15rem 0 .65rem; color:var(--text-muted); font-size:.7rem; line-height:1.45; }
    .merge-more-content.open { display:block; }
    .merge-more-content select { width:100%; margin:.35rem 0 .15rem; padding:.6rem .65rem; border:1px solid var(--border); border-radius:8px; color:var(--text-main); background:#fff; font-size:.76rem; }
    .merge-more-content p { margin:.25rem 0 0; font-size:.66rem; }
    .merge-queue-box { margin-top:.75rem; padding:.7rem; border-radius:var(--radius-sm); background:#eef3ff; font-family:var(--font-mono); font-size:.66rem; color:var(--text-muted); }
    .merge-queue-line { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
    .merge-queue-line + .merge-queue-line { margin-top:.35rem; }
    .merge-queue-line strong { color:var(--text-main); font-size:.7rem; }
    .merge-preview-btn { display:none; width:100%; align-items:center; justify-content:center; gap:.4rem; margin-top:.55rem; padding:.68rem; border:1px solid #dbe5fb; border-radius:var(--radius-sm); background:#f5f8ff; color:var(--text-main); font-size:.74rem; font-weight:800; }
    .merge-preset-summary { display:none; margin-top:1rem; padding:.8rem; border:1px solid var(--border); border-radius:var(--radius-md); background:#fff; }
    .merge-preset-summary h3 { margin:0 0 .5rem; font-size:.72rem; color:var(--primary); }
    .merge-preset-summary div { display:flex; justify-content:space-between; gap:.5rem; padding:.18rem 0; font-size:.68rem; color:var(--text-muted); }
    .merge-preset-summary strong { color:var(--text-main); font-family:var(--font-mono); font-size:.66rem; }
    .merge-telemetry { display:none; grid-template-columns:repeat(2,1fr); gap:.5rem; margin-top:1rem; }
    .merge-stat { padding:.65rem; border-radius:var(--radius-sm); background:var(--bg-alt); border:1px solid var(--border); }
    .merge-stat span { display:block; color:var(--text-muted); font-size:.64rem; font-weight:700; }
    .merge-stat strong { display:block; margin-top:.15rem; color:var(--text-main); font-size:.8rem; }
    .merge-action-card h3, .merge-action-card > p { display:none; }
    .merge-mode .merge-brief { display:none; }
    .merge-mode .merge-toolbar, .merge-mode .merge-config-card, .merge-mode .merge-telemetry, .merge-mode .merge-preview-btn, .merge-mode .merge-preset-summary { display:flex; }
    .merge-mode .merge-config-card { flex-direction:column; align-items:stretch; }
    .merge-mode .merge-brief { flex-direction:column; }
    .merge-mode .merge-telemetry { display:grid; }
    .merge-mode .merge-preset-summary { display:block; }
    .merge-mode .merge-action-card { display:block; padding:1rem; border:1px solid var(--border); border-radius:var(--radius-md); background:#fff; }
    .merge-mode .merge-action-card h3 { display:block; margin:0 0 .85rem; color:var(--text-main); font-size:.92rem; }
    .merge-mode .merge-action-card > p { display:block; margin:.7rem 0 0; color:var(--text-muted); font-size:.68rem; line-height:1.35; text-align:center; }
    .merge-mode .tool-page-header { display:grid; }
    .merge-mode .tool-workbench { gap:1rem; }
    .merge-mode .workbench-left, .merge-mode .workbench-right { border-radius:var(--radius-md); }
    .merge-mode .workspace-dropzone { padding:2.25rem 1.25rem; }
    .split-mode-picker { display:grid; grid-template-columns:repeat(2,1fr); gap:.45rem; margin-bottom:.85rem; }
    .split-mode-btn { min-height:38px; padding:.45rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg-alt); color:var(--text-main); font-size:.7rem; font-weight:800; transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease; }
    .split-mode-btn:hover { border-color:var(--primary-border); background:#fff; }
    .split-mode-btn.active { background:var(--primary-subtle); border:2px solid var(--primary); color:var(--primary); }
    .split-mode-btn.active::before { content:'✓'; display:inline-grid; place-items:center; width:14px; height:14px; margin-right:4px; border-radius:50%; background:var(--primary); color:#fff; font-size:9px; vertical-align:middle; }
    .split-setting-box { padding:.75rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg-alt); }
    .split-setting-label { display:block; margin-bottom:.4rem; color:var(--text-main); font-size:.72rem; font-weight:800; }
    .split-setting-help { margin:.35rem 0 0; color:var(--text-muted); font-size:.66rem; line-height:1.4; }
    .split-range-row { display:grid; grid-template-columns:1fr 18px 1fr 28px; gap:.35rem; align-items:center; margin-top:.45rem; }
    .split-range-row input, .split-setting-box input { min-width:0; width:100%; padding:.48rem .55rem; border:1px solid var(--border); border-radius:6px; background:#fff; color:var(--text-main); font-size:.75rem; }
    .split-range-row button { color:#dc2626; font-size:.8rem; }
    .split-extra-toggle { width:100%; margin-top:.65rem; padding:.5rem 0 0; border-top:1px solid var(--border); color:var(--text-muted); font-size:.7rem; font-weight:800; text-align:left; }
    .split-extra-content { display:none; gap:.5rem; padding-top:.6rem; }
    .split-extra-content.open { display:grid; }
    .compress-choice { display:grid; grid-template-columns:20px minmax(0,1fr) auto; align-items:center; gap:.65rem; min-height:72px; padding:.8rem .85rem; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--bg-surface); color:var(--text-main); text-align:left; transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease; }
    .compress-choice:hover { border-color:var(--primary-border); background:#fff; box-shadow:var(--shadow-xs); }
    .compress-choice.active { border:2px solid var(--primary); padding:calc(.8rem - 1px) calc(.85rem - 1px); background:linear-gradient(105deg,var(--primary-subtle),#fff); box-shadow:0 0 0 3px var(--ring-glow); }
    .choice-card-radio { width:18px; height:18px; border:2px solid var(--border-strong); border-radius:50%; box-sizing:border-box; }
    .compress-choice.active .choice-card-radio { border-color:var(--primary); box-shadow:inset 0 0 0 3px #fff; background:var(--primary); }
    .choice-card-copy { min-width:0; display:grid; gap:.2rem; }
    .choice-card-copy strong { font-size:.78rem; line-height:1.2; }
    .choice-card-copy span { color:var(--text-muted); font-size:.67rem; font-weight:500; line-height:1.35; }
    .choice-card-badge { justify-self:end; padding:.34rem .55rem; border-radius:var(--radius-full); background:var(--info-soft); color:var(--info); font-size:.63rem; font-weight:800; white-space:nowrap; }
    .compress-choice.active .choice-card-copy strong,.compress-choice.active .choice-card-badge { color:var(--primary); }
    .compress-choice.active .choice-card-badge { background:var(--brand-soft); }
    @media(max-width:420px){.compress-choice{grid-template-columns:18px minmax(0,1fr);gap:.55rem;min-height:68px}.choice-card-badge{grid-column:2;justify-self:start}}
    .compress-target-box { margin-top:.8rem; padding:.7rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg-alt); color:var(--text-main); font-size:.72rem; }
    .compress-targets { display:grid; grid-template-columns:repeat(2,1fr); gap:.35rem; margin-top:.55rem; }
    .compress-targets button { min-height:34px; padding:.42rem; border:1px solid var(--border); border-radius:6px; background:#fff; color:var(--text-main); font-size:.67rem; font-weight:800; transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease; }
    .compress-targets button:hover { border-color:var(--primary-border); background:var(--primary-subtle); }
    .compress-targets button.active { border:2px solid var(--primary); background:var(--primary-subtle); color:var(--primary); }
    .compress-targets button.active::before { content:'✓ '; }
    .split-mode-btn:focus-visible,.compress-choice:focus-visible,.compress-targets button:focus-visible { outline:3px solid var(--ring-glow); outline-offset:2px; }
    .compress-target-box input, .compress-target-box select { min-width:0; padding:.42rem; border:1px solid var(--border); border-radius:6px; background:#fff; font-size:.68rem; }
    .compress-target-box small { display:block; margin-top:.5rem; color:var(--text-muted); font-size:.62rem; line-height:1.3; }
    .compress-advanced-toggle { width:100%; padding:.65rem 0 .1rem; margin-top:.65rem; border-top:1px solid var(--border); color:var(--text-muted); font-size:.7rem; font-weight:800; text-align:left; }
    .compress-advanced { display:none; gap:.5rem; padding-top:.6rem; color:var(--text-muted); font-size:.68rem; }
    .compress-advanced.open { display:grid; }
    .compress-advanced label { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
    .compress-advanced select { padding:.3rem; border:1px solid var(--border); border-radius:5px; background:#fff; font-size:.65rem; }
    @media (max-width:620px) { .merge-brief-top { flex-direction:column; } .merge-processing { align-items:flex-start; border-radius:10px; } .merge-toolbar { align-items:flex-start; flex-direction:column; } .merge-toolbar p { margin-left:0; } .merge-add-btn { width:100%; } .merge-benefits { gap:.55rem 1rem; } }
    .tool-workbench { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
    .workbench-left, .workbench-right {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 1.5rem 1.25rem;
      box-shadow: var(--shadow-xs);
    }

    .workbench-left { display:flex; flex-direction:column; }
    .workspace-dropzone {
      background: radial-gradient(circle at 50% 50%, var(--primary-subtle) 0%, #fff 80%);
      border: 2px dashed var(--primary-border);
      border-radius: var(--radius-md);
      padding: 3rem 1.25rem;
      text-align: center;
      position: relative;
      cursor: pointer;
      transition: all 0.2s ease;
    }
    .workspace-dropzone:hover, .workspace-dropzone.drag-active {
      border-color: var(--primary);
      box-shadow: 0 0 0 6px var(--ring-glow);
    }
    .tool-workbench.files-selected .workspace-dropzone { display:none; }
    .tool-workbench.files-selected #uploadedFilesWorkspaceSection { order:2; margin-top:1rem !important; }
    .tool-workbench.files-selected .upload-circle-icon,
    .tool-workbench.files-selected .btn-browse,
    .tool-workbench.files-selected #dropZoneContainer p { display:none; }
    .tool-workbench.files-selected #dynDropTitle { font-size:.82rem !important; color:var(--primary) !important; }
    .workspace-dropzone input[type="file"] {
      position: absolute;
      inset: 0;
      opacity: 0;
      width: 100%;
      height: 100%;
      cursor: pointer;
      z-index: 10;
    }
    .upload-circle-icon {
      width: 52px;
      height: 52px;
      background: #fff;
      color: var(--primary);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 0.85rem;
      font-size: 1.4rem;
      font-weight: 800;
      box-shadow: var(--shadow-sm);
    }
    .btn-browse {
      display: inline-block;
      margin: 0.65rem 0;
      padding: 0.5rem 1.15rem;
      font-size: 0.82rem;
      font-weight: 700;
      color: var(--primary);
      border: 1.5px solid var(--primary-border);
      border-radius: var(--radius-sm);
      background: #fff;
      box-shadow: var(--shadow-xs);
      cursor: pointer;
    }

    .pages-visual-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
      gap: 0.75rem;
      margin-top: 1rem;
      padding: 0.85rem;
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      max-height: 480px;
      overflow-y: auto;
    }
    .page-thumb-card {
      background: #fff;
      border: 1.5px solid var(--border);
      border-radius: var(--radius-sm);
      padding: 6px;
      text-align: center;
      box-shadow: var(--shadow-xs);
      position: relative;
      transition: all 0.15s ease;
    }
    .page-thumb-card:hover { border-color: var(--primary); }
    .page-thumb-card.selected-delete { border-color: #ef4444; background: #fef2f2; opacity: 0.45; }
    .page-thumb-canvas-wrap {
      width: 100%;
      height: 135px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #f1f5f9;
      border-radius: 4px;
      overflow: hidden;
    }
    .page-thumb-canvas-wrap canvas { max-width: 100%; max-height: 100%; object-fit: contain; }
    .page-thumb-footer { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
    .page-thumb-meta { display: flex; align-items: center; justify-content: space-between; font-size: 0.68rem; font-weight: 700; color: var(--text-main); }
    .page-thumb-title { font-size: 0.62rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; }
    .page-thumb-controls { display: flex; align-items: center; justify-content: center; gap: 3px; margin-top: 3px; }
    .btn-thumb-nav, .btn-thumb-rotate, .btn-thumb-delete {
      padding: 2px 6px;
      font-size: 0.72rem;
      border-radius: 4px;
      border: 1px solid var(--border);
      background: var(--bg-alt);
      cursor: pointer;
    }
    .btn-thumb-delete { background: #fee2e2; color: #b91c1c; border-color: #fecdd3; }

    .file-rows-container { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.85rem; }
    .workbench-file-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      padding: 0.65rem 0.85rem;
      transition: opacity 180ms ease, transform 180ms ease, border-color 180ms ease;
    }
    .workbench-file-row[draggable="true"] { cursor:grab; }
    .workbench-file-row.dragging { opacity:.45; border-color:var(--primary); }
    .workbench-file-row.drag-over { border-color:var(--primary); box-shadow:0 0 0 3px var(--ring-glow); }
    .file-order-controls { display:flex; align-items:center; gap:4px; }
    .file-drag-handle { color:var(--text-subtle); font-size:1.1rem; line-height:1; cursor:grab; padding:4px; }
    .btn-file-move { width:26px; height:26px; border:1px solid var(--border); border-radius:5px; background:var(--bg-alt); color:var(--text-muted); font-size:.78rem; font-weight:800; }
    .btn-file-move:disabled { opacity:.35; cursor:not-allowed; }
    .row-left { display: flex; align-items: center; gap: 0.75rem; min-width: 0; }
    .red-file-icon {
      width: 30px;
      height: 34px;
      background: var(--primary-subtle);
      border: 1px solid var(--primary-border);
      border-radius: 6px;
      color: var(--primary);
      font-size: 0.62rem;
      font-weight: 800;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .file-detail-name { font-size: 0.82rem; font-weight: 700; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 170px; }
    .file-detail-sub { font-size: 0.7rem; color: var(--text-muted); }
    .merge-mode .workbench-left, .merge-mode .workbench-right { padding:1.2rem; box-shadow:none; }
    .merge-mode .file-rows-container { gap:0; margin-top:0; overflow:hidden; border:1px solid var(--border); border-radius:10px; }
    .merge-mode .workbench-file-row { min-height:76px; padding:.7rem .85rem; border:0; border-radius:0; border-bottom:1px solid var(--border); }
    .merge-mode .workbench-file-row:last-child { border-bottom:0; }
    .merge-mode .workbench-file-row:hover { background:#fbfdff; }
    .merge-mode .file-drag-handle { color:#53657e; letter-spacing:-2px; }
    .merge-mode .red-file-icon { width:42px; height:48px; border-radius:7px; font-size:.58rem; }
    .merge-mode .file-detail-name { max-width:280px; font-size:.84rem; }
    .merge-mode .file-order-controls { gap:.5rem; }
    .merge-mode .btn-file-move { width:30px; height:30px; border:0; border-radius:8px; background:#f6f8fb; color:#314560; }
    .merge-mode .btn-action-clear { padding:.45rem .6rem; border-radius:8px; color:#dc244f; background:#fff6f8; border-color:#ffe0e7; }
    .merge-mode .workspace-dropzone { margin-top:1rem; min-height:190px; padding:2rem 1.25rem; background:#fbfdff; }
    .merge-mode .workspace-dropzone .upload-circle-icon { background:#f4f8ff; box-shadow:none; }
    .merge-mode .merge-queue-box { background:#eef4ff; }

    .sidebar-section-label { font-size: 0.75rem; font-weight: 800; color: #0f172a; margin-bottom: 0.45rem; text-transform: uppercase; letter-spacing: 0.5px; }
    .sidebar-input-box {
      width: 100%;
      padding: 0.65rem 0.75rem;
      font-size: 0.82rem;
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      color: var(--text-main);
      outline: none;
      margin-bottom: 0.85rem;
      transition: border-color 0.15s ease;
      background: #fff;
    }
    .sidebar-input-box:focus { border-color: var(--primary); }

    .btn-workbench-execute {
      width: 100%;
      height: 48px;
      background: var(--primary);
      color: #fff;
      border-radius: var(--radius-md);
      font-size: 0.92rem;
      font-weight: 800;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      margin-top: 1rem;
      box-shadow: 0 4px 14px var(--ring-glow);
      transition: background 0.15s ease;
      cursor: pointer;
    }
    .btn-workbench-execute:hover:not(:disabled) { background: var(--primary-hover); }
    .btn-workbench-execute:disabled { opacity: 0.6; cursor: not-allowed; }
    .btn-progress-fill {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 0%;
      background: rgba(0, 0, 0, 0.15);
      transition: width 0.2s ease;
      z-index: 1;
    }
    .btn-progress-content { position: relative; z-index: 2; display: flex; align-items: center; gap: 8px; }
    .btn-spinner {
      width: 16px;
      height: 16px;
      border: 2px solid rgba(255,255,255,0.3);
      border-top-color: #fff;
      border-radius: 50%;
      animation: spin 0.8s linear infinite;
      display: none;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    .download-page-wrap { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem 4rem; }
    .download-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
    .preview-panel-box, .download-sidebar > div {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 1.25rem;
      box-shadow: var(--shadow-xs);
    }
    .download-section-heading { display:flex; align-items:flex-start; gap:.7rem; margin-bottom:.9rem; }
    .download-section-heading strong { display:block; color:var(--text-main); font-size:.88rem; }
    .download-section-heading p { margin:.18rem 0 0; color:var(--text-muted); font-size:.7rem; line-height:1.35; }
    .download-heading-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 auto; border-radius:9px; background:#eef4ff; color:#2563eb; font-size:1rem; font-weight:900; }
    .download-heading-icon-accent { background:var(--primary-subtle); color:var(--primary); }
    .download-copy-link { width:100%; display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.7rem .8rem; border:1px solid #cbdcf6; border-radius:10px; background:#f8fbff; color:var(--text-main); font-size:.76rem; font-weight:800; }
    .download-copy-link:hover { border-color:#7aa7ff; background:#f2f7ff; }
    .recommended-tools-list { display:grid; gap:.55rem; }
    .recommended-tool-card { display:flex; align-items:center; gap:.65rem; padding:.65rem; border:1px solid var(--border); border-radius:10px; background:#fff; cursor:pointer; transition:border-color 150ms ease,background-color 150ms ease; }
    .recommended-tool-card:hover { border-color:var(--primary-border); background:var(--bg-alt); }
    .recommended-tool-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:8px; color:#fff; flex:0 0 auto; }
    .recommended-tool-card .recommended-tool-copy { min-width:0; flex:1; }
    .recommended-tool-card strong { display:block; color:var(--text-main); font-size:.76rem; }
    .recommended-tool-card span { display:block; margin-top:.12rem; color:var(--text-muted); font-size:.65rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .recommended-tool-arrow { color:var(--primary); font-size:1.15rem; font-weight:800; }
    .preview-canvas-container {
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      min-height: 280px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      overflow: auto;
    }
    #docPreviewCanvas { max-width: 100%; height: auto; border-radius: 4px; box-shadow: var(--shadow-sm); background: #fff; }
    #genericImagePreview, #genericTextPreview { display: none; max-width: 100%; }
    #genericTextPreview { font-family: var(--font-mono); font-size: 0.82rem; color: #334155; white-space: pre-wrap; max-height: 400px; overflow-y: auto; text-align: left; width: 100%; }

    .status-dashboard-card {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0.5rem;
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-md);
      padding: 0.85rem;
      margin-top: 0.65rem;
    }
    .status-item { display: flex; flex-direction: column; gap: 2px; }
    .status-item-header { font-size: 0.68rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; }
    .status-item-val { font-size: 1rem; font-weight: 800; color: #0f172a; font-family: var(--font-mono); }
    .status-item-sub { font-size: 0.65rem; color: #16a34a; font-weight: 700; }

    .btn-dl-main, .btn-dl-pro, .btn-dl-outline {
      width: 100%;
      height: 46px;
      border-radius: var(--radius-sm);
      font-size: 0.88rem;
      font-weight: 800;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      cursor: pointer;
    }
    .btn-dl-main { background: var(--primary); color: #fff; box-shadow: 0 4px 14px var(--ring-glow); }
    .btn-dl-pro { background: var(--gold-gradient); color: #fff; box-shadow: 0 4px 14px rgba(217, 119, 6, 0.28); margin-top: 0.5rem; }
    .btn-dl-outline { background: #fff; color: var(--text-main); border: 1px solid var(--border); margin-top: 0.5rem; }

    .auth-page-wrap { max-width: 960px; margin: 2rem auto 4rem; padding: 0 1rem; }
    .auth-card-split { width: 100%; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; overflow: hidden; }
    .auth-hero-side { display: none; background: linear-gradient(145deg, #090d16 0%, #1e1b4b 100%); color: #fff; padding: 3rem 2.5rem; }
    .auth-form-side { padding: 2.25rem 1.5rem; background: #fff; }
    .auth-form-label { display: block; font-size: 0.8rem; font-weight: 700; color: #1e293b; margin-bottom: 0.35rem; }
    .auth-form-input { width: 100%; height: 44px; padding: 0 0.85rem; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.88rem; outline: none; background: #fff; }
    .btn-auth-submit { width: 100%; height: 46px; background: var(--primary); color: #fff; border-radius: var(--radius-sm); font-size: 0.92rem; font-weight: 800; cursor: pointer; }
    .btn-google-oauth { width: 100%; height: 44px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 0.88rem; font-weight: 700; color: #334155; box-shadow: var(--shadow-xs); cursor: pointer; }

    .profile-page-wrap { max-width: 1140px; margin: 0 auto; padding: 2rem 1rem 4rem; }
    .profile-dashboard-layout { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
    .profile-dashboard-left, .profile-dashboard-right { display: flex; flex-direction: column; gap: 1.5rem; }
    .profile-panel-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1.5rem; box-shadow: var(--shadow-xs); }
    .profile-panel-title { font-size: 1.05rem; font-weight: 800; color: #0f172a; margin-bottom: 1rem; display: flex; align-items: center; justify-content: space-between; }
    .profile-user-avatar-lg { width: 72px; height: 72px; border-radius: 50%; background: var(--primary-subtle); border: 3px solid #fff; box-shadow: var(--shadow-sm); margin: 0 auto 0.85rem; display: flex; align-items: center; justify-content: center; font-size: 1.75rem; font-weight: 800; color: var(--primary); }
    .usage-progress-bar { width: 100%; height: 8px; background: #e2e8f0; border-radius: 6px; overflow: hidden; margin: 0.75rem 0 0.4rem; }
    .usage-progress-fill { height: 100%; background: var(--primary); border-radius: 6px; transition: width 0.3s ease; }
    .history-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
    .history-table th { text-align: left; padding: 0.5rem 0.3rem; color: #64748b; font-weight: 600; border-bottom: 1px solid #f1f5f9; }
    .history-table td { padding: 0.65rem 0.3rem; border-bottom: 1px solid #f8fafc; color: #1e293b; }
    .toggle-row { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 0; border-bottom: 1px solid #f8fafc; font-size: 0.82rem; }
    .toggle-switch { position: relative; display: inline-block; width: 40px; height: 22px; cursor: pointer; }
    .toggle-switch input { opacity: 0; width: 0; height: 0; }
    .slider-toggle { position: absolute; cursor: pointer; inset: 0; background-color: #cbd5e1; transition: .3s; border-radius: 20px; }
    .slider-toggle:before { position: absolute; content: ""; height: 16px; width: 16px; left: 3px; bottom: 3px; background-color: white; transition: .3s; border-radius: 50%; }
    input:checked + .slider-toggle { background-color: var(--primary); }
    input:checked + .slider-toggle:before { transform: translateX(18px); }

    .legal-page-wrap { max-width: 860px; margin: 2.5rem auto 4rem; padding: 0 1rem; }
    .legal-content-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 2.5rem 1.75rem; box-shadow: var(--shadow-xs); }
    .legal-content-card h1 { font-size: 1.75rem; font-weight: 900; color: #0f172a; margin-bottom: 0.4rem; }
    .legal-meta-date { font-size: 0.8rem; font-weight: 600; color: #64748b; margin-bottom: 1.75rem; border-bottom: 1px solid #f1f5f9; padding-bottom: 0.85rem; }
    .legal-body { font-size: 0.88rem; color: #334155; line-height: 1.7; }
    .legal-body h2 { font-size: 1.2rem; font-weight: 800; color: #0f172a; margin-top: 1.5rem; margin-bottom: 0.5rem; }

    /* Pro-Plan Ad Suppression: Automatically hide all ads for Pro users */
    body.user-is-pro .ad-banner-card,
    body.user-is-pro .dl-card-ad,
    body.user-is-pro #homeBannerAd,
    body.user-is-pro #downloadSummaryAd {
      display: none !important;
    }

    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(15, 23, 42, 0.6);
      backdrop-filter: blur(8px);
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 200;
      padding: 1.25rem;
    }
    .modal-content {
      background: #fff;
      border-radius: var(--radius-lg);
      padding: 2.25rem;
      width: 100%;
      max-width: 480px;
      box-shadow: var(--shadow-lg);
      position: relative;
    }
    .sig-canvas {
      width: 100%;
      height: 180px;
      border: 1.5px dashed var(--border-hover);
      border-radius: var(--radius-sm);
      background: var(--bg-alt);
      touch-action: none;
      margin: 1rem 0;
      cursor: crosshair;
    }

    .btn-action-small {
      padding: 0.42rem 0.8rem;
      background: var(--bg-alt);
      border: 1px solid var(--border);
      border-radius: var(--radius-sm);
      font-size: 0.78rem;
      font-weight: 700;
      color: var(--text-main);
      transition: all 0.15s ease;
      cursor: pointer;
    }
    .btn-action-small:hover { background: #fff; border-color: var(--border-hover); }
    .btn-action-clear { color: #b91c1c; border-color: #fecdd3; background: #fff1f2; }

    .app-toast {
      position: fixed;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      background: #0f172a;
      color: #fff;
      padding: 0.75rem 1.35rem;
      border-radius: var(--radius-md);
      font-size: 0.85rem;
      font-weight: 600;
      box-shadow: var(--shadow-lg);
      display: none;
      z-index: 300;
    }

    .footer { background: #090d16; color: #fff; padding: 3.5rem 1.25rem 2.5rem; margin-top: 4rem; font-size: 0.82rem; }
    .footer-container { max-width: 1200px; margin: 0 auto; }
    .footer-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; padding-bottom: 2rem; border-bottom: 1px solid #1e293b; }
    .footer-col h5 { font-size: 0.85rem; font-weight: 800; color: #fff; margin-bottom: 0.85rem; }
    .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.55rem; }
    .footer-col a { color: var(--text-subtle); transition: color 0.15s ease; cursor: pointer; }
    .footer-col a:hover { color: #fff; }
    .footer-bottom { display: flex; flex-direction: column; gap: 0.75rem; align-items: center; text-align: center; padding-top: 2rem; color: #64748b; font-size: 0.75rem; }

    @media (max-width: 420px) {
      .nav-container { padding: 0.5rem 0.65rem; gap: 0.4rem 0.4rem; }
      .brand-name { font-size: 0.98rem; }
      .brand-logo-icon { width: 31px; height: 25px; flex-basis: 31px; }
      .nav-actions { gap: 0.3rem; }
      .btn-get-pro { padding: 0.4rem 0.6rem; font-size: 0.72rem; }
      .btn-mobile-menu { width: 32px; height: 32px; }
      .nav-segmented-btn .label-full { display: none; }
      .nav-segmented-btn .label-short { display: inline; }
    }

    @media (min-width: 920px) {
      .nav-container { padding: 0 1.25rem; height: 70px; flex-wrap: nowrap; }
      .brand-logo-icon { width: 40px; height: 30px; flex-basis: 40px; }
      .brand-name { font-size: 1.25rem; }
      .brand-sub { display: block; }
      .nav-links { display: flex; }
      #navLoginBtn { display: inline-flex; padding: 0.5rem 1rem; font-size: 0.82rem; }
      .btn-get-pro { padding: 0.5rem 1.05rem; font-size: 0.82rem; }
      .btn-mobile-menu { display: none; }

      .nav-center-toggle-wrap {
        order: 2;
        flex-basis: auto;
        width: auto;
        flex: 1 1 auto;
        padding-top: 0;
        margin-top: 0;
        border-top: none;
      }
      .nav-links { order: 3; }
      .nav-actions { order: 4; margin-left: 0; }
      .nav-segmented-pill { width: auto; max-width: none; }
      .nav-segmented-btn { flex: 0 0 auto; padding: 0.35rem 0.75rem; font-size: 0.75rem; }
      .nav-segmented-btn .label-full { display: inline; }
      .nav-segmented-btn .label-short { display: none; }
      .hero { padding: 4rem 1.25rem 2.5rem; }
      .hero-title { font-size: 2.75rem; }
      .hero-desc { font-size: 1.05rem; }
      .tools-grid { grid-template-columns: repeat(4, 1fr); }
      .all-tools-grid { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); }
      .feature-grid { grid-template-columns: repeat(3, 1fr); }
      .banner { flex-direction: row; align-items: center; justify-content: space-between; padding: 2.5rem; }
      .banner-actions { flex-direction: row; }
      .auth-card-split { display: grid; grid-template-columns: 1fr 1.15fr; }
      .auth-hero-side { display: flex; flex-direction: column; justify-content: space-between; }
      .auth-form-side { padding: 3rem 2.5rem; }
      .tool-workbench { grid-template-columns: 1fr 360px; }
      .download-grid { grid-template-columns: 1fr 420px; }
      .profile-dashboard-layout { grid-template-columns: 340px 1fr; }
      .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
      .footer-bottom { flex-direction: row; justify-content: space-between; text-align: left; }
      .app-toast { left: auto; right: 24px; transform: none; }
    }
  
/* === HINDPDF PREMIUM SHIMMER SKELETON === */
@keyframes hpShimmerAnim {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.hp-skeleton {
  background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
  background-size: 200% 100%;
  animation: hpShimmerAnim 1.4s infinite ease-in-out;
  border-radius: 6px;
  display: inline-block;
}
body.dark .hp-skeleton,
.dark-mode .hp-skeleton {
  background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
  background-size: 200% 100%;
}
.tool-card-skeleton {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.15rem;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  pointer-events: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.02);
}
.skeleton-icon-box {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  flex-shrink: 0;
}
.skeleton-lines-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 4px;
}
.skeleton-title-line { height: 16px; width: 60%; border-radius: 4px; }
.skeleton-desc-line { height: 11px; width: 88%; border-radius: 4px; }
.skeleton-desc-subline { height: 11px; width: 68%; border-radius: 4px; }


/* === PRO STATUS PERMANENT CSS LOCK === */
body.user-is-pro #freePlanStatusBox {
  display: none !important;
}
body.user-is-pro #proPlanStatusBox {
  display: block !important;
}


    .hp-sr-only {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      padding: 0 !important;
      margin: -1px !important;
      overflow: hidden !important;
      clip: rect(0, 0, 0, 0) !important;
      white-space: nowrap !important;
      border: 0 !important;
    }

/* ===== Extracted original style block ===== */

#page-download .download-grid {
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, 360px);
  align-items: start;
}
#page-download #previewToolbar {
  display: none !important;
}
#page-download .preview-panel-box {
  min-width: 0;
}
#page-download .preview-canvas-container {
  width: 100%;
  min-height: 68vh;
  max-height: 78vh;
  padding: 12px;
  box-sizing: border-box;
  overflow: auto;
  align-items: flex-start;
  justify-content: center;
}
#page-download #docPreviewCanvas {
  display: block;
  max-width: 100%;
  height: auto;
}
#page-download #genericImagePreview {
  width: auto;
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  margin: auto;
}
#page-download #genericTextPreview {
  width: 100%;
  max-width: 100%;
  max-height: 70vh;
  box-sizing: border-box;
}
@media (max-width: 920px) {
  #page-download .download-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  #page-download .preview-canvas-container {
    min-height: 62vh;
    max-height: 75vh;
    padding: 8px;
  }
  #page-download #genericImagePreview,
  #page-download #genericTextPreview {
    max-height: 65vh;
  }
}

/* ===== Extracted original style block ===== */

#hindpdfCompactActionSheet {
  display:none;
  position:fixed;
  z-index:99999;
  top:auto;
  bottom:0;
  left:50%;
  transform:translate(-50%,100%);
  width:min(440px,calc(100% - 20px));
  height:min(65dvh,680px);
  max-height:65dvh;
  overflow-y:auto;
  overscroll-behavior:contain;
  box-sizing:border-box;
  padding:20px;
  border:1px solid #e2e8f0;
  border-radius:24px;
  background:#fff;
  color:#1e293b;
  box-shadow:0 24px 80px rgba(15,23,42,.24);
  opacity:0;
  transition:opacity .2s ease,transform .2s ease;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
#hindpdfCompactActionSheet.hpdf-open {
  display:block;
  transform:translate(-50%,0);
  opacity:1;
}
#hindpdfCompactActionSheet .hpdf-drag-area {
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:-12px 0 10px;
  touch-action:none;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
#hindpdfCompactActionSheet .hpdf-drag-handle {
  display:block;
  width:42px;
  height:5px;
  border-radius:999px;
  background:#cbd5e1;
}
#hindpdfCompactActionSheet .hpdf-drag-area:active .hpdf-drag-handle {
  background:#94a3b8;
}
#hindpdfCompactActionSheet .hpdf-head {
  display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;
}
#hindpdfCompactActionSheet .hpdf-file-icon {
  flex:0 0 44px;height:44px;display:grid;place-items:center;
  border-radius:14px;background:#fff1f2;color:#e30613;font-size:23px;
}
#hindpdfCompactActionSheet .hpdf-head-copy {flex:1;min-width:0}
#hindpdfCompactActionSheet .hpdf-title {
  font-size:1.08rem;line-height:1.3;font-weight:800;letter-spacing:-.02em;
}
#hindpdfCompactActionSheet .hpdf-subtitle {
  margin-top:3px;font-size:.82rem;color:#64748b;
}
#hindpdfCompactActionSheet .hpdf-close {
  flex:0 0 36px;width:36px;height:36px;display:grid;place-items:center;
  margin:-5px -5px 0 0;border:1px solid #e2e8f0;border-radius:11px;
  background:#fff;color:#475569;font-size:23px;line-height:1;cursor:pointer;
}
#hindpdfCompactActionSheet .hpdf-close:hover {
  background:#f8fafc;color:#0f172a;
}
#hindpdfCompactActionSheet #hpdfCompactReadyNotice {
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:6px;min-height:92px;
  margin-bottom:12px;padding:16px 12px;
  border-radius:14px;background:#f0fdf4;color:#166534;
  text-align:center;
}
#hindpdfCompactActionSheet #hpdfCompactReadyNotice strong {
  font-size:18px;
}
#hindpdfCompactActionSheet #hpdfCompactReadyNotice span:last-child {
  font-size:13px;line-height:1.4;
}
#hindpdfCompactActionSheet .hpdf-file-card {
  display:flex;align-items:center;gap:10px;padding:12px;
  border:1px solid #e2e8f0;border-radius:15px;background:#f8fafc;
  margin-bottom:14px;min-width:0;
}
#hindpdfCompactActionSheet .hpdf-file-name {
  font-size:.86rem;font-weight:750;overflow-wrap:anywhere;line-height:1.4;
}
#hindpdfCompactActionSheet .hpdf-file-meta {
  margin-top:4px;font-size:.75rem;color:#64748b;line-height:1.45;
}
#hindpdfCompactActionSheet .hpdf-section-label {
  margin:17px 0 9px;font-size:.7rem;letter-spacing:.075em;
  font-weight:800;color:#64748b;text-transform:uppercase;
}
#hindpdfCompactActionSheet .hpdf-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:9px;
}
#hindpdfCompactActionSheet button.hpdf-action {
  min-width:0;min-height:45px;padding:11px 12px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid #e2e8f0;border-radius:13px;
  background:#fff;color:#334155;font-size:.84rem;font-weight:750;
  cursor:pointer;transition:background .15s,border-color .15s,transform .15s;
  -webkit-tap-highlight-color:transparent;
}
#hindpdfCompactActionSheet button.hpdf-action:hover {
  background:#fff1f2;border-color:#fecdd3;color:#be123c;
}
#hindpdfCompactActionSheet button.hpdf-action:active {
  transform:scale(.98);
}
#hindpdfCompactActionSheet button.hpdf-primary {
  border-color:#e30613;background:#e30613;color:#fff;
}
#hindpdfCompactActionSheet button.hpdf-primary:hover {
  background:#c91420;border-color:#c91420;color:#fff;
}
#hindpdfCompactActionSheet .hpdf-tool-grid {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
}
#hindpdfCompactActionSheet button.hpdf-tool {
  min-height:70px;padding:10px 4px;flex-direction:column;gap:7px;
  font-size:.72rem;text-align:center;overflow-wrap:anywhere;
}
#hindpdfCompactActionSheet .hpdf-tool-icon {
  color:#e30613;font-size:19px;line-height:1;
}
#hindpdfCompactActionSheet .hpdf-footer {
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:17px;padding-top:13px;border-top:1px solid #e2e8f0;
}
#hindpdfCompactActionSheet .hpdf-safe-note {
  font-size:.72rem;color:#64748b;
}
#hindpdfCompactActionSheet button.hpdf-cancel {
  border:0;background:transparent;color:#64748b;padding:9px 5px;
  font-size:.82rem;font-weight:750;cursor:pointer;
}
#hindpdfCompactActionSheet button:focus-visible {
  outline:3px solid #fda4af;outline-offset:2px;
}
@media(max-width:380px) {
  #hindpdfCompactActionSheet {padding:15px;border-radius:20px}
  #hindpdfCompactActionSheet .hpdf-tool-grid {gap:6px}
  #hindpdfCompactActionSheet button.hpdf-tool {font-size:.68rem}
}
@media(min-width:769px) {
  #hindpdfCompactActionSheet {display:none!important}
}
@media(prefers-reduced-motion:reduce) {
  #hindpdfCompactActionSheet,
  #hindpdfCompactActionSheet button.hpdf-action {transition:none}
}

/* ===== Extracted original style block ===== */

.crop-panel {display:grid;gap:16px;font-size:13px;color:var(--text-main)}
 .crop-panel label {display:grid;gap:6px;font-weight:600}
 .crop-panel input,.crop-panel select {width:100%;min-width:0;padding:10px;border:1px solid var(--border);border-radius:8px;background:white;color:var(--text-main)}
 .crop-fields {display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .crop-note {font-size:12px;line-height:1.5;color:var(--text-muted)}
 #cropEditor {margin-top:18px;padding:12px;background:var(--bg-alt);border-radius:12px}
 #cropEditor[hidden] {display:none}
 .crop-toolbar {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
 #cropStage {position:relative;max-width:100%;margin:auto;overflow:hidden;touch-action:none;cursor:crosshair}
 #cropCanvas {width:100%;height:auto;display:block}
 #cropBox {position:absolute;border:2px solid var(--primary);box-shadow:0 0 0 2000px #0f172a77;cursor:move}
 #cropBox i {position:absolute;width:18px;height:18px;border:2px solid white;background:var(--primary);border-radius:4px;transform:translate(-50%,-50%)}
 #cropStatus {font-size:12px;color:var(--text-muted);margin-top:10px}
 .crop-only .workbench-left,.crop-only .workbench-right {min-width:0}

/* ===== Extracted original style block ===== */

.edit-active .tool-workbench{grid-template-columns:minmax(0,1fr)}
.edit-active .workbench-right{display:none}.edit-active .workbench-left{min-width:0}
#hpEditor{margin-top:18px}#hpEditor[hidden]{display:none}
.ed-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px;background:var(--bg-alt);border:1px solid var(--border);border-radius:12px;margin-bottom:12px}
.ed-bar button,.ed-bar input,.ed-bar select{padding:9px;border:1px solid var(--border);border-radius:7px;background:white;color:var(--text-main);max-width:100%}
.ed-bar button[aria-pressed=true]{background:var(--primary);color:white}.ed-bar label{font-size:12px;display:flex;align-items:center;gap:5px}
.ed-body{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px}.ed-pages{max-height:650px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.ed-pages button{padding:6px;border:1px solid var(--border);border-radius:6px;background:white}.ed-pages button.active{border:2px solid var(--primary)}.ed-pages canvas{width:100%}
.ed-scroll{overflow:auto;max-height:75vh;background:#e8edf3;padding:14px;border-radius:10px}.ed-stage{position:relative;margin:auto;background:white;box-shadow:0 3px 18px #14213d20}.ed-stage canvas{display:block}.ed-stage .ed-overlay{position:absolute;inset:0;touch-action:none}
.ed-help{color:var(--text-muted);font-size:12px;line-height:1.6;margin:8px 0}.ed-primary{background:var(--primary)!important;color:white!important}
@media(max-width:600px){.ed-body{grid-template-columns:1fr}.ed-pages{flex-direction:row;max-height:110px}.ed-pages button{min-width:65px;width:65px}.ed-scroll{padding:4px}.ed-tools{position:sticky;bottom:8px;z-index:20;box-shadow:0 4px 20px #0002}.ed-bar{gap:6px;padding:8px}}

/* ===== Extracted original style block ===== */

.wm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.wm-grid button{min-height:38px;border:1px solid var(--border);background:white;border-radius:7px;font-size:12px}.wm-grid button.active{background:var(--primary);border-color:var(--primary);color:#fff}.wm-row{display:flex;gap:7px;align-items:center}.wm-row>*{min-width:0}.wm-card{padding:10px;border:1px solid var(--border);border-radius:9px;background:var(--bg-alt);display:grid;gap:8px}.wm-card label{font-size:12px;font-weight:700;display:grid;gap:4px}.wm-card input,.wm-card select{padding:8px;border:1px solid var(--border);border-radius:6px;background:white}.wm-preview{position:relative;margin-top:14px;background:#e8edf3;border-radius:10px;padding:12px}.wm-preview canvas{display:block;width:100%;height:auto;background:white}.wm-preview div{position:absolute;pointer-events:none;transform-origin:center;white-space:nowrap;font-weight:800;color:#334155}

/* ===== Extracted original style block ===== */

.protect-card{display:grid;gap:10px;font-size:12px}.protect-card>p{margin:0;color:var(--text-muted);line-height:1.45}.protect-card label{display:grid;gap:5px;font-weight:800}.protect-card label span{display:flex;gap:6px}.protect-card label input{min-width:0}.protect-meter{height:7px;border-radius:9px;background:#e2e8f0;overflow:hidden}.protect-meter i{display:block;height:100%;width:0;background:#ef4444;transition:.2s}.protect-options{display:grid;gap:7px;margin-top:8px}.protect-options label{display:flex;justify-content:space-between;align-items:center}.protect-options select{padding:5px;border:1px solid var(--border);border-radius:5px}.protect-warning{padding:9px;background:#fffbeb;border:1px solid #fde68a;border-radius:7px;color:#92400e!important}
#protectValidation:not(:empty){padding:8px 10px;border:1px solid #fecaca;border-radius:7px;background:#fef2f2;color:#b91c1c!important;font-weight:700;line-height:1.4}

/* ===== Extracted original style block ===== */

.unlock-card{display:grid;gap:8px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:12px}.unlock-card label{font-weight:800;display:grid;gap:5px}.unlock-card label span{display:flex;gap:6px}.unlock-card input{min-width:0}.unlock-state{padding:10px;border-radius:7px;background:#eff6ff;color:#1d4ed8;line-height:1.4}.unlock-private{padding:9px;border-radius:7px;background:#ecfdf5;color:#047857;line-height:1.45}.unlock-error{color:#b91c1c;min-height:0}.unlock-note{color:var(--text-muted);line-height:1.4}.unlock-ready{display:grid;gap:9px}.unlock-ready[hidden]{display:none!important}.unlock-footer{border-top:1px solid var(--border);padding-top:9px}
/* Unlock form controls */
.unlock-card #unlockFields label,
.unlock-card .unlock-ready > label{
  display:grid;
  gap:7px;
  color:var(--text-main);
  font-size:12px;
  font-weight:800;
}

.unlock-card #unlockFields label > span{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:stretch;
  width:min(100%,520px);
}

.unlock-card #unlockPassword,
.unlock-card #unlockName{
  box-sizing:border-box;
  width:100%;
  min-width:0;
  height:42px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#fff;
  color:var(--text-main);
  font:inherit;
  font-size:13px;
  font-weight:500;
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}

.unlock-card #unlockName{
  max-width:520px;
}

.unlock-card #unlockPassword::placeholder{
  color:var(--text-muted);
  opacity:.8;
}

.unlock-card #unlockPassword:focus,
.unlock-card #unlockName:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(229,29,77,.10);
}

.unlock-card #unlockShow{
  min-width:72px;
  height:42px;
  padding:0 14px;
  border-radius:8px;
  align-self:stretch;
}

.unlock-card .unlock-note{
  margin:0;
}

@media(max-width:520px){
  .unlock-card #unlockFields label > span{
    grid-template-columns:minmax(0,1fr) auto;
    width:100%;
  }

  .unlock-card #unlockName{
    max-width:none;
  }

  .unlock-card #unlockShow{
    min-width:64px;
    padding:0 11px;
  }
}

/* ===== Extracted original style block ===== */

.sign-card{display:grid;gap:10px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:12px}.sign-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.sign-tabs button{padding:9px;border:1px solid var(--border);background:#fff;border-radius:7px;font-weight:700}.sign-tabs button.active{color:#fff;background:var(--primary);border-color:var(--primary)}.sign-pad{width:100%;height:120px;border:1px dashed var(--primary-border);border-radius:8px;background:#fff;touch-action:none}.sign-card input{padding:8px;border:1px solid var(--border);border-radius:6px}.sign-info{color:var(--text-muted);line-height:1.4}.sign-footer{padding:8px;border-radius:7px;background:#ecfdf5;color:#047857}.sign-preview{position:relative;margin-top:14px;padding:10px;background:#e8edf3;border-radius:10px}.sign-preview canvas{display:block;width:100%;background:#fff}.sign-object{position:absolute;cursor:move;border:1px dashed var(--primary);min-width:45px;min-height:26px}.sign-object img{width:100%;height:100%;object-fit:contain;pointer-events:none}.sign-object i{position:absolute;right:-7px;bottom:-7px;width:14px;height:14px;background:var(--primary);border:2px solid #fff;border-radius:3px}.sign-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}

/* ===== Extracted original style block ===== */

.scan-panel{display:grid;gap:10px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:12px}.scan-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.scan-actions label,.scan-panel button{padding:10px;border:1px solid var(--border);border-radius:7px;background:var(--bg-alt);text-align:center;font-weight:700;cursor:pointer}.scan-actions input{display:none}.scan-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.scan-page{position:relative;border:2px solid var(--border);border-radius:7px;overflow:hidden;background:#fff}.scan-page.active{border-color:var(--primary)}.scan-page img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}.scan-page span{display:block;padding:4px;font-size:11px;font-weight:700}.scan-page button{position:absolute;top:3px;right:3px;padding:2px 5px;background:#fff;border:1px solid var(--border);border-radius:4px}.scan-editor{position:relative;background:#e8edf3;padding:10px;border-radius:8px}.scan-editor canvas{display:block;width:100%;background:#fff}.scan-controls{display:flex;flex-wrap:wrap;gap:6px}.scan-controls button.active{background:var(--primary);color:#fff}

/* ===== Extracted original style block ===== */

.ocr-card{
  display:grid;
  gap:12px;
  padding:13px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  font-size:12px
}
.ocr-card label{
  display:grid;
  gap:5px;
  font-weight:800
}
.ocr-card select,
.ocr-card input[type="text"]{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:9px;
  border:1px solid var(--border);
  border-radius:7px;
  background:#fff;
  color:var(--text-main)
}
.ocr-analysis{
  padding:9px 10px;
  border-radius:8px;
  background:#eff6ff;
  color:#1d4ed8;
  line-height:1.5
}
.ocr-help{
  margin:0;
  color:var(--text-muted);
  line-height:1.45
}

/* ===== Extracted original style block ===== */

.htmlpdf-panel{display:grid;gap:12px;padding:13px;border:1px solid var(--border);border-radius:12px;background:#fff;font-size:12px}.htmlpdf-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.htmlpdf-tabs button,.htmlpdf-option{border:1px solid var(--border);border-radius:7px;background:var(--bg-alt);padding:9px 7px;color:var(--text-main);font-weight:800;cursor:pointer}.htmlpdf-tabs button.active,.htmlpdf-option.active{background:var(--primary);border-color:var(--primary);color:#fff}.htmlpdf-code{min-height:180px;width:100%;resize:vertical;border:1px solid var(--border);border-radius:8px;padding:10px;background:#0f172a;color:#e2e8f0;font:11px/1.45 var(--font-mono)}.htmlpdf-preview{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:#f8fafc}.htmlpdf-preview-head{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-bottom:1px solid var(--border);font-weight:800}.htmlpdf-preview iframe{display:block;width:100%;height:300px;border:0;background:#fff}.htmlpdf-settings{display:grid;grid-template-columns:1fr 1fr;gap:8px}.htmlpdf-settings label{display:grid;gap:4px;font-weight:800;color:var(--text-main)}.htmlpdf-settings select,.htmlpdf-settings input{width:100%;padding:8px;border:1px solid var(--border);border-radius:6px;background:#fff;color:var(--text-main)}.htmlpdf-url-note{padding:10px;border-radius:7px;background:#fff7ed;color:#9a3412;line-height:1.45}.htmlpdf-file-label{display:block;padding:10px;border:1px dashed var(--border);border-radius:7px;text-align:center;font-weight:800;cursor:pointer}.htmlpdf-file-label input{display:none}@media(max-width:520px){.htmlpdf-tabs{grid-template-columns:1fr}.htmlpdf-settings{grid-template-columns:1fr}.htmlpdf-preview iframe{height:240px}}

/* ===== Extracted original style block ===== */

.repair-card{display:grid;gap:11px;padding:13px;border:1px solid var(--border);border-radius:12px;background:#fff;font-size:12px}.repair-status{padding:11px;border-radius:8px;background:#eff6ff;color:#1d4ed8;line-height:1.55}.repair-steps{display:grid;gap:6px;padding:10px;border:1px solid var(--border);border-radius:8px;color:var(--text-muted)}.repair-step.done{color:#15803d;font-weight:800}.repair-step.work{color:#1d4ed8;font-weight:800}.repair-privacy{padding:10px;border-radius:8px;background:#ecfdf5;color:#047857;line-height:1.45}.repair-card details{color:var(--text-muted);line-height:1.45}.repair-card input{width:100%;padding:9px;border:1px solid var(--border);border-radius:6px;background:#fff;color:var(--text-main)}

/* ===== Extracted original style block ===== */

.textpdf-card{display:grid;gap:10px;padding:12px;border:1px solid var(--border);border-radius:12px;background:#fff;font-size:12px}.textpdf-toolbar{display:grid;grid-template-columns:1fr 70px;gap:7px}.textpdf-toolbar select,.textpdf-toolbar input{width:100%;padding:8px;border:1px solid var(--border);border-radius:6px}.textpdf-actions{display:flex;flex-wrap:wrap;gap:6px}.textpdf-actions button{padding:7px 9px;border:1px solid var(--border);border-radius:6px;background:var(--bg-alt);font-weight:800;cursor:pointer}.textpdf-actions button.active{background:var(--primary);border-color:var(--primary);color:#fff}.textpdf-canvas-wrap{position:relative;border:1px solid var(--border);border-radius:9px;overflow:hidden;background:#e8edf3}.textpdf-canvas-wrap canvas{display:block;width:100%;background:#fff}.textpdf-object{position:absolute;border:1px dashed var(--primary);min-width:48px;min-height:28px;resize:both;overflow:auto;cursor:move;color:#111827;line-height:1.3;padding:3px;background:rgba(255,255,255,.1)}.textpdf-object.selected{border:2px solid var(--primary);background:rgba(255,255,255,.55)}.textpdf-object textarea{display:block;width:100%;min-width:72px;min-height:25px;resize:none;border:0;outline:0;background:transparent;color:inherit;font:inherit;line-height:inherit}.textpdf-pages{display:flex;gap:6px;overflow:auto}.textpdf-pages button{min-width:38px;padding:7px;border:1px solid var(--border);border-radius:6px;background:#fff;font-weight:800}.textpdf-pages button.active{background:var(--primary);border-color:var(--primary);color:#fff}.textpdf-note{color:var(--text-muted);line-height:1.45}

/* ===== Extracted original style block ===== */

.checkout{display:grid;gap:14px;text-align:left}.checkout h3{margin:0;color:#0f172a;font-size:1.25rem}.checkout-plan{display:flex;gap:7px}.checkout-plan button{flex:1;padding:9px;border:1px solid var(--border);border-radius:8px;background:#fff;font-weight:800}.checkout-plan button.active{border-color:var(--primary);background:#fff1f4;color:var(--primary)}.checkout-summary{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid var(--border);border-radius:10px;background:#f8fafc}.checkout-summary small,.checkout-note{color:#64748b;line-height:1.45}.checkout-coupon{display:flex;gap:7px}.checkout-coupon input{min-width:0;flex:1;padding:9px;border:1px solid var(--border);border-radius:7px;text-transform:uppercase}.checkout-coupon button,.checkout-link{border:0;background:transparent;color:var(--primary);font-weight:800;cursor:pointer}.checkout-offer{display:flex;justify-content:space-between;padding:9px;border-radius:7px;background:#ecfdf5;color:#047857;font-size:12px}.checkout-lines{display:grid;gap:8px;padding-top:10px;border-top:1px solid var(--border);font-size:13px}.checkout-line{display:flex;justify-content:space-between}.checkout-total{font-weight:900;font-size:18px;color:#0f172a;padding-top:10px;border-top:1px dashed var(--border)}.checkout-state{padding:11px;border-radius:8px;line-height:1.45;font-size:12px}.checkout-state.pending{background:#fff7ed;color:#9a3412}.checkout-state.error{background:#fef2f2;color:#b91c1c}.checkout-state.success{background:#ecfdf5;color:#047857}.checkout-footer{text-align:center;font-size:11px;color:#94a3b8}
.checkout-modern{display:grid;gap:16px;text-align:left}.checkout-modern-head{text-align:center}.checkout-modern-head h3{margin:6px 0 0}.checkout-modern-head p{margin:5px 0 0;color:var(--text-muted);font-size:12px}.checkout-modern-lock{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--success-soft);color:var(--success);font-weight:900}.checkout-modern-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.checkout-panel{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-surface);padding:13px}.checkout-panel-label{display:block;margin-bottom:9px;color:var(--text-muted);font-size:10px;font-weight:800;letter-spacing:.08em}.checkout-plan-option{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;padding:11px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text-main);text-align:left}.checkout-plan-option+.checkout-plan-option{margin-top:8px}.checkout-plan-option:hover{border-color:var(--border-strong)}.checkout-plan-option.active{border:2px solid var(--primary);padding:10px;background:var(--primary-subtle)}.checkout-radio{width:16px;height:16px;border:2px solid var(--border-strong);border-radius:50%;box-sizing:border-box}.checkout-plan-option.active .checkout-radio{border-color:var(--primary);box-shadow:inset 0 0 0 3px #fff;background:var(--primary)}.checkout-plan-copy{display:grid;gap:2px;font-size:12px}.checkout-plan-copy small{color:var(--text-muted);font-size:10px}.checkout-plan-price{font-size:13px;font-weight:900;white-space:nowrap}.checkout-best{margin-left:5px;padding:3px 5px;border-radius:999px;background:var(--primary);color:#fff;font-size:9px;font-weight:800}.checkout-summary-modern{display:grid;gap:10px}.checkout-summary-row{display:flex;justify-content:space-between;gap:12px;font-size:12px}.checkout-summary-row span{color:var(--text-muted)}.checkout-summary-row.discount{color:var(--success)}.checkout-summary-row.discount span{color:var(--success)}.checkout-summary-total{padding-top:10px;border-top:1px solid var(--border);font-size:16px;font-weight:900}.checkout-pay-btn{width:100%;min-height:46px;border:0;border-radius:10px;background:var(--primary);color:#fff;font-weight:800;cursor:pointer}.checkout-pay-btn:hover{background:var(--primary-hover)}.checkout-security{text-align:center;color:var(--text-muted);font-size:11px;line-height:1.5}.checkout-security strong{color:var(--success)}@media(max-width:620px){.checkout-modern-grid{grid-template-columns:1fr}.checkout-panel{padding:12px}}

/* ===== Extracted original style block ===== */

.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.plan-card{display:grid;gap:8px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff;text-align:left}.plan-card.value{border-color:var(--primary-border);background:var(--primary-subtle)}.plan-card h4{margin:0;font-size:14px;color:#0f172a}.plan-card p{margin:0;color:#64748b;font-size:11px;line-height:1.4}.plan-card ul{margin:0;padding-left:16px;color:#475569;font-size:11px;line-height:1.55}.plan-card .badge-pro{width:max-content}.plan-card button{margin-top:auto}.plan-current{background:#f8fafc!important;color:#64748b!important;border-color:var(--border)!important}@media(max-width:620px){.plan-grid{grid-template-columns:1fr}}

/* ===== Extracted original style block ===== */

.receipt-card{display:grid;gap:12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:#fff;text-align:left}.receipt-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.receipt-lines{display:grid;gap:8px;padding:11px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);font-size:12px}.receipt-line{display:flex;justify-content:space-between;gap:14px}.receipt-line span:first-child{color:var(--text-muted)}.receipt-actions{display:flex;flex-wrap:wrap;gap:8px}.checkout-processing{text-align:center;padding:22px 8px;color:var(--text-muted);line-height:1.55}.checkout-processing i{display:block;width:24px;height:24px;margin:0 auto 12px;border:3px solid var(--primary-border);border-top-color:var(--primary);border-radius:50%;animation:hindSpin .8s linear infinite}@keyframes hindSpin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.checkout-processing i{animation:none}}

/* ===== Extracted original style block ===== */

.plan-card{min-height:286px}.plan-card>button{width:100%;min-height:40px;padding:0 12px;border-radius:var(--radius-sm);font-size:.78rem;font-weight:700;display:flex;align-items:center;justify-content:center}.hind-plan-close{position:absolute;top:12px;right:12px;width:34px;height:34px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--text-muted);font-size:20px;line-height:1;display:grid;place-items:center;cursor:pointer}.hind-plan-close:focus-visible{outline:3px solid var(--ring-glow);outline-offset:2px}@media(max-width:620px){#paywallModal .modal-content{max-height:calc(100vh - 32px);overflow:auto}}

/* ===== Extracted original style block ===== */

.image-prep{display:grid;gap:12px;font-size:12px;color:var(--text-main)}
.image-prep label{display:grid;gap:5px;font-size:12px;font-weight:800}
.image-prep input,.image-prep select{padding:8px;border:1px solid var(--border);border-radius:6px;background:#fff;color:var(--text-main);width:100%;box-sizing:border-box}
.image-prep .image-prep-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.image-prep .image-prep-note{padding:10px 12px;border-radius:8px;background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;font-size:12px;line-height:1.45}
.image-prep .image-prep-warn{padding:10px 12px;border-radius:8px;background:#fffbeb;border:1px solid #fde68a;color:#92400e;font-size:12px;line-height:1.45}
.image-prep .image-prep-preview-wrap{position:relative;background:#f8fafc;border:1px solid var(--border);border-radius:10px;padding:8px;text-align:center;overflow:hidden}
.image-prep img{max-width:100%;max-height:280px;object-fit:contain;background:#f1f5f9;border-radius:6px;display:block;margin:0 auto}
.image-prep.signature img{max-height:140px;aspect-ratio:2/1}
.image-prep-dual-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.image-prep-dual-grid{grid-template-columns:1fr 1fr}}
.image-prep-card{padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--bg-alt);display:grid;gap:8px}
.image-prep-card-head{display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:13px}
.image-prep-card-thumb{width:100%;height:140px;object-fit:contain;background:#fff;border:1px dashed var(--border);border-radius:8px;display:block}
.image-prep-badge{display:inline-block;padding:2px 7px;border-radius:4px;font-size:11px;font-weight:700}
.image-prep-badge.ok{background:#dcfce7;color:#15803d}
.image-prep-badge.waiting{background:#f1f5f9;color:#64748b}

/* ===== Extracted original style block ===== */

/* Responsive plan selector: compact on phones, equal-height cards where space permits. */
  #paywallModal .modal-content:has(.hind-pricing-picker) { max-width: 910px; }
  .hind-pricing-picker { color: var(--text-primary, #0b1220); text-align: left; }
  .hind-pricing-heading { margin: 0 32px 4px 0; font-size: 1.3rem; font-weight: 800; }
  .hind-pricing-subtitle { margin: 0 0 18px; color: var(--text-secondary, #60708a); font-size: .88rem; line-height: 1.5; }
  .hind-pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
  .hind-pricing-card { min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface, #fff); }
  button.hind-pricing-card { width: 100%; color: inherit; text-align: left; cursor: pointer; font: inherit; }
  button.hind-pricing-card:hover { border-color: var(--border-strong); }
  button.hind-pricing-card:focus-visible, .hind-pricing-continue:focus-visible { outline: 3px solid rgba(233,29,72,.22); outline-offset: 2px; }
  .hind-pricing-card.is-selected { border: 2px solid var(--brand, #e91d48); padding: 15px; background: var(--brand-soft, #fff2f5); }
  .hind-pricing-card.is-free { background: var(--surface-secondary, #f6f8fb); }
  .hind-plan-top { display: flex; align-items: start; justify-content: space-between; gap: 8px; }
  .hind-plan-name { font-size: 1rem; font-weight: 800; }
  .hind-plan-badge { flex: 0 0 auto; padding: 4px 8px; border-radius: 999px; background: var(--brand-soft, #fff2f5); color: var(--brand, #e91d48); font-size: .66rem; font-weight: 800; letter-spacing: .03em; }
  .hind-plan-radio { width: 18px; height: 18px; flex: 0 0 18px; border: 2px solid var(--border-strong); border-radius: 50%; margin-top: 1px; }
  .is-selected .hind-plan-radio { border-color: var(--brand, #e91d48); box-shadow: inset 0 0 0 4px var(--surface, #fff), inset 0 0 0 9px var(--brand, #e91d48); }
  .hind-plan-price { display: flex; align-items: baseline; gap: 4px; min-height: 34px; font-size: 1.45rem; font-weight: 800; line-height: 1; }
  .hind-plan-price small, .hind-plan-description, .hind-pricing-note { color: var(--text-secondary, #60708a); font-size: .76rem; font-weight: 500; }
  .hind-plan-description { min-height: 34px; line-height: 1.4; }
  .hind-plan-features { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; color: var(--text-secondary, #60708a); font-size: .76rem; line-height: 1.35; }
  .hind-plan-features li::before { content: '✓'; margin-right: 7px; color: var(--success, #079455); font-weight: 800; }
  .hind-plan-current { margin-top: auto; color: var(--text-secondary, #60708a); font-size: .75rem; font-weight: 700; }
  .hind-pricing-included { margin: 13px 0; border: 1px solid var(--border); border-radius: 10px; padding: 0 12px; }
  .hind-pricing-included summary { padding: 11px 0; cursor: pointer; color: var(--text-primary, #0b1220); font-size: .82rem; font-weight: 750; }
  .hind-pricing-included ul { margin: 0 0 12px; padding-left: 18px; color: var(--text-secondary, #60708a); font-size: .78rem; line-height: 1.65; }
  .hind-pricing-continue { width: 100%; min-height: 46px; border: 0; border-radius: 10px; background: var(--brand, #e91d48); color: #fff; font: inherit; font-size: .88rem; font-weight: 800; cursor: pointer; }
  .hind-pricing-note { margin: 10px 0 0; text-align: center; }
  @media (min-width: 768px) { .hind-pricing-card { min-height: 266px; } }
  @media (min-width: 600px) and (max-width: 900px) { .hind-pricing-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .hind-pricing-card.is-free { grid-column: 1 / -1; min-height: auto; } }
  @media (max-width: 767px) {
    #paywallModal { align-items: flex-end; padding: 0; }
    #paywallModal .modal-content:has(.hind-pricing-picker) { width: 100%; max-height: min(88vh, 700px); padding: 20px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; overflow: auto; }
    .hind-pricing-heading { font-size: 1.12rem; }.hind-pricing-subtitle { margin-bottom: 12px; }
    .hind-pricing-grid { grid-template-columns: 1fr; gap: 8px; }
    .hind-pricing-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 0; padding: 12px; }
    .hind-pricing-card.is-selected { padding: 11px; }
    .hind-plan-top { display: contents; }.hind-plan-name { grid-column: 2; grid-row: 1; font-size: .9rem; }.hind-plan-badge { grid-column: 3; grid-row: 1; }.hind-plan-radio { grid-column: 1; grid-row: 1 / span 2; }
    .hind-plan-price { grid-column: 2 / 4; grid-row: 2; min-height: 0; font-size: 1.05rem; }.hind-plan-description { grid-column: 2 / 4; grid-row: 3; min-height: 0; font-size: .66rem; }.hind-plan-features { display: none; }.hind-plan-current { grid-column: 2 / 4; margin: 0; }
    .hind-pricing-included { margin: 10px 0; }.hind-pricing-continue { position: sticky; bottom: 0; min-height: 48px; box-shadow: 0 -8px 16px rgba(255,255,255,.88); }
  }

/* ===== Extracted original style block ===== */

/* =========================================================
   HindPDF Responsive Foundation V1
   Layout-only stabilization. No processing logic affected.
   ========================================================= */

html {
  overflow-x: hidden;
}

body {
  width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

/* Never allow common workspace descendants to force grid width */
.tool-page-wrap,
.tool-page-header,
.tool-workbench,
.workbench-left,
.workbench-right,
#dynamicSettingsWrap,
#dynamicToolSettingsContainer,
#uploadedFilesWorkspaceSection,
.file-rows-container,
.pages-visual-grid {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

/* Predictable page width */
.tool-page-wrap {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
}

/* Stable workbench columns */
.tool-workbench {
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.workbench-left,
.workbench-right {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

/* Form controls must respect their parent */
.workbench-left input,
.workbench-left select,
.workbench-left textarea,
.workbench-right input,
.workbench-right select,
.workbench-right textarea,
#dynamicToolSettingsContainer input,
#dynamicToolSettingsContainer select,
#dynamicToolSettingsContainer textarea {
  max-width: 100%;
  box-sizing: border-box;
}

/* Long filenames/content must wrap instead of widening workspace */
.file-rows-container,
.file-rows-container *,
#uploadedFilesWorkspaceSection,
#uploadedFilesWorkspaceSection * {
  min-width: 0;
}

.file-rows-container {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Keep upload interaction inside visible dropzone */
.workspace-dropzone {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
}

.workspace-dropzone input[type="file"] {
  width: 100%;
  height: 100%;
  margin: 0;
  max-width: none;
  box-sizing: border-box;
}

/* Header text must be allowed to shrink */
.tool-header-title-row,
.tool-header-title-row > div {
  min-width: 0;
}

.tool-page-header h1,
.tool-header-description {
  overflow-wrap: anywhere;
}

/* Tablet / desktop */
@media (min-width: 920px) {
  .tool-workbench {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  }

  .workbench-right {
    align-self: start;
  }
}

/* Phones + small tablets */
@media (max-width: 919px) {
  .tool-page-wrap {
    padding: 1.15rem .85rem 3rem;
  }

  .tool-workbench {
    gap: 1rem;
  }

  .workbench-left,
  .workbench-right {
    padding: 1rem;
    border-radius: 12px;
  }
}

/* Small phones */
@media (max-width: 480px) {
  .tool-page-wrap {
    padding: .9rem .65rem 2.5rem;
  }

  .tool-page-header {
    margin-bottom: 1rem;
    padding-bottom: .9rem;
  }

  .tool-header-title-row {
    gap: .65rem;
    align-items: flex-start;
  }

  .tool-header-icon {
    width: 42px;
    height: 42px;
    border-radius: 11px;
  }

  .tool-header-icon svg {
    width: 22px;
    height: 22px;
  }

  .tool-page-header h1 {
    font-size: 1.3rem;
  }

  .tool-header-description {
    font-size: .78rem;
  }

  .workbench-left,
  .workbench-right {
    padding: .8rem;
  }

  .workspace-dropzone {
    padding: 2rem .75rem;
  }

  #uploadedFilesWorkspaceSection > div:first-child {
    gap: .65rem;
    align-items: flex-start !important;
    flex-direction: column;
  }

  #uploadedFilesWorkspaceSection > div:first-child > div:last-child {
    width: 100%;
    display: flex !important;
    flex-wrap: wrap;
  }

  #uploadedFilesWorkspaceSection .btn-action-small {
    min-height: 36px;
  }
}

/* Very narrow devices */
@media (max-width: 360px) {
  .tool-page-wrap {
    padding-inline: .5rem;
  }

  .workbench-left,
  .workbench-right {
    padding: .7rem;
  }

  .workspace-dropzone {
    padding: 1.7rem .6rem;
  }

  .tool-header-processing {
    max-width: 100%;
    white-space: normal;
  }
}

/* ===== Extracted original style block ===== */

/* HindPDF Profile — responsive containment */
.profile-page-wrap {
  width: 100%;
  max-width: 1140px;
  min-width: 0;
  box-sizing: border-box;
}

.profile-dashboard-layout {
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
}

.profile-dashboard-left,
.profile-dashboard-right,
.profile-panel-card {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.profile-panel-card {
  overflow-wrap: anywhere;
}

#profileDisplayEmail {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Keep profile action buttons inside narrow screens */
.profile-dashboard-left .profile-panel-card > div[style*="display: flex"] {
  max-width: 100%;
  flex-wrap: wrap;
}

/* Prevent plan table values from forcing card width */
#proPlanStatusBox {
  width: 100%;
  min-width: 0;
}

#proPlanStatusBox table {
  width: 100% !important;
  table-layout: fixed;
}

#proPlanStatusBox td {
  overflow-wrap: anywhere;
  word-break: normal;
}

/* Desktop profile layout */
@media (min-width: 920px) {
  .profile-dashboard-layout {
    grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  }
}

/* Phone */
@media (max-width: 600px) {
  .profile-page-wrap {
    padding: 1rem 12px 3rem;
  }

  .profile-dashboard-layout {
    gap: 1rem;
  }

  .profile-dashboard-left,
  .profile-dashboard-right {
    gap: 1rem;
  }

  .profile-panel-card {
    padding: 1rem;
  }

  .profile-panel-title {
    min-width: 0;
    gap: 8px;
    flex-wrap: wrap;
  }

  #proPlanStatusBox td:first-child {
    width: 42%;
  }

  #proPlanStatusBox td:last-child {
    width: 58%;
  }
}

/* ===== Extracted original style block ===== */

@media (max-width: 600px) {
  .section-wrap {
    margin: 2rem auto;
    padding-inline: 12px;
  }

  .section-header {
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 1rem;
  }

  .section-title {
    min-width: 0;
    font-size: 1.2rem;
    line-height: 1.2;
  }

  .section-link {
    flex: 0 0 auto;
    max-width: 96px;
    font-size: .75rem;
    line-height: 1.3;
    text-align: right;
  }

  .tools-grid {
    gap: .75rem;
  }

  .tool-card {
    min-width: 0;
    padding: .9rem;
    gap: .75rem;
  }

  .tool-card-icon-wrap {
    width: 40px;
    height: 40px;
  }

  .tool-card-content {
    min-width: 0;
    flex: 1;
  }

  .tool-card-content h3 {
    min-width: 0;
    flex-wrap: wrap;
    font-size: .9rem;
    line-height: 1.3;
  }

  .tool-card-content p {
    font-size: .8rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }

  .stat-metric-label {
    font-size: .68rem;
    line-height: 1.25;
  }
}

@media (max-width: 360px) {
  .section-header {
    gap: 8px;
  }

  .section-title {
    font-size: 1.12rem;
  }

  .section-link {
    max-width: 82px;
    font-size: .72rem;
  }

  .tool-card {
    padding: .8rem;
  }
}

/* ===== Extracted original style block ===== */

.nav-profile-pro-badge {
  display: none;
  align-items: center;
  justify-content: center;
  margin-left: 2px;
  padding: 2px 6px;
  border: 1px solid #f3d37a;
  border-radius: 999px;
  background: #fff8df;
  color: #b66a00;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .04em;
  white-space: nowrap;
}

body.user-is-pro #navProfileBtn .nav-profile-pro-badge {
  display: inline-flex;
}

@media (max-width: 420px) {
  .nav-profile-pro-badge {
    padding: 2px 5px;
    font-size: 8px;
  }
}

/* ===== Extracted original style block ===== */

.download-page-wrap,
.download-grid,
.preview-panel-box,
.download-sidebar {
  min-width: 0;
  box-sizing: border-box;
}

.preview-panel-header {
  min-width: 0;
  gap: 12px;
}

#dynPreviewHeading {
  min-width: 0;
  margin: 0;
}

#previewToolbar {
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.preview-canvas-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior-inline: contain;
}

#docPreviewCanvas {
  flex: 0 0 auto;
  max-width: none;
}

@media (max-width: 600px) {
  .download-page-wrap {
    width: 100%;
    padding: 1rem 12px 3rem;
    overflow-x: hidden;
  }

  .preview-panel-box,
  .download-sidebar > div {
    padding: 1rem;
  }

  .preview-panel-header {
    align-items: flex-start !important;
    flex-direction: column;
  }

  #previewToolbar {
    width: 100%;
    justify-content: flex-start;
    gap: 6px !important;
  }

  #previewToolbar .btn-action-small {
    min-height: 38px;
    padding-inline: 12px;
  }

  .preview-canvas-container {
    min-height: 220px;
    padding: 10px;
    justify-content: flex-start;
  }

  #previewPagination {
    width: 100%;
    min-width: 0;
    gap: 8px;
  }

  #previewPagination .btn-action-small {
    flex: 0 1 auto;
    min-width: 0;
    padding-inline: 10px;
    white-space: nowrap;
  }

  #previewPageIndicator {
    min-width: 0;
    text-align: center;
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  #previewToolbar .btn-action-small {
    padding-inline: 10px;
    font-size: .72rem;
  }

  #previewPagination {
    font-size: .7rem !important;
  }

  #previewPagination .btn-action-small {
    padding-inline: 7px;
    font-size: .68rem;
  }
}

/* ===== Extracted original style block ===== */

/* HindPDF — authoritative mobile download/result layout */

.download-grid,
.preview-panel-box,
.download-sidebar,
.download-sidebar > div,
.status-dashboard-card,
.status-item,
.dl-card-actions,
.dl-card-meta,
.dl-card-share,
.dl-card-related,
.recommended-tools-list,
.recommended-tool-card,
.recommended-tool-copy {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.preview-canvas-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: auto;
}

#docPreviewCanvas {
  display: block;
  max-width: 100%;
  height: auto;
  flex: 0 0 auto;
}

.dl-card-meta table {
  width: 100% !important;
  table-layout: fixed;
}

.dl-card-meta td {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dl-card-meta td:first-child {
  width: 34%;
}

.dl-card-meta td:last-child {
  width: 66%;
}

.recommended-tool-copy strong,
.recommended-tool-copy span {
  max-width: 100%;
}

@media (max-width: 600px) {
  .download-page-wrap {
    width: 100%;
    max-width: 100%;
    padding: 1rem 12px 3rem;
    box-sizing: border-box;
    overflow-x: clip;
  }

  .download-grid {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  .preview-panel-box,
  .download-sidebar > div {
    width: 100%;
    padding: 1rem;
  }

  /* Preview header */
  .preview-panel-box > div:first-child,
  .preview-panel-header {
    min-width: 0;
    align-items: flex-start !important;
    flex-direction: column;
    gap: .75rem;
  }

  #dynPreviewHeading {
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    font-size: 1.05rem !important;
  }

  #previewToolbar {
    width: 100%;
    min-width: 0;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 6px !important;
  }

  #previewToolbar .btn-action-small {
    flex: 0 1 auto;
    min-width: 0;
    min-height: 38px;
    padding: 8px 11px;
  }

  /* PDF is fitted initially; zoomed content scrolls only here */
  .preview-canvas-container {
    min-height: 200px;
    padding: 8px;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  #docPreviewCanvas {
    max-width: 100%;
  }

  #previewPagination {
    width: 100%;
    min-width: 0;
    display: grid !important;
    grid-template-columns: minmax(0, auto) minmax(70px, 1fr) minmax(0, auto);
    align-items: center;
    gap: 6px;
  }

  #previewPagination .btn-action-small {
    min-width: 0;
    padding: 8px 9px;
    white-space: nowrap;
  }

  #previewPageIndicator {
    min-width: 0;
    text-align: center;
    white-space: nowrap;
  }

  /* Processing details */
  .status-dashboard-card {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    padding: .75rem;
  }

  .status-item {
    overflow: hidden;
  }

  .status-item-header {
    font-size: .58rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  .status-item-val {
    font-size: .86rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .status-item-sub {
    font-size: .58rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  /* Result actions */
  .sidebar-input-box,
  .btn-dl-main,
  .btn-dl-pro,
  .btn-dl-outline {
    max-width: 100%;
    box-sizing: border-box;
  }

  .btn-dl-main,
  .btn-dl-pro,
  .btn-dl-outline {
    height: auto;
    min-height: 46px;
    padding: 10px 12px;
    text-align: center;
  }

  .btn-dl-main span,
  .btn-dl-pro span,
  .btn-dl-outline span {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  /* File Summary */
  .dl-card-meta td {
    vertical-align: top;
  }

  .dl-card-meta td:last-child {
    padding-left: 10px !important;
  }

  /* Share */
  .download-section-heading {
    min-width: 0;
  }

  .download-section-heading > div {
    min-width: 0;
  }

  .download-copy-link {
    min-width: 0;
    max-width: 100%;
  }

  /* Recommended Next Steps */
  .recommended-tools-list {
    width: 100%;
  }

  .recommended-tool-card {
    width: 100%;
    padding: .7rem;
    gap: .65rem;
    overflow: hidden;
  }

  .recommended-tool-copy {
    overflow: hidden;
  }

  .recommended-tool-card strong {
    font-size: .78rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .recommended-tool-card span {
    display: block;
    min-width: 0;
    max-width: 100%;
    margin-top: .18rem;
    font-size: .67rem;
    line-height: 1.4;
    white-space: normal;
    overflow: hidden;
    text-overflow: clip;
    overflow-wrap: anywhere;
  }

  .recommended-tool-arrow {
    flex: 0 0 auto;
  }
}

@media (max-width: 360px) {
  .download-page-wrap {
    padding-inline: 8px;
  }

  .preview-panel-box,
  .download-sidebar > div {
    padding: .8rem;
  }

  .status-dashboard-card {
    padding: .65rem;
    gap: 4px;
  }

  .status-item-header,
  .status-item-sub {
    font-size: .54rem;
  }

  .status-item-val {
    font-size: .78rem;
  }

  #previewPagination {
    font-size: .68rem !important;
  }

  #previewPagination .btn-action-small {
    padding-inline: 6px;
    font-size: .66rem;
  }
}

/* ===== Extracted original style block ===== */

/* Shared tool-page header: readable, compact and consistently aligned */
.tool-page-header h1 {
  font-size: 1.75rem;
  line-height: 1.15;
  letter-spacing: -.02em;
}

.tool-header-description {
  margin-top: .4rem;
  font-size: .92rem;
  line-height: 1.5;
}

.tool-header-processing {
  font-size: .8rem;
}

.tool-header-processing small {
  font-size: .72rem;
  line-height: 1.35;
}

/* Subscription status belongs in account/profile, not tool headers */
#dynProPerkBadge {
  display: none !important;
}

.tool-header-benefits {
  font-size: .78rem;
  line-height: 1.4;
}

@media (max-width: 680px) {
  .tool-page-header {
    gap: .7rem;
  }

  .tool-header-processing {
    align-items: flex-start;
    padding: .55rem .75rem;
  }
}

@media (max-width: 480px) {
  .tool-page-header {
    margin-bottom: 1rem;
    padding-bottom: .9rem;
  }

  .tool-header-title-row {
    gap: .7rem;
  }

  .tool-page-header h1 {
    font-size: 1.75rem;
    line-height: 1.12;
  }

  .tool-header-description {
    margin-top: .35rem;
    font-size: .92rem;
    line-height: 1.45;
  }

  .tool-header-processing {
    font-size: .82rem;
  }

  .tool-header-processing small {
    font-size: .74rem;
  }

  .tool-header-benefits {
    gap: .45rem .8rem;
    font-size: .78rem;
    line-height: 1.4;
  }
}

@media (max-width: 360px) {
  .tool-page-header h1 {
    font-size: 1.6rem;
  }

  .tool-header-description {
    font-size: .88rem;
  }

  .tool-header-processing {
    max-width: 100%;
    white-space: normal;
  }
}

/* ===== Extracted original style block ===== */

.tool-header-processing {
  width: fit-content;
  max-width: 100%;
  padding: .48rem .72rem;
  gap: .18rem;
  border-radius: 16px;
  font-size: .72rem;
  line-height: 1.25;
}

.tool-header-processing small {
  font-size: .65rem;
  line-height: 1.3;
}

@media (max-width:480px) {
  .tool-header-processing {
    padding: .46rem .68rem;
    font-size: .74rem;
    border-radius: 15px;
  }

  .tool-header-processing small {
    font-size: .66rem;
  }
}

/* ===== Extracted original style block ===== */

@media (max-width:480px) {
  .tool-page-header h1 {
    font-size: 1.15rem;
    line-height: 1.12;
  }

  .tool-header-description {
    margin-top: .22rem;
    font-size: .68rem;
    line-height: 1.35;
  }
}

@media (max-width:360px) {
  .tool-page-header h1 {
    font-size: 1.25rem;
  }

  .tool-header-description {
    font-size: .72rem;
  }
}

/* ===== Extracted original style block ===== */

.hind-cookie-banner {
  position:fixed;
  left:16px;
  right:16px;
  bottom:16px;
  z-index:10000;
  max-width:720px;
  margin:auto;
  padding:16px;
  background:var(--card-bg, #fff);
  color:var(--text-main, #111827);
  border:1px solid var(--border, #e5e7eb);
  border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.14);
  display:none;
}
.hind-cookie-banner.is-visible { display:block; }

.hind-cookie-title {
  margin:0 0 5px;
  font-size:.9rem;
  font-weight:800;
}
.hind-cookie-text {
  margin:0;
  font-size:.75rem;
  line-height:1.5;
  color:var(--text-muted, #6b7280);
}
.hind-cookie-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.hind-cookie-btn {
  min-height:38px;
  padding:8px 13px;
  border-radius:8px;
  border:1px solid var(--border, #e5e7eb);
  background:transparent;
  color:inherit;
  font:inherit;
  font-size:.72rem;
  font-weight:700;
  cursor:pointer;
}
.hind-cookie-btn.primary {
  background:var(--primary, #dc2626);
  border-color:var(--primary, #dc2626);
  color:#fff;
}
.hind-cookie-preferences {
  display:none;
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid var(--border, #e5e7eb);
}
.hind-cookie-preferences.is-open { display:block; }

.hind-cookie-option {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:8px 0;
  font-size:.75rem;
}
.hind-cookie-option small {
  display:block;
  margin-top:2px;
  color:var(--text-muted, #6b7280);
  font-size:.65rem;
}
.hind-cookie-option input {
  width:17px;
  height:17px;
  accent-color:var(--primary, #dc2626);
}
@media(max-width:480px) {
  .hind-cookie-banner {
    left:10px;
    right:10px;
    bottom:10px;
    padding:14px;
  }
  .hind-cookie-actions {
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .hind-cookie-btn.primary {
    grid-column:1 / -1;
  }
}

/* ===== Extracted original style block ===== */

.htmlpdf-output-name {
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:42px;
  margin-top:5px;
  padding:0 11px;
  box-sizing:border-box;
  border:1px solid var(--border);
  border-radius:7px;
  background:#fff;
  color:var(--text-main);
  font:inherit;
  font-size:13px;
  font-weight:500;
  outline:none;
}

.htmlpdf-output-name:focus {
  border-color:var(--primary);
  box-shadow:0 0 0 3px var(--primary-subtle);
}

@media(max-width:480px) {
  .htmlpdf-output-name {
    height:40px;
    padding:0 10px;
    font-size:12px;
  }
}

/* ===== Extracted original style block ===== */

.htmlpdf-url-input {
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:42px;
  padding:0 11px;
  box-sizing:border-box;
  border:1px solid var(--border);
  border-radius:7px;
  background:#fff;
  color:var(--text-main);
  font:inherit;
  font-size:13px;
  font-weight:500;
  outline:none;
}

.htmlpdf-url-input::placeholder {
  color:var(--text-muted);
  opacity:.75;
}

.htmlpdf-url-input:focus {
  border-color:var(--primary);
  box-shadow:0 0 0 3px var(--primary-subtle);
}

@media(max-width:480px) {
  .htmlpdf-url-input {
    height:40px;
    padding:0 10px;
    font-size:12px;
  }
}

/* ===== Extracted original style block ===== */

.nav-mode-icon {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ===== Extracted original style block ===== */

/* HindPDF responsive toast */
.app-toast {
  width: max-content;
  max-width: min(420px, calc(100vw - 32px));
  box-sizing: border-box;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.4;
}

@media (max-width: 919px) {
  .app-toast {
    left: 50% !important;
    right: auto !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
    transform: translateX(-50%) !important;

    width: auto;
    min-width: 0;
    max-width: calc(100vw - 24px);

    padding: 9px 13px;
    border-radius: 10px;

    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.35;

    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

@media (max-width: 380px) {
  .app-toast {
    max-width: calc(100vw - 20px);
    padding: 8px 11px;
    font-size: 0.75rem;
  }
}

/* ===== Extracted original style block ===== */

.scan-output-settings{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:2px;
}

.scan-field{
  display:grid;
  gap:6px;
  min-width:0;
  padding:11px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
}

.scan-field-wide{
  grid-column:1/-1;
}

.scan-field > span{
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  color:var(--text-main);
}

.scan-field select,
.scan-field input{
  display:block;
  width:100%;
  min-width:0;
  height:42px;
  box-sizing:border-box;
  padding:0 11px;
  border:1px solid var(--border);
  border-radius:8px;
  outline:none;
  background:var(--bg-alt,#f8fafc);
  color:var(--text-main);
  font:inherit;
}

.scan-field select:focus,
.scan-field input:focus{
  border-color:var(--primary);
  background:#fff;
}

@media(max-width:480px){
  .scan-output-settings{
    grid-template-columns:1fr;
  }

  .scan-field-wide{
    grid-column:auto;
  }

  .scan-field{
    padding:10px;
  }
}

/* Checkout needs room for plan names, prices, and the value badge. */
#paywallModal .modal-content:has(.checkout-modern) {
  max-width: 820px;
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
}
.checkout-modern-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.checkout-panel { min-width: 0; padding: 18px; }
.checkout-plan-option {
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 10px;
  row-gap: 8px;
  padding: 14px;
}
.checkout-plan-option.active { padding: 13px; }
.checkout-radio { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
.checkout-plan-copy { min-width: 0; gap: 5px; line-height: 1.45; }
.checkout-plan-copy strong { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.checkout-best { display: inline-block; margin-left: 0; white-space: nowrap; line-height: 1.3; }
.checkout-plan-price { grid-column: 2; line-height: 1.4; }
.checkout-summary-modern { gap: 18px; }
.checkout-modern .coupon-section { margin-top: 16px; }
.checkout-modern .coupon-section label { display: block; margin-bottom: 8px; font-size: 13px; }
.checkout-modern .checkout-note { display: block; margin-top: 8px; font-size: 11px; }
.checkout-pay-btn { padding: 12px; line-height: 1.4; }
@media (max-width: 700px) {
  .checkout-modern-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #paywallModal .modal-content:has(.checkout-modern) { padding: 24px 18px; }
  .checkout-panel { padding: 14px; }
}

/* Profile account deletion */
.profile-delete-card { border:1px solid #fecaca; border-radius:14px; background:#fff; padding:22px; }
.profile-delete-card h3,.account-delete-dialog h3 { color:#b91c1c; font-size:1.1rem; margin:0 0 10px; }
.profile-delete-card p,.account-delete-dialog p { font-size:13px; color:#64748b; line-height:1.6; margin:0 0 16px; }
.account-delete-button { border:1px solid #b91c1c; border-radius:8px; background:#b91c1c; color:#fff; padding:10px 16px; font-weight:700; cursor:pointer; }
.account-delete-button:hover { background:#991b1b; }
.account-delete-button:disabled { opacity:.5; cursor:not-allowed; }
.account-delete-button:focus-visible { outline:3px solid #fda4af; outline-offset:3px; }
.account-delete-dialog { text-align:left; max-height:calc(100dvh - 40px); overflow-y:auto; }
.account-delete-dialog label { display:block; font-size:13px; font-weight:700; margin-bottom:8px; }
.account-delete-dialog .account-delete-step { color:#b91c1c; font-weight:700; font-size:12px; }
.account-delete-dialog .account-delete-error { color:#b91c1c; margin:12px 0; }
.account-delete-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
#deleteAccountModal [hidden] { display:none !important; }
@media(max-width:480px) { .account-delete-dialog { padding:24px 18px; } }

/* Keep every tool header focused on its title and description. */
#sharedToolHeader { grid-template-columns: minmax(0, 1fr); }
#sharedToolHeader .tool-header-title-row { min-width:0; }
#sharedToolHeader .tool-header-title-row > div { min-width:0; }
#sharedToolHeader h1, #sharedToolHeader .tool-header-description { overflow-wrap:break-word; }

/* Separate result cards instead of touching their borders. */
.download-sidebar { display:flex; flex-direction:column; gap:16px; }
.download-sidebar > .dl-card-meta, .download-sidebar > #downloadSummaryAd { margin:0; }

/* Authentication follows the light HindPDF workspace styling. */
#page-auth .auth-page-wrap { max-width:1000px; margin:clamp(20px,4vw,48px) auto 64px; padding:0 20px; }
#page-auth .auth-card-split { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); border-radius:20px; box-shadow:0 8px 32px rgba(15,23,42,.05); }
#page-auth .auth-hero-side { display:flex; flex-direction:column; justify-content:space-between; gap:40px; background:linear-gradient(145deg,#fff8fa,#fff1f4); color:var(--text-main); padding:40px 32px; border-right:1px solid var(--primary-border); min-width:0; }
.auth-brand { display:inline-flex; align-items:center; gap:10px; color:var(--text-main); text-decoration:none; font-size:24px; font-weight:800; align-self:flex-start; }
.auth-brand img { object-fit:contain; }
.auth-brand > span > span { color:var(--primary); }
.auth-eyebrow { color:var(--primary); font-size:11px; font-weight:800; letter-spacing:.12em; }
.auth-hero-copy h2 { font-size:clamp(26px,3vw,36px); line-height:1.2; letter-spacing:-.04em; margin:14px 0; color:var(--text-main); }
.auth-hero-copy p { color:var(--text-muted); font-size:14px; line-height:1.7; margin:0; }
.auth-tool-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.auth-tool-tags span { padding:7px 10px; background:#fff; border:1px solid var(--primary-border); border-radius:8px; font-size:11px; color:var(--text-muted); font-weight:600; }
.auth-explore { display:flex; align-items:center; gap:12px; align-self:flex-start; color:var(--primary); text-decoration:none; font-size:13px; font-weight:700; }
#page-auth .auth-form-side { padding:40px 36px; min-width:0; }
#page-auth .auth-form-input { min-height:46px; border-radius:10px; color:var(--text-main); font:inherit; font-size:14px; }
#page-auth .auth-form-input:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-subtle); }
#page-auth .btn-auth-submit { border:0; border-radius:10px; min-height:46px; }
#page-auth .btn-google-oauth { min-height:44px; border-radius:10px; font-size:14px; }
.auth-password-wrap { position:relative; }
#page-auth .auth-password-wrap input { padding-right:64px; }
.auth-password-toggle { position:absolute; right:8px; top:50%; transform:translateY(-50%); padding:10px 7px; border:0; background:transparent; color:var(--text-muted); font-size:12px; font-weight:700; cursor:pointer; }
.auth-password-toggle:focus-visible { outline:2px solid var(--primary); border-radius:6px; }
.auth-divider { display:flex; align-items:center; gap:12px; margin:24px 0; color:var(--text-muted); font-size:12px; }
.auth-divider::before,.auth-divider::after { content:''; flex:1; height:1px; background:var(--border); }
@media(max-width:760px) {
 #page-auth .auth-card-split { grid-template-columns:minmax(0,1fr); }
 #page-auth .auth-hero-side { padding:24px; gap:20px; border-right:0; border-bottom:1px solid var(--primary-border); }
 .auth-hero-copy h2 { font-size:26px; margin:10px 0; }
 .auth-hero-copy h2 br { display:none; }
 .auth-tool-tags,.auth-explore { display:none; }
 #page-auth .auth-form-side { padding:28px 24px; }
}
@media(max-width:400px) {
 #page-auth .auth-page-wrap { padding:0 12px; }
 #page-auth .auth-hero-side,#page-auth .auth-form-side { padding:24px 18px; }
}
/* Subtle translucent backdrop for the account page. */
#page-auth {
  background: linear-gradient(135deg, rgba(255,241,244,.38), rgba(248,250,252,.18));
}
#page-auth .auth-card-split {
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
#page-auth .auth-hero-side {
  background: linear-gradient(145deg, rgba(255,248,250,.72), rgba(255,241,244,.62));
}
#page-auth .auth-form-side { background: rgba(255,255,255,.68); }

.auth-forgot-row { display:flex; justify-content:flex-end; margin:-6px 0 16px; }
.auth-text-button { border:0; padding:8px 0; background:transparent; color:var(--primary); font-size:13px; font-weight:700; cursor:pointer; }
.auth-text-button:focus-visible { outline:2px solid var(--primary); outline-offset:3px; border-radius:4px; }
#authForgotPasswordBtn[hidden] { display:none; }
.password-reset-dialog { text-align:left; max-height:calc(100dvh - 40px); overflow:auto; }
.password-reset-dialog h2 { font-size:24px; line-height:1.25; margin-bottom:12px; }
.password-reset-dialog > p { font-size:13px; line-height:1.65; color:var(--text-muted); margin:12px 0 20px; }
.password-reset-dialog .auth-form-input { font-size:16px; min-height:46px; }
.password-reset-message { font-size:13px; line-height:1.6; color:#047857; margin:14px 0; overflow-wrap:anywhere; }
.password-reset-message:empty { margin:16px 0; }
.password-reset-message.is-error { color:#b91c1c; }
.password-reset-dialog .btn-auth-submit { border:0; padding:10px; height:auto; min-height:46px; }
.password-reset-dialog button:disabled { opacity:.55; cursor:not-allowed; }
@media(max-width:480px) { .password-reset-dialog { padding:24px 20px; } }

#page-auth.auth-verification-pending .auth-form-side > div { display:none; }
#emailVerificationPanel[hidden] { display:none; }
.email-verification-panel h2 { font-size:26px; line-height:1.25; margin:14px 0; }
.email-verification-panel p { color:var(--text-muted); font-size:14px; line-height:1.7; margin:14px 0; overflow-wrap:anywhere; }
.email-verification-panel button { display:block; margin-top:12px; }
.email-verification-panel button:disabled { opacity:.55; cursor:not-allowed; }
.account-deletion-recovery { max-width:960px; margin:16px auto; padding:14px 20px; background:#fff7ed; border:1px solid #fed7aa; border-radius:12px; display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; }
.account-deletion-recovery p { flex:1 1 220px; font-size:13px; line-height:1.6; color:#9a3412; margin:0; overflow-wrap:anywhere; }
@media(max-width:1000px) { .account-deletion-recovery { margin:12px; } }
/* Consistent tool controls, compact settings and small-screen workspaces. */
#page-tool .dynamic-tool-settings, #dynamicToolSettingsContainer { min-width:0; }
#dynamicToolSettingsContainer :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),select,button) { min-height:40px; max-width:100%; }
#dynamicToolSettingsContainer :where(input,select,textarea) { font-size:14px; }
#dynamicToolSettingsContainer button { white-space:normal; line-height:1.35; }
#dynamicToolSettingsContainer details > summary { padding:10px 0; cursor:pointer; }
#page-tool .tool-workbench { align-items:start; }
#page-tool .workspace-dropzone { min-height:210px; padding:28px 20px; }
#page-tool.merge-mode .merge-telemetry,#page-tool.merge-mode .merge-preset-summary,#page-tool.merge-mode .merge-queue-box,#page-tool.merge-mode .merge-preview-btn { display:none; }
#page-tool .file-order-controls { flex-shrink:0; }
#page-tool .file-order-controls button { white-space:nowrap; word-break:normal; overflow-wrap:normal; }
#page-tool .file-detail-name { min-width:0; }
#page-tool .sign-card { min-width:0; }
#page-tool .sign-card > * { min-width:0; max-width:100%; }
#page-tool .sign-card input { min-width:0; max-width:100%; }
#page-tool .sign-pad { min-width:0; width:100%; }
.sign-draw-controls { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; }
.sign-pen-control { display:grid; gap:4px; min-width:0; }
#page-tool .sign-pen-control input { width:100%; min-width:0; padding:0; }
.sign-output-label { display:grid; gap:6px; }
#page-tool .sign-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); }
.tool-field-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:12px; }
.tool-field-pair label { display:grid; gap:6px; min-width:0; }
.page-number-settings { display:grid; gap:10px; font-size:13px; }
.page-number-settings fieldset { border:0; margin:0; padding:0; min-width:0; }
.page-number-settings legend { margin-bottom:8px; font-weight:700; }
.page-number-positions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.page-number-settings .sidebar-input-box { margin:0; }
.tool-setting-hint { font-size:12px; color:var(--text-muted); line-height:1.5; margin:0 0 6px; }
#page-tool.tool-unavailable .workbench-left,#page-tool.tool-unavailable #workbenchActionCard,#page-tool.tool-unavailable #sharedToolHeader .badge-pro { display:none; }
#page-tool.tool-unavailable .tool-workbench { grid-template-columns:minmax(0,1fr); max-width:760px; }
.tool-unavailable-message { padding:12px 0; }
.tool-unavailable-message h2 { margin:14px 0 10px; font-size:24px; }
.tool-unavailable-message p { font-size:14px; color:var(--text-muted); line-height:1.65; margin-bottom:18px; }
.tool-unavailable-message a { color:var(--primary); font-size:14px; font-weight:700; }
.tool-availability-label { padding:5px 10px; border-radius:99px; background:var(--bg-alt); color:var(--text-muted); font-size:12px; font-weight:700; }
#page-tool.html-code-workspace:not(.html-upload-mode) .workbench-left { display:none; }
#page-tool.html-code-workspace .tool-workbench { grid-template-columns:minmax(0,1fr); max-width:1000px; margin-inline:auto; }
#page-tool.html-code-workspace .htmlpdf-settings { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#page-tool.html-code-workspace .htmlpdf-code { min-height:220px; }
@media(min-width:1100px) { #page-tool.html-code-workspace .htmlpdf-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; } #page-tool.html-code-workspace .htmlpdf-tabs { grid-column:1/-1; } #page-tool.html-code-workspace #htmlPdfPreviewWrap { grid-column:2; grid-row:2; margin:0; } }
@media(max-width:900px) {
 #dynamicToolSettingsContainer :where(button,select,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file])) { min-height:44px; }
 #page-tool .split-extra-toggle,#page-tool .compress-advanced-toggle,#page-tool .btn-file-move { min-height:44px; }
 #page-tool .btn-file-move { min-width:36px; }
 #page-tool .workspace-dropzone { min-height:185px; padding:22px 16px; }
 #page-tool .workspace-dropzone .upload-circle-icon { margin-bottom:12px; }
 #page-tool .workbench-file-row { flex-wrap:wrap; gap:10px; }
 #page-tool .workbench-file-row .row-left { flex:1 1 100%; min-width:0; }
 #page-tool .workbench-file-row .row-left > div:last-child { min-width:0; flex:1; }
 #page-tool .workbench-file-row .file-detail-name { white-space:normal; overflow-wrap:anywhere; }
 #page-tool .workbench-file-row .file-order-controls { margin-left:auto; gap:8px; }
 #page-tool .workbench-file-row .file-order-controls button { min-height:44px; min-width:44px; }
 #page-tool .htmlpdf-preview iframe { height:220px; min-height:0; }
 #page-tool .ed-bar { gap:8px; }
 #page-tool .ed-bar button { min-height:44px; }
 #page-tool .ed-bar input:not([type=color]) { min-height:44px; }
}
@media(max-width:400px) {
 .sign-draw-controls { grid-template-columns:1fr 1fr; }
 .sign-pen-control { grid-column:1/-1; grid-row:1; }
 .sign-draw-controls button { width:100%; }
 #page-tool .sign-card { padding:10px; }
 #page-tool .tool-field-pair { grid-template-columns:minmax(0,1fr); }
}
.tool-advanced-group { border-top:1px solid var(--border); padding-top:8px; margin-top:8px; }
.tool-advanced-group summary { cursor:pointer; font-size:13px; font-weight:700; padding:10px 0; }
.tool-advanced-fields { display:grid; gap:12px; padding:8px 0; }
#page-tool .wm-card label { display:grid; gap:7px; }
@media(max-width:900px) {
 #dynamicToolSettingsContainer button { min-width:44px; }
 #dynamicToolSettingsContainer input[type=color] { min-width:44px; min-height:44px; }
 #dynamicToolSettingsContainer input[type=range] { min-height:44px; }
}
#page-tool .compress-mode-switch .compress-choice { display:block; grid-template-columns:none; min-height:48px; text-align:center; font-weight:700; line-height:1.4; }
/* Put the homepage tool grid in the first desktop viewport. */
#page-home .hero { padding:28px 20px 18px; }
#page-home .hero-badge { display:none; }
#page-home .hero-title { max-width:1000px; font-size:clamp(28px,2.6vw,38px); line-height:1.2; margin-bottom:10px; letter-spacing:-.8px; }
#page-home .hero-desc { max-width:760px; font-size:15px; line-height:1.5; }
#page-home .search-box-wrap { max-width:620px; margin:18px auto 0; }
#page-home .search-box { min-height:48px; }
#page-home .search-box input { font-size:14px; min-width:0; }
#page-home .search-box button { min-height:38px; font-size:13px; }
#page-home .persona-tabs-wrap { margin:10px 16px 0; gap:8px; }
#page-home .persona-tab-btn { padding:8px 14px; font-size:12px; min-height:36px; }
#page-home #contentViewIndividuals > .section-wrap { margin:20px auto 28px; }
#page-home .section-header { margin-bottom:12px; gap:12px; }
#page-home .section-title { font-size:22px; }
#page-home .section-header p { font-size:12px !important; }
#page-home .tools-grid { gap:12px; grid-template-columns:repeat(4,minmax(0,1fr)); }
#page-home .tool-card { min-width:0; min-height:76px; padding:14px; gap:12px; align-items:center; }
#page-home .tool-card-icon-wrap { width:36px; height:36px; border-radius:9px; }
#page-home .tool-card-icon-wrap svg { width:20px; height:20px; }
#page-home .tool-card-content { min-width:0; }
#page-home .tool-card-content h3 { display:block; font-size:14px; line-height:1.5; margin:0; overflow-wrap:break-word; }
#page-home .tool-card-content p { display:none; }
#page-home .tool-card-content .badge-free,#page-home .tool-card-content .badge-pro { display:inline-block; vertical-align:middle; margin:2px 0 2px 4px; padding:2px 5px; font-size:10px; line-height:1.4; white-space:nowrap; }
@media(min-width:1024px) and (max-height:720px) {
 #page-home .hero { padding-top:18px; padding-bottom:12px; }
 #page-home .hero-title { font-size:30px; }
 #page-home .search-box-wrap { margin-top:12px; }
 #page-home #contentViewIndividuals > .section-wrap { margin-top:14px; }
}
@media(min-width:700px) and (max-width:1023px) { #page-home .tools-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:699px) {
 #page-home .hero { padding:24px 16px 14px; }
 #page-home .hero-title { font-size:28px; }
 #page-home .hero-desc { font-size:14px; }
 #page-home .persona-tab-btn { min-height:44px; padding:8px 10px; font-size:11px; }
 #page-home .tools-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 #page-home .tool-card { flex-direction:column; align-items:flex-start; padding:12px; gap:8px; min-height:108px; }
 #page-home .tool-card-content h3 { font-size:13px; }
 #page-home .tool-card-content .badge-free,#page-home .tool-card-content .badge-pro { margin-left:0; }
 #page-home .section-title { font-size:20px; }
}
/* Preview the homepage tagline on two lines. */
#page-home .hero-title span { display:block; }
#page-home .hero-title span { margin-top:10px; }
/* Preview compact descriptions below homepage tool titles. */
#page-home .tool-card { align-items:flex-start; min-height:88px; padding:12px 14px; }
#page-home .tool-card-content h3 { line-height:1.35; margin-bottom:5px; }
#page-home .tool-card-content p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:11px; line-height:1.45; }
@media(max-width:699px) {
 #page-home .tool-card { padding:12px; min-height:140px; }
}
@media(min-width:1024px) and (max-height:720px) {
 #page-home .hero { padding-top:12px; padding-bottom:8px; }
 #page-home #contentViewIndividuals > .section-wrap { margin-top:10px; }
}
/* Fit the government application tools into the desktop landing view. */
#page-home #contentViewGovt > .section-wrap { margin:18px auto 28px; }
#page-home #contentViewGovt .section-title { font-size:21px; line-height:1.3; }
#page-home #contentViewGovt .tool-card { padding:10px 12px; min-height:82px; gap:10px; }
#page-home #contentViewGovt .tool-card-content h3 { font-size:13px; }
#page-home #contentViewGovt .tool-card-content p { font-size:11px; }
@media(min-width:1400px) { #page-home #govtBasicToolsGrid { grid-template-columns:repeat(6,minmax(0,1fr)); } }
@media(min-width:1024px) and (max-height:768px) {
 body.mode-govt #page-home .hero { padding:12px 20px 8px; }
 body.mode-govt #page-home .hero-title { font-size:26px; }
 body.mode-govt #page-home .hero-desc { font-size:14px; }
 body.mode-govt #page-home .search-box-wrap { margin-top:12px; }
 #page-home #contentViewGovt > .section-wrap { margin-top:12px; }
 #page-home #contentViewGovt .section-header p { display:none; }
}
@media(max-width:699px) { #page-home #contentViewGovt .tool-card { min-height:140px; padding:12px; } }
@media(min-width:1024px) and (max-height:650px) {
 #page-home #contentViewGovt .tool-card-content p { -webkit-line-clamp:1; }
 #page-home #contentViewGovt .tool-card { min-height:76px; padding-block:8px; }
}
/* Government cards need readable titles, not six narrow columns. */
@media(min-width:1024px) { #page-home #govtBasicToolsGrid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
#page-home #govtBasicToolsGrid .tool-card-content .badge-free { display:none; }
#page-home #govtBasicToolsGrid .tool-card-content p { -webkit-line-clamp:2; }
@media(min-width:1024px) and (max-height:650px) { #page-home #govtBasicToolsGrid .tool-card-content p { -webkit-line-clamp:1; } }
@media(min-width:700px) { #page-home #govtBasicToolsGrid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:1024px) and (max-height:650px) {
 body.mode-govt #page-home .hero-desc { display:none; }
 #page-home #govtBasicToolsGrid .tool-card { min-height:64px; padding-block:8px; }
}
/* Both homepage modes share the same hero sizing. */
body.mode-govt #page-home .hero { padding:28px 20px 18px; }
body.mode-govt #page-home .hero-title { font-size:clamp(28px,2.6vw,38px); }
body.mode-govt #page-home .hero-desc { display:block; font-size:15px; }
body.mode-govt #page-home .search-box-wrap { margin-top:18px; }
@media(min-width:1024px) and (max-height:720px) {
 body.mode-govt #page-home .hero { padding-top:12px; padding-bottom:8px; }
 body.mode-govt #page-home .hero-title { font-size:30px; }
 body.mode-govt #page-home .search-box-wrap { margin-top:12px; }
}
@media(max-width:699px) {
 body.mode-govt #page-home .hero { padding:24px 16px 14px; }
 body.mode-govt #page-home .hero-title { font-size:28px; }
 body.mode-govt #page-home .hero-desc { font-size:14px; }
}
/* Smooth verified-payment upgrade, with a small burst at each edge. */
@property --primary { syntax:'<color>'; inherits:true; initial-value:#e91d48; }
@property --primary-hover { syntax:'<color>'; inherits:true; initial-value:#cc173d; }
@property --primary-subtle { syntax:'<color>'; inherits:true; initial-value:#fff2f5; }
@property --primary-border { syntax:'<color>'; inherits:true; initial-value:#fecdd3; }
body.pro-upgrade-transition { transition:--primary 1100ms ease,--primary-hover 1100ms ease,--primary-subtle 1100ms ease,--primary-border 1100ms ease,background-color 1100ms ease,color 1100ms ease; }
body.user-is-pro.pro-upgrade-start { --primary:#e91d48; --primary-hover:#cc173d; --primary-subtle:#fff2f5; --primary-border:#fecdd3; }
body.user-is-pro .hero-title span { background-image:linear-gradient(135deg,var(--primary),#b45309); }
.pro-side-confetti { position:fixed; inset:0; pointer-events:none; overflow:hidden; z-index:250; }
.pro-confetti-piece { position:absolute; top:55%; width:6px; height:9px; border-radius:2px; background:var(--tone); opacity:0; animation:pro-edge-burst 1300ms ease-out var(--delay) forwards; }
.pro-confetti-piece.left { left:-8px; --direction:1; }
.pro-confetti-piece.right { right:-8px; --direction:-1; }
@keyframes pro-edge-burst { 0% { opacity:0; transform:translate(0,0) rotate(0deg); } 12% { opacity:.9; } 100% { opacity:0; transform:translate(calc(var(--travel)*var(--direction)),var(--fall)) rotate(var(--spin)); } }
@media(prefers-reduced-motion:reduce) { .pro-side-confetti { display:none; } body.pro-upgrade-transition { transition:none; } }
body.pro-upgrade-start { transition:none; }
.notification-bell { position:relative; display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border:1px solid var(--border); border-radius:50%; background:#fff; color:var(--text-main); }
.notification-bell[hidden],.notification-panel[hidden],.notification-dot[hidden] { display:none!important; }
.notification-dot { position:absolute; right:7px; top:6px; width:7px; height:7px; border-radius:50%; background:var(--primary); border:1px solid #fff; }
.notification-panel { position:fixed; z-index:190; top:80px; right:max(16px,calc((100vw - 1200px)/2)); width:min(380px,calc(100vw - 24px)); max-height:calc(100dvh - 100px); display:flex; flex-direction:column; background:#fff; border:1px solid var(--border); border-radius:16px; box-shadow:0 12px 40px #0f172a26; overflow:hidden; }
.notification-head { display:flex; justify-content:space-between; align-items:center; padding:16px 18px 8px; }
.notification-head h2 { font-size:18px; }.notification-head button { width:36px; height:36px; font-size:24px; color:var(--text-muted); }
.notification-tabs { display:flex; gap:6px; padding:0 14px 12px; border-bottom:1px solid var(--border); }
.notification-tabs button { padding:8px 12px; min-height:40px; border-radius:8px; color:var(--text-muted); font-weight:700; font-size:12px; }
.notification-tabs button[aria-pressed=true] { color:var(--primary); background:var(--primary-subtle); }
.notification-list { overflow-y:auto; min-height:90px; overscroll-behavior:contain; }
.notification-item { display:grid; gap:5px; width:100%; padding:16px 18px; text-align:left; border-bottom:1px solid var(--border); color:var(--text-main); background:#fff; }
.notification-item.unread { background:var(--primary-subtle); box-shadow:inset 3px 0 var(--primary); }
.notification-category { color:var(--primary); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.notification-item strong { font-size:14px; }.notification-item > span:not(.notification-category) { font-size:12px; line-height:1.6; color:var(--text-muted); overflow-wrap:anywhere; }
.notification-item time { font-size:10px; color:var(--text-muted); }.notification-empty { padding:28px 18px; font-size:13px; color:var(--text-muted); }
.notification-footer { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; padding:12px 16px; font-size:10px; color:var(--text-muted); border-top:1px solid var(--border); }
.notification-footer button { color:var(--primary); font-weight:700; font-size:12px; }.notification-footer button:disabled { opacity:.5; }
.notification-panel button:focus-visible,.notification-bell:focus-visible { outline:2px solid var(--primary); outline-offset:-3px; }
@media(max-width:600px) { .notification-panel { top:76px; right:12px; max-height:calc(100dvh - 92px); }.notification-bell { width:36px; height:36px; }.notification-tabs button { min-height:44px; } }
/* Compact notifications without shrinking mobile tap targets. */
.notification-bell { width:36px; height:36px; }
.notification-bell svg { width:18px; height:18px; }
.notification-panel { width:min(340px,calc(100vw - 24px)); }
.notification-head { padding:12px 14px 6px; }
.notification-head h2 { font-size:16px; }
.notification-tabs { padding:0 10px 8px; gap:4px; }
.notification-tabs button { font-size:11px; padding:6px 10px; }
.notification-item { padding:12px 14px; gap:4px; }
.notification-item strong { font-size:13px; }
.notification-item > span:not(.notification-category) { font-size:11px; line-height:1.5; }
.notification-footer { padding:10px 12px; }
@media(max-width:600px) { .notification-bell { width:36px; height:36px; } }
.notification-bell { width:32px; height:32px; }
.notification-bell svg { width:16px; height:16px; }
.notification-panel { width:min(310px,calc(100vw - 24px)); }
.notification-head { padding:10px 12px 4px; }
.notification-head h2 { font-size:15px; }
.notification-item { padding:10px 12px; }
.notification-tabs { padding-bottom:6px; }
@media(max-width:600px) { .notification-bell { width:36px; height:36px; } }
#refundModal[hidden],#refundRequestForm[hidden] { display:none!important; }
.refund-dialog { max-width:460px; max-height:calc(100dvh - 32px); overflow:auto; text-align:left; }
.refund-dialog h2 { font-size:22px; margin-bottom:10px; }.refund-dialog p { font-size:13px; line-height:1.6; color:var(--text-muted); margin:8px 0 14px; }
.refund-dialog label { display:block; margin:12px 0 6px; font-size:13px; font-weight:700; }.refund-dialog textarea { resize:vertical; min-height:110px; font-size:16px; }.refund-dialog select { font-size:16px; min-height:44px; }
#refundStatusMessage { padding:12px; background:var(--bg-alt); border:1px solid var(--border); border-radius:8px; font-size:13px; line-height:1.6; margin:14px 0; overflow-wrap:anywhere; }
.refund-actions { display:flex; justify-content:space-between; gap:16px; margin-top:14px; }.refund-history-button { display:block; margin:8px 0 0 auto; white-space:normal; min-height:40px; max-width:160px; }
@media(max-width:480px) { .refund-dialog { padding:24px 18px; }.refund-history-button { min-height:44px; } }
/* Billing uses matching column order and one aligned action group. */
.billing-history-table { table-layout:fixed; }
.billing-history-table th:nth-child(1) { width:25%; }
.billing-history-table th:nth-child(2) { width:19%; }
.billing-history-table th:nth-child(3) { width:21%; }
.billing-history-table th:nth-child(4) { width:35%; }
.billing-history-table td { vertical-align:middle; font-size:12px; overflow-wrap:break-word; }
.billing-history-table td[data-label=Amount] { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.billing-actions { display:flex; flex-direction:column; align-items:stretch; gap:6px; margin-left:auto; max-width:124px; }
.billing-actions .btn-action-small { width:100%; margin:0; padding:7px 8px; min-height:34px; font-size:11px; white-space:normal; line-height:1.4; border-radius:7px; }
.billing-actions .refund-history-button { background:transparent; color:var(--text-muted); border-color:transparent; }
.billing-actions .refund-history-button:hover { background:var(--bg-alt); border-color:var(--border); }
@media(max-width:1000px) {
 .billing-history-table,.billing-history-table tbody { display:block; width:100%; }
 .billing-history-table thead { display:none; }
 .billing-history-table tbody { display:grid; gap:12px; }
 .billing-history-table tr { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:'plan amount' 'date date' 'actions actions'; gap:4px 12px; padding:14px; border:1px solid var(--border); border-radius:10px; background:#fff; }
 .billing-history-table td { border:0; padding:0; min-width:0; }
 .billing-history-table td[data-label=Plan] { grid-area:plan; font-size:14px; }
 .billing-history-table td[data-label=Amount] { grid-area:amount; font-size:14px; font-weight:700; }
 .billing-history-table td[data-label=Date] { grid-area:date; font-size:12px; }
 .billing-history-table td[data-label=Actions] { grid-area:actions; padding-top:10px; }
 .billing-actions { flex-direction:row; max-width:none; margin:0; gap:8px; }
 .billing-actions .btn-action-small { flex:1; min-height:44px; max-width:none; font-size:12px; }
 .billing-history-table td[colspan] { grid-column:1/-1; }
 #page-profile .profile-dashboard-layout { grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))!important; }
}