:root{
  --navy:#050F21;--teal:#003A41;--petrol:#216477;--red:#A81D22;--gold:#E6C882;--goldDeep:#b8923f;
  --ink:#eaf4f6;--ink2:rgba(234,244,246,.72);--ink3:rgba(234,244,246,.46);--line:rgba(255,255,255,.13);
  --darkGrad:linear-gradient(180deg,#0b1a24 0%,#123040 48%,#0b1a24 100%);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;color:var(--ink);font-family:-apple-system,"Segoe UI",Roboto,sans-serif;
  background:var(--darkGrad);background-attachment:fixed;background-repeat:no-repeat}
.wrap{max-width:1100px;margin:0 auto;padding:20px 18px 56px}
.glass{position:relative;background:rgba(255,255,255,.085);border-radius:18px;
  -webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);
  box-shadow:0 10px 32px rgba(0,0,0,.34),inset 0 1.2px 0 rgba(255,255,255,.26),
             inset 0 -1px 0 rgba(255,255,255,.06),inset 1px 0 0 rgba(255,255,255,.10)}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(150deg,rgba(255,255,255,.15),rgba(255,255,255,.01) 46%,rgba(255,255,255,0) 66%)}
.glass>*{position:relative}
.mast{display:flex;align-items:center;gap:16px;padding:12px 18px;margin-bottom:14px}
.logotile{background:none;border-radius:0;padding:0;display:flex;align-items:center;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.crumb{margin-left:auto;font-size:12px;color:var(--ink2)}
.head{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:16px 20px;margin-bottom:12px}
.head img{width:56px;height:56px;border-radius:26%;background:#fff;padding:7px;object-fit:contain}
.head h1{font:700 23px Georgia,serif;margin:0}
.head .sub{font-size:12.5px;color:var(--ink2);margin-top:3px}
.head a.back{margin-left:auto;background:rgba(255,255,255,.13);color:var(--ink);text-decoration:none;
  font:700 12px sans-serif;padding:10px 16px;border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.20)}

/* ---- shared additions for the document pages (index, week ahead). Same vocabulary as the
   stock pages: glass panels on the dark gradient, gold for the lead, brand colours for fills. ---- */
.title{padding:18px 22px;margin-bottom:14px}
.title h1{font:700 27px Georgia,serif;margin:0}
.title .sub{font:400 15px Georgia,serif;color:var(--ink2);margin-top:5px}
.title .meta{font-size:11.5px;color:var(--ink3);margin-top:8px}
.daybar{display:flex;align-items:baseline;gap:12px;padding:9px 18px;margin:20px 0 8px;border-radius:12px;
  background:rgba(255,255,255,.07);border-left:4px solid var(--gold);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.daybar .dn{font:700 11px sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.daybar .dd{font:400 14px Georgia,serif;color:var(--ink)}
.daybar .dc{margin-left:auto;font-size:11.5px;color:var(--ink3)}
.badge{display:inline-block;font:700 9px sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:#fff;padding:3px 10px;border-radius:3px;white-space:nowrap}
.b-high{background:var(--red)}.b-med{background:var(--goldDeep)}.b-low{background:var(--petrol)}
.b-speech{background:var(--petrol)}
.card{padding:0;margin:10px 0;overflow:hidden;border-left:4px solid var(--red)}
.card .ch{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:13px 16px 10px}
.card .rel{font:700 14.5px Georgia,serif;line-height:1.3}
.card .tim{font-size:11px;color:var(--ink3);margin-top:4px}
.card .tim a{color:var(--gold);text-decoration:none}
.card .tim a:hover{text-decoration:underline}
.figs{display:flex;flex-wrap:wrap;gap:16px;padding:8px 16px;background:rgba(255,255,255,.05);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fig{font-size:11px;color:var(--ink3)}
.fig strong{font-size:12px;color:var(--ink)}
.para{padding:12px 16px;font-size:13px;line-height:1.7;color:var(--ink2);text-align:justify;
  text-justify:inter-word;hyphens:auto;font-family:Georgia,serif}
.para .para-section{display:block;padding:6px 0 6px 14px;border-left:3px solid var(--petrol);margin-bottom:8px}
.para .para-section:last-child{margin-bottom:0}
.para .para-heading{display:block;font:700 11px sans-serif;letter-spacing:.05em;color:var(--ink);margin-bottom:3px}
.para .para-placeholder,.para .para-error{font-style:italic;color:var(--gold);font-size:12px;font-family:sans-serif}
.row{display:flex;align-items:center;gap:12px;padding:8px 14px;margin:5px 0;border-radius:11px;
  background:rgba(255,255,255,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);font-size:13px}
.row.med{border-left:3px solid var(--gold)}
.row.low{border-left:3px solid var(--petrol)}
.row .ct{min-width:0}
.row .rl{flex:1;min-width:0;color:var(--ink2)}
.row .rt{margin-left:auto;font-size:11.5px;color:var(--ink3);white-space:nowrap}
.row .rt b{color:var(--ink);font-size:12.5px}
.flag{height:13px;vertical-align:middle;margin-right:6px;border-radius:1px}
.tierlab{font:700 10px sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin:14px 0 4px}
a.lnk{color:var(--gold);text-decoration:none;font-weight:700}
a.lnk:hover{text-decoration:underline}
@media (max-width:640px){
  .wrap{padding:14px 12px 40px}
  .title h1{font-size:22px}
  .card .ch{flex-direction:column;gap:6px}
  .row{flex-wrap:wrap}
  .row .rt{margin-left:0;width:100%}
}
