/* PixnPage brand layer: palette, typography, shared header/footer/nav and home layout.
   Loaded last on every page so it restyles existing markup without touching tool logic. */
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/poppins-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/poppins-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:600 700;font-display:swap;src:url(/fonts/poppins-devanagari-700-normal.woff2) format('woff2');unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09}

:root{
  --deep:#26166F;--indigo:#4F46E5;--lilac:#C4B5FD;--pearl:#F8F7FF;--inkc:#172033;--violet:#6C4CF1;
  --bg:#F8F7FF;--ink:#172033;--muted:#596079;--line:#E3DDFB;--soft:#EFECFF;--paper:#FFFFFF;--accent:#4F46E5;--drop:#C4B5FD;
  --card:#FFFFFF;--card-2:#FBFAFF;--field:#FFFFFF;--field-line:#D9D2F7;--link:#4338CA;
  --shadow:0 1px 2px rgba(38,22,111,.05),0 6px 20px rgba(38,22,111,.06);
  --shadow-hover:0 2px 4px rgba(38,22,111,.06),0 12px 28px rgba(38,22,111,.11);
  --focus:#7C6CF6;
  --font-head:Poppins,ui-rounded,"SF Pro Rounded","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;
  --font-body:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari","Helvetica Neue",Arial,sans-serif;
  --pink:#DB2777;--pink-bg:#FDE7F2;--cyan:#0E87A8;--cyan-bg:#D9F6FC;--mint:#0A8F6A;--mint-bg:#D8F6EA;
  --orange:#D9560B;--orange-bg:#FFEBDA;--violet-i:#7C3AED;--violet-bg:#EEE7FF;--indigo-i:#4F46E5;--indigo-bg:#E4E6FF;
}
html[data-theme=dark]{
  --bg:#0F0B2E;--ink:#F3F1FF;--muted:#B8B2DB;--line:#2F2766;--soft:#221B55;--paper:#171245;--accent:#C4B5FD;--drop:#5B4FB5;
  --card:#171245;--card-2:#1C1650;--field:#120E38;--field-line:#3D338A;--link:#D5CBFF;
  --shadow:0 1px 2px rgba(0,0,0,.25),0 8px 24px rgba(0,0,0,.25);--shadow-hover:0 2px 4px rgba(0,0,0,.3),0 14px 30px rgba(0,0,0,.35);
  --focus:#C4B5FD;
  --pink:#F9A8D4;--pink-bg:rgba(249,168,212,.14);--cyan:#67E8F9;--cyan-bg:rgba(103,232,249,.12);--mint:#6EE7B7;--mint-bg:rgba(110,231,183,.12);
  --orange:#FDBA74;--orange-bg:rgba(253,186,116,.13);--violet-i:#C4B5FD;--violet-bg:rgba(196,181,253,.15);--indigo-i:#A5B4FC;--indigo-bg:rgba(165,180,252,.14);
  background:#0F0B2E;color:var(--ink);
}

/* Base */
html{background:var(--bg)}
body,html[data-theme=dark] body{font-family:var(--font-body);color:var(--ink);background:var(--bg) radial-gradient(1100px 520px at 88% -120px,rgba(196,181,253,.30),transparent 70%) no-repeat,var(--bg) radial-gradient(900px 480px at -10% -160px,rgba(79,70,229,.08),transparent 70%) no-repeat;-webkit-font-smoothing:antialiased}
html[data-theme=dark] body{background:var(--bg) radial-gradient(1100px 560px at 90% -140px,rgba(124,108,246,.26),transparent 70%) no-repeat,var(--bg) radial-gradient(900px 480px at -10% -160px,rgba(79,70,229,.18),transparent 70%) no-repeat}
:where(h1,h2,h3){font-family:var(--font-head)}
/* Documents, previews and templates keep their own typography. */
:where(.cv-sheet,.cv-mini,.cv-paper-stage,.designed-document,.design-mini,.print-document,#creator-preview,#writer-print,.canvas-shell,[class*="preview"],[id*="preview"]) :is(h1,h2,h3,h4){font-family:inherit}
a{color:inherit}
html[data-theme=dark] a{color:inherit}
:where(main) a:not([class]){color:var(--link)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.eyebrow{color:var(--indigo);letter-spacing:1.4px;font-weight:700}
html[data-theme=dark] .eyebrow{color:var(--lilac)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}

/* Header */
header.site-header{max-width:1240px;margin:0 auto;padding:14px 28px;display:flex;flex-wrap:nowrap;align-items:center;gap:18px!important;border-bottom:0;box-sizing:border-box}
.site-header .brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;flex:none;letter-spacing:0;font-size:inherit}
.brand-mark,.foot-mark{display:block;height:34px;width:auto;flex:none}
.foot-mark{height:26px}
.pnp-body{fill:url(#pnp-body)}
.pnp-fold{fill:url(#pnp-fold)}
.pnp-s1{stop-color:#3A25A0}.pnp-s2{stop-color:#26166F}.pnp-f1{stop-color:#E4DCFF}.pnp-f2{stop-color:#A897F6}
html[data-theme=dark] .pnp-body{fill:var(--lilac)}
html[data-theme=dark] .pnp-f1{stop-color:#FFFFFF}html[data-theme=dark] .pnp-f2{stop-color:#DCD3FF}
.wordmark{font:700 23px/1 var(--font-head);letter-spacing:-.6px;white-space:nowrap}
.wm-pixn{color:var(--inkc)}.wm-page{color:var(--indigo)}
html[data-theme=dark] .wm-pixn{color:#FFFFFF}html[data-theme=dark] .wm-page{color:var(--lilac)}
.site-header nav{display:flex;gap:4px;margin-left:auto;font-size:14px;order:0!important;width:auto!important}
.site-header nav a{padding:8px 12px;border-radius:10px;color:var(--ink);font-weight:500;text-decoration:none}
.site-header nav a:hover{background:var(--soft)}
html[data-theme=dark] .site-header nav a{color:var(--ink)}
.header-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.header-controls>*{margin-left:0!important}
.site-header :is(.theme-toggle,.language-toggle,.install-toggle),html[data-theme=dark] .site-header :is(.theme-toggle,.language-toggle,.install-toggle){display:inline-flex;align-items:center;gap:7px;height:40px;min-width:40px;padding:0 12px;box-sizing:border-box;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:600 13px/1 var(--font-body);cursor:pointer;box-shadow:0 1px 2px rgba(38,22,111,.05)}
.site-header :is(.theme-toggle,.language-toggle,.install-toggle):hover{border-color:var(--lilac);background:var(--card-2)}
.site-header .install-toggle,html[data-theme=dark] .site-header .install-toggle{background:var(--deep);border-color:var(--deep);color:#fff}
html[data-theme=dark] .site-header .install-toggle{background:var(--lilac);border-color:var(--lilac);color:#1B1150}
.site-header .install-toggle:hover{background:#34209A}
html[data-theme=dark] .site-header .install-toggle:hover{background:#D6CBFF}
.ctl-icon,.install-icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .i-sun{display:none}
html[data-theme=dark] .theme-toggle .i-sun{display:block}
html[data-theme=dark] .theme-toggle .i-moon{display:none}

/* Buttons, fields and surfaces shared by tool pages */
.primary,html[data-theme=dark] #language-dialog .primary{background:var(--indigo);color:#fff;border-radius:12px;font-weight:600;font-family:var(--font-body);box-shadow:0 1px 2px rgba(38,22,111,.12),0 6px 16px rgba(79,70,229,.22);text-decoration:none}
.primary:hover{background:#4338CA}
html[data-theme=dark] .primary,html[data-theme=dark] #language-dialog .primary{background:var(--lilac);color:#1B1150;box-shadow:none}
html[data-theme=dark] .primary:hover{background:#D6CBFF}
.secondary{background:var(--soft);color:var(--ink);border:1px solid var(--line);border-radius:12px;font-weight:600;text-decoration:none}
html[data-theme=dark] :is(.secondary,.theme-toggle,.language-toggle){background:var(--soft);color:var(--ink);border-color:var(--line)}
:is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]){border-color:var(--field-line)}
html[data-theme=dark] :is(input,textarea,select){background:var(--field);color:var(--ink);border-color:var(--field-line)}
html[data-theme=dark] :is(input,textarea)::placeholder{color:#958FBE}
html[data-theme=dark] :is(label,summary){color:var(--ink)}
.workbench,.taskguide article,.plain .helpitem,.usp-note{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.workbench{border-radius:22px}
html[data-theme=dark] :is(.workbench,.toolcard,.cv-form-panel,.cv-export-box,.cv-template,.design-gallery button){background:var(--card)!important;color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(.badge,.tooltag,.toolfilters button,.cv-preview-bar){background:var(--soft);color:#DCD5FF;border-color:var(--line)}
html[data-theme=dark] :is(.help,.lede,.breadcrumb,.toolcard p,.pixbenefits p,.plain p,.plain li){color:var(--muted)}
html[data-theme=dark] :is(.canvas-shell,.rewrite-preview,.cv-page-wrap){background:#1E1852;border-color:var(--line)}
html[data-theme=dark] :is(.result,.cv-entry-form){background:var(--soft);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .pagetile{background:var(--soft);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .cv-template[aria-pressed=true],html[data-theme=dark] .design-gallery button[aria-pressed=true]{border-color:var(--lilac);outline-color:var(--lilac)}
html[data-theme=dark] .cv-entry-head button{background:#2A2266;color:var(--ink);border-color:var(--field-line)}
html[data-theme=dark] .status.error{color:#FFB4C0}
.dropzone{border-color:var(--drop);background:var(--card-2)}
.dropzone.drag{background:var(--soft);border-color:var(--indigo)}
.dropicon{background:var(--soft);color:var(--indigo)}
html[data-theme=dark] .dropicon{color:var(--lilac)}
.result{background:var(--soft)}
.editsettings{background:var(--card-2);border:1px solid var(--line)}
html[data-theme=dark] .editsettings{background:var(--soft)}
html[data-theme=dark] .editsettings :is(input,select){background:var(--field)}
.documentnav a{background:var(--card);border-color:var(--line);border-radius:10px;font-size:12px}
.documentnav a:hover{background:var(--soft)}
.badge{background:var(--soft);color:var(--deep);border:0}
.breadcrumb a{color:var(--link)}
.pagehead h1,.plain h1{font-weight:700;letter-spacing:-1px;line-height:1.12}
.pagehead .lede{font-size:15px;color:var(--muted);max-width:640px}
main h2{font-weight:700;letter-spacing:-.4px}

/* Home: hero */
.home-hero{max-width:640px;padding:18px 0 6px}
.home-hero h1{font:700 58px/1.06 var(--font-head);letter-spacing:-2px;margin:10px 0 14px;color:var(--ink)}
.home-hero .h1-line,.home-hero .h1-accent{display:block}
.home-hero .h1-accent{color:var(--violet)}
html[data-theme=dark] .home-hero .h1-accent{color:var(--lilac)}
.home-sub{font-size:17px;line-height:1.6;color:var(--muted);margin:0 0 22px;max-width:500px}
.home-search{margin:0;position:relative}
.home-searchbox.toolsearch,html[data-theme=dark] .home-searchbox.toolsearch{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:10px;height:54px;padding:0 18px;border:1px solid var(--field-line);border-radius:999px;background:var(--card);color:var(--muted);box-shadow:var(--shadow)}
.home-searchbox:focus-within{border-color:var(--indigo);box-shadow:0 0 0 4px rgba(79,70,229,.15),var(--shadow)}
html[data-theme=dark] .home-searchbox:focus-within{border-color:var(--lilac);box-shadow:0 0 0 4px rgba(196,181,253,.18)}
.home-searchbox input,html[data-theme=dark] .home-searchbox input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:500 16px var(--font-body);padding:0}
.home-searchbox input::placeholder{color:#8A88A8}
.hero-matches{margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:var(--shadow)}
.hero-status{margin:2px 8px 6px;font-size:12px;color:var(--muted)}
.hero-matches ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.hero-matches ul a,.hero-more{display:block;padding:9px 10px;border-radius:10px;font-size:14px;font-weight:600;color:var(--ink);text-decoration:none}
.hero-matches ul a:hover,.hero-more:hover{background:var(--soft)}
.hero-more{color:var(--link);margin-top:2px}

/* Home: popular tools (always 3 columns) */
.popular{margin:26px 0 0}
.popular-title{font:700 13px/1 var(--font-head)!important;letter-spacing:.8px!important;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.popular-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.popular-grid>li{min-width:0;display:flex}
.pop-tile{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:18px 8px 16px;box-sizing:border-box;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);text-align:center;transition:transform .15s,box-shadow .15s,border-color .15s}
.pop-tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover);border-color:var(--lilac)}
.pop-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--tint);color:var(--tone);flex:none}
.pop-icon svg{width:30px;height:30px;display:block}
.pop-label{font:600 14px/1.25 var(--font-head);letter-spacing:-.1px;overflow-wrap:anywhere;max-width:100%}
.pop-pink{--tone:var(--pink);--tint:var(--pink-bg)}.pop-cyan{--tone:var(--cyan);--tint:var(--cyan-bg)}.pop-mint{--tone:var(--mint);--tint:var(--mint-bg)}
.pop-orange{--tone:var(--orange);--tint:var(--orange-bg)}.pop-violet{--tone:var(--violet-i);--tint:var(--violet-bg)}.pop-indigo{--tone:var(--indigo-i);--tint:var(--indigo-bg)}
.viewall{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-weight:600;font-size:14px;color:var(--link);text-decoration:none}
.viewall:hover{text-decoration:underline;text-underline-offset:3px}

/* Home: USP pills and privacy note */
.usp{margin:26px 0 44px}
.usp-pills{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.usp-pills li{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink);box-shadow:0 1px 2px rgba(38,22,111,.04)}
.usp-pills svg{flex:none}
.pill-free svg{color:var(--mint)}.pill-account svg{color:var(--pink)}.pill-device svg{color:var(--indigo-i)}
.usp-note,html[data-theme=dark] .usp-note{margin-top:14px;padding:14px 18px;border:1px solid var(--line);border-radius:16px;color:var(--muted);font-size:13px;box-shadow:none;background:var(--card-2)}
html[data-theme=dark] .usp-note{background:var(--card)}
.usp-note h3,.usp-note a,html[data-theme=dark] .usp-note :is(h3,a){color:var(--ink)}
.usp-note a{color:var(--link)}

/* Full tool catalog */
.catalog{scroll-margin-top:16px}
.catalog h2{font-weight:700}
.catalog .eyebrow{color:var(--indigo)}
.toolsearch,html[data-theme=dark] .toolsearch{background:var(--card);border-color:var(--field-line);border-radius:999px;color:var(--muted)}
.toolsearch input,html[data-theme=dark] .toolsearch input{color:var(--ink);font-size:14px;background:transparent;border:0}
.toolfilters button{border-color:var(--line);background:var(--card);color:var(--ink);font-weight:600;font-size:12px;cursor:pointer}
.toolfilters button[aria-pressed=true],html[data-theme=dark] .toolfilters button[aria-pressed=true]{background:var(--deep);border-color:var(--deep);color:#fff}
html[data-theme=dark] .toolfilters button[aria-pressed=true]{background:var(--lilac);border-color:var(--lilac);color:#1B1150}
.toolgrid{gap:14px}
.toolcard{background:var(--card);border-color:var(--line);border-radius:18px;box-shadow:var(--shadow)}
.toolcard:hover{box-shadow:var(--shadow-hover);border-color:var(--lilac)}
.toolcard h3{font-weight:600;color:var(--ink)}
.toolcard h3 span{color:var(--lilac)}
.tooltag{color:var(--muted);font-weight:600}
.toolicon,html[data-theme=dark] .toolicon{--tone:var(--indigo-i);--tint:var(--indigo-bg);background:var(--tint);color:var(--tone);border-radius:12px}
.toolcard:nth-child(6n+1) .toolicon,html[data-theme=dark] .toolcard:nth-child(6n+1) .toolicon{--tone:var(--pink);--tint:var(--pink-bg);background:var(--tint);color:var(--tone)}
.toolcard:nth-child(6n+2) .toolicon,html[data-theme=dark] .toolcard:nth-child(6n+2) .toolicon{--tone:var(--cyan);--tint:var(--cyan-bg);background:var(--tint);color:var(--tone)}
.toolcard:nth-child(6n+3) .toolicon,html[data-theme=dark] .toolcard:nth-child(6n+3) .toolicon{--tone:var(--mint);--tint:var(--mint-bg);background:var(--tint);color:var(--tone)}
.toolcard:nth-child(6n+4) .toolicon,html[data-theme=dark] .toolcard:nth-child(6n+4) .toolicon{--tone:var(--orange);--tint:var(--orange-bg);background:var(--tint);color:var(--tone)}
.toolcard:nth-child(6n+5) .toolicon,html[data-theme=dark] .toolcard:nth-child(6n+5) .toolicon{--tone:var(--violet-i);--tint:var(--violet-bg);background:var(--tint);color:var(--tone)}
.taskguide,.pixbenefits{border-color:var(--line)}
.taskguide article{border-radius:18px}
.taskguide h3 a{color:var(--link)}
.taskguide p{color:var(--muted)}
.pixbenefits span{color:var(--indigo);font-weight:700}
html[data-theme=dark] .pixbenefits span{color:var(--lilac)}
.pixbenefits h3{font-weight:600}

/* Help page */
.helppage .helpitem{border-radius:18px;padding:18px 20px;margin:14px 0}
.helppage .helpitem h2{font-size:19px;margin:0 0 8px}
.helppage .helpitem p{margin:0 0 8px;line-height:1.7}
.helppage .helpitem ul{margin:0;padding-left:20px}

/* Footer */
footer{max-width:1240px;box-sizing:border-box;padding:26px 28px;margin:0 auto;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;font-size:12px;color:var(--muted)}
html[data-theme=dark] footer{border-color:var(--line)}
.footbrand{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.footbrand .wordmark{font-size:17px}
footer>span{flex:1 1 260px}
.footlinks{display:flex;flex-wrap:wrap;gap:8px 18px}
.footlinks a,html[data-theme=dark] .footlinks a{color:var(--ink);text-decoration:none;font-weight:500}
.footlinks a:hover{color:var(--link);text-decoration:underline}

/* Dialogs share the palette */
#language-dialog,.site-cookie-dialog,.cv-report-dialog,.cv-template-dialog{border-color:var(--line);border-radius:20px;background:var(--card);color:var(--ink)}
#language-dialog::backdrop,.site-cookie-dialog::backdrop,.cv-report-dialog::backdrop,.cv-template-dialog::backdrop{background:rgba(23,16,70,.55)}
#language-dialog select{border-color:var(--field-line);background:var(--card-2)}
#language-dialog .language-note{border-left-color:var(--lilac)}
#language-dialog p{color:var(--muted)}
.site-cookie-actions button{background:var(--soft);border-color:var(--indigo);color:var(--deep)}
.site-cookie-dialog a{color:var(--link)}
.cv-dialog-actions{background:var(--card)}
html[data-theme=dark] :is(#language-dialog,.site-cookie-dialog,.cv-report-dialog,.cv-template-dialog,.cv-dialog-actions){background:var(--card);color:var(--ink);border-color:var(--line)}
html[data-theme=dark] #language-dialog select{background:var(--field);color:var(--ink);border-color:var(--field-line)}
html[data-theme=dark] #language-dialog p{color:var(--muted)}
html[data-theme=dark] .site-cookie-actions button{background:var(--soft);color:var(--ink);border-color:var(--lilac)}
html[data-theme=dark] .site-cookie-dialog a{color:var(--link)}
html[data-theme=dark] :is(.fb-form,.cv-assistant){background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] :is(.fb-notice,.cv-ai-note,.cv-report-privacy){background:var(--field);color:var(--ink)}
html[data-theme=dark] :is(.fb-field label span,.fb-hint,.fb-mailnote,.feedback-intro p,.feedback-page .lede){color:var(--muted)}

/* Mobile bottom navigation (hidden on wide screens) */
.bottomnav{display:none}
@media (max-width:860px){
  .bottomnav{position:fixed;z-index:30;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:6px max(10px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:rgba(255,255,255,.94);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(38,22,111,.07);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
  html[data-theme=dark] .bottomnav{background:rgba(18,13,51,.94)}
  .bottomnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:48px;border-radius:14px;color:var(--muted);text-decoration:none;font:600 11.5px/1.1 var(--font-body)}
  .bottomnav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .bottomnav a[aria-current=page]{color:var(--indigo);background:var(--soft)}
  html[data-theme=dark] .bottomnav a[aria-current=page]{color:var(--lilac)}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
}

/* Desktop home: hero and popular tools side by side */
@media (min-width:980px){
  main:has(> .home-hero){display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:56px;align-items:start}
  main:has(> .home-hero) > :not(.home-hero):not(.popular){grid-column:1/-1}
  main:has(> .home-hero) > .home-hero{padding-top:36px}
  main:has(> .home-hero) > .popular{margin-top:40px}
}
@media (max-width:860px){
  header.site-header{padding:12px 16px;gap:10px!important}
  .site-header nav{display:none!important}
  .header-controls{margin-left:auto}
  main{padding-top:14px}
  footer{padding:22px 18px;margin:0}
}
@media (max-width:620px){
  .home-hero{padding-top:6px}
  .home-hero h1{font-size:clamp(31px,9vw,40px);letter-spacing:-1.1px;line-height:1.1;margin:4px 0 10px}
  .home-sub{font-size:15px;margin-bottom:16px}
  .home-searchbox.toolsearch{height:50px;margin-top:0}
  .popular{margin-top:20px}
  .popular-grid{gap:8px}
  .pop-tile{padding:13px 4px 11px;gap:8px;border-radius:16px}
  .pop-icon{width:48px;height:48px;border-radius:14px}
  .pop-icon svg{width:26px;height:26px}
  .pop-label{font-size:12.5px}
  .usp{margin:20px 0 34px}
  .usp-pills{gap:6px}
  .usp-pills li{padding:7px 11px;font-size:12px}
  .hero-matches ul{grid-template-columns:1fr}
  .pagehead h1,.plain h1{letter-spacing:-.6px}
}
@media (max-width:520px){
  .site-header .ctl-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .site-header :is(.theme-toggle,.language-toggle,.install-toggle),html[data-theme=dark] .site-header :is(.theme-toggle,.language-toggle,.install-toggle){padding:0;width:40px;justify-content:center}
  .header-controls{gap:6px}
  .brand-mark{height:30px}
  .wordmark{font-size:20px}
}
@media (max-width:350px){
  .wordmark{font-size:18px}
  .site-header :is(.theme-toggle,.language-toggle,.install-toggle),html[data-theme=dark] .site-header :is(.theme-toggle,.language-toggle,.install-toggle){width:36px;min-width:36px;height:36px}
}
@media (prefers-reduced-motion:reduce){.pop-tile,.toolcard{transition:none}.pop-tile:hover,.toolcard:hover{transform:none}}
@media print{.bottomnav,.header-controls{display:none!important}body{padding-bottom:0!important;background:#fff!important}}

/* Compact shared footer and catalog icons matched to popular tiles. */
footer{padding-top:18px;padding-bottom:18px;gap:10px 20px}
.toolcard .toolicon{width:58px;height:58px;border-radius:16px;flex:none}
.toolcard .toolicon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.toolcard .toolicon.pop-pink{--tone:var(--pink);--tint:var(--pink-bg)}
.toolcard .toolicon.pop-cyan{--tone:var(--cyan);--tint:var(--cyan-bg)}
.toolcard .toolicon.pop-mint{--tone:var(--mint);--tint:var(--mint-bg)}
.toolcard .toolicon.pop-orange{--tone:var(--orange);--tint:var(--orange-bg)}
.toolcard .toolicon.pop-violet{--tone:var(--violet-i);--tint:var(--violet-bg)}
.toolcard .toolicon.pop-indigo{--tone:var(--indigo-i);--tint:var(--indigo-bg)}
html[data-theme] .toolcard .toolicon.pop-pink{--tone:var(--pink);--tint:var(--pink-bg)}
html[data-theme] .toolcard .toolicon.pop-cyan{--tone:var(--cyan);--tint:var(--cyan-bg)}
html[data-theme] .toolcard .toolicon.pop-mint{--tone:var(--mint);--tint:var(--mint-bg)}
html[data-theme] .toolcard .toolicon.pop-orange{--tone:var(--orange);--tint:var(--orange-bg)}
html[data-theme] .toolcard .toolicon.pop-violet{--tone:var(--violet-i);--tint:var(--violet-bg)}
html[data-theme] .toolcard .toolicon.pop-indigo{--tone:var(--indigo-i);--tint:var(--indigo-bg)}
@media(max-width:860px){footer{align-items:flex-start;gap:10px;padding:16px 18px}footer>span{flex:0 0 auto;line-height:1.6}.footlinks{gap:8px 16px}main{padding-bottom:28px}}
@media(max-width:620px){.toolcard .toolicon{width:48px;height:48px;border-radius:14px}.toolcard .toolicon svg{width:26px;height:26px}}
