/* Q Techs - one design language for every page (main site, tools, simulator, planner, advisor, QES, QRES, PDF editor).
   Loaded LAST. One font family, one type scale, soft shadows, one focus style, no clipped controls. */
@font-face{font-family:"QSans";src:url(/assets/gs-regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"QSans";src:url(/assets/gs-medium.woff2)format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"QSans";src:url(/assets/gs-semibold.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"QSans";src:url(/assets/gs-bold.woff2)format("woff2");font-weight:700 900;font-style:normal;font-display:swap}

:root{
  --q-font:"QSans","Google Sans","Product Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-sans:var(--q-font);--font-mono:var(--q-font);--font-serif:var(--q-font);
  --q-r-ctl:12px;--q-r-card:20px;
  --q-shadow-1:0 1px 2px rgba(18,54,58,.06),0 6px 18px -10px rgba(18,54,58,.22);
  --q-shadow-2:0 2px 4px rgba(18,54,58,.06),0 16px 34px -16px rgba(18,54,58,.3);
  --q-focus:0 0 0 3px rgba(17,156,152,.28);
  --shadow:var(--q-shadow-1);--shadow-soft:var(--q-shadow-1);--shadow-lg:var(--q-shadow-2);--shadow-elevation:var(--q-shadow-1);
}
[data-theme=dark],:root[data-theme=dark],:root:not(.light-mode){--q-shadow-1:0 1px 2px rgba(0,0,0,.25),0 8px 22px -12px rgba(0,0,0,.55);--q-shadow-2:0 2px 4px rgba(0,0,0,.3),0 18px 36px -16px rgba(0,0,0,.65);--q-focus:0 0 0 3px rgba(79,214,207,.32)}

/* 1. ONE font everywhere (mono / serif / Outfit / Rubik / Jakarta all fold into it). Code-like boxes keep monospace. */
html,body,body :not(.logo-svg-container,.logo-svg-container *),body :not(.logo-svg-container,.logo-svg-container *)::before,body :not(.logo-svg-container,.logo-svg-container *)::after{font-family:var(--q-font)!important}
pre,code,kbd,samp,textarea.q-code,#drive-script{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important}
[class*="font-mono"],[class*="mono"],.qs-mono,.tl{font-variant-numeric:tabular-nums}
svg:not(.logo-svg-container svg) text{font-family:var(--q-font)!important}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-size:16px;line-height:1.55}

/* 2. One type scale: nothing below 11px, calm letter-spacing, no shouting wide-tracked labels */
[class*="text-[7px]"],[class*="text-[8px]"],[class*="text-[9px]"],[class*="text-[10px]"]{font-size:11px!important}
[class*="tracking-"],[class*="tracking-["]{letter-spacing:.03em!important}
.uppercase,[class*="uppercase"]{letter-spacing:.04em}
h1,h2,h3,h4{letter-spacing:-.01em;line-height:1.15}
h1{font-weight:800}h2{font-weight:700}h3,h4{font-weight:700}

/* 3. Soft elevation instead of the hard 'ledge' that looked like a second, masked shape under every card and button */
[class*="rounded-2xl"],[class*="rounded-3xl"],[class*="rounded-xl"][class*="border"],.card,.qf-glass,.qs-kpi,.qf-sheet,
div.rounded-2xl.border[class*="bg-white/90"],.light-mode div.rounded-2xl.border[class*="bg-white/90"]{box-shadow:var(--q-shadow-1)!important}
button[class*="bg-brand"],a[class*="bg-brand"],button[class*="bg-orange"],a[class*="bg-orange"],button[class*="bg-teal"],a[class*="bg-teal"],
button[class*="bg-gradient"],a[class*="bg-gradient"],.btn,.btn-primary,.btn-cta,.btn-secondary,.qs-play,.qf-seg button.on{box-shadow:0 1px 2px rgba(18,54,58,.18),0 4px 10px -4px rgba(18,54,58,.28)!important;transition:transform .12s,box-shadow .12s,background-color .12s}
button[class*="bg-brand"]:active,a[class*="bg-brand"]:active,button[class*="bg-orange"]:active,a[class*="bg-orange"]:active,button[class*="bg-teal"]:active,a[class*="bg-teal"]:active,
button[class*="bg-gradient"]:active,.btn:active,.qs-play:active{transform:translateY(1px);box-shadow:0 1px 1px rgba(18,54,58,.2)!important}
.qf-sc button,.qf-wx button,.qf-foot button,.qf-time .qf-now{box-shadow:none!important}

/* 4. Buttons and fields: whole label always visible, never cut by a parent, same radius */
button,.btn,[role=button]{line-height:1.2;white-space:normal;text-overflow:clip;overflow:visible;max-width:100%}
.qf-sc button,.qf-seg button,.qf-time button,.qf-tabs button,nav button,nav a,th,td button{white-space:nowrap}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),select,textarea{border-radius:var(--q-r-ctl)!important;line-height:1.35;min-height:42px;padding-top:.55rem;padding-bottom:.55rem;overflow:visible}
textarea{min-height:84px}
select{padding-right:2rem}

/* 5. One focus style: only for keyboard users, soft teal ring (replaces lime outline + browser default blue box) */
*:focus{outline:none}
input:focus,select:focus,textarea:focus{outline:none!important;box-shadow:var(--q-focus)!important;border-color:var(--q-sea-d,#119c98)!important}
button:focus-visible,a:focus-visible,[role=button]:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--q-sea-d,#119c98)!important;outline-offset:2px;border-radius:inherit}
button:focus:not(:focus-visible),a:focus:not(:focus-visible){outline:none!important}
::selection{background:rgba(52,185,179,.3);color:inherit}
*{-webkit-tap-highlight-color:transparent}

/* 6. Sticky bars never swallow content under them */
html{scroll-padding-top:84px}
img,video,canvas,svg{max-width:100%}

/* 7. Flow fixes */
.stamp{white-space:nowrap}
@media (max-width:760px){
  /* QES / sign-in: the form comes first, the marketing column becomes a slim header */
  .auth-hero{padding:1.1rem 1.25rem!important;min-height:0!important;gap:.5rem!important}
  .auth-hero h2{font-size:1.3rem!important;margin-bottom:0!important}
  .auth-hero p,.auth-hero .stamp,.auth-hero>div>div:last-child:not(:first-child),.auth-hero>div+div{display:none!important}
  .auth-hero>div>div:nth-child(1){margin-bottom:.6rem!important}
  .auth-hero [style*="flex-direction: column; gap: 0.75rem"]{display:none!important}
}
