/* RidgeWatt shared components. Tokens live in theme.css (design handoff, unchanged).
   Prototype style-hover="..." maps to the h-* classes at the bottom. */
*{box-sizing:border-box}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.wrap{max-width:1280px;margin:0 auto;padding:0 20px}
.rw-label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* header */
.rw-head{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--bg) 86%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--ln)}
.rw-disc{font-size:12px;line-height:1.4;color:var(--tx2);text-align:center;padding:7px 16px;border-bottom:1px solid var(--ln);background:var(--bg2)}
.rw-bar{max-width:1280px;margin:0 auto;padding:0 20px;height:60px;display:flex;align-items:center;gap:24px}
.rw-logo{display:flex;align-items:center;gap:10px;color:var(--tx);flex:none}
.rw-logo:hover{color:var(--tx)}
.rw-nav{display:flex;gap:4px;font-size:14px;font-weight:500}
.rw-nav a{color:var(--tx2);padding:7px 10px;border-radius:7px}
.rw-nav a[aria-current="page"]{color:var(--tx);background:var(--sf2)}
.rw-tools{margin-left:auto;display:flex;gap:8px;align-items:center}
.rw-themebtn{height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--ln2);background:var(--sf);color:var(--tx2);font-size:13px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px}
.rw-themedot{width:10px;height:10px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 3px var(--ac2)}
.rw-menubtn{display:none;height:36px;min-width:44px;padding:0 12px;border-radius:8px;border:1px solid var(--ln2);background:var(--sf);color:var(--tx);font-size:13px;font-weight:500;cursor:pointer}
.rw-menu{display:grid;padding:8px 12px 14px;gap:2px;border-top:1px solid var(--ln);background:var(--bg)}
.rw-menu[hidden]{display:none}
.rw-menu a{color:var(--tx);padding:12px 10px;border-radius:8px;font-size:16px;font-weight:500;min-height:44px;display:flex;align-items:center}
@media (max-width:819px){.rw-nav{display:none}.rw-menubtn{display:block}}
@media (min-width:820px){.rw-menu{display:none!important}}

/* footer */
.rw-foot{border-top:1px solid var(--ln);background:var(--bg2);margin-top:72px}
.rw-fgrid{max-width:1280px;margin:0 auto;padding:40px 20px 28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px}
.rw-fcol{display:grid;gap:8px;font-size:14px;align-content:start}
.rw-fcol a{color:var(--tx2)}
.rw-fcol a:hover{color:var(--tx)}
.rw-fbot{max-width:1280px;margin:0 auto;padding:16px 20px;display:flex;flex-wrap:wrap;gap:8px 24px;font-size:12px;color:var(--tx3)}

/* source badge and verdict pill */
.rw-badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:999px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.02em;white-space:nowrap;vertical-align:middle}
.rw-badge-dot{width:6px;height:6px;border-radius:50%;flex:none}
.rw-pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;vertical-align:middle}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;font-weight:600;font-size:15px;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn-pri{height:48px;padding:0 20px;background:var(--ac);color:var(--acInk);border:0}
.btn-pri:hover{filter:brightness(1.08);color:var(--acInk)}
.btn-sec{height:44px;padding:0 16px;background:var(--sf2);color:var(--tx);border:1px solid var(--ln2);font-weight:500}
.btn-ghost{height:44px;padding:0 16px;background:transparent;color:var(--tx2);border:1px solid var(--ln2);font-weight:500}
.btn-sec:hover,.btn-ghost:hover{color:var(--tx);border-color:var(--tx3)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}

/* image placeholder */
.rw-ph{position:relative;width:100%;background:repeating-linear-gradient(135deg,var(--sf2) 0 10px,var(--sf3) 10px 20px);border-radius:10px;display:flex;align-items:flex-end;justify-content:flex-start;overflow:hidden}
.rw-ph span{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--tx3);padding:8px 10px;background:color-mix(in oklab,var(--bg) 70%,transparent);border-radius:0 8px 0 0}

/* jargon tooltip (click, not hover) */
.rw-term{position:relative;display:inline}
.rw-termbtn{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;text-decoration:underline dotted;text-decoration-color:var(--tx3);text-underline-offset:3px}
.rw-termbtn[aria-expanded="true"]{color:var(--ac)}
.rw-tip{display:block;margin-top:8px;padding:10px 12px;border-radius:10px;background:var(--bg2);border:1px solid var(--ln2);font-size:13px;line-height:1.5;color:var(--tx2);max-width:44ch}
.rw-tip b{font-family:'IBM Plex Mono',monospace;font-weight:500;color:var(--ac);margin-right:4px}
.rw-tip[hidden]{display:none}

/* hover classes (prototype style-hover) */
.h-nav:hover{color:var(--tx)!important;background:var(--sf2)}
.h-btn:hover{color:var(--tx)!important;border-color:var(--tx3)!important}
.h-card:hover{border-color:var(--ac)!important}
.h-pri:hover{filter:brightness(1.08)}
.h-link:hover{color:var(--tx)!important}

/* skeleton */
.rw-skel{background:linear-gradient(90deg,var(--sf2),var(--sf3),var(--sf2));background-size:200% 100%;animation:rw-shimmer 1.4s linear infinite}

/* tables that scroll inside their own box on phones */
.rw-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* product photo: official cut-out on a soft surface (works in dark and light) */
.rw-photo{position:relative;width:100%;border-radius:10px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse 70% 60% at 50% 58%,var(--sf3),var(--sf2) 70%)}
.rw-photo img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
html[data-theme="light"] .rw-photo img{filter:drop-shadow(0 8px 14px rgba(20,30,40,.18))}
.rw-credit{font-size:11px;color:var(--tx3)}
/* Deals stands out in the header and the phone menu */
.rw-nav a.nav-deal{color:var(--rd);display:inline-flex;align-items:center;gap:6px}
.rw-menu a.nav-deal{color:var(--rd);gap:8px}
.nav-deal::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--rd);box-shadow:0 0 0 3px var(--rd2)}
.h-nav.nav-deal:hover{color:var(--rd)!important;background:var(--rd2)}
.rw-nav a.nav-deal[aria-current="page"]{color:var(--rd);background:var(--rd2)}