/* OpenURL: navy, sea glass and a clear working surface. */
:root{--paper:#f6f8fb;--paper-deep:#edf2f6;--surface:#fff;--surface-strong:#fff;--ink:#11243c;--ink-soft:#546579;--line:#dce4eb;--line-strong:#c6d2df;--mint:#d7f7ee;--mint-deep:#087f70;--coral:#087f70;--coral-soft:#d7f7ee;--shadow:0 14px 50px #11243c08;--radius-lg:18px;--radius-md:10px}
:root[data-theme="dark"]{--paper:#0b1625;--paper-deep:#142338;--surface:#112136;--surface-strong:#102034;--ink:#edf5ff;--ink-soft:#a9bace;--line:#2b415a;--line-strong:#39516b;--mint:#183c40;--mint-deep:#69e4cf;--coral:#69e4cf;--coral-soft:#183c40}
body{background:var(--paper)}input{font:inherit}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid var(--mint-deep);outline-offset:3px}.header-inner{min-height:78px}.site-header{background:var(--surface);backdrop-filter:none}.brand-copy strong{font-family:inherit;font-size:24px;letter-spacing:-1px}.brand-copy strong>span{color:var(--mint-deep)}.brand-copy small{display:inline;font-size:14px;letter-spacing:0;font-weight:500}.main-nav{display:flex;gap:28px;font-size:13px}.main-nav a{text-decoration:none;color:var(--ink-soft)}.main-nav a:hover{color:var(--mint-deep)}
.hero{padding-block:58px 48px;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:80px}.hero h1{font-size:clamp(44px,5.2vw,66px);line-height:1.06;letter-spacing:-3px;margin:17px 0 20px;font-weight:750}.hero h1 em{color:var(--mint-deep);font-style:normal}.hero p{max-width:510px;color:var(--ink-soft);font-size:15px;line-height:1.8}.eyebrow{font-size:10px;letter-spacing:.15em}.hero-pills{display:flex;flex-wrap:wrap;gap:20px;margin-top:25px;font-size:11px;color:var(--ink-soft)}.hero-demo{padding:32px;background:#11243c;color:#f4faff;border-radius:18px;transform:rotate(-2deg);box-shadow:12px 12px 0 var(--mint)}.demo-label{font:10px ui-monospace,monospace;letter-spacing:.12em;color:#9cb1c5}.hero-demo code{display:block;margin-top:25px;font-size:19px}.demo-route{display:flex;align-items:center;gap:16px;margin-top:20px;color:#69e4cf}.demo-route span{padding:4px 10px;border:1px solid #39566a;border-radius:5px;font:12px ui-monospace,monospace}.hero-demo .demo-result{padding:17px 13px;background:#1d354a;border-radius:8px;font-size:clamp(12px,1.5vw,17px);white-space:nowrap}.demo-result span{color:#69e4cf}.demo-foot{display:block;font-size:11px;color:#aac1d4;margin-top:24px}.workspace-caption{display:flex;justify-content:space-between;padding-block:17px;font:10px ui-monospace,monospace;letter-spacing:.08em;color:var(--ink-soft)}
.workspace{grid-template-columns:minmax(0,1fr) 330px;border:1px solid var(--line);scroll-margin-top:20px}.workspace-main{padding:26px}.workspace-side{background:var(--surface)}.side-section{padding:26px 23px}.step-number{background:var(--paper-deep);border:0;color:var(--ink-soft);border-radius:8px}.editor-wrap{border:1px solid var(--line)}#url-input{min-height:210px;font-size:13px}.editor-topline{height:32px}.editor-topline span{width:6px;height:6px;background:var(--line-strong)!important}.editor-topline b{font-weight:400}.editor-actions{justify-content:flex-start}.primary-actions{grid-template-columns:1fr 1fr;margin-top:22px}.button{border-radius:8px;font-weight:650;font-size:13px}.button-primary{background:#11243c;color:#fff;box-shadow:none}.button-primary:hover{box-shadow:none;background:#203d5c}.accent-card{background:var(--mint);color:var(--ink)}.warning-card{background:var(--paper)}.privacy-note{border-top:1px solid var(--line);background:var(--paper);margin:0 23px;border-radius:10px;padding:18px}.privacy-note p{font-size:11px}.setting-note{font-size:11px}.shortcut{font-size:9px}.transform-panel{margin-top:25px;border-top:1px solid var(--line);padding-top:22px}.optional-tag{font:9px ui-monospace,monospace;color:var(--ink-soft);letter-spacing:.1em}.affix-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.affix-fields label{font-size:11px;font-weight:650;color:var(--ink-soft)}.affix-fields input{display:block;width:100%;margin-top:7px;border:1px solid var(--line);border-radius:7px;padding:10px 12px;color:var(--ink);background:var(--surface);font:13px ui-monospace,monospace}.presets{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:12px 0;font-size:10px;color:var(--ink-soft)}.presets button{border:1px solid var(--line);background:var(--paper);border-radius:5px;padding:4px 8px;font:11px ui-monospace,monospace;cursor:pointer}.presets button:hover{background:var(--mint)}.transform-preview{padding:12px 14px;margin:13px 0;background:var(--paper);border:1px dashed var(--line-strong);border-radius:8px}.transform-preview>span{display:block;font:8px ui-monospace,monospace;letter-spacing:.12em;color:var(--ink-soft);margin-bottom:7px}.transform-preview output{display:block;font:12px/1.5 ui-monospace,monospace;overflow-wrap:anywhere;color:var(--mint-deep)}.transform-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.transform-actions .button{min-height:36px;font-size:11px}#transform-status{font-size:11px;color:var(--ink-soft)}.text-button:disabled{opacity:.4;cursor:not-allowed}.trust-strip{padding-block:30px 45px}.trust-strip strong{font-size:13px}.help-section{display:grid;grid-template-columns:1fr 1.6fr;gap:70px;padding-block:35px 65px;border-top:1px solid var(--line)}.help-section h2{font-size:30px;line-height:1.3;letter-spacing:-1px;margin-top:15px}.help-section .faq-group{margin:0}.site-footer{background:var(--surface)}.footer-brand{font-family:inherit}.policy-page{max-width:850px;padding-block:50px 80px}.policy-page h1{font-size:44px;letter-spacing:-1.8px}.policy-content{font-size:16px;line-height:1.85;overflow-wrap:anywhere}.policy-content h2{font-size:23px;margin-top:32px}.policy-content img{max-width:100%;height:auto}.back-link{color:var(--mint-deep);font-size:13px}.policy-content a{color:var(--mint-deep)}
@media(max-width:900px){.hero{gap:35px}.workspace{grid-template-columns:minmax(0,1fr) 290px}.workspace-main{padding:20px}.side-section{padding:22px 17px}.shortcut{display:none}.hero-demo{padding:22px}.help-section{gap:30px}}
@media(max-width:700px){.hero{grid-template-columns:1fr;padding-block:32px;gap:30px}.hero-demo{max-width:440px;width:100%;transform:none}.hero h1{letter-spacing:-2px}.hero-pills{gap:13px}.workspace{grid-template-columns:1fr}.workspace-side{border-left:0;border-top:1px solid var(--line);padding-bottom:20px}.header-inner{gap:14px;min-height:68px}.main-nav{gap:15px;font-size:11px}.main-nav a:last-child{display:none}.brand-copy strong{font-size:22px}.workspace-caption{font-size:8px;letter-spacing:0}.help-section{grid-template-columns:1fr;gap:15px}.trust-strip{grid-template-columns:1fr}.primary-actions{grid-template-columns:1fr 1fr}.button{padding-inline:12px}.affix-fields{gap:9px}.policy-page h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
.privacy-note{color:var(--ink)}.privacy-note>svg{color:var(--mint-deep)}
.theme-toggle{flex:0 0 34px;display:grid;place-items:center;width:34px;height:34px;padding:7px;border:1px solid var(--line);border-radius:9px;background:var(--surface);cursor:pointer}.theme-toggle svg{width:18px;height:18px}.brand-copy{display:flex}
@media(max-width:420px){.brand{gap:8px}.brand-copy strong{font-size:20px}.main-nav{font-size:10px}.brand img{width:36px;height:36px}.header-inner{gap:10px}}

/* v1.1: persistent navigation and CMS content pages */
.main-nav a:last-child{display:inline}.footer-links{flex-wrap:wrap}.blog-page{padding-block:55px 80px}.blog-page h1{font-size:clamp(36px,5vw,56px);letter-spacing:-2px}.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:35px}.blog-card,.blog-empty,.contact-help{padding:28px;border:1px solid var(--line);border-radius:14px;background:var(--surface);margin-top:24px}.blog-card h2{margin-top:0}.blog-card p{color:var(--ink-soft)}.blog-card a,.blog-empty a,.contact-help a{color:var(--mint-deep)}.blog-pagination{margin-top:28px}.blog-pagination a,.blog-pagination span{display:inline-block;padding:6px 12px}.page-hero h1{font-family:inherit}.content-index{top:20px}
@media(max-width:700px){.header-inner{flex-wrap:wrap;padding-block:12px;gap:12px}.header-inner .main-nav{order:3;flex-basis:100%;justify-content:space-between;font-size:12px;gap:16px}.header-inner .main-nav a{display:inline}.blog-grid{grid-template-columns:1fr}.footer-inner{gap:20px}.footer-links{gap:14px}.policy-page h1{font-size:34px}}

/* CMS advertising and article content */
.ad-slot{margin-block:24px;text-align:center;max-width:100%;overflow-x:auto}.ad-slot:empty{display:none}.ad-slot img,.ad-slot iframe{max-width:100%}.blog-cover{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.blog-meta{color:var(--ink-soft);font-size:13px}.blog-prevnext{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;margin-block:30px}.policy-content img,.policy-content video,.policy-content iframe{max-width:100%;height:auto}.brand-copy strong{overflow-wrap:anywhere}

/* A single mid-page ad spans both columns of the blog grid. */
.blog-grid > .ad-slot{grid-column:1 / -1;width:100%;min-width:0;margin-block:12px}.ad-slot{clear:both}.faq-list,.policy-content{min-width:0}

/* Keep the primary workflow in the first viewport. */
.openurl-workspace-page .tool-intro { padding-top: 26px; padding-bottom: 24px; gap: 40px; }
.openurl-workspace-page .tool-intro h1 { font-size: clamp(36px, 4vw, 50px); }
.openurl-workspace-page .workspace-main { padding: 22px; }
.openurl-workspace-page #url-input { height: 180px; min-height: 140px; }
.openurl-workspace-page .primary-actions { margin-top: 14px; }
@media (max-width: 640px) {
    .openurl-workspace-page .header-inner { min-height: 64px; }
    .openurl-workspace-page .tool-intro { padding-top: 18px; padding-bottom: 18px; gap: 12px; }
    .openurl-workspace-page .tool-intro h1 { font-size: 36px; }
    .openurl-workspace-page .tool-intro > p { display: none; }
    .openurl-workspace-page .eyebrow { font-size: 9px; letter-spacing: .06em; }
    .openurl-workspace-page .workspace-main { padding: 14px; }
    .openurl-workspace-page .panel-heading { margin-bottom: 12px; }
    .openurl-workspace-page #url-input { height: 160px; min-height: 120px; }
    .openurl-workspace-page .primary-actions { grid-template-columns: 1fr 1fr; gap: 8px; }
    .openurl-workspace-page .primary-actions .button { padding-inline: 8px; font-size: 12px; }
}
@media (max-width: 640px) and (max-height: 620px) {
    .openurl-workspace-page .tool-intro { padding-block: 12px; }
    .openurl-workspace-page .tool-intro h1 { font-size: 30px; }
    .openurl-workspace-page #url-input { height: 120px; }
}

/* Sidebar editing and full-width opening settings. */
.openurl-workspace-page .workspace { grid-template-columns: minmax(0, 1.6fr) minmax(360px, 1fr); }
.openurl-workspace-page .workspace-side { padding: 22px; }
.openurl-workspace-page .workspace-side .transform-panel { margin: 0; padding: 0; border: 0; }
.openurl-workspace-page .workspace-settings { grid-column: 1 / -1; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--paper-deep) 42%, var(--surface)); }
.openurl-workspace-page .workspace-settings .side-section { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(240px, 1fr) minmax(220px, .85fr); gap: 18px 24px; padding: 22px; align-items: start; }
.openurl-workspace-page .workspace-settings .compact-heading { grid-column: 1 / -1; margin-bottom: 0; }
.openurl-workspace-page .workspace-settings .stats-grid { margin-top: 0; }
.openurl-workspace-page .workspace-settings .stat-card { min-height: 78px; }
.openurl-workspace-page .workspace-settings .progress-block { padding-top: 0; }
@media (max-width: 1000px) {
    .openurl-workspace-page .workspace-settings .side-section { grid-template-columns: 1fr 1fr; }
    .openurl-workspace-page .opening-status { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
    .openurl-workspace-page .workspace { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .openurl-workspace-page .workspace-side { padding: 18px 14px; }
    .openurl-workspace-page .workspace-settings .side-section { grid-template-columns: 1fr; padding: 18px 14px; }
}

/* Compact introduction above the CMS homepage workspace. */
.openurl-workspace-page .hero { display: block; padding-block: 20px 12px; }
.openurl-workspace-page .hero .eyebrow { margin-bottom: 0; }
.openurl-workspace-page .hero h1 { font-size: 38px; line-height: 1.15; letter-spacing: -1.5px; margin: 8px 0; }
.openurl-workspace-page .hero p { max-width: 850px; margin: 0; font-size: 13px; line-height: 1.5; }
.openurl-workspace-page .workspace-caption { padding-block: 10px; }
.openurl-workspace-page .privacy-note { margin: 0 22px 22px; }
.openurl-workspace-page .transform-panel .panel-heading { gap: 8px; }
.openurl-workspace-page .transform-panel h2 { font-size: 14px; }
@media (max-width: 700px) {
    .openurl-workspace-page .hero { padding-block: 12px 6px; }
    .openurl-workspace-page .hero h1 { font-size: 28px; margin: 5px 0; }
    .openurl-workspace-page .hero p { font-size: 12px; }
    .openurl-workspace-page .workspace-caption { padding-block: 8px; }
    .openurl-workspace-page .primary-actions .button { padding-inline: 6px; }
}
@media (max-width: 640px) and (max-height: 620px) {
    .openurl-workspace-page .hero .eyebrow { display: none; }
    .openurl-workspace-page .hero h1 { font-size: 25px; }
    .openurl-workspace-page .workspace-caption { display: none; }
}
@media (max-width: 640px) and (max-height: 620px) {
    .openurl-workspace-page #url-input { height: 96px; min-height: 96px; }
}
