/* HV matte glass (approved 9 Oct 2026). v51 (10 Oct): a visible matte grain, no gloss, richer accents, room inside
   every section. v52 (10 Oct, Harsh: "the gradient looked better, keep it as the background"): the soft golden-hour
   (Desk) & dusk (Company File) backgrounds are back, & the panels are frosted matte glass over them: translucent,
   blurred, grained, with no shine. Colours from the palette: Harbour blue #1D4A70 & Ember #E76A40 with cream, ink,
   up green & down red. Loaded last, after hv-cream.css, on every Desk page. Remove this file to go back to cream. */
.hvd{--harbour:#1D4A70;--ember:#E76A40;--ember-ink:#B8461F;--ember-glow:#FF9A73;
 /* the matte grain: fine noise laid over each surface at 7% (light) & 10% (dark), plain blending */
 --grain-l:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='2 0 0 0 -.5 2 0 0 0 -.5 2 0 0 0 -.5 0 0 0 0 .07'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
 --grain-d:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='2 0 0 0 -.5 2 0 0 0 -.5 2 0 0 0 -.5 0 0 0 0 .1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
 --m-light:var(--grain-l),radial-gradient(140% 90% at 0% 0%,rgba(255,255,255,.22),rgba(255,255,255,0) 55%),linear-gradient(180deg,rgba(255,253,250,.7),rgba(255,248,241,.58));
 --m-blur:blur(24px) saturate(160%);
 /* dark glass: rich Harbour blue (v52: denser, so the scene tints it rather than greying it), an ember glow top right */
 --m-dark:var(--grain-d),radial-gradient(120% 80% at 100% 0%,rgba(231,106,64,.16),rgba(231,106,64,0) 55%),linear-gradient(165deg,rgba(32,82,124,.86),rgba(24,60,96,.9) 55%,rgba(18,40,66,.93));
 --m-tile:rgba(255,255,255,.82); /* cards inside the glass: near-opaque white paper, so figures stay crisp */
 --m-rim:inset 0 1px 0 rgba(255,255,255,.6),0 0 0 1px rgba(30,26,23,.055);
 --m-shadow:0 2px 4px -2px rgba(29,74,112,.12),0 14px 28px -18px rgba(29,74,112,.28),0 30px 60px -36px rgba(29,74,112,.3);
 --m-tile-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 0 0 1px rgba(29,74,112,.07),0 6px 14px -10px rgba(29,74,112,.32);
 --m-dark-rim:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(9,22,40,.25);
 --m-dark-shadow:0 2px 6px -2px rgba(9,22,40,.35),0 30px 60px -30px rgba(9,22,40,.6)}

/* ---------- the page: a soft scene behind the glass (Desk & Company File), plain cream elsewhere ---------- */
body:has(>.hvd),html body .hvd{background:#FFF0E1}
body:has(>.hvd.env-light),body:has(>.hvd.env-dusk){background:#F1E6DC}
html body .hvd.env-light,html body .hvd.env-dusk{position:relative;isolation:isolate;background:
 radial-gradient(760px 620px at -4% 1180px,rgba(44,103,149,.17),rgba(44,103,149,0) 70%),
 radial-gradient(720px 620px at 104% 1700px,rgba(231,106,64,.15),rgba(231,106,64,0) 70%),
 radial-gradient(820px 560px at 30% 2500px,rgba(231,106,64,.1),rgba(231,106,64,0) 70%),
 radial-gradient(700px 560px at 90% 3300px,rgba(44,103,149,.12),rgba(44,103,149,0) 70%),#F1E6DC}
.hvd.env-light::before,.hvd.env-dusk::before{content:"";position:absolute;left:0;right:0;top:0;height:1150px;z-index:-1;pointer-events:none;
 background:url(/assets/hv-env-light.webp?v=1) center top/cover no-repeat;
 -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}
.hvd.env-dusk::before{background-image:url(/assets/hv-env-dusk.webp?v=1)}

/* ---------- shell: matte top bar & tabs, a dark matte dock (every Desk page) ---------- */
html .hvd .hvd-bar{margin:12px 14px 0;border:0;border-radius:20px;color:#1E1A17;background:var(--m-light);-webkit-backdrop-filter:var(--m-blur);backdrop-filter:var(--m-blur);box-shadow:var(--m-rim),var(--m-shadow)}
html .hvd .hvd-cmd form{background:#FFFFFF;border:0;border-radius:14px;box-shadow:inset 0 1px 2px rgba(29,74,112,.12),0 0 0 1px rgba(29,74,112,.08)}
html .hvd .hvd-logo i{border-radius:11px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
html .hvd .hvd-av{background:linear-gradient(160deg,#2C6795,#1D4A70);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 2px #fff}
html .hvd nav.hvd-tabs{background:transparent;border:0;padding:10px 16px 2px;gap:8px}
html .hvd nav a.hvd-tab{border:0;border-radius:12px;background:var(--m-tile);box-shadow:var(--m-tile-shadow)}
html .hvd nav a.hvd-tab.on{box-shadow:inset 0 -3px 0 var(--ember),var(--m-tile-shadow)}
html .hvd .hvd-tab.on .t{color:var(--ember-ink)}
html .hvd .hvd-dock{background:var(--grain-d),linear-gradient(180deg,rgba(36,42,54,.9),rgba(20,24,32,.94))!important;border:0!important;border-radius:22px!important;padding:7px!important;
 -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(9,22,40,.3),0 22px 44px -18px rgba(10,16,28,.7)!important}
html .hvd nav a.hvd-dk{color:#EDE6DD!important;border-radius:15px}
html .hvd nav a.hvd-dk:hover{background:rgba(255,255,255,.08)}
html .hvd nav a.hvd-dk.on{background:linear-gradient(180deg,#EE7A4B,#DF622F)!important;color:#1E1A17!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 16px -8px rgba(231,106,64,.8)}
html .hvd .hvd-menu summary{background:linear-gradient(180deg,#2B2521,#151210)!important;border-color:transparent!important;border-radius:13px}
html .hvd .hvd-menu summary:hover,html .hvd .hvd-menu[open] summary{background:linear-gradient(180deg,#EE7A4B,#DF622F)!important;color:#1E1A17!important}
html .hvd .hvd-mdd{border:0;border-radius:18px;background:var(--m-light);box-shadow:var(--m-rim),0 26px 60px -20px rgba(29,74,112,.45)}

/* the top bar for visitors (12 Oct 2026, with the landing page in the Desk): Sign in & Start free beside the Menu; Start free
   in the Desk's ember with dark words, like the other main buttons */
html .hvd .hvd-in{flex:none;padding:7px 4px;font-size:13.5px;font-weight:500;line-height:1.2;color:#1E1A17;text-decoration:none;white-space:nowrap}
html .hvd .hvd-in:hover{text-decoration:underline;text-underline-offset:3px}
html .hvd .hvd-start{flex:none;display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:999px;font-size:13.5px;font-weight:600;line-height:1.2;white-space:nowrap;text-decoration:none;color:#1E1A17;background:linear-gradient(180deg,#EE7A4B,#DF622F);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -10px rgba(231,106,64,.85)}
html .hvd .hvd-start:hover{color:#1E1A17;background:linear-gradient(180deg,#E26A3B,#C9531F)}
html .hvd :is(.hvd-in,.hvd-start):focus-visible{outline:2px solid #E76A40;outline-offset:2px}
@media(max-width:900px){html .hvd .hvd-in{margin-left:auto}html .hvd .hvd-start+.hvd-menu{margin-left:0}}
@media(max-width:420px){html .hvd .hvd-bar{column-gap:8px}html .hvd .hvd-in{padding:7px 2px;font-size:13px}html .hvd .hvd-start{padding:0 12px;font-size:13px}}
/* the company box keeps its whole hint ("Open a company: name, BSE code or ISIN") where the bar is tight: the "/" key hint
   goes on touch-size screens (no keyboard there), & the hint is a touch smaller on the narrowest phones */
@media(max-width:1024px){html .hvd .hvd-cmd kbd{display:none}}
@media(max-width:380px){html .hvd .hvd-cmd input::placeholder{font-size:14px}}
/* ---------- HV Desk ---------- */
html .hvd .dsk .gl,html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .note{border:0;border-radius:24px;background:var(--m-light);box-shadow:var(--m-rim),var(--m-shadow);-webkit-backdrop-filter:var(--m-blur);backdrop-filter:var(--m-blur)}
html .hvd .dsk .mast{border-bottom:0}
html .hvd .dsk .mast .d{color:var(--ember-ink)}
html .hvd .dsk .mast h1{font-size:27px;letter-spacing:-.015em}
html .hvd .dsk .q{background:rgba(231,106,64,.11)!important;color:var(--ember-ink)!important;box-shadow:inset 0 0 0 1px rgba(231,106,64,.22)}
html .hvd .dsk .kf{background:rgba(231,106,64,.12);color:var(--ember-ink);border-radius:999px;padding:2px 9px}
html .hvd .dsk .pulse{background:var(--ember);box-shadow:0 0 0 3px rgba(231,106,64,.2)}
html .hvd .dsk a.go,html .hvd .dsk .hz a.go2,html .hvd .dsk .gx a.go{background:linear-gradient(180deg,#EE7A4B,#DF622F)!important;color:#1E1A17!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -10px rgba(231,106,64,.85)!important;border-radius:13px!important}
html .hvd .dsk a.go::after{color:#1E1A17!important}
html .hvd .dsk a.go:hover,html .hvd .dsk .hz a.go2:hover,html .hvd .dsk .gx a.go:hover{background:linear-gradient(180deg,#E26A3B,#C9531F)!important;color:#1E1A17!important}
html .hvd .dsk .how,html .hvd .dsk .more2,html .hvd .dsk .why a,html .hvd .dsk .note a,html .hvd .dsk .mwhy a,html .hvd .dsk .mlater a,html .hvd .dsk .malso a,html .hvd .dsk .mvall summary{color:var(--harbour)!important}
/* frosted tiles inside the panels */
html .hvd .dsk .sc4,html .hvd .dsk .ec,html .hvd .dsk .dd,html .hvd .dsk .how-box{border:0;border-radius:18px;background:var(--m-tile);box-shadow:var(--m-tile-shadow)}
html .hvd .dsk .mv{border:0!important;border-radius:18px;background:var(--m-tile);box-shadow:var(--m-tile-shadow)}
/* richer: each card says up or down at a glance, each industry stage carries its colour */
html .hvd .dsk .mv.up{background:linear-gradient(180deg,rgba(30,122,90,.075),rgba(30,122,90,0) 96px),linear-gradient(180deg,#FFFFFF,#FFFCF8);}
html .hvd .dsk .mv.dn{background:linear-gradient(180deg,rgba(176,57,43,.075),rgba(176,57,43,0) 96px),linear-gradient(180deg,#FFFFFF,#FFFCF8);}
html .hvd .dsk .sc4[data-k="strong"]{box-shadow:inset 0 3px 0 #2F7D4F,var(--m-tile-shadow)}
html .hvd .dsk .sc4[data-k="recovering"]{box-shadow:inset 0 3px 0 var(--harbour),var(--m-tile-shadow)}
html .hvd .dsk .sc4[data-k="cooling"]{box-shadow:inset 0 3px 0 var(--ember),var(--m-tile-shadow)}
html .hvd .dsk .sc4[data-k="weak"]{box-shadow:inset 0 3px 0 #B0392B,var(--m-tile-shadow)}
html .hvd .dsk .tog{background:rgba(29,74,112,.07);border:0;border-radius:13px;box-shadow:inset 0 1px 2px rgba(29,74,112,.12)}
html .hvd .dsk .tog button.on{background:#fff;border-radius:10px;box-shadow:0 2px 6px -2px rgba(29,74,112,.35)}
html .hvd .dsk .col{border-left:1px solid rgba(29,74,112,.09)}
html .hvd .dsk .front .col:first-child{border-left:0}
/* What changed: a Harbour-blue matte panel */
html .hvd .dsk .rail{border:0;border-radius:24px;color:#F5EFE8;background:var(--m-dark);box-shadow:var(--m-dark-rim),var(--m-dark-shadow);-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%)}
html .hvd .dsk .rail .hd{border-bottom:1px solid rgba(255,255,255,.1)}
html .hvd .dsk .rail h3{color:#fff}
html .hvd .dsk .rail h3 span{background:var(--ember);color:#1E1A17}
html .hvd .dsk .flt,html .hvd .dsk .flt button{color:#C9D4E0}
html .hvd .dsk .flt button.on{color:#fff;background:rgba(255,255,255,.12);border-radius:9px}
html .hvd .dsk .rail .day{color:var(--ember-glow)}
html .hvd .dsk .rail .it{border-bottom:0;margin:0 10px 8px;border-radius:14px;background:rgba(255,255,255,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(255,255,255,.06)}
html .hvd .dsk .rail .it:hover{background:rgba(255,255,255,.11)}
html .hvd .dsk .rail .it h4,html .hvd .dsk .rail .it h4 a,html .hvd .dsk .rail a{color:#F5EFE8}
html .hvd .dsk .rail .it p,html .hvd .dsk .rail p{color:#C9D4E0}
html .hvd .dsk .rail .it .ty2,html .hvd .dsk .rail .t{color:#9DB0C4}

/* ---------- Company File: Harbour-blue matte hero, white cards inside, light matte sections ---------- */
html .hvd .cf2-hero{border:0;border-radius:26px;overflow:hidden;color:#F5EFE8;background:var(--m-dark)!important;box-shadow:var(--m-dark-rim),var(--m-dark-shadow)!important;-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%)}
html .hvd .cf2-hero h1{color:#fff}
html .hvd .cf2-hero .eyebrow{background:rgba(255,154,115,.14)!important;color:#FFB59A!important;box-shadow:inset 0 0 0 1px rgba(255,154,115,.28)}
html .hvd .cf2-hero .ids,html .hvd .cf2-hero .hv-asof,html .hvd .cf2-hero .h-basis p,html .hvd .cf2-hero .wl-view{color:#C9D4E0}
html .hvd .cf2-hero .cf-about{border-top:1px solid rgba(255,255,255,.12)}
html .hvd .cf2-hero .cf-about h2{color:var(--ember-glow)}
html .hvd .cf2-hero .cf-about-text{color:#E8E2D9}
html .hvd .cf2-hero .seg{background:rgba(0,0,0,.2);border-color:transparent;border-radius:13px}
html .hvd .cf2-hero .seg a,html .hvd .cf2-hero .seg span{color:#C9D4E0;border-color:transparent}
html .hvd .cf2-hero .seg .on{background:#fff;color:#1E1A17;border-radius:10px}
html .hvd .cf2-hero .btn-x{color:#F5EFE8;border:0;border-radius:13px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.24)}
html .hvd .cf2-hero .btn-x:hover{background:rgba(255,255,255,.18)}
/* v52: the watchlist button in the same frosted glass as the panes, its star in ember */
html .hvd .cf2-hero .wl-watch button{background:rgba(255,255,255,.13);color:#fff;border:0;border-radius:13px;padding:9px 16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.22)}
html .hvd .cf2-hero .wl-watch button:hover{background:rgba(255,255,255,.2)}
html .hvd .cf2-hero .wl-watch button{display:inline-flex;align-items:center;gap:7px}
html .hvd .cf2-hero .wl-watch button .wl-st{color:var(--ember-glow);flex:none}
html .hvd .cf2-hero .wl-watch button.on{background:rgba(255,154,115,.16);color:#FFE2D6;box-shadow:inset 0 0 0 1px rgba(255,154,115,.42)}
html .hvd .cf2-hero .h-q{border:0;border-radius:20px;background:rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.08)}
html .hvd .cf2-hero .h-q>.k{color:var(--ember-glow)}
html .hvd .cf2-hero .h-qt{color:#fff}
html .hvd .cf2-hero .h-q3>div{border:0;border-radius:14px;background:rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(255,255,255,.07)}
html .hvd .cf2-hero .h-q3 b{color:#fff}
html .hvd .cf2-hero .h-q3 small,html .hvd .cf2-hero .k{color:#9DB0C4}
html .hvd .cf2-hero .h-q .up{color:#7FE0B8}html .hvd .cf2-hero .h-q .dn{color:#FF8A78}
/* v52: the price & market cap pane matches the plain-words box (Harsh) */
html .hvd .cf2-hero .h-px{border:0;border-radius:20px;background:rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.08)}
html .hvd .cf2-hero .h-px>.k{color:var(--ember-glow)}
html .hvd .cf2-hero .h-px .up{color:#7FE0B8}html .hvd .cf2-hero .h-px .dn{color:#FF8A78}
html .hvd .cf2-hero .hq-vs{color:#C9D4E0;opacity:1}
html .hvd .cf2-hero .hq-sk .sk{fill:#fff;opacity:.26}html .hvd .cf2-hero .hq-sk .sk-now{fill:var(--ember-glow)}html .hvd .cf2-hero .hq-sk .sk-neg{fill:#FF8A78;opacity:.6}
html .hvd .cf2-hero .hq-sk .sk-ln{stroke:#fff;stroke-opacity:.5}html .hvd .cf2-hero .hq-sk .sk-dot{stroke:var(--ember-glow)}
html .hvd .cf2-hero .hq-note{color:#9DB0C4;opacity:1}
html .hvd .cf2-hero .ro{border:0;border-radius:18px;color:#1E1A17;background:var(--m-tile);box-shadow:inset 0 1px 0 #fff,0 10px 24px -16px rgba(0,0,0,.55)}
html .hvd .cf2-hero .ro strong,html .hvd .cf2-hero .ro small b,html .hvd .cf2-hero .gnow,html .hvd .cf2-hero .gends b{color:#1E1A17}
html .hvd .cf2-hero .ro small,html .hvd .cf2-hero .ro .k,html .hvd .cf2-hero .gends{color:#5E5249}
html .hvd .cf2-hero .ro .up{color:#1E7A5A}html .hvd .cf2-hero .ro .dn{color:#B0392B}
html .hvd .cf2-hero .gt b{background:var(--ember)}
html .hvd .cf2-ribbon{margin:0 18px 18px;border:0;border-radius:18px;background:var(--m-tile);box-shadow:inset 0 1px 0 #fff,0 10px 24px -16px rgba(0,0,0,.55)}
html .hvd .cf2-ribbon dl>div{border-left:1px solid rgba(29,74,112,.1)}
html .hvd .cf2-ribbon dt{color:#5E5249}html .hvd .cf2-ribbon dd{color:#1E1A17}
html .hvd .cf2-ribbon dd.up{color:#1E7A5A}html .hvd .cf2-ribbon dd.dn{color:#B0392B}
html .hvd .cf2-ribbon .rb-l{background:linear-gradient(180deg,#EE7A4B,#DF622F);color:#1E1A17;border-radius:18px 0 0 18px}
html .hvd .cf2-read,html .hvd .cf2-sec{border:0;border-radius:24px;background:var(--m-light);box-shadow:var(--m-rim),var(--m-shadow);-webkit-backdrop-filter:var(--m-blur);backdrop-filter:var(--m-blur)}
html .hvd .cf2-read a{border:0;border-radius:14px;background:var(--m-tile);box-shadow:var(--m-tile-shadow)}
html .hvd .cf2-read a:hover{background:#fff}
html .hvd .cf2-read a[aria-current]{background:#fff;color:#1E1A17;box-shadow:inset 0 -3px 0 var(--ember),var(--m-tile-shadow)}
html .hvd .cf2-read a[aria-current] small{color:#5E5249}html .hvd .cf2-read a[aria-current] .n{color:var(--ember-ink)}
/* v51: every section is a matte panel with room inside it (in v50 the numbers, pills, headings & "Add your own
   ratios" touched its edges); the white tiles inside are the cards; ratio rows stay plain rows. */
html .hvd .cf2-sec{padding:18px 22px 20px}
html .hvd .cf2 nav.cf2-read{padding:14px 18px 16px}
html .hvd .cf2 .panel,html .hvd .cf2 .side>div{border-color:transparent;border-radius:16px;background:var(--m-tile);box-shadow:var(--m-tile-shadow)}
html .hvd .cf2 .panel{padding:14px 16px}
html .hvd .cf2 .rgroup .rt{border-bottom:1px solid rgba(29,74,112,.08)}
html .hvd .cf2 .rgroup .rt:last-child{border-bottom:0}
html .hvd .cf2-sec .kick{color:var(--ember-ink)}
html .hvd .cf2-sec .idx{border:0;border-radius:10px;background:rgba(231,106,64,.12);color:var(--ember-ink);font-weight:600;box-shadow:inset 0 0 0 1px rgba(231,106,64,.22)}
html .hvd .cf2-sec>.sh{border-bottom:1px solid rgba(29,74,112,.1)}
html .hvd .cf2 .pill{background:#fff;border-color:rgba(29,74,112,.12)}
html .hvd .cf2-sec .short{background:rgba(29,74,112,.06);border:0;border-radius:16px}
html .hvd .cf2-sec .short .is{background:#fff;color:var(--harbour)}
html .hvd .cf2 .tabs a.on{background:#fff;color:#1E1A17;border-color:transparent;box-shadow:inset 0 -3px 0 var(--ember)}
html .hvd .cf2 .ichart .area{fill:var(--harbour)}
html .hvd .cf-tip b{color:var(--ember-ink)}

/* ---------- v56 (11 Oct 2026, Harsh: "glass is translucent, matte but translucent… making the glass white"):
   white frosted glass on the Desk. Panels are white glass, blurred, with a bright top edge, a white rim & a soft
   shadow; the cards inside are whiter glass with the same rim, so there are two clear layers. Matte: a faint grain &
   no shine. Hairlines are neutral, not beige.
   v58 (11 Oct, Harsh: "the translucent transparent effect is still missing", then with a reference of white frosted
   cards over a smooth blue light: "no circles… a darker colour from my palette… not amber or orange"): the scene is a
   smooth Harbour-blue light, deepest at the top left & fading to a pale blue-white at the right, fixed to the window,
   with no shapes in it. The panels are white frosted glass that lets the blue through (bluer on the left, whiter on
   the right); the blur also lifts what it frosts (lower contrast, a little brighter), so dark words stay readable over
   the blue. ---------- */
.hvd{--grain-w:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='2 0 0 0 -.5 2 0 0 0 -.5 2 0 0 0 -.5 0 0 0 0 .035'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
 --w-panel:var(--grain-w),linear-gradient(160deg,rgba(255,255,255,.74),rgba(255,255,255,.62) 48%,rgba(255,255,255,.68));
 --w-blur:blur(28px) saturate(140%) contrast(.7) brightness(1.24);
 --w-rim:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.55),0 0 0 1px rgba(30,26,23,.045);
 --w-shadow:0 1px 2px rgba(30,26,23,.05),0 14px 34px -20px rgba(30,26,23,.3),0 44px 80px -52px rgba(29,74,112,.34);
 --w-tile:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.64));
 --w-tile-rim:inset 0 1px 0 #FFFFFF,inset 0 0 0 1px rgba(255,255,255,.75),0 0 0 1px rgba(30,26,23,.05);
 --w-tile-shadow:var(--w-tile-rim),0 10px 24px -18px rgba(30,26,23,.32);
 --w-line:rgba(30,26,23,.08)}
/* the scene: a smooth Harbour-blue light fixed to the window, deepest at the top left, pale blue-white at the right,
   brightest at the top right (where the light comes from); no shapes & no warm colours. The golden-hour picture is off. */
.hvd.env-light::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:
 radial-gradient(60% 55% at 100% 0%,rgba(255,255,255,.5),rgba(255,255,255,0) 70%),
 linear-gradient(115deg,#1D4A70 0%,#2C6795 20%,#4F84B9 38%,#8DB2D8 58%,#C6D8EB 76%,#E8EFF7 100%)}
.hvd.env-light::before{display:none}
/* the shell on every Desk page */
html .hvd .hvd-bar,html .hvd .hvd-mdd{background:var(--w-panel);box-shadow:var(--w-rim),var(--w-shadow);-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur)}
html .hvd nav a.hvd-tab{background:var(--w-tile);box-shadow:var(--w-tile-shadow)}
html .hvd nav a.hvd-tab.on{background:#FFFFFF;box-shadow:inset 0 -3px 0 var(--ember),var(--w-tile-shadow)}
/* Desk panels: one family of white glass, the What changed rail included */
html .hvd .dsk .gl,html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .note,html .hvd .dsk .rail,html .hvd .dsk .tk{border:0;background:var(--w-panel);box-shadow:var(--w-rim),var(--w-shadow);-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur)}
html .hvd .dsk .tk{border-radius:22px}
/* the edge catches the light: a 1px ring, bright at the top left, fading across, a little light again at the bottom right */
html .hvd .dsk .gl,html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .note{position:relative}
@media(max-width:1100px){html .hvd .dsk .rail{position:relative}} /* sticky (a positioned box) on wider screens */
html .hvd .dsk .gl::after,html .hvd .dsk .ins::after,html .hvd .dsk .front::after,html .hvd .dsk .cont::after,html .hvd .dsk .note::after,html .hvd .dsk .rail::after,html .hvd .dsk .tk::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;padding:1px;pointer-events:none;
 background:linear-gradient(150deg,rgba(255,255,255,1),rgba(255,255,255,.4) 24%,rgba(255,255,255,0) 52%,rgba(255,255,255,.2) 80%,rgba(255,255,255,.75));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
/* cards inside the panels: whiter glass */
html .hvd .dsk .sc4,html .hvd .dsk .ec,html .hvd .dsk .dd,html .hvd .dsk .how-box,html .hvd .dsk .mvx,html .hvd .dsk .tgc,html .hvd .dsk .idrop,html .hvd .dsk .dk-lock{border:0;background:var(--w-tile);box-shadow:var(--w-tile-shadow)}
html .hvd .dsk .sc4[data-k="strong"]{box-shadow:inset 0 3px 0 #2F7D4F,var(--w-tile-shadow)}
html .hvd .dsk .sc4[data-k="recovering"]{box-shadow:inset 0 3px 0 var(--harbour),var(--w-tile-shadow)}
html .hvd .dsk .sc4[data-k="cooling"]{box-shadow:inset 0 3px 0 var(--ember),var(--w-tile-shadow)}
html .hvd .dsk .sc4[data-k="weak"]{box-shadow:inset 0 3px 0 #B0392B,var(--w-tile-shadow)}
html .hvd .dsk .idrop{border-radius:14px}
html .hvd .dsk .mvx{border-radius:16px}
html .hvd .dsk .tgc{border-radius:14px}
/* tables: whiter glass, so the figures stay crisp. Where a table scrolls sideways (narrow panes) the company column
   stays solid white over the rows that slide under it; where every column fits, it is glass like the rest. */
html .hvd .dsk .bmw{border:0;box-shadow:var(--w-tile-shadow);background:linear-gradient(to left,rgba(255,255,255,.92) 45%,rgba(255,255,255,0)) right center/34px 100% no-repeat local,radial-gradient(farthest-side at 100% 50%,rgba(30,26,23,.16),rgba(30,26,23,0)) right center/12px 100% no-repeat scroll,rgba(255,255,255,.78)}
html .hvd .dsk table.bmt thead th{background:rgba(255,255,255,.5)}
html .hvd .dsk table.bmt thead tr:first-child th:first-child,html .hvd .dsk table.bmt tbody th{background:#FFFFFF}
html .hvd .dsk table.bmt tr.won th{background:#FFF6F0}
/* v66: the table fits from about 828px (the reason now has a column of its own), so the name stops being fixed there */
@container (min-width:828px){
 html .hvd .dsk table.bmt thead tr:first-child th:first-child,html .hvd .dsk table.bmt tbody th{position:static}
 html .hvd .dsk table.bmt thead tr:first-child th:first-child{background:rgba(255,255,255,.5)}
 html .hvd .dsk table.bmt tbody th{background:transparent}
 html .hvd .dsk table.bmt tr.won th{background:rgba(231,106,64,.07)}
}
html .hvd .dsk .mvall .table-scroll{border-radius:14px}
/* the What changed rail in white glass: dark text, its items as white cards */
html .hvd .dsk .rail{color:#1E1A17}
html .hvd .dsk .rail .hd{border-bottom:1px solid var(--w-line)}
html .hvd .dsk .rail h3{color:#1E1A17}
html .hvd .dsk .rail h3 span{background:var(--ember);color:#1E1A17}
html .hvd .dsk .flt,html .hvd .dsk .flt button{color:#5E5249}
html .hvd .dsk .flt button.on{color:#1E1A17;background:#FFFFFF;border-radius:9px;box-shadow:0 1px 3px rgba(30,26,23,.14)}
html .hvd .dsk .rail .day{color:var(--ember-ink)}
html .hvd .dsk .rail .it{background:var(--w-tile);box-shadow:var(--w-tile-shadow)}
html .hvd .dsk .rail .it:hover{background:#FFFFFF}
html .hvd .dsk .rail .it h4,html .hvd .dsk .rail .it h4 a,html .hvd .dsk .rail a{color:#1E1A17}
html .hvd .dsk .rail .it p,html .hvd .dsk .rail p{color:#5E5249}
html .hvd .dsk .rail .it .ty2,html .hvd .dsk .rail .t{color:var(--muted)}
/* neutral hairlines on white glass */
html .hvd .dsk .col{border-left-color:var(--w-line)}
html .hvd .dsk .att,html .hvd .dsk .att a,html .hvd .dsk .att div,html .hvd .dsk .ord th,html .hvd .dsk .ord td,html .hvd .dsk .rxb,html .hvd .dsk .sx,html .hvd .dsk .vm,html .hvd .dsk .tgc li{border-color:var(--w-line)}
html .hvd .dsk .tog{background:rgba(30,26,23,.05);box-shadow:inset 0 1px 2px rgba(30,26,23,.1)}

/* ---------- v57 (11 Oct 2026, Harsh: "bring them over to the same white glass as well"): the Company File in the
   same white frosted glass as the Desk, over the same light scene (the page moved from dusk to light). The hero is
   white glass with dark text (it was dark blue); its panes & the readouts are the whiter inner glass. ---------- */
html .hvd .cf2-hero,html .hvd .cf2-read,html .hvd .cf2-sec{position:relative;border:0;color:#1E1A17;background:var(--w-panel)!important;box-shadow:var(--w-rim),var(--w-shadow)!important;-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur)}
html .hvd .cf2-hero::after,html .hvd .cf2-read::after,html .hvd .cf2-sec::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;padding:1px;pointer-events:none;
 background:linear-gradient(150deg,rgba(255,255,255,1),rgba(255,255,255,.4) 24%,rgba(255,255,255,0) 52%,rgba(255,255,255,.2) 80%,rgba(255,255,255,.75));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
/* the hero's words */
html .hvd .cf2-hero h1,html .hvd .cf2-hero .h-qt,html .hvd .cf2-hero .h-q3 b,html .hvd .cf2-hero .gnow,html .hvd .cf2-hero .gends b,html .hvd .cf2-hero .ro strong,html .hvd .cf2-hero .ro small b{color:#1E1A17}
html .hvd .cf2-hero .ids,html .hvd .cf2-hero .hv-asof,html .hvd .cf2-hero .h-basis p,html .hvd .cf2-hero .wl-view,html .hvd .cf2-hero .hq-vs,html .hvd .cf2-hero .gends,html .hvd .cf2-hero .ro small,html .hvd .cf2-hero .h-q3 small,html .hvd .cf2-hero .k{color:#5E5249}
html .hvd .cf2-hero .hq-note{color:var(--muted)}
html .hvd .cf2-hero .eyebrow{background:rgba(231,106,64,.11)!important;color:var(--ember-ink)!important;box-shadow:inset 0 0 0 1px rgba(231,106,64,.22)}
html .hvd .cf2-hero .h-q>.k,html .hvd .cf2-hero .h-px>.k,html .hvd .cf2-hero .cf-about h2{color:var(--ember-ink)}
html .hvd .cf2-hero .cf-about{border-top:1px solid var(--w-line)}
html .hvd .cf2-hero .cf-about-text{color:#3D3530}
html .hvd .cf2-hero .up,html .hvd .cf2-hero .h-q .up,html .hvd .cf2-hero .h-px .up,html .hvd .cf2-hero .ro .up{color:var(--up)}
html .hvd .cf2-hero .dn,html .hvd .cf2-hero .h-q .dn,html .hvd .cf2-hero .h-px .dn,html .hvd .cf2-hero .ro .dn{color:var(--down)}
html .hvd .cf2-hero .wl-flash{color:var(--up)}
/* the hero's controls: a light segmented switch & white glass buttons */
html .hvd .cf2-hero .seg{background:rgba(30,26,23,.05);border-color:transparent;box-shadow:inset 0 1px 2px rgba(30,26,23,.1)}
html .hvd .cf2-hero .seg a,html .hvd .cf2-hero .seg span{color:#5E5249;border-color:transparent}
html .hvd .cf2-hero .seg .on{background:#FFFFFF;color:#1E1A17;box-shadow:0 1px 3px rgba(30,26,23,.16)}
html .hvd .cf2-hero .btn-x,html .hvd .cf2-hero .wl-watch button{color:#1E1A17;background:rgba(255,255,255,.72);box-shadow:var(--w-tile-rim),0 6px 14px -10px rgba(30,26,23,.3)}
html .hvd .cf2-hero .btn-x:hover,html .hvd .cf2-hero .wl-watch button:hover{background:#FFFFFF}
html .hvd .cf2-hero .wl-watch button .wl-st{color:var(--ember)}
html .hvd .cf2-hero .wl-watch button.on{background:rgba(231,106,64,.1);color:var(--ember-ink);box-shadow:inset 0 0 0 1px rgba(231,106,64,.35)}
/* the hero's panes, the small cards in them & the readouts: whiter glass */
html .hvd .cf2-hero .h-q,html .hvd .cf2-hero .h-px,html .hvd .cf2-hero .ro,html .hvd .cf2-ribbon{border:0;background:var(--w-tile);box-shadow:var(--w-tile-shadow)}
html .hvd .cf2-hero .h-q3>div{border:0;background:rgba(255,255,255,.72);box-shadow:var(--w-tile-rim)}
html .hvd .cf2-hero .hq-sk .sk{fill:var(--harbour);opacity:.3}html .hvd .cf2-hero .hq-sk .sk-now{fill:var(--ember);opacity:1}html .hvd .cf2-hero .hq-sk .sk-neg{fill:var(--down);opacity:.55}
html .hvd .cf2-hero .hq-sk .sk-ln{stroke:var(--harbour);stroke-opacity:.75}html .hvd .cf2-hero .hq-sk .sk-dot{stroke:var(--ember)}
html .hvd .cf2-hero .gt{background:rgba(30,26,23,.08)}
html .hvd .cf2-ribbon dl>div{border-left-color:var(--w-line)}
/* the sections: their cards are the whiter glass, neutral hairlines */
html .hvd .cf2-read a,html .hvd .cf2 .panel,html .hvd .cf2 .side>div{border-color:transparent;background:var(--w-tile);box-shadow:var(--w-tile-shadow)}
html .hvd .cf2-read a:hover{background:#FFFFFF}
html .hvd .cf2-read a[aria-current]{background:#FFFFFF;box-shadow:inset 0 -3px 0 var(--ember),var(--w-tile-shadow)}
html .hvd .cf2 .rgroup .rt,html .hvd .cf2-sec>.sh{border-color:var(--w-line)}

/* ---------- v58 (11 Oct 2026, Harsh: "the translucent transparent effect is still missing"; then "no circles… a darker
   colour from my palette… not amber or orange"). The scene & the glass are set in v56 above; this block keeps words
   readable on them & puts the scene under the page footer. ---------- */
/* small text a shade deeper on the glass, since the blue behind shows through the panels */
html .hvd.env-light{--muted:#685B52;--ember-ink:#A23F17;--up:#17694C;--down:#A3342A}
html .hvd.env-light .dsk .sx-h,html .hvd.env-light .dsk .sx-s small,html .hvd.env-light .dsk .sx-na>b,html .hvd.env-light .dsk .sx-na em,html .hvd.env-light .dsk .idk,html .hvd.env-light .dsk .bmhint,html .hvd.env-light .dsk table.bmt thead th:not(.bg){color:var(--muted)}
html .hvd.env-light .dsk .tk-k{color:var(--ember-ink)}
/* the small ember labels get a white base under their tint, so the ember ink stays clear over the blue */
html .hvd.env-light .dsk .q,html .hvd.env-light .cf2-hero .eyebrow{background:linear-gradient(rgba(231,106,64,.1),rgba(231,106,64,.1)),rgba(255,255,255,.72)!important}
html .hvd.env-light .cf2-sec .idx{background:linear-gradient(rgba(231,106,64,.11),rgba(231,106,64,.11)),rgba(255,255,255,.72)}
html .hvd.env-light .dsk .sx-c>b.up,html .hvd.env-light .dsk .idl b.up,html .hvd.env-light .dsk table.bmt .up,html .hvd.env-light .dsk .hz-ind .irow.sel .ch.up{color:var(--up)}
html .hvd.env-light .dsk .sx-c>b.dn,html .hvd.env-light .dsk .idl b.dn,html .hvd.env-light .dsk table.bmt .dn,html .hvd.env-light .dsk .hz-ind .irow.sel .ch.dn{color:var(--down)}
/* the greeting sits straight on the deep blue: white words, a pale blue date & a mint dot */
html .hvd.env-light .dsk .mast h1{color:#FFFFFF}
html .hvd.env-light .dsk .mast .d{color:#E3ECF6}
html .hvd.env-light .dsk .mast .hv-asof{color:#FFFFFF}
html .hvd.env-light .dsk .mast .hv-asof-dot{background:#7FE0B8}
/* other words that sit straight on the scene get a small frosted backing: the tab hint & the Company File's last line */
html .hvd.env-light .hvd-tabhint{padding:5px 12px;border-radius:999px;color:#5E5249;background:rgba(255,255,255,.66);-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur);box-shadow:var(--w-tile-rim)}
html .hvd.env-light .cf2>.foot{padding:10px 16px;border-radius:14px;background:var(--w-panel);-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur);box-shadow:var(--w-rim)}
/* the top bar is glass (a layer of its own), so it sits above the page: the Menu & the company search open over the
   panels, not under them (every Desk page) */
html .hvd .hvd-bar{position:relative;z-index:40}
/* v59d (12 Oct 2026): the bar itself has no blur. A blur on the bar makes it the "backdrop" for everything inside it,
   so the Menu & the company search could not blur the page under them & the words below showed through. The bar never
   scrolls over anything (it sits on the page background), so its blur did nothing visible; on the cream pages a
   little more white keeps the same colour the blur gave it (same weight as the fallbacks below, so they still win). */
html .hvd .hvd-bar{-webkit-backdrop-filter:none;backdrop-filter:none}
html .hvd-bar:not(.env-light *){background:var(--grain-w),linear-gradient(160deg,rgba(255,255,255,.88),rgba(255,255,255,.82) 48%,rgba(255,255,255,.86))}
/* v59e (12 Oct 2026): the company search's focus ring goes round the rounded field, not a square round the words inside
   it (the input itself has no corners to follow). Same coral, same 2px gap, every Desk page. !important because the
   dark pages' generated focus rule (.hvd.env-light.env-light :focus-visible) is heavier. */
html .hvd .hvd-cmd input:focus-visible{outline:none!important}
html .hvd .hvd-cmd form:focus-within{outline:2px solid var(--coral);outline-offset:2px}
/* phones & tablets: the Menu sheet ends 12px above the tool dock instead of running 16px under its top edge
   (sheet top 64px + dock 76px tall, 16px off the bottom + 12px gap = 168px). dvh follows the phone's browser bars. */
@media(max-width:900px){html .hvd .hvd-mdd{max-height:calc(100vh - 168px);max-height:calc(100dvh - 168px)}}
/* the free Company File's panels & the open tabs sit straight on the scene too: frosted like the panels */
html .hvd.env-light .cf2>.fgrid>.panel,html .hvd.env-light .cf2>.lite-lock{background:var(--w-panel);-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur);box-shadow:var(--w-rim),var(--w-shadow)}
html .hvd.env-light nav a.hvd-tab{-webkit-backdrop-filter:var(--w-blur);backdrop-filter:var(--w-blur)}
/* the scene sits in the page's bottom layer, under the footer that follows the Desk wrapper (inside the wrapper it
   painted over the footer): the wrapper keeps no background or isolation of its own; the page colour moves to the body */
html body .hvd.env-light{isolation:auto;background:transparent}
body:has(>.hvd.env-light){background:#DCE6F1}
/* the footer: a band of the same frosted glass */
body:has(>.hvd.env-light)>footer{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.5));-webkit-backdrop-filter:blur(28px) saturate(140%) contrast(.7) brightness(1.24);backdrop-filter:blur(28px) saturate(140%) contrast(.7) brightness(1.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
/* every Desk page: room under the footer for the dock, so the dock never covers its last lines (the SEBI note) */
body:has(>.hvd)>footer{padding-bottom:104px}
/* phones: the light runs top to bottom (deep blue behind the greeting at every width); the footer skips the live blur */
@media(max-width:760px){
 .hvd.env-light::after{background:
  radial-gradient(90% 40% at 100% 0%,rgba(255,255,255,.35),rgba(255,255,255,0) 70%),
  linear-gradient(180deg,#1D4A70 0%,#2C6795 22%,#5A8EC2 40%,#A9C6E2 62%,#D6E3F0 82%,#EEF3F8 100%)}
 body:has(>.hvd.env-light)>footer{-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.72) 50%,rgba(255,255,255,.78))}
}

/* ---------- v52 charts & accents (Harsh, 10 Oct: "Don't use gradients in graphs. And make these graphs look elegant.")
   Palette colours only & no gradients in any chart: Harbour = the series, Ember = the latest or the point in focus,
   up green / down red only for gains & losses, warm greys for reference lines & the rest. Thin bars with round tops,
   a single baseline, labels in ink. ---------- */
html .hvd{--up:#1E7A5A;--down:#B0392B}
/* Desk: the count bars, market rings, valuation & order bars, the breadth bar */
html .hvd .dsk .mb{height:4px;background:rgba(30,26,23,.08)}
html .hvd .dsk .mb i{background:var(--harbour)}
html .hvd .dsk .rg .rt{stroke:rgba(30,26,23,.1)}
html .hvd .dsk .rg .rv{stroke:var(--harbour)}
html .hvd .dsk .vm-bar{background:rgba(30,26,23,.07)}
html .hvd .dsk .vm-bar i{background:var(--harbour)}
html .hvd .dsk .vm-div i.up{background:var(--up)}html .hvd .dsk .vm-div i.dn{background:var(--down)}
html .hvd .dsk .vm-cheap{background:rgba(30,122,90,.1);color:var(--up)}
html .hvd .dsk .vm-dear{background:rgba(176,57,43,.09);color:var(--down)}
html .hvd .dsk .vm-mid,html .hvd .dsk .vm-fell,html .hvd .dsk .vm-na{background:rgba(30,26,23,.05);color:#5E5249}
html .hvd .dsk .vm-s b a:hover{color:var(--ember-ink);border-bottom-color:var(--ember-ink)}
html .hvd .dsk .szb{background:rgba(30,26,23,.07)}
html .hvd .dsk .szb i{background:var(--harbour)}
html .hvd .dsk .brd{height:10px;gap:3px}
/* Desk: gains & losses in the palette's green & red; tags as quiet tints of the palette */
html .hvd .dsk .up,html .hvd .dsk .irow .ch.up,html .hvd .dsk .ddg b.up,html .hvd .dsk .ec .d.up,html .hvd .dsk .mf b.up{color:var(--up)}
html .hvd .dsk .dn,html .hvd .dsk .irow .ch.dn,html .hvd .dsk .ddg b.dn,html .hvd .dsk .ec .d.dn,html .hvd .dsk .mf b.dn{color:var(--down)}
html .hvd .t-navy{background:rgba(29,74,112,.08);color:var(--harbour)}
html .hvd .t-coral{background:rgba(231,106,64,.12);color:var(--ember-ink)}
html .hvd .t-green{background:rgba(30,122,90,.1);color:var(--up)}
html .hvd .t-sand{background:rgba(30,26,23,.05);color:#5E5249}
html .hvd .dsk .ty.ty-out{background:#fff;box-shadow:inset 0 0 0 1px rgba(29,74,112,.35)}
html .hvd .dsk .why .wl,html .hvd .dsk .why.w-co .wl::after{color:var(--ember-ink)}
html .hvd .dsk .why.w-ind .wl::after{color:var(--harbour)}
html .hvd .dsk .ord a.more{color:var(--harbour)}
/* free members' locked panels: the ember button of every other panel */
html .hvd .dk-lock{border-color:rgba(29,74,112,.22);background:var(--m-tile)}
html .hvd .dk-lock-i{color:var(--ember-ink)}
html .hvd .dk-lock a.dk-lock-go{background:linear-gradient(180deg,#EE7A4B,#DF622F);color:#1E1A17!important;border-radius:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -10px rgba(231,106,64,.85)}
html .hvd .dk-lock a.dk-lock-go:hover{background:linear-gradient(180deg,#E26A3B,#C9531F)}
/* the menu's group headings & links */
html .hvd-mg p,html .hvd .hvd-mg p{color:var(--ember-ink)}
html .hvd-mg a:hover,html .hvd .hvd-mg a:hover{color:var(--ember-ink)}

/* chart labels in proportional figures: the tabular ones (right for aligned columns) look typewritten in a chart */
html .hvd .dsk svg text,html .hvd .cf2 svg text{font-variant-numeric:lining-nums proportional-nums}
/* Company File: series in harbour, the latest in ember, reference lines in warm grey */
html .hvd .cf2{--navy:#1D4A70;--good:#1E7A5A;--coral:#E76A40} /* every --coral use in a chart is the latest (ember); the legends follow */
html .hvd .cf2 .sv .line,html .hvd .cf2 .ichart .ln,html .hvd .cf2 .ichart .ln.pe{stroke:var(--harbour);stroke-width:2}
html .hvd .cf2 .ichart .area{fill:var(--harbour);fill-opacity:.07}
html .hvd .cf2 .sv .median,html .hvd .cf2 .ichart .med{stroke:#8A7D73;stroke-width:1.2;stroke-dasharray:5 4}
html .hvd .cf2 .sv .medlab,html .hvd .cf2 .ichart .medlab{fill:#5E5249}
html .hvd .cf2 .sw.dash{border-top-color:#8A7D73}
html .hvd .cf2 .sw.eps{background:rgba(30,26,23,.07);box-shadow:none}
/* labels that sit on a line get a white halo, so the line never runs through the words */
html .hvd .cf2 .ichart .medlab,html .hvd .cf2 .ichart .eblab,html .hvd .cf2 .sv .medlab{paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}
html .hvd .cf2 .ichart .dot,html .hvd .cf2 .ichart .ln.pe~.dot{fill:var(--ember);stroke:#fff;stroke-width:2}
html .hvd .cf2 .ichart .cross{stroke:rgba(30,26,23,.35)}
html .hvd .cf2 .ichart .eb,html .hvd .cf2 .sv .ebar{fill:rgba(30,26,23,.05)}
html .hvd .cf2 .sv .bar,html .hvd .cf2 .ichart .bb,html .hvd .cf2 .sv .bo,html .hvd .cf2 .sv .bp,html .hvd .cf2 .sv .then{fill:var(--harbour);stroke:none}
html .hvd .cf2 .sw.dot{border-color:var(--harbour)}
html .hvd .cf2 .sv .bar.now,html .hvd .cf2 .ichart .bb.on,html .hvd .cf2 .sv .now,html .hvd .cf2 .sv .bn,html .hvd .cf2 .sv .bc,html .hvd .cf2 .sv .dnow{fill:var(--ember)}
html .hvd .cf2 .sv .slice{fill:var(--ember-ink)}
html .hvd .cf2 .sv .mline,html .hvd .cf2 .sv .mline8{stroke:var(--harbour);stroke-width:2}
html .hvd .cf2 .sv .dthen,html .hvd .cf2 .sv .dold{fill:#fff;stroke:var(--harbour);stroke-width:2}
html .hvd .cf2 .sv .gapr{stroke:var(--ember-ink)}
html .hvd .cf2 .sv .brg{stroke:var(--up)}html .hvd .cf2 .sv .lg{fill:var(--up)}
html .hvd .cf2 .sv .brd{stroke:var(--down)}html .hvd .cf2 .sv .ld{fill:var(--down)}
html .hvd .cf2 .sv .col.act .hit{fill:rgba(29,74,112,.05)}
html .hvd .cf2 .sv .dv,html .hvd .cf2 .donut .dv{fill:#1E1A17}
html .hvd .cf2 .dial .track{stroke:rgba(30,26,23,.08)}
html .hvd .cf2 .dial .fill{stroke:var(--ember)}
html .hvd .cf2 .dial .mark{stroke:#1E1A17}
html .hvd .cf2 .meter{background:rgba(30,26,23,.08)}html .hvd .cf2 .meter i{background:var(--harbour)}
/* who owns it: promoters harbour, domestic institutions ember, foreign institutions warm grey, the rest sand */
html .hvd .cf2 .donut circle{stroke-width:17}
html .hvd .cf2 .donut .d-bg{stroke:rgba(30,26,23,.06)}
html .hvd .cf2 .d-pro{stroke:var(--harbour);background:var(--harbour)}
html .hvd .cf2 .d-dii{stroke:var(--ember);background:var(--ember)}
html .hvd .cf2 .d-fii{stroke:#5E5249;background:#5E5249}
html .hvd .cf2 .d-oth{stroke:#D8CDBF;background:#D8CDBF}
html .hvd .cf2 .ct i.pos{background:var(--up)}html .hvd .cf2 .ct i.neg{background:var(--down)}
html .hvd .cf2 .acbar .w{background:var(--ember)}html .hvd .cf2 .acbar .o{background:var(--up)}html .hvd .cf2 .acbar .n{background:#D8CDBF}
html .hvd .cf2 .acleg .aw{color:var(--ember-ink)}html .hvd .cf2 .ac-watch .ac-ic{color:var(--ember-ink);background:rgba(231,106,64,.12)}
/* gains & losses in words */
html .hvd .cf2 .side strong.up,html .hvd .cf2 .ybig.up,html .hvd .cf2 .ft .up,html .hvd .cf2-sec .up{color:var(--up)}
html .hvd .cf2 .side strong.dn,html .hvd .cf2 .ybig.dn,html .hvd .cf2 .ft .dn,html .hvd .cf2 .crange .chg .down,html .hvd .cf2-sec .dn{color:var(--down)}
/* the latest column of every table: a light ember tint, its heading in ember ink */
html .hvd .cf2 .ft .now,html .hvd .cf2 .ft tr.latest td,html .hvd .cf2 .ft tr.latest th{background:rgba(231,106,64,.07)}
html .hvd .cf2 .tscroll .ft tr.latest th{background:#FDF3EF}
html .hvd .cf2 .ft thead th.now{color:var(--ember-ink)}
/* the candle chart's legend matches its lines (company-candles.js) */
html .hvd .cf2 .cf-kline-legend .sw.dot{border-top-color:var(--ember)}
html .hvd .cf2-hero .gt i{background:var(--ember);border-color:#fff}

/* ---------- phones ---------- */
@media(max-width:760px){
 html .hvd .hvd-bar{margin:8px 8px 0;border-radius:18px}
 html .hvd nav.hvd-tabs{padding:8px 8px 0}
 html .hvd .dsk .mast h1{font-size:22px}
 html .hvd .cf2-ribbon{margin:0 10px 12px}
 html .hvd nav a.hvd-dk{white-space:normal;text-align:center;line-height:1.15;width:66px;flex:none}
 html .hvd .cf2-sec{padding:14px 14px 16px;border-radius:20px}
 html .hvd .cf2 nav.cf2-read{padding:12px 14px 14px;border-radius:20px}
 html .hvd .cf2 .panel{padding:12px 14px}
 /* below the scene the long panels drop the live blur: a frosted fill looks the same & scrolls faster */
 html .hvd .cf2-read,html .hvd .cf2-sec{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--grain-w),linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.72) 50%,rgba(255,255,255,.78))!important}
 /* v56: the Desk's long panels keep their white translucent fill without the live blur (v58: whiter, since there is no lift without the blur) */
 html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .rail{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--grain-w),linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.72) 50%,rgba(255,255,255,.78))}
}
/* ---------- fallbacks: no blur available, or the reader asks for less transparency ---------- */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
 html .hvd .cf2-read,html .hvd .cf2-sec,html .hvd .cf2-hero{background:var(--grain-w),rgba(255,255,255,.88)!important}
 html .hvd .hvd-bar,html .hvd .dsk .gl,html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .note,html .hvd .dsk .rail,html .hvd .dsk .tk{background:var(--grain-w),rgba(255,255,255,.88)}
 html .hvd nav a.hvd-tab{background:rgba(255,255,255,.88)}
 body:has(>.hvd.env-light)>footer{background:rgba(255,255,255,.88)}
 html .hvd .hvd-dock{background:#1E1A17!important}
}
@media (prefers-reduced-transparency:reduce){
 html .hvd .cf2-read,html .hvd .cf2-sec,html .hvd .cf2-hero{background:#FFFFFF!important;-webkit-backdrop-filter:none;backdrop-filter:none}
 html .hvd .hvd-bar,html .hvd .dsk .gl,html .hvd .dsk .ins,html .hvd .dsk .front,html .hvd .dsk .cont,html .hvd .dsk .note,html .hvd .dsk .rail,html .hvd .dsk .tk{background:#FFFFFF;-webkit-backdrop-filter:none;backdrop-filter:none}
 html .hvd nav a.hvd-tab{background:#FFFFFF;-webkit-backdrop-filter:none;backdrop-filter:none}
 body:has(>.hvd.env-light)>footer{background:#FFFFFF;-webkit-backdrop-filter:none;backdrop-filter:none}
 html .hvd .hvd-dock{background:#1E1A17!important;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media print{.hvd.env-light::before,.hvd.env-light::after,.hvd.env-dusk::before{display:none}html body .hvd.env-light,html body .hvd.env-dusk{background:#fff}html .hvd .hvd-dock{display:none}}

/* ---------- v61 spacing (12 Oct 2026, Harsh: "make sure that the titles and elements are not touching the borders of
   the panels, especially on mobile viewing. We just need to make sure that alignment of every element on computer as
   well as mobile interface is right."): one inner margin for every panel on a page, so titles, words, tables & inner
   cards start on one line (the Desk & the Screener 24px on a computer & 16px on a phone, the Company File 24px &
   14px); page titles & notes on the panels' outer edge; the chosen side of every switch inside its frame; nothing
   wider than its box. ---------- */
/* the top bar on a tablet: the market line makes way, so the Menu & account buttons stay inside the bar (they ran past
   its right edge from about 770 to 890px) */
@media(min-width:761px) and (max-width:900px){html .hvd .hvd-mkt{display:none}}
/* the Desk */
html .hvd .dsk .tk{padding-left:24px;padding-right:24px}
html .hvd .dsk .tk-dots{right:17px}
html .hvd .dsk .ins .ih,html .hvd .dsk .ins .ipane,html .hvd .dsk .front .col{padding-left:24px;padding-right:24px}
html .hvd .dsk .rail .hd,html .hvd .dsk .rail .feed{padding-left:24px;padding-right:24px}
html .hvd .dsk .rail .it{margin:0 0 8px;padding:10px 12px}
/* the rail's list scrolls inside the panel on a computer: it ends a little above the panel's edge & fades out there, so
   no card is cut by the edge itself */
@media(min-width:1101px){html .hvd .dsk .rail .feed{margin-bottom:12px;padding-bottom:20px;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 24px),transparent)}}
html .hvd .dsk .vm-h,html .hvd .dsk .vm-r,html .hvd .dsk .sx-h,html .hvd .dsk .sx-r{padding-left:0;padding-right:0}
html .hvd .dsk .ins-ord table.ord tbody tr:last-child td{border-bottom:0}
/* the Company File */
html .hvd .cf2-sec,html .hvd .cf2 nav.cf2-read{padding-left:24px;padding-right:24px}
html .hvd .cf2-ribbon{margin:0 24px 24px}
@media(min-width:1101px){html .hvd .cf2-hero .h-read2{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px}}
/* the Consolidated | Standalone switch: on its own line under the label when the two do not fit side by side (it sat
   in the middle of the hero on tablets, right-aligned in a box on the left) */
@media(max-width:900px){html .hvd .cf2-hero .h-basis{flex-basis:100%;align-items:flex-start}}
/* switches: the chosen side sits inside its frame */
html .hvd nav.cc-vt{padding:3px}
html .hvd .cf2-hero .seg{padding:3px;gap:2px}
html .hvd .cf2 .cf-kline-ranges,html .hvd .cf2 .crange .seg{padding:3px;gap:2px;border-radius:12px}
html .hvd .cf2 .cf-kline-ranges button,html .hvd .cf2 .crange .seg button{border-left:0;border-radius:9px}
/* the Screener */
html .hvd .gx.sx2 .shd,html .hvd .gx.sx2 .snote{padding-left:0;padding-right:0}
html .hvd .gx.sx2 .glx.stop,html .hvd .gx.sx2 .glx.sctx{padding-left:24px;padding-right:24px}
/* the Results Room, its calendar & the pages built the same way */
html .hvd main.cf.rr2 .rr-filters{padding:12px 16px}
html .hvd main.cf .card>h2:first-child{margin:0 -18px 14px}
html .hvd main.cf .card>.table-scroll:first-child{margin-top:18px}
/* Market Scans: a stage's cards start where its title does */
html .hvd .sx-col .sx-cards{padding-left:18px;padding-right:18px}
@media(max-width:760px){
 html .hvd .dsk .tk{padding-left:16px;padding-right:16px}
 html .hvd .dsk .tk-dots{left:14px;right:auto}
 html .hvd .dsk .ins .ih,html .hvd .dsk .ins .ipane,html .hvd .dsk .front .col,html .hvd .dsk .rail .hd,html .hvd .dsk .rail .feed{padding-left:16px;padding-right:16px}
 html .hvd .dsk .front .col{border-left:0}
 /* the orders list: one line under each order, not under each of its lines */
 html .hvd .dsk .ins-ord table.ord td{border-bottom:0}
 html .hvd .dsk .ins-ord table.ord tbody tr:last-child{border-bottom:0}
 html .hvd .cf2-sec,html .hvd .cf2 nav.cf2-read{padding-left:14px;padding-right:14px}
 html .hvd .cf2-ribbon{margin:0 14px 14px}
 html .hvd .cf2-ribbon .rb-l{border-radius:18px 18px 0 0}
 html .hvd .gx.sx2 .glx.stop,html .hvd .gx.sx2 .glx.sctx{padding-left:16px;padding-right:16px}
 html .hvd .gx.sx2 .spills{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;scroll-padding-inline:16px}
 /* the strip of screens scrolls sideways here: it fades out at its ends, so a pill or label cut by the edge reads as
    "more this way" rather than a stray letter */
 html .hvd .gx.sx2 .spills{-webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
 /* the dark Results Room, its calendar & Find a company keep the same 12px page edge as the Desk, the Company File & the
    Screener, so the panels do not jump in & out when you switch tabs */
 html .hvd.env-light main.cf:not(.cf2){padding-left:12px;padding-right:12px}
 html .hvd main.cf .card>h2:first-child{margin:0 -12px 12px}
 html .hvd main.cf .card>.table-scroll:first-child{margin-top:12px}
}
/* the Results Room's strip of screens scrolls sideways on phones (600px & under): it runs to the screen's edges & fades
   out there, like the Screener's */
@media(max-width:600px){html .hvd.env-light main.cf.rr2 .rr-screens.rr-pills{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px;scroll-padding-inline:12px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}}
/* the latest quarter's three tiles on a narrow phone: the two comparisons sit side by side when they fit & one under the
   other when they do not, so a long figure never runs past the tile */
@media(max-width:480px){
 html .hvd .cf2-hero .h-q2 .h-q3>div{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 12px}
 html .hvd .cf2-hero .h-q2 .h-q3>div>.k{order:1}
 html .hvd .cf2-hero .h-q2 .h-q3>div>b{order:2;margin-left:auto}
 html .hvd .cf2-hero .h-q2 .h-q3>div::before{content:"";order:3;flex-basis:100%;height:0}
 html .hvd .cf2-hero .h-q2 .h-q3>div>small{order:4;text-align:left}
 html .hvd .cf2-hero .h-q2 .h-q3>div>.hq-sk{order:5;flex-basis:100%}
}
/* Valuation Charts on a phone: the value column is wide enough for its longest label ("−2.00 pts" ran 9px past it,
   to 6px from the card's edge) */
@media(max-width:560px){html .hvd .vc-plot{grid-template-columns:60px minmax(0,1fr)}html .hvd .vc-x{margin-left:60px}}
/* Market Scans on a narrow phone: its switches run the full width, like the controls under them, & the four views go
   two by two, so no label breaks inside its pill */
@media(max-width:560px){
 html .hvd .sx-ctl>nav.sx-seg{display:flex;width:100%}
 html .hvd .sx-ctl>nav.sx-seg>a{flex:1 1 auto;justify-content:center}
 html .hvd nav.sx-seg:has(>a:nth-child(4)){display:grid;grid-template-columns:1fr 1fr;border-radius:22px}
 html .hvd nav.sx-seg:has(>a:nth-child(4))>a{justify-content:center;text-align:center}
}
@media(max-width:420px){html .hvd .sx-ctl>nav.sx-seg>a{padding:0 10px;font-size:13.5px}}
/* the brief on a phone or tablet: the snapshot tables, the edition index & the next & previous links on the story column's edges */
@media(max-width:820px){body.hv-brief-page .bx-desk .wrap:not(.hvbr-hero):not(.hvbr-start){padding-left:18px;padding-right:18px}}
/* ---------- v61 (12 Oct 2026, Harsh: "switch them to the new type", "Including font sizes especially titles or headings
   On both computer and mobile"): the Modern type on every other Desk page: the Screener, the Results Room & its calendar,
   Find a company, Market Scans, Market Pulse, Corporate Actions, the Watchlist, Valuation Charts, the Valuation map & the
   Daily Brief inside the Desk. Inter comes from the v60 rules below (now on every Desk page); here the titles: page
   titles light (300) at the Desk greeting's size, section titles regular (400), small labels 600 with wide tracking,
   big numbers 400, no heavy bold. Sizes are declared for font-size-adjust .5 (28.5px draws like Inter at 26px). Both
   the cream pages & the dark ones. ---------- */
/* page titles & their labels, ledes & number strips (the research heads, Market Scans, Valuation, the Screener, the brief) */
html .hvd :is(.rp-head,.sx-hero,.vc-hero) .eyebrow,html body .hvd .bx-desk .brief-head .eyebrow{font-size:11px;font-weight:600;letter-spacing:.14em}
html .hvd .rp-head h1,html .hvd .hvd-main .shl h1,html .hvd .vc-hero h1,html .hvd .vmp-head h1,html .hvd .sx-hero h1 .hx1{font-size:28.5px;font-weight:400;letter-spacing:-.02em;line-height:1.14}
html .hvd .sx-hero h1{font-size:28.5px;font-weight:400;letter-spacing:-.02em;line-height:1.14}
html .hvd .hvd-main .shl h1 .n{font-weight:400}
html .hvd .sx-hero h1 .hx2{font-size:16px;font-weight:400;line-height:1.5;margin-top:10px}
html .hvd .rp-head .rp-lede,html .hvd .sx-hero .sx-lede,html .hvd .vc-hero .vc-lede,html .hvd .vmp-head .ilede{font-size:15px;line-height:1.55}
/* the "Data as of" line under each title: quiet, like the Desk's */
html .hvd main .hv-asof,html .hvd main .shd p.hv-asof{font-size:13px;font-weight:400}
html .hvd .vmp-head .ilede b{font-weight:600}
html .hvd .rp-head .rp-stats dt{font-size:10.5px;font-weight:600;letter-spacing:.12em}
html .hvd .rp-head .rp-stats dd{font-size:24px;font-weight:400;letter-spacing:-.01em}
html .hvd .rp-head .rp-stats dd small{font-size:12px;font-weight:400;letter-spacing:0}
html body .hvd .bx-desk .hvbr-hero h1.headline{font-size:33px;font-weight:400!important;letter-spacing:-.02em;line-height:1.18} /* site-theme.css gives every .headline 700 !important */
html body .hvd .bx-desk .brief-head .edmeta{font-size:10.5px;font-weight:500;letter-spacing:.1em}
/* section & card titles */
html .hvd main.cf .card>.title h2,html .hvd main.cf .card>h2:first-child,html .hvd :is(.vc-ov,.vc-hd) h2{font-size:20.5px;font-weight:500;letter-spacing:-.015em}
/* the Desk's two-column panel (how the market moved, what needs your attention): its column titles are panel titles,
   so they match the other panels' titles */
html .hvd .dsk .front .col h3{font-size:20.5px;font-weight:500;line-height:1.25;letter-spacing:-.015em}
html .hvd main.cf .card>.title span{font-size:10.5px;font-weight:600;letter-spacing:.12em}
html .hvd main.cf .card.rr-day h2{font-size:18.5px;font-weight:500;letter-spacing:-.01em}
html .hvd main.cf .card.rr-day h2 small{font-size:10.5px;font-weight:600;letter-spacing:.12em}
html .hvd main.cf ul.results strong{font-weight:500}
html .hvd .sx .sx-col header h2{font-size:17.5px;font-weight:600;letter-spacing:-.01em}
html .hvd .sx .sx-col header h2 b{font-weight:600}
html .hvd .sx .sx-how dt{font-size:15.5px;font-weight:600}
html .hvd main.cf .mk-sub{font-size:15.5px;font-weight:600}
html .hvd .wl-alerts h2{font-size:16px;font-weight:600}
html .hvd .wl-empty h2{font-size:18px;font-weight:500}
html .hvd .vs h2{font-size:14.5px;font-weight:600;letter-spacing:.01em}
html .hvd .vs .vs-a{font-size:19px;font-weight:400;line-height:1.5}
html .hvd .vs .vs-ch,html .hvd .vc-k span,html .hvd .vm-h span{font-size:10.5px;font-weight:600;letter-spacing:.12em}
html .hvd .vs-g strong{font-weight:600}
html body .hvd .bx-desk .bx-head h2{font-size:18px;font-weight:600}
html body .hvd .bx-desk .hvbr-start-title{font-size:19px;font-weight:600}
html body .hvd .bx-desk .hvbr-section>h2,html body .hvd .bx-desk h2.secline{font-size:11.5px;font-weight:600;letter-spacing:.14em}
html body .hvd .bx-desk .hvbr-story-card h3.story{font-size:24px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
html body[data-reading=scan] .hvd .bx-desk .hvbr-story-card h3.story{font-size:21px}
html body .hvd .bx-desk :is(b.hv-label,.hv-question){font-size:16.5px;font-weight:600}
/* big numbers lighter */
html .hvd main.cf .kpi strong{font-size:22px;font-weight:400}
html .hvd main.cf .kpi span{font-size:10.5px;font-weight:600;letter-spacing:.12em}
html .hvd .vc-k b{font-size:24px;font-weight:400}
html .hvd .sx .sx-gs b{font-size:20px;font-weight:500}
html .hvd .hvd-main .scount strong.n,html .hvd .hvd-main .vsc b.n{font-size:20px;font-weight:400}
html .hvd main.cf.rr2 .rr-sumline strong{font-weight:500}
html .hvd main.cf.rr2 .rr-sumline span,html .hvd .gx.sx2 .spills .sglbl{font-weight:600;letter-spacing:.12em}
/* the Market Pulse verdict line, the Screener's own-filters line, the chart cards' names */
html .hvd .mk-verdict{font-size:16px}
html .hvd .mk-verdict b{font-weight:600}
html .hvd .hvd-main .sfil summary span{font-size:15px;font-weight:500}
html .hvd .cc-a .cc-n{font-size:14.5px;font-weight:600}
/* everything else that asked for 800-900 draws at 600 (Inter's heaviest here); the brief's index & tables a touch lighter */
html body .hvd .bx-desk :is(.hvbr-toc-kicker,.hvbr-toc-title,.hvbr-toc-link,.hvbr-toc-number,.hvbr-start-kicker,.hvbr-start-link,.hvbr-start-number,th,td.num){font-weight:600}
html body .hvd .bx-desk .hvbr-start-link{font-weight:500}
/* phones */
@media(max-width:760px){
 html .hvd .rp-head h1,html .hvd .hvd-main .shl h1,html .hvd .vc-hero h1,html .hvd .vmp-head h1,html .hvd .sx-hero h1,html .hvd .sx-hero h1 .hx1{font-size:21px;line-height:1.2}
 html .hvd :is(.rp-head,.sx-hero,.vc-hero) .eyebrow,html body .hvd .bx-desk .brief-head .eyebrow{font-size:10.5px;letter-spacing:.12em}
 html .hvd .sx-hero h1 .hx2{font-size:14.5px;margin-top:8px}
 html .hvd .rp-head .rp-lede,html .hvd .sx-hero .sx-lede,html .hvd .vc-hero .vc-lede,html .hvd .vmp-head .ilede{font-size:14.5px;line-height:1.5}
 html .hvd .rp-head .rp-stats dd{font-size:20px}
 html .hvd main .hv-asof,html .hvd main .shd p.hv-asof{font-size:12.5px}
 html body .hvd .bx-desk .hvbr-hero h1.headline{font-size:23px;line-height:1.22}
 html .hvd main.cf .card>.title h2,html .hvd main.cf .card>h2:first-child,html .hvd :is(.vc-ov,.vc-hd) h2{font-size:17.5px}
 html .hvd .dsk .front .col h3{font-size:17.5px}
 html .hvd main.cf .card.rr-day h2{font-size:16.5px}
 html .hvd .sx .sx-col header h2{font-size:16px}
 html .hvd .wl-empty h2{font-size:17px}
 html .hvd .vs .vs-a{font-size:16.5px}
 html .hvd .vc-k b{font-size:20px}
 html .hvd main.cf .kpi strong{font-size:20px}
 html .hvd .mk-verdict{font-size:15px}
 html body .hvd .bx-desk .bx-head h2{font-size:17px}
 html body .hvd .bx-desk .hvbr-start-title{font-size:17.5px}
 html body .hvd .bx-desk .hvbr-story-card h3.story{font-size:19.5px}
 html body[data-reading=scan] .hvd .bx-desk .hvbr-story-card h3.story{font-size:18px}
 html body .hvd .bx-desk :is(b.hv-label,.hv-question){font-size:15.5px}
}

/* ---------- v60 (12 Oct 2026, Harsh: "These fonts are still too big, and they don't look rich and elegant". Of three
   mock-ups on his live Desk he chose "Modern": one clean sans throughout, light titles, smaller & quieter labels.)
   The Desk & the Company File (.hvd.env-light) first; since v61 (same day) the font itself is on every Desk page (the
   two rules marked v61 below) & the other pages' titles are in the v61 block above.
   - Inter (SIL OFL, self-hosted: weight & optical-size axes; a 1.5 KB file adds the rupee sign). The face is declared
     for weights 300-600 only, so anything that asks for 700-900 draws at 600: no heavy bold anywhere.
   - font-size-adjust .5 draws every size with an x-height of half the font size (Inter's own is .546): about 8% smaller
     than Inter would draw, a touch smaller than the old fonts. The px below are declared for that, so 28.5px here
     draws like Inter at 26px (the sizes in Harsh's mock-up, in brackets).
   - Light titles (the greeting & the company name 300, panel & section titles 400), quieter labels (10-11px, 600,
     wide tracking), lighter big numbers; smoother text on the dark glass. Colours for the quieter lines: tail.css.
   - v66 (13 Oct 2026, Harsh: "make the titles or headings a little bolder so that they at least stand out. Not too
     strongly"): one step bolder everywhere, the sizes unchanged: the greeting, the company name & page titles 400,
     panel & section titles 500, card titles 600 (the rail's items 550); the same steps on phones (v59) & on every
     Desk page (v61). */
@font-face{font-family:'HV Inter';font-style:normal;font-weight:300 600;font-display:swap;src:url(/assets/fonts/inter-latin-opsz-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'HV Inter';font-style:normal;font-weight:300 600;font-display:swap;src:url(/assets/fonts/inter-rupee-opsz-normal.woff2) format('woff2');unicode-range:U+20B9}
html body .hvd,body:has(>.hvd)>footer{--fi:'HV Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--fh:var(--fi);--fb:var(--fi);--fn:var(--fi);font-size-adjust:.5;font-synthesis-weight:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
/* v61: every Desk page. !important & four .hvd: some rules set the font with the font shorthand & !important (the Open
   buttons, the brief's own font rules), &
   the shorthand also resets font-size-adjust, so both are pinned on every element of these pages */
html body .hvd.hvd.hvd.hvd,html body .hvd.hvd.hvd.hvd *,body:has(>.hvd)>footer,body:has(>.hvd)>footer *{font-family:var(--fi)!important;font-size-adjust:.5!important}
html body .hvd.env-light .cf-kline{--k-font:var(--fi)}
/* every heading 500 unless a rule below says lighter */
html .hvd.env-light :is(.dsk,.cf2) :is(h1,h2,h3,h4){font-weight:500}
/* the shell: top bar, open tabs, dock & Menu */
html .hvd.env-light .hvd-logo{font-size:16px;font-weight:500;letter-spacing:.01em}
html .hvd.env-light .hvd-menu summary{font-size:13.5px;font-weight:500}
html .hvd.env-light .hvd-mkt{font-size:13px}
html .hvd.env-light .hvd-mkt .n{font-weight:500}
html .hvd.env-light .hvd-cmd input{font-size:14px}
html .hvd.env-light nav a.hvd-tab{font-size:13.5px}
html .hvd.env-light nav a.hvd-tab b{font-weight:500}
html .hvd.env-light nav a.hvd-tab .t{font-size:11px;font-weight:500;letter-spacing:.06em}
html .hvd.env-light .hvd-tabhint{font-size:12px}
html .hvd.env-light .hvd-dock a.hvd-dk{font-weight:500}
html .hvd.env-light .hvd-mg p{letter-spacing:.12em}
/* the Desk: the greeting (26) & its date (12) & data (12.5) lines, today's brief (label 10.5, headline 17) */
html .hvd.env-light .dsk .mast .d{font-size:13px;font-weight:500;letter-spacing:.04em}
html .hvd.env-light .dsk .mast h1{font-size:28.5px;font-weight:400;letter-spacing:-.02em;line-height:1.15}
html .hvd.env-light .dsk .mast .hv-asof{font-size:13.5px;font-weight:400}
html .hvd.env-light .dsk .tk-k{font-size:11.5px;font-weight:600;letter-spacing:.14em}
html .hvd.env-light .dsk .tk-h{font-size:18.5px;font-weight:500;line-height:1.45;letter-spacing:-.01em}
html .hvd.env-light .dsk .tk-go{font-size:13.5px;font-weight:500}
/* panel heads: the pills (10), the titles (19), the line under them (14), smaller titles (14.5) */
html .hvd.env-light .dsk .q{font-size:11px!important;font-weight:600!important;letter-spacing:.14em;padding:4px 11px}
html .hvd.env-light .dsk h2,html .hvd.env-light .dsk .h2{font-size:20.5px;font-weight:500;letter-spacing:-.015em}
html .hvd.env-light .dsk h3{font-size:16px;font-weight:600;letter-spacing:-.01em}
html .hvd.env-light .dsk .ilede{font-size:15px;line-height:1.55}
html .hvd.env-light .dsk :is(.sx-h,.vm-h) span,html .hvd.env-light .dsk .mvd-k{font-size:11px;font-weight:600;letter-spacing:.12em}
/* controls & links (12-13) */
html .hvd.env-light .dsk .ctl,html .hvd.env-light .dsk .ctl span{font-size:13.5px}
html .hvd.env-light .dsk .tog button{font-size:13px;font-weight:500}
html .hvd.env-light .dsk .mvall summary{font-size:14px;font-weight:600}
html .hvd.env-light .dsk :is(a.go,a.go2){font-size:14px!important;font-weight:600!important}
html .hvd.env-light .dsk .more2,html .hvd.env-light .dsk .vm-more{font-size:13.5px;font-weight:500}
/* cards & rows (13-13.5) & the big numbers, lighter */
html .hvd.env-light .dsk .sch b,html .hvd.env-light .dsk .tgn{font-size:14.5px;font-weight:600}
html .hvd.env-light .dsk .irow,html .hvd.env-light .dsk .irow .nm{font-size:14px}
html .hvd.env-light .dsk .irow .n{font-size:13.5px;font-weight:500}
html .hvd.env-light .dsk .et b.n,html .hvd.env-light .dsk .front b{font-weight:400}
/* the What changed rail (title 16, items 13.5 & 12.5) */
html .hvd.env-light .dsk .rail .hd h3{font-size:17.5px;font-weight:500}
html .hvd.env-light .dsk .rail .flt button{font-size:13px}
html .hvd.env-light .dsk .rail .day{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
html .hvd.env-light .dsk .rail .it .ty2{font-size:12.5px}
html .hvd.env-light .dsk .rail .it h4{font-size:14.5px;font-weight:550;line-height:1.4}
html .hvd.env-light .dsk .rail .it p{font-size:13.5px;line-height:1.5}
/* the Company File: the company name (28) & its lines, the plain-words box, section titles (19), the big numbers */
html .hvd.env-light .cf2-hero .eyebrow{font-size:12px;font-weight:500;letter-spacing:.02em}
html .hvd.env-light .cf2-hero h1{font-size:30.5px;font-weight:400;letter-spacing:-.02em;line-height:1.12}
html .hvd.env-light .cf2-hero .hv-asof{font-size:13px;font-weight:400}
html .hvd.env-light .cf2-hero .ids{font-size:13.5px}
html .hvd.env-light .cf2-hero .h-qt{font-size:16.5px;font-weight:400;line-height:1.55}
html .hvd.env-light .cf2-hero strong.n,html .hvd.env-light .cf2 .ybig,html .hvd.env-light .cf2 .side strong.n{font-weight:400}
html .hvd.env-light .cf2-hero b.n{font-weight:500}
html .hvd.env-light .cf2-read .rd-h h2{font-size:16px;font-weight:600}
html .hvd.env-light .cf2-sec .sh-t h2{font-size:20.5px;font-weight:500;letter-spacing:-.015em}
html .hvd.env-light .cf2-sec .kick{font-size:13px;font-weight:500}
html .hvd.env-light .cf2 h3{font-size:15.5px;font-weight:600}
html .hvd.env-light .cf2 figcaption b,html .hvd.env-light .cf2 th{font-weight:500}

/* ---------- v59 (12 Oct 2026, Harsh: "Can we make these heading/title fonts on mobile smaller and sleek?"): on phones
   the Desk & the Company File get a smaller, quieter type scale. Titles 17-21px at weight 500 with slightly tighter
   spacing; the small labels (the pills, "In today's brief", the date & data lines) smaller & lighter; the lines under
   the titles a touch smaller so the order still reads. Numbers stay as they are.
   v60 (same day, the Modern type): titles lighter (the greeting & the company name 300, panel & section titles &
   today's brief 400), the data lines 400, wider tracking on the labels; sizes declared for font-size-adjust .5. ---------- */
@media(max-width:760px){
 /* the Desk: the greeting & its date & data lines, today's brief, the panel titles & their labels */
 html .hvd.env-light .dsk .mast .d{font-size:12.5px;font-weight:500;letter-spacing:.04em}
 html .hvd.env-light .dsk .mast h1{font-size:21px;font-weight:400;line-height:1.2;letter-spacing:-.02em}
 html .hvd.env-light .dsk .mast .hv-asof{font-size:12.5px;font-weight:400}
 html .hvd.env-light .dsk .tk-k{font-size:10.5px;font-weight:600;letter-spacing:.12em}
 html .hvd.env-light .dsk .tk-h{font-size:16px;font-weight:500;line-height:1.42}
 html .hvd.env-light .dsk .tk-go{font-size:13px;font-weight:500}
 html .hvd.env-light .dsk .q{font-size:10.5px!important;font-weight:600!important;letter-spacing:.12em;padding:4px 10px}
 html .hvd.env-light .dsk h2{font-size:17.5px;font-weight:500;line-height:1.3;letter-spacing:-.01em}
 html .hvd.env-light .dsk .ilede{font-size:14.5px;line-height:1.5}
 html .hvd.env-light .dsk h3{font-size:15.5px;font-weight:600}
 html .hvd.env-light .dsk .mvh{font-size:14px}
 html .hvd.env-light .dsk .rail .it h4{font-size:13.5px}
 html .hvd.env-light .dsk .sch b{font-size:14.5px;font-weight:600}
 html .hvd.env-light .dsk .h2{font-size:16px;font-weight:500}
 html .hvd.env-light .dsk .cc .t b{font-size:14px;font-weight:600}
 html .hvd.env-light .dsk .tgn{font-size:14px;font-weight:600}
 html .hvd.env-light .dsk .mvd-k{font-size:10.5px;font-weight:600;letter-spacing:.12em}
 html .hvd.env-light .dsk .mvall summary{font-size:13.5px;font-weight:600}
 html .hvd.env-light .dsk .sx-s b{font-size:14px}
 /* & a little less empty space between the greeting & today's brief */
 html .hvd.env-light .dsk .mast{padding-bottom:4px}
 html .hvd.env-light .dsk .tk{margin-top:4px}
 /* the Company File: the label & the name at the top, the plain-words box, the section titles & their questions */
 html .hvd.env-light .cf2-hero .eyebrow{font-size:10.5px;font-weight:600;letter-spacing:.04em;padding:4px 10px}
 html .hvd.env-light .cf2-hero h1{font-size:22px;font-weight:400;line-height:1.18;letter-spacing:-.02em}
 html .hvd.env-light .cf2-hero .hv-asof{font-size:12px;font-weight:400}
 html .hvd.env-light .cf2-hero .ids{font-size:12.5px}
 html .hvd.env-light .cf2-hero .h-q>.k{font-size:11.5px}
 html .hvd.env-light .cf2-hero .h-qt{font-size:14.5px;line-height:1.5}
 html .hvd.env-light .cf2-read .rd-h h2{font-size:15px}
 html .hvd.env-light .cf2-sec .kick{font-size:12px}
 html .hvd.env-light .cf2-sec .sh-t h2{font-size:18.5px;font-weight:500;line-height:1.25;letter-spacing:-.01em}
 html .hvd.env-light .cf2-sec .idx{font-size:11.5px}
 html .hvd.env-light .cf2 h3{font-size:14.5px}
 html .hvd.env-light .cf2 .side .wd{font-size:15px}
 html .hvd.env-light .cf2 figcaption b,html .hvd.env-light .cf2 .ycard figcaption{font-size:14px;font-weight:500}
}