@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap");
:root { --purple: #1777e8; --deep: #1777e8; --ink: #293038; --muted: #7d8690; --line: #e9ecf0; --light: #f5f8fc; }
* { box-sizing: border-box; }
body { margin: 0px; background: rgb(255, 255, 255); color: var(--ink); font-family: "DM Sans", Arial, sans-serif; font-size: 15px; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, a { transition: background 0.15s, color 0.15s, box-shadow 0.15s; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
button { border: 0px; background: none; color: inherit; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: rgb(164, 206, 255) solid 3px; outline-offset: 4px; }
header { height: 82px; padding: 0px 4.5%; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); gap: 30px; background: white; position: relative; z-index: 5; }
.brand { display: flex; align-items: center; font-family: Manrope, Arial, sans-serif; font-size: 25px; font-weight: 800; letter-spacing: -1.3px; }
.brand > span:last-child { color: var(--purple); }
.brand-icon { display: inline-grid; place-items: center; letter-spacing: 0px; background: var(--purple); color: white; border-radius: 50%; width: 30px; height: 30px; margin-right: 8px; font-size: 23px; }
nav { display: flex; align-items: center; gap: 31px; margin-right: auto; margin-left: 25px; font-weight: 500; }
.navbutton { padding: 29px 0px; display: flex; gap: 10px; }
.navbutton span { color: rgb(148, 155, 163); }
.header-right { display: flex; align-items: center; gap: 23px; }
.search-icon { background: rgb(246, 247, 248); border-radius: 50%; width: 35px; height: 35px; font-size: 27px; }
.private-label { font-size: 13px; color: rgb(119, 127, 137); }
.outline { border: 1px solid rgb(211, 229, 250); color: var(--deep); padding: 10px 15px; border-radius: 6px; font-size: 14px; }
.outline span { margin-left: 18px; }
.navmenu { position: relative; }
.dropdown { display: none; position: absolute; top: 65px; left: -20px; width: 245px; background: rgb(255, 255, 255); border: 1px solid var(--line); box-shadow: rgba(36, 52, 71, 0.082) 0px 15px 45px; padding: 10px; border-radius: 10px; }
.dropdown.open { display: block; }
.dropdown button { display: block; padding: 11px 10px; width: 100%; text-align: left; border-radius: 5px; font-size: 14px; }
.dropdown button:hover { background: var(--light); color: var(--purple); }
.hero { text-align: center; padding: 59px 20px 45px; background: radial-gradient(at 50% 40%, rgb(246, 250, 255) 0%, white 65%); }
.eyebrow { font-size: 10px; letter-spacing: 2px; color: rgb(136, 146, 157); font-weight: 650; display: flex; justify-content: center; align-items: center; gap: 8px; }
.eyebrow span { width: 6px; height: 6px; border-radius: 50%; background: rgb(23, 119, 232); }
h1, h2, h3 { font-family: Manrope, Arial, sans-serif; }
h1 { font-size: 47px; letter-spacing: -1.5px; margin: 16px 0px 13px; font-weight: 800; line-height: 1.2; }
.subtitle { font-size: 17px; color: rgb(121, 128, 137); margin: 0px 0px 31px; line-height: 1.6; }
.workspace { max-width: 816px; margin: auto; border: 1px solid rgb(227, 233, 241); border-radius: 12px; background: white; box-shadow: rgba(32, 51, 73, 0.02) 0px 8px 35px; overflow: visible; }
.dropzone { margin: 12px; border: 1.5px dashed rgb(194, 210, 228); border-radius: 7px; background: rgb(245, 248, 251); min-height: 282px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 30px; transition: 0.2s; }
.dropzone.drag { background: rgb(233, 243, 255); border-color: var(--purple); }
.file-art { height: 65px; width: 100px; position: relative; margin-bottom: 19px; }
.paper { width: 39px; height: 50px; border: 1px solid rgb(192, 209, 230); border-radius: 5px; position: absolute; background: white; display: flex; align-items: center; justify-content: center; font-size: 9px; letter-spacing: 0.3px; font-weight: 700; color: rgb(150, 176, 207); }
.paper::before { content: ""; width: 17px; height: 2px; background: rgb(217, 228, 240); position: absolute; bottom: 9px; left: 10px; }
.paper.back { left: 17px; top: 7px; transform: rotate(-16deg); }
.paper.front { left: 43px; top: 13px; transform: rotate(13deg); color: var(--purple); box-shadow: rgba(144, 171, 202, 0.125) 0px 3px 9px; }
.paper span { position: absolute; border-radius: 50%; background: var(--purple); color: white; font-size: 15px; right: -11px; bottom: -5px; width: 23px; height: 23px; }
.spark { position: absolute; top: -4px; right: 2px; font-size: 23px; color: rgb(167, 193, 223); }
.upload-actions { display: flex; position: relative; }
.primary { background: var(--purple); color: rgb(255, 255, 255); padding: 14px 25px; border-radius: 6px; font-weight: 600; box-shadow: rgba(23, 119, 232, 0.094) 0px 4px 10px; display: inline-flex; align-items: center; gap: 14px; justify-content: center; }
.primary:hover { background: var(--deep); box-shadow: rgba(23, 119, 232, 0.19) 0px 5px 20px; }
.upload-actions .primary { border-radius: 6px 0px 0px 6px; font-size: 17px; padding: 15px 24px; }
.upload-actions .split { border-radius: 0px 6px 6px 0px; padding: 15px 16px; border-left: 1px solid rgba(255, 255, 255, 0.25); }
.primary:disabled { opacity: 0.6; cursor: wait; }
.source-menu { position: absolute; top: 58px; right: 0px; width: 230px; background: white; box-shadow: rgba(33, 52, 75, 0.133) 0px 12px 30px; border: 1px solid var(--line); border-radius: 7px; z-index: 3; text-align: left; padding: 7px; }
.source-menu button { display: block; padding: 12px; width: 100%; text-align: left; border-radius: 4px; }
.source-menu button:hover { background: var(--light); }
.droptext { font-size: 13px; color: rgb(134, 141, 150); margin: 13px 0px 8px; }
.limit { font-size: 11px; color: rgb(155, 162, 170); margin: 0px; }
.settings-bar { border-top: 1px solid rgb(237, 241, 245); text-align: left; }
.settings-bar button { width: 100%; display: flex; align-items: center; gap: 9px; padding: 17px 24px; color: rgb(134, 144, 155); font-size: 15px; }
.settings-bar button span { font-size: 13px; color: rgb(97, 106, 116); }
.settings-bar small { font-size: 11px; color: rgb(160, 167, 176); }
.settings-bar b { margin-left: auto; color: rgb(137, 146, 157); }
.settings { padding: 15px 25px 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; text-align: left; border-top: 1px solid var(--line); }
[hidden] { display: none !important; }
.settings label { font-size: 12px; display: flex; flex-direction: column; gap: 8px; color: rgb(114, 122, 132); }
.settings input:not([type="checkbox"]) { width: 100%; padding: 9px; border: 1px solid var(--line); border-radius: 5px; }
.settings input[type="range"] { padding: 0px; accent-color: var(--purple); }
.settings .check { flex-direction: row; align-items: center; }
.settings p { grid-column: 1 / -1; font-size: 11px; color: var(--muted); margin: 0px; }
.trust { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 23px; color: rgb(152, 159, 168); font-size: 11px; }
.trust span:first-child { color: rgb(123, 140, 160); }
.trust i { width: 3px; height: 3px; border-radius: 50%; background: rgb(211, 218, 227); }
.wrap { max-width: 1120px; margin-left: auto; margin-right: auto; }
.popular { padding: 30px 0px 52px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 24px; gap: 20px; }
.kicker { font-size: 9px; letter-spacing: 1.8px; font-weight: 600; color: rgb(150, 162, 176); }
h2 { font-size: 26px; letter-spacing: -0.8px; font-weight: 750; margin: 9px 0px 0px; }
.tool-filters { display: flex; gap: 5px; background: rgb(246, 247, 249); padding: 4px; border-radius: 7px; }
.tool-filters button { font-size: 11px; padding: 8px 13px; border-radius: 5px; color: rgb(133, 139, 145); }
.tool-filters button.active { background: white; color: var(--purple); box-shadow: rgba(33, 52, 75, 0.063) 0px 1px 5px; }
.tool-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; }
.tool-card { border: 1px solid var(--line); border-radius: 8px; padding: 20px 18px; text-align: left; display: flex; align-items: center; gap: 12px; min-height: 87px; background: white; }
.tool-card:hover { border-color: rgb(180, 210, 246); background: rgb(252, 253, 255); box-shadow: rgba(23, 119, 232, 0.035) 0px 3px 15px; transform: translateY(-1px); }
.tool-icon { flex-shrink: 0; display: grid; place-items: center; width: 35px; height: 39px; border-radius: 7px; background: rgb(237, 245, 255); color: rgb(23, 119, 232); font-size: 18px; }
.tool-card[data-cat="Video"] .tool-icon { color: rgb(123, 156, 196); background: rgb(236, 243, 251); }
.tool-card[data-cat="PDF"] .tool-icon { color: rgb(215, 141, 145); background: rgb(255, 240, 240); }
.tool-card[data-cat="Archive"] .tool-icon { color: rgb(187, 155, 83); background: rgb(251, 244, 230); }
.tool-card strong { display: block; font-size: 12px; font-weight: 600; }
.tool-card small { display: block; font-size: 10px; color: rgb(160, 166, 173); margin-top: 5px; }
.tool-card .arrow { color: rgb(178, 185, 193); font-size: 15px; margin-left: auto; }
.format-note { text-align: center; font-size: 10px; color: rgb(159, 166, 174); margin: 23px 0px 0px; line-height: 1.8; }
.benefits { border-top: 1px solid var(--line); padding: 53px 0px 55px; }
.section-title { text-align: center; }
.section-title p { font-size: 13px; color: rgb(145, 151, 159); margin-top: 12px; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 68px; padding: 40px 40px 0px; }
.benefit-icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgb(225, 234, 244); background: rgb(250, 252, 255); color: var(--purple); border-radius: 12px; font-size: 26px; margin-bottom: 21px; }
.step { font-size: 9px; color: rgb(169, 181, 195); letter-spacing: 1px; }
.benefits h3 { font-size: 16px; margin: 10px 0px; }
.benefits p { font-size: 12px; line-height: 1.85; color: rgb(140, 148, 158); }
.privacy { margin-top: 16px; background: rgb(246, 249, 252); border: 1px solid rgb(235, 241, 247); border-radius: 12px; padding: 35px 38px; display: flex; align-items: center; gap: 29px; }
.shield { height: 70px; width: 64px; flex-shrink: 0; border-radius: 22px; background: rgb(235, 242, 251); color: rgb(144, 179, 220); font-size: 40px; display: grid; place-items: center; }
.privacy h2 { font-size: 22px; }
.privacy p { font-size: 12px; line-height: 1.8; color: rgb(139, 148, 158); max-width: 565px; margin-bottom: 0px; }
.privacy-pill { margin-left: auto; white-space: nowrap; font-size: 12px; color: rgb(118, 136, 158); line-height: 2; }
.privacy-pill span { font-size: 10px; color: rgb(162, 173, 186); }
.faq { max-width: 800px; padding: 64px 0px; }
.faq h2 { font-size: 22px; margin-bottom: 30px; }
details { border-bottom: 1px solid var(--line); padding: 18px 0px; text-align: left; font-size: 13px; }
summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; }
summary::after { content: "＋"; color: rgb(155, 162, 170); }
details[open] summary::after { content: "−"; }
details p { font-size: 12px; line-height: 1.9; color: rgb(133, 142, 152); }
footer { border-top: 1px solid var(--line); padding: 32px 20px 20px; }
.footer-top { display: flex; align-items: center; gap: 25px; }
.footer-top .brand { font-size: 21px; }
.footer-top .brand-icon { height: 25px; width: 25px; font-size: 19px; }
.footer-top p { font-size: 12px; color: rgb(156, 163, 171); }
.footer-top > a:last-child { margin-left: auto; font-size: 12px; color: rgb(132, 154, 180); }
.footer-bottom { border-top: 1px solid var(--line); padding-top: 19px; margin-top: 27px; display: flex; justify-content: space-between; color: rgb(169, 176, 184); font-size: 9px; }
.text-btn { font-size: 12px; color: var(--purple); padding: 6px; }
.footer-bottom button { font-size: 9px; padding: 0px; color: inherit; }
.queue-heading, .queue-bottom { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; }
.queue-heading { border-bottom: 1px solid var(--line); font-size: 14px; }
.queue-heading span { font-size: 11px; color: rgb(155, 163, 173); font-weight: 400; }
.file-row { padding: 16px 22px; display: flex; align-items: center; text-align: left; gap: 13px; border-bottom: 1px solid var(--line); }
.file-info { flex: 1 1 0%; min-width: 0px; }
.file-name { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-meta { font-size: 10px; color: rgb(162, 169, 178); margin-top: 5px; }
.file-row select { padding: 7px; border: 1px solid rgb(223, 230, 239); border-radius: 4px; font-size: 11px; background: white; }
.file-row .remove { color: rgb(170, 170, 170); font-size: 19px; }
.file-row a { font-size: 12px; color: rgb(110, 175, 134); font-weight: 600; }
.status { font-size: 10px; color: var(--purple); max-width: 170px; }
.status.error { color: rgb(196, 112, 121); }
.queue-bottom .primary { font-size: 13px; padding: 12px 20px; }
.muted { color: rgb(163, 171, 180); }
#message { font-size: 12px; color: rgb(120, 137, 157); max-width: 700px; margin: 16px auto 0px; line-height: 1.8; }
dialog { border: 1px solid var(--line); box-shadow: rgba(37, 55, 77, 0.2) 0px 20px 90px; border-radius: 14px; width: min(540px, 90vw); padding: 25px; }
dialog::backdrop { background: rgba(34, 45, 57, 0.4); backdrop-filter: blur(3px); }
.dialog-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.dialog-head h2 { font-size: 21px; margin: 0px; }
.dialog-head button { font-size: 26px; color: rgb(146, 157, 169); }
dialog input { padding: 14px; border: 1px solid rgb(216, 227, 240); width: 100%; border-radius: 7px; outline-color: var(--purple); }
#searchResults { max-height: 350px; overflow: auto; margin-top: 13px; }
#searchResults button { width: 100%; padding: 13px 10px; text-align: left; border-radius: 5px; font-size: 13px; }
#searchResults button:hover { background: var(--light); }
@media (min-width: 1600px) {
  header { padding-left: 8%; padding-right: 8%; }
  .hero { padding-top: 75px; }
}
@media (max-width: 1200px) {
  .wrap { margin-left: 35px; margin-right: 35px; }
  nav { gap: 20px; margin-left: 8px; }
  .private-label { display: none; }
  .tool-grid { grid-template-columns: repeat(3, 1fr); }
  .benefit-grid { gap: 35px; padding-left: 20px; padding-right: 20px; }
}
@media (max-width: 760px) {
  header { height: 68px; padding: 0px 20px; gap: 15px; }
  .brand { font-size: 22px; }
  nav { gap: 18px; margin: 0px; }
  nav > a, nav .navmenu:nth-child(2), nav .navmenu:nth-child(3) { display: none; }
  .header-right { gap: 12px; }
  .outline { display: none; }
  .hero { padding: 38px 18px 28px; }
  h1 { font-size: 37px; }
  .subtitle { font-size: 14px; }
  .eyebrow { font-size: 8px; }
  .dropzone { min-height: 265px; padding: 28px 12px; }
  .trust { gap: 10px; font-size: 9px; }
  .trust i { display: none; }
  .wrap { margin-left: 20px; margin-right: 20px; }
  .popular { padding-top: 26px; }
  .section-heading { align-items: start; flex-direction: column; gap: 18px; }
  h2 { font-size: 23px; }
  .tool-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .tool-card { padding: 15px 10px; gap: 9px; min-height: 80px; }
  .tool-card strong { font-size: 11px; }
  .tool-card small { font-size: 9px; }
  .tool-card .arrow { display: none; }
  .tool-icon { width: 29px; height: 34px; font-size: 15px; }
  .benefits { padding: 38px 0px; }
  .benefit-grid { grid-template-columns: 1fr; gap: 25px; padding: 30px 12px 0px; }
  .benefit-grid article { padding-left: 65px; position: relative; }
  .benefit-icon { position: absolute; left: 0px; top: 7px; }
  .benefits p { margin-bottom: 0px; }
  .privacy { padding: 25px; gap: 20px; align-items: start; }
  .shield { width: 42px; height: 48px; font-size: 28px; border-radius: 15px; }
  .privacy h2 { font-size: 20px; }
  .privacy-pill { display: none; }
  .privacy .kicker { font-size: 8px; }
  .faq { padding: 45px 0px; }
  .faq h2 { font-size: 21px; }
  .footer-top { flex-wrap: wrap; gap: 12px; }
  .footer-top p { display: none; }
  .footer-bottom { flex-direction: column; gap: 12px; align-items: start; }
  .settings { grid-template-columns: 1fr; }
  .settings p { grid-column: auto; }
  .file-row { padding: 14px 12px; gap: 8px; flex-wrap: wrap; }
  .file-info { flex-basis: 40%; }
  .file-row .status { flex-basis: 100%; padding-left: 40px; }
  .file-row select { max-width: 120px; }
  .queue-heading, .queue-bottom { padding: 17px 13px; }
}
:root { --purple: #1777e8; --deep: #1777e8; --ink: #282e35; --muted: #747a82; --line: #e9ecef; --light: #f2f5f8; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { background: rgb(255, 255, 255); font-family: "DM Sans", Arial, sans-serif; }
header { height: 58px; padding: 0px 3.7%; gap: 45px; box-shadow: rgba(21, 24, 28, 0.02) 0px 3px 14px; border-bottom: 1px solid rgb(244, 245, 246); }
.brand { font-size: 22px; letter-spacing: -0.6px; }
.brand-icon { width: 25px; height: 25px; font-size: 20px; margin-right: 8px; }
.brand > span:last-child { color: var(--ink); }
nav { margin-left: 20px; gap: 34px; font-size: 14px; font-weight: 500; }
.navbutton { padding: 18px 0px; }
.navbutton span { color: rgb(56, 61, 66); }
.dropdown { top: 43px; border-radius: 5px; }
.header-right { gap: 20px; }
.outline { border: 1px solid rgb(23, 119, 232); padding: 8px 13px; border-radius: 3px; font-size: 13px; }
.search-icon { width: 38px; height: 38px; background: rgb(247, 247, 248); }
.private-label { font-size: 11px; }
.hero { padding: 45px 20px 27px; background: rgb(255, 255, 255); }
.eyebrow { display: none; }
h1 { font-size: 46px; font-weight: 800; letter-spacing: -0.8px; line-height: 1.2; margin: 0px 0px 16px; }
.subtitle { font-size: 18px; color: rgb(52, 58, 65); letter-spacing: 0.15px; margin-bottom: 39px; }
.workspace { max-width: 720px; border: 0px; border-radius: 0px; box-shadow: none; background: white; }
.dropzone { margin: 0px; min-height: 276px; background: rgb(237, 240, 244); border: 3px dashed rgb(197, 206, 217); border-radius: 5px; padding: 40px 20px 30px; }
.file-art { display: none; }
.upload-actions .primary { font-size: 21px; font-weight: 600; padding: 16px 22px; border-radius: 4px 0px 0px 4px; gap: 10px; }
.upload-actions .split { padding: 16px 19px; border-radius: 0px 4px 4px 0px; }
.primary { border-radius: 4px; background: rgb(23, 119, 232); box-shadow: rgba(23, 119, 232, 0.2) 0px 7px 19px; }
.primary:hover { background: rgb(23, 119, 232); box-shadow: rgba(23, 119, 232, 0.286) 0px 8px 22px; }
.droptext { font-size: 12px; color: rgb(109, 118, 128); margin-top: 17px; margin-bottom: 12px; }
.limit { font-size: 12px; color: rgb(76, 84, 94); }
.source-menu { top: 66px; border-radius: 4px; }
.settings-bar { margin-top: 16px; border: 1px solid rgb(237, 239, 241); border-radius: 4px; }
.settings-bar button { padding: 15px 19px; }
.settings-bar button span { font-size: 13px; color: rgb(69, 75, 83); }
.settings-bar small { font-size: 11px; color: rgb(139, 144, 150); }
.settings { border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-top: 0px; }
.trust { margin-top: 19px; font-size: 10px; color: rgb(124, 131, 140); gap: 19px; }
#message { color: rgb(101, 118, 139); }
.wrap { max-width: 1120px; }
.benefits { max-width: 940px; border-top: 0px; padding: 42px 0px 51px; }
.benefits > .section-title { display: none; }
.benefit-grid { padding: 0px; gap: 42px; }
.benefit-grid article { text-align: center; }
.benefit-icon { margin: 0px auto 20px; width: 44px; height: 44px; background: white; border: 0px; border-radius: 0px; font-size: 34px; color: rgb(52, 57, 66); }
.step { display: none; }
.benefits h3 { font-size: 21px; letter-spacing: -0.3px; margin: 10px 0px 15px; }
.benefits p { font-size: 13px; line-height: 1.9; color: rgb(98, 106, 116); margin: 0px; }
.popular { border-top: 1px solid rgb(237, 239, 242); padding: 40px 0px 43px; }
.kicker { display: none; }
h2 { font-size: 28px; color: rgb(46, 53, 61); letter-spacing: -0.6px; }
.section-heading { margin-bottom: 23px; }
.tool-filters { border-radius: 4px; background: rgb(244, 245, 247); padding: 4px; }
.tool-filters button { font-size: 12px; border-radius: 3px; }
.tool-grid { gap: 12px; }
.tool-card { border-radius: 5px; min-height: 93px; padding: 17px 15px; }
.tool-card strong { font-size: 12px; color: rgb(60, 67, 75); }
.tool-card small { font-size: 10px; color: rgb(141, 147, 154); }
.tool-icon { border-radius: 5px; background: rgb(237, 245, 255); color: rgb(128, 168, 216); width: 35px; height: 40px; }
.tool-card:hover { background: rgb(250, 252, 255); border-color: rgb(197, 215, 237); box-shadow: rgba(98, 144, 197, 0.04) 0px 4px 15px; }
.format-note { font-size: 10px; line-height: 1.8; }
.privacy { max-width: 1000px; margin-top: 22px; background: rgb(248, 249, 251); border: 0px; border-radius: 5px; padding: 38px 36px; gap: 25px; }
.shield { background: rgb(237, 242, 248); border-radius: 12px; width: 60px; height: 66px; font-size: 31px; color: rgb(23, 119, 232); }
.privacy h2 { font-size: 26px; }
.privacy p { color: rgb(114, 122, 131); font-size: 13px; line-height: 1.8; }
.privacy-pill { color: rgb(113, 140, 172); font-size: 12px; }
.privacy-pill span { color: rgb(147, 156, 167); }
.faq { max-width: 800px; padding: 53px 0px 59px; }
.faq h2 { font-size: 26px; }
details { padding: 20px 0px; }
summary { font-size: 13px; color: rgb(70, 77, 85); }
details p { color: rgb(118, 125, 134); }
.footer-directory { display: grid; grid-template-columns: repeat(5, 1fr); gap: 32px; padding: 12px 0px 45px; }
.footer-directory h3 { font-family: "DM Sans", Arial, sans-serif; font-size: 14px; letter-spacing: 0px; margin: 0px 0px 19px; font-weight: 600; }
.footer-directory button, .footer-directory a { display: block; width: 100%; text-align: left; font-size: 12px; line-height: 1.7; color: rgb(119, 126, 135); padding: 5px 0px; }
.footer-directory button:hover, .footer-directory a:hover { color: var(--purple); text-decoration: underline; }
footer { background: rgb(250, 250, 251); border-top: 1px solid rgb(236, 238, 240); padding: 32px 25px 23px; }
.footer-top { border-top: 1px solid rgb(233, 236, 239); padding-top: 24px; }
.footer-top .brand { font-size: 21px; }
.footer-bottom { font-size: 10px; padding-top: 17px; margin-top: 21px; }
.footer-bottom button { font-size: 10px; }
.queue-heading, .queue-bottom { padding: 19px; border: 1px solid var(--line); }
.file-row { border-left: 1px solid var(--line); border-right: 1px solid var(--line); padding: 17px 19px; }
.queue-bottom .primary { border-radius: 4px; }
.queue-heading span { color: rgb(152, 158, 165); }
.status { color: rgb(112, 146, 186); }
dialog { border-radius: 7px; }
dialog input { border-radius: 4px; }
.dialog-head h2 { font-size: 23px; }
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible { outline: rgb(164, 206, 255) solid 3px; outline-offset: 3px; }
@media (min-width: 1600px) {
  .hero { padding-top: 56px; }
  .workspace { max-width: 760px; }
}
@media (max-width: 1180px) {
  .wrap { margin-left: 30px; margin-right: 30px; }
  .benefits { margin-left: auto; margin-right: auto; max-width: 880px; }
  .privacy { margin-left: 40px; margin-right: 40px; }
  .faq { margin-left: auto; margin-right: auto; }
  .tool-card { padding: 17px 13px; gap: 9px; }
  .tool-card strong { font-size: 11px; }
  header { gap: 28px; }
  nav { margin-left: 10px; gap: 25px; }
}
@media (max-width: 960px) {
  .private-label { display: none; }
  .hero { padding-top: 39px; }
  .benefits { margin-left: 35px; margin-right: 35px; }
  .benefit-grid { gap: 28px; }
  .benefits h3 { font-size: 18px; }
  .benefits p { font-size: 12px; }
  .tool-grid { grid-template-columns: repeat(2, 1fr); }
  .tool-card { padding: 21px; min-height: 93px; }
  .tool-card strong { font-size: 13px; }
  .tool-card small { font-size: 11px; }
  .footer-directory { grid-template-columns: repeat(3, 1fr); row-gap: 30px; }
  .privacy-pill { display: none; }
  .faq { max-width: calc(100% - 90px); }
}
@media (max-width: 640px) {
  header { height: 60px; padding: 0px 16px; gap: 10px; }
  .brand { font-size: 20px; }
  .brand-icon { width: 24px; height: 24px; }
  nav { margin: 0px 0px 0px auto; gap: 0px; }
  .navbutton { font-size: 12px; padding: 17px 8px; gap: 5px; }
  nav > .navmenu:nth-child(2), nav > .navmenu:nth-child(3), nav > a { display: none; }
  .header-right { gap: 7px; }
  .header-right .outline { display: none; }
  .search-icon { width: 33px; height: 33px; font-size: 23px; }
  .dropdown { top: 43px; left: auto; right: -38px; width: 230px; }
  .hero { padding: 33px 16px 19px; }
  h1 { font-size: 35px; letter-spacing: -0.7px; margin-bottom: 15px; }
  .subtitle { font-size: 15px; line-height: 1.7; max-width: 330px; margin: 0px auto 28px; }
  .dropzone { min-height: 251px; padding: 34px 13px 28px; border-width: 2px; }
  .upload-actions .primary { font-size: 18px; padding: 15px 18px; }
  .upload-actions .split { padding: 15px 17px; }
  .droptext { font-size: 11px; }
  .limit { font-size: 10px; }
  .settings-bar button { padding: 15px; }
  .settings-bar small { font-size: 10px; }
  .settings { grid-template-columns: 1fr; padding: 18px; }
  .trust { flex-wrap: wrap; gap: 10px; font-size: 9px; margin-top: 18px; }
  .trust i { display: none; }
  .wrap { margin-left: 20px; margin-right: 20px; }
  .benefits { padding: 30px 0px 37px; }
  .benefit-grid { grid-template-columns: 1fr; gap: 30px; padding: 0px 12px; }
  .benefit-icon { margin-bottom: 11px; }
  .benefits h3 { font-size: 21px; margin-bottom: 10px; }
  .benefits p { font-size: 13px; }
  .popular { padding: 30px 0px; }
  .section-heading { flex-direction: column; align-items: flex-start; gap: 17px; }
  .section-heading h2 { font-size: 25px; margin: 0px; }
  .tool-filters { gap: 2px; max-width: 100%; }
  .tool-filters button { padding: 8px 11px; font-size: 10px; }
  .tool-grid { gap: 10px; }
  .tool-card { display: grid; grid-template-columns: 1fr auto; align-items: start; padding: 16px 13px; gap: 10px; min-height: 134px; }
  .tool-card .tool-icon { grid-column: 1; width: 32px; height: 35px; }
  .tool-card > span:nth-child(2) { grid-area: 2 / 1 / auto / -1; }
  .tool-card .arrow { grid-area: 1 / 2; padding-top: 7px; }
  .tool-card strong { font-size: 11px; line-height: 1.4; }
  .tool-card small { font-size: 9px; line-height: 1.6; }
  .format-note { text-align: left; font-size: 9px; }
  .privacy { padding: 26px; flex-direction: column; align-items: flex-start; gap: 17px; margin: 16px 20px 0px; }
  .shield { width: 49px; height: 51px; font-size: 27px; border-radius: 8px; }
  .privacy h2 { font-size: 24px; line-height: 1.3; margin-top: 0px; }
  .privacy p { font-size: 12px; }
  .faq { max-width: none; padding: 39px 0px; }
  .faq h2 { font-size: 24px; }
  details { padding: 18px 0px; }
  summary { font-size: 12px; gap: 15px; }
  details p { font-size: 12px; }
  .footer-directory { grid-template-columns: repeat(2, 1fr); gap: 27px; padding-bottom: 30px; }
  .footer-directory h3 { font-size: 13px; margin-bottom: 12px; }
  .footer-directory button, .footer-directory a { font-size: 11px; }
  .footer-top { flex-wrap: wrap; gap: 12px; }
  .footer-top p { width: 100%; order: 3; margin-top: 0px; }
  .footer-top > a:last-child { font-size: 11px; }
  .footer-bottom { flex-wrap: wrap; gap: 12px; line-height: 1.7; }
  .footer-bottom > span:nth-child(2) { display: none; }
  .queue-heading { font-size: 12px; padding: 15px; }
  .queue-heading .text-btn { font-size: 10px; }
  .queue-bottom { padding: 15px; }
  .queue-bottom .primary { padding: 12px 17px; font-size: 12px; }
  .file-row { display: grid; grid-template-columns: 32px minmax(0px, 1fr) auto; padding: 15px; gap: 10px; }
  .file-row .tool-icon { width: 30px; height: 34px; }
  .file-name { font-size: 12px; }
  .file-row select { grid-area: 2 / 2; justify-self: start; }
  .file-row a, .file-row .status { grid-area: 3 / 2; max-width: none; }
  .file-row .remove { grid-area: 1 / 3; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, ::before, ::after { transition: none !important; }
}
.upload-glyph { display: inline-flex; align-items: center; }
.upload-glyph svg { width: 21px; height: 24px; }
.benefit-icon svg { width: 34px; height: 38px; }
:root { --purple: #2563eb; --deep: #1d4ed8; --light: #eff6ff; }
.dropzone { background: rgb(239, 247, 255); border-color: rgb(184, 212, 243); }
.dropzone.drag { background: rgb(224, 239, 255); border-color: rgb(37, 99, 235); }
.primary { background: rgb(37, 99, 235); box-shadow: rgba(37, 99, 235, 0.15) 0px 7px 19px; }
.primary:hover { background: rgb(29, 78, 216); box-shadow: rgba(37, 99, 235, 0.2) 0px 8px 22px; }
.outline { border-color: rgb(147, 185, 245); color: rgb(37, 99, 235); }
.tool-icon { background: rgb(234, 243, 255); color: rgb(59, 130, 246); }
.privacy { background: rgb(241, 248, 255); }
.shield { background: rgb(224, 239, 255); color: rgb(37, 99, 235); }
.trust span:first-child { color: rgb(103, 133, 165); }
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible { outline-color: rgb(147, 197, 253); }
.upload-actions { z-index: 8; }
.source-menu { top: 100%; left: 0px; right: 0px; width: auto; min-width: 250px; border: 0px; border-radius: 0px 0px 4px 4px; padding: 0px; background: rgb(57, 117, 237); box-shadow: rgba(29, 78, 216, 0.2) 0px 12px 24px; overflow: hidden; text-align: left; z-index: 15; }
.source-menu button { display: flex; align-items: center; gap: 20px; width: 100%; padding: 21px 23px; color: rgb(255, 255, 255); font-size: 16px; font-weight: 500; line-height: 1.6; border-radius: 0px; border-top: 1px solid rgba(255, 255, 255, 0.133); }
.source-menu button:first-child { border-top: 0px; }
.source-menu button:hover, .source-menu button:focus-visible { background: rgb(37, 99, 235); }
.source-menu button svg { width: 19px; height: 19px; flex-shrink: 0; }
.source-menu button:focus-visible { outline: white solid 2px; outline-offset: -4px; }
.split[aria-expanded="true"] { border-bottom-right-radius: 0px; }
.split[aria-expanded="true"] { transform: none; }
.sample-link { font-size: inherit; color: rgb(37, 99, 235); padding: 0px; text-decoration: underline; text-underline-offset: 3px; }
.sample-separator { padding: 0px 4px; color: rgb(161, 168, 182); }
#importDialog { width: min(550px, 92vw); max-height: 90dvh; overflow: auto; padding: 26px; }
#importDialog .dialog-head { margin-bottom: 14px; }
#importDialog h2 { font-size: 23px; }
#importHelp { font-size: 13px; line-height: 1.8; color: rgb(107, 114, 128); margin: 0px 0px 19px; }
.import-label { display: block; text-align: left; font-size: 12px; font-weight: 600; color: rgb(75, 85, 99); margin: 17px 0px 8px; }
.import-label span { font-weight: 400; color: rgb(137, 144, 157); }
#importDialog input { font-size: 13px; }
.import-actions { display: flex; align-items: center; justify-content: flex-end; gap: 15px; margin: 18px 0px; }
.import-actions .primary { font-size: 13px; }
.import-footnote { font-size: 10px; color: rgb(139, 148, 163); line-height: 1.7; margin: 18px 0px 0px; }
#importError { font-size: 12px; line-height: 1.7; color: rgb(189, 60, 53); margin-bottom: 0px; }
#importError:empty, #importStatus:empty { display: none; }
#importStatus { font-size: 12px; color: rgb(37, 99, 235); margin-bottom: 0px; }
#cloudFallback { border-top: 1px solid rgb(229, 231, 235); padding-top: 10px; }
#cloudFallback p { font-size: 12px; line-height: 1.8; color: rgb(107, 114, 128); }
.fallback-actions { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; }
.fallback-actions .outline { font-size: 11px; padding: 8px 11px; }
.fallback-actions button { font-size: 11px; }
#cloudChoose:disabled { opacity: 0.5; cursor: wait; }
#importClose { padding: 0px 5px; }
@media (max-width: 640px) {
  .source-menu { min-width: 230px; }
  .source-menu button { font-size: 14px; padding: 18px 20px; gap: 18px; }
  .sample-link { font-size: 10px; }
  #importDialog { padding: 22px; }
  #importDialog h2 { font-size: 21px; }
}
header { position: relative; z-index: 30; }
.navmenu { position: static; }
.navbutton[aria-expanded="true"] { color: var(--purple); }
.navbutton[aria-expanded="true"] > span { color: var(--purple); transform: rotate(180deg); }
.navbutton > span { display: inline-block; transition: transform 0.16s; }
.dropdown.mega-menu { position: absolute; top: 100%; left: 3px; right: 3px; width: auto; background: rgb(255, 255, 255); border-width: 1px 0px 0px; border-style: solid none none; border-color: rgb(229, 232, 239) currentcolor currentcolor; border-image: none; border-radius: 0px 0px 3px 3px; box-shadow: rgba(17, 24, 39, 0.086) 0px 8px 13px; padding: 0px 20px 22px; text-align: left; max-height: calc(100dvh - 80px); overflow: auto; }
.mega-menu.open { display: block; }
.mega-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 0px; padding-top: 10px; }
.mega-group { min-width: 0px; }
.mega-group h2 { height: 55px; display: flex; align-items: center; gap: 7px; font: 600 15px "DM Sans", Arial, sans-serif; letter-spacing: 0px; color: rgb(22, 26, 34); margin: 0px; padding: 0px 12px; border-bottom: 1px solid rgb(228, 232, 240); position: relative; }
.mega-group h2::before { content: ""; position: absolute; top: 10px; bottom: 10px; left: 0px; border-left: 1px solid rgb(228, 232, 240); }
.mega-group:first-child h2::before { display: none; }
.mega-group h2 svg { width: 18px; height: 19px; flex-shrink: 0; }
.mega-links { padding: 10px 12px 0px; min-height: 202px; border-left: 1px solid rgb(228, 232, 240); margin-top: 10px; display: grid; grid-auto-flow: column; grid-template-rows: repeat(5, 44px); grid-auto-columns: minmax(0px, 1fr); align-content: start; column-gap: 22px; }
.mega-group:first-child .mega-links { border-left: 0px; }
.mega-links button { display: flex; align-items: center; min-height: 44px; padding: 10px 8px; font-size: 14px; line-height: 1.6; color: rgb(37, 40, 50); font-weight: 400; border-radius: 3px; text-align: left; width: 100%; margin: 0px; }
.mega-links button:hover, .mega-links button:focus-visible { background: rgb(239, 246, 255); color: rgb(37, 99, 235); }
.mega-tools { grid-template-columns: 1fr 1fr 2.85fr; }
.mega-tools .mega-links { min-height: 246px; }
.mega-wide .mega-links { grid-template-rows: repeat(3, 44px); }
.mega-compress { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
.mega-compress .mega-links { min-height: 160px; grid-template-rows: repeat(3, 44px); }
@media (min-width: 1500px) {
  .dropdown.mega-menu { padding-left: 30px; padding-right: 30px; }
  .mega-links button { font-size: 15px; }
  .mega-links { column-gap: 35px; }
}
@media (max-width: 960px) {
  header { gap: 22px; }
  .mega-group h2 { font-size: 13px; }
  .mega-links button { font-size: 12px; }
  .mega-links { padding-left: 9px; padding-right: 9px; column-gap: 10px; }
  .mega-tools { grid-template-columns: 1fr 1fr 2fr; }
  .mega-wide .mega-links { grid-template-rows: repeat(4, 44px); }
}
@media (max-width: 640px) {
  header { height: auto; min-height: 60px; flex-wrap: wrap; padding: 12px 16px 0px; gap: 0px; align-items: center; }
  .header-right { margin-left: auto; }
  .header-right .search-icon { display: block; }
  header > nav { display: flex; flex-basis: 100%; order: 3; margin: 5px 0px 0px; gap: 7px; justify-content: flex-start; }
  header > nav > .navmenu:nth-child(n) { display: block; }
  header > nav > a { display: none; }
  .navbutton { padding: 13px 12px; font-size: 12px; gap: 8px; min-height: 42px; }
  .dropdown.mega-menu { left: 0px; right: 0px; padding: 0px 16px 18px; max-height: calc(100dvh - 116px); border-radius: 0px 0px 5px 5px; }
  .mega-grid, .mega-tools, .mega-compress { display: grid; grid-template-columns: 1fr 1fr; gap: 0px 12px; padding-top: 3px; }
  .mega-group, .mega-wide { grid-column: auto; }
  .mega-group h2 { height: 48px; padding: 0px 3px; font-size: 12px; }
  .mega-group h2::before { display: none; }
  .mega-group h2 svg { width: 16px; }
  .mega-links, .mega-tools .mega-links, .mega-compress .mega-links, .mega-wide .mega-links { display: flex; flex-direction: column; gap: 0px; border-left: 0px; padding: 4px 0px 12px; margin-top: 0px; min-height: 0px; }
  .mega-links button { font-size: 12px; min-height: 41px; padding: 9px 3px; }
  .mega-wide { grid-column: 1 / -1; }
  .mega-wide .mega-links { display: grid; grid-template-columns: 1fr 1fr; gap: 0px 12px; }
  .hero { padding-top: 30px; }
}
.navbutton { align-items: center; gap: 8px; }
.navbutton > .nav-chevron, .navbutton[aria-expanded="true"] > .nav-chevron { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 12px; width: 12px; height: 12px; line-height: 1; color: currentcolor; transform: none; transition: none; }
.nav-chevron svg { display: block; width: 12px; height: 8px; overflow: visible; }