html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
/* Layout: papan operasi agensi — bar atas (jenama, tab, butang utama), kandungan maks 1240px; ringkasan dahulu, butiran dalam panel sisi kanan */
:root{
  --bg:#f1f5f5; --surface:#ffffff; --surface-2:#e8eff0; --ink:#15262a; --muted:#536a6e;
  --line:#d5e0e1; --line-strong:#b2c3c5;
  --accent:#0b6770; --accent-hover:#08535a; --accent-ink:#ffffff; --accent-soft:#d9eeee;
  --bad:#b42318; --bad-soft:#fce8e6; --warn:#955606; --warn-soft:#fcefd8; --good:#0d6c44; --good-soft:#dcf1e6; --info:#2d53ad; --info-soft:#e4eafa; --neutral-soft:#e8eff0;
  --scrim:rgba(9,25,28,.42); --shadow:0 12px 36px rgba(9,25,28,.20);
  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --r:10px;
}
@media (prefers-color-scheme: dark){
    :root{
    --bg:#0d1517; --surface:#142023; --surface-2:#1a292d; --ink:#e2ecec; --muted:#91a6a9;
    --line:#22353a; --line-strong:#354c51;
    --accent:#52b8c0; --accent-hover:#6fc8cf; --accent-ink:#052528; --accent-soft:#163a3d;
    --bad:#f4887c; --bad-soft:#3b1c19; --warn:#efb45c; --warn-soft:#38290f; --good:#62d09a; --good-soft:#123224; --info:#98aef2; --info-soft:#1c2645; --neutral-soft:#1f2f33;
    --scrim:rgba(0,0,0,.55); --shadow:0 12px 36px rgba(0,0,0,.5);
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
body{background:var(--bg); color:var(--ink); font-family:var(--font-body); font-size:14px; line-height:1.45; -webkit-font-smoothing:antialiased}
body.locked{overflow:hidden}
button{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.wrap{max-width:1240px; margin:0 auto; padding-inline:20px}
@media (max-width:600px){.wrap{padding-inline:16px}}
.muted{color:var(--muted)} .small{font-size:13px} .mono{font-family:var(--font-mono); font-size:12.5px; letter-spacing:-.01em}
b{font-weight:600}

/* ---------- bar atas ---------- */
.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:20; background:var(--surface); border-bottom:1px solid var(--line)}
.top-in{display:flex; align-items:center; gap:8px 22px; min-height:60px; flex-wrap:wrap}
.brand{display:flex; align-items:baseline; gap:10px; white-space:nowrap}
.brand .mark{font-family:var(--font-display); font-size:22px; font-weight:600; letter-spacing:-.01em; color:var(--accent)}
.brand .sub{font-size:11.5px; text-transform:uppercase; letter-spacing:.09em; color:var(--muted); font-weight:500}
.tabs{display:flex; gap:2px; overflow-x:auto; flex:1 1 auto; min-width:0; scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{appearance:none; border:0; background:none; padding:19px 12px 17px; font-weight:500; font-size:14px; color:var(--muted); border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap}
.tab:hover{color:var(--ink)}
.tab.on{color:var(--ink); border-bottom-color:var(--accent)}
@media (max-width:880px){
  .top-in{padding-top:10px}
  .brand{flex:1}
  .tabs{order:3; flex-basis:100%; margin-inline:-8px}
  .tab{padding:10px 10px 11px}
}
@media (max-width:480px){.brand .sub{display:none} .top-in{column-gap:12px}}

/* ---------- butang & cip ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; height:36px; padding:0 14px; border-radius:8px; border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); font-weight:500; font-size:14px; cursor:pointer; white-space:nowrap; text-decoration:none}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink)}
.btn.primary:hover{background:var(--accent-hover); border-color:var(--accent-hover)}
.btn.ghost{border-color:transparent; background:transparent}
.btn.ghost:hover{background:var(--surface-2)}
.btn.sm{height:30px; padding:0 10px; font-size:13px}
.btn.danger{color:var(--bad)}
.btn.subtle{border-color:transparent; background:transparent; color:var(--muted); font-weight:400}
.btn.subtle:hover{color:var(--bad); background:var(--bad-soft)}
.btn.danger-solid{background:var(--bad); border-color:var(--bad); color:var(--surface)}
.btn:disabled{opacity:.55; cursor:default}
.linkbtn{appearance:none; border:0; background:none; padding:0; color:var(--accent); cursor:pointer; text-align:left; font:inherit; text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px}
.chip{display:inline-flex; align-items:center; height:22px; padding:0 9px; border-radius:999px; font-size:12px; font-weight:500; white-space:nowrap; background:var(--neutral-soft); color:var(--muted)}
.chip.good{background:var(--good-soft); color:var(--good)}
.chip.bad{background:var(--bad-soft); color:var(--bad)}
.chip.warn{background:var(--warn-soft); color:var(--warn)}
.chip.info{background:var(--info-soft); color:var(--info)}
.chip.accent{background:var(--accent-soft); color:var(--accent)}

/* ---------- kepala halaman ---------- */
main{padding-block:4px 56px}
.page-h{display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap; margin:24px 0 16px}
.page-h h1{font-family:var(--font-display); font-size:28px; font-weight:600; margin:0; letter-spacing:-.01em; line-height:1.15; text-wrap:balance}
.page-h p{margin:3px 0 0; color:var(--muted)}
.page-h .btns{display:flex; gap:8px; flex-wrap:wrap}
.banner{display:flex; gap:10px 16px; align-items:center; justify-content:space-between; flex-wrap:wrap; margin-top:16px; padding:10px 14px; border-radius:var(--r); background:var(--warn-soft); border:1px solid var(--line)}
.banner > div{min-width:0; flex:1 1 320px}

/* ---------- KPI ---------- */
.kpis{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
@media (max-width:960px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:440px){.kpis{grid-template-columns:minmax(0,1fr)}}
.kpi{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; display:flex; flex-direction:column; gap:3px; min-width:0}
.kpi .lbl{font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); font-weight:500}
.kpi .val{font-family:var(--font-display); font-size:25px; font-weight:600; font-variant-numeric:tabular-nums lining-nums; line-height:1.2; overflow-wrap:anywhere}
.kpi .val.bad{color:var(--bad)}
.kpi .hint{font-size:13px; color:var(--muted)}

/* ---------- panel & senarai ---------- */
.cols{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:16px; margin-top:16px; align-items:start}
@media (max-width:960px){.cols{grid-template-columns:minmax(0,1fr)}}
.panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); min-width:0; overflow:hidden}
.panel-h{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:14px 16px 12px; border-bottom:1px solid var(--line)}
.panel-h h2{font-family:var(--font-display); font-size:18px; font-weight:600; margin:0}
.panel-h span{font-size:13px; color:var(--muted)}
.row-btn{display:grid; align-items:center; gap:4px 14px; width:100%; padding:12px 16px; border:0; border-top:1px solid var(--line); background:none; text-align:left; cursor:pointer}
.row-btn:first-child{border-top:0}
.row-btn:hover{background:var(--surface-2)}
.row-btn .mid{display:flex; flex-direction:column; min-width:0}
.row-btn .t{font-weight:500; overflow-wrap:anywhere}
.row-btn .s{font-size:13px; color:var(--muted); overflow-wrap:anywhere}
.amt{font-variant-numeric:tabular-nums; font-weight:600; text-align:right; white-space:nowrap}
.act{grid-template-columns:118px minmax(0,1fr) auto}
.act .chip{justify-self:start}
@media (max-width:560px){
  .act{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"chip amt" "mid mid"}
  .act .chip{grid-area:chip} .act .amt{grid-area:amt} .act .mid{grid-area:mid}
}
.dep{grid-template-columns:52px minmax(0,1fr) minmax(96px,128px)}
@media (max-width:560px){
  .dep{grid-template-columns:52px minmax(0,1fr); grid-template-areas:"date mid" "date seat"; row-gap:8px}
  .dep .datebox{grid-area:date; align-self:start} .dep .mid{grid-area:mid} .dep .seatcol{grid-area:seat; max-width:220px}
}
.datebox{display:flex; flex-direction:column; align-items:center; justify-content:center; width:52px; height:54px; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface)}
.datebox .d{font-family:var(--font-display); font-size:21px; font-weight:600; line-height:1; font-variant-numeric:lining-nums}
.datebox .m{font-size:10.5px; text-transform:uppercase; letter-spacing:.09em; color:var(--muted); margin-top:3px}
.seatcol{display:flex; flex-direction:column; gap:4px}
.seat{font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap}
.seat b{color:var(--ink)}
.meter{display:block; height:6px; border-radius:3px; background:var(--surface-2); overflow:hidden}
.meter > i{display:block; height:100%; background:var(--accent); border-radius:3px}
.meter.full > i{background:var(--warn)}
.empty{padding:28px 18px; text-align:center; color:var(--muted)}
.empty b{display:block; color:var(--ink); font-size:15px; margin-bottom:4px}

/* ---------- penapis ---------- */
.bar{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px}
.pills{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px}
.pill{height:32px; padding:0 12px; border-radius:999px; border:1px solid var(--line-strong); background:var(--surface); font-weight:500; font-size:13px; cursor:pointer; display:inline-flex; gap:6px; align-items:center}
.pill:hover{border-color:var(--accent)}
.pill .n{font-variant-numeric:tabular-nums; color:var(--muted)}
.pill.on{background:var(--ink); color:var(--surface); border-color:var(--ink)}
.pill.on .n{color:inherit; opacity:.75}
.inp{height:36px; border:1px solid var(--line-strong); border-radius:8px; padding:0 10px; background:var(--surface); color:var(--ink); font:inherit; min-width:0}
input.inp[type=search]{flex:1 1 220px; max-width:360px; padding:0 12px}
select.inp{max-width:100%}

/* ---------- jadual ---------- */
.tbl-wrap{overflow-x:auto; background:var(--surface); border:1px solid var(--line); border-radius:var(--r)}
table{width:100%; border-collapse:collapse; font-size:13.5px}
th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); font-weight:500; padding:10px 12px; border-bottom:1px solid var(--line); white-space:nowrap}
td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tfoot td{border-top:1px solid var(--line-strong); border-bottom:0; font-weight:600}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--surface-2)}
.num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
td .t{font-weight:500}
td .s{font-size:12.5px; color:var(--muted)}
.minibar{display:block; height:4px; width:72px; margin:5px 0 0 auto; border-radius:2px; background:var(--surface-2); overflow:hidden}
.minibar i{display:block; height:100%; background:var(--good)}
.tbl-big{min-width:880px}
.tbl-sup{min-width:760px}
.compact th,.compact td{padding:8px 8px}
.compact th:first-child,.compact td:first-child{padding-left:0}
.compact th:last-child,.compact td:last-child{padding-right:0}
.tbl-note{margin:8px 2px 0; font-size:13px; color:var(--muted)}

/* ---------- pakej & tiket tarikh ---------- */
.pk-list{display:flex; flex-direction:column; gap:12px}
.pk{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; display:flex; flex-direction:column; gap:14px; min-width:0}
.pk.off{background:transparent}
.pk-h{display:flex; gap:10px 16px; justify-content:space-between; align-items:flex-start; flex-wrap:wrap}
.pk-id{min-width:0; flex:1 1 320px}
.pk-title{font-family:var(--font-display); font-size:19px; font-weight:600; line-height:1.25; margin-top:2px}
.pk-title .tempoh{font-family:var(--font-body); font-size:13px; font-weight:500; color:var(--muted); margin-left:4px}
.pk-meta{display:flex; flex-wrap:wrap; gap:2px 16px; font-size:13px; color:var(--muted); margin-top:4px}
.pk-act{display:flex; gap:6px; align-items:center; flex-wrap:wrap}
.stubs{display:flex; flex-wrap:wrap; gap:10px}
.stub{display:flex; align-items:stretch; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface); cursor:pointer; text-align:left; padding:0; min-width:0}
.stub:hover{border-color:var(--accent)}
.stub.closed{opacity:.6}
.stub .a{padding:8px 12px; display:flex; flex-direction:column; justify-content:center}
.stub .a .d{font-family:var(--font-display); font-size:19px; font-weight:600; line-height:1.1; white-space:nowrap; font-variant-numeric:lining-nums}
.stub .a .y{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); white-space:nowrap}
.stub .b{padding:8px 12px; border-left:1.5px dashed var(--line-strong); display:flex; flex-direction:column; justify-content:center; gap:5px; width:132px}
.supgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px}
@media (max-width:400px){.supgrid{grid-template-columns:minmax(0,1fr)}}

/* ---------- panel sisi ---------- */
.sheet{position:fixed; inset:0; z-index:50; display:flex; justify-content:flex-end}
.sheet-bg{position:absolute; inset:0; background:var(--scrim)}
.sheet-panel{position:relative; width:min(620px,100%); height:100%; background:var(--surface); box-shadow:var(--shadow); overflow-y:auto; overscroll-behavior:contain; padding:calc(18px + env(safe-area-inset-top,0px)) 22px calc(32px + env(safe-area-inset-bottom,0px))}
@media (max-width:600px){.sheet-panel{padding-inline:16px}}
@media (prefers-reduced-motion:no-preference){.sheet-panel{animation:slide .18s ease-out}}
@keyframes slide{from{transform:translateX(28px)}}
.sh-nav{display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; min-height:36px}
.sh-head{display:flex; gap:12px; align-items:flex-start; justify-content:space-between; margin-bottom:14px}
.sh-head > div{min-width:0}
.eyebrow{font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; font-weight:500}
.eyebrow.mono{text-transform:none; letter-spacing:0; font-size:12.5px}
.sh-t{font-family:var(--font-display); font-size:25px; font-weight:600; margin:2px 0 0; line-height:1.2; text-wrap:balance; overflow-wrap:anywhere}
.x{appearance:none; border:0; background:none; width:36px; height:36px; border-radius:8px; font-size:24px; line-height:1; color:var(--muted); cursor:pointer; flex:none}
.x:hover{background:var(--surface-2); color:var(--ink)}
.contact{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:-6px 0 14px}
.sel{user-select:all; font-variant-numeric:tabular-nums}
.sec{margin-top:24px}
.sec > h3{font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:600; margin:0 0 8px}
.kv{display:grid; grid-template-columns:max-content minmax(0,1fr); gap:7px 18px; font-size:13.5px; margin:0}
.kv dt{color:var(--muted)} .kv dd{margin:0; min-width:0; overflow-wrap:anywhere}
.box{border:1px solid var(--line); border-radius:var(--r); padding:14px 16px}
.money{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-top:14px}
.money > div{background:var(--surface); padding:10px 12px; min-width:0}
.money .l{font-size:12px; color:var(--muted)}
.money .v{font-size:16.5px; font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.money .v.bad{color:var(--bad)}
@media (max-width:480px){
  .money{grid-template-columns:minmax(0,1fr)}
  .money > div{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:9px 12px}
  .money .v{font-size:15.5px; white-space:nowrap}
}
.progress{height:6px; border-radius:3px; background:var(--surface-2); overflow:hidden; margin-top:10px}
.progress i{display:block; height:100%; background:var(--good)}
.alert{margin:10px 0 0; padding:9px 12px; border-radius:8px; font-size:13.5px}
.alert.bad{background:var(--bad-soft); color:var(--bad)}
.alert.warn{background:var(--warn-soft); color:var(--warn)}
.btnrow{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.note{white-space:pre-wrap; margin:0; padding:10px 12px; background:var(--surface-2); border-radius:8px}
#copy-fallback textarea{width:100%; margin-top:6px; padding:10px; border:1px solid var(--line-strong); border-radius:8px; background:var(--surface); color:var(--ink); font:13px var(--font-body)}

/* ---------- borang ---------- */
form.frm{display:flex; flex-direction:column; gap:16px}
.grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 14px}
.span2{grid-column:1 / -1}
@media (max-width:480px){.grid2{grid-template-columns:minmax(0,1fr)}}
.fld{display:flex; flex-direction:column; gap:5px; font-size:13px; font-weight:500; min-width:0}
.fld input,.fld select,.fld textarea{height:38px; border:1px solid var(--line-strong); border-radius:8px; padding:0 10px; background:var(--surface); color:var(--ink); font:400 14px var(--font-body); width:100%; min-width:0}
.fld textarea{height:auto; padding:8px 10px; resize:vertical}
.fld small{font-weight:400; color:var(--muted); font-size:12px}
.seg{border:0; padding:0; margin:0; display:flex; gap:8px; flex-wrap:wrap}
.seg legend{font-size:13px; font-weight:500; margin-bottom:6px; padding:0}
.seg label{display:inline-flex; align-items:center; gap:8px; height:38px; padding:0 14px; border:1px solid var(--line-strong); border-radius:8px; cursor:pointer; font-size:14px}
.seg label:has(input:checked){border-color:var(--accent); background:var(--accent-soft)}
.preview{border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; background:var(--surface-2); display:flex; flex-direction:column; gap:10px; font-size:13px}
.preview .alert{margin:0}
.pv-line{display:flex; justify-content:space-between; gap:4px 12px; flex-wrap:wrap}
.err{color:var(--bad); font-size:13.5px; margin:0; font-weight:500}
.actions{display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; padding-top:4px}
.inline-form{display:flex; gap:8px 10px; align-items:center; flex-wrap:wrap}
.inline-form input{width:84px}

/* ---------- toast ---------- */
.toast{position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); background:var(--ink); color:var(--surface); padding:10px 16px; border-radius:8px; z-index:70; font-weight:500; box-shadow:var(--shadow); max-width:calc(100% - 32px); text-align:center}

/* ---------- tambahan sistem hosting sendiri ---------- */
.top-act{display:flex; align-items:center; gap:8px; margin-left:auto}
.user-btn{gap:8px; padding:0 8px}
.avatar{display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-weight:600; font-size:13px}
.uname{max-width:140px; overflow:hidden; text-overflow:ellipsis}
@media (max-width:880px){.top-act{order:2}}
@media (max-width:520px){.uname{display:none} #newBk{padding:0 10px}}
.badge{display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 6px; margin-left:4px; border-radius:999px; background:var(--bad); color:var(--surface); font-size:11.5px; font-weight:600; font-variant-numeric:tabular-nums}
.check{display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.4; cursor:pointer}
.check input{margin-top:3px; width:16px; height:16px; flex:none}
.auth{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px 16px}
.auth-box{width:min(420px,100%); background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:28px 26px; display:flex; flex-direction:column; gap:14px; box-shadow:0 10px 30px rgba(9,25,28,.08)}
.auth-box h1{font-family:var(--font-display); font-size:24px; margin:4px 0 0}
.auth-box p{margin:0}
.auth-brand{margin-bottom:4px}
.auth .btn.primary{height:40px}
.kpi .val.good{color:var(--good)}
.tile-row{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-top:10px}
.tile-row > div{background:var(--surface); padding:10px 12px; min-width:0}
.tile-row .l{font-size:12px; color:var(--muted)}
.tile-row .v{font-size:15.5px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap}
.tile-row .v.good{color:var(--good)} .tile-row .v.bad{color:var(--bad)}
@media (max-width:520px){.tile-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kos-row{display:grid; grid-template-columns:minmax(0,1fr) 120px 120px 36px; gap:8px; align-items:center}
.kos-row input,.kos-row select{height:36px; border:1px solid var(--line-strong); border-radius:8px; padding:0 8px; background:var(--surface); color:var(--ink); font:400 14px var(--font-body); width:100%; min-width:0}
@media (max-width:520px){.kos-row{grid-template-columns:minmax(0,1fr) 96px; } .kos-row .kos-asas{grid-column:1} .kos-row .x{grid-column:2; grid-row:2}}
.kos-list{display:flex; flex-direction:column; gap:8px}
.webcard{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; display:flex; flex-direction:column; gap:10px; min-width:0}
.webcard.off{background:transparent}
.webcard .wc-h{display:flex; justify-content:space-between; gap:8px 14px; flex-wrap:wrap; align-items:flex-start}
.webcard .wc-t{font-weight:600; font-size:15px}
.web-list{display:flex; flex-direction:column; gap:10px}
.pv-match{font-size:13px}
.warn-txt{color:var(--warn)} .bad-txt{color:var(--bad)} .good-txt{color:var(--good)}
.linklike{color:var(--accent); text-decoration:underline; text-underline-offset:2px}
.meta-line{font-size:12.5px; color:var(--muted)}
.btnrow a.btn{text-decoration:none}
