* { box-sizing: border-box; }
html { overflow-x: clip; }
body {
margin: 0;
background: var(--ground);
color: var(--ink);
font: var(--fw-regular) var(--fs-16)/var(--lh-body) var(--font-body);
-webkit-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font-family: inherit; }
a { color: var(--link); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
.skip {
position: absolute; left: .6rem; top: 0; transform: translateY(-200%); z-index: 40;
background: var(--green-btn); color: #fff; text-decoration: none;
padding: .6rem 1rem; border-radius: 0 0 var(--radius) var(--radius);
font-weight: 600; transition: transform .12s ease;
}
.skip:focus { transform: none; }
.topbar {
display: flex; align-items: center; gap: var(--sp-3);
padding: 0 var(--sp-4); min-height: var(--header-h);
background: rgba(15, 29, 91, 0.92);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
position: sticky; top: 0; z-index: 20;
flex-wrap: wrap;
transition: background-color .2s ease, border-color .2s ease;
}
.brand {
display: inline-flex; align-items: center; gap: var(--sp-2);
font-weight: var(--fw-heavy); font-size: var(--fs-18); letter-spacing: -.02em;
color: #fff; text-decoration: none; min-height: var(--header-h);
white-space: nowrap;
transition: opacity .15s ease, transform .15s ease;
}
.brand:hover {
opacity: .95;
transform: translateY(-0.5px);
}
.brand::before {
content: ""; width: 1.75rem; height: 1.75rem; flex: none;
background: url("/logo-mark.svg?v=ebd4b19bbc") center / contain no-repeat;
}
.beta-tag {
display: inline-block; padding: 0 var(--sp-2); border-radius: var(--r-pill);
background: var(--green); color: var(--royal-deep);
font-size: var(--fs-14); font-weight: var(--fw-bold); line-height: 1.5;
letter-spacing: 0;
}
.brand .beta-tag { margin-left: var(--sp-1); }
@media (max-width: 47.99rem) {
.brand-name { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.brand .beta-tag { margin: 2px 0 0; }
}
.topbar nav { display: flex; gap: var(--sp-1); margin-left: auto; }
.topbar nav a {
color: var(--on-royal-muted); text-decoration: none; font-size: var(--fs-16);
font-weight: var(--fw-medium);
padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm);
min-height: var(--tap); display: inline-flex; align-items: center; white-space: nowrap;
transition: all .15s ease;
}
.topbar nav a:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.signout-form { display: contents; }
.signout-btn { font: inherit; background: none; border: 0; margin: 0; cursor: pointer; text-align: left; }
.topbar nav .signout-btn {
color: var(--on-royal-muted); font-size: var(--fs-16); font-weight: var(--fw-medium);
padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm);
min-height: var(--tap); align-items: center; white-space: nowrap;
}
.topbar nav .signout-btn:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.signout-ask { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-4); margin-top: var(--sp-4); }
.topbar nav a.on { color: #fff; font-weight: var(--fw-bold); background: rgba(255, 255, 255, .12); }
.topbar nav .drawer-you, .topbar nav .drawer-only { display: none; }
.top-tools { display: flex; align-items: center; gap: var(--sp-2); }
@media (min-width: 1280px) { .topbar nav + .top-tools { margin-left: var(--sp-2); } }
.forbiz {
color: var(--on-royal-muted); text-decoration: none;
font-weight: var(--fw-medium); font-size: var(--fs-16);
border-radius: var(--r-sm); padding: var(--sp-2) var(--sp-3);
white-space: nowrap; min-height: var(--tap); display: inline-flex; align-items: center;
}
.forbiz:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.topbar .acct { display: inline-flex; gap: var(--sp-1); align-items: center; }
.topbar .acct[hidden] { display: none; }
.acct-menu { position: relative; }
.acct-me {
display: inline-flex; align-items: center; gap: var(--sp-2); cursor: pointer;
color: #fff; text-decoration: none; font-weight: var(--fw-semi); font-size: var(--fs-16);
padding: var(--sp-1) var(--sp-3) var(--sp-1) var(--sp-1); border-radius: var(--r-pill);
min-height: var(--tap); list-style: none;
}
.acct-me::-webkit-details-marker { display: none; }
.acct-me:hover, .acct-menu[open] .acct-me { background: rgba(255, 255, 255, .12); }
.acct-pop {
position: absolute; right: 0; top: calc(100% + var(--sp-1)); z-index: 30;
min-width: 14rem; padding: var(--sp-1); display: grid;
background: var(--card); color: var(--ink); border: 1px solid var(--border);
border-radius: var(--r-md); box-shadow: var(--sh-3);
}
.acct-pop a {
display: flex; align-items: center; min-height: var(--tap); padding: var(--sp-2) var(--sp-3);
color: var(--ink); text-decoration: none; font-size: var(--fs-16); border-radius: var(--r-sm);
}
.acct-pop a:hover { background: var(--sunken); }
.acct-pop .signout-btn {
display: flex; align-items: center; width: 100%; min-height: var(--tap);
padding: var(--sp-2) var(--sp-3); font-size: var(--fs-16); text-decoration: none;
color: var(--muted); border-top: 1px solid var(--border); border-radius: 0; margin-top: var(--sp-1);
}
.acct-pop .signout-btn:hover { background: var(--sunken); }
.acct-me[aria-current="page"] .avatar { box-shadow: 0 0 0 2px #fff; }
.avatar {
width: 2rem; height: 2rem; border-radius: 50%; flex: none;
display: inline-flex; align-items: center; justify-content: center;
background: var(--green); color: var(--royal-deep);
font-weight: var(--fw-heavy); font-size: var(--fs-14);
}
.topbar .signin {
color: #fff; text-decoration: none; font-size: var(--fs-14);
font-weight: var(--fw-bold); padding: var(--sp-2) var(--sp-4); border-radius: var(--r-pill);
min-height: var(--tap); display: inline-flex; align-items: center;
background: var(--green-btn); border: 0;
box-shadow: 0 2px 10px rgba(4, 120, 87, 0.3);
transition: all .18s cubic-bezier(0.16, 1, 0.3, 1);
}
.topbar .signin:hover {
background: var(--green-btn-strong);
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(4, 120, 87, 0.45);
}
.themebtn {
width: 2.5rem; height: 2.5rem; border-radius: 50%; flex: none; cursor: pointer;
display: inline-flex; align-items: center; justify-content: center;
background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, .35);
}
.themebtn[hidden] { display: none; }
.themebtn:hover { background: rgba(255, 255, 255, .12); }
.themebtn .i-sun, .themebtn[data-mode="dark"] .i-moon { display: none; }
.themebtn[data-mode="dark"] .i-sun { display: block; }
.topbar a:focus-visible, .topbar button:focus-visible { outline-color: #fff; }
.menu { display: none; }
.topsearch-open {
height: 2.5rem; min-width: 2.5rem; border-radius: var(--r-pill); flex: none;
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
color: #fff; text-decoration: none; font-size: var(--fs-14); font-weight: var(--fw-semi);
border: 1.5px solid rgba(255, 255, 255, .35); padding: 0;
}
.topsearch-open:hover, body.search-open .topsearch-open { background: rgba(255, 255, 255, .12); }
.topsearch-word { display: none; }
@media (min-width: 48rem) {
.topsearch-open { padding: 0 var(--sp-3) 0 var(--sp-2); }
.topsearch-word { display: inline; }
}
.topsearch {
display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 21;
gap: var(--sp-2); padding: var(--sp-3) var(--sp-4);
background: var(--royal); border-top: 1px solid rgba(255, 255, 255, .16); box-shadow: var(--sh-3);
}
body.search-open .topsearch { display: flex; }
.topsearch input {
flex: 1; min-width: 0; min-height: var(--tap); font: inherit; font-size: var(--fs-16);
padding: 0 var(--sp-3); border-radius: var(--r-sm); border: 1px solid var(--border);
background: var(--card); color: var(--ink);
}
.topsearch button {
min-height: var(--tap); padding: 0 var(--sp-4); border: 0; border-radius: var(--r-sm);
font: inherit; font-weight: var(--fw-bold); cursor: pointer;
background: var(--green-btn); color: #fff;
}
.topsearch button:hover { background: var(--green-btn-strong); }
@media (min-width: 48rem) {
.topsearch { padding-left: max(var(--sp-4), calc(50% - 22rem)); padding-right: max(var(--sp-4), calc(50% - 22rem)); }
}
@media (max-width: 1279px) {
.menu {
display: inline-flex; align-items: center; gap: var(--sp-2);
background: none; border: 1.5px solid rgba(255, 255, 255, .35); border-radius: var(--r-pill);
padding: 0 var(--sp-3); font: inherit; font-size: var(--fs-14);
font-weight: var(--fw-semi); color: #fff; cursor: pointer; min-height: var(--tap);
}
.menu:hover { background: rgba(255, 255, 255, .12); }
.menu .bars {
width: 1rem; height: .68rem; flex: none; position: relative;
border-top: 2px solid currentColor; border-bottom: 2px solid currentColor;
}
.menu .bars::after {
content: ""; position: absolute; left: 0; right: 0; top: 50%;
margin-top: -1px; border-top: 2px solid currentColor;
}
.top-tools { margin-left: auto; }
.topbar nav {
display: none; position: absolute; top: 100%; left: 0; right: 0;
margin: 0; padding: var(--sp-1) var(--sp-4) var(--sp-3); flex-direction: column;
gap: 0; background: var(--royal); border-top: 1px solid rgba(255, 255, 255, .16);
box-shadow: var(--sh-3); max-height: calc(100vh - var(--header-h)); overflow: auto;
}
body.nav-open .topbar nav, .topbar nav:target { display: flex; }
body.nav-open::before {
content: ""; position: fixed; inset: 0; z-index: 19; background: var(--scrim);
}
.menu { text-decoration: none; }
.menu-close { display: none; }
body.nav-open .menu-word { display: none; }
body.nav-open .menu-close { display: inline; }
body.nav-open .menu .bars { border-color: transparent; }
body.nav-open .menu .bars::after { transform: rotate(45deg); }
body.nav-open .menu .bars::before {
content: ""; position: absolute; left: 0; right: 0; top: 50%;
margin-top: -1px; border-top: 2px solid currentColor; transform: rotate(-45deg);
}
.topbar nav a, .topbar nav .signout-btn {
padding: var(--sp-3) var(--sp-2); border-bottom: 1px solid rgba(255, 255, 255, .1);
font-size: var(--fs-16); border-radius: 0; min-height: var(--tap);
display: flex; align-items: center;
}
.topbar nav a.on { background: none; box-shadow: inset 3px 0 0 var(--green); padding-left: var(--sp-4); }
.topbar nav .drawer-you, .topbar nav .drawer-only { display: flex; color: #fff; font-weight: var(--fw-semi); }
.forbiz, .acct-name { display: none; }
.acct-me { padding: var(--sp-1); }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
.brand { font-size: var(--fs-16); font-weight: var(--fw-bold); }
.brand::before { width: 1.75rem; height: 1.75rem; }
}
@media (min-width: 1280px) and (max-width: 1379px) {
.forbiz { display: none; }
.acct-name { display: none; }
.acct-me { padding: var(--sp-1); }
.topbar nav a { padding: var(--sp-2); }
}
@media (max-width: 430px) {
.menu-word, body.nav-open .menu-close { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.menu { width: 2.75rem; padding: 0; justify-content: center; }
.top-tools { gap: var(--sp-1); }
}
@media (max-width: 430px) { .topbar .themebtn { display: none; } }
@media (max-width: 380px) {
.topbar { padding: 0 var(--sp-3); gap: var(--sp-2); }
.brand { font-size: var(--fs-16); }
:root { --gutter: var(--sp-3); }
.hero-copy { padding-left: var(--sp-3); padding-right: var(--sp-3); }
}
main { max-width: var(--measure); margin: 0 auto; padding: var(--sp-5) var(--gutter) var(--sp-7); }
@media (min-width: 48rem) { :root { --gutter: var(--sp-5); } }
main [id] { scroll-margin-top: 4.75rem; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: var(--fw-bold); text-wrap: balance; }
h1 { font-size: clamp(var(--fs-28), 1.2rem + 1.6vw, var(--fs-36)); line-height: var(--lh-tight); letter-spacing: -.02em; margin: var(--sp-1) 0 var(--sp-3); }
h2 { font-size: var(--fs-22); line-height: var(--lh-snug); margin: var(--sp-7) 0 var(--sp-3); letter-spacing: -.01em; }
h3 { font-size: var(--fs-18); margin: 0 0 var(--sp-1); line-height: var(--lh-snug); letter-spacing: -.005em; }
h4 { font-size: var(--fs-16); margin: 0 0 var(--sp-1); line-height: var(--lh-snug); }
.tag, .facts dt, .half h4, .facts-list dt, .day span, .req,
.stand .opennow, .stand .closeness .mark, .num span.label {
font-family: var(--font-mono); font-variant-numeric: tabular-nums;
}
p { margin: 0 0 .9rem; }
.lede { font-size: var(--fs-18); line-height: 1.55; color: var(--muted); }
.sub { color: var(--muted); font-size: var(--fs-16); margin-top: -.2rem; }
.note {
margin-top: 2rem; padding: .95rem 1.05rem; background: var(--sunken);
border-radius: var(--radius); color: var(--muted); font-size: var(--fs-16);
}
.hero { position: relative;
background: radial-gradient(circle at 85% 30%, rgba(16, 185, 129, 0.12) 0%, transparent 50%),
radial-gradient(circle at 15% 15%, rgba(30, 45, 125, 0.45) 0%, transparent 60%),
var(--navy-deep);
color: var(--offwhite); overflow: hidden;
margin-top: calc(-1 * var(--sp-5)); margin-bottom: 2.5rem;
margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.hero-in { max-width: var(--measure-wide); margin: 0 auto; padding: var(--sp-6) var(--gutter) var(--sp-7); display: grid; grid-template-columns: 1fr; gap: var(--sp-6); align-items: center; }
@media (min-width: 820px) { .hero-in { grid-template-columns: 1fr 1fr; gap: var(--sp-7); padding: var(--sp-8) var(--sp-6); } }
.hero-copy { padding: 2.6rem 1.1rem; }
.hero-in .hero-copy {
padding: var(--sp-6);
background: rgba(15, 29, 91, 0.65);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: var(--r-xl);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
box-shadow: 0 20px 48px -10px rgba(0, 0, 0, 0.45);
}
@media (max-width: 819px) { .hero-in .hero-copy { padding: var(--sp-5) var(--sp-4); } }
.hero .eyebrow {
display: inline-flex; align-items: center; gap: var(--sp-2);
font-weight: var(--fw-semi); font-size: var(--fs-14); color: #E6FBF2;
background: rgba(16, 185, 129, 0.16); border: 1px solid rgba(16, 185, 129, 0.36);
border-radius: var(--r-pill);
padding: var(--sp-1) var(--sp-3); margin: 0 0 var(--sp-4);
box-shadow: 0 0 14px rgba(16, 185, 129, 0.18);
}
.hero .eyebrow::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); }
.hero-in h1 { font-weight: var(--fw-heavy); font-size: clamp(var(--fs-36), 1.5rem + 3.4vw, 3.5rem); line-height: 1.05; letter-spacing: -.03em; color: #fff; margin: 0 0 var(--sp-4); max-width: 15ch; }
.hero-in h1 .hl { color: var(--green); }
.hero .lede { color: var(--on-royal-muted); max-width: 44ch; font-size: var(--fs-18); margin: 0 0 var(--sp-5); }
.hero-go { display: grid; gap: var(--sp-2); justify-items: start; margin: 0 0 var(--sp-5); }
.cta.cta-big {
font-size: var(--fs-18); padding: var(--sp-4) var(--sp-6); border-radius: var(--r-pill);
box-shadow: 0 4px 16px rgba(4, 120, 87, 0.35), 0 0 24px rgba(16, 185, 129, 0.2);
transition: transform .18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .18s cubic-bezier(0.16, 1, 0.3, 1), background-color .18s ease;
}
.cta.cta-big:hover {
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(4, 120, 87, 0.45), 0 0 32px rgba(16, 185, 129, 0.3);
}
:root.themeable[data-theme="dark"] .cta.cta-big:hover {
box-shadow: 0 8px 26px rgba(16, 185, 129, 0.5), 0 0 36px rgba(16, 185, 129, 0.35);
}
.hero-note { margin: 0; color: var(--on-royal-muted); font-size: var(--fs-16); }
.hero-alt { color: #fff; font-weight: var(--fw-semi); text-decoration: none; min-height: var(--tap); display: inline-flex; align-items: center; }
.hero-alt:hover { text-decoration: underline; }
.hero-search { display: grid; gap: var(--sp-1); width: 100%; max-width: 30rem; margin-top: var(--sp-2); }
.hero-search label { color: var(--on-royal-muted); font-size: var(--fs-14); font-weight: var(--fw-semi); }
.hero-search-row { display: flex; gap: var(--sp-2); }
.hero-search input {
flex: 1; min-width: 0; min-height: var(--tap); font: inherit; font-size: var(--fs-16);
padding: 0 var(--sp-3); border-radius: var(--r-pill); border: 1px solid rgba(255, 255, 255, .35);
background: #fff; color: #10204f;
}
.hero-search button {
min-height: var(--tap); padding: 0 var(--sp-4); border-radius: var(--r-pill); cursor: pointer;
font: inherit; font-weight: var(--fw-bold); color: #fff;
background: transparent; border: 1.5px solid rgba(255, 255, 255, .6);
}
.hero-search button:hover { background: rgba(255, 255, 255, .12); }
@media (max-width: 540px) {
.hero-go { justify-items: stretch; }
.cta.cta-big { text-align: center; }
.hero-note, .hero-alt { justify-self: center; text-align: center; }
}
.trust { list-style: none; margin: 0; padding: var(--sp-4) 0 0; display: grid; gap: var(--sp-3); border-top: 1px solid rgba(255, 255, 255, .16); max-width: 34rem; }
.trust li { display: flex; gap: var(--sp-3); align-items: flex-start; color: var(--on-royal-muted); font-size: var(--fs-16); line-height: 1.45; }
.trust svg { flex: none; color: var(--green); margin-top: .1rem; }
.trust a { color: #fff; }
.steps-band { margin: var(--sp-7) 0 0; }
.steps-band h2 { margin: 0 0 var(--sp-4); }
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); grid-template-columns: 1fr; }
@media (min-width: 48rem) { .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); } }
.steps li {
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-xl);
padding: var(--sp-5); box-shadow: var(--sh-1);
transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.steps li:hover {
border-color: var(--border-strong); box-shadow: var(--sh-2); transform: translateY(-2px);
}
.step-n {
display: inline-flex; align-items: center; justify-content: center;
width: 2.5rem; height: 2.5rem; border-radius: 50%;
background: var(--royal-tint); color: var(--emph); font-weight: var(--fw-heavy);
font-size: var(--fs-18); margin-bottom: var(--sp-3);
box-shadow: inset 0 0 0 1px rgba(15, 29, 91, 0.12);
}
.steps h3 { margin: 0 0 var(--sp-1); font-weight: var(--fw-bold); font-size: var(--fs-18); }
.steps p { margin: 0; color: var(--muted); font-size: var(--fs-16); line-height: 1.5; }
.steps-go { margin: var(--sp-5) 0 0; text-align: center; }
.steps-go .cta {
box-shadow: var(--green-glow);
transition: transform .15s ease, box-shadow .15s ease;
}
.steps-go .cta:hover { transform: translateY(-2px); }
@media (max-width: 47.99rem) {
.steps li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: var(--sp-3); padding: var(--sp-4); }
.step-n { grid-row: span 2; margin: 0; }
.steps-go .cta { display: block; text-align: center; }
}
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.8rem; }
.chip { display: inline-flex; align-items: center; gap: .45rem; color: #EAEEFF; border: 1px solid rgba(255,255,255,.28); border-radius: var(--radius-pill); padding: .4rem .95rem; font-size: var(--text-small); }
.chip b { font-family: var(--font-display); font-weight: 700; color: #fff; }
.ctas { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.3rem; }
.cta {
display: inline-block; background: var(--green-btn); color: #fff; font-weight: var(--fw-bold);
font-size: var(--fs-16); line-height: 1.3; text-decoration: none; padding: var(--sp-3) var(--sp-5);
min-height: var(--tap); border-radius: var(--r-md); border: 0; cursor: pointer;
transition: transform .18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .18s cubic-bezier(0.16, 1, 0.3, 1), background-color .18s ease;
}
.cta:hover {
background: var(--green-btn-strong);
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(4, 120, 87, 0.35);
}
.cta:active { transform: translateY(0); }
.cta:disabled, .cta:disabled:hover { background: var(--muted); color: var(--card); cursor: default; }
.cta.ghost { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.5); }
.cta.ghost:hover { background: rgba(255,255,255,.12); }
.stage { position: relative; justify-self: center; width: 100%; max-width: 36rem; aspect-ratio: 100 / 112.13; container-type: inline-size;
filter: drop-shadow(0 14px 34px rgba(0, 0, 0, 0.35)); }
@media (max-width: 819px) { .stage { order: -1; max-width: 26rem; margin-bottom: var(--sp-6); } }
.continent { position: absolute; inset: 0; background: var(--royal-deep); overflow: hidden;
-webkit-mask: url("/africa-mask.svg?v=8ee9b9bd95") center / 100% 100% no-repeat;
mask: url("/africa-mask.svg?v=8ee9b9bd95") center / 100% 100% no-repeat; }
.flagwall { position: absolute; top: -18px; left: 0; height: calc(100% + 36px); display: grid; grid-auto-flow: column; grid-template-rows: repeat(12, 1fr); grid-auto-columns: 3.4rem; grid-auto-columns: calc((112.13cqw + 36px) / 12 * 4 / 3); animation: flagslide 40s linear infinite; will-change: transform; }
.fw { width: 100%; height: 100%; background-size: cover; background-position: center; border: .5px solid rgba(255,255,255,.14); }
.borders { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.stage-cap {
position: absolute; left: 50%; transform: translateX(-50%);
bottom: -2rem; text-align: center; font-size: var(--fs-14); font-weight: var(--fw-semi);
color: #C2D0FF; background: rgba(9, 18, 61, 0.75); border: 1px solid rgba(255, 255, 255, 0.15);
padding: .25rem .85rem; border-radius: var(--r-pill); white-space: nowrap;
}
@keyframes flagslide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .flagwall { animation: none; } }
.facts {
display: grid; gap: var(--sp-4) 0; margin: var(--sp-7) 0;
grid-template-columns: repeat(4, minmax(0, 1fr));
padding: var(--sp-6) var(--sp-4); background: var(--card); border: 1px solid var(--border);
border-radius: var(--r-xl); box-shadow: var(--sh-2);
}
.facts > div { padding: 0 1.3rem; }
.facts > div + div { border-left: 1px solid var(--border); }
@media (max-width: 620px) {
.facts { grid-template-columns: 1fr 1fr; gap: 1.15rem 0; padding: 1.15rem .3rem; }
.facts > div:nth-child(3) { border-left: 0; }
}
@media (max-width: 380px) { .facts > div { padding: 0 .85rem; } }
.facts b {
display: block; color: var(--emph); line-height: 1.1;
font-weight: var(--fw-heavy); letter-spacing: -.02em;
font-variant-numeric: tabular-nums;
font-size: clamp(var(--fs-28), 1.2rem + 1.8vw, var(--fs-36)); text-wrap: balance;
}
.facts .facts-date b { font-size: var(--fs-18); line-height: var(--lh-snug); padding-top: .35rem; }
.facts span { display: block; margin-top: .3rem; font-size: var(--text-small); color: var(--muted); }
.card {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--r-lg); padding: var(--sp-4) var(--sp-4) var(--sp-3); margin-bottom: var(--sp-3);
box-shadow: var(--sh-1);
transition: transform .2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .2s cubic-bezier(0.16, 1, 0.3, 1), border-color .2s ease;
}
.card:hover {
border-color: var(--border-strong);
box-shadow: var(--sh-2);
transform: translateY(-2px);
}
.card h3 { font-size: var(--fs-18); }
.card h3 a { color: var(--ink); text-decoration: none; }
.card h3 a:hover { color: var(--link); text-decoration: underline; }
.card .org { color: var(--muted); font-size: var(--fs-14); margin: 0 0 var(--sp-2); }
.card p { margin-bottom: var(--sp-3); font-size: var(--fs-16); }
.card, .lrow, .wk-card, .listing { overflow-wrap: anywhere; }
:root {
--i-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
--i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.7 2.7L16 9.8'/%3E%3C/svg%3E");
--i-alert: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E");
--i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E");
--i-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 3.8 5.7 3.8 9s-1.3 6.3-3.8 9c-2.5-2.7-3.8-5.7-3.8-9S9.5 5.7 12 3z'/%3E%3C/svg%3E");
--i-building: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v16M15 9h4a1 1 0 0 1 1 1v11M3 21h18M8 8h3M8 12h3M8 16h3'/%3E%3C/svg%3E");
--i-cash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6.5 9.5v.01M17.5 14.5v.01'/%3E%3C/svg%3E");
--i-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.6-3 8.3-7 10-4-1.7-7-5.4-7-10V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E");
--i-plane: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 13.5L3 11l1.5-1.5 7 1 4-4.5c1-1 2.8-1.5 3.5-.8s.2 2.5-.8 3.5l-4.5 4 1 7L13 22l-2.5-7.5z'/%3E%3C/svg%3E");
--i-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='black'/%3E%3C/svg%3E");
--i-dot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3' fill='black'/%3E%3C/svg%3E");
}
.meta { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin: 0; align-items: center; }
.tag {
display: inline-flex; align-items: center; gap: .375rem;
font-size: var(--fs-14); font-weight: var(--fw-medium); line-height: 1.35;
color: var(--muted); background: none; padding: 0; border-radius: 0;
}
.tag::before {
content: ""; flex: none; width: 1rem; height: 1rem; background-color: currentColor;
-webkit-mask: var(--ti, var(--i-dot)) center / contain no-repeat;
mask: var(--ti, var(--i-dot)) center / contain no-repeat;
}
.tag.when { --ti: var(--i-clock); color: var(--ink); }
.tag.soon { color: var(--step-ink); font-weight: var(--fw-bold); }
.tag.free { --ti: var(--i-check); color: var(--confirmed); font-weight: var(--fw-semi); }
.tag.fee { --ti: var(--i-alert); color: var(--problem); font-weight: var(--fw-semi); }
.tag.pay { --ti: var(--i-cash); color: var(--ink); font-weight: var(--fw-semi); }
.tag.city { --ti: var(--i-pin); }
.tag.remote, .tag.hybrid { --ti: var(--i-globe); color: var(--ink); }
.tag.onsite { --ti: var(--i-building); color: var(--ink); }
.tag.visa { --ti: var(--i-plane); }
.tag.label { color: var(--ink); font-weight: var(--fw-semi); }
.tag.checked { --ti: var(--i-shield); }
.tag.tracks { --ti: var(--i-shield); }
.tag.checked.stale { --ti: var(--i-alert); color: var(--problem); }
.tag.kind {
background: var(--royal-tint); color: var(--emph); font-weight: var(--fw-semi);
padding: .15rem .65rem; border-radius: var(--r-pill);
border: 1px solid rgba(15, 29, 91, 0.08);
}
.tag.kind::before { display: none; }
.grid { display: grid; gap: .8rem; grid-template-columns: 1fr; }
@media (min-width: 40rem) { .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 60rem) { .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.grid div {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius); padding: 1.05rem; box-shadow: var(--shadow);
}
.grid p { font-size: var(--fs-16); color: var(--muted); margin: 0; }
.searchbar {
display: flex; gap: var(--sp-3); margin: 1.5rem 0 1.2rem; flex-wrap: wrap;
align-items: center; background: var(--card); border: 1px solid var(--border);
border-radius: var(--r-xl); padding: var(--sp-4); box-shadow: var(--sh-2);
transition: border-color .2s ease, box-shadow .2s ease;
}
.searchbar:focus-within {
border-color: var(--border-strong);
box-shadow: var(--sh-3);
}
.searchbar input {
flex: 1 1 14rem; font: inherit; font-size: var(--fs-16); padding: var(--sp-3) var(--sp-4);
min-height: 3rem; border: 1px solid var(--border); border-radius: var(--r-md);
background: var(--sunken); color: var(--ink);
transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.searchbar input:focus {
outline: none;
border-color: var(--green-strong);
box-shadow: 0 0 0 3px rgba(16, 185, 129, .22);
background: var(--card);
}
.searchbar button {
font: inherit; font-weight: var(--fw-bold); padding: var(--sp-3) var(--sp-5); cursor: pointer;
background: var(--green-btn); color: #fff; border: 0; border-radius: var(--r-md);
min-height: 3rem; box-shadow: var(--green-glow);
transition: background-color .18s ease, transform .18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .18s ease;
}
.searchbar button:hover {
background: var(--green-btn-strong);
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(4, 120, 87, 0.4);
}
@media (max-width: 34rem) {
.searchbar input { flex: 1 1 100%; }
.searchbar button { flex: 1 1 100%; }
}
.tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0 0 1.5rem; }
@media (max-width: 40rem) {
.tabs {
flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter));
padding: 0 var(--gutter) .2rem;
-webkit-overflow-scrolling: touch;
}
.tabs::-webkit-scrollbar { display: none; }
.tabs a { flex: 0 0 auto; white-space: nowrap; }
}
.tabs a {
font-size: var(--text-small); text-decoration: none; color: var(--muted);
border: 1px solid var(--border); border-radius: var(--radius-pill);
padding: .5rem 1.1rem; background: var(--card); box-shadow: var(--sh-1);
display: inline-flex; align-items: center; min-height: 2.75rem;
transition: all .18s cubic-bezier(0.16, 1, 0.3, 1);
}
.tabs a:hover {
border-color: var(--green); color: var(--green-text);
transform: translateY(-1.5px);
box-shadow: var(--sh-2);
}
.tabs a.on {
background: var(--green-tint); border-color: var(--green-strong);
color: var(--green-text); font-weight: var(--fw-semi);
box-shadow: 0 2px 10px rgba(16, 185, 129, 0.18);
}
.searchbar .picks {
flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3);
margin-top: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--border);
}
.pick {
flex: 1 1 10rem; display: flex; flex-direction: column; gap: var(--sp-1);
font-size: var(--fs-14); font-weight: var(--fw-bold); color: var(--muted);
}
.pick select {
font: inherit; font-size: var(--fs-16); font-weight: var(--fw-regular); color: var(--ink);
min-height: var(--tap); padding: var(--sp-2) var(--sp-3); width: 100%;
border: 1px solid var(--border); border-radius: var(--r-md); background: var(--sunken);
transition: border-color .15s ease, background-color .15s ease;
}
.pick select:focus { outline: 3px solid var(--focus); outline-offset: 1px; background: var(--card); }
.pick-kind { display: none; }
@media (max-width: 40rem) {
.pick-kind { display: flex; flex-basis: 100%; }
.tabs { display: none; }
}
.pager {
display: flex; align-items: center; justify-content: space-between;
gap: .6rem; margin: 1.2rem 0 0; padding-top: 1rem;
border-top: 1px solid var(--border);
}
.pager a, .pager .off {
font-size: var(--fs-16); font-weight: 600; text-decoration: none;
padding: .6rem 1.1rem; border-radius: var(--radius);
border: 1px solid var(--border-strong); background: var(--card);
min-height: 2.75rem; display: inline-flex; align-items: center;
}
.pager a { color: var(--orange-text); }
.pager a:hover { border-color: var(--orange); }
.pager .off { color: var(--muted); border-color: var(--border); background: var(--sunken); }
.pager .of {
font-size: var(--fs-16); color: var(--muted); font-weight: 600;
text-align: center; flex: 1 1 auto;
}
.pager { flex-wrap: wrap; }
.pager .pages {
flex: 1 1 100%; display: flex; justify-content: center; flex-wrap: wrap;
gap: var(--sp-1); list-style: none; margin: var(--sp-3) 0 0; padding: 0;
}
.pager .pages a, .pager .cur, .pager .gap {
min-width: var(--tap); padding: .6rem var(--sp-2); justify-content: center;
}
.pager .cur {
display: inline-flex; align-items: center; min-height: var(--tap);
border-radius: var(--radius); background: var(--royal); color: var(--on-royal);
font-weight: var(--fw-semi); font-size: var(--fs-16);
}
.pager .gap { display: inline-flex; align-items: center; color: var(--muted); }
.allpage { font-size: var(--fs-16); color: var(--muted); margin: var(--sp-3) 0 0; }
.allpage a { display: inline-flex; align-items: center; min-height: var(--tap); }
.why {
border: 1px solid var(--border); border-radius: var(--radius);
background: var(--card); margin: 0 0 1.5rem; box-shadow: var(--shadow);
}
.why summary {
cursor: pointer; padding: .8rem .9rem; font-size: var(--fs-16); font-weight: 600;
color: var(--ink); list-style: none; min-height: 2.75rem;
display: flex; align-items: center; gap: .55rem;
}
.why summary::-webkit-details-marker { display: none; }
.why summary::before {
content: ""; flex: none; width: .5rem; height: .5rem; margin-top: -.2rem;
border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted);
transform: rotate(45deg); transition: transform .15s ease;
}
.why[open] summary::before { transform: rotate(-135deg); margin-top: .2rem; }
.why summary:hover { background: var(--sunken); border-radius: var(--radius); }
.whybody {
padding: .2rem .9rem .9rem; font-size: var(--fs-16); border-top: 1px solid var(--border);
}
.whybody p { margin: .8rem 0 0; }
.whybody ol { margin: .8rem 0 0; }
ol.tests { padding-left: 1.2rem; }
ol.tests li { margin-bottom: .7rem; }
.more { display: inline-flex; align-items: center; min-height: var(--tap); font-weight: 600; text-decoration: none; }
.solo { display: inline-flex; align-items: center; min-height: var(--tap); }
.sitefoot {
background: var(--royal-deep); color: var(--on-royal-muted);
padding: var(--sp-6) var(--gutter) var(--sp-6);
}
.sitefoot .cols {
max-width: var(--measure-wide); margin: 0 auto; display: grid; gap: var(--sp-5) var(--sp-6);
grid-template-columns: 1.6fr 1fr 1fr 1fr;
}
.foot-lockup { display: inline-flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-2); }
.foot-lockup strong { margin: 0; font-size: var(--fs-18); }
.foot-brand p { max-width: 26rem; margin: 0; }
.foot-brand .beta-note { margin-top: var(--sp-3); }
.beta-note .beta-tag { margin-right: var(--sp-1); }
.sitefoot strong { display: block; margin-bottom: var(--sp-2); color: #fff; font-size: var(--fs-16); }
.sitefoot a { display: flex; align-items: center; min-height: var(--tap); color: var(--on-royal-muted); text-decoration: none; font-size: var(--fs-14); padding: var(--sp-1) 0; }
.sitefoot a:hover { color: #fff; text-decoration: underline; }
.sitefoot a:focus-visible { outline-color: #fff; }
.sitefoot p { color: var(--on-royal-muted); font-size: var(--fs-16); }
.sitefoot .fine {
max-width: var(--measure-wide); margin: var(--sp-5) auto 0; padding-top: var(--sp-4);
border-top: 1px solid rgba(255, 255, 255, .14); font-size: var(--fs-14);
}
.sitefoot .follow { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-3);
margin-left: calc((var(--sp-5) - var(--tap)) / 2); }
.sitefoot .follow a {
display: inline-flex; align-items: center; justify-content: center;
width: var(--tap); height: var(--tap); min-height: var(--tap); padding: 0;
border-radius: var(--r-pill); color: var(--on-royal-muted);
}
.sitefoot .follow a:hover { color: var(--on-royal); background: var(--royal-soft); text-decoration: none; }
.sitefoot .follow svg { width: var(--sp-5); height: var(--sp-5); }
@media (max-width: 760px) {
.sitefoot .cols { grid-template-columns: 1fr 1fr; gap: var(--sp-4) var(--sp-5); }
.foot-brand { grid-column: 1 / -1; }
.sitefoot a { padding: var(--sp-2) 0; }
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
.sr-only {
position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.empty {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius); padding: 1.4rem 1.2rem; text-align: center;
color: var(--muted);
}
.empty b { color: var(--ink); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, .chip:focus-visible {
outline: 3px solid var(--focus);
outline-offset: 2px;
border-radius: .2rem;
}
.actionbar { display: none; }
@media (max-width: 760px) {
.actionbar {
display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
padding: .7rem .9rem calc(.7rem + env(safe-area-inset-bottom, 0px));
background: var(--card); border-top: 1px solid var(--border-strong);
box-shadow: 0 -2px 10px rgba(11, 27, 43, .10);
}
.actionbar[hidden] { display: none; }
.actionbar .cta { display: block; text-align: center; }
body.with-actionbar { padding-bottom: 4.75rem; }
}
.listing h2.sec {
font-size: var(--fs-18); margin: 2rem 0 .6rem; padding-top: .9rem;
border-top: 1px solid var(--border);
}
.listing h2.sec:first-of-type { margin-top: 1.6rem; }
.youapply {
font-size: var(--fs-16); color: var(--muted);
padding-left: .7rem; border-left: 2px solid var(--border-strong);
margin-bottom: 1.1rem;
}
.listing h1 { font-size: 1.85rem; }
.listing .org { color: var(--muted); margin: -.2rem 0 .9rem; }
.listing .meta { margin-bottom: 1.2rem; }
.listing .big { font-size: var(--fs-18); line-height: 1.55; }
.listing .cta { margin-top: .3rem; }
.listing .cta.off { background: var(--sunken); color: var(--muted); border: 1.5px solid var(--border-strong); cursor: default; }
.listing .ctas .cta.ghost.dark { color: var(--orange-text); border-color: var(--border-strong); }
.listing .ctas .cta.ghost.dark:hover { background: var(--orange-tint); }
ul.asks { padding-left: 1.1rem; color: var(--muted); }
ul.asks li { margin-bottom: .3rem; }
ul.related { padding-left: 1.1rem; }
ul.related li { margin-bottom: .45rem; }
ul.related .rel-org { color: var(--muted); font-size: .9em; }
.nf-search { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center;
margin: var(--sp-4) 0; }
.nf-search label { flex-basis: 100%; font-weight: var(--fw-semi); }
.nf-search input { flex: 1 1 14rem; min-height: var(--tap); padding: 0 var(--sp-3);
font: inherit; border: 1px solid var(--border); border-radius: var(--r-md); }
ul.hub-links { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); }
ul.hub-links a { display: inline-block; padding: var(--sp-2) 0; min-height: 44px; box-sizing: border-box; }
.assure {
background: var(--confirmed-bg); color: var(--confirmed);
padding: .8rem .95rem; border-radius: var(--radius); font-weight: 500;
}
.warnbox {
background: var(--problem-bg); color: var(--problem);
padding: .8rem .95rem; border-radius: var(--radius); font-weight: 500;
}
.stack { display: block; margin: 1rem 0 2rem; }
.stack label {
display: block; font-weight: 600; margin: 1.1rem 0 .2rem; font-size: var(--fs-16);
}
.stack .hint { margin: 0 0 .45rem; }
.stack input, .stack textarea, .stack select {
width: 100%; font: inherit; font-size: var(--fs-16); padding: var(--sp-3) var(--sp-4);
min-height: 3rem; border: 1px solid var(--border-strong); border-radius: var(--r-md);
background: var(--card); color: var(--ink);
}
.stack textarea { resize: vertical; min-height: 4.5rem; }
.stack input:focus, .stack textarea:focus, .stack select:focus { outline: 3px solid var(--focus); outline-offset: 1px; border-color: var(--focus); }
.stack .cta { border: 0; cursor: pointer; margin-top: 1.4rem; font-size: var(--fs-16); }
.req {
font-weight: 600; font-size: var(--fs-14); color: var(--orange-text); margin-left: .3rem;
}
.opt { font-weight: var(--fw-regular); font-size: var(--fs-14); color: var(--muted); margin-left: .3rem; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.hp {
position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}
.hint { color: var(--muted); font-size: var(--fs-16); }
.big-note { margin: 1.2rem 0 1.6rem; line-height: 1.5; }
.card.soft { padding: 1.1rem 1.2rem; margin: 1.4rem 0; }
.card.soft h2 { margin-top: 0; }
.card.soft h3 { font-size: var(--fs-18); margin-bottom: .35rem; }
ul.sent { list-style: none; padding: 0; margin: .6rem 0 0; }
ul.sent li {
padding: .55rem 0; border-top: 1px solid var(--border); font-size: var(--fs-16);
}
ul.sent li:first-child { border-top: 0; }
.tag.good, .tag.bad, .tag.wait { padding: .125rem .625rem; border-radius: var(--r-pill); font-weight: var(--fw-semi); }
.tag.good::before, .tag.bad::before, .tag.wait::before { display: none; }
.tag.good { background: var(--confirmed-bg); color: var(--confirmed); }
.tag.bad { background: var(--problem-bg); color: var(--problem); }
.tag.wait { background: var(--review-bg); color: var(--review); }
.nums { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.num {
background: var(--sunken); border-radius: var(--radius); padding: .75rem .85rem;
}
.num b { display: block; font-size: 1.6rem; line-height: 1.1; color: var(--ink);
font-family: var(--font-mono); font-weight: 500; font-variant-numeric: tabular-nums; }
.num span { display: block; font-size: var(--text-small); color: var(--muted); }
.num .hint { margin-top: .3rem; font-size: var(--fs-14); }
ul.checks { list-style: none; padding: 0; margin: .5rem 0 0; }
ul.checks li {
padding: .6rem .75rem; margin-bottom: .4rem; border-radius: var(--radius);
background: var(--sunken); font-size: var(--fs-16);
border-left: 3px solid var(--border-strong);
}
ul.checks li.good { background: var(--confirmed-bg); border-left-color: var(--confirmed); }
ul.checks li.bad { background: var(--problem-bg); border-left-color: var(--problem); }
.calendar {
display: grid; gap: .4rem; margin: .9rem 0 .5rem;
grid-template-columns: repeat(auto-fit, minmax(4.2rem, 1fr));
}
.day {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius); padding: .5rem .35rem; text-align: center;
}
.day span {
display: block; font-size: var(--fs-14); color: var(--muted); font-weight: 600;
margin-bottom: .35rem;
}
.slots { display: flex; gap: .18rem; justify-content: center; }
.slots i {
width: .75rem; height: .75rem; border-radius: .18rem; display: block;
}
.slots i.free { background: var(--sunken); border: 1px solid var(--border-strong); }
.slots i.held { background: var(--orange-strong); }
.half { background: var(--sunken); border-radius: .4rem; padding: .55rem .65rem; margin-bottom: .5rem; }
.half:last-child { margin-bottom: 0; }
.half h4 {
margin: 0 0 .25rem; font-size: var(--fs-14); color: var(--muted); font-weight: 700;
}
.half ul { margin: 0; padding-left: .95rem; }
.half li { font-size: var(--fs-16); margin-bottom: .12rem; }
.half.gets { background: var(--confirmed-bg); }
.half.gets h4 { color: var(--confirmed); }
.half.asks { background: var(--review-bg); }
.half.asks h4 { color: var(--review); }
.tag.door { --ti: var(--i-alert); color: var(--step-ink); font-weight: var(--fw-semi); }
main.wide { max-width: var(--measure-wide); }
.stand:empty { display: none; }
.stand {
display: block; margin: 1.2rem 0; padding: .95rem 1.1rem;
border-radius: var(--radius); border-left: 4px solid var(--border-strong);
background: var(--sunken);
}
.stand b { display: block; font-size: var(--fs-18); margin-bottom: .3rem; }
.stand p { margin: 0 0 .5rem; font-size: var(--fs-16); }
.stand p.asks { color: var(--muted); font-size: var(--fs-16); }
.stand p.req { margin-bottom: var(--sp-1); font-size: var(--fs-14); }
.stand p.req.need { color: var(--step-ink); font-weight: var(--fw-semi); }
.stand p.req.ask { color: var(--muted); }
.stand a { font-weight: 600; }
.stand a.quiet {
display: inline-block; margin-top: .5rem; font-weight: 400;
font-size: var(--fs-16); color: var(--muted);
}
.stand.good { background: var(--confirmed-bg); border-left-color: var(--confirmed); }
.stand.good b { color: var(--confirmed); }
.stand.wait { background: var(--review-bg); border-left-color: var(--review); }
.stand.wait b { color: var(--review); }
.stand.bad { background: var(--problem-bg); border-left-color: var(--problem); }
.stand.bad b { color: var(--problem); }
.stand.ask { background: var(--orange-tint); border-left-color: var(--orange); }
.stand.ask b { color: var(--orange-text); }
.stand .cta.inline { display: inline-block; width: auto; margin-top: .4rem; }
.stand .quickcheck { display: grid; gap: .3rem; margin: .5rem 0 .4rem; max-width: 26rem; }
.stand .quickcheck label { font-size: var(--fs-14); font-weight: var(--fw-semi); margin-top: .3rem; }
.stand .quickcheck select {
font: inherit; font-size: var(--fs-16); padding: var(--sp-2) var(--sp-3); min-height: var(--tap);
border: 1px solid var(--border-strong); border-radius: var(--r-md); background: var(--card); color: var(--ink);
}
.stand .quickcheck .cta.inline { justify-self: start; margin-top: .6rem; }
.stand .keep { margin-top: .9rem; padding-top: .7rem; border-top: 1px solid var(--border); }
.stand .keep a.quiet { display: block; margin-top: .5rem; }
.stand .how { color: var(--muted); font-size: var(--fs-16); margin: .4rem 0 .5rem; }
.stand .opennow {
display: inline-block; margin-left: .5rem; padding: .12rem .45rem;
border-radius: .25rem; font-size: var(--fs-14); font-weight: 700;
background: var(--confirmed-bg); color: var(--confirmed);
}
.facts-list {
display: grid; gap: .05rem 1.2rem; margin: 1.2rem 0;
grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
background: var(--sunken); border-radius: var(--radius); padding: 1rem 1.1rem;
}
.facts-list > div { padding: .35rem 0; }
.facts-list dt {
font-size: var(--fs-14); color: var(--muted); font-weight: 700;
}
.facts-list dd { margin: .15rem 0 0; font-size: var(--fs-16); color: var(--ink); }
.meaning {
font-size: var(--fs-16); color: var(--muted); margin: -.2rem 0 1rem;
padding-left: .8rem; border-left: 3px solid var(--orange);
}
.stand .closeness { margin: .7rem 0 .3rem; padding: 0; background: none; }
.stand .howclose { margin: 0 0 .35rem; font-size: var(--fs-16); }
.stand .closeness ul { list-style: none; margin: 0; padding: 0; }
.stand .closeness li {
display: flex; gap: .5rem; align-items: flex-start;
font-size: var(--fs-16); padding: .14rem 0;
}
.stand .closeness li .mark { flex: none; width: 1.1rem; text-align: center; font-weight: 700; }
.stand .closeness li.yes .mark { color: var(--confirmed); }
.stand .closeness li.no .mark { color: var(--problem); }
.stand .closeness li.maybe .mark { color: var(--review); }
.stand .closeness li.tocheck .mark, .stand .closeness li.note .mark { color: var(--muted); }
.stand p.waived { color: var(--confirmed); font-weight: 600; margin-top: .5rem; }
.closeness li.note { margin: 0; background: none; border-radius: 0; }
.ribbon { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-xl); overflow: hidden; padding: var(--sp-4) 0; margin: var(--sp-6) 0 0; box-shadow: var(--sh-1); }
@media (max-width: 47.99rem) { .ribbon { border-radius: 0; border-left: 0; border-right: 0; margin: 0 calc(-1 * var(--gutter)); } }
.ribbon-lead { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin: 0 0 var(--sp-3); padding: 0 var(--sp-5); font-weight: var(--fw-bold); font-size: var(--fs-14); color: var(--green-text); }
.ribbon-lead p { margin: 0; }
.stillbtn { flex: none; min-height: var(--tap); padding: 0 var(--sp-4); border: 1px solid var(--border-strong); border-radius: var(--r-pill); background: var(--card); color: var(--ink); font: inherit; font-size: var(--fs-14); font-weight: var(--fw-semi); cursor: pointer; }
.stillbtn:hover { background: var(--sunken); }
.stillbtn[aria-pressed="true"] { background: var(--ink); color: var(--card); border-color: var(--ink); }
.stillbtn[hidden] { display: none; }
.ribbon-track { display: flex; gap: var(--sp-3); width: max-content; padding: 0 var(--sp-5); animation: ribslide 90s linear infinite; will-change: transform; }
.ribbon:hover .ribbon-track, .ribbon:focus-within .ribbon-track { animation-play-state: paused; }
.qa-still .ribbon-track, .qa-still .flagwall { animation-play-state: paused; }
.rib { flex: none; display: flex; flex-direction: column; gap: 4px; text-decoration: none; background: var(--ground); border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4); width: 16rem; transition: border-color .15s ease, box-shadow .15s ease; }
.rib:hover { border-color: var(--border-strong); background: var(--card); box-shadow: var(--sh-2); }
.rib-k { font-weight: var(--fw-semi); font-size: var(--fs-14); color: var(--emph); }
.rib-t { font-weight: var(--fw-bold); color: var(--ink); font-size: var(--fs-16); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rib-o { color: var(--muted); font-size: var(--fs-14); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rib-loop { display: contents; }
@keyframes ribslide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
.ribbon { overflow-x: auto; }
.ribbon-track { animation: none; }
.rib-loop { display: none; }
}
.share { margin: 1.4rem 0 .2rem; }
.share-lead { display: block; font-family: var(--font-display); font-weight: 700;
font-size: var(--fs-16); color: var(--muted); margin-bottom: .6rem; }
.share-row { display: flex; flex-wrap: wrap; gap: .55rem; }
.sharebtn { display: inline-flex; align-items: center; gap: .45rem;
font-family: var(--font-display); font-weight: 700; font-size: var(--fs-16);
color: var(--emph); background: var(--card); border: 1.5px solid var(--border-strong);
border-radius: var(--radius-pill); padding: .5rem .95rem; text-decoration: none;
cursor: pointer; line-height: 1; transition: border-color .12s, background .12s, color .12s; }
.sharebtn svg { flex: none; color: var(--muted); transition: color .12s; }
.sharebtn:hover { border-color: var(--emph); background: var(--sunken); }
.sharebtn:hover svg { color: var(--emph); }
.sharebtn.s-copy { color: var(--green-text); }
.sharebtn.s-copy:hover { border-color: var(--green); }
.sharebtn.s-copy:hover svg { color: var(--green); }
.share-fallback { margin-top: .7rem; }
.postlinks { margin-top: var(--sp-3); }
.postlinks summary { cursor: pointer; color: var(--emph); font-weight: var(--fw-semi); min-height: var(--tap); display: flex; align-items: center; }
.postlinks .note { margin: var(--sp-1) 0 var(--sp-3); }
.sharebtn.s-post { font-size: var(--fs-14); padding: .45rem .8rem; }
.lh-copy[hidden] { display: none; }
.share-note { margin: .4rem 0 0; font-size: var(--fs-16); color: var(--muted); }
@media (max-width: 760px) { .share .s-x, .share .s-facebook { display: none; } }
.listing-hero {
position: relative;
background: radial-gradient(circle at 90% 10%, rgba(16, 185, 129, 0.18) 0%, transparent 60%),
radial-gradient(circle at 10% 90%, rgba(30, 45, 125, 0.5) 0%, transparent 70%),
var(--royal);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: var(--r-xl); padding: 1.5rem 1.6rem 1.65rem;
margin: 0 0 1.3rem; overflow: hidden;
box-shadow: var(--sh-3);
}
.listing-hero .lh-back { color: var(--on-royal-muted); font-size: var(--fs-14); text-decoration: none; display: inline-flex; align-items: center; min-height: var(--tap); margin: calc(-1 * var(--sp-3)) 0; }
.listing-hero .lh-back:hover { color: #fff; }
.listing-hero .lh-kind {
font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: #7FE0A0;
margin: .85rem 0 .35rem;
}
.listing-hero h1 {
color: #fff; font-family: var(--font-display); font-weight: 800;
font-size: clamp(1.5rem, 3.5vw, 2.05rem); line-height: var(--lh-tight);
letter-spacing: -.01em; margin: 0 0 .4rem; max-width: 24ch;
}
.listing-hero .lh-org { color: #D6DCFF; margin: 0; font-size: var(--fs-16); }
.listing-hero .lh-mark { position: absolute; top: 1.2rem; right: 1.2rem; opacity: .95; }
.listing-hero .lh-actions { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); margin: var(--sp-4) 0 0; }
.lh-act {
display: inline-flex; align-items: center; gap: .4rem; min-height: var(--tap);
padding: 0 var(--sp-4); border-radius: var(--radius-pill);
border: 1px solid rgba(255, 255, 255, 0.24); background: rgba(255, 255, 255, 0.08);
backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
color: var(--on-royal);
font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14);
text-decoration: none; cursor: pointer;
transition: background .18s ease, border-color .18s ease, transform .18s cubic-bezier(0.16, 1, 0.3, 1);
}
.lh-act:hover {
background: rgba(255, 255, 255, 0.18);
border-color: rgba(255, 255, 255, 0.4);
transform: translateY(-1px);
}
.lh-act svg { flex: none; }
.lh-act[aria-pressed="true"] { background: var(--on-royal); color: var(--royal); border-color: var(--on-royal); }
.lh-act[aria-pressed="true"] svg { fill: currentColor; }
.lh-act[aria-busy="true"] { opacity: .7; }
.listing-hero .lh-note { color: var(--on-royal-muted); font-size: var(--fs-16); margin: var(--sp-2) 0 0; }
.listing-hero .lh-note:empty { display: none; }
.listing-hero .lh-note a { color: var(--on-royal); font-weight: var(--fw-semi); text-decoration: underline; text-underline-offset: .15em; }
.listing-hero .lh-mark svg { width: 42px; height: 42px; border-radius: 10px; }
@media (max-width: 520px) { .listing-hero .lh-mark { display: none; } }
.kicon { width: 14px; height: 14px; flex: none; }
.tag.kind { display: inline-flex; align-items: center; gap: .34em; }
.listing-hero .lh-kind { display: flex; align-items: center; gap: .42em; width: fit-content; }
.listing-hero .lh-kind .kicon { width: 15px; height: 15px; }
.phero { background: var(--royal); color: #fff; border-radius: var(--r-xl);
padding: clamp(var(--sp-5), 4vw, var(--sp-7)); margin: 0 0 var(--sp-6); }
.phero-in { max-width: 40rem; }
.ph-eyebrow { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: #7FE0A0; margin: 0 0 .7rem; }
.phero h1 { color: #fff; font-family: var(--font-display); font-weight: 800;
font-size: clamp(1.9rem, 4vw, 2.9rem); line-height: 1.05; letter-spacing: -.02em;
margin: 0 0 1rem; }
.phero h1 .hl { color: #39D46A; }
.phero .lede { color: #D6DCFF; font-size: var(--fs-18); max-width: 38rem; margin: 0 0 1.6rem; }
.phero .cta { margin-top: .2rem; }
.feature-band { margin: 2.6rem 0; }
.band-eyebrow { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--green-text); margin: 0 0 .3rem; }
.band-eyebrow + h2 { margin-top: 0; }
.features { display: grid; gap: 1rem; margin-top: 1.4rem;
grid-template-columns: 1fr; }
@media (min-width: 40rem) { .features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 60rem) { .features { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 40rem) { .features.features-3 { grid-template-columns: 1fr; } }
@media (min-width: 60rem) { .features.features-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.feature { background: var(--card); border: 1px solid var(--border);
border-radius: var(--r-lg); padding: var(--sp-5); box-shadow: var(--sh-1); }
.feat-icon { width: 2.75rem; height: 2.75rem; padding: .6rem; border-radius: var(--r-md);
color: var(--emph); background: var(--royal-tint); }
.feature h3 { margin: var(--sp-3) 0 var(--sp-2); color: var(--ink); font-size: var(--fs-18); }
.feat-bar { display: none; }
.feature p { color: var(--muted); font-size: var(--fs-16); margin: 0; }
.convo { display: grid; gap: 2rem; grid-template-columns: 1fr 1.1fr;
align-items: start; margin-top: 2.6rem; padding-top: 2rem;
border-top: 1px solid var(--border); }
.convo-pitch h2 { margin-top: 0; }
.convo-form { background: var(--sunken); border: 1px solid var(--border);
border-radius: var(--radius); padding: 1.5rem; margin-top: 0; }
@media (max-width: 40rem) { .convo { grid-template-columns: 1fr; } }
.signin-page { max-width: 28rem; }
.signin-ways { display: grid; gap: var(--sp-4); margin: var(--sp-5) 0; }
.gbtn {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
min-height: var(--tap); padding: 0 var(--sp-4);
background: var(--card); color: var(--ink); font: inherit; font-size: var(--fs-16);
font-weight: var(--fw-semi); border: 1px solid var(--border-strong);
border-radius: var(--r-md); text-decoration: none; cursor: pointer;
}
.gbtn:hover { border-color: var(--muted); background: var(--sunken); }
.gbtn .gicon { display: inline-flex; align-items: center; justify-content: center;
width: 1.15rem; height: 1.15rem; }
.signin-form { margin: 0; }
.signin-form .cta { margin-top: var(--sp-3); width: 100%; }
.signin-form .cta + .hint { margin-top: var(--sp-3); }
.signin-off { margin: 0; padding: var(--sp-3) var(--sp-4); color: var(--muted);
background: var(--sunken); border: 1px dashed var(--border-strong);
border-radius: var(--r-md); font-size: var(--fs-16); }
.signin-msg { margin: 0 0 var(--sp-2); padding: var(--sp-3) var(--sp-4);
background: var(--green-tint); color: var(--green-text); border-radius: var(--r-md); }
.signin-error { margin: 0 0 var(--sp-2); padding: var(--sp-3) var(--sp-4);
background: var(--sunken); color: var(--ink); border-left: 4px solid var(--emph);
border-radius: var(--r-sm); }
.signin-new { color: var(--muted); }
.signin-one { max-width: 28rem; margin-inline: auto; }
.signin-card { margin: var(--sp-5) 0; padding: var(--sp-5); background: var(--card);
border: 1px solid var(--border); border-radius: var(--r-lg); }
.signin-card .gbtn { width: 100%; white-space: nowrap; padding: 0 var(--sp-3); }
.signin-or { display: flex; align-items: center; gap: var(--sp-3); margin: var(--sp-4) 0;
color: var(--muted); font-size: var(--fs-16); }
.signin-or::before, .signin-or::after { content: ""; flex: 1; border-top: 1px solid var(--border); }
.signin-mail .stack { margin: 0; }
.signin-mail .stack label:first-child { margin-top: 0; }
.signin-mail .signin-links { justify-content: space-between; }
.signin-alt { margin: var(--sp-5) 0 0; padding-top: var(--sp-4); border-top: 1px solid var(--border); }
.signin-alt p { margin: 0 0 var(--sp-3); color: var(--muted); }
.signin-alt .gbtn { width: 100%; }
.signin-new a, .signin-page .muted a { display: inline-block; padding-block: .75rem;
margin-block: -.75rem; }
.signin-links { display: flex; flex-wrap: wrap; gap: 0 var(--sp-5); margin: var(--sp-3) 0 0; }
.signin-links a, .linkbtn { display: inline-flex; align-items: center; min-height: var(--tap); }
.linkbtn { padding: 0; font: inherit; color: var(--link); background: none; border: 0;
text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px;
cursor: pointer; }
.linkbtn:hover { text-decoration-thickness: 2px; }
.linkbtn:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.pw-field { display: flex; align-items: stretch; gap: var(--sp-2); }
.stack .pw-field input { flex: 1 1 auto; min-width: 0; width: auto; }
.pw-toggle { flex: 0 0 auto; min-width: 4.5rem; min-height: 3rem; padding: 0 var(--sp-3);
font: inherit; font-size: var(--fs-16); font-weight: var(--fw-semi); color: var(--ink);
background: var(--card); border: 1px solid var(--border-strong); border-radius: var(--r-md);
cursor: pointer; }
.pw-toggle[hidden] { display: none; }
.pw-toggle:hover { border-color: var(--muted); background: var(--sunken); }
.pw-toggle:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.btn-quiet { display: inline-flex; align-items: center; justify-content: center;
min-height: var(--tap); padding: 0 var(--sp-4); font: inherit; font-size: var(--fs-16);
font-weight: var(--fw-semi); color: var(--ink); background: var(--card);
border: 1px solid var(--border-strong); border-radius: var(--r-md);
text-decoration: none; cursor: pointer; }
.btn-quiet:hover { border-color: var(--muted); background: var(--sunken); }
.btn-quiet:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; }
.verify-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-4);
margin: 0 0 var(--sp-4); padding: var(--sp-2) var(--sp-3); background: var(--sunken);
border: 1px solid var(--border-strong); border-left: 4px solid var(--emph);
border-radius: var(--r-md); }
.verify-bar[hidden] { display: none; }
.verify-bar p { margin: 0; flex: 1 1 18rem; font-size: var(--fs-14); line-height: var(--lh-snug);
overflow-wrap: anywhere; }
.verify-act { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); }
.verify-act form { margin: 0; }
.verify-act .btn-quiet { padding: 0 var(--sp-3); }
.btn-quiet[hidden] { display: none; }
.me-security p { margin: var(--sp-2) 0; }
.me-security form { margin: var(--sp-2) 0 var(--sp-3); }
.doc-hero { margin: .4rem 0 2.1rem; padding-bottom: 1.6rem; border-bottom: 1px solid var(--border); }
.doc-eyebrow { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--green-text); margin: 0 0 .5rem; }
.doc-eyebrow a { color: inherit; text-decoration: none; display: inline-block; padding: .6rem 0; margin: -.6rem 0; }
.doc-eyebrow a:hover { text-decoration: underline; }
.doc-hero h1 { font-size: clamp(1.9rem, 3.5vw, 2.6rem); line-height: var(--lh-tight); margin: 0 0 .7rem; }
.doc-hero .lede { max-width: 48rem; font-size: var(--fs-18); }
.doc-summary { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-22); line-height: var(--lh-tight); color: var(--ink); margin: 0 0 .7rem; max-width: 48rem; }
.doc-updated { font-size: var(--fs-14); color: var(--muted); margin: .9rem 0 0; }
.doc { display: grid; grid-template-columns: 14rem 1fr; gap: 2.6rem; align-items: start; }
.doc > nav { position: sticky; top: 4.6rem; align-self: start; }
.doc-nav { font-size: var(--fs-16); }
.doc-nav summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); min-height: var(--tap); font-family: var(--font-mono); font-size: var(--fs-14); color: var(--muted); }
.doc-nav summary::-webkit-details-marker { display: none; }
.doc-nav summary::after { content: ""; flex: none; width: .45rem; height: .45rem; margin: 0 var(--sp-1) 0 var(--sp-2); border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-25%) rotate(45deg); transition: transform .15s ease; }
.doc-nav[open] summary::after { transform: translateY(25%) rotate(-135deg); }
.doc-nav ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .12rem; }
.doc-nav a { display: block; color: var(--muted); text-decoration: none; padding: .35rem .55rem;
border-radius: .4rem; border-left: 2px solid transparent; }
.doc-nav a:hover { color: var(--ink); background: var(--sunken); border-left-color: var(--green); }
.doc-body { max-width: 42rem; }
.doc-body > h2:first-child, .doc-body > *:first-child { margin-top: 0; }
@media (max-width: 48rem) {
.doc { grid-template-columns: 1fr; gap: 1rem; }
.doc > nav { position: static; }
.doc-nav { position: static; margin-bottom: var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--card); padding: 0 var(--sp-4); }
.doc-nav summary { color: var(--ink); font-weight: var(--fw-semi); }
.doc-nav ol { list-style: decimal; padding: var(--sp-2) 0 var(--sp-2) var(--sp-5); gap: 0; border-top: 1px solid var(--border); color: var(--muted); }
.doc-nav li + li { border-top: 1px solid var(--border); }
.doc-nav a { display: flex; align-items: center; min-height: var(--tap); padding: var(--sp-2) var(--sp-2); border-left: 0; border-radius: 0; color: var(--link); font-size: var(--fs-16); }
.doc-nav a:hover { background: none; border-left: 0; text-decoration: underline; }
}
.dash { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; margin: 1.4rem 0 0; }
.dash > * { min-width: 0; }
@media (min-width: 74rem) {
.dash { grid-template-columns: minmax(0, 1fr) 19rem; column-gap: 2rem;
grid-template-areas: "head head" "move rail" "main rail" "priv rail";
grid-template-rows: auto auto 1fr auto; }
.dash-head { grid-area: head; }
.dash .bestmove { grid-area: move; }
.dash-rail { grid-area: rail; align-self: start; position: sticky; top: 4.5rem; }
.dash-main { grid-area: main; }
.dash .pathprivacy { grid-area: priv; }
.dash-lane { grid-template-areas: "head head" "main main"; grid-template-rows: auto 1fr; }
}
.dash-head { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; }
.dash-head-in { min-width: 0; }
.dash-head .eyebrow { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--green-text); margin: 0 0 .35rem; }
.dash-head h1 { font-size: clamp(1.7rem, 4.5vw, 2.3rem); font-weight: 800; letter-spacing: -.02em; margin: 0 0 .35rem; }
.dash-head .lede { font-size: var(--fs-18); color: var(--muted); margin: 0; max-width: 46rem; }
.dash-head .lede b { color: var(--emph); font-family: var(--font-display); font-weight: 800; }
.dash-back { margin: 0 0 .6rem; font-size: var(--text-small); }
.dash-back a { color: var(--muted); }
.dash-goal { margin: .8rem 0 0; }
.dash-goal p { margin: 0; color: var(--ink); font-weight: 600; }
.dash-goal-k { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--muted); margin-right: .4rem; }
.goal-edit { margin-top: .35rem; }
.goal-edit summary { color: var(--green-text); font-size: var(--text-small); font-weight: 600; cursor: pointer; width: max-content; padding: .3rem 0; }
.goal-form { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .6rem; }
.goal-form input { flex: 1 1 12rem; min-width: 0; font: inherit; padding: .7rem .85rem; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--ground); color: var(--ink); }
.goal-form input:focus { outline: 3px solid var(--focus); outline-offset: 1px; }
.goal-form .cta { padding: .7rem 1.2rem; }
.bestmove { background: var(--feature-bg); color: var(--feature-ink); border-radius: 1rem; padding: 1.3rem 1.4rem 1.4rem; box-shadow: var(--shadow); }
.bm-k { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--feature-muted); margin: 0 0 .45rem; }
.bestmove h2 { margin: 0 0 .3rem; font-size: clamp(1.3rem, 3.2vw, 1.6rem); font-weight: 800; letter-spacing: -.01em; line-height: 1.25; }
.bestmove h2 a { color: var(--feature-ink); text-decoration: none; }
.bestmove h2 a:hover { text-decoration: underline; }
.bm-org { color: var(--feature-muted); font-size: var(--text-small); margin: 0 0 .75rem; }
.bm-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .8rem; }
.bm-why { margin: 0 0 1rem; max-width: 44rem; }
.bm-why a { color: var(--feature-ink); }
.bestmove .cta { padding: .8rem 1.35rem; }
.dash-rail { display: grid; gap: 1rem; }
.rail-card { background: var(--card); border: 1px solid var(--border); border-radius: 1rem; padding: 1rem 1.1rem; box-shadow: var(--shadow); }
.rail-h { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); color: var(--muted); margin: 0 0 .7rem; }
.tk-details { margin-top: .9rem; }
.tk-details summary { cursor: pointer; font-weight: 600; font-size: var(--text-small); color: var(--ink); padding: .35rem 0; }
.tk-list { margin-top: .5rem; border-top: 1px solid var(--border); }
.tk-item { display: flex; align-items: center; gap: .3rem .6rem; flex-wrap: wrap; padding: .65rem 0; border-bottom: 1px solid var(--border); text-decoration: none; color: var(--ink); }
.tk-item:hover .tk-t { color: var(--green-text); }
.tk-t { font-weight: 600; font-size: var(--fs-16); flex: 1 1 10rem; min-width: 0; }
.tk-o { color: var(--muted); font-size: var(--text-small); }
.tk-more { color: var(--muted); font-size: var(--text-small); margin: .5rem 0 0; }
.tk-item .chip { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-14); padding: .22rem .55rem; border-radius: var(--radius-pill); border: 0; margin-left: auto; }
.tk-item .chip.applied { background: var(--chip-bg); color: var(--chip-ink); }
.tk-item .chip.heard_back { background: var(--confirmed-bg); color: var(--confirmed); }
.count { display: inline-block; min-width: 1.75rem; padding: 0 .45rem; border-radius: var(--r-pill); background: var(--chip-bg); color: var(--chip-ink); font-weight: var(--fw-bold); font-size: var(--fs-14); line-height: 1.5; text-align: center; letter-spacing: 0; }
.lane { margin: 1.6rem 0 0; scroll-margin-top: 4.5rem; }
.lane-head h2 { display: flex; align-items: center; gap: .55rem; margin: 0; font-size: var(--text-h2); font-weight: 800; }
.lane-note { margin: .3rem 0 0; color: var(--muted); font-size: var(--fs-16); max-width: 46rem; }
.lane-more { margin: .8rem 0 0; }
.lane-more a { color: var(--link); font-weight: 600; text-decoration: none; font-size: var(--fs-16); display: inline-flex; align-items: center; min-height: var(--tap); }
.lane-more a:hover { text-decoration: underline; }
.lane-empty { margin-top: .8rem; border: 1px dashed var(--border-strong); border-radius: 1rem; padding: 1.1rem 1.2rem; background: var(--sunken); color: var(--muted); }
.lane-empty p { margin: 0 0 .35rem; max-width: 40rem; }
.lane-empty .le-h { color: var(--ink); font-weight: 700; font-family: var(--font-display); }
.lane-empty .le-go { margin: .5rem 0 0; }
.lane-empty a { color: var(--link); font-weight: 600; }
.fchips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin: var(--sp-1) 0 0; }
.fchips-k { font-size: var(--fs-14); color: var(--muted); margin-right: var(--sp-1); }
.fchip { display: inline-flex; align-items: center; gap: var(--sp-2); min-height: var(--tap); padding: var(--sp-1) var(--sp-3) var(--sp-1) var(--sp-4); border-radius: var(--r-pill); background: var(--chip-bg); color: var(--chip-ink); text-decoration: none; font-size: var(--fs-14); font-weight: var(--fw-semi); }
.fchip span { font-size: var(--fs-14); font-weight: var(--fw-medium); line-height: 1; opacity: .85; }
.fchip:hover { outline: 1px solid var(--chip-ink); }
.pay-bar { margin: .2rem 0 .1rem; }
.pay-bar a:not(.fchip) { color: var(--link); font-weight: var(--fw-semi); font-size: var(--fs-14); }
.pay-card fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: .15rem; }
.pay-opt { display: flex; align-items: center; gap: .55rem; min-height: var(--tap); font-size: var(--fs-16); color: var(--ink); cursor: pointer; }
.pay-opt input { width: 1.1rem; height: 1.1rem; accent-color: var(--green-btn); margin: 0; }
.pay-card .cta { margin-top: .5rem; padding: .6rem 1.1rem; }
.pay-note { margin: .7rem 0 0; font-size: var(--fs-16); color: var(--muted); }
.acc-royal { --lane-acc: var(--acc-royal); --lane-acc-tint: var(--acc-royal-tint); }
.acc-teal { --lane-acc: var(--acc-teal); --lane-acc-tint: var(--acc-teal-tint); }
.acc-amber { --lane-acc: var(--acc-amber); --lane-acc-tint: var(--acc-amber-tint); }
.acc-violet { --lane-acc: var(--acc-violet); --lane-acc-tint: var(--acc-violet-tint); }
.acc-rose { --lane-acc: var(--acc-rose); --lane-acc-tint: var(--acc-rose-tint); }
.acc-green { --lane-acc: var(--acc-green); --lane-acc-tint: var(--acc-green-tint); }
.lane[class*="acc-"] .lane-head h2 { border-left: 4px solid var(--lane-acc); padding-left: .6rem; }
.lane[class*="acc-"] .lane-head .count { background: var(--lane-acc-tint); color: var(--lane-acc); }
.lane[class*="acc-"] .lrows { border-top: 3px solid var(--lane-acc); }
.lane[class*="acc-"] .lane-more a { color: var(--lane-acc); }
.lane-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .3rem 1rem; }
.lane-head > div { min-width: 0; }
.acc-pick { font-size: var(--text-small); }
.acc-pick summary { cursor: pointer; color: var(--muted); font-weight: 600; padding: .45rem 0; list-style: none; display: inline-flex; align-items: center; gap: .4rem; }
.acc-pick summary::-webkit-details-marker { display: none; }
.acc-pick summary::before { content: ""; width: .8rem; height: .8rem; border-radius: 50%; background: var(--lane-acc, var(--border-strong)); }
.acc-pick form { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-top: .3rem; }
.acc-pick fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.acc-opt { display: inline-flex; align-items: center; gap: .35rem; min-height: var(--tap); padding: 0 .6rem; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--card); color: var(--ink); cursor: pointer; }
.acc-opt i { width: .85rem; height: .85rem; border-radius: 50%; background: var(--lane-acc); }
.acc-opt input { accent-color: var(--lane-acc); margin: 0; }
.acc-pick .cta { padding: .5rem 1rem; }
.pay-details summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; min-height: var(--tap); color: var(--ink); font-size: var(--fs-16); font-weight: 600; }
.pay-details summary::-webkit-details-marker { display: none; }
.pay-change { color: var(--green-text); font-size: var(--text-small); flex: none; }
.pay-details[open] .pay-change { visibility: hidden; }
.pay-details form { margin-top: .4rem; }
.pay-card .floor { margin-top: .8rem; display: block; }
.pay-card .floor legend { font-weight: 600; font-size: var(--fs-16); color: var(--ink); padding: 0; margin-bottom: .35rem; }
.pay-card .floor legend span { color: var(--muted); font-weight: 400; }
.floor-row { display: grid; grid-template-columns: 5.2rem minmax(0, 1fr) 6.6rem; gap: .35rem; }
.floor-row select, .floor-row input { min-width: 0; font: inherit; font-size: var(--fs-16); padding: .55rem .5rem; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--ground); color: var(--ink); min-height: var(--tap); }
.floor-row input:focus, .floor-row select:focus { outline: 3px solid var(--focus); outline-offset: 1px; }
.pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: 1.4rem 0 0; font-size: var(--fs-16); color: var(--muted); }
.pager a { color: var(--link); font-weight: 600; min-height: 2.75rem; display: inline-flex; align-items: center; }
.pstat { font-weight: var(--fw-semi); font-size: var(--fs-14); padding: .125rem .625rem; border-radius: var(--r-pill); line-height: 1.5; }
.pstat.open { background: var(--green-tint); color: var(--green-text); }
.pstat.step { background: var(--step-bg); color: var(--step-ink); border: 1px solid var(--step-line); }
.pstat.wait, .pstat.far { background: var(--sunken); color: var(--muted); border: 1px solid var(--border-strong); }
.bestmove .pstat { background: rgba(255, 255, 255, .14); color: var(--feature-ink); border: 1px solid var(--feature-line); }
.bestmove .tag { color: var(--feature-muted); }
.bestmove .tag.when, .bestmove .tag.pay, .bestmove .tag.remote, .bestmove .tag.hybrid,
.bestmove .tag.onsite { color: var(--feature-ink); }
.bestmove .tag.soon { color: #FFD98A; }
.bestmove .tag.free { color: #A6F0B6; }
.bestmove .tag.fee, .bestmove .tag.checked.stale { color: #FFC2BC; }
.pc-step { background: var(--step-bg); border: 1px solid var(--step-line); border-radius: var(--r-md); padding: var(--sp-2) var(--sp-3); margin: 0 0 var(--sp-2); font-size: var(--fs-16); color: var(--ink); }
.pc-why { font-size: var(--fs-16); color: var(--muted); margin: 0 0 var(--sp-2); }
.pc-why-step { font-size: var(--fs-16); color: var(--ink); margin: 0 0 var(--sp-2); }
.pc-for { position: relative; padding-left: 1.5rem; font-size: var(--fs-16); font-weight: var(--fw-semi); color: var(--emph); margin: 0 0 var(--sp-2); line-height: 1.45; }
.pc-for .fy, .bm-for .fy, .wk-for .fy { display: block; }
.pc-for .fy-sep, .bm-for .fy-sep, .wk-for .fy-sep { display: none; }
.pc-for .fy ~ .fy, .bm-for .fy ~ .fy, .wk-for .fy ~ .fy { margin-top: var(--sp-1); }
.pc-for::before { content: ""; position: absolute; left: 0; top: .12rem; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: var(--i-target) center / contain no-repeat; mask: var(--i-target) center / contain no-repeat; }
.pc-fit { font-size: var(--fs-16); color: var(--muted); margin: 0 0 var(--sp-2); }
.pc-line { font-size: var(--fs-16); color: var(--ink); margin: 0 0 var(--sp-2); }
.pc-line.pc-nav { color: var(--muted); }
.pc-fit.warn { color: var(--step-ink); }
.pathprivacy { margin: 1.2rem 0 .5rem; color: var(--muted); font-size: var(--fs-16); }
.pathprivacy a { display: inline-block; padding: .55rem 0; }
@media (prefers-reduced-motion: no-preference) {
html:has(.dash) { scroll-behavior: smooth; }
.fchip { transition: border-color .15s ease, outline-color .15s ease; }
}
.dash-app { display: block; }
.dash-nav {
display: block; margin: calc(-1 * var(--sp-5)) calc(-1 * var(--gutter)) var(--sp-5);
background: var(--card); border-bottom: 1px solid var(--border);
position: sticky; top: var(--header-h); z-index: 10;
}
.dash-nav-places {
display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
padding: 0 var(--sp-2);
}
.dash-nav-places::-webkit-scrollbar { display: none; }
.dash-nav-places a {
flex: 1 0 auto; display: inline-flex; align-items: center; justify-content: center;
min-height: 3rem; padding: 0 var(--sp-2);
color: var(--muted); text-decoration: none; white-space: nowrap;
font-weight: var(--fw-semi); font-size: var(--fs-16);
box-shadow: inset 0 -3px 0 transparent;
}
.dash-nav-places a:hover { color: var(--ink); }
.dash-nav-places a[aria-current="page"] {
color: var(--emph); font-weight: var(--fw-bold); box-shadow: inset 0 -3px 0 var(--emph);
}
.dash-nav-you { display: none; }
.dash-body { min-width: 0; }
@media (max-width: 380px) { .dash-nav-places a { padding: 0 var(--sp-1); font-size: var(--fs-14); } }
@media (min-width: 64rem) {
.dash-app {
display: grid; grid-template-columns: 13rem minmax(0, 1fr); column-gap: var(--sp-6);
align-items: start;
}
.dash-nav {
position: sticky; top: calc(var(--header-h) + var(--sp-5)); margin: 0;
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg);
box-shadow: var(--sh-1); padding: var(--sp-3);
}
.dash-nav-places { flex-direction: column; overflow: visible; gap: var(--sp-1); padding: 0; }
.dash-nav-places a {
justify-content: flex-start; min-height: var(--tap); padding: 0 var(--sp-3);
border-radius: var(--r-md); box-shadow: none;
}
.dash-nav-places a:hover { background: var(--sunken); }
.dash-nav-places a[aria-current="page"] { background: var(--royal-tint); box-shadow: none; }
.dash-nav-you {
display: block; margin-top: var(--sp-3); padding-top: var(--sp-3);
border-top: 1px solid var(--border);
}
.dash-nav-places .dash-nav-tab-me { display: none; }
.dash-nav-me {
display: flex; flex-direction: column; padding: var(--sp-2) var(--sp-3);
border-radius: var(--r-md); color: var(--ink); text-decoration: none; line-height: 1.35;
}
a.dash-nav-me:hover { background: var(--sunken); }
a.dash-nav-me[aria-current="page"] { background: var(--royal-tint); }
.dash-nav-name { font-weight: var(--fw-bold); color: var(--ink); }
.dash-nav-sub { color: var(--muted); font-size: var(--fs-14); }
}
@media (max-width: 819px) {
.hero-in { padding-top: var(--sp-4); gap: var(--sp-4); padding-bottom: var(--sp-6); }
.hero .lede { font-size: var(--fs-16); margin-bottom: var(--sp-4); }
.trust { gap: var(--sp-2); }
.trust li { font-size: var(--fs-16); }
}
@media (max-width: 47.99rem) {
.ribbon { overflow-x: auto; scrollbar-width: none; margin-top: 0; padding: var(--sp-3) 0; }
.ribbon::-webkit-scrollbar { display: none; }
.ribbon-track { animation: none; padding: 0 var(--gutter); }
.rib-loop { display: none; }
.rib { width: 13.5rem; padding: var(--sp-2) var(--sp-3); }
.ribbon-lead { padding: 0 var(--gutter); margin-bottom: var(--sp-2); }
.steps-band { margin-top: var(--sp-6); }
.steps { gap: var(--sp-2); }
.steps li { padding: var(--sp-3); }
.steps h3 { font-size: var(--fs-16); }
.steps p { font-size: var(--fs-16); line-height: 1.45; }
.step-n { width: 2rem; height: 2rem; font-size: var(--fs-14); }
.facts { margin: var(--sp-6) 0; padding: var(--sp-3) var(--sp-2); gap: var(--sp-3) 0; }
.facts b { font-size: var(--fs-22); }
.facts .facts-date b { font-size: var(--fs-16); padding-top: .2rem; }
.facts span { font-size: var(--fs-14); line-height: 1.35; }
.home-kinds h2, .how h2 { margin-top: var(--sp-6); }
.home-open h2, .home-open .sub, .home-open .lrows { display: none; }
.home-open .home-all { margin-top: var(--sp-3); }
.home-all .more {
display: flex; align-items: center; justify-content: center; min-height: 3rem;
border: 1px solid var(--border-strong); border-radius: var(--r-md); background: var(--card);
color: var(--link); text-decoration: none; font-weight: var(--fw-bold);
}
.features { gap: var(--sp-2); margin-top: var(--sp-3); }
.feature { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); column-gap: var(--sp-3); padding: var(--sp-3); }
.feat-icon { width: 2.25rem; height: 2.25rem; padding: .45rem; grid-row: span 2; }
.feature h3 { margin: 0 0 2px; font-size: var(--fs-16); }
.feature p { font-size: var(--fs-16); line-height: 1.45; }
.home-share { padding: var(--sp-4); margin: var(--sp-6) 0 0; }
.home-share h2 { font-size: var(--fs-18); margin: 0 0 var(--sp-2); }
.home-share p { font-size: var(--fs-16); }
}
.themebtn, .acct-me, .menu, .topbar .signin { min-height: var(--tap); }
.themebtn { width: var(--tap); height: var(--tap); }
.avatar { width: 2.25rem; height: 2.25rem; }
.fchip, .pay-details summary, .acc-pick summary, .doc-nav a, .tabs a, .fd-opt, .fd-act, .gr-more summary, .me-opt, .me-btn, .me-edit summary, .ap-btn, .ap-tick, .ap-doc details summary, .ap-more summary, .ap-move select, .rem-details summary, .kit-tips summary, .wk-all summary, .dpager a, .pager a, .sharebtn, .cardbtn, .lr-more summary, .lr-save { min-height: var(--tap); }
.me-edit summary, .acc-pick summary { min-width: var(--tap); }
.card h3 a, .wk-t a, .bestmove h2 a, .drow :is(h3, h4) a, .gr-rows a, .tk-item, .ap-recs a,
.ap-tracker h3 a {
display: inline-block; padding: .75rem 0; margin: -.75rem 0;
}
.ap-which li > a, .kit-rail .kit-links li > a { display: flex; align-items: center; min-height: var(--tap); }
.muted { color: var(--muted); }
.closed-note {
margin: 0 0 var(--sp-4); padding: var(--sp-3) var(--sp-4); border-radius: var(--r-lg);
background: var(--problem-bg); color: var(--ink); font-size: var(--fs-16); line-height: 1.5;
border-left: 4px solid var(--problem);
}
.closed-note b { color: var(--problem); }
.closed-note a { font-weight: var(--fw-semi); white-space: nowrap; }
.tag.when.closed { color: var(--problem); font-weight: var(--fw-semi); }
.glance {
margin: 0 0 var(--sp-5); padding: var(--sp-5); border-radius: var(--r-xl);
background: var(--card); border: 1px solid var(--border);
box-shadow: var(--sh-2);
}
.glance-h {
margin: 0 0 var(--sp-4); font-size: var(--fs-22); font-weight: var(--fw-heavy);
line-height: var(--lh-snug); letter-spacing: -.02em;
}
.glance-list { margin: 0; display: grid; gap: var(--sp-3); }
.glance-list > div {
display: grid; gap: var(--sp-1); padding-bottom: var(--sp-3);
border-bottom: 1px solid var(--border);
}
.glance-list > div:last-child { padding-bottom: 0; border-bottom: 0; }
.glance-list dt { margin: 0; color: var(--muted); font-size: var(--fs-14); font-weight: var(--fw-semi); }
.glance-list dd { margin: 0; font-size: var(--fs-16); line-height: var(--lh-body); color: var(--ink); overflow-wrap: anywhere; }
.glance-list ul.gl-who { margin: 0; padding-left: 1.1rem; }
.glance-list ul.gl-who li { margin: 0 0 var(--sp-1); }
.glance-list p { margin: 0; }
.glance .gl-extra { color: var(--muted); }
.glance .gl-more { display: inline-flex; align-items: center; min-height: var(--tap); font-weight: var(--fw-semi); }
.glance .tz { display: block; margin-top: var(--sp-1); color: var(--muted); font-size: var(--fs-14); line-height: var(--lh-snug); }
@media (min-width: 720px) {
.glance-list > div { grid-template-columns: 9.5rem 1fr; gap: var(--sp-4); }
.glance-list dt { padding-top: .15rem; }
}
.ci { display: block; width: 18px; height: 18px; background: currentColor; }
.ci-bm { width: 16px; height: 16px; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-6-4.5L6 21z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-6-4.5L6 21z'/%3E%3C/svg%3E") center / contain no-repeat; }
.lr-save[aria-pressed="true"] .ci-bm { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-6-4.5L6 21z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-6-4.5L6 21z'/%3E%3C/svg%3E"); }
.ci-wa { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12.04 2C6.58 2 2.13 6.45 2.13 11.9c0 1.9.5 3.68 1.36 5.22L2 22l4.98-1.3a9.9 9.9 0 0 0 5.06 1.38h.01c5.46 0 9.9-4.45 9.9-9.9C21.95 6.45 17.5 2 12.04 2Zm0 18.15h-.01a8.2 8.2 0 0 1-4.18-1.15l-.3-.18-2.96.78.79-2.88-.2-.3a8.2 8.2 0 0 1-1.26-4.37c0-4.54 3.7-8.23 8.24-8.23 2.2 0 4.27.86 5.82 2.42a8.16 8.16 0 0 1 2.41 5.82c0 4.54-3.69 8.24-8.24 8.24Zm4.52-6.16c-.25-.13-1.47-.72-1.69-.8-.23-.09-.39-.13-.56.12-.16.25-.64.8-.79.97-.14.16-.29.18-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.02-.38.11-.51.11-.11.25-.29.37-.43.12-.15.16-.25.25-.42.08-.16.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.4-.42-.56-.42l-.48-.01c-.16 0-.43.06-.66.31-.22.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.57.12.16 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.1-.22-.16-.47-.29Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12.04 2C6.58 2 2.13 6.45 2.13 11.9c0 1.9.5 3.68 1.36 5.22L2 22l4.98-1.3a9.9 9.9 0 0 0 5.06 1.38h.01c5.46 0 9.9-4.45 9.9-9.9C21.95 6.45 17.5 2 12.04 2Zm0 18.15h-.01a8.2 8.2 0 0 1-4.18-1.15l-.3-.18-2.96.78.79-2.88-.2-.3a8.2 8.2 0 0 1-1.26-4.37c0-4.54 3.7-8.23 8.24-8.23 2.2 0 4.27.86 5.82 2.42a8.16 8.16 0 0 1 2.41 5.82c0 4.54-3.69 8.24-8.24 8.24Zm4.52-6.16c-.25-.13-1.47-.72-1.69-.8-.23-.09-.39-.13-.56.12-.16.25-.64.8-.79.97-.14.16-.29.18-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.02-.38.11-.51.11-.11.25-.29.37-.43.12-.15.16-.25.25-.42.08-.16.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.4-.42-.56-.42l-.48-.01c-.16 0-.43.06-.66.31-.22.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.57.12.16 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.1-.22-.16-.47-.29Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.ci-link { width: 17px; height: 17px; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.07 0l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.07 0l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.07 0l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.07 0l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") center / contain no-repeat; }
.kicon { display: inline-block; flex: none; width: 14px; height: 14px; background: currentColor;
-webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain;
-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
-webkit-mask-image: var(--ki); mask-image: var(--ki); }
.ki-job, .ki-internship, .ki-board { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E"); }
.ki-course { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h13v15H6a2 2 0 0 0-2 2z'/%3E%3Cpath d='M4 20a2 2 0 0 1 2-2h13'/%3E%3C/svg%3E"); }
.ki-scholarship { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-4 9 4-9 4-9-4z'/%3E%3Cpath d='M7 11v5c0 1 2.4 2 5 2s5-1 5-2v-5'/%3E%3C/svg%3E"); }
.ki-fellowship { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='5'/%3E%3Cpath d='M8.5 13l-2 8 5.5-3 5.5 3-2-8'/%3E%3C/svg%3E"); }
.ki-grant { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v10'/%3E%3Cpath d='M14.6 9.4c-.5-.9-1.5-1.4-2.6-1.4-1.7 0-2.8.9-2.8 2 0 2.7 5.6 1.5 5.6 4.2 0 1.2-1.2 2-2.8 2-1.2 0-2.3-.5-2.8-1.4'/%3E%3C/svg%3E"); }
.ki-accelerator, .ki-investment { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17l6-6 4 4 8-8'/%3E%3Cpath d='M15 7h6v6'/%3E%3C/svg%3E"); }
.ki-programme { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 5-9 5-9-5 9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3C/svg%3E"); }
.ki-competition { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4h8v5a4 4 0 0 1-8 0z'/%3E%3Cpath d='M8 6H5v1.5a3 3 0 0 0 3 3'/%3E%3Cpath d='M16 6h3v1.5a3 3 0 0 1-3 3'/%3E%3Cpath d='M10 15h4v3h-4z'/%3E%3Cpath d='M9 21h6'/%3E%3C/svg%3E"); }
.ki-residency { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1'/%3E%3Cpath d='M9 7h2M13 7h2M9 11h2M13 11h2M10 17h4v4'/%3E%3C/svg%3E"); }
.ki-network { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6' r='2.3'/%3E%3Ccircle cx='18' cy='6' r='2.3'/%3E%3Ccircle cx='12' cy='18' r='2.3'/%3E%3Cpath d='M8 7.2l3 8.8M16 7.2l-3 8.8M8.3 6h7.4'/%3E%3C/svg%3E"); }
.ki-loan { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6 9v0M18 15v0'/%3E%3C/svg%3E"); }
.ki-credits { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.6 5.6 6.1.7-4.5 4.2 1.2 6L12 16.5 6.6 19.5l1.2-6L3.3 9.3l6.1-.7z'/%3E%3C/svg%3E"); }
.ki-submission { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 3h10l4 4v14H5z'/%3E%3Cpath d='M15 3v4h4'/%3E%3Cpath d='M9 13h6M9 17h6'/%3E%3C/svg%3E"); }
.ki-apprenticeship { --ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18v3h3l6.3-6.3a4 4 0 0 0 5.4-5.4l-2.5 2.5-2.5-2.5 2.5-2.5z'/%3E%3C/svg%3E"); }
.unanswered {
background: var(--royal-tint); color: var(--ink); border-radius: var(--r-lg);
padding: var(--sp-4); margin: var(--sp-4) 0 0;
}
.unanswered p { margin: 0 0 var(--sp-3); }
.unanswered .un-h { font-weight: var(--fw-bold); font-size: var(--fs-18); line-height: var(--lh-snug); margin: 0 0 var(--sp-1); }
.unanswered .cta { width: 100%; }
@media (min-width: 48rem) { .unanswered .cta { width: auto; } }
.lrows {
container-type: inline-size;
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-xl);
box-shadow: var(--sh-2); overflow: hidden; margin: 0;
}
.lrows > * + * { border-top: 1px solid var(--border); }
.lrow {
position: relative; display: grid; align-items: start;
grid-template-columns: minmax(0, 1fr) auto;
grid-template-areas: "main act" "facts facts" "body body" "extra extra";
gap: var(--sp-1) var(--sp-3); padding: var(--sp-4) var(--sp-5);
transition: background-color .15s ease;
}
.lrow:hover { background: var(--sunken); }
.lrow:focus-within { outline: 3px solid var(--focus); outline-offset: -3px; }
@supports selector(:has(a)) {
.lrow:focus-within { outline: none; }
.lrow:has(.lr-t a:focus-visible) { outline: 3px solid var(--focus); outline-offset: -3px; }
}
.lr-main { grid-area: main; min-width: 0; }
.lr-t {
margin: 0; font-family: var(--font-sans); font-size: var(--fs-16); line-height: var(--lh-snug, 1.3); font-weight: var(--fw-semi);
display: block; overflow-wrap: anywhere;
}
.lr-t a { color: var(--link); text-decoration: none; padding-block: var(--sp-3); }
.lr-t a::after { content: ""; position: absolute; inset: 0; }
.lr-t a:focus-visible { outline: none; }
.lrow:hover .lr-t a { text-decoration: underline; text-underline-offset: .12em; }
.lr-org {
margin: 2px 0 0; font-size: var(--fs-14); color: var(--muted);
display: block; overflow-wrap: anywhere;
}
.lr-body { grid-area: body; min-width: 0; }
.lr-body > :first-child { margin-top: 0; }
.lr-sub { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-2); margin: var(--sp-2) 0 0; font-size: var(--fs-14); color: var(--ink); }
.lr-compare {
min-width: 0; flex: 1 1 8rem;
display: block; overflow-wrap: anywhere;
}
.lr-note { margin: var(--sp-1) 0 0; font-size: var(--fs-16); line-height: 1.4; color: var(--muted); }
.lr-note.fee, .lr-note.stale { color: var(--problem); font-weight: var(--fw-semi); }
.lr-note.warn, .lr-note.door { color: var(--step-ink); }
.lr-note.move, .lr-note.label { color: var(--ink); }
.lr-note.label { font-weight: var(--fw-semi); }
.lr-note.need { color: var(--step-ink); font-weight: var(--fw-semi); }
.lr-note.ask { color: var(--muted); }
.lr-body :is(a, button, form) { position: relative; z-index: 1; }
.lr-facts {
grid-area: facts; display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-3); min-width: 0;
margin: var(--sp-1) 0 0;
}
.lr-facts > * { flex: 0 1 auto; max-width: 100%; }
.lr-facts .tag.kind, .lr-when { white-space: nowrap; }
.lr-when { order: 2; }
.lr-where { order: 3; }
.tag.lr-where { display: block; flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-break: break-word; }
.tag.lr-where::before { display: inline-block; vertical-align: -.15em; margin-right: .375rem; }
.lr-where.lr-none { display: none; }
.lr-act { grid-area: act; position: relative; z-index: 1; display: flex; align-items: center; justify-content: flex-end; gap: var(--sp-1); }
.lr-act:empty { display: none; }
.lr-extra { grid-area: extra; position: relative; z-index: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--sp-4); }
.lr-extra > .lr-more[open], .lr-extra > .fd-undo, .lr-extra > .ap-tools, .lr-extra > form { flex-basis: 100%; }
.lr-extra { pointer-events: none; }
.lr-extra :is(a, button, summary, input, select, textarea, label, form, details[open]) { pointer-events: auto; }
.fd-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--sp-4); margin: 0; }
.fd-acts form { margin: 0; display: inline-flex; }
.fd-act, .fd-acts .rem-follow button { display: inline-flex; align-items: center; gap: var(--sp-1); min-height: var(--tap); padding: 0; border: 0; background: transparent; color: var(--link); font: inherit; font-size: var(--fs-14); font-weight: var(--fw-semi); text-decoration: underline; cursor: pointer; }
.fd-act:hover, .fd-acts .rem-follow button:hover { color: var(--ink); }
.fd-act:focus-visible, .fd-acts .rem-follow button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.fd-act svg { flex: none; }
.fd-act:disabled { cursor: wait; opacity: .7; }
.orgmore, .orgmore-sum { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--link); font-size: var(--fs-16); font-weight: var(--fw-semi); text-decoration: underline; text-underline-offset: .15em; }
.orgmore:hover { color: var(--ink); }
.orgmore:focus-visible, .orgmore-sum:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.orgmore-box { display: grid; gap: 0; margin-top: var(--sp-2); }
.orgmore-det > summary { cursor: pointer; }
.orgmore-det[open] > summary { margin-bottom: var(--sp-2); }
.lr-save {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-1);
min-width: var(--tap); min-height: var(--tap); padding: 0 var(--sp-3) 0 var(--sp-2);
border: 1.5px solid var(--border-strong); border-radius: var(--r-pill); background: var(--card);
color: var(--ink); font-family: var(--font-sans); font-weight: var(--fw-semi);
font-size: var(--fs-14); line-height: 1; cursor: pointer;
transition: border-color .12s, color .12s, background .12s;
}
.lr-save:hover { border-color: var(--emph); color: var(--emph); }
.lr-save:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.lr-save[aria-pressed="true"] { border-color: var(--green); color: var(--green-text); background: var(--green-tint); }
.lr-save[aria-busy="true"] { opacity: .7; }
.lr-save[hidden] { display: none; }
.save-note {
position: fixed; z-index: 40; left: var(--sp-4); right: var(--sp-4);
bottom: calc(var(--sp-4) + env(safe-area-inset-bottom, 0px));
max-width: 30rem; margin: 0 auto; padding: var(--sp-2) var(--sp-4);
border-radius: var(--r-md); background: var(--ink); color: var(--card);
font-size: var(--fs-16); line-height: 1.4; box-shadow: var(--sh-1);
}
.save-note:empty { display: none; }
.save-note a { display: inline-flex; align-items: center; min-height: var(--tap); color: inherit; font-weight: var(--fw-semi); text-decoration: underline; text-underline-offset: .15em; }
.save-note a:focus-visible { outline: 3px solid var(--card); outline-offset: 2px; }
@container (max-width: 40rem) {
.lr-save { padding: 0; width: var(--tap); }
.lr-save .savetxt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
.lr-more { margin: 0; font-size: var(--fs-16); }
.lr-more > summary {
display: inline-flex; align-items: center; gap: var(--sp-2); cursor: pointer; list-style: none;
color: var(--link); font-weight: var(--fw-semi);
}
.lr-more > summary::-webkit-details-marker { display: none; }
.lr-more > summary::after {
content: ""; flex: none; width: .45rem; height: .45rem; margin-top: -.2rem;
border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
}
.lr-more[open] > summary::after { transform: rotate(-135deg); margin-top: .2rem; }
.lr-more[open] { padding-bottom: var(--sp-2); }
.lr-more > :not(summary) { max-width: 46rem; }
.lr-more-h { margin: var(--sp-2) 0 var(--sp-1); font-weight: var(--fw-semi); color: var(--ink); }
.lr-tags { margin-top: var(--sp-2); }
.home-all { margin: var(--sp-3) 0 0; }
.lrow.s-open { box-shadow: inset 3px 0 0 var(--green); }
.lrow.s-step { box-shadow: inset 3px 0 0 var(--step-line); }
@container (min-width: 56rem) {
.lrow:not(.lr-path) {
grid-template-columns: minmax(0, 1fr) 7.5rem 11rem 10rem var(--lr-act, 6.5rem);
grid-template-areas: "main kind where when act" "body body body body ." "extra extra extra extra extra";
align-items: start; column-gap: var(--sp-4); row-gap: var(--sp-1); min-height: 4.5rem;
}
.lrow:not(.lr-path) .lr-facts { display: contents; }
.lrow:not(.lr-path) .lr-facts > .tag { margin-top: .125rem; }
.lrow:not(.lr-path) .lr-act { margin-top: -.5rem; }
.lrow:not(.lr-path) .lr-facts .tag.kind { grid-area: kind; justify-self: start; }
.lrow:not(.lr-path) :is(.tag.lr-where, .lr-where.lr-none) { grid-area: where; display: block; white-space: normal; overflow: visible; max-width: none; }
.lrow:not(.lr-path) .tag.lr-where { text-indent: -1.375rem; padding-left: 1.375rem; }
.lrow:not(.lr-path) .lr-when { grid-area: when; white-space: nowrap; }
.lr-sub > .pstat, .lr-sub > .ap-pill { flex: none; }
}
.lr-x { --lr-act: 9.5rem; }
.lr-path .lr-facts { gap: 0; margin-top: 2px; font-size: var(--fs-14); color: var(--muted); }
.lr-path .lr-facts > .tag { background: none; border: 0; padding: 0; color: inherit; font-size: inherit; font-weight: var(--fw-regular); }
.lr-path .lr-facts > .tag.soon { color: var(--step-ink); font-weight: var(--fw-semi); }
.lr-path .lr-facts > .tag::before { display: none; }
.lr-path .lr-facts > :is(.lr-when, .tag.lr-where)::before {
content: "\00b7"; display: inline; width: auto; height: auto; margin: 0 .5rem;
background: none; -webkit-mask: none; mask: none; color: var(--muted); font-weight: var(--fw-regular);
}
.lr-path .lr-facts .kicon { display: none; }
.lr-path .lr-sub { margin-top: var(--sp-1); }
.lr-path .lr-more > .fd-acts { margin-top: var(--sp-2); }
.lr-head {
position: absolute; width: 1px; height: 1px; overflow: hidden;
clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.lr-table > .lr-head + * { border-top: 0; }
.lr-table .lr-where.lr-none { display: inline; }
.lr-table .lr-when { font-variant-numeric: tabular-nums; }
.lr-notes { flex-basis: 100%; min-width: 0; }
.lr-notes:empty { display: none; }
.lr-notes > :first-child { margin-top: 0; }
.lr-table .lr-extra > .lr-notes + .lr-more { margin-top: var(--sp-1); }
.lr-table :is(.lr-t, .lr-org, .lr-compare) { display: block; -webkit-line-clamp: none; overflow: visible; }
.lr-table .lr-t { text-wrap: wrap; }
.lr-table .tag.lr-where { white-space: normal; overflow: visible; text-overflow: clip; }
.lr-table .lr-more > summary {
--lr-sum: 1.25rem;
min-height: 0; line-height: var(--lr-sum);
padding-block: calc((var(--tap) - var(--lr-sum)) / 2);
margin-block: calc((var(--tap) - var(--lr-sum)) / -2);
}
.lr-table .lr-more[open] > summary { margin-bottom: 0; }
.lr-fit-why { display: none; margin: var(--sp-2) 0 0; color: var(--ink); }
@container (min-width: 48rem) {
.lr-table .lrow.lr-path, .lr-table > .lr-head {
--lr-act: var(--tap);
--lr-cols: minmax(0, 1fr) 6rem 7rem 6.5rem 8rem var(--lr-act);
display: grid; grid-template-columns: var(--lr-cols); column-gap: var(--sp-3);
}
.lr-x .lrow.lr-path, .lr-x > .lr-head { --lr-act: calc(2 * var(--tap) + var(--sp-1)); }
.lr-table > .lr-head {
position: static; width: auto; height: auto; overflow: visible; clip: auto; clip-path: none;
align-items: end; padding: var(--sp-2) var(--sp-4);
background: var(--sunken); border-bottom: 1px solid var(--border);
font-size: var(--fs-14); font-weight: var(--fw-semi); line-height: 1.3; color: var(--muted);
}
.lr-head > :is(.lr-h-act, .lr-h-extra) {
position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
}
.lr-table .lrow.lr-path {
grid-template-areas: "main kind where when body act" "extra extra extra extra extra extra";
align-items: start; row-gap: 0; padding: var(--sp-3) var(--sp-4) var(--sp-2);
}
.lr-table .lr-path .lr-org { margin-top: 0; line-height: 1.3; }
.lr-table .lr-path .lr-facts { display: contents; }
.lr-table .lr-path .lr-facts > :is(.tag, .lr-none) {
margin-top: .1rem; white-space: normal; line-height: 1.4; color: var(--muted);
}
.lr-table .lr-path .lr-facts > .tag.soon { color: var(--step-ink); }
.lr-table .lr-path .lr-facts .tag.kind { grid-area: kind; }
.lr-table .lr-path :is(.tag.lr-where, .lr-where.lr-none) {
grid-area: where; display: block; overflow: visible; max-width: none; text-overflow: clip;
}
.lr-table .lr-path .lr-when { grid-area: when; }
.lr-table .lr-path .lr-facts > :is(.lr-when, .tag.lr-where)::before { display: none; }
.lr-table .lr-cw { display: none; }
.lr-table .lr-path .lr-body { grid-area: body; }
.lr-table .lr-path .lr-sub { margin: 0; }
.lr-table .lr-path .lr-sub > .pstat { flex: none; white-space: nowrap; }
.lr-table .lr-path .lr-compare { display: none; }
.lr-table .lr-fit-why { display: block; }
.lr-table .lr-path .lr-act { flex-direction: row; justify-content: flex-end; margin-top: -.6rem; }
.lr-table .lr-path .lr-extra:empty { display: none; }
.lr-table .lr-save { padding: 0; width: var(--tap); }
.lr-table .lr-save .savetxt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@container (min-width: 64rem) {
.lr-table .lrow.lr-path, .lr-table > .lr-head {
--lr-cols: minmax(0, 1fr) 7rem 9.5rem 7.5rem 8rem var(--lr-act);
--lr-act: 6.5rem; column-gap: var(--sp-4);
}
.lr-x .lrow.lr-path, .lr-x > .lr-head { --lr-act: 9.5rem; }
.lr-table .lr-save { padding: 0 var(--sp-3) 0 var(--sp-2); width: auto; }
.lr-table .lr-save .savetxt { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
}
@media (min-width: 64rem) {
@container (min-width: 30rem) {
.fd-split.open .lr-table .lrow.lr-path, .fd-split.open .lr-table > .lr-head {
--lr-act: var(--tap);
--lr-cols: minmax(0, 1fr) 5.5rem 7.5rem var(--lr-act);
display: grid; grid-template-columns: var(--lr-cols); column-gap: var(--sp-2);
padding-inline: var(--sp-3);
}
.fd-split.open .lr-x .lrow.lr-path, .fd-split.open .lr-x > .lr-head { --lr-act: calc(2 * var(--tap) + var(--sp-1)); }
.fd-split.open .lr-table > .lr-head {
position: static; width: auto; height: auto; overflow: visible; clip: auto; clip-path: none;
align-items: end; padding-block: var(--sp-2);
background: var(--sunken); border-bottom: 1px solid var(--border);
font-size: var(--fs-14); font-weight: var(--fw-semi); line-height: 1.3; color: var(--muted);
}
.fd-split.open .lr-head > :is(.lr-h-kind, .lr-h-where) { display: none; }
.fd-split.open .lr-head > :is(.lr-h-act, .lr-h-extra) {
position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
}
.fd-split.open .lr-table .lrow.lr-path {
grid-template-areas: "main when body act" "extra extra extra extra";
align-items: start; row-gap: 0; padding-block: var(--sp-3) var(--sp-2);
}
.fd-split.open .lr-table .lr-path .lr-facts { display: contents; }
.fd-split.open .lr-table .lr-path .lr-facts > :is(.tag.kind, .lr-where) { display: none; }
.fd-split.open .lr-table .lr-path .lr-when {
grid-area: when; margin-top: .1rem; white-space: normal; line-height: 1.4; color: var(--muted);
}
.fd-split.open .lr-table .lr-path .lr-when.soon { color: var(--step-ink); }
.fd-split.open .lr-table .lr-path .lr-when::before { display: none; }
.fd-split.open .lr-table .lr-cw { display: none; }
.fd-split.open .lr-table .lr-path .lr-body { grid-area: body; }
.fd-split.open .lr-table .lr-path .lr-sub { margin: 0; }
.fd-split.open .lr-table .lr-path .lr-sub > .pstat { flex: none; white-space: nowrap; }
.fd-split.open .lr-table .lr-path .lr-compare { display: none; }
.fd-split.open .lr-table .lr-fit-why { display: block; }
.fd-split.open .lr-table .lr-path .lr-act { flex-direction: row; justify-content: flex-end; margin-top: -.6rem; }
.fd-split.open .lr-table .lr-save { padding: 0; width: var(--tap); }
.fd-split.open .lr-table .lr-save .savetxt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
}
.fd-panel { display: none; }
@media (min-width: 64rem) {
.fd-split.open { display: grid; grid-template-columns: minmax(0, 1fr) minmax(22rem, 25rem); gap: var(--sp-5); align-items: start; }
.fd-split.open > .fd-panel {
display: block; position: sticky; top: calc(var(--header-h) + var(--fd-tabs, 0px) + var(--sp-3));
max-height: calc(100vh - var(--header-h) - var(--fd-tabs, 0px) - var(--sp-6)); overflow: auto; overscroll-behavior: contain;
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--sh-1);
padding: var(--sp-4) var(--sp-5) var(--sp-5); font-size: var(--fs-16);
}
.fd-split.open .lrow.is-sel { background: var(--royal-tint); box-shadow: inset 3px 0 0 var(--royal); }
.fd-split.open .lrow.is-sel .lr-more[open] > :not(summary) { display: none; }
}
.fd-pclose { float: right; margin: calc(-1 * var(--sp-2)) calc(-1 * var(--sp-3)) 0 var(--sp-2); width: var(--tap); height: var(--tap); border: 0; border-radius: var(--r-pill); background: transparent; color: var(--muted); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.fd-pclose:hover { background: var(--sunken); color: var(--ink); }
.fd-pclose:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.fd-pt { margin: 0; font-size: var(--fs-18); line-height: 1.25; font-weight: var(--fw-semi); }
.fd-pt a { color: var(--ink); text-decoration: none; }
.fd-pt a:hover { color: var(--link); text-decoration: underline; }
.fd-pt a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.fd-pmeta { margin: var(--sp-1) 0 0; color: var(--muted); }
.fd-panel > .fd-acts { margin: var(--sp-2) 0 var(--sp-1); padding-bottom: var(--sp-2); border-bottom: 1px solid var(--border); }
.fd-pbody > :first-child { margin-top: var(--sp-3); }
.fd-pfull { display: inline-flex; align-items: center; min-height: var(--tap); margin-top: var(--sp-2); color: var(--link); font-weight: var(--fw-semi); }
.fd-panel > .fd-acts > a.fd-act:first-child {
padding: 0 var(--sp-4); border-radius: var(--r-pill); background: var(--royal); color: #fff; text-decoration: none;
}
.fd-panel > .fd-acts > a.fd-act:first-child:hover { background: var(--royal-deep); color: #fff; }
.qf { border: 0; margin: 0; padding: 0; min-width: 0; }
.qf > legend { padding: 0; margin: 0 0 var(--sp-1); font-weight: var(--fw-bold); color: var(--ink); }
.qf-h { font-size: var(--text-h2); line-height: var(--leading-tight); margin: 0; }
.qf-h:focus { outline: none; }
.qf-h:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; border-radius: .2rem; }
.qf-hint { margin: 0 0 var(--sp-4); color: var(--muted); font-size: var(--fs-16); }
.qf-many { margin: 0 0 var(--sp-2); font-weight: 600; font-size: var(--fs-16); }
.choices { display: grid; gap: var(--sp-2); margin: 0; padding: 0; }
.choice {
display: flex; align-items: center; gap: var(--sp-3); min-height: 3.25rem;
padding: var(--sp-3) var(--sp-4); border: 1px solid var(--border);
border-radius: var(--r-lg); background: var(--card); color: var(--ink);
font-size: var(--fs-16); line-height: 1.35; cursor: pointer;
box-shadow: var(--sh-1);
transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s cubic-bezier(0.16, 1, 0.3, 1);
}
.choice:hover { border-color: var(--emph); box-shadow: var(--sh-2); transform: translateY(-1.5px); }
.choice input {
-webkit-appearance: none; appearance: none; flex: none; position: relative;
width: 1.375rem; height: 1.375rem; margin: 0; background: var(--card);
border: 2px solid var(--border-control); cursor: pointer;
transition: border-color .15s ease, background-color .15s ease;
}
.choice input[type="radio"] { border-radius: 50%; }
.choice input[type="checkbox"] { border-radius: .25rem; }
.choice input[type="radio"]:checked { border: .4rem solid var(--emph); }
.choice input[type="checkbox"]:checked { background: var(--emph); border-color: var(--emph); }
.choice input[type="checkbox"]:checked::before {
content: ""; position: absolute; left: .3rem; top: .05rem; width: .35rem; height: .7rem;
border-right: 2px solid var(--card); border-bottom: 2px solid var(--card); transform: rotate(45deg);
}
.choice:has(input:checked), .choice.is-on {
background: var(--royal-tint); border-color: var(--emph); font-weight: var(--fw-semi);
box-shadow: inset 0 0 0 1.5px var(--emph), 0 2px 10px rgba(15, 29, 91, 0.08);
}
.choice:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
@supports selector(:has(*)) { .choice input:focus-visible { outline: none; } }
.field { display: grid; gap: var(--sp-1); margin: 0 0 var(--sp-4); }
.field[hidden], .field-in[hidden] { display: none; }
.field-label { display: block; font-weight: var(--fw-bold); color: var(--ink); font-size: var(--fs-16); }
.field-err { margin: 0; color: var(--problem); font-weight: var(--fw-semi); font-size: var(--fs-16); }
.field-err[hidden] { display: none; }
.field-in {
display: block; width: 100%; min-height: 3rem; font: inherit;
font-size: var(--fs-16); padding: var(--sp-2) var(--sp-4); color: var(--ink);
background: var(--card); border: 1px solid var(--border-control); border-radius: var(--r-md);
}
.field-in:focus { outline: 3px solid var(--focus); outline-offset: 1px; border-color: var(--emph); }
.field-in[aria-invalid="true"] { border-color: var(--problem); }
.combo { position: relative; }
.combo-pop {
position: static; margin-top: var(--sp-1);
background: var(--card); border: 1px solid var(--border-control); border-radius: var(--r-md);
overflow: hidden;
}
.combo-pop[hidden] { display: none; }
.combo-k {
margin: 0; padding: var(--sp-2) var(--sp-4) var(--sp-1); font-size: var(--fs-14);
font-weight: var(--fw-semi); letter-spacing: .04em; text-transform: uppercase; color: var(--muted);
}
.combo-list { list-style: none; margin: 0; padding: 0 0 var(--sp-1); max-height: 17rem; overflow-y: auto; }
.combo-opt {
display: flex; align-items: center; flex-wrap: wrap; min-height: var(--tap);
padding: var(--sp-2) var(--sp-4); cursor: pointer; color: var(--ink);
}
.combo-opt[aria-selected="true"], .combo-opt:hover { background: var(--royal-tint); color: var(--ink); }
.combo-opt[aria-selected="true"] { box-shadow: inset 3px 0 0 var(--emph); }
.combo-alias { color: var(--muted); font-size: var(--fs-14); margin-left: var(--sp-2); }
.shortcuts { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--sp-1); margin: var(--sp-1) 0 0; color: var(--muted); font-size: var(--fs-16); }
.shortcuts button {
display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--sp-1);
background: none; border: 0; font: inherit; color: var(--link); text-decoration: underline;
text-underline-offset: .15em; cursor: pointer;
}
.shortcuts button[aria-pressed="true"] { font-weight: var(--fw-bold); text-decoration-thickness: 2px; }
.qnav { display: flex; gap: var(--sp-3); margin: var(--sp-5) 0 0; }
.qbtn {
display: inline-flex; align-items: center; justify-content: center; min-height: 3rem;
padding: var(--sp-2) var(--sp-5); border-radius: var(--r-md); font: inherit;
font-size: var(--fs-16); font-weight: var(--fw-bold); line-height: 1.25; text-align: center;
cursor: pointer; text-decoration: none;
}
.qbtn-back { flex: 1 1 0; background: var(--card); color: var(--ink); border: 1px solid var(--border-control); }
.qbtn-back:hover { border-color: var(--emph); }
.qbtn-next { flex: 2 1 0; background: var(--royal); color: var(--on-royal); border: 1px solid var(--emph); }
.qbtn-next:hover { background: var(--royal-deep); }
.qbtn[hidden] { display: none; }
.quiet-link {
display: inline-flex; align-items: center; min-height: var(--tap); padding: 0;
background: none; border: 0; font: inherit; font-size: var(--fs-16); color: var(--link);
text-decoration: underline; text-underline-offset: .15em; cursor: pointer;
}
@media (forced-colors: active) {
.choice { border: 1px solid CanvasText; }
.choice:has(input:checked), .choice.is-on { border: 3px solid Highlight; }
.choice input { border-color: CanvasText; forced-color-adjust: none; background: Canvas; }
.choice input[type="radio"]:checked { border-color: Highlight; }
.choice input[type="checkbox"]:checked { background: Highlight; border-color: Highlight; }
.choice input[type="checkbox"]:checked::before { border-color: Canvas; }
.combo-opt[aria-selected="true"] {
forced-color-adjust: none; background: Highlight; color: HighlightText;
}
.qbtn, .field-in, .combo-pop { border: 1px solid CanvasText; }
.substep { border: 1px solid CanvasText; }
}
.home-kinds.kx h2 { margin-bottom: var(--sp-3); }
.kx-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
.kx-top { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
a.kx-card {
display: flex; align-items: center; gap: var(--sp-3); min-width: 0;
min-height: 3.5rem; padding: var(--sp-3) var(--sp-4);
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg);
box-shadow: var(--shadow); color: var(--ink); text-decoration: none;
transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background-color .15s ease;
}
a.kx-card:hover { border-color: var(--green); box-shadow: var(--sh-2); transform: translateY(-2px); }
a.kx-card:focus-visible { border-radius: var(--r-lg); }
a.kx-pill:focus-visible { border-radius: var(--r-pill); }
.kx-more > summary:focus-visible { border-radius: var(--r-md); }
.kx-ic { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: var(--r-md); background: var(--royal-tint); color: var(--emph); }
.kx-ic .kicon { width: 18px; height: 18px; }
.kx-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kx-n { font-size: var(--fs-18); font-weight: var(--fw-heavy); line-height: 1.15; letter-spacing: -.02em; color: var(--emph); font-variant-numeric: tabular-nums; }
.kx-name { font-size: var(--fs-14); font-weight: var(--fw-semi); line-height: 1.25; overflow-wrap: anywhere; }
a.kx-card.kx-lead {
min-height: 4rem;
background: linear-gradient(135deg, var(--royal-deep), var(--royal));
border-color: var(--on-royal-line);
color: var(--on-royal);
box-shadow: var(--sh-2);
}
a.kx-card.kx-lead:hover {
background: linear-gradient(135deg, var(--royal), var(--royal-soft));
border-color: var(--green);
box-shadow: var(--sh-3);
transform: translateY(-2px);
}
.kx-lead .kx-ic { background: var(--on-royal-tint); color: var(--on-royal); }
.kx-lead .kx-n { font-size: var(--fs-22); line-height: 1.1; color: var(--on-royal); }
.kx-lead .kx-name { color: var(--on-royal); }
.kx-more > summary {
list-style: none; cursor: pointer;
display: flex; align-items: center; justify-content: center; gap: var(--sp-2);
min-height: 3rem; padding: 0 var(--sp-4);
background: var(--card); border: 1px solid var(--border-strong); border-radius: var(--r-md);
color: var(--link); font-size: var(--fs-16); font-weight: var(--fw-bold);
}
.kx-more > summary:hover { border-color: var(--emph); }
.kx-more > summary::-webkit-details-marker { display: none; }
.kx-more > summary::after {
content: ""; flex: none; width: .45rem; height: .45rem; margin-top: -.15rem;
border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
transform: rotate(45deg); transition: transform .15s ease;
}
.kx-more[open] > summary::after { margin-top: .2rem; transform: rotate(-135deg); }
.kx-more[open] > summary { margin-bottom: var(--sp-2); }
.kx-sum-n { flex: none; }
.kx-hint { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: var(--fs-14); font-weight: var(--fw-regular); }
.kx-tail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
a.kx-pill {
display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); min-width: 0;
min-height: var(--tap); padding: var(--sp-2) var(--sp-4);
background: var(--card); border: 1px solid var(--border); border-radius: var(--r-pill);
box-shadow: var(--sh-1);
color: var(--ink); text-decoration: none; font-size: var(--fs-14); font-weight: var(--fw-semi); line-height: 1.25;
transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
a.kx-pill:hover { border-color: var(--green); box-shadow: var(--sh-2); transform: translateY(-1px); }
a.kx-pill span { min-width: 0; overflow-wrap: anywhere; }
a.kx-pill b { flex: none; color: var(--muted); font-weight: var(--fw-medium); font-variant-numeric: tabular-nums; }
@media (max-width: 23.75rem) {
a.kx-card { gap: var(--sp-2); padding: var(--sp-2); }
.kx-ic { width: 1.75rem; height: 1.75rem; }
a.kx-pill { gap: var(--sp-1); padding-inline: var(--sp-2); }
}
@media (prefers-reduced-motion: reduce) {
a.kx-card, a.kx-pill, .kx-more > summary, .kx-more > summary::after { transition: none; }
}
@media (min-width: 48rem) {
.kx-top { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kx-tail { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
a.kx-pill { display: inline-flex; justify-content: flex-start; }
.kx-more > summary { width: fit-content; }
}
@supports selector(::details-content) {
@media (min-width: 48rem) {
.kx-more::details-content { content-visibility: visible; }
.kx-more > summary { display: none; }
}
}
@media (min-width: 64rem) {
.kx-body { grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-4); align-items: center; }
.kx-top { grid-template-columns: repeat(2, 10.5rem); }
}
.home-relocation { margin: var(--sp-6) 0; border-left: 4px solid var(--accent); }
.home-relocation .pill { display: inline-block; padding: 2px 10px; font-size: var(--fs-14); font-weight: var(--fw-semi); background: var(--green-tint); color: var(--green-text); border-radius: var(--r-pill); margin-bottom: var(--sp-2); }
.home-relocation h2 { margin: 0 0 var(--sp-2); font-size: var(--fs-22); }
.home-relocation .lead { margin: 0 0 var(--sp-4); color: var(--muted); font-size: var(--fs-16); line-height: var(--lh-base); max-width: 42rem; }
.rl-04b6b1 { font-size:var(--fs-22);margin:0 0 var(--sp-3);color:var(--problem); }
.rl-0ba1d4 { margin:var(--sp-1) 0 0;color:var(--muted); }
.rl-114bb3 { margin:0 0 var(--sp-2);font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--green-text); }
.rl-18bb20 { display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-3);margin:var(--sp-3) 0 0;padding-top:var(--sp-3);border-top:1px solid var(--border); }
.rl-1ab585 { color:var(--muted);margin-bottom:var(--sp-4); }
.rl-1ed79e { margin:var(--sp-3) 0 0;display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center; }
.rl-28ca4a { padding-left:var(--sp-4);font-size:var(--fs-16);line-height:1.5; }
.rl-3edf93 { margin-bottom:var(--sp-5); }
.rl-426b43 { cursor:pointer;min-height:var(--tap);display:flex;align-items:center; }
.rl-44acea { margin:var(--sp-2) 0 0;padding-left:var(--sp-4);font-size:var(--fs-16); }
.rl-44fc12 { font-size:var(--fs-18);line-height:1.55;color:var(--muted); }
.rl-4818a0 { margin:0 0 var(--sp-1);color:var(--muted); }
.rl-closed { display:inline-block;padding:2px 10px;font-size:var(--fs-14);font-weight:var(--fw-semi);background:var(--problem-bg);color:var(--problem);border-radius:var(--r-pill); }
.rl-4d01e7 { font-size:var(--fs-22);margin:var(--sp-5) 0 var(--sp-2); }
.rl-5012ee { margin-top:var(--sp-3);font-size:var(--fs-14);color:var(--muted); }
.rl-58040d { display:inline-block;padding:2px 10px;font-size:var(--fs-14);font-weight:var(--fw-semi);background:var(--green-tint);color:var(--green-text);border-radius:var(--r-pill); }
.rl-5e4ff9 { font-size:var(--fs-14);color:var(--muted);font-weight:var(--fw-semi); }
.rl-683deb { margin-bottom:var(--sp-5);padding:var(--sp-4);background:var(--problem-bg);border:1px solid var(--problem);border-radius:var(--r-lg); }
.rl-7285cd { margin:var(--sp-2) 0 0; }
.rl-77ed97 { color:var(--muted); }
.rl-7930e6 { margin:0 0 var(--sp-3);font-weight:var(--fw-semi); }
.rl-872bd1 { display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);list-style:none;padding:0;margin:0;font-size:var(--fs-16); }
.rl-8a1e6f { font-size:var(--fs-22);margin:0 0 var(--sp-2);color:var(--problem); }
.rl-989644 { min-height:var(--tap);padding:0 var(--sp-4);border:0;border-radius:var(--r-pill);background:var(--green-btn);color:var(--on-royal);font:inherit;font-weight:var(--fw-semi);cursor:pointer; }
.rl-9b5bef { margin:0 0 var(--sp-1);font-size:var(--fs-22);line-height:1.3; }
.rl-9edd88 { margin:0;padding-left:var(--sp-4);font-size:var(--fs-16);line-height:1.5; }
.rl-a48bf8 { margin:var(--sp-3) 0 var(--sp-2);font-weight:var(--fw-semi); }
.rl-a5ade0 { font-size:var(--fs-22);margin-bottom:var(--sp-3); }
.rl-a77e15 { margin:var(--sp-3) 0 0; }
.rl-ad7300 { margin:var(--sp-2) 0 0;font-size:var(--fs-16); }
.rl-b53d96 { margin:0 0 var(--sp-3);font-size:var(--fs-14); }
.rl-b8495c { margin-bottom:var(--sp-6); }
.rl-c3092c { display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-3); }
.rl-c39d85 { margin-bottom:var(--sp-4);padding:var(--sp-4);background:var(--card);border:1px solid var(--border);border-radius:var(--r-md); }
.rl-ccea6a { margin:0 0 var(--sp-2);font-size:var(--fs-18); }
.rl-ce7ec7 { margin:0;padding-left:var(--sp-4);color:var(--ink);font-size:var(--fs-16);line-height:1.5; }
.rl-d320a0 { font-size:var(--fs-18);margin:0 0 var(--sp-2); }
.rl-d9cdff { margin:0;font-size:var(--fs-16); }
.rl-da8c9b { padding:var(--sp-4);background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);margin-bottom:var(--sp-4); }
.rl-de7061 { margin:0 0 var(--sp-4); }
.rl-e6b855 { margin-bottom:var(--sp-6);padding:var(--sp-5);background:var(--problem-bg);border:1px solid var(--problem);border-radius:var(--r-lg); }
.rl-fact-label { font-size:var(--fs-14);color:var(--muted);font-weight:var(--fw-semi); }
.rl-e78bf1 { font-size:var(--fs-22);margin-bottom:var(--sp-1); }
.rl-e8f898 { margin:0 0 var(--sp-3); }
.rl-f177d3 { margin:0 0 var(--sp-3);color:var(--muted); }
.rl-f54f80 { padding-left:var(--sp-4);font-size:var(--fs-16);line-height:1.6; }
.rl-f75bde { margin:0 0 var(--sp-1);display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center; }
.rl-fd8db7 { margin:0;color:var(--muted);font-size:var(--fs-14); }
.rl-ff3548 { margin:0 0 var(--sp-2);color:var(--muted);font-size:var(--fs-16); }
.rl-fact-wide { grid-column: 1 / -1; }
.rl-fact-value { margin: 2px 0 0; font-size: var(--fs-16); }
.rl-fact-value.rl-muted { color: var(--muted); }
.rl-note { margin: 0 0 var(--sp-1); }
.rl-note-good { color: var(--green-text); }
.rl-note-short { color: var(--problem); }
.rl-note-info { color: var(--muted); }
.rl-route { margin-bottom: var(--sp-4); padding: var(--sp-5); border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--card); box-shadow: var(--sh-1); }
.rl-official { display: inline-flex; align-items: center; padding: 0 var(--sp-4); min-height: var(--tap); background: var(--green-btn); color: var(--on-royal); border-radius: var(--r-pill); font-weight: var(--fw-semi); text-decoration: none; font-size: var(--fs-16); }
.rl-li { margin-bottom: var(--sp-2); }
.rl-countries { margin-bottom: var(--sp-5); }
.consent{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:60;max-width:34rem;margin:0 auto;
padding:1rem 1.1rem;background:var(--card);color:var(--ink);border:1px solid var(--border-strong);
border-radius:12px;box-shadow:var(--sh-3)}
.consent p{margin:0 0 .75rem;font-size:.95rem;line-height:1.45}
.consent-row{display:flex;gap:.6rem;flex-wrap:wrap}
.consent-row button{font:inherit;padding:.55rem 1.1rem;border-radius:8px;cursor:pointer;min-height:44px}
.consent-yes{background:var(--royal);color:var(--on-royal);border:1px solid transparent}
.consent-no{background:transparent;color:inherit;border:1px solid var(--border-control)}
#cookieChoices[hidden]{display:none}
.oc { margin: 0 auto 1rem; max-width: 46rem; }
.oc-banner { background: var(--card); border: 1px solid var(--border); border-radius: 1rem; padding: .75rem 1rem; margin-top: .75rem; }
.oc-q { margin: 0 0 .5rem; font-weight: 600; color: var(--ink); }
.oc-why { margin: 0 0 .75rem; color: var(--muted); font-size: .9375rem; }
.oc-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.oc-btn { min-height: 44px; padding: 0 1.1rem; border-radius: .75rem; border: 1px solid var(--royal); background: var(--card); color: var(--royal); font: inherit; font-weight: 600; cursor: pointer; }
.oc-btn:hover, .oc-btn:focus-visible { background: var(--royal); color: var(--card); }
.oc-x { min-height: 44px; padding: 0 .75rem; border: 0; background: none; color: var(--muted); font: inherit; text-decoration: underline; cursor: pointer; }
.oc-forget { margin: 0 auto 1rem; max-width: 46rem; }
.listbox { padding: var(--sp-4); margin: var(--sp-6) 0 0; }
.listbox h2 { font-size: var(--fs-18); margin: 0 0 var(--sp-2); }
.listbox p { font-size: var(--fs-16); }
.listform { margin: var(--sp-3) 0; }
.listhp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.listnote { color: var(--muted); }
.partner-grid { list-style: none; margin: var(--sp-4) 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: var(--sp-3); }
.partner-grid li { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: var(--sp-4); text-align: center; }
.partner-grid a { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); min-height: var(--tap); color: var(--ink); text-decoration: none; font-weight: var(--fw-semi); }
.partner-grid a:hover { text-decoration: underline; }
.partner-grid img { max-width: 100%; max-height: 4rem; height: auto; width: auto; }
.badge-demo { margin: var(--sp-4) 0; }
.badge-demo img { display: block; max-width: 100%; height: auto; }
.snippet { margin: var(--sp-3) 0; padding: var(--sp-3) var(--sp-4); background: var(--sunken); border: 1px solid var(--border); border-radius: var(--r-md); overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--fs-14); line-height: var(--lh-base); }