/* H View Accounts — site-wide pieces: masthead account link, phone tab bar, article Save + resume.
   Uses the site tokens: Mukta / Newsreader, navy #0c1a3d, gradient #2343d4 → #6a31c0 → #c81b84. */
.hvm-acct{grid-area:acct;display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 16px 0 12px;border-radius:999px;border:1px solid #e3e7f0;background:#fff;color:#0c1a3d;font:600 15px/1 'Mukta',system-ui,sans-serif;text-decoration:none;white-space:nowrap;box-shadow:0 1px 2px rgba(12,26,61,.05);transition:border-color .2s,box-shadow .2s,transform .2s}
.hvm-acct:hover{border-color:#2343d4;color:#2343d4;box-shadow:0 8px 20px -10px rgba(35,67,212,.45);transform:translateY(-1px)}
.hvm-acct:not(.is-in){background:linear-gradient(100deg,#2343d4,#6a31c0 52%,#c81b84);color:#fff;border-color:transparent}
.hvm-acct:not(.is-in):hover{color:#fff}
.hvm-av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#2343d4,#c81b84);color:#fff;font:700 14px/1 'Mukta',sans-serif}
.hvm-av img{width:100%;height:100%;object-fit:cover}
.hvm-acct.is-in{padding-left:8px}

/* masthead grid gains an "acct" column */
@media (min-width:1181px){.masthead-inner{grid-template-columns:auto auto minmax(0,1fr) auto minmax(240px,340px) auto!important;grid-template-areas:"brand slogan . clock search acct"!important}}
@media (min-width:901px) and (max-width:1180px){.masthead-inner{grid-template-columns:auto auto minmax(0,1fr) minmax(220px,300px) auto!important;grid-template-areas:"brand slogan . search acct"!important}}
@media (min-width:701px) and (max-width:900px){.masthead-inner{grid-template-columns:auto minmax(0,1fr) minmax(180px,280px) auto 44px!important;grid-template-areas:"brand . search acct burger"!important}.hvm-acct-t{display:none}.hvm-acct{width:46px;padding:0;justify-content:center}}
@media (max-width:700px){.hvm-acct{display:none}}

/* the phone dock (mobile-app-nav in app.php) carries Interactive and Account; keep floating buttons above it */
@media (max-width:700px){.ix-wa-float{right:16px!important;bottom:calc(150px + env(safe-area-inset-bottom))!important}}

/* article: Save button and "continue where you left off" */
.hvm-save{display:inline-flex;align-items:center;gap:6px}
.hvm-save svg{width:16px;height:16px}
.hvm-save.is-saved{background:linear-gradient(100deg,#2343d4,#6a31c0 52%,#c81b84)!important;color:#fff!important;border-color:transparent!important}
.hvm-save.is-saved svg{fill:currentColor}
.hvm-resume{position:fixed;left:50%;bottom:24px;z-index:70;transform:translate(-50%,20px);opacity:0;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:#0c1a3d;color:#fff;font:500 15px/1.3 'Mukta',sans-serif;box-shadow:0 18px 40px -12px rgba(12,26,61,.55);transition:opacity .3s,transform .3s;max-width:calc(100% - 24px)}
.hvm-resume.on{opacity:1;transform:translate(-50%,0)}
.hvm-resume button{border:0;border-radius:999px;padding:9px 16px;font:700 14px/1 'Mukta',sans-serif;cursor:pointer;color:#fff;background:linear-gradient(100deg,#2343d4,#6a31c0 52%,#c81b84)}
.hvm-resume .x{background:transparent;padding:9px 10px;opacity:.75}
@media (max-width:700px){.hvm-resume{left:12px;right:12px;transform:translateY(20px);bottom:calc(84px + env(safe-area-inset-bottom));border-radius:20px;padding:12px 10px 12px 16px}.hvm-resume.on{transform:none}.hvm-resume span{flex:1;font-size:14px}}
.hvm-toast{position:fixed;left:50%;bottom:28px;z-index:71;transform:translateX(-50%);padding:11px 18px;border-radius:999px;background:#0c1a3d;color:#fff;font:600 14.5px/1.3 'Mukta',sans-serif;box-shadow:0 14px 30px -10px rgba(12,26,61,.5);opacity:0;transition:opacity .25s;pointer-events:none}
.hvm-toast.on{opacity:1}
.hvm-toast a{color:#ffd1e8}
@media (max-width:700px){.hvm-toast{bottom:calc(86px + env(safe-area-inset-bottom))}}
@media (prefers-reduced-motion:reduce){.hvm-acct,.hvm-resume{transition:none}}
.hvm-drawer-acct{background:linear-gradient(100deg,#2343d4,#6a31c0 52%,#c81b84)!important;color:#fff!important;border-color:transparent!important}