/* Keyboard bypass on the six legacy landing/policy pages. No script required. */
.site-skip{position:fixed;top:8px;left:12px;z-index:1000;max-width:calc(100vw - 24px);padding:10px 14px;border:2px solid var(--accent);border-radius:8px;background:var(--card);color:var(--fg);transform:translateY(calc(-100% - 16px))}
.site-skip:focus{transform:none}
/* Structural links are controls; prose links keep a quieter reading cue. */
.code-sample{margin:18px 0;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;min-width:0}
.code-sample-toolbar{display:flex;justify-content:flex-end;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border)}
.code-sample pre{margin:0;border:0;border-radius:0;background:transparent}
.code-copy-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:112px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--card);color:var(--fg);font:600 13px/1.5 var(--sans);cursor:pointer}
.code-copy-button[aria-disabled="true"]{cursor:wait}
.code-copy-button[data-copy-state="success"]{background:var(--chip)}
.code-sample .copy-status{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.copy-status,#catalog-status{font-size:14px;line-height:1.6;color:var(--fg);max-width:76ch}
.badge.kind.recipe,.badge.kind.plugin,.badge.kind.skill,.badge.cat-starter,
.badge.community,.badge.measured,.badge.verdict-helps,.badge.verdict-hurts{color:var(--fg)}
main p:not(.breadcrumb) a:not(.btn),main li a,.fine a,.privacy-callout p a{
  text-decoration:underline;
  text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);
  text-decoration-thickness:1px;
  text-underline-offset:4px;
  border-radius:4px;
  transition:color var(--interactive-time) ease,background-color var(--interactive-time) ease;
}
@media(hover:hover) and (pointer:fine){
  main p:not(.breadcrumb) a:not(.btn):hover,main li a:hover,.fine a:hover,.privacy-callout p a:hover{
    text-decoration:none;
    color:color-mix(in srgb,var(--accent) 75%,var(--fg) 25%);
    background:var(--interactive-nav);
    padding:.05em .15em;
    margin:-.05em -.15em;
    box-decoration-break:clone;
    -webkit-box-decoration-break:clone;
  }
}
.breadcrumb a,.search-results li a{
  text-decoration:none;
  font-weight:650;
}
.breadcrumb a:hover,.search-results li a:hover{color:var(--fg);text-decoration:none}
.card h2,.dlg-head h2{overflow-wrap:anywhere}
.cmd{flex-wrap:wrap;overflow-wrap:anywhere}
.cmd code{min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}
.site-explore{border-top:1px solid var(--border);padding:24px 16px;display:flex;flex-wrap:wrap;gap:12px 22px;justify-content:center}
.site-explore a,footer a{font-size:14px;color:var(--muted);text-decoration:none}
.site-explore a:hover,footer a:hover{color:var(--fg);text-decoration:none}
noscript .notice{margin:20px auto;max-width:76ch;padding:16px}
.site-nav{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:14px max(22px,calc((100% - 1080px)/2));min-height:76px;border-bottom:1px solid var(--border);height:auto}
.site-nav .brand{display:flex;align-items:center;gap:9px;color:var(--fg);white-space:nowrap;font-weight:800;font-size:18px}
.site-nav .brand img{width:26px;height:26px}
.site-nav .site-links{display:flex;flex-wrap:wrap;gap:4px;min-width:0;margin-left:auto}
.site-nav .site-links a{display:inline-flex;align-items:center;min-height:40px;padding:8px 11px;border-radius:8px;font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;line-height:1.5;transition:background-color .16s,color .16s}
.site-nav .site-links a[aria-current]:not([aria-current="false"]){color:var(--fg);background:var(--chip);box-shadow:inset 0 0 0 1px var(--border)}
.site-nav .brand,.site-nav .brand:hover{text-decoration:none}
.site-nav a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(max-width:700px){.site-nav .site-links{width:100%;margin-left:0;gap:4px}.site-nav{padding:14px 16px;gap:10px}.site-nav .site-links a{padding:8px 5px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.site-nav .site-links a{transition:none}}
/* Stationary interaction system. Layout and kind indicators never animate. */
:root{
  --interactive-bg:color-mix(in srgb,var(--fg) 4%,var(--card));
  --interactive-border:color-mix(in srgb,var(--fg) 24%,var(--border));
  --interactive-nav:color-mix(in srgb,var(--fg) 5%,transparent);
  --interactive-time:160ms;
}
.site-nav .site-links a{
  transition:color var(--interactive-time) ease,background-color var(--interactive-time) ease;
}
.site-nav .site-links a[aria-current]:not([aria-current="false"]){
  background:var(--interactive-nav);
  box-shadow:none;
  color:var(--fg);
}
.site-nav .site-links a[aria-current]:not([aria-current="false"])::after{
  content:"";position:absolute;left:11px;right:11px;bottom:3px;height:2px;
  border-radius:2px;background:var(--accent);
}
.site-nav .site-links a{position:relative}
.topic,.tile,.card{
  transition:background-color var(--interactive-time) ease,
    border-top-color var(--interactive-time) ease,border-right-color var(--interactive-time) ease,
    border-bottom-color var(--interactive-time) ease;
}
.topic,.tile{box-shadow:none}
.topic h3,.tile h2 a,.tile h3 a{color:var(--fg)}
.tile:focus-within{box-shadow:none}
.tile:has(a:focus-visible){outline:3px solid var(--accent);outline-offset:3px}
.tile h2 a:focus-visible,.tile h3 a:focus-visible{outline:none}
.btn,button:not(.card),.chip,.proj{
  transition:background-color var(--interactive-time) ease,border-color var(--interactive-time) ease,
    color var(--interactive-time) ease;
}
.btn{box-shadow:none}
a.btn,a.topic,.site-nav a{ text-decoration:none }
a,button{ -webkit-tap-highlight-color:transparent }
@media(hover:hover) and (pointer:fine){
  .site-nav .site-links a:hover{color:var(--fg);background:var(--interactive-nav);text-decoration:none}
  .topic:hover,.tile:has(h2 a:hover),.tile:has(h3 a:hover),.card:hover{
    background:var(--interactive-bg);
    border-top-color:var(--interactive-border);
    border-right-color:var(--interactive-border);
    border-bottom-color:var(--interactive-border);
  }
  .topic:hover{border-left-color:var(--interactive-border)}
  .topic:hover,.tile:has(a:hover){box-shadow:none}
  .tile h2 a:hover,.tile h3 a:hover{color:var(--fg);text-decoration:none}
  .tile:has(a:hover)::before{border-color:var(--fg)}
  .btn:hover:not(:disabled):not([aria-disabled="true"]){
    transform:none;opacity:1;text-decoration:none;
    background:color-mix(in srgb,var(--accent) 92%,var(--fg));
  }
  .btn.ghost:hover:not(:disabled),button:not(.btn):not(.card):not(:disabled):not([aria-pressed="true"]):hover{
    background:var(--interactive-bg);border-color:var(--interactive-border);
  }
  .btn.kill:hover:not(:disabled){background:color-mix(in srgb,var(--err) 92%,var(--fg))}
}
.btn:active:not(:disabled):not([aria-disabled="true"]){transform:none;opacity:1;background:color-mix(in srgb,var(--accent) 84%,var(--fg))}
.btn.ghost:active:not(:disabled){background:var(--chip)}
.btn.kill:active:not(:disabled){background:color-mix(in srgb,var(--err) 84%,var(--fg))}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}