/* ============================================================================
   THE HUB

   Guides filed by tier. The tier chooser is the most important thing on the
   page, because reading advice written for somebody at a different point in
   the journey is how a site stops feeling like it was written for you.
   ========================================================================== */
.uaia-hub{width:100%;max-width:min(72rem,100%);margin-inline:auto}

.uaia-hub__top{margin-bottom:clamp(28px,4vw,44px)}
.uaia-hub__heading{
	margin:0 0 12px;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.03em;line-height:1.1;
	font-size:clamp(1.7rem,4vw,2.7rem);color:var(--ivory,#F6F0E6);max-width:22ch;
}
.uaia-hub__intro{
	margin:0 0 26px;font-size:1.02rem;line-height:1.62;
	color:var(--dim,rgba(246,240,230,.74));max-width:56ch;
}

.uaia-hub__search{display:flex;gap:10px;flex-wrap:wrap;max-width:36rem}
.uaia-hub__search input[type=search]{
	flex:1 1 16rem;min-height:54px;padding:14px 18px;
	background:var(--ink-2,#1D1815);color:var(--ivory,#F6F0E6);
	border:1.5px solid var(--line,rgba(246,240,230,.16));
	border-radius:var(--r-pill,999px);font:inherit;font-size:.98rem;
	transition:border-color .25s ease,box-shadow .25s ease;
	-webkit-appearance:none;appearance:none;
}
.uaia-hub__search input[type=search]:focus{
	outline:none;border-color:var(--amber,#F2A413);
	box-shadow:0 0 0 3px rgba(242,164,19,.2);
}
.uaia-hub__search button{
	flex:none;min-height:54px;padding:15px 30px;border:0;
	border-radius:var(--r-pill,999px);
	background:var(--amber,#F2A413);color:var(--on-light,#14100D);
	font:inherit;font-size:.92rem;font-weight:600;cursor:pointer;
	transition:transform .25s ease,background .25s ease;
}
.uaia-hub__search button:hover{transform:translateY(-2px);background:var(--light-surface,#F6F0E6)}

/* ---- the tier chooser ---------------------------------------------------- */
.uaia-hub__tiers{
	display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
	gap:10px;margin-bottom:22px;
}
.uaia-hub__tiers a{
	display:block;padding:16px 18px;text-decoration:none;
	border-radius:var(--r-md,14px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.13));
	color:var(--dim,rgba(246,240,230,.74));
	transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.uaia-hub__tiers a:hover{transform:translateY(-2px);border-color:rgba(246,240,230,.3)}
.uaia-hub__tiers a.is-on{
	background:var(--amber,#F2A413);color:var(--on-light,#14100D);border-color:transparent;
}
.uaia-hub__tiername{
	display:block;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.02em;font-size:1.02rem;
	color:var(--ivory,#F6F0E6);
}
.uaia-hub__tiers a.is-on .uaia-hub__tiername{color:var(--on-light,#14100D)}
.uaia-hub__tiergoal{
	display:block;margin-top:3px;
	font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
	color:var(--amber-ink,#F2A413);
}
.uaia-hub__tiers a.is-on .uaia-hub__tiergoal{color:rgba(20,16,13,.72)}

.uaia-hub__tierwhy{
	margin:0 0 26px;padding:16px 20px;
	border-radius:var(--r-md,14px);
	background:rgba(242,164,19,.08);border-left:3px solid var(--amber,#F2A413);
	font-size:.95rem;line-height:1.6;color:var(--dim,rgba(246,240,230,.8));
	max-width:64ch;
}

/* ---- guides -------------------------------------------------------------- */
.uaia-hub__grid{
	display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;
}
.uaia-guide{
	border-radius:var(--r-md,14px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.13));
	transition:transform .3s ease,border-color .3s ease;
	overflow:hidden;
}
.uaia-guide:hover{transform:translateY(-3px);border-color:rgba(246,240,230,.28)}
.uaia-guide__link{display:block;padding:24px 22px 22px;text-decoration:none}
.uaia-guide__tier{
	display:inline-block;margin:0 0 10px;padding:4px 11px;
	border-radius:var(--r-pill,999px);
	background:rgba(242,164,19,.16);color:var(--amber-ink,#F2A413);
	font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
}
.uaia-guide__tier--success{background:rgba(126,146,112,.2);color:var(--sage-ink,#7E9270)}
.uaia-guide__tier--legacy{background:rgba(210,85,31,.18);color:var(--terra-ink,#D2551F)}
.uaia-guide__title{
	margin:0 0 8px;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.02em;line-height:1.24;
	font-size:1.12rem;color:var(--ivory,#F6F0E6);
}
.uaia-guide__sub{
	margin:0 0 12px;font-size:.9rem;line-height:1.55;
	color:var(--dim,rgba(246,240,230,.7));
}
.uaia-guide__meta{
	margin:0;font-size:.72rem;font-weight:600;
	letter-spacing:.06em;text-transform:uppercase;
	color:var(--dimmer,rgba(246,240,230,.45));
}

.uaia-hub__empty{
	padding:44px 28px;text-align:center;
	border-radius:var(--r-md,14px);
	background:var(--ink-2,#1D1815);
	border:1px dashed var(--line,rgba(246,240,230,.2));
}
.uaia-hub__empty h3{
	margin:0 0 8px;font-family:var(--font-display,inherit);
	font-weight:700;font-size:1.25rem;color:var(--ivory,#F6F0E6);
}
.uaia-hub__empty p{margin:0;color:var(--dim,rgba(246,240,230,.7));font-size:.95rem;line-height:1.6}

.uaia-hub__disclaimer{
	margin:clamp(32px,5vw,56px) 0 0;padding-top:22px;
	border-top:1px solid var(--line,rgba(246,240,230,.13));
	font-size:.84rem;line-height:1.6;
	color:var(--dimmer,rgba(246,240,230,.5));max-width:68ch;
}

/* ---- on a guide itself --------------------------------------------------- */
.uaia-guide__warn{
	margin:32px 0 0;padding:16px 20px;
	border-radius:var(--r-md,14px);
	background:rgba(210,85,31,.14);border-left:3px solid var(--clay,#D2551F);
	font-size:.95rem;line-height:1.6;
}
.uaia-guide__official{
	margin:20px 0 0;padding:18px 20px;
	border-radius:var(--r-md,14px);
	background:rgba(126,146,112,.12);border-left:3px solid var(--sage,#7E9270);
}
.uaia-guide__official a{font-weight:600;font-size:1rem}
.uaia-guide__official span{
	display:block;margin-top:5px;font-size:.84rem;
	color:var(--dimmer,rgba(246,240,230,.55));
}
.uaia-guide__checked{
	margin:20px 0 0;font-size:.78rem;font-weight:600;
	letter-spacing:.08em;text-transform:uppercase;
	color:var(--dimmer,rgba(246,240,230,.45));
}
.uaia-guide__disclaimer{
	margin:12px 0 0;font-size:.84rem;line-height:1.6;
	color:var(--dimmer,rgba(246,240,230,.5));max-width:64ch;
}

@media(max-width:640px){
	.uaia-hub__tiers{grid-template-columns:1fr}
	.uaia-hub__grid{grid-template-columns:1fr}
	.uaia-hub__search button{width:100%}
}

/* ============================================================================
   A CHAPTER'S SHELF

   The three tiers as doors rather than a filter bar, because choosing where
   you are is the first useful thing this site asks anybody.
   ========================================================================== */
.uaia-ch{
	width:100%;

	/* The shelf is rendered by Core and dropped into a chapter page owned by
	   Chapters, so it never inherited that page's container: no measure and
	   no gutter, which is why the headline sat flush against the left edge
	   of the viewport and the cards ran past both sides.

	   It uses the chapter page's tokens where they exist, and the site's own
	   wrap and gutter otherwise, so it is never a third container with a
	   third set of numbers. */
	/* Chapters lists this in its own container rule alongside every other
	   top level block, so it is not set twice. These apply when the shelf
	   is used anywhere else. */
	max-width:min(var(--cp-measure,var(--wrap,1240px)),100%);
	margin-inline:auto;
	padding-inline:var(--cp-gutter,var(--gutter,22px));
	padding-block:var(--cp-band,clamp(34px,4.5vw,58px));
}
.uaia-ch__doors{
	display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
	gap:var(--cp-gap,11px);
	margin-top:var(--cp-box,22px);
}
.uaia-ch__door{
	display:block;padding:var(--cp-box,22px);text-decoration:none;
	border-radius:var(--r-md,16px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.14));
	border-top:3px solid var(--amber,#F2A413);
	transition:transform .3s ease,border-color .3s ease,background .3s ease;
}
.uaia-ch__door:hover{transform:translateY(-4px);background:rgba(246,240,230,.05)}
.uaia-ch__door--success{border-top-color:var(--sage,#7E9270)}
.uaia-ch__door--legacy{border-top-color:var(--clay,#D2551F)}
/* The tier name, which is real information, so it keeps its colour. Sentence
   case and normal tracking, because it is a name rather than a shout. */
.uaia-ch__kicker{
	display:block;font-size:.8rem;font-weight:600;
	letter-spacing:.01em;text-transform:none;color:var(--amber-ink,#F2A413);
}
.uaia-ch__door--success .uaia-ch__kicker{color:var(--sage-ink,#7E9270)}
.uaia-ch__door--legacy .uaia-ch__kicker{color:var(--terra-ink,#D2551F)}
.uaia-ch__name{
	display:block;margin-top:8px;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.02em;line-height:1.15;
	font-size:1.18rem;color:var(--ivory,#F6F0E6);
}
.uaia-ch__text{
	display:block;margin-top:9px;font-size:.9rem;line-height:1.55;
	color:var(--dim,rgba(246,240,230,.72));
}
.uaia-ch__meta{
	display:block;margin-top:12px;padding-top:10px;
	border-top:1px solid var(--line,rgba(246,240,230,.12));
	/* Sentence case. A tracked all caps count is a label pretending to be
	   information. */
	font-size:.8rem;font-weight:500;letter-spacing:0;text-transform:none;
	color:var(--dimmer,rgba(246,240,230,.5));
}
.uaia-ch__back{margin:18px 0 0}
.uaia-ch__back a{font-size:.86rem;font-weight:600;color:var(--amber-ink,#F2A413)}
.uaia-ch__list{display:grid;gap:12px;margin-top:20px}
.uaia-ch__guide{
	border-radius:var(--r-md,14px);overflow:hidden;
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.13));
	transition:border-color .3s ease;
}
.uaia-ch__guide.has-note{border-left:3px solid var(--amber,#F2A413)}
.uaia-ch__guide:hover{border-color:rgba(246,240,230,.28)}
.uaia-ch__guide > a{display:block;padding:20px 22px;text-decoration:none}
.uaia-ch__guide h3{
	margin:0 0 6px;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.02em;font-size:1.08rem;color:var(--ivory,#F6F0E6);
}
.uaia-ch__sub{margin:0 0 8px;font-size:.9rem;line-height:1.55;color:var(--dim,rgba(246,240,230,.7))}
.uaia-ch__guide .uaia-ch__meta{
	margin:0;padding:0;border:0;display:block;
}
.uaia-ch__note{
	padding:16px 22px;
	background:rgba(242,164,19,.1);
	border-top:1px solid var(--line,rgba(246,240,230,.12));
}
.uaia-ch__notelabel{
	margin:0 0 5px;font-size:.62rem;font-weight:700;
	letter-spacing:.14em;text-transform:uppercase;color:var(--amber-ink,#F2A413);
}
.uaia-ch__note p:last-child{
	margin:0;font-size:.92rem;line-height:1.58;color:var(--ivory,#F6F0E6);
}
.uaia-ch__by{
	display:flex;gap:18px;align-items:center;
	margin-top:clamp(30px,4vw,46px);padding:22px 24px;
	border-radius:var(--r-md,14px);
	background:rgba(246,240,230,.05);
	border:1px solid var(--line,rgba(246,240,230,.12));
}
.uaia-ch__by img{
	flex:none;width:62px;height:62px;border-radius:50%;object-fit:cover;
}
.uaia-ch__bylabel{
	margin:0 0 3px;font-size:.62rem;font-weight:700;
	letter-spacing:.14em;text-transform:uppercase;color:var(--dimmer,rgba(246,240,230,.45));
}
.uaia-ch__byname{
	margin:0;font-family:var(--font-display,inherit);
	font-weight:700;font-size:1.05rem;color:var(--ivory,#F6F0E6);
}
.uaia-ch__bysays{
	margin:6px 0 0;font-size:.9rem;line-height:1.55;font-style:italic;
	color:var(--dim,rgba(246,240,230,.72));
}
@media(max-width:640px){
	.uaia-ch__doors{grid-template-columns:1fr}
	.uaia-ch__by{flex-direction:column;align-items:flex-start;text-align:left}
}

/* Guides worth reading next, and the cities list. */
.uaia-next{
	margin:clamp(34px,5vw,54px) 0 0;padding-top:26px;
	border-top:1px solid var(--line,rgba(246,240,230,.14));
}
.uaia-next__label{
	margin:0 0 14px;font-size:.66rem;font-weight:700;
	letter-spacing:.14em;text-transform:uppercase;color:var(--amber-ink,#F2A413);
}
.uaia-next ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.uaia-next li{
	padding:14px 18px;border-radius:var(--r-md,12px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.12));
	transition:border-color .25s ease;
}
.uaia-next li:hover{border-color:rgba(246,240,230,.28)}
.uaia-next a{font-weight:600;font-size:1rem;color:var(--ivory,#F6F0E6)}
.uaia-next span{
	display:block;margin-top:4px;font-size:.88rem;line-height:1.5;
	color:var(--dim,rgba(246,240,230,.68));
}

.uaia-cities{margin-top:clamp(34px,5vw,56px)}
.uaia-cities h2{
	margin:0 0 12px;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.02em;font-size:clamp(1.3rem,3vw,1.9rem);
	color:var(--ivory,#F6F0E6);
}
.uaia-cities__intro{
	margin:0 0 26px;font-size:.98rem;line-height:1.62;
	color:var(--dim,rgba(246,240,230,.74));max-width:58ch;
}
.uaia-cities__state{margin-bottom:22px}
.uaia-cities__state h3{
	margin:0 0 9px;font-size:.68rem;font-weight:700;
	letter-spacing:.16em;text-transform:uppercase;color:var(--amber-ink,#F2A413);
}
.uaia-cities__state ul{
	margin:0;padding:0;list-style:none;
	display:flex;gap:9px;flex-wrap:wrap;
}
.uaia-cities__state a{
	display:inline-block;padding:8px 16px;
	border-radius:var(--r-pill,999px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.14));
	font-size:.9rem;color:var(--ivory,#F6F0E6);text-decoration:none;
	transition:border-color .25s ease,background .25s ease;
}
.uaia-cities__state a:hover{border-color:var(--amber,#F2A413);background:rgba(242,164,19,.1)}

/* A chapter's own photograph and accent, so its shelf looks like that city. */
.uaia-ch__mast{
	margin:0 0 clamp(24px,3.4vw,40px);
	border-radius:var(--r-lg,18px);overflow:hidden;
	aspect-ratio:21/9;
}
.uaia-ch__mast img{display:block;width:100%;height:100%;object-fit:cover}
.uaia-ch .uaia-ch__note{
	background:color-mix(in srgb, var(--chapter-accent, var(--amber,#F2A413)) 12%, transparent);
}
.uaia-ch .uaia-ch__notelabel{color:var(--chapter-accent, var(--amber,#F2A413))}
.uaia-ch .uaia-ch__guide.has-note{border-left-color:var(--chapter-accent, var(--amber,#F2A413))}
@media(max-width:640px){
	.uaia-ch__mast{aspect-ratio:16/9}
}

/* A guide that may not apply where the reader is. Marked, never hidden. */
.uaia-state{
	margin:clamp(28px,4vw,44px) 0 0;padding:20px 22px;
	border-radius:var(--r-md,14px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.14));
	border-left:3px solid var(--sage,#7E9270);
}
.uaia-state.is-wrong{border-left-color:var(--clay,#D2551F);background:rgba(210,85,31,.1)}
.uaia-state__warn{margin:0 0 14px;font-size:.96rem;line-height:1.6;color:var(--ivory,#F6F0E6)}
.uaia-state__note{
	margin:0 0 14px;font-size:.86rem;letter-spacing:.02em;
	color:var(--dim,rgba(246,240,230,.7));
}
.uaia-state__pick{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.uaia-state__pick label{font-size:.86rem;color:var(--dim,rgba(246,240,230,.72))}
.uaia-state__pick select{
	padding:9px 12px;min-height:44px;border-radius:var(--r-sm,8px);
	background:var(--ink,#14100D);color:var(--ivory,#F6F0E6);
	border:1px solid var(--line,rgba(246,240,230,.24));font-size:.9rem;
}
.uaia-state__pick button{
	padding:10px 18px;min-height:44px;border-radius:var(--r-pill,999px);
	background:transparent;color:var(--ivory,#F6F0E6);cursor:pointer;
	border:1px solid var(--line,rgba(246,240,230,.3));font-size:.86rem;font-weight:600;
}
.uaia-state__pick button:hover{border-color:var(--amber,#F2A413)}
.uaia-state__privacy{
	margin:12px 0 0;font-size:.82rem;line-height:1.55;
	color:var(--dimmer,rgba(246,240,230,.5));
}

/* ============================================================================
   THE CONTROL ROOM

   One page answering one question: what needs me today. Everything waiting
   is a number and a sentence, sized so the count is readable across a desk
   and the reason is readable up close.
   ========================================================================== */
.uaia-ctl{
	max-width:min(58rem,100%);margin-inline:auto;
	padding:clamp(28px,5vw,56px) clamp(20px,5vw,40px);
}
.uaia-ctl__head{margin-bottom:clamp(26px,4vw,40px)}
.uaia-ctl__title{
	margin:0;font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.03em;line-height:1.05;
	font-size:clamp(1.9rem,4.5vw,2.9rem);color:var(--ivory,#F6F0E6);
}
.uaia-ctl__sub{
	margin:8px 0 0;font-size:1rem;line-height:1.55;
	color:var(--dim,rgba(246,240,230,.7));
}

.uaia-ctl__clear{
	padding:26px 28px;border-radius:var(--r-md,14px);
	background:rgba(126,146,112,.12);
	border:1px solid rgba(126,146,112,.3);
}
.uaia-ctl__clear p{margin:0;font-size:1.1rem;font-weight:600;color:var(--ivory,#F6F0E6)}
.uaia-ctl__clearnote{
	margin-top:8px !important;font-size:.92rem !important;font-weight:400 !important;
	line-height:1.6;color:var(--dim,rgba(246,240,230,.7)) !important;
}

.uaia-ctl__waiting{display:grid;gap:11px}
.uaia-ctl__item{
	display:grid;
	grid-template-columns:auto minmax(0,1fr);
	grid-template-rows:auto auto;
	column-gap:18px;align-items:baseline;
	padding:18px 22px;border-radius:var(--r-md,14px);
	background:var(--ink-2,#1D1815);
	border:1px solid var(--line,rgba(246,240,230,.13));
	border-left:3px solid var(--sage,#7E9270);
	text-decoration:none;
	transition:border-color .25s ease,background .25s ease;
}
.uaia-ctl__item--urgent{border-left-color:var(--clay,#D2551F)}
.uaia-ctl__item--watch{border-left-color:var(--amber,#F2A413)}
.uaia-ctl__item:hover,.uaia-ctl__item:focus-visible{
	background:rgba(246,240,230,.05);border-color:rgba(246,240,230,.3);
}
.uaia-ctl__count{
	grid-row:1 / span 2;
	font-family:var(--font-display,inherit);
	font-weight:700;letter-spacing:-.04em;line-height:1;
	font-size:clamp(2rem,4vw,2.7rem);color:var(--ivory,#F6F0E6);
	font-variant-numeric:tabular-nums;
}
.uaia-ctl__what{font-size:1.02rem;font-weight:600;color:var(--ivory,#F6F0E6)}
.uaia-ctl__why{
	margin-top:4px;font-size:.9rem;line-height:1.55;
	color:var(--dim,rgba(246,240,230,.68));
}

.uaia-ctl__set{margin-top:clamp(30px,4.5vw,46px)}
.uaia-ctl__setname{
	margin:0 0 14px;font-size:.68rem;font-weight:700;
	letter-spacing:.14em;text-transform:uppercase;
	color:var(--dimmer,rgba(246,240,230,.45));
}
.uaia-ctl__links{
	display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;
}
.uaia-ctl__link{
	display:block;padding:15px 18px;border-radius:var(--r-md,12px);
	background:rgba(246,240,230,.035);
	border:1px solid var(--line,rgba(246,240,230,.1));
	text-decoration:none;
	transition:border-color .25s ease,background .25s ease;
}
.uaia-ctl__link:hover,.uaia-ctl__link:focus-visible{
	border-color:var(--amber,#F2A413);background:rgba(242,164,19,.07);
}
.uaia-ctl__linkname{display:block;font-weight:600;font-size:.98rem;color:var(--ivory,#F6F0E6)}
.uaia-ctl__linkwhy{
	display:block;margin-top:3px;font-size:.84rem;line-height:1.5;
	color:var(--dimmer,rgba(246,240,230,.55));
}
.uaia-ctl__foot{
	margin-top:clamp(30px,4vw,44px);padding-top:20px;
	border-top:1px solid var(--line,rgba(246,240,230,.12));
	font-size:.86rem;line-height:1.6;color:var(--dimmer,rgba(246,240,230,.5));
}
@media(max-width:560px){
	.uaia-ctl__item{grid-template-columns:minmax(0,1fr);row-gap:2px}
	.uaia-ctl__count{grid-row:auto}
}