/* Aysha's Global tool-page skin (v13): shared nav and footer over each tool's own styles */
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:#e9b949;color:#1b1606;padding:10px 16px;border-radius:10px;font-weight:700;text-decoration:none}.skip:focus{top:12px}
:root{--bg:#f4f3ee;--line:#e2e0d6;--deep-3:#0a2f37;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;--ease:cubic-bezier(.2,.7,.2,1)}
/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,58,68,.94);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);color:var(--on-deep);border-bottom:1px solid rgba(255,255,255,.07)}
.nav>.wrap{display:flex;align-items:center;gap:28px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 19px/1 var(--display);letter-spacing:-.01em;color:#fff;white-space:nowrap}
.brand .mk{width:32px;height:32px;border-radius:9px;background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font:800 13px var(--display);letter-spacing:.02em}
.nav ul{display:flex;gap:4px;list-style:none;margin:0 0 0 auto;padding:0}
.nav ul a{display:block;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600;font-size:15px;color:var(--on-deep-muted);transition:color .2s,background .2s}
.nav ul a:hover,.nav ul a[aria-current]{color:#fff;background:rgba(255,255,255,.08)}
.nav .btn{min-height:44px;padding:0 18px;font-size:15px}
.nav details{display:none;margin-left:auto}
.nav summary{list-style:none;cursor:pointer;min-height:44px;padding:0 16px;border-radius:12px;border:1.5px solid rgba(255,255,255,.25);display:flex;align-items:center;font-weight:700;font-size:15px}
.nav summary::-webkit-details-marker{display:none}
.nav details[open] .menu{display:grid}
.nav .menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--deep);padding:12px 16px 20px;gap:4px;border-bottom:1px solid rgba(255,255,255,.1)}
.nav .menu a{padding:14px 12px;border-radius:12px;text-decoration:none;font-weight:600;font-size:17px;color:#fff}
.nav .menu a:hover{background:rgba(255,255,255,.08)}
@media (max-width:900px){.nav ul,.nav .nav-cta{display:none}.nav details{display:block}}
html[dir="rtl"] .nav ul{margin:0 auto 0 0}html[dir="rtl"] .nav details{margin:0 auto 0 0}


.nav .btn{min-height:44px;padding:0 18px;font-size:15px;border-radius:14px;background:#e9b949;color:#1b1606;box-shadow:0 14px 30px -14px rgba(233,185,73,.8)}
.nav .btn:hover{background:#f0c75f}
/* footer */
.foot{background:var(--deep-3);color:var(--on-deep-muted);padding:64px 0 36px;font-size:15px}
.foot .cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
@media (max-width:820px){.foot .cols{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.foot .cols{grid-template-columns:1fr}}
.foot h4{margin:0 0 12px;color:#fff;font:700 14px var(--body)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot a{color:var(--on-deep-muted);text-decoration:none;display:inline-block;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 85%/0 1px no-repeat;transition:background-size .3s var(--ease),color .2s}
.foot a:hover{color:#fff;background-size:100% 1px}
.foot .about{max-width:34ch;margin:14px 0 0}
.foot .base{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}


.foot .brand{display:flex;padding:0;background:none}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 19px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.01em;color:#fff;white-space:nowrap}
.brand .mk{width:32px;height:32px;border-radius:9px;background:#e9b949;color:#1b1606;display:grid;place-items:center;font:800 13px "Bricolage Grotesque",sans-serif}
/* tool hero polish */
.hero{position:relative;overflow:hidden;padding:clamp(36px,6vh,64px) 0 clamp(48px,7vh,72px)!important}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 500px at 85% 0%,rgba(233,185,73,.12),transparent 60%),radial-gradient(700px 600px at 0% 100%,rgba(14,79,92,.9),transparent 70%);pointer-events:none}
.hero .wrap{position:relative}
.hero h1{font-size:clamp(34px,5vw,60px)!important;line-height:1.03!important;letter-spacing:-.03em!important}
.crumbs{font-size:14px;color:#a9c6ca;margin-bottom:14px}.crumbs a{color:#a9c6ca;text-decoration:none}.crumbs a:hover{color:#fff;text-decoration:underline}
.panel{border-radius:20px!important}
.doc{border-radius:6px!important;box-shadow:0 1px 0 rgba(15,35,40,.04),0 30px 60px -28px rgba(11,58,68,.35),0 12px 24px -16px rgba(11,58,68,.25);background:#fffdf8!important}
@media print{.nav,.foot,.skip{display:none!important}.doc{box-shadow:none!important;background:#fff!important}}