/* Shared components: search, glossary pop-ups, readiness, solutions, paths, certification map.
   Colours come from each page's :root tokens so light and dark themes both work. */

/* ---------- glossary terms inside text ---------- */
.term{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:help;text-decoration:underline dotted;text-decoration-color:var(--text-muted);text-underline-offset:3px;border-radius:2px;display:inline;text-align:inherit;line-height:inherit;min-height:0}
.term:hover,.term[aria-expanded="true"]{background:var(--grail-gold-soft);text-decoration-color:var(--grail-gold-ink)}
.gpop{position:fixed;z-index:90;background:var(--surface-1);color:var(--text-primary);border:1px solid var(--border-strong);border-radius:var(--r-3);box-shadow:var(--shadow-overlay);padding:14px 16px 12px;max-width:calc(100vw - 24px);font-size:.92rem;line-height:1.5}
.gpop .gpop-c{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}
.gpop .gpop-t{font-weight:700;font-size:1.02rem;margin:2px 28px 4px 0}
.gpop .gpop-d{color:var(--text-secondary)}
.gpop .gpop-s{margin-top:8px;font-size:.84rem;color:var(--text-muted)}
.gpop .gpop-s:empty{display:none}
.gpop .gpop-link{display:inline-block;margin-top:10px;font-weight:600;font-size:.86rem}
.gpop .gpop-x{position:absolute;top:6px;right:6px;width:36px;height:36px;border:0;background:none;font-size:1.3rem;color:var(--text-muted);border-radius:6px}
.gpop .gpop-x:hover{background:var(--surface-3)}
.gpop.sheet{left:0!important;right:0;bottom:0;top:auto!important;width:auto!important;max-width:none;border-radius:var(--r-3) var(--r-3) 0 0;padding:18px calc(18px + env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) calc(18px + env(safe-area-inset-left,0px));animation:sheetUp .18s ease-out}
@keyframes sheetUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- search ---------- */
.srch{position:fixed;inset:0;z-index:95;background:var(--scrim);display:flex;justify-content:center;align-items:flex-start;padding:calc(8vh + env(safe-area-inset-top,0px)) 16px 16px}
.srch[hidden]{display:none}
body.srch-open{overflow:hidden}
.srch-box{background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--r-3);box-shadow:var(--shadow-overlay);width:min(720px,100%);max-height:min(76vh,720px);display:flex;flex-direction:column;overflow:hidden}
.srch-head{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border)}
.srch-head svg{width:20px;height:20px;fill:none;stroke:var(--text-muted);stroke-width:2;flex:none}
.srch-head input{flex:1;min-width:0;border:0;background:none;color:var(--text-primary);font:inherit;font-size:16px;padding:8px 2px;outline:none}
.srch-types{display:flex;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none}
.srch-types::-webkit-scrollbar{display:none}
.srch-types button{flex:none;border:1px solid var(--border-strong);background:var(--surface-1);border-radius:999px;padding:6px 13px;font-size:.84rem;color:var(--text-secondary);min-height:36px}
.srch-types button[aria-pressed="true"]{background:var(--text-primary);color:var(--bg);border-color:var(--text-primary)}
.srch-res{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px}
.srch-item{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:8px;text-decoration:none;color:var(--text-primary)}
.srch-item.sel,.srch-item:hover{background:var(--surface-3)}
.srch-item.sel{outline:2px solid var(--gold-line);outline-offset:-2px}
.srch-type{flex:none;font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:var(--r-1);background:var(--surface-3);border:1px solid var(--border);color:var(--text-secondary);margin-top:2px;width:84px;text-align:center}
.srch-main{min-width:0;display:flex;flex-direction:column;gap:1px}
.srch-title{font-weight:600;font-size:.94rem}
.srch-sub{font-size:.76rem;color:var(--text-muted)}
.srch-snip{font-size:.83rem;color:var(--text-secondary);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.srch mark{background:var(--grail-gold-soft);color:inherit;border-radius:2px;padding:0 1px}
.srch-empty{padding:26px 16px;color:var(--text-secondary);text-align:center;font-size:.92rem}
.srch-foot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--border);font-size:.75rem;color:var(--text-muted)}
.srch-foot kbd{font-family:var(--mono);background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r-1);padding:0 4px;margin-right:3px}
@media (max-width:600px){
  .srch{padding:0;align-items:stretch}
  .srch-box{width:100%;max-height:none;height:100%;border-radius:0;border:0;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
  .srch-foot{display:none}
  .srch-type{width:auto}
}
.searchbtn{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.searchbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.searchbtn kbd{font-family:var(--mono);font-size:.7rem;border:1px solid var(--border-strong);border-radius:var(--r-1);padding:0 5px;color:var(--text-muted);margin-left:auto}

/* ---------- toast (for pages that don't define one) ---------- */
.toast{position:fixed;bottom:calc(20px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);background:var(--text-primary);color:var(--bg);padding:8px 16px;border-radius:4px;font-size:.85rem;opacity:0;pointer-events:none;transition:opacity .2s;z-index:99;max-width:calc(100vw - 32px);text-align:center}
.toast.show{opacity:1}

/* ---------- readiness meter ---------- */
.ready{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.75rem;color:var(--text-secondary);white-space:nowrap}
.ready .rbar{width:64px;height:6px;border-radius:var(--r-1);background:var(--border);overflow:hidden}
.ready .rbar i{display:block;height:100%;background:var(--success)}
.ready.r0 .rbar i{background:var(--text-muted)}

/* ---------- worked solutions ---------- */
.sol{margin-top:10px;border:1px solid var(--border);border-radius:6px;background:var(--surface-3)}
.sol>summary{padding:8px 12px;font-size:.88rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px;list-style:none}
.sol>summary::-webkit-details-marker{display:none}
.sol>summary::before{content:"▸";font-size:.8rem;color:var(--text-muted);transition:transform .15s}
.sol[open]>summary::before{transform:rotate(90deg)}
.sol>summary .lock{font-weight:400;color:var(--text-muted);font-size:.8rem}
.sol .solbody{padding:2px 14px 14px;font-size:.92rem}
.sol .gate{padding:4px 14px 14px;font-size:.9rem;color:var(--text-secondary)}
.sol .gate .btn{margin-top:8px}
.sol h5{font-size:.74rem;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin:12px 0 4px}
.sol ul{margin:4px 0;padding-left:20px}
.sol li{margin-bottom:3px}
.sol .codewrap{position:relative}
.sol .codewrap .lang{position:absolute;top:6px;left:12px;font-family:var(--mono);font-size:.66rem;color:var(--graphite-muted);text-transform:uppercase;letter-spacing:.05em}
.sol .codewrap pre{padding-top:26px}
.sol .codewrap .cp{position:absolute;top:6px;right:6px;border:1px solid rgb(255 255 255 / .2);background:rgb(255 255 255 / .06);color:var(--code-text);border-radius:4px;font-size:.72rem;padding:3px 8px;min-height:0}
.sol .check{background:var(--success-soft);border-left:3px solid var(--success);padding:8px 12px;border-radius:0 4px 4px 0;margin-top:10px}
.sol .note{background:var(--grail-gold-soft);border-left:3px solid var(--gold-line);padding:8px 12px;border-radius:0 4px 4px 0;margin-top:8px}
.sol .check b,.sol .note b{display:block;font-size:.72rem;font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
.sol .check b{color:var(--success)}.sol .note b{color:var(--grail-gold-ink)}
.sol .stbl{overflow-x:auto;margin-top:8px;-webkit-overflow-scrolling:touch}
.sol .stbl table{font-family:var(--sans);font-size:.82rem;min-width:560px}
.sol .stbl td,.sol .stbl th{white-space:normal;vertical-align:top}

/* ---------- paths & certification map ---------- */
section.paths,section.certs,section.starter{padding:40px 0;border-bottom:1px solid var(--border)}
.pathgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:14px}
.pathcard{text-align:left;background:var(--surface-1);border:1px solid var(--border);border-radius:8px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--text-primary)}
.pathcard:hover{border-color:var(--text-muted)}
.pathcard[aria-pressed="true"]{border:2px solid var(--gold-line);padding:13px 15px;background:var(--grail-gold-soft)}
.pathcard .pt{font-weight:700;font-size:1rem}
.pathcard .ptag{font-family:var(--mono);font-size:.72rem;color:var(--grail-gold-ink)}
.pathcard .pdesc{color:var(--text-secondary)}
.pathcard .pmeta{font-family:var(--mono);font-size:.74rem;color:var(--text-muted);margin-top:auto}
.pathnote{margin-top:12px;font-size:.88rem;color:var(--text-secondary)}
.topic.offpath{opacity:.55}
.topic.offpath:hover,.topic.offpath:focus-within{opacity:1}
.topic .pathtag{font-family:var(--mono);font-size:.7rem;padding:2px 7px;border-radius:var(--r-1);background:var(--grail-gold);color:var(--on-gold)}
.topic .pathtag.opt{background:var(--surface-3);color:var(--text-muted);border:1px solid var(--border)}
.side nav a.core::after{content:"●";color:var(--gold-line);font-size:.6rem;margin-left:6px;vertical-align:2px}
.side nav a .rp{font-family:var(--mono);font-size:.7rem;color:var(--text-muted);margin-left:6px}
.certtabs{display:flex;gap:8px;margin:14px 0 12px;flex-wrap:wrap}
.cert{background:var(--surface-1);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.cert header{padding:14px 16px;border-bottom:1px solid var(--border)}
.cert header h3{margin:0 0 2px;font-size:1.05rem}
.cert header p{margin:0;color:var(--text-secondary);font-size:.9rem}
.cert .area{display:grid;grid-template-columns:minmax(160px,1.1fr) 90px 2fr;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);align-items:start;font-size:.9rem}
.cert .area:last-child{border-bottom:0}
.cert .an{font-weight:600}
.cert .aw{font-family:var(--mono);font-size:.8rem;color:var(--text-secondary)}
.cert .aw .wb{height:6px;background:var(--border);border-radius:var(--r-1);margin-top:4px;overflow:hidden}
.cert .aw .wb i{display:block;height:100%;background:var(--grail-gold)}
.cert .links{display:flex;flex-wrap:wrap;gap:6px}
.cert .links a{font-size:.8rem;text-decoration:none;border:1px solid var(--border-strong);border-radius:999px;padding:3px 10px;background:var(--surface-3)}
.cert .links a.fc{border-style:dashed}
.cert .ar{font-family:var(--mono);font-size:.72rem;color:var(--text-muted);margin-top:4px}
@media (max-width:640px){.cert .area{grid-template-columns:1fr auto}.cert .links{grid-column:1/-1}}

/* ---------- starter ---------- */
.startergrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:14px}
.startergrid>div{background:var(--surface-1);border:1px solid var(--border);border-radius:8px;padding:14px 16px;font-size:.9rem}
.startergrid b{display:block;margin-bottom:4px}
.urlbox{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.urlbox code{flex:1;min-width:0;overflow-wrap:anywhere;padding:6px 8px}

/* ---------- print ---------- */
@media print{.srch,.gpop,.toast,.mbar,.scrim{display:none!important}.term{text-decoration:none}}
.cert .links a .lvtag{font-family:var(--mono);font-size:.66rem;color:var(--text-muted);margin-left:2px}

/* ---------- highlighted headline words: yellow text (a deeper gold in light mode so it stays readable) ---------- */

/* ---------- theme switch ---------- */
.themetoggle{border:0;background:none;padding:4px 2px;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;flex:none;-webkit-tap-highlight-color:transparent}
.themetoggle .tt-track{position:relative;display:flex;align-items:center;justify-content:space-between;width:58px;height:30px;padding:0 8px;border-radius:999px;background:var(--surface-3);border:1px solid var(--border-strong);transition:background .2s}
.themetoggle .tt-ic{width:13px;height:13px;fill:none;stroke:var(--text-muted);stroke-width:2;stroke-linecap:round}
.themetoggle .tt-moon{fill:var(--text-muted);stroke:none}
.themetoggle .tt-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--grail-gold);display:grid;place-items:center;box-shadow:0 1px 3px rgb(0 0 0 / .3);transition:transform .2s ease}
.themetoggle .tt-knob svg{width:13px;height:13px;fill:none;stroke:var(--on-gold);stroke-width:2.2;stroke-linecap:round}
.themetoggle .tt-knob .k-moon{fill:var(--on-gold);stroke:none;display:none}
.themetoggle[aria-checked="true"] .tt-knob{transform:translateX(28px)}
.themetoggle[aria-checked="true"] .tt-knob .k-sun{display:none}
.themetoggle[aria-checked="true"] .tt-knob .k-moon{display:block}
.themetoggle:focus-visible{outline:none}
.themetoggle:focus-visible .tt-track{outline:3px solid var(--gold-line);outline-offset:2px}
.srch-filters{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border)}
.srch-filters .srch-types{border-bottom:0;flex:1;min-width:0}
.srch-facet{flex:none;padding-right:12px}
.srch-facet select{font:inherit;font-size:.8rem;color:var(--text-primary);background:var(--surface-1);border:1px solid var(--border-strong);border-radius:6px;padding:4px 8px;min-height:32px;max-width:170px}
.srch-type.t-Scenario,.srch-type.t-Drill{background:var(--grail-gold-soft);color:var(--grail-gold-ink)}
@media (max-width:560px){.srch-filters{flex-direction:column;align-items:stretch;gap:0}.srch-facet{padding:0 12px 8px}.srch-facet select{max-width:none;width:100%}}
@media (max-width:560px){.srch-types button{min-height:40px}}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}