/* AsylumTracker site chrome (2026-09): tokens, header, footer, buttons and
   store badges shared by the homepage and every generated page. */
:root{
  --ink:#0c1d20;--ink-2:#34494c;--ink-3:#5f7275;--ink-4:#8a9a9c;
  --paper:#f7f6f2;--paper-2:#efede6;--card:#fff;--line:rgba(12,29,32,.09);--line-2:rgba(12,29,32,.16);
  --petrol:#0f4a4f;--petrol-2:#0a3539;--petrol-3:#07272a;--teal:#1b7a7b;--mint:#dff1ea;--mint-2:#bfe5d8;
  --amber:#f29d0b;--amber-2:#ffb938;--grant:#1fa971;--mid:#f29d0b;--deny:#e5484d;
  --night:#0a1516;--night-2:#101f21;
  --r-xl:36px;--r-lg:28px;--r-md:20px;--r-sm:14px;
  --shadow-lg:0 50px 90px -40px rgba(10,40,43,.45),0 24px 50px -28px rgba(10,40,43,.35);
  --shadow-md:0 22px 48px -26px rgba(10,40,43,.4),0 2px 6px rgba(10,40,43,.06);
  --shadow-sm:0 1px 2px rgba(12,29,32,.06),0 8px 24px -16px rgba(12,29,32,.25);
  --f-sans:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',system-ui,sans-serif;
  --f-serif:'Instrument Serif',Georgia,'Songti SC',serif;
  --f-mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:1200px;--gutter:clamp(20px,4vw,40px);
  --ease:cubic-bezier(.2,.7,.2,1);
}

:where(.site-nav,.site-footer,.site-cta) a{color:inherit;text-decoration:none}
:where(.site-nav,.site-footer,.site-cta) img{display:block;max-width:100%;height:auto}
:where(.site-nav,.site-footer,.site-cta) :is(h2,h3,p){margin:0}
.site-nav,.site-footer,.site-cta{font-family:var(--f-sans);-webkit-font-smoothing:antialiased;color:var(--ink)}
.site-nav *,.site-footer *,.site-cta *{box-sizing:border-box}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px}
.skip:focus{top:12px}
body :focus-visible{outline:2.5px solid var(--teal);outline-offset:3px;border-radius:8px}
/* Buttons */
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 24px;border-radius:999px;font-weight:600;font-size:16px;letter-spacing:-.01em;border:0;cursor:pointer;white-space:nowrap;transition:transform .2s var(--ease),background .2s,box-shadow .2s}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn:active{transform:scale(.98)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-dark{background:var(--ink);color:#fff;box-shadow:0 10px 24px -12px rgba(12,29,32,.6)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-dark:hover{background:#18302f}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-light{background:#fff;color:var(--ink)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-light:hover{background:var(--mint)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-2)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .btn-sm{height:40px;padding:0 18px;font-size:14.5px}
:is(.app-home,.site-nav,.site-cta,.spread-card) .text-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--petrol)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .text-link svg{width:16px;height:16px;transition:transform .2s var(--ease)}
:is(.app-home,.site-nav,.site-cta,.spread-card) .text-link:hover svg{transform:translateX(3px)}

/* Store buttons */
.stores{display:flex;gap:12px;flex-wrap:wrap}
.store{display:inline-flex;align-items:center;gap:11px;height:56px;padding:0 20px 0 16px;border-radius:14px;background:#000;color:#fff;transition:transform .2s var(--ease),box-shadow .2s;box-shadow:0 12px 26px -16px rgba(0,0,0,.7)}
.store:hover{transform:translateY(-2px)}
.store svg{width:26px;height:26px;flex:none}
.store span{display:flex;flex-direction:column;line-height:1.05}
.store small{font-size:11px;font-weight:500;opacity:.85;letter-spacing:.01em}
.store strong{font-size:20px;font-weight:600;letter-spacing:-.02em;margin-top:2px}
.stores.small .store{height:44px;padding:0 14px 0 12px;border-radius:11px}
.stores.small .store svg{width:20px;height:20px}
.stores.small .store strong{font-size:16px}
.stores.small .store small{font-size:9.5px}
.stores.on-dark .store{background:#fff;color:#000;box-shadow:none}

/* Nav */
.site-nav{position:sticky;top:0;z-index:50;background:rgba(247,246,242,.78);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border-bottom:1px solid transparent;transition:border-color .2s,background .2s}
.site-nav.scrolled{border-bottom-color:var(--line)}
.site-nav .nav-row{display:flex;align-items:center;gap:28px;height:68px}
.site-nav .brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.025em}
.site-nav .brand img{border-radius:8px}
.site-nav .nav-links{display:flex;gap:26px;margin-inline-start:10px}
.site-nav .nav-links a{font-size:15px;font-weight:500;color:var(--ink-2)}
.site-nav .nav-links a:hover{color:var(--ink)}
.site-nav .nav-actions{margin-inline-start:auto;display:flex;align-items:center;gap:10px}
.site-nav .lang-menu{position:relative}
.site-nav .lang-menu summary,.site-nav .menu summary{list-style:none;cursor:pointer}
.site-nav .lang-menu summary::-webkit-details-marker,.site-nav .menu summary::-webkit-details-marker{display:none}
.site-nav .lang-menu summary{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 13px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink-2)}
.site-nav .lang-menu summary:hover{background:rgba(12,29,32,.05)}
.site-nav .lang-menu summary svg{width:17px;height:17px}
.site-nav .lang-list{position:absolute;inset-inline-end:0;top:48px;min-width:190px;background:#fff;border-radius:16px;box-shadow:var(--shadow-md);border:1px solid var(--line);padding:8px;display:grid}
.site-nav .lang-list a{padding:9px 12px;border-radius:10px;font-size:14.5px;color:var(--ink-2)}
.site-nav .lang-list a:hover{background:var(--paper)}
.site-nav .lang-list a[aria-current]{color:var(--ink);font-weight:650;background:var(--mint)}
.site-nav .menu{display:none}
.site-nav .menu summary{width:40px;height:40px;border-radius:12px;display:grid;place-content:center;gap:5px}
.site-nav .menu summary span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s}
.site-nav .menu[open] summary span:first-child{transform:translateY(3.5px) rotate(45deg)}
.site-nav .menu[open] summary span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.site-nav .menu-panel{position:fixed;left:0;right:0;top:68px;background:var(--paper);border-bottom:1px solid var(--line);padding:12px var(--gutter) 22px;display:grid;box-shadow:0 30px 40px -30px rgba(0,0,0,.3)}
.site-nav .menu-panel>a{padding:14px 2px;font-size:18px;font-weight:600;border-bottom:1px solid var(--line)}
.site-nav .menu-langs{display:flex;flex-wrap:wrap;gap:8px;padding-top:16px}
.site-nav .menu-langs a{font-size:13.5px;padding:6px 11px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--ink-2)}
.site-nav .menu-langs a[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Footer */
.site-footer{border-top:1px solid var(--line);padding:64px 0 40px;background:var(--paper)}
.site-footer .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.site-footer .footer-brand p{margin-top:16px;font-size:13.5px;color:var(--ink-3);max-width:360px}
.site-footer .footer-brand .stores{margin-top:20px}
.site-footer .footer-grid h3{font-size:13px;font-weight:650;color:var(--ink);margin-bottom:14px}
.site-footer .footer-grid div>a:not(.brand):not(.store){display:block;font-size:14.5px;color:var(--ink-3);padding:5px 0}
.site-footer .footer-grid div>a:not(.brand):not(.store):hover{color:var(--ink)}
.site-footer .footer-bottom{margin-top:52px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--ink-4)}
.site-footer .footer-langs{display:flex;flex-wrap:wrap;gap:4px 14px}
.site-footer .footer-langs a{color:var(--ink-3)}
.site-footer .footer-langs a[aria-current]{color:var(--ink);font-weight:650}


.site-footer .brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.025em}
.site-footer .brand img{border-radius:8px}

/* Download card used at the end of generated pages */
.site-cta{margin:40px 0 8px;border-radius:28px;padding:34px 34px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;color:#fff;background:radial-gradient(520px 300px at 90% 0%,rgba(127,209,192,.28),transparent 60%),linear-gradient(150deg,var(--petrol) 0%,var(--petrol-3) 90%)}
.site-cta h2{font-size:26px;line-height:1.15;letter-spacing:-.03em;font-weight:620;color:#fff}
.site-cta p{margin-top:8px;font-size:15px;color:#b9d3cf;max-width:520px}
.site-cta .stores.on-dark .store{background:#fff;color:#000}
.site-cta .cta-secondary{grid-column:1/-1;font-size:13.5px;color:#9fe3d3;text-decoration:underline;text-underline-offset:3px}
@media (max-width:1100px){.site-nav .nav-links{gap:18px}}
@media (max-width:960px){
  .site-nav .nav-links{display:none}.site-nav .menu{display:block}.site-nav .lang-menu{display:none}
  .site-footer .footer-grid{grid-template-columns:1fr 1fr}.site-footer .footer-brand{grid-column:1/-1}
  .site-cta{grid-template-columns:1fr}
}
@media (max-width:640px){
  .site-nav .nav-row{height:60px;gap:12px}.site-nav .menu-panel{top:60px}.site-nav .brand span{font-size:17px}
  .site-nav .nav-actions .btn-sm{height:38px;padding:0 14px;font-size:14px}
  .site-footer .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .site-cta{padding:26px 22px;border-radius:24px}
  .site-cta .stores{flex-direction:column}.site-cta .stores .store{width:100%}
}

/* Sample-page zoom viewer (page-viewer.js) */
.cr-page,a[data-pv]{cursor:zoom-in}
.pv{position:fixed;inset:0;z-index:200;background:rgba(8,18,19,.9);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;grid-template-columns:72px minmax(0,1fr) 72px;grid-template-rows:auto minmax(0,1fr) auto;color:#fff}
.pv[hidden]{display:none}
.pv-bar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px 10px 24px}
.pv-title{margin:0;font-size:15px;font-weight:600;color:#e6efee;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-title b{display:inline-block;margin-right:10px;padding:2px 9px;border-radius:999px;background:#fff;color:#0c1d20;font-size:12.5px}
.pv-close{width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:28px;line-height:1;cursor:pointer}
.pv-close:hover{background:rgba(255,255,255,.22)}
.pv-stage{grid-row:2;grid-column:2;overflow:auto;display:flex;align-items:flex-start;justify-content:center;padding:4px 0 8px;overscroll-behavior:contain}
.pv-stage img{display:block;max-width:100%;max-height:100%;height:auto;width:auto;background:#fff;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.5);cursor:zoom-in;margin:auto}
.pv-stage.zoom{align-items:flex-start;justify-content:flex-start}
.pv-stage.zoom img{max-width:none;max-height:none;width:1224px;cursor:zoom-out;margin:0 auto}
.pv-nav{grid-row:2;align-self:center;justify-self:center;width:52px;height:52px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:34px;line-height:1;cursor:pointer}
.pv-nav:hover{background:rgba(255,255,255,.24)}
.pv-nav:disabled{opacity:.25;cursor:default}
.pv-prev{grid-column:1}.pv-next{grid-column:3}
.pv-foot{grid-column:1/-1;display:flex;justify-content:center;align-items:center;gap:22px;padding:10px 18px 18px;font-size:13.5px;color:#9fb3b1}
.pv-open{color:#9fe3d3;font-weight:650}
.pv-open:hover{color:#fff}
@media(max-width:700px){.pv{grid-template-columns:0 minmax(0,1fr) 0}.pv-nav{position:fixed;bottom:62px;width:46px;height:46px;background:rgba(255,255,255,.18)}.pv-prev{left:18px}.pv-next{right:18px}.pv-hint{display:none}.pv-stage{padding:0 10px 70px}}
.pv-nav[hidden]{display:none}
[dir=rtl] .pv-prev{grid-column:3}[dir=rtl] .pv-next{grid-column:1}
.pv-title b{margin-inline-end:10px}
