/* Scoped visual layer for the directory, upload workspace and loaded editor. */
.refresh-eyebrow { color:#6045a9;font-size:12px;font-weight:800;letter-spacing:.14em; }
.refresh-introduction { padding:38px 0 25px; }
.refresh-introduction h1 { margin:12px auto;max-width:900px;font-size:clamp(30px,4vw,52px);letter-spacing:-.045em; }
.refresh-introduction .tool-intro-copy { margin:0 auto; }
.upload-hero { max-width:1100px;display:grid;grid-template-columns:1fr 1.15fr;gap:34px;padding:30px;background:linear-gradient(120deg,#f0ebff,#fafbff);border-color:#e0d8f2;box-shadow:0 18px 45px #31215d09; }
.upload-story { align-self:center;min-width:0;padding:0 10px;color:#584878; }
.preview-caption { display:flex;justify-content:space-between;font-size:10px;font-weight:800;letter-spacing:.15em; }
.document-illustration { width:100%;max-height:300px;margin:10px 0; }
.story-cues { display:flex;gap:8px;flex-wrap:wrap;justify-content:center; }
.story-cues span { padding:6px 9px;border-radius:8px;background:#fff;font-size:12px;font-weight:650; }
.upload-story > p { text-align:center;font-size:11px;margin:14px 0 0;color:#70667f; }
.upload-hero .dropzone { min-height:225px;border-width:1.5px; }
/* The native input must not intercept clicks at the visible picker center. */
.upload-hero .dropzone input[type="file"] { clip-path:inset(50%);pointer-events:none; }
.upload-hero .tool-details { font-size:13px; }
.home-guide { max-width:1100px; }
.home-guide > p { max-width:850px;color:#526071; }
.home-guide > h3 { border-left:3px solid #b4a0e5;padding-left:14px; }
.home-tool-links { list-style:none;padding:0;gap:10px; }
.home-tool-links li { margin:0; }
.home-tool-links a { display:block;padding:10px 15px;border:1px solid #ddd6ed;border-radius:10px;background:white;text-decoration:none;font-weight:650;font-size:14px; }
.home-tool-links a:hover { background:#f0ebff;border-color:#7552d4; }
.tools-directory { max-width:1200px;padding-block:44px 70px; }
.directory-heading h1 { font-size:clamp(34px,4vw,50px);letter-spacing:-.045em;margin:10px 0 14px; }
.directory-heading p { color:#526071;line-height:1.6; }
.category-nav { display:flex;gap:10px;flex-wrap:wrap;margin:24px 0 32px; }
.category-nav a { display:flex;gap:12px;padding:10px 16px;background:#fff;border:1px solid #ddd6ed;border-radius:100px;color:#39249c;font-weight:700;text-decoration:none; }
.category-nav span { color:#64748b;font-size:12px;align-self:center; }
.tool-category { scroll-margin-top:90px;--category-ink:#5b3da7;--category-bg:#eee7fc; }
.category-convert { --category-ink:#1c5791;--category-bg:#e0efff; }
.category-ocr { --category-ink:#866013;--category-bg:#fff1ca; }
.category-security { --category-ink:#21674f;--category-bg:#dcf4e9; }
.category-heading { display:flex;align-items:baseline;gap:20px;margin:28px 0 16px; }
.category-heading h2 { font-size:26px;margin:0;letter-spacing:-.03em; }
.category-heading p { font-size:14px;color:#526071;margin:0; }
.tool-card-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;gap:16px;padding:0;margin:0; }
.tool-card-grid li { min-width:0; }
.directory-card { display:flex;flex-direction:column;height:100%;padding:22px;border:1px solid #dde2ed;border-radius:18px;background:#fff;color:#182238;text-decoration:none;box-shadow:0 3px 10px #17255403; }
.directory-card:hover { border-color:var(--category-ink);box-shadow:0 8px 22px #26314b0c; }
.card-top { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px;gap:12px; }
.tool-art { display:flex;align-items:center;gap:9px;padding:12px;border-radius:12px;background:var(--category-bg);color:var(--category-ink); }
.tool-art .icon { width:23px;height:23px; }
.tool-art small { font-size:10px;max-width:100px;overflow-wrap:anywhere;font-weight:800; }
.access-tag { padding:4px 8px;background:#f0f2f7;border-radius:6px;font-size:11px;font-weight:700;color:#475569; }
.access-free { background:#e4f5eb;color:#246442; }
.directory-card h3 { margin:0 0 10px;font-size:18px;letter-spacing:-.015em; }
.directory-card p { color:#526071;font-size:14px;line-height:1.6;margin:0 0 18px; }
.card-action { display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:12px;border-top:1px solid #edf0f5;color:var(--category-ink);font-size:12px;font-weight:750; }
.quality-tag { color:#80520b;background:#fff4d7;padding:6px 8px;border-radius:6px;font-size:12px;margin-bottom:14px;align-self:flex-start; }
.directory-pricing .public-offer { padding:18px 22px;background:#ede9f6;border:0;margin:24px 0 36px;font-size:13px;line-height:1.6; }
.directory-pricing .public-offer p { margin:6px 0; }
.directory-pricing a { color:#50359b;font-weight:700; }
.editor-document-bar { border-top:3px solid #7450d4; }
.editor-doc-actions > .button-primary { min-width:112px;min-height:40px;box-shadow:0 4px 12px #4f36c930; }
.editor-toolbar { background:#211d36;gap:8px; }
.toolbar-group { background:#ffffff06;border-radius:9px;padding:3px; }
.tool-button { color:#d1cddd; }
.tool-button:hover { background:#403452; }
.tool-button.is-active { background:#6544bb;box-shadow:inset 0 0 0 1px #ac92ec;color:white; }
.tool-button.is-active span { color:white; }
.editor-toolbar :focus-visible { outline:2px solid #e0cdff;outline-offset:-2px; }
.toolbar-divider { background:#524464; }
.page-rail { background:#f4f0fa; }
.page-thumb.is-active { border-color:#8a6ccb;background:#fff;box-shadow:0 3px 12px #56389718; }
.page-thumb.is-active .page-thumb-image { outline-color:#7450d4; }
.canvas-workspace { background:#e6e8ef; background-image:none; }
.editor-inspector { background:#fff;border-left-color:#d9d5e5; }
.inspector-head { background:#faf8fe; }
.selected-page-badge { background:#6142a8; }
@media(max-width:800px) {
 .upload-hero { grid-template-columns:1fr;max-width:620px;padding:20px; }
 .upload-story { display:none; }
 .tool-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .category-heading { display:block; }
 .category-heading p { margin-top:7px; }
}
@media(max-width:480px) {
 .refresh-introduction { padding:24px 0 18px; }
 .refresh-introduction h1 { font-size:32px; }
 .refresh-introduction .tool-intro-copy { font-size:14px; }
 .upload-hero { padding:14px;border-radius:18px; }
 .upload-hero .dropzone { min-height:220px;padding:16px; }
 .tools-directory { padding-top:26px; }
 .category-nav { gap:7px;margin:20px 0 25px; }
 .category-nav a { padding:8px 11px;font-size:13px;gap:6px; }
 .tool-card-grid { grid-template-columns:1fr;gap:12px; }
 .directory-card { padding:18px; }
 .card-top { margin-bottom:12px; }
 .directory-heading h1 { font-size:34px; }
 .directory-pricing .public-offer { padding:16px; }
}
