/* GENERATED by tools/search/lift-css.js from the Art Director's Claude-PE-1158 spec files. DO NOT EDIT; re-run the lifter. */

/* ---- from: site search.css ---- */
/* ==== Claude-PE-1158 · SITE SEARCH · PROPOSED. Site tokens only (index.html :root). ==== */
/* C · the field, directly under .menu-action. Same height and radius as the pill above it. */
.msearch{display:flex;align-items:center;margin-top:8px;min-height:40px;border-radius:999px;
  background:var(--bg2);border:1px solid var(--line);padding:0 2px 0 14px}
.msearch:focus-within{border-color:var(--accent)}
.msearch input{flex:1;min-width:0;height:38px;border:0;background:none;color:var(--ink);font:400 16px/1.2 var(--sans);padding:0}
.msearch input::placeholder{color:var(--muted)}
.msearch input:focus{outline:none}
.msearch input::-webkit-search-cancel-button{display:none}
.msearch .go{flex:0 0 36px;width:36px;height:36px;border:0;border-radius:999px;background:none;color:var(--muted);display:grid;place-items:center}
.msearch .go svg{width:17px;height:17px}
.msearch .go:hover{background:var(--surface);color:var(--ink)}
/* D · results. The menu itself widens; its other rows step aside while a query is live. */
.menu.searching{width:min(400px, calc(100vw - 24px))}
.menu.searching > :not(.menu-action):not(.msearch):not(.mres){display:none}
.mres{max-height:calc(100vh - 64px - 10px - 24px - 96px);overflow-y:auto;margin:6px -4px 0;padding:0 4px}
.mgrp{padding-top:10px}
.mgrph{font:700 11.5px/1.2 var(--sans);color:var(--muted);margin:0 8px 4px;display:flex;justify-content:space-between;gap:8px}
.mrow{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px;border-radius:8px;color:var(--ink)}
.mrow .kic{width:18px;height:18px;flex:0 0 auto;color:var(--muted)}
.mrow .m{flex:1;min-width:0}
.mrow .t{font:600 13.5px/1.3 var(--sans)}
.mrow .s{font:400 12px/1.3 var(--sans);color:var(--muted);margin-top:2px}
.mrow .trail{width:15px;height:15px;flex:0 0 auto;color:var(--muted)}
.mrow.is-active{background:var(--accent-quiet);box-shadow:inset 0 0 0 2px var(--accent)}

@media (hover:hover) and (pointer:fine){
  .mrow:hover{background:var(--bg2)}
}
.mpills{display:flex;flex-wrap:wrap;gap:6px;padding:2px 8px 4px}
.mpill{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px 0 14px;border-radius:999px;border:1px solid var(--line);
  background:var(--surface);font:600 13px/1 var(--sans);color:var(--ink)}
.mpill svg{width:13px;height:13px;color:var(--muted)}
.mnone{padding:14px 8px 6px}

/* ---- from: app search.css ---- */
.sgrp{padding-top:14px}
.sgrph{font-size:.74rem;font-weight:800;color:var(--muted);margin:0 0 6px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.sgrph .n{font-weight:700;font-variant-numeric:tabular-nums}
/* kind 1 · SCREENS: pills. Shape is the kind marker. */
.spills{display:flex;flex-wrap:wrap;gap:8px}
.spill{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px 0 16px;border-radius:var(--r-full);
  border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.spill svg{width:14px;height:14px;color:var(--muted)}
/* kind 2 · PUBLICATIONS: the References row, with the References drawer mark as its kind icon. */
.srow{position:relative;display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;min-height:56px}
.srow + .srow::after{content:"";position:absolute;left:12px;right:12px;top:0;height:1px;background:var(--line)}
.srow .kic{width:20px;height:20px;flex:0 0 auto;color:var(--muted)}
.srow .rmain{flex:1;min-width:0}
.srow .rnum{font-size:.9rem;font-weight:700;color:var(--ink)}
.srow .rttl{font-size:.78rem;font-weight:600;color:var(--ink);line-height:1.3;margin-top:2px}
.srow .rmeta{font-size:.74rem;color:var(--muted);margin-top:3px}
.srow .trail{width:16px;height:16px;flex:0 0 auto;color:var(--muted)}
.smore{display:block;width:100%;min-height:44px;border:0;background:none;color:var(--link);font:inherit;font-size:.8rem;font-weight:700;text-align:left;padding:0 12px}
/* the ACTIVE result (arrow keys, or the one Enter will open): selected, so --accent-quiet fill. Filled, never an edge bar. */
.is-active{background:var(--accent-quiet);box-shadow:inset 0 0 0 2px var(--accent)}
/* fill = selected; the ring carries the 3:1 the fill cannot (fill/surface is 1.17) */
.srow.is-active::after,.srow.is-active + .srow::after{opacity:0}

@media (hover:hover) and (pointer:fine){
  .srow:hover,.spill:hover{background:var(--hover-bg)}
}
/* kind 3 · THE POOL: a card. The count is the headline, the action is the Study button. */
.spool{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.spool .top{display:flex;align-items:center;gap:12px;padding:14px 14px 12px 16px}
.spool .cnt{font-size:1.9rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.spool .cntl{flex:1;min-width:0;font-size:.78rem;color:var(--muted);font-weight:600;line-height:1.3}
.sbtn{flex:0 0 auto;min-height:44px;padding:0 16px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface2);
  color:var(--ink);font:inherit;font-size:.85rem;font-weight:800;display:inline-flex;align-items:center;gap:6px}
.spool .pv{margin:0;padding:0 16px 12px;list-style:none}
.spool .pv li{font-size:.8rem;line-height:1.4;color:var(--ink);padding:7px 0;border-top:1px solid var(--line)}
/* the cited group lives INSIDE the pool card, under its own rule, so its heading can only ever describe the pool */
.scited{background:var(--surface2);border-top:1px solid var(--line);padding:10px 16px 12px}
.scited .h{font-size:.74rem;font-weight:800;color:var(--muted);margin:0 0 4px}
.scited .c{display:flex;align-items:baseline;gap:10px;min-height:36px;padding:6px 0;border-top:1px solid var(--line)}
.scited .c:first-of-type{border-top:0}
.scited .c .t{flex:1;min-width:0;font-size:.8rem;font-weight:600;color:var(--ink);line-height:1.3}
.scited .c .t b{font-weight:800}
.scited .c .k{flex:0 0 auto;font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums}
.scited .un{font-size:.74rem;color:var(--muted);margin-top:4px}
/* kind 4 · SITE PAGES: a row whose trailing mark and meta line say it leaves the app. */
.srow.ext .trail{width:16px;height:16px}
/* empty / none */
.sempty{padding:22px 4px 6px;text-align:left}
.sempty .h{font-size:.95rem;font-weight:700;color:var(--ink);margin:0 0 6px}
.sempty p{font-size:.8rem;line-height:1.55;color:var(--muted);margin:0 0 14px;max-width:34ch}

/* ---- from: A1 app tiers and pin.css ---- */
/* ==== Claude-PE-1158 A1 · PROPOSED additions to the 1158 app sheet. Existing app tokens only. ==== */

/* Tier headings: one level above the group heads. A hairline above each tier after the first. */
.tier{padding-top:18px}
.tier + .tier{margin-top:14px;border-top:1px solid var(--line)}
.tierh{font-size:.8rem;font-weight:800;color:var(--ink);margin:0 0 8px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.tierh .n{font-size:.74rem;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.tier .sgrp:first-of-type{padding-top:0}
.tier > * + *{margin-top:10px}
/* Tier 1 pool: stems are tappable rows (study that one question). */
.spool .pv li{display:flex;align-items:center;gap:10px;min-height:44px;padding:9px 0}
.spool .pv li span{flex:1;min-width:0}
.spool .pv li svg{width:14px;height:14px;flex:0 0 auto;color:var(--muted)}
/* A CATEGORY result (new kind). Study shape = a card with a number, smaller than a pool. */
.scat{display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 10px 8px 16px;border:1px solid var(--line);
  border-radius:var(--r);background:var(--surface)}
.scat .n{font-size:1.3rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;min-width:2ch}
.scat .m{flex:1;min-width:0}
.scat .t{font-size:.88rem;font-weight:700;line-height:1.3}
.scat .s{font-size:.74rem;color:var(--muted);margin-top:2px}
.scats{display:flex;flex-direction:column;gap:8px}
/* Tier 2 group: the pool card, headed by its RELATION (bound, like the cited heading). */
.srel{font-size:.78rem;color:var(--muted);font-weight:600;padding:12px 16px 0}
.srel b{color:var(--ink);font-weight:800}

/* ---- from: A1 site tiers.css ---- */
/* ==== Claude-PE-1158 A1 · SITE results: the app's result grammar, mapped onto site tokens. PROPOSED. ==== */
.mres{--surface2:var(--bg2);--line2:var(--line);--r:10px;--r-full:999px;--link:var(--accent-text);--icon-state:var(--muted);--hover-bg:var(--bg2);
  font:400 14px/1.4 var(--sans)}
.mres .tier{padding-top:12px}
.mres .tier:first-child{padding-top:6px}
.mres .tierh{font:700 12px/1.2 var(--sans);color:var(--ink);margin:0 8px 8px}
.mres .srow{padding:9px 8px;min-height:52px}
.mres .srow .rnum{font:600 13.5px/1.3 var(--sans)}
.mres .srow .rttl{font:400 12px/1.3 var(--sans);color:var(--muted)}
.mres .rmeta{font:400 12px/1.3 var(--sans)}
.mres .spool .cnt{font:600 26px/1 var(--sans)}
.mres .spool .pv li{font:400 13px/1.4 var(--sans)}
.mres .sbtn{font:600 13px/1 var(--sans);border-radius:999px}
.mres .scited .c .t{font:600 12.5px/1.3 var(--sans)}
.mres .scited .h,.mres .scited .c .k,.mres .srel{font:600 12px/1.3 var(--sans)}

/* ---- from: 1158 A9 site search banner, approved.css ---- */
/* ==== Claude-PE-1158 · THE SITE SEARCH CRISIS BANNER, AS JORDAN APPROVED IT (A4 direction 3 → A5 → A6). ====
   Loaded after site-search.css; it replaces the A3 banner rules there.
   - The WHOLE TILE is the one link and the one search option.
   - The tile is outlined by ONE GREEN HAIRLINE at all times; selected, focused or hovered it stays exactly that, and
     nothing inside is filled, ringed or underlined.
   - "Where to get help" with the heart ABOVE the sentence, and "Resources available to you" with the arrow BELOW it,
     both in the app's gold (the site has no yellow of its own): light #8a6410 (5.37 : 1), dark #dbb04a (8.89 : 1).
   - Under the link, the [BANNER STAYS LINE] slot for the Copywriter. */
:root, html[data-theme="light"]{--ban-gold:#8a6410}
html[data-theme="dark"]{--ban-gold:#dbb04a}

@media (prefers-color-scheme:dark){
  html[data-theme="auto"]{--ban-gold:#dbb04a}
}
.sban{display:block;position:relative;margin-top:14px;border:1px solid var(--accent-text);border-radius:var(--r);
  background:var(--surface);color:var(--ink);text-decoration:none;padding:12px 14px;cursor:pointer}
.sban.is-active,.sban:focus-visible{outline:none;border-color:var(--accent-text);background:var(--surface);box-shadow:none}
.sban .k{display:flex;align-items:center;gap:6px;margin:0 0 6px;font:800 11.5px/1.2 var(--sans);letter-spacing:.07em;
  text-transform:uppercase;color:var(--ban-gold)}
.sban .k svg{width:13px;height:13px;flex:0 0 auto}
.sban .s{margin:0;color:var(--ink);font:700 15px/1.35 var(--sans);min-height:2.7em}
.sban .lk{display:inline-flex;align-items:center;gap:6px;min-height:40px;margin-bottom:-6px;color:var(--ban-gold);
  font-size:14px;font-weight:700;text-decoration:none}
.sban .lk svg{width:16px;height:16px;flex:0 0 auto}