/* ifsc.shareyourgroup.com: this site's own look, loaded after the family stylesheet (owner, 2026-11-11: "assign unique theme for this subdomain").
   "Passbook": warm paper and bank blue in light mode, midnight navy and gold in dark mode; Fraunces headings, Hanken Grotesk text,
   Spline Sans Mono for codes. Only colours, lettering and a few shapes change: the page frame stays the family's. */
:root{
  --amber:#b45309;--teal:#1d3a8a;
  --bg:#f6f2e8;--surface:#fffdf8;--surface2:#efe8d8;--ink:#141d2b;--soft:#586172;--line:#ddd3bf;
  --accent:#1d3a8a;--accent-ink:#ffffff;--link:#1b3a94;--ok:#17703f;--bad:#b42318;--focus:#c2410c;--field:#ffffff;--field-line:#cbbfa6;
  --font:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-head:'Fraunces',Georgia,'Times New Roman',serif;--mono:'Spline Sans Mono',ui-monospace,Consolas,monospace;
  --rule:rgba(29,58,138,.07);--stamp:#b42318;
  --shadow:0 1px 2px rgba(60,45,10,.06),0 12px 28px -16px rgba(60,45,10,.28);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0a0f1e;--surface:#111a2e;--surface2:#19243f;--ink:#eef1f8;--soft:#9ba7c0;--line:#27345a;--accent:#f2b63c;--accent-ink:#1c1402;--link:#ffd47f;--ok:#62dfa2;--bad:#ff9aa2;--focus:#7dd3fc;--field:#0d1426;--field-line:#36456f;--teal:#f2b63c;--amber:#f2b63c;--rule:rgba(242,182,60,.06);--stamp:#ff9aa2;--shadow:0 1px 2px rgba(0,0,0,.5),0 12px 28px -14px rgba(0,0,0,.65);color-scheme:dark}}
:root[data-theme=dark]{--bg:#0a0f1e;--surface:#111a2e;--surface2:#19243f;--ink:#eef1f8;--soft:#9ba7c0;--line:#27345a;--accent:#f2b63c;--accent-ink:#1c1402;--link:#ffd47f;--ok:#62dfa2;--bad:#ff9aa2;--focus:#7dd3fc;--field:#0d1426;--field-line:#36456f;--teal:#f2b63c;--amber:#f2b63c;--rule:rgba(242,182,60,.06);--stamp:#ff9aa2;--shadow:0 1px 2px rgba(0,0,0,.5),0 12px 28px -14px rgba(0,0,0,.65);color-scheme:dark}

h1,h2,h3{letter-spacing:0;font-weight:700}
h1{font-weight:700}
/* header: a bank-counter stripe on top, the section name as a solid tab */
.hd{border-top:3px solid var(--accent)}
.brand i{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-family:var(--mono);font-weight:500;letter-spacing:.08em;border-radius:6px}
.nav a[aria-current]{background:var(--surface2);box-shadow:inset 0 -2px 0 var(--accent)}
/* hero: ruled like a passbook page */
.hero{background:repeating-linear-gradient(to bottom,transparent 0 31px,var(--rule) 31px 32px);padding-bottom:16px}
.hero h1{max-width:22ch}
.hero h1::after{content:"";display:block;width:64px;height:4px;border-radius:4px;background:var(--accent);margin-top:12px}
/* the code itself: printed like the strip at the foot of a cheque */
.big{display:inline-block;background:var(--surface2);border:1px dashed var(--field-line);border-radius:10px;padding:8px 14px;letter-spacing:.09em}
.result{border-width:1px;border-left-width:5px;box-shadow:var(--shadow)}
.tag{font-family:var(--mono);font-weight:500;border-radius:6px;letter-spacing:.03em}
.tag.no{color:var(--stamp);border-color:currentColor;text-decoration:none;text-transform:uppercase;background:transparent}
.tag.yes{border-color:currentColor;background:transparent}
.btn{border-radius:8px;font-weight:700}
.finder{border-top:3px solid var(--accent)}
td.mono,a.mono{font-weight:500}
th{font-family:var(--font);text-transform:uppercase;font-size:.78rem;letter-spacing:.06em;color:var(--soft)}
.note{border-left-color:var(--amber)}
.ask{font-family:var(--font-head);font-size:1.08rem;margin:.9em 0 .2em}

/* lists of banks and states: the name on top, the count or the new bank under it, so long names never run out of the card */
.grid a{flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;border-left:3px solid var(--line);border-radius:8px}
.grid a:hover{border-left-color:var(--accent)}
.grid a small{white-space:normal;overflow-wrap:anywhere}
.grid li{min-width:0}
.sponsor img{background:var(--surface2)}

/* footer, in the manner of shareyourgroup.com: logo, a line about the site, Follow us; then the copyright line and the credit */
.ft-brand{display:flex;gap:14px 28px;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;padding-top:26px}
.ft-brand .mk{height:38px;width:auto;display:block}.ft-brand .mk-d{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ft-brand .mk-l{display:none}:root:not([data-theme=light]) .ft-brand .mk-d{display:block}}
:root[data-theme=dark] .ft-brand .mk-l{display:none}:root[data-theme=dark] .ft-brand .mk-d{display:block}
.ft-brand p{margin:8px 0 0;color:var(--soft);max-width:46ch}
.ft-brand .follow{font-weight:700;color:var(--ink);font-size:.86rem;text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.socials a{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink)}
.socials a:hover{border-color:var(--accent);color:var(--accent)}
.socials svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ft-in{padding-top:18px}
.ft-end{align-items:center}
.ft-end a{color:inherit}

/* fixed advertisement places (ifsc.js). The box is named pk-place on purpose: ad blockers hide boxes named ad-something, and this box
   must stay visible, because a place that gets no ad shows a sponsor card instead. */
.pk-place{margin:0 auto;text-align:center;clear:both;min-width:0;min-height:1px;overflow:hidden}
.pk-place>small{display:none;color:var(--soft);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
/* the label and the room around a place appear only when something really arrived: an ad, or the sponsor card that stands in for it */
.pk-place:has(ins[data-ad-status=filled]){margin:28px auto;padding-top:6px;padding-bottom:6px}
.pk-place:has(ins[data-ad-status=filled])>small{display:block}
.pk-place:has(ins[data-ad-status=unfilled]) ins{display:none!important}
.pk-place.has-card{margin:28px auto;max-width:820px;text-align:left;overflow:visible}
.prose .pk-place{margin-left:0;margin-right:0}
.prose .pk-place.has-card{margin-left:auto;margin-right:auto}
.pk-place .sponsor b,.pk-place .sponsor span{color:var(--ink)}.pk-place .sponsor span span{color:var(--soft)}
@media print{.pk-place{display:none!important}}

/* logo: larger than the family's 30 px (owner: "logo size is a bit small") */
.brand .mk{height:44px}
.hd-in{min-height:68px}
@media (max-width:640px){.brand .mk{height:36px}}
@media (max-width:380px){.brand .mk{height:30px}}
.ft-brand .mk{height:50px}