/* Canonical tokens for the new tool surfaces; preserve the existing homepage theme. */
:root {
  --gold:#F5BC38; --gold-deep:#8A6200; --deep:var(--gold-deep); --navy:#0A2540;
  --ivory:#FBF8F1; --mist:#FFF3D6; --muted:#516276; --green:#2F7A62; --paper:#fff;
  --line:rgba(10,37,64,.12); --line-strong:rgba(10,37,64,.22);
  --mono:"IBM Plex Mono",monospace; --body:Manrope,"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --scroll-thumb:#8a969e; --scroll-hover:#516276; --scroll-track:#FBF8F1;
  scrollbar-color:var(--scroll-thumb) var(--scroll-track); scrollbar-width:thin; scrollbar-gutter:stable;
}
*::-webkit-scrollbar {width:10px;height:10px}
*::-webkit-scrollbar-track {background:var(--scroll-track)}
*::-webkit-scrollbar-thumb {background:var(--scroll-thumb);border:2px solid var(--scroll-track);border-radius:8px}
*::-webkit-scrollbar-thumb:hover {background:var(--scroll-hover)}
*::-webkit-scrollbar-thumb:active {background:var(--navy)}
freetools-menu {display:block;position:relative;flex-shrink:0;font:inherit;color:inherit}
.freetools-trigger {display:flex;align-items:center;gap:8px;padding:8px 0;border:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer;white-space:nowrap}
.freetools-trigger span {font-size:.85em;line-height:1;color:var(--gold-deep)}
.freetools-trigger:hover,.freetools-trigger[aria-expanded="true"] {color:var(--navy)}
.freetools-trigger:focus-visible,.freetools-dropdown a:focus-visible {outline:2px solid var(--gold-deep);outline-offset:4px}
.freetools-dropdown {position:absolute;top:100%;left:-14px;z-index:60;min-width:220px;padding:6px;background:var(--ivory);border:1px solid var(--line);border-top:2px solid var(--gold);box-shadow:0 6px 16px rgba(10,37,64,.05)}
.freetools-dropdown[hidden] {display:none}
.site-nav .freetools-dropdown a,.freetools-dropdown a {display:block;width:auto;padding:12px 14px;font:inherit;line-height:1.5;white-space:nowrap;color:inherit;text-decoration:none;transition:background-color .15s ease,color .15s ease}
.site-nav .freetools-dropdown a::after {display:none}
.freetools-dropdown a:hover,.freetools-dropdown a:focus-visible {background:var(--mist);color:var(--navy)}
.site-nav.nav-open freetools-menu {font-size:14px;width:100%}
.site-nav.nav-open .freetools-trigger {padding:11px 0}
.site-nav.nav-open .freetools-dropdown {position:static;min-width:0;margin:0 0 6px;padding:0 0 0 14px;border:0;border-left:2px solid var(--gold);box-shadow:none}
.tools-header {position:sticky;top:0;z-index:30;background:var(--ivory);border-bottom:1px solid var(--line)}
.tools-header-inner {max-width:1180px;padding:0 28px;min-height:78px;margin:auto;display:flex;align-items:center;gap:30px}
.tools-brand {display:flex;flex-shrink:0;align-items:center}
.tools-brand img {width:145px;height:32px;object-fit:contain}
.tools-navigation {display:flex;align-items:center;gap:24px;margin-left:auto;font:500 12px/1 var(--body);color:var(--muted)}
.tools-languages {display:flex;gap:3px;padding:4px;border:1px solid var(--line-strong);border-radius:24px;font-size:11px;flex-shrink:0}
.tools-languages a {padding:4px 9px;border-radius:18px}
.tools-languages a[aria-current] {background:var(--navy);color:white}
.tools-languages a:hover {box-shadow:inset 0 0 0 1px var(--gold)}
.tools-contact {background:var(--gold);padding:10px 15px;font-weight:800;white-space:nowrap}
.tools-contact:hover {filter:brightness(.96)}
.tools-home:hover {text-decoration:underline}
.persona-page .brief-label {display:block;margin:16px 0 8px;font-size:13px;font-weight:700}
.persona-page textarea {resize:none;max-height:400px;overflow-y:auto}
.persona-page .tool-hint {font-size:11px;color:var(--muted);margin:8px 0}
.persona-page .tool-status {min-height:1.8em;font:500 11px/1.8 var(--body);color:var(--muted);margin:6px 0}
.persona-page #error {min-height:1.8em}
.persona-page #result[hidden] {display:none!important}
.persona-page .generate {min-height:48px}
.persona-page .generate:disabled {cursor:wait;opacity:.7}
.persona-page button:active:not(:disabled) {filter:brightness(.95)}
.persona-page .action {min-height:36px}
.persona-page .result-actions,.persona-page .actions {flex-wrap:wrap}
.persona-page #tool-feedback {flex-basis:100%;margin:0}
.persona-page #context {overflow-wrap:anywhere;white-space:pre-wrap}
.persona-page a {cursor:pointer}
.persona-page :focus-visible {outline:3px solid var(--gold-deep);outline-offset:3px}
.persona-page h1:focus {outline:none}
@media(max-width:1100px) {.header-inner {gap:18px!important}.site-nav {gap:18px!important}}
@media(max-width:1000px) {.header-contact {display:none!important}.site-nav > a {white-space:nowrap}.header-inner {gap:12px!important}.site-nav {gap:14px!important}}
@media(max-width:850px) {.tools-header-inner{gap:16px}.tools-navigation{gap:16px}.tools-home{display:none}}
@media(max-width:600px) {
  .tools-header-inner {padding:12px 19px;flex-wrap:wrap;gap:10px;justify-content:space-between}
  .tools-navigation {width:100%;justify-content:space-between;margin:0}
  .freetools-dropdown {left:0;max-width:calc(100vw - 38px);min-width:230px}
  .tools-contact {padding:8px 12px}
}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(forced-colors:active) {:root {scrollbar-color:auto}button,a{forced-color-adjust:auto}}
@media print {
  .tools-header,.crumbs,.hero,.compact-hero,.input-panel,.input,.tool-head,.examples,.fine-print,.fine,.below,.seo-content,.faq,.footer,.data-strip,.result-actions,.actions,#tool-feedback,#print,#copy {display:none!important}
  .workspace {display:block!important;border:0!important}
  .output-panel,.output {padding:0!important;background:white!important}
  #result {display:block!important}
  #context {white-space:pre-wrap}
}

/* Shared product CTA, identical across both tool locales. */
.persona-page .boundary {margin-top:25px;padding:20px 22px;background:var(--navy);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:20px}
.persona-page .boundary p {margin:0;color:#C8D3D8;font-size:12px;line-height:1.7}
.persona-page .boundary strong {color:var(--gold)}
.persona-page .boundary a {padding:10px 13px;background:var(--gold);color:var(--navy);font-size:11px;font-weight:800;white-space:nowrap}
@media(max-width:600px){.persona-page .boundary{align-items:flex-start;flex-direction:column}}
.persona-page .hero-note::before {content:none}

.site-nav .freetools-dropdown a,.freetools-dropdown a {display:flex;align-items:center;justify-content:space-between;gap:14px}
.freetools-new-tab {flex-shrink:0;color:var(--muted)}
