/* Shared look for crscalc.ca, prtrack.ca and immiscore.ca. Each site sets --site-accent / --site-accent-dark on <html>. */
:root{
  --bg:#f4f6f5; --surface:#fff; --surface-2:#eef2f0; --ink:#17201c; --muted:#5b6b63; --line:#d8e0db;
  --accent:var(--site-accent,#0e6b5e); --accent-2:color-mix(in srgb,var(--accent) 78%,#000); --on-accent:#fff;
  --warn:#b45309; --warn-bg:#fef3c7; --warn-line:#fedf89;
  --bad:#b42318; --bad-bg:#fef2f2; --bad-line:#fecdca;
  --good:#067647; --good-bg:#ecfdf3; --good-line:#abefc6;
  --radius:14px; --shadow:0 6px 24px rgba(18,35,28,.07);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0f1513; --surface:#18211d; --surface-2:#1f2a25; --ink:#e6ede9; --muted:#a3b3ab; --line:#2d3d35;
    --warn:#fbbf24; --warn-bg:#3a2a0a; --warn-line:#6b4e12;
    --bad:#f97066; --bad-bg:#3a1512; --bad-line:#6b2520;
    --good:#4ade80; --good-bg:#0f2e1f; --good-line:#1d5a3b;
    --accent:var(--site-accent-dark,#2dd4bf); --accent-2:color-mix(in srgb,var(--accent) 80%,#fff); --on-accent:#08201b;
    --shadow:none; color-scheme:dark;
  }
}
.language-picker{display:flex;align-items:center;gap:.4rem;margin:0;flex-shrink:0}
.language-picker select{width:auto;max-width:150px;padding:.4rem}
.topnav-row{flex-wrap:wrap;padding-top:.65rem;padding-bottom:.65rem}
.guide-article{max-width:760px;margin:0 auto;padding:2rem 0;overflow-wrap:anywhere}
.guide-article section{margin:2rem 0}
.latest-news{margin:3rem 0}
.news-heading{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.news-topics{display:flex;gap:.6rem;flex-wrap:wrap;margin:0 0 1.5rem}
.news-topics a{border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;text-decoration:none}
.news-topics a[aria-current="page"]{background:var(--accent);color:var(--on-accent)}
.topnav-row>.navlinks{order:3;flex-basis:100%;flex-wrap:wrap;overflow:visible;min-width:0}
.tracker-case{margin:1.25rem 0}
.tracker-case form{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0}
.tracker-case input,.tracker-case select{width:auto;max-width:100%;flex:1 1 130px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif}
a{color:var(--accent);text-underline-offset:3px}
h1,h2,h3{line-height:1.3;margin:0 0 .5em}
h1{font-size:clamp(26px,4.4vw,40px);font-weight:850;letter-spacing:-.01em}
h2{font-size:clamp(20px,3vw,26px);font-weight:800}
h3{font-size:17px;font-weight:750}
p{margin:0 0 .8em}
.container{max-width:1080px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--surface);padding:8px 12px;border-radius:8px}
.muted{color:var(--muted)} .small{font-size:13.5px} .num{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.mt0{margin-top:0}.mb0{margin-bottom:0}.mt{margin-top:18px}.mb{margin-bottom:18px}

/* top nav */
.topnav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topnav-row{display:flex;align-items:center;gap:16px;min-height:58px}
.brand{font-weight:850;font-size:18px;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand span{color:var(--accent);margin-left:6px;font-weight:700;font-size:14px}
.navlinks{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1}
.navlinks::-webkit-scrollbar{display:none}
.navlinks a{white-space:nowrap;color:var(--ink);text-decoration:none;font-size:14.5px;font-weight:600;padding:6px 10px;border-radius:999px}
.navlinks a:hover{background:var(--surface-2)}
.navlinks a.on{background:var(--surface-2);color:var(--accent)}
@media(max-width:720px){.topnav-row{flex-wrap:wrap;gap:6px 10px;padding:8px 0}.navlinks{order:3;flex-basis:100%}.topnav .btn{margin-left:auto}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;background:var(--accent);color:var(--on-accent);font:inherit;font-weight:700;padding:10px 18px;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--accent-2)}
.btn-sm{padding:6px 14px;font-size:14px}
.btn-ghost{background:transparent;color:var(--accent);border:1px solid var(--line)}
.btn-ghost:hover{background:var(--surface-2)}
.btn-danger{background:var(--bad)}
button:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}

/* layout blocks */
main{padding:24px 0 48px}
.hero{padding:18px 0 8px}
.lede{font-size:17.5px;color:var(--muted);max-width:760px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin:0 0 16px;box-shadow:var(--shadow)}
.card > :last-child{margin-bottom:0}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:860px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:20px;align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr}}
.sticky{position:sticky;top:76px}
@media(max-width:900px){.sticky{position:static}}

/* notices */
.notice{border-radius:12px;padding:12px 16px;margin:0 0 16px;border:1px solid var(--line);background:var(--surface-2);font-size:15px}
.notice-warn{background:var(--warn-bg);border-color:var(--warn-line)}
.notice-warn strong{color:var(--warn)}
.notice-bad{background:var(--bad-bg);border-color:var(--bad-line)}
.notice-good{background:var(--good-bg);border-color:var(--good-line)}
.disclaimer{font-size:13.5px;color:var(--muted);background:var(--surface-2);border-radius:12px;padding:12px 14px;margin:0 0 16px}
.disclaimer strong{color:var(--ink)}

/* badges */
.badge{display:inline-block;font-size:12px;font-weight:750;padding:2px 8px;border-radius:999px;background:var(--surface-2);color:var(--muted);white-space:nowrap;vertical-align:1px}
.badge-good{background:var(--good-bg);color:var(--good)}
.badge-warn{background:var(--warn-bg);color:var(--warn)}
.badge-bad{background:var(--bad-bg);color:var(--bad)}

/* forms */
fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px 6px;margin:0 0 16px;background:var(--surface)}
legend{font-weight:800;padding:0 6px}
.field{margin:0 0 14px}
.field > label,.field > .label{display:block;font-weight:650;font-size:14.5px;margin-bottom:5px}
.hint{display:block;font-size:13px;color:var(--muted);margin-top:4px;font-weight:400}
input[type=text],input[type=email],input[type=number],input[type=password],input[type=date],input[type=month],input[type=url],select,textarea{
  width:100%;font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
textarea{min-height:120px}
input:focus,select:focus,textarea:focus,.btn:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 40%,transparent);outline-offset:1px}
.check{display:flex;gap:9px;align-items:flex-start;font-size:15px;margin:0 0 10px;font-weight:500}
.check input{margin-top:6px;flex:none;width:17px;height:17px;accent-color:var(--accent)}
.radios{display:flex;flex-wrap:wrap;gap:8px}
.radios label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-weight:600;font-size:14.5px;cursor:pointer;background:var(--surface)}
.radios input{accent-color:var(--accent)}
.lang-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.lang-grid label{font-size:13px;font-weight:650;color:var(--muted)}
@media(max-width:520px){.lang-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.field-error,.validation-summary-errors{color:var(--bad);font-size:14px}
.validation-summary-errors ul{margin:0;padding-left:18px}

/* tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--surface-2);font-size:13px;font-weight:800;white-space:nowrap}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}
tr.pending td{color:var(--muted)}

/* score result */
.score{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.score-total{font-size:56px;font-weight:900;line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.score-of{color:var(--muted);font-weight:650}
.section{margin:16px 0 0}
.section-head{display:flex;justify-content:space-between;gap:8px;font-weight:750}
.bar{height:8px;background:var(--surface-2);border-radius:999px;overflow:hidden;margin:6px 0 8px}
.bar > i{display:block;height:100%;background:var(--accent);border-radius:999px}
.items{list-style:none;margin:0;padding:0;font-size:14px}
.items li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed var(--line)}
.items li:last-child{border-bottom:0}
.items .note{display:block;color:var(--muted);font-size:12.5px}
.rule-version{font-size:13px;color:var(--muted);margin-top:12px}
.compare li{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

/* draw cards */
.draw-card .cut{font-size:34px;font-weight:900;color:var(--accent);line-height:1.1;font-variant-numeric:tabular-nums}
.draw-card .meta{font-size:13.5px;color:var(--muted)}
.chart{width:100%;height:auto;display:block}
.chart text{fill:var(--muted);font-size:11px}
.chart .line{fill:none;stroke:var(--accent);stroke-width:2}
.chart .dot{fill:var(--accent)}
.chart .grid{stroke:var(--line);stroke-width:1}

/* share card */
.share-card{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--on-accent);border-radius:18px;padding:24px;max-width:520px}
.share-card .score-total{color:inherit}
.share-card .muted,.share-card a{color:inherit;opacity:.85}

/* footer */
footer{border-top:1px solid var(--line);padding:28px 0 40px;color:var(--muted);font-size:13.5px;background:var(--surface)}
footer a{color:var(--muted)}
.footer-links{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0}
.prose{max-width:760px}
.prose li{margin:4px 0}
@media print{.topnav,footer,.no-print{display:none!important}body{background:#fff}.card{box-shadow:none;break-inside:avoid}}