:root{
  --bg:#ffffff;
  --bg-custom:#ffffff;
  --surface:#ffffff;
  --surface-2:#f5f5f5;
  --text:#0e0e0e;
  --muted:#666666;
  --border:#dddddd;
  --accent:#000000;
  --chip:#f2f2f2;
  --shadow:0 1px 2px rgba(0,0,0,.06);
  --maxw:1380px;
  --font-scale:1;
}

html[data-theme="dark"]{
  --surface:#181818;
  --surface-2:#232323;
  --text:#f7f7f7;
  --muted:#ababab;
  --border:#303030;
  --accent:#ffffff;
  --chip:#202020;
  --shadow:0 1px 2px rgba(0,0,0,.24);
}

html:not([data-theme]),
html[data-theme="light"],
html[data-theme="dark"]{
  --bg:var(--bg-custom);
}

*{box-sizing:border-box}
html{font-size:calc(16px * var(--font-scale))}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit}
img{max-width:100%;display:block}

.shell{max-width:var(--maxw);margin:0 auto;padding:14px}
.topbar{padding:4px 0 8px;border-bottom:1px solid var(--border)}
.topbar-main{
  display:grid;
  grid-template-columns:auto minmax(320px,1fr) auto;
  gap:14px;
  align-items:center;
  min-height:42px;
}
.brand{display:inline-block}
.brand .logo{width:auto}
.brand .logo-light,.brand .logo-dark{height:38px;width:auto}
.brand .logo-light{display:block}
.brand .logo-dark{display:none}
html[data-theme="dark"] .brand .logo-light,
html[data-theme="dark"] .ql-light{display:none}
html[data-theme="dark"] .brand .logo-dark,
html[data-theme="dark"] .ql-dark{display:block}

.brand-wrap{display:flex;align-items:flex-end;gap:10px;min-width:240px}
.brand-sub{
  font:700 18px/1 Arial,Helvetica,sans-serif;
  letter-spacing:1px;
  color:var(--muted);
  white-space:nowrap;
  padding-bottom:2px;
}

.topSearch{
  min-width:0;
  display:block;
  max-width:480px;
  justify-self:end;
  width:100%;
  min-height:40px;
  position:relative;
}
.topSearch .gsc-control-cse,
.topSearch .gsc-control-cse-en,
.topSearch .gsc-control-wrapper-cse,
.topSearch .gsc-search-box,
.topSearch table,
.topSearch tbody,
.topSearch tr,
.topSearch td{
  background:transparent!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
}
.topSearch .gsc-control-wrapper-cse{padding:0!important}
.topSearch .gsc-input-box{
  position:relative!important;
  border:1px solid #000!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  height:38px!important;
  box-shadow:none!important;
}
.topSearch .gsc-input-box::before{
  content:"⌕";
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  color:#666;
  font-size:20px;
  pointer-events:none;
}
.topSearch input.gsc-input,
.topSearch input.gsib_a{
  background:transparent!important;
  color:var(--text)!important;
  height:36px!important;
  padding-left:28px!important;
  text-indent:0!important;
  box-sizing:border-box!important;
  font-size:16px!important;
}
.topSearch .gsc-search-box-tools .gsc-search-box .gsc-input,
.topSearch .gsc-input-box,
.topSearch .gsc-search-button-v2{border-radius:10px!important}
.topSearch .gsc-search-button-v2{
  margin-left:8px!important;
  border:1px solid var(--border)!important;
  background:var(--surface)!important;
  height:38px!important;
  padding:0 12px!important;
}
.topSearch .gsc-search-button-v2 svg{width:18px;height:18px}
.topSearch .gsib_b{vertical-align:middle!important}
.topSearch .gscb_a{color:var(--muted)!important}

.header-tools{display:flex;align-items:center;gap:10px;justify-self:end}
.quicklinks-menu{position:relative}
.quicklinks-toggle,
.voice-search-btn{
  border:0;
  background:transparent;
  color:var(--text);
  width:36px;
  height:36px;
  border-radius:8px;
  cursor:pointer;
  font-size:22px;
  line-height:1;
}
.quicklinks-toggle:hover,
.voice-search-btn:hover{background:var(--surface-2)}
.quicklinks-panel{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  z-index:120;
  width:180px;
  max-height:420px;
  overflow:auto;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  padding:8px 0;
}
.quicklinks-panel a{
  display:block;
  padding:8px 14px;
  text-decoration:none;
  white-space:nowrap;
}
.quicklinks-panel a:hover{background:var(--surface-2)}
.ql-icon{
  width:32px!important;
  height:32px!important;
  min-width:32px;
  min-height:32px;
  object-fit:contain;
  display:block;
  margin:0 12px 0 6px;
  background:transparent;
}
.ql-dark{display:none}
#voice-search-btn,
#voice-search-btn *{cursor:pointer}
.voice-search-btn.listening,
#voice-search-btn[aria-busy="true"]{
  background:#960019!important;
  box-shadow:0 0 10px rgba(150,0,25,.45);
  transform:scale(1.05);
}
.voice-search-btn.listening .ql-icon,
#voice-search-btn[aria-busy="true"] .ql-icon{filter:brightness(1.08)}

.modebar{margin:12px 0 10px}
.modebar-row{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
  width:100%!important;
}
.display-tools select,
.display-tools button,
.feed-step,
.feed-chip,
.modebar button,
.feedmenu-toggle{
  border:1px solid var(--border);
  background:var(--surface);
  color:var(--text);
  border-radius:10px;
  font-size:14px;
}
.modebar button{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  padding:10px 18px!important;
  cursor:pointer;
  border-radius:999px;
}
.modebar button.active{
  background:var(--text);
  color:var(--bg);
  border-color:var(--text);
}

.top-feed-menu-slot{
  flex:1 1 auto!important;
  min-width:0!important;
  width:auto!important;
  display:flex!important;
  justify-content:flex-end!important;
  padding-right:120px!important;
}
.top-feed-menu-slot .feedmenu,
.feedmenu-top{
  margin-left:auto!important;
  margin-right:0!important;
}

.feedmenu{position:relative;display:inline-block}
.feedmenu-toggle{
  list-style:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--chip);
  border-radius:999px;
  padding:10px 16px;
  font-weight:800;
  text-transform:uppercase;
}
.feedmenu-toggle::-webkit-details-marker{display:none}
.feedmenu-panel{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  z-index:130;
  border:1px solid var(--border);
  background:var(--surface);
  border-radius:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  padding:10px 12px;
  min-width:min(400px,420px);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.feedmenu[open] .feedmenu-panel{display:grid}
.feed-chip{
  padding:9px 12px;
  cursor:pointer;
  text-align:left;
}
.feed-chip.active{
  background:var(--text);
  color:var(--bg);
  border-color:var(--text);
}
.feedmenu-top button,
.feedmenu button{
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .08s ease,box-shadow .08s ease;
}
.feedmenu-toggle:hover,
.feed-chip:hover{
  background:var(--text)!important;
  color:var(--surface)!important;
  border-color:var(--text)!important;
  cursor:pointer;
}
.feedmenu-top button:hover,
.feedmenu button:hover{
  background:var(--text);
  color:var(--surface);
  border-color:var(--text);
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(0,0,0,.18);
}
.feedmenu-top button:active,
.feedmenu button:active{
  transform:translateY(0);
  box-shadow:0 1px 3px rgba(0,0,0,.25) inset;
}
.feed-chip.active:hover{
  background:var(--surface-2)!important;
  color:var(--text)!important;
  border-color:var(--text)!important;
}

.topAd{
  width:100%;
  text-align:center;
  position:relative;
  margin:8px 0 10px;
  padding-top:12px;
  min-height:90px;
}
.ad-slot-desktop{min-width:728px;height:90px;margin:0 auto}
.ad-slot-mobile{display:none;min-width:320px;max-width:468px;height:auto;max-height:60px;margin:0 auto}

.page-message{
  width:100%;
  margin:10px auto 6px;
  text-align:center;
}
.page-message-inner{
  display:inline-block;
  max-width:980px;
  padding:10px 14px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface);
  color:var(--text);
  font-size:14px;
  line-height:1.35;
}

.panel{min-height:260px;padding-bottom:24px}
.panel-empty{
  padding:20px;
  border:1px dashed var(--border);
  border-radius:14px;
  color:var(--muted);
  background:var(--surface-2);
}
.feedbar{
  display:grid;
  grid-template-columns:44px 1fr 44px;
  gap:10px;
  align-items:center;
  margin-bottom:10px;
  min-height:64px;
}
.feed-step{
  min-height:44px;
  font-size:18px;
  cursor:pointer;
}
.feedbar-main{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:center;
  min-height:74px;
}
.feedbar-title-row{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:42px;
  margin:0 0 14px;
  padding:0;
padding-top:10px;
}
.feedbar-title{
  display:block;
  text-align:center;
  text-decoration:none;
  font-size:36px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
  line-height:1.02;
  margin:0 auto;
}
.feedbar-title:hover{text-decoration:underline}
.feedbar .feedchips{display:none}

#headline-grid{min-height:800px}
.headlines-grid{display:grid;gap:18px}
.headlines-grid.cols-1{grid-template-columns:1fr}
.headlines-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.headlines-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.headline-card{
  display:flex;
  gap:14px;
  padding:14px 14px 10px;
  align-items:flex-start;
  min-height:0;
  position:relative;
  z-index:1;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  contain:layout style;
}
.headline-card:hover{z-index:120}
.headline-image-link{
  flex:0 0 auto;
  width:auto;
  position:relative;
  z-index:2;
  display:block;
  overflow:visible;
  float:left;
  margin:0 18px 10px 0;
}
.headline-content{
  flex:1 1 auto;
  min-width:0;
  overflow:visible;
}
.headline-content::after{content:"";display:block;clear:both}
.headline-image{
  width:240px;
  height:auto;
  max-height:240px;
  aspect-ratio:16 / 9;
  object-fit:cover;
  display:block;
  background:var(--surface-2);
  border-radius:10px;
  transition:transform .18s ease,box-shadow .18s ease;
  transform-origin:left top;
  position:relative;
  z-index:40;
}
.headline-image.image-small{width:180px;max-height:180px}
.headline-image.image-medium{width:240px;max-height:240px}
.headline-image.image-large{width:300px;max-height:300px}
.headline-image-link:hover .headline-image,
.headline-image:hover{
  transform:scale(2.5)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.26)!important;
  position:relative;
  z-index:140!important;
}
.headline-title{
  margin:0 0 10px;
  font-size:1.18rem;
  line-height:1.18;
}
.headline-title a{text-decoration:none}
.headline-title a:hover{text-decoration:none}
.headline-summary{
  margin:8px 0 8px;
  color:var(--text);
  line-height:1.45;
}
.headline-meta-stack{margin-top:4px}
.headline-meta{
  display:flex;
  align-items:center;
  gap:0;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
  margin:0;
  white-space:nowrap;
}
.headline-source,
.headline-meta-line{font-weight:400}
.headline-actions{
  display:inline-flex;
  gap:4px;
  align-items:center;
  white-space:nowrap;
  position:relative;
  z-index:10;
}
.headline-actions .mini-icon{
  border:0;
  background:transparent;
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  padding:0;
  margin:0;
  font-size:15px;
  line-height:20px;
  border-radius:0;
  box-shadow:none;
  cursor:pointer;
}
.headline-actions .mini-icon:hover{color:var(--text);background:transparent}
.headline-actions .mini-icon:active{color:#458b74}
.headline-bullet{
  display:inline-block;
  width:20px;
  min-width:20px;
  margin-right:2px;
  font-size:20px;
  line-height:1;
  color:var(--text);
  vertical-align:top;
  position:relative;
  top:1px;
}
.headlines-grid.headlines-only .headline-summary,
.headlines-grid.headlines-only .headline-meta-stack{display:none}
.headlines-grid.headlines-only .headline-card{padding-bottom:12px}
.headlines-grid.headlines-only .headline-title{margin-bottom:0}
.headlines-grid.cols-1.headlines-only .headline-card:hover::after{
  content:attr(data-summary);
  position:absolute;
  left:14px;
  right:14px;
  top:100%;
  margin-top:6px;
  padding:10px 12px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  color:var(--text);
  z-index:120;
  line-height:1.35;
  white-space:normal;
}

.embed-wrap{
  position:relative;
  width:100%;
  padding-top:170%;
  background:var(--surface-2);
  border:1px solid var(--border);
  border-radius:14px;
  overflow:hidden;
}
.embed-wrap iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

.dir-jump{
  position:sticky;
  top:0;
  background:var(--bg);
  z-index:15;
  padding:8px 0 12px;
  border-bottom:1px solid var(--border);
  margin-bottom:14px;
}
.dir-jump-inner{display:flex;gap:8px;flex-wrap:wrap}
.dir-jump a{
  text-decoration:none;
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface);
  font-size:13px;
  cursor:pointer;
}
.dir-jump a:hover{background:var(--surface-2)}
.dir-category{margin-bottom:22px;scroll-margin-top:60px}
.dir-category h2{margin:0 0 12px;font-size:1.3rem}
.dir-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dir-sub{padding:12px}
.dir-sub h3{margin:0 0 10px;font-size:1rem}
.dir-links{list-style:none;padding:0;margin:0}
.dir-links li{margin-bottom:8px}
.dir-links a{text-decoration:none}
.dir-links a:hover{text-decoration:underline}

.display-tools{
  margin-top:14px;
  padding-top:14px;
  padding-bottom:36px!important;
  border-top:1px solid var(--border);
}
.display-tools-row{
  display:flex;
  gap:24px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
}
.display-tools-row label{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  font-weight:600;
  color:var(--muted);
  font-size:12px;
  text-align:center;
}
.display-tools select,
.display-tools button{padding:10px 12px}
#bg-color{
  width:44px;
  height:36px;
  padding:2px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  cursor:pointer;
}

.backtotop-arrow{
  font-size:34px;
  line-height:1;
  display:block;
  color:#000;
}
html[data-theme="dark"] .backtotop-arrow{color:#fff}
.back-to-top-btn{
  margin-left:auto;
  width:44px;
  height:44px;
  border:1px solid var(--border)!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  padding:1px!important;
  line-height:0;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.back-to-top-btn:hover{background:var(--surface-2)!important}

.footerAd{
  position:relative;
  text-align:center;
  width:100%;
  height:300px;
  max-height:300px;
  margin:0 auto 84px auto!important;
}
.footerAd .adsbygoogle{max-width:1160px;margin:0 auto}
.footer-note{
  margin:0 auto 4px auto!important;
  text-align:center;
  color:var(--muted);
  font-size:14px;
  line-height:1.4;
}
.stamp{
  display:block;
  width:100%;
  text-align:right;
  color:var(--muted);
  font-size:12px;
  margin-top:4px;
  margin-bottom:0;
  min-height:24px;
}

/* NEWS TV */
#openVideoViewerMid{background:var(--text);color:var(--surface)}
#openVideoViewerMid:hover{background:#960019;color:#f0f0f0}
.hs-news-tv-bookmark-btn{
  cursor:pointer;
  font-size:11px;
  background:#fff;
  padding:2px 3px;
  color:#000;
  border:1px solid #333;
  border-radius:12px;
  font-weight:750;
  width:140px;
  height:25px;
  line-height:1.1;
  margin-top:6px;
}
.hs-news-tv-bookmark-btn:hover{background:#f5f5f5}
.open-video-link{
  display:inline-block;
  font-size:18px;
  font-weight:bold;
  color:#656565;
  text-decoration:none;
  cursor:pointer;
  margin-top:20px;
}
.open-video-link:hover{color:#417FBC}
.open-video-link:active{color:#458b74}

.video-overlay{
  display:none;
  position:fixed;
  bottom:35px;
  left:3px;
  width:400px;
  max-width:100%;
  background:#333;
  border-radius:8px;
  border-style:solid;
  border-color:#191D1E;
  border-width:18px 9px 9px 9px;
  z-index:1000;
  cursor:default;
  overscroll-behavior:none;
  overflow:visible!important;
}
.video-overlay.video-large{width:800px;max-width:96vw}
.video-overlay .video-modal{
  position:relative!important;
  width:100%!important;
  padding-bottom:56.25%!important;
  overflow:visible!important;
}
.video-overlay .video-modal iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border-radius:8px;
  background:#111;
}
.video-modal{cursor:default}
.video-modal::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:22px;
  cursor:move;
  z-index:5;
}
.video-overlay .close-btn,
.video-overlay .resize-btn,
.video-overlay .autonext-btn,
.video-overlay .backup-btn{
  position:absolute;
  top:-22px;
  font-size:16px;
  background:#191D1E;
  color:#888;
  border-radius:50%;
  width:24px;
  height:24px;
  line-height:24px;
  text-align:center;
  cursor:pointer;
  user-select:none;
}
.video-overlay .close-btn{right:-8px;font-weight:400}
.video-overlay .resize-btn{right:24px;font-size:18px}
.video-overlay .autonext-btn{right:58px;font-size:18px}
.video-overlay .autonext-btn[data-on="1"]{color:#960019}
.video-overlay .backup-btn{left:48px;font-size:18px}
.video-overlay .drawer-btn{
  position:absolute;
  top:-24px;
  left:-8px;
  font-size:26px;
  background:#191D1E;
  color:#888;
  border-radius:50%;
  width:48px;
  height:24px;
  line-height:26px;
  text-align:center;
  cursor:pointer;
  transition:transform .15s ease;
}
.drawer-btn.open{transform:rotate(180deg)}

.video-placeholder{
  display:none;
  position:absolute;
  inset:0;
  border-radius:8px;
  background:var(--surface);
  color:var(--text);
  z-index:2;
  box-sizing:border-box;
  padding:4px 12px 12px 8px;
  text-align:center;
  font-family:Roboto,Helvetica,sans-serif;
  overflow:hidden;
}
.video-placeholder .vp-title{
  color:var(--text);
  font-size:16px;
  font-weight:700;
  margin:0 0 8px;
  letter-spacing:.33em;
  line-height:1.15;
  position:sticky;
  top:0;
  z-index:2;
  background:var(--surface);
  padding:0 2px 4px;
}
.video-placeholder .vp-text{
  position:absolute;
  top:34px;
  left:8px;
  right:8px;
  bottom:8px;
  overflow-y:auto;
  overflow-x:hidden;
  font-size:14px;
  line-height:1.25em;
  padding:0 18px 32px 2px;
  box-sizing:border-box;
  scrollbar-width:thin;
  scrollbar-color:#6d7277 rgba(0,0,0,.12);
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.video-placeholder .vp-text b{color:var(--text)}
.video-placeholder .vp-text::-webkit-scrollbar,
#savedVideoList::-webkit-scrollbar{width:8px}
.video-placeholder .vp-text::-webkit-scrollbar-track,
#savedVideoList::-webkit-scrollbar-track{background:rgba(0,0,0,.12)}
.video-placeholder .vp-text::-webkit-scrollbar-thumb,
#savedVideoList::-webkit-scrollbar-thumb{background:#6d7277;border-radius:8px}

.video-drawer{
  position:absolute!important;
  bottom:4px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:320px!important;
  height:36px!important;
  background:#191D1E;
  padding:2px 8px!important;
  border-radius:0 0 8px 8px!important;
  transition:bottom .3s ease;
  align-items:center;
  justify-content:space-between;
  display:none;
  z-index:1002;
}
.video-drawer.open{
  bottom:-44px!important;
  display:flex!important;
}
.video-drawer input{
  flex:1;
  margin-right:8px;
  margin-left:2px;
  padding:2px;
  border-radius:4px;
  background:var(--surface);
  color:var(--text);
  border:0;
  font-size:14px;
  width:220px;
}
#videoInput[type="search"]{
  appearance:textfield;
  width:auto;
  border:none;
  background:var(--surface);
  color:var(--text);
}
#videoInput:focus{outline:0}
.video-drawer button{
  background:#393D3E;
  color:#fff;
  border:none;
  font-size:18px;
  padding:2px 8px;
  border-radius:4px;
  cursor:pointer;
}
.video-drawer button:hover{background:#960019}

#savedVideoList{
  display:none;
  position:absolute!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  bottom:-4px!important;
  width:320px!important;
  max-height:196px!important;
  overflow:auto;
  background:rgba(13,15,16,.78)!important;
  backdrop-filter:blur(1px);
  border:1px solid #3a3d3f;
  border-bottom:0;
  box-sizing:border-box;
  z-index:7!important;
  text-align:left;
  box-shadow:0 2px 8px rgba(0,0,0,.22);
  scrollbar-width:thin;
  scrollbar-color:#6d7277 rgba(0,0,0,.12);
  overscroll-behavior:contain;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
}
#savedVideoList .sv-row{
  display:block;
  position:relative;
  padding:4px 40px 4px 10px;
  border-bottom:1px solid #2b2f31;
  background:transparent;
  color:#ddd;
  font-size:13px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
  text-align:left;
}
#savedVideoList .sv-row:hover{background:#23272a}
#savedVideoList .sv-row[draggable="true"]{
  cursor:pointer;
  transition:transform .08s ease,box-shadow .08s ease;
}
#savedVideoList .sv-row.sv-dragging{
  cursor:grabbing;
  opacity:.75;
  transform:scale(1.03);
  box-shadow:none;
  z-index:2;
}
#savedVideoList .sv-row.sv-drop-target,
#savedVideoList .sv-row.sv-active{background:#34393d}
#savedVideoList .sv-remove{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  line-height:22px;
  text-align:center;
  color:#797d7e;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  border-radius:50%;
}
#savedVideoList .sv-remove:hover{
  color:#fff;
  background:rgba(255,255,255,.08);
}
#backToStartBtn{
  display:none;
  cursor:pointer;
  padding-right:12px;
  padding-left:6px;
  font-size:22px;
  font-weight:600;
  line-height:1;
  color:#aaa;
  user-select:none;
}
#backToStartBtn:hover{color:#fff}
#backToStartBtn.active{
  opacity:1;
  pointer-events:auto;
}
#saveVideoBtn{
  display:none;
  cursor:pointer;
  padding-left:4px;
  padding-right:2px;
  margin-left:6px;
  font-size:16px;
  line-height:1;
  color:#aaa;
  user-select:none;
}
#saveVideoBtn:hover{color:#458b74}

.video-buttons{
  display:flex;
  gap:12px;
  justify-content:center;
}
.video-buttons a{
  display:inline-block;
  padding:4px 8px;
  text-decoration:none;
  background:#191D1E;
  color:#fff;
  border-radius:6px;
  font-size:16px;
  font-weight:500;
  transition:background .2s ease;
  border:solid #e0e0e0 1px;
}
.video-buttons a:hover{
  color:#fff;
  background:#417FBC;
}

.hs-newstv-panel{max-width:760px;margin:18px auto 0;text-align:center}
.hs-newstv-panel .hs-news-tv-bookmark-btn{
  width:auto;
  min-width:180px;
  height:auto;
  padding:8px 14px;
  font-size:16px;
  line-height:1.2;
  border-radius:16px;
}
.hs-newstv-panel .hs-tv-note{
  max-width:720px;
  margin:20px auto 8px;
  text-align:center;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  padding:0 14px;
}
.hs-newstv-panel .hs-tv-row{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
  margin-bottom:14px;
}
.hs-newstv-panel .hs-tv-check{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  user-select:none;
}
.hs-newstv-panel .hs-tv-hidden{display:none}

@media (max-width:1100px){
  .headlines-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dir-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1020px){
  .topSearch{max-width:360px}
}
@media (max-width:980px){
  .topbar-main{grid-template-columns:auto 1fr auto}
  .topSearch{max-width:420px}
}
@media (max-width:940px){
  .topbar-main{
    grid-template-columns:1fr auto;
    grid-template-areas:"brand tools" "search search";
    row-gap:10px;
  }
  .brand-wrap{grid-area:brand}
  .header-tools{grid-area:tools}
  .topSearch{grid-area:search;max-width:450px;justify-self:center}
  .top-feed-menu-slot{padding-right:40px!important}
  .ad-slot-desktop{display:none!important}
  .ad-slot-mobile{display:block}
}
@media (max-width:900px){
  .brand-sub{font-size:15px}
  .feedbar-title{font-size:24px}
  .headline-image.image-small{width:170px;max-height:170px}
  .headline-image.image-medium{width:220px;max-height:220px}
  .headline-image.image-large{width:275px;max-height:275px}
}
@media (max-width:760px){
  .topbar-main{
    grid-template-columns:1fr auto;
    grid-template-areas:"brand tools" "search search";
    row-gap:10px;
  }
  .brand-wrap{grid-area:brand}
  .header-tools{grid-area:tools}
  .topSearch{grid-area:search;max-width:none;width:100%;justify-self:stretch}
  .brand .logo-light,.brand .logo-dark{height:34px}
  .brand-sub{font-size:15px}
}
@media (max-width:700px){
  .modebar-row{
    display:grid!important;
    grid-template-columns:repeat(3,max-content) 1fr!important;
    gap:8px!important;
    align-items:center!important;
  }

  .top-feed-menu-slot{
    grid-column:1 / -1!important;
    justify-content:center!important;
    min-width:0!important;
    padding-right:0!important;
  }

  .top-feed-menu-slot .feedmenu,
  .feedmenu-top{
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .feedmenu-panel{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:min(92vw,360px)!important;
    min-width:0!important;
  }
  .topSearch{max-width:none;width:100%}
  .display-tools-row{gap:16px}
  .back-to-top-btn{margin-left:0}
  .feedbar{
    grid-template-columns:42px 1fr 42px;
  }
  .feedbar-title{justify-self:start;font-size:22px;text-align:left}
  .headline-card{display:block}
  .headline-image-link{float:none;margin:0 0 10px 0}
  .headline-meta{white-space:normal}
  .headline-actions{margin-top:2px}
  .headline-image.image-small{width:120px;max-height:120px}
  .headline-image.image-medium{width:220px;max-height:220px}
  .headline-image.image-large{width:300px;max-height:300px}
}
@media (max-width:480px){
  .topSearch{position:relative;width:100%}
  .topAd{min-height:60px;max-height:60px}
  .headline-image-link:hover .headline-image,
  .headline-image:hover{transform:none!important}
  .dir-jump{position:static}
  .video-overlay{
    position:fixed!important;
    width:98vw!important;
    max-width:98vw!important;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:max(40px, env(safe-area-inset-bottom))!important;
    transform:translateX(-50%)!important;
    border-width:12px 2px 2px 2px;
    border-radius:6px;
    touch-action:none;
  }
  .video-overlay .video-modal{
    width:100%;
    padding-bottom:56.25%;
    touch-action:none;
  }
  .video-drawer{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    box-sizing:border-box!important;
    transform:none!important;
  }
  .video-drawer.open{bottom:-34px!important}
  .video-drawer input{font-size:16px}
  .video-overlay .close-btn{right:0}
  .video-overlay .resize-btn{right:36px}
  .video-overlay .drawer-btn{left:0}
  .video-overlay .backup-btn{left:64px}
  .video-overlay .autonext-btn{right:72px}
  #savedVideoList{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    box-sizing:border-box!important;
    transform:none!important;
    max-height:172px!important;
    bottom:-4px!important;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) and (orientation:portrait){
  .video-overlay{
    top:auto!important;
    left:50%!important;
    right:auto!important;
    bottom:35px!important;
    transform:translateX(-50%);
    margin:0;
  }
}


/* ===== header icon alignment / spacing refinements ===== */
.topbar-main{
  grid-template-columns:auto minmax(260px,1fr) auto !important;
}

.topSearch{
  max-width:440px !important;
margin-right:8px;
}

.header-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  min-width:124px;
}

.quicklinks-toggle,
.voice-search-btn{
  width:48px;
  height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
}

.ql-icon{
  width:28px !important;
  height:28px !important;
  min-width:28px;
  min-height:28px;
  margin:0 !important;
}

.voice-search-btn.listening,
#voice-search-btn[aria-busy="true"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* ===== mobile image/text spacing and stacking ===== */
@media (max-width:700px){
  .headline-card{
    display:block;
    padding-right:12px;
  }

  .headline-content{
    padding-right:6px;
  }

  .headline-image-link{
    float:none !important;
    display:block;
    width:100%;
    max-width:100%;
    margin:0 0 12px 0;
  }

  .headline-image{
    display:block;
    max-width:100%;
  }

  .headline-image.image-large{
    width:100% !important;
    max-height:none !important;
  }

  .headline-image.image-medium{
    width:min(220px, 100%);
  }

  .headline-image.image-small{
    width:min(120px, 100%);
  }
}

/* ===== tighter small-screen header fit ===== */
@media (max-width:760px){
  .topbar-main{
    grid-template-columns:1fr auto;
    grid-template-areas:"brand tools" "search search";
    row-gap:10px;
  }

  .topSearch{
    max-width:none !important;
    width:100%;
  }

  .header-tools{
    gap:8px;
    min-width:104px;
  }

  .quicklinks-toggle,
  .voice-search-btn{
    width:42px;
    height:42px;
  }

  .ql-icon{
    width:24px !important;
    height:24px !important;
    min-width:24px;
    min-height:24px;
  }
}

@media (max-width:480px){
  .brand-sub{
    display:none;
  }

  .topbar-main{
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
  }

  .topSearch{
    width:100%;
  }

  .header-tools{
    gap:6px;
    min-width:94px;
  }

  .quicklinks-toggle,
  .voice-search-btn{
    width:38px;
    height:38px;
  }

  .ql-icon{
    width:22px !important;
    height:22px !important;
    min-width:22px;
    min-height:22px;
  }

  .headline-card{
    padding-right:10px;
  }

  .headline-content{
    padding-right:8px;
  }

  .headline-image.image-large,
  .headline-image.image-medium,
  .headline-image.image-small{
    width:100% !important;
    max-height:none !important;
  }
}


/* ===== preserve desktop icon spacing, fix mobile header/image behavior ===== */

/* desktop / tablet spacing for search + top-right icons */
.topbar-main{
  grid-template-columns:auto minmax(260px,1fr) auto !important;
}
.topSearch{
  max-width:440px !important;
}
.header-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px !important;
  min-width:124px;
}
.quicklinks-toggle,
.voice-search-btn{
  width:48px;
  height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
}
.ql-icon{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  min-height:28px !important;
  margin:0 !important;
}

/* keep ad wrappers from creating horizontal movement */
.topAd,
.footerAd{
  overflow-x:hidden;
}
.ad-slot-desktop,
.ad-slot-mobile{
  max-width:100%;
}

/* mobile / narrow header corrections */
@media (max-width:760px){
  .topbar-main{
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:"brand tools" "search search";
    row-gap:10px;
    gap:10px;
  }
  .brand-wrap{
    grid-area:brand;
    min-width:0 !important;
  }
  .header-tools{
    grid-area:tools;
    min-width:0 !important;
    width:auto !important;
    gap:8px !important;
    justify-self:end !important;
    justify-content:flex-end !important;
  }
  .topSearch{
    grid-area:search;
    max-width:none !important;
    width:100%;
    min-width:0 !important;
    justify-self:stretch !important;
  }
  .quicklinks-toggle,
  .voice-search-btn{
    width:42px;
    height:42px;
  }
  .ql-icon{
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    min-height:24px !important;
  }
}

/* mobile image behavior:
   1 col = full width image
   2 col / 3 col = sized image with text allowed beside/below as space allows */
@media (max-width:700px){
  .modebar-row{
    display:grid!important;
    grid-template-columns:repeat(3,max-content) 1fr!important;
    gap:8px!important;
    align-items:center!important;
  }
  .top-feed-menu-slot{
    grid-column:1 / -1!important;
    justify-content:center!important;
    min-width:0!important;
    padding-right:0!important;
  }
  .top-feed-menu-slot .feedmenu,
  .feedmenu-top{
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .feedmenu-panel{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:min(92vw,360px)!important;
    min-width:0!important;
  }

  /* correct single-column stack on mobile */
  .headlines-grid.cols-1 .headline-card{
    display:block !important;
  }
  .headlines-grid.cols-1 .headline-image-link{
    float:none !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 0 12px 0 !important;
  }
  .headlines-grid.cols-1 .headline-image.image-small,
  .headlines-grid.cols-1 .headline-image.image-medium,
  .headlines-grid.cols-1 .headline-image.image-large{
    width:100% !important;
    max-height:none !important;
  }

  /* 2 and 3 columns behave the same */
  .headlines-grid.cols-2 .headline-card,
  .headlines-grid.cols-3 .headline-card{
    display:block !important;
  }
  .headlines-grid.cols-2 .headline-image-link,
  .headlines-grid.cols-3 .headline-image-link{
    float:none !important;
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    margin:0 0 10px 0 !important;
  }
  .headlines-grid.cols-2 .headline-image.image-small,
  .headlines-grid.cols-3 .headline-image.image-small{
    width:120px !important;
    max-height:120px !important;
  }
  .headlines-grid.cols-2 .headline-image.image-medium,
  .headlines-grid.cols-3 .headline-image.image-medium{
    width:220px !important;
    max-height:220px !important;
  }
  .headlines-grid.cols-2 .headline-image.image-large,
  .headlines-grid.cols-3 .headline-image.image-large{
    width:220px !important;
    max-height:220px !important;
  }

  .headline-content{
    padding-right:0 !important;
  }
  .headline-card{
    padding-right:0 !important;
  }
  .headline-meta{
    white-space:normal;
  }
  .headline-actions{
    margin-top:2px;
  }
}

@media (max-width:480px){
  .brand-sub{
    display:none;
  }
  .header-tools{
    gap:6px !important;
    min-width:0 !important;
    width:auto !important;
  }
  .quicklinks-toggle,
  .voice-search-btn{
    width:38px;
    height:38px;
  }
  .ql-icon{
    width:22px !important;
    height:22px !important;
    min-width:22px !important;
    min-height:22px !important;
  }

  /* keep ads from pushing viewport width */
  .topAd{
    min-height:60px;
    max-height:60px;
    overflow:hidden;
  }
  .ad-slot-mobile{
    width:100%;
    min-width:0 !important;
  }

  /* on very small screens, make image full width regardless of selected size */
  .headline-image.image-small,
  .headline-image.image-medium,
  .headline-image.image-large{
    width:100% !important;
    max-height:none !important;
  }
}


/* ===== stronger story card polish ===== */
.headline-card{
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 2px 6px rgba(0,0,0,.08);
  transition:all .18s ease;
}

.headline-card:hover{
  border-color:var(--text);
  background:var(--surface-2);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  transform:translateY(-3px) scale(1.01);
}

.headline-card:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(0,0,0,.12), 0 10px 28px rgba(0,0,0,.18);
}

.headline-title a{
  transition:color .15s ease;
}

.headline-card:hover .headline-title a{
  color:#000;
font-weight:700;
}

html[data-theme="dark"] .headline-card:hover .headline-title a{
  color:#fff;
}

/* image slightly lifts with card */
.headline-card:hover .headline-image{
  transform:scale(1.05);
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}

/* dark mode tuning */
html[data-theme="dark"] .headline-card{
  box-shadow:0 2px 8px rgba(0,0,0,.35);
}

html[data-theme="dark"] .headline-card:hover{
  box-shadow:0 12px 34px rgba(0,0,0,.55);
}

.hs-reset-hover .headline-card:hover{
  transform:none !important;
  box-shadow:0 2px 6px rgba(0,0,0,.08) !important;
  background:var(--surface) !important;
  border-color:var(--border) !important;
}

html[data-theme="dark"] .hs-reset-hover .headline-card:hover{
  box-shadow:0 2px 8px rgba(0,0,0,.35) !important;
}

.hs-reset-hover .headline-card:hover .headline-image,
.hs-reset-hover .headline-image-link:hover .headline-image,
.hs-reset-hover .headline-image:hover{
  transform:none !important;
  box-shadow:none !important;
}

.hs-reset-hover .headline-card:hover .headline-title a{
  color:inherit !important;
  font-weight:inherit !important;
}


.hs-reset-hover .headline-card:focus-within{
  border-color:var(--border) !important;
  box-shadow:0 2px 6px rgba(0,0,0,.08) !important;
}

html[data-theme="dark"] .hs-reset-hover .headline-card:focus-within{
  box-shadow:0 2px 8px rgba(0,0,0,.35) !important;
}

.hs-reset-hover .headline-card:focus-within .headline-title a{
  color:inherit !important;
  font-weight:inherit !important;
}
