/* Shared style for the generated /php/, /cve/ and /tools/ pages. Colors and type follow the home page. */
:root{
  --bg:#ebe5e3; --surface:#e1dad7; --ink:#2b2622; --muted:#6a615d; --accent:#0f7d45; --accent-ink:#fff; --bad:#a3271f; --warn:#8a5a00;
  --font:"Noto Serif KR",Georgia,serif;
  --margin:clamp(1.25rem,2.2vw,1.75rem);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:clamp(1.0625rem,1rem + 0.25vw,1.1875rem);line-height:1.7;word-break:keep-all}
a{color:inherit;text-underline-offset:0.2em}
a:hover{color:var(--accent)}
.wrap{max-width:46rem;margin:0 auto;padding:0 var(--margin)}
header.top{border-bottom:1px solid var(--surface)}
header.top .wrap{display:flex;gap:1.25rem;align-items:baseline;justify-content:space-between;padding-top:1rem;padding-bottom:1rem;flex-wrap:wrap}
header.top .brand{font-weight:500;text-decoration:none;font-size:1.125rem}
header.top nav{display:flex;gap:1rem;font-size:0.9375rem}
header.top nav a{text-decoration:none;color:var(--muted)}
main{padding:clamp(2rem,6vw,4rem) 0}
.crumbs{font-size:0.875rem;color:var(--muted);margin:0 0 1rem}
.crumbs a{color:var(--muted)}
h1{font-size:clamp(1.875rem,1.4rem + 2vw,2.75rem);line-height:1.25;font-weight:400;margin:0 0 1rem}
h2{font-size:clamp(1.375rem,1.2rem + 0.8vw,1.75rem);font-weight:400;margin:3rem 0 1rem;line-height:1.35}
h3{font-size:1.125rem;font-weight:500;margin:2rem 0 0.5rem}
.lead{font-size:1.1875rem;color:var(--ink);margin:0 0 2rem}
.facts{display:grid;grid-template-columns:auto 1fr;gap:0.5rem 1.5rem;margin:0 0 2rem;padding:1.25rem 1.5rem;background:var(--surface)}
.facts dt{color:var(--muted)}
.facts dd{margin:0;font-variant-numeric:tabular-nums}
.verdict{padding:1rem 1.25rem;border-left:4px solid var(--muted);background:var(--surface);margin:0 0 2rem}
.verdict b{display:block;font-weight:500;font-size:1.25rem;margin-bottom:0.25rem}
.v-safe{border-color:var(--accent)} .v-safe b{color:var(--accent)}
.v-vulnerable,.v-upgrade{border-color:var(--bad)} .v-vulnerable b,.v-upgrade b{color:var(--bad)}
.v-check,.v-needPatch{border-color:var(--warn)} .v-check b,.v-needPatch b{color:var(--warn)}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:0.9375rem;margin:0 0 1.5rem}
th,td{text-align:left;padding:0.5rem 0.75rem 0.5rem 0;border-bottom:1px solid var(--surface);vertical-align:top}
th{font-weight:500;color:var(--muted)}
.tbl{overflow-x:auto}
.bad{color:var(--bad)} .ok{color:var(--accent)} .warn{color:var(--warn)}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.875em}
pre{background:var(--ink);color:var(--bg);padding:1rem 1.25rem;overflow-x:auto;line-height:1.5}
code{background:var(--surface);padding:0.1em 0.35em}
pre code{background:none;padding:0}
ul,ol{padding-left:1.25rem}
li{margin:0.25rem 0}
.cta{margin:3rem 0 0;padding:1.75rem;background:var(--ink);color:var(--bg)}
.cta h2{margin-top:0;color:var(--bg)}
.cta p{margin:0 0 1rem}
.button{display:inline-block;background:var(--accent);color:var(--accent-ink);padding:0.75rem 1.25rem;text-decoration:none;font-weight:500}
.button:hover{color:var(--accent-ink);filter:brightness(1.1)}
.cta .small{font-size:0.875rem;opacity:0.75;margin:1rem 0 0}
.tool{display:flex;gap:0;margin:0 0 1rem}
.tool input{flex:1;min-width:0;min-height:3.25rem;padding:0 1rem;border:1px solid var(--muted);background:#fff;font:inherit;font-size:1.125rem;border-radius:0}
.tool button{min-height:3.25rem;padding:0 1.25rem;border:0;background:var(--accent);color:var(--accent-ink);font:inherit;font-weight:500;cursor:pointer;border-radius:0}
.out{min-height:3rem}
.pager{display:flex;justify-content:space-between;gap:1rem;margin:2rem 0 0;font-size:0.9375rem}
.note{font-size:0.9375rem;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0;list-style:none}
.chips li{margin:0}
.chips a{display:inline-block;padding:0.25rem 0.6rem;background:var(--surface);text-decoration:none;font-size:0.875rem;font-variant-numeric:tabular-nums}
footer.bottom{border-top:1px solid var(--surface);padding:2rem 0 3rem;font-size:0.875rem;color:var(--muted)}
footer.bottom a{color:var(--muted)}