:root{
  --bg:#0B0C10;
  --bg-elev:#15171D;
  --bg-elev-2:#1B1E26;
  --border:#262931;
  --text:#EDEEF2;
  --text-mute:#8A8F98;
  --amber:#F2B84B;
  --red:#FF5C5C;
  --teal:#3FD6C1;
  --violet:#8B6BF2;
}
[data-theme="light"]{
  --bg:#F7F7F9;
  --bg-elev:#FFFFFF;
  --bg-elev-2:#F0F1F4;
  --border:#E3E5EA;
  --text:#15171D;
  --text-mute:#6B7078;
  --amber:#B8791E;
  --red:#D6473F;
  --teal:#0E8F7E;
  --violet:#6446C7;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(139,107,242,0.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 0%, rgba(242,184,75,0.06), transparent 55%),
    var(--bg);
  background-repeat:no-repeat;
  background-attachment:fixed;
  color:var(--text);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  transition:background-color .15s, color .15s;
}
[data-theme="light"] body{background-image:none;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--amber); outline-offset:3px; border-radius:4px;}
.wrap{max-width:1080px; margin:0 auto; padding:0 20px;}
.wrap-wide{max-width:1080px; margin:0 auto; padding:40px 20px 100px;}
img{max-width:100%;}

header.top{
  border-bottom:1px solid var(--border);
  padding:16px 0;
  position:sticky; top:0; z-index:20;
  background:color-mix(in srgb, var(--bg) 85%, transparent);
  backdrop-filter:blur(10px);
}
.top-inner{display:flex; align-items:center; justify-content:space-between; gap:16px;}
.brand{display:flex; align-items:center; gap:10px; font-family:'Sora',sans-serif; font-weight:600; font-size:1.1rem; letter-spacing:0.01em; text-decoration:none;}
.brand-mark{
  width:26px; height:26px; border-radius:6px; flex-shrink:0; display:block;
}
nav.top-nav{display:flex; align-items:center; gap:20px; font-size:0.86rem; color:var(--text-mute);}
.nav-dropdown{position:relative;}
.nav-dropdown-menu{
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  display:none; z-index:40; padding-top:10px;
}
.nav-dropdown:hover .nav-dropdown-menu{display:block;}
.nav-dropdown-menu-card{
  background:var(--bg-elev); border:1px solid var(--border); border-radius:10px;
  min-width:200px; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,0.3);
}
.nav-chevron{display:inline-block; margin-left:4px; transition:transform .15s;}
.nav-dropdown:hover .nav-chevron{transform:rotate(180deg);}
.nav-dropdown-menu a{
  display:block; padding:10px 14px; text-decoration:none; color:var(--text);
  font-size:0.85rem; border-bottom:1px solid var(--border); white-space:nowrap;
}
.nav-dropdown-menu a:last-child{border-bottom:none;}
.nav-dropdown-menu a:hover{background:var(--bg-elev-2); color:var(--amber);}
.nav-dropdown-menu a.nav-dropdown-all{color:var(--amber); font-weight:600;}
.mobile-sub-link{font-size:0.85rem !important; color:var(--text-mute) !important;}
nav.top-nav a{text-decoration:none; transition:color .15s;}
nav.top-nav a:hover{color:var(--text);}
nav.top-nav a.active{color:var(--amber);}
.nav-dropdown > a{display:inline-flex; align-items:center;}
.theme-btn{
  background:var(--bg-elev); border:1px solid var(--border); color:var(--text);
  width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:0.9rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.theme-btn:hover{border-color:var(--amber);}
.random-btn{
  background:var(--bg-elev); border:1px solid var(--border); color:var(--text);
  width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:0.9rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:border-color .15s, opacity .15s;
}
.random-btn:hover{border-color:var(--amber);}
.random-btn:disabled{opacity:0.5; cursor:default;}

.nav-group{display:flex; align-items:center; gap:18px; margin-left:auto;}
.theme-btn-tight{margin-left:-10px;}

.site-search{position:relative; width:200px; transition:width .2s ease;}
.nav-group .site-search:focus-within{width:340px;}
.site-search input{
  width:100%; background:var(--bg-elev); border:1px solid var(--border); border-radius:8px;
  color:var(--text); padding:7px 12px; font-family:'Inter',sans-serif; font-size:0.85rem; box-sizing:border-box;
}
.site-search input:focus{outline:none; border-color:var(--amber);}
.search-results{
  position:absolute; top:calc(100% + 6px); left:0; right:0; background:var(--bg-elev);
  border:1px solid var(--border); border-radius:10px; overflow:hidden; z-index:30;
  max-height:340px; overflow-y:auto; display:none; box-shadow:0 8px 24px rgba(0,0,0,0.3);
  scrollbar-width:thin; scrollbar-color:var(--border) transparent;
}
.search-results::-webkit-scrollbar{width:8px;}
.search-results::-webkit-scrollbar-track{background:transparent;}
.search-results::-webkit-scrollbar-thumb{background:var(--border); border-radius:8px;}
.search-results::-webkit-scrollbar-thumb:hover{background:var(--text-mute);}
.search-results.open{display:block;}
.search-results a{
  display:flex; align-items:center; gap:10px; padding:9px 12px; text-decoration:none; color:var(--text);
  border-bottom:1px solid var(--border); font-size:0.85rem;
}
.search-results a:last-child{border-bottom:none;}
.search-results a:hover, .search-results a.active-result{background:var(--bg-elev-2);}
.r-img{width:28px; height:28px; border-radius:6px; background:var(--bg-elev-2); flex-shrink:0; object-fit:cover;}
.r-img.fallback{
  display:flex; align-items:center; justify-content:center; font-family:'Sora',sans-serif; font-weight:700;
  font-size:0.62rem; color:var(--text-mute); border:1px dashed var(--border);
}
.r-text{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px;}
.r-name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.search-results .r-game{font-size:0.72rem; color:var(--text-mute); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.search-results .r-status{font-size:0.66rem; font-family:'JetBrains Mono',monospace; text-transform:uppercase; flex-shrink:0;}
.search-results .r-status.expired{color:var(--text-mute);}
.search-results .r-status.active{color:var(--teal);}
.search-results .r-status.upcoming{color:var(--amber);}
.search-empty{padding:12px; font-size:0.82rem; color:var(--text-mute); text-align:center;}

.search-btn-mobile{
  display:none; background:var(--bg-elev); border:1px solid var(--border); color:var(--text);
  width:32px; height:32px; border-radius:8px; cursor:pointer; align-items:center; justify-content:center; flex-shrink:0;
}
.mobile-search-panel{display:none; max-height:0; overflow:hidden; transition:max-height .2s ease;}
.mobile-search-panel.open{display:block; max-height:450px; padding-top:12px;}
.site-search-mobile{width:100%;}

@media (max-width:640px){
  .nav-group .site-search{display:none;}
  .search-btn-mobile{display:flex;}
}

.hamburger-btn{
  display:none; flex-direction:column; justify-content:center; gap:4px;
  background:var(--bg-elev); border:1px solid var(--border); border-radius:8px;
  width:36px; height:32px; cursor:pointer; padding:0;
}
.hamburger-btn span{display:block; width:16px; height:2px; background:var(--text); margin:0 auto; transition:transform .2s, opacity .2s;}
.hamburger-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.hamburger-btn[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburger-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

.mobile-menu{
  display:none; flex-direction:column; gap:2px;
  max-height:0; overflow:hidden;
  transition:max-height .2s ease;
}
.mobile-menu.open{max-height:520px; border-top:1px solid var(--border); margin-top:14px;}
.mobile-menu a, .mobile-menu button{
  padding:12px 4px; font-size:0.92rem; color:var(--text-mute); text-decoration:none;
  border-bottom:1px solid var(--border); background:none; border-left:none; border-right:none; border-top:none;
  text-align:left; font-family:'Inter',sans-serif; cursor:pointer; width:100%;
}
.mobile-menu a.active{color:var(--amber);}

@media (max-width:640px){
  nav.top-nav{display:none;}
  .hamburger-btn{display:flex;}
  .mobile-menu{display:flex;}
}

.legal-sections{
  display:flex; flex-direction:column;
  background:var(--bg-elev); border:1px solid var(--border); border-radius:14px; padding:8px 26px;
}
.legal-section{padding:24px 0; border-top:1px dashed var(--border);}
.legal-section:first-child{border-top:none; padding-top:22px;}
.legal-section h2{font-family:'Sora',sans-serif; font-size:1.05rem; font-weight:600; margin:0 0 10px;}
.legal-section p{color:var(--text-mute); font-size:0.92rem; line-height:1.65; margin:0;}

.faq-list{display:flex; flex-direction:column; gap:6px;}
.faq-item{background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; overflow:hidden; transition:border-color .15s;}
.faq-item:hover{border-color:var(--amber);}
.faq-question{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px; cursor:pointer; user-select:none;}
.faq-item h2{font-family:'Sora',sans-serif; font-size:0.95rem; font-weight:600; margin:0; transition:color .15s;}
.faq-question:hover h2{color:var(--amber);}
.faq-chevron{flex-shrink:0; color:var(--text-mute); transition:transform .15s;}
.faq-question .faq-chevron{position:static; top:auto; right:auto;}
.faq-answer{padding:0 22px 18px;}
.faq-item p{color:var(--text-mute); font-size:0.88rem; line-height:1.55; margin:0;}

.game-card-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px;}
.game-card{
  display:block; background:var(--bg-elev); border:1px solid var(--border); border-radius:12px;
  padding:18px; text-decoration:none; color:var(--text); transition:border-color .15s, transform .15s;
}
.game-card:hover{border-color:var(--amber); transform:translateY(-2px);}
.game-card-name{font-family:'Sora',sans-serif; font-weight:600; font-size:0.95rem;}
.game-card-meta{font-size:0.78rem; color:var(--text-mute); margin-top:5px;}

.perm-card{
  background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; padding:16px;
  text-decoration:none; color:var(--text); display:flex; flex-direction:column; gap:10px;
  transition:border-color .15s, transform .15s;
}
.perm-card:hover{border-color:var(--violet); transform:translateY(-2px);}
.perm-top{display:flex; align-items:center; gap:12px; min-width:0;}
.perm-top > div{min-width:0;}
.perm-tag{font-size:0.68rem; color:var(--violet); margin-top:2px;}
.perm-card .earn{font-size:0.8rem; color:var(--text-mute); line-height:1.45; border-top:1px dashed var(--border); padding-top:10px; margin-top:0;}

.section-head.collapse-toggle{cursor:pointer; user-select:none; position:relative; padding-right:30px;}
.section-head.collapse-toggle:hover h2{color:var(--amber);}
.collapse-chevron{position:absolute; right:0; top:2px; transition:transform .15s; color:var(--text-mute);}
.collapse-chevron.collapsed{transform:rotate(-90deg);}

.filter-bar{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; padding-bottom:20px; border-bottom:1px solid var(--border);}
.filter-label{font-size:0.8rem; color:var(--text-mute); margin-right:4px;}
.filter-btn{
  background:var(--bg-elev); border:1px solid var(--border); color:var(--text-mute);
  font-family:'Inter',sans-serif; font-size:0.82rem; padding:6px 13px; border-radius:20px; cursor:pointer;
  transition:border-color .15s, color .15s, background .15s;
}
.filter-btn:hover{border-color:var(--amber); color:var(--text);}
.filter-btn.active{background:var(--amber); border-color:var(--amber); color:#0B0C10; font-weight:600;}
.type-tag{
  display:inline-block; align-self:flex-start; font-size:0.72rem; color:var(--text-mute); background:var(--bg-elev-2);
  border-radius:6px; padding:2px 8px; margin-bottom:10px;
}
.free-paid-tag{
  display:inline-block; font-size:0.72rem; font-weight:700; border-radius:6px; padding:2px 8px; margin-bottom:10px;
  text-decoration:none; cursor:pointer;
}
.free-paid-tag.free{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.free-paid-tag.paid{background:color-mix(in srgb, var(--amber) 18%, transparent); color:var(--amber);}
.pill-icon{position:relative; display:inline;}
.hidden{display:none !important;}

.eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--amber); margin-bottom:14px; display:flex; align-items:center; gap:8px;
}
.eyebrow.pulse::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--red); box-shadow:0 0 8px var(--red); animation:pulse 1.6s infinite;}
@media (prefers-reduced-motion:reduce){ .eyebrow.pulse::before{animation:none;} }
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.35;}}

.hero{padding:48px 0 26px;}
h1{font-family:'Sora',sans-serif; font-weight:600; font-size:clamp(1.7rem,4vw,2.5rem); line-height:1.15; margin:0 0 12px; letter-spacing:-0.01em;}
.hero p{color:var(--text-mute); max-width:520px; line-height:1.55; margin:0; font-size:0.98rem;}

.section{padding:34px 0;}
.section-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:18px; gap:12px; flex-wrap:wrap;}
.section-head h2{font-family:'Sora',sans-serif; font-size:1.05rem; font-weight:600; margin:0; display:flex; align-items:center; gap:10px;}
.count-pill{font-family:'JetBrains Mono',monospace; font-size:0.72rem; color:var(--text-mute); border:1px solid var(--border); border-radius:20px; padding:2px 9px;}
.section-sub{color:var(--text-mute); font-size:0.82rem;}

.sort-bar{display:flex; align-items:center; gap:10px; margin-bottom:14px; font-size:0.85rem; color:var(--text-mute);}
.sort-bar select{
  background:var(--bg-elev); border:1px solid var(--border); color:var(--text);
  border-radius:8px; padding:6px 10px; font-family:'Inter',sans-serif; font-size:0.85rem;
}

.strip{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px;}
.slot.slot-urgent{background:linear-gradient(180deg, color-mix(in srgb, var(--red) 9%, transparent), var(--bg-elev)); border-color:color-mix(in srgb, var(--red) 35%, transparent);}
.slot.slot-urgent:hover{border-color:var(--red);}

.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px;}
.slot{background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; padding:16px; position:relative; overflow:hidden; transition:border-color .15s, transform .15s; text-decoration:none; color:var(--text); display:flex; flex-direction:column;}
.slot:hover{border-color:var(--amber); transform:translateY(-2px);}
.ribbon{position:absolute; top:0; right:0; font-family:'JetBrains Mono',monospace; font-size:0.66rem; font-weight:700; padding:4px 10px 4px 12px; border-bottom-left-radius:10px;}
.ribbon.amber{background:color-mix(in srgb, var(--amber) 18%, transparent); color:var(--amber);}
.ribbon.teal{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.ribbon.red{background:color-mix(in srgb, var(--red) 20%, transparent); color:var(--red);}
.ribbon.mute{background:var(--bg-elev-2); color:var(--text-mute);}
.slot-top{display:flex; align-items:center; gap:12px; margin-bottom:12px; margin-top:22px; min-width:0;}
.slot-top > div{min-width:0;}
.slot img, .badge-img{width:42px; height:42px; border-radius:8px; background:var(--bg-elev-2); flex-shrink:0;}
.icon-fallback{width:42px; height:42px; border-radius:8px; background:var(--bg-elev-2); border:1px dashed var(--border); display:flex; align-items:center; justify-content:center; font-family:'Sora',sans-serif; font-weight:700; color:var(--text-mute); flex-shrink:0;}
.slot .name{font-family:'Sora',sans-serif; font-weight:600; font-size:0.92rem; line-height:1.2; overflow-wrap:break-word;}
.slot .game{font-size:0.72rem; color:var(--text-mute); margin-top:2px; overflow-wrap:break-word;}
.game-link{text-decoration:none; border-bottom:1px dotted var(--text-mute); transition:color .15s, border-color .15s; cursor:pointer;}
.game-link:hover{color:var(--amber); border-color:var(--amber);}
.slot .earn{font-size:0.8rem; color:var(--text-mute); line-height:1.45; border-top:1px dashed var(--border); padding-top:10px; margin-top:4px;}
.slot .dates{display:flex; justify-content:space-between; gap:10px; margin-top:auto; border-top:1px dashed var(--border); padding-top:10px; font-family:'JetBrains Mono',monospace; font-size:0.68rem; color:var(--text-mute);}
.slot .dates .dates-sep{color:var(--border); flex-shrink:0;}
.slot.locked{opacity:0.75;}
.slot.locked img{filter:grayscale(1) brightness(0.5);}

.detail{padding-top:40px; padding-bottom:70px;}
.breadcrumb{font-size:0.8rem; color:var(--text-mute); margin-bottom:20px;}
.detail-top-row{display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px; margin-bottom:20px;}
.cat-link{font-size:0.82rem; color:var(--amber); text-decoration:none;}
.cat-link:hover{text-decoration:underline;}
.breadcrumb a{text-decoration:none;} .breadcrumb a:hover{color:var(--amber);}
.detail-head{display:flex; align-items:center; gap:18px; margin-bottom:22px; flex-wrap:wrap; min-width:0;}
.detail-head img, .detail-head .icon-fallback{width:64px; height:64px; border-radius:12px; flex-shrink:0;}
.detail-head h1{margin:0 0 4px; font-size:1.6rem; overflow-wrap:break-word;}
.detail-meta{color:var(--text-mute); font-size:0.9rem;}
.status-pill{display:inline-block; font-family:'JetBrains Mono',monospace; font-size:0.7rem; font-weight:700; padding:4px 11px; border-radius:20px; margin-bottom:16px; text-decoration:none;}
.status-pill.active{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.status-pill.upcoming{background:color-mix(in srgb, var(--amber) 18%, transparent); color:var(--amber);}
.status-pill.expired{background:var(--bg-elev-2); color:var(--text-mute);}
.status-pill.permanent{background:color-mix(in srgb, var(--violet) 18%, transparent); color:var(--violet);}
.detail-card{background:var(--bg-elev); border:1px solid var(--border); border-radius:14px; padding:26px; margin-bottom:20px; position:relative; overflow:hidden;}
.detail-card.no-clip{overflow:visible;}
.detail-card.has-time-left h2{padding-right:70px;}
.time-left{
  position:absolute; top:0; right:0;
  font-family:'JetBrains Mono',monospace; font-size:0.7rem; font-weight:700;
  padding:5px 12px 5px 14px; border-bottom-left-radius:10px;
}
.time-left.red{background:color-mix(in srgb, var(--red) 20%, transparent); color:var(--red);}
.time-left.amber{background:color-mix(in srgb, var(--amber) 18%, transparent); color:var(--amber);}
.time-left.teal{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.time-left.mute{background:var(--bg-elev-2); color:var(--text-mute);}
.detail-card h2{font-family:'Sora',sans-serif; font-size:1rem; margin:0 0 10px;}
.detail-card .faq-item h2{font-size:0.95rem; margin:0;}
.detail-card p{color:var(--text-mute); line-height:1.6; margin:0; font-size:0.95rem;}
.detail-additional-info{border-top:1px dashed var(--border); padding-top:14px; margin-top:14px !important; font-size:0.88rem !important;}
.detail-additional-info b{color:var(--text);}
.detail-dates{display:flex; gap:26px; flex-wrap:wrap; margin-top:14px; border-top:1px dashed var(--border); padding-top:14px; font-family:'JetBrains Mono',monospace; font-size:0.78rem; color:var(--text-mute);}
.detail-dates b{color:var(--text); display:block; font-family:'Inter',sans-serif; font-weight:500; font-size:0.72rem; margin-bottom:3px;}
.detail-dates .divider{border-left:1px dotted var(--border); padding-left:14px;}
.detail-dates a{color:var(--text-mute); text-decoration:none; border-bottom:1px dotted var(--text-mute); transition:color .15s, border-color .15s;}
.detail-dates a:hover{color:var(--amber); border-bottom-color:var(--amber);}
@media (max-width:640px){
  .detail-dates{flex-direction:column; gap:12px;}
  .detail-dates .divider{border-left:none; padding-left:0; border-top:1px dashed var(--border); padding-top:12px;}
}
.own-pill-outside{
  position:absolute; top:0; right:0; z-index:2;
  display:inline-flex; align-items:center; gap:6px;
  background:var(--bg-elev-2); border:none; border-bottom-left-radius:10px; color:var(--text-mute);
  padding:6px 14px 6px 12px; cursor:pointer; font-family:'Inter',sans-serif; font-size:0.75rem; font-weight:700;
  transition:color .15s, background .15s;
}
.own-pill-outside:hover{color:var(--amber);}
.own-pill-outside.owned{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.own-pill-outside svg{width:14px; height:14px; flex-shrink:0;}
.own-pill-outside .icon-outline{display:block;}
.own-pill-outside .icon-filled{display:none;}
.own-pill-outside.owned .icon-outline{display:none;}
.own-pill-outside.owned .icon-filled{display:block;}
.detail-card.has-own-pill h2{padding-right:75px;}
.timeline-collapsible{padding:0 0 16px; transition:padding 0.3s ease;}
.timeline-collapsible.expanded{padding-bottom:0;}
.timeline-header{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:26px 26px 10px; cursor:pointer; user-select:none;
}
.timeline-header h2,
.detail-card.has-time-left .timeline-header h2{margin:0; padding-right:0;}
.timeline-header-left{display:flex; align-items:center; gap:8px; min-width:0;}
.timeline-summary{color:var(--text-mute); font-size:0.82rem; font-family:'JetBrains Mono',monospace; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.timeline-chevron{color:var(--text-mute); flex-shrink:0; width:18px; height:18px; transition:transform 0.25s ease;}
.timeline-collapsible.expanded .timeline-chevron{transform:rotate(180deg);}
.timeline-body{max-height:0; overflow:hidden; transition:max-height 0.3s ease, padding 0.3s ease; padding:0 26px;}
.timeline-collapsible.expanded .timeline-body{max-height:200px; padding:0 26px 26px;}
.detail-card.has-time-left.timeline-collapsible .timeline-header{padding-right:27.6px;}
.confetti-piece{position:fixed; top:0; left:0; width:8px; height:8px; pointer-events:none; z-index:999; border-radius:2px;}
.fly-badge{
  position:fixed; top:0; left:0; z-index:1000; pointer-events:none;
  width:32px; height:32px; transform:translate(-50%, -50%);
  font-size:1.4rem; display:flex; align-items:center; justify-content:center;
}
.fly-badge img{width:100%; height:100%; border-radius:6px; object-fit:cover; box-shadow:0 4px 14px rgba(0,0,0,0.4);}
#navCollectionLink{display:inline-block;}
#navCollectionLink.nav-pulse{animation:navPulse 0.5s ease;}
@keyframes navPulse{
  0%{ color:var(--text); }
  30%{ color:var(--amber); transform:scale(1.15); }
  100%{ color:var(--text); transform:scale(1); }
}
.timeline-dates{display:flex; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:0.85rem; color:var(--text-mute); margin:0 0 14px; padding-top:1.5px;}
.timeline-dates b{color:var(--text); display:block; font-family:'Inter',sans-serif; font-weight:500; font-size:0.72rem; margin-bottom:3px;}
.timeline-end{text-align:right;}
.time-progress-track{height:6px; border-radius:4px; overflow:hidden; background:var(--bg-elev-2);}
.time-progress-fill{
  height:100%; border-radius:4px; background-repeat:no-repeat;
  background-image:linear-gradient(90deg, var(--teal), var(--amber) 70%, var(--red));
}
.time-progress-fill.expired{background-image:none; background-color:var(--text-mute);}

.chat-preview{
  border-radius:12px; overflow:hidden; border:1px solid var(--border);
  display:flex; flex-wrap:wrap;
}
.chat-preview-col{
  flex:1; min-width:220px; background:var(--bg-elev); padding:18px 20px;
}
.sizes-col{
  flex:1; min-width:220px; background:var(--bg-elev); padding:22px 24px;
  border-left:1px solid var(--border);
}
@media (max-width:560px){
  .sizes-col{border-left:none; border-top:1px solid var(--border);}
}
.chat-label{font-family:'JetBrains Mono',monospace; font-size:0.68rem; color:var(--text-mute); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:10px;}
.chat-line{display:flex; align-items:center; gap:6px; font-size:0.88rem; line-height:1.9; color:var(--text); flex-wrap:wrap;}
.chat-badge-icon{width:18px; height:18px; border-radius:3px; flex-shrink:0;}
.chat-badge-fallback{width:18px; height:18px; border-radius:3px; background:var(--bg-elev-2); display:flex; align-items:center; justify-content:center; font-size:0.5rem; font-weight:700; color:var(--text-mute); flex-shrink:0;}
.chat-user{font-weight:700;}
.chat-msg{color:var(--text);}
.sizes-row{display:flex; align-items:flex-end; justify-content:center; gap:32px; flex-wrap:wrap;}
.size-item{display:flex; flex-direction:column; align-items:center; gap:8px;}
.size-item img{background:var(--bg-elev-2); border-radius:6px; display:block;}
.size-label{font-family:'JetBrains Mono',monospace; font-size:0.7rem; color:var(--text); font-weight:600;}
.size-px{font-size:0.68rem; color:var(--text-mute);}
.size-open{font-size:0.7rem; color:var(--amber); text-decoration:none; margin-top:2px;}
.size-open:hover{text-decoration:underline;}
.size-empty{font-size:0.8rem; color:var(--text-mute);}

.timeline{position:relative; padding-left:26px; padding-bottom:20px;}
.timeline::before{content:''; position:absolute; left:5px; top:6px; bottom:0; width:2px; background:var(--border);}
.day-group{position:relative; margin-bottom:28px;}
.day-dot{position:absolute; left:-26px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--bg-elev-2); border:2px solid var(--border);}
.day-group.today .day-dot{background:var(--amber); border-color:var(--amber); box-shadow:0 0 0 4px color-mix(in srgb, var(--amber) 20%, transparent);}
.day-label{font-family:'Sora',sans-serif; font-weight:600; font-size:0.95rem; margin-bottom:2px;}
.day-group.today .day-label{color:var(--amber);}
.day-sublabel{font-size:0.78rem; color:var(--text-mute); margin-bottom:12px;}
.timeline-divider{font-family:'JetBrains Mono',monospace; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-mute); margin:6px 0 24px 0;}
.events-row{display:flex; flex-direction:column; gap:8px;}
.event-card{
  display:flex; align-items:center; gap:12px; background:var(--bg-elev); border:1px solid var(--border);
  border-radius:10px; padding:10px 14px; text-decoration:none; color:var(--text);
  transition:border-color .15s, transform .15s;
}
.event-card:hover{border-color:var(--amber); transform:translateX(2px);}
.event-text{flex:1; min-width:0;}
.event-name{font-weight:600; font-size:0.9rem;}
.event-meta{font-size:0.76rem; color:var(--text-mute);}
.event-tag{font-family:'JetBrains Mono',monospace; font-size:0.66rem; font-weight:700; padding:3px 9px; border-radius:14px; flex-shrink:0;}
.event-tag.starts{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.event-tag.ends{background:color-mix(in srgb, var(--red) 18%, transparent); color:var(--red);}
.event-card .free-paid-tag{margin-bottom:0; flex-shrink:0; font-family:'JetBrains Mono',monospace; font-size:0.66rem; padding:3px 9px;}

.today-head-row{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap;}

.sort-dropdown{position:relative; flex-shrink:0;}
.sort-dropdown-btn{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-width:190px; background:var(--bg-elev-2); border:1px solid var(--border); border-radius:999px;
  color:var(--text); font-family:'Inter',sans-serif; font-size:0.85rem; font-weight:500;
  padding:8px 16px; cursor:pointer; transition:border-color .2s ease;
}
.sort-dropdown-btn:hover{border-color:var(--amber);}
.sort-dropdown.open .sort-dropdown-btn{border-color:var(--amber);}
.sort-dropdown-chevron{flex-shrink:0; transition:transform .15s ease;}
.sort-dropdown.open .sort-dropdown-chevron{transform:rotate(180deg);}
.sort-dropdown-list{
  position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:30;
  background:var(--bg-elev); border:1px solid var(--border); border-radius:10px;
  overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,0.3);
  display:none; list-style:none; margin:0; padding:0;
}
.sort-dropdown.open .sort-dropdown-list{display:block;}
.sort-dropdown-list li{
  padding:9px 16px; font-family:'Inter',sans-serif; font-size:0.85rem; color:var(--text);
  cursor:pointer; border-bottom:1px solid var(--border); white-space:nowrap;
}
.sort-dropdown-list li:last-child{border-bottom:none;}
.sort-dropdown-list li:hover{background:var(--bg-elev-2); color:var(--amber);}
.sort-dropdown-list li.active{color:var(--amber); font-weight:600; background:var(--bg-elev-2);}

.profile-layout{display:flex; gap:20px; align-items:flex-start;}
.sidebar{width:250px; flex-shrink:0; position:sticky; top:30px;}
.pfp-wrap{position:relative; width:150px; margin-bottom:20px;}
.pfp{width:150px; height:150px; border-radius:50%; background:var(--bg-elev-2); border:3px solid var(--border); object-fit:cover; display:block;}
.pfp svg{display:block;}
.pfp-edit-btn{
  position:absolute; bottom:4px; right:4px; width:36px; height:36px; border-radius:50%;
  background:var(--amber); border:3px solid var(--bg); color:#0B0C10;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.pfp-edit-btn svg{width:16px; height:16px;}
.username-row{display:flex; align-items:center; gap:8px; margin-bottom:4px;}
.username-display{font-family:'Sora',sans-serif; font-size:1.7rem; font-weight:800; letter-spacing:-0.01em;}
.username-edit-btn{background:none; border:none; color:var(--text-mute); cursor:pointer; padding:4px;}
.username-edit-btn:hover{color:var(--amber);}
.username-edit-btn svg{width:16px; height:16px;}
.username-input{
  font-family:'Sora',sans-serif; font-size:1.4rem; font-weight:800; background:var(--bg-elev-2);
  border:1px solid var(--amber); border-radius:8px; color:var(--text); padding:4px 10px; width:100%; display:none;
}
.stats-line{color:var(--text-mute); font-size:0.9rem; margin-bottom:24px;}
.stats-line b{color:var(--amber); font-family:'Sora',sans-serif; font-size:1.15rem;}
.rank-row{display:flex; align-items:center; gap:10px;}
.rank-info{min-width:0; flex:1;}
.rank-row svg{flex-shrink:0;}
.rank-name{font-family:'Sora',sans-serif; font-size:0.92rem; font-weight:700;}
.rank-next{font-family:'JetBrains Mono',monospace; font-size:0.7rem; color:var(--text-mute); margin-top:2px;}
.rank-progress-track{height:6px; border-radius:4px; background:var(--bg-elev-2); overflow:hidden; margin-top:8px;}
.rank-progress-fill{height:100%; border-radius:4px; transition:width .4s ease, background-color .3s ease; width:0%;}
.rankup-banner{
  position:fixed; top:24px; left:50%; transform:translateX(-50%) translateY(-20px);
  background:var(--bg-elev); border:2px solid var(--amber); border-radius:16px;
  padding:20px 32px; z-index:1000; text-align:center; box-shadow:0 12px 40px rgba(0,0,0,0.5);
  opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease;
}
.rankup-banner.show{opacity:1; transform:translateX(-50%) translateY(0);}
.rankup-banner .rankup-label{font-family:'JetBrains Mono',monospace; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--amber); margin-bottom:6px;}
.rankup-banner .rankup-name{font-family:'Sora',sans-serif; font-size:1.5rem; font-weight:800;}
.side-section{margin-bottom:22px;}
.side-label{font-family:'JetBrains Mono',monospace; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.07em; color:var(--text-mute); margin-bottom:10px;}
.io-btn{
  background:var(--bg-elev-2); border:1px solid var(--border); border-radius:7px; color:var(--text-mute);
  padding:7px 12px; font-size:0.78rem; font-weight:600; cursor:pointer; font-family:'Inter',sans-serif;
  display:block; width:100%; text-align:left; margin-bottom:6px;
}
.io-btn:hover{border-color:var(--amber); color:var(--text);}
.io-btn-danger{margin-top:2px;}
.io-status{font-size:0.74rem; color:var(--teal); min-height:1.1em; margin-top:4px;}
.warn-text{font-size:0.72rem; color:var(--text-mute); line-height:1.5; margin-top:4px;}
.main{flex:1; min-width:0;}
.section-head{display:flex; align-items:center; gap:10px; margin:0 0 6px;}
.section-head:not(:first-child){margin-top:38px;}
.section-head h2{font-family:'Sora',sans-serif; font-size:1.1rem; margin:0;}
.section-head .count{font-family:'JetBrains Mono',monospace; font-size:0.76rem; color:var(--text-mute);}
.inline-sort{margin-left:auto;}
.mini-search + .inline-sort{margin-left:8px;}
.mini-search{
  margin-left:auto; width:150px; background:var(--bg-elev-2); border:1px solid var(--border); border-radius:20px;
  color:var(--text); padding:6px 12px; font-family:'Inter',sans-serif; font-size:0.8rem;
}
.mini-search:focus{outline:none; border-color:var(--amber);}
.mini-search::placeholder{color:var(--text-mute);}
.detail-card .section-hint{color:var(--text-mute); font-size:0.85rem; line-height:1.5; margin:0 0 16px;}
.img-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(44px, 1fr)); gap:10px; user-select:none;}
.img-tile{
  width:100%; aspect-ratio:1; border-radius:8px; background:var(--bg-elev-2); cursor:pointer;
  transition:transform .15s, opacity .15s; display:block; object-fit:cover;
  user-select:none; -webkit-user-select:none; -webkit-user-drag:none;
}
.img-tile:hover{transform:scale(1.06);}
.img-tile.missed{opacity:0.3; transition:opacity .15s, transform .15s;}
.img-tile.missed:hover{opacity:1; box-shadow:0 0 0 2px var(--amber);}
.img-tile.search-match{opacity:1; box-shadow:0 0 0 2px var(--teal);}
.img-tile.search-dimmed{opacity:0.15;}
.empty-msg{grid-column:1/-1; color:var(--text-mute); font-size:0.85rem; padding:10px 2px;}
@media (max-width:640px){
  .profile-layout{flex-direction:column;}
  .sidebar{width:100%; position:static;}
  .sidebar .detail-card{margin-bottom:0;}
  .pfp-wrap{margin-left:auto; margin-right:auto;}
  .username-row{justify-content:center;}
  .stats-line{text-align:center;}
  .rank-row{justify-content:center;}
}

.scroll-top-btn{
  position:fixed; bottom:24px; right:24px; width:44px; height:44px; border-radius:50%;
  background:var(--bg-elev); border:1px solid var(--border); color:var(--text);
  font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,0.3); z-index:80;
  opacity:0; pointer-events:none; transform:translateY(10px);
  transition:opacity .25s ease, transform .25s ease, border-color .15s ease;
}
.scroll-top-btn.visible{opacity:1; pointer-events:auto; transform:translateY(0);}
.scroll-top-btn:hover{border-color:var(--amber); color:var(--amber);}
@media (max-width:640px){ .scroll-top-btn{bottom:16px; right:16px; width:40px; height:40px;} }

.try-col{flex:1; min-width:200px; background:var(--bg-elev); padding:22px 24px; border-left:1px solid var(--border);}
@media (max-width:800px){ .try-col{border-left:none; border-top:1px solid var(--border);} }
.try-name-input{
  width:100%; background:var(--bg-elev-2); border:1px solid var(--border); border-radius:6px;
  color:var(--text); padding:7px 10px; font-family:'Inter',sans-serif; font-size:0.85rem; box-sizing:border-box; margin-bottom:12px;
}
.try-name-input:focus{outline:none; border-color:var(--amber);}
.try-swatch-row{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:14px;}
.try-swatch{
  width:20px; height:20px; border-radius:50%; cursor:pointer; border:2px solid transparent; flex-shrink:0;
  transition:transform .1s, border-color .15s;
}
.try-swatch:hover{transform:scale(1.15);}
.try-swatch.selected{border-color:var(--text);}
.try-swatch-custom{
  width:20px; height:20px; border-radius:50%; border:1px dashed var(--text-mute); padding:0; cursor:pointer;
  background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red); flex-shrink:0;
}
.try-hex-wrap{
  display:inline-flex; align-items:center; background:var(--bg-elev-2); border:1px solid var(--border);
  border-radius:6px; padding:3px 6px; margin-left:1px; font-family:'JetBrains Mono',monospace; font-size:0.72rem; flex:1; min-width:56px;
}
.try-hex-wrap:focus-within{border-color:var(--amber);}
.try-hex-hash{color:var(--text-mute); margin-right:1px;}
.try-hex-input{
  width:48px; background:none; border:none; outline:none;
  color:var(--text-mute); font-family:'JetBrains Mono',monospace; font-size:0.72rem; padding:0;
}
.try-name-input::placeholder{color:var(--text-mute);}
.try-preview-box{
  border-radius:8px; padding:10px 12px;
}
.chat-sim-box{
  background:#18181B; border:1px solid #26262C; border-radius:8px; padding:12px 14px;
  transition:background .2s ease, border-color .2s ease;
}
.chat-sim-box.light-mode{
  background:#FFFFFF; border-color:#E3E5EA;
}
.chat-sim-box .chat-line, .chat-sim-box .chat-msg{color:#EFEFF1;}
.chat-sim-box.light-mode .chat-line, .chat-sim-box.light-mode .chat-msg{color:#0E0E10;}
.chat-label-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.chat-label-row .chat-label{margin-bottom:0;}
.chat-theme-toggle{
  background:var(--bg-elev-2); border:1px solid var(--border); border-radius:50%;
  width:26px; height:26px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--text-mute); font-size:0.85rem; flex-shrink:0;
  transition:color .15s, border-color .15s;
}
.chat-theme-toggle:hover{color:var(--amber); border-color:var(--amber);}

form.contact{display:flex; flex-direction:column; gap:14px; max-width:460px;}
form.contact label{font-size:0.82rem; color:var(--text-mute);}
form.contact input, form.contact textarea{
  background:var(--bg-elev-2); border:1px solid var(--border); border-radius:8px; padding:10px 12px;
  color:var(--text); font-family:'Inter',sans-serif; font-size:0.92rem; width:100%;
}
form.contact input:focus, form.contact textarea:focus{outline:2px solid var(--amber); outline-offset:1px;}
form.contact button{
  background:var(--amber); color:#0B0C10; border:none; border-radius:8px; padding:11px 18px;
  font-family:'Sora',sans-serif; font-weight:600; font-size:0.92rem; cursor:pointer; width:fit-content;
}
form.contact button:hover{opacity:0.9;}
.honeypot{position:absolute; left:-9999px;}

.notfound{padding:100px 0; text-align:center;}
.notfound .code{font-family:'JetBrains Mono',monospace; font-size:0.85rem; color:var(--text-mute); margin-bottom:10px;}
.notfound h1{font-size:2rem;}
.notfound p{color:var(--text-mute); margin-bottom:24px;}
.notfound a.btn{display:inline-block; background:var(--amber); color:#0B0C10; text-decoration:none; font-family:'Sora',sans-serif; font-weight:600; padding:10px 20px; border-radius:8px;}

footer{border-top:1px solid var(--border); padding:30px 0 60px; margin-top:20px;}
footer .foot-inner{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:12px;}
footer p{color:var(--text-mute); font-size:0.78rem; margin:0;}
footer p.foot-disclaimer{font-size:0.72rem; opacity:0.75; margin-top:4px; max-width:420px; line-height:1.5;}
footer nav{display:flex; gap:16px; font-size:0.78rem; padding-top:2px;}
footer nav a{text-decoration:none; color:var(--text-mute);}
footer nav a:hover{color:var(--amber);}

/* ---------- News ---------- */
.news-pill{--tone:var(--text-mute); display:inline-block; font:700 0.66rem 'JetBrains Mono',monospace; padding:3px 10px; border-radius:20px; white-space:nowrap; background:color-mix(in srgb, var(--tone) 16%, transparent); color:color-mix(in srgb, var(--tone) 70%, var(--text));}
.news-pill.teal{--tone:var(--teal);} .news-pill.red{--tone:var(--red);} .news-pill.violet{--tone:var(--violet);} .news-pill.amber{--tone:var(--amber);}
.news-pill.mute{background:var(--bg-elev-2); color:var(--text-mute);}
.news-meta{display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; font:500 0.74rem 'JetBrains Mono',monospace; color:var(--text-mute);}
.news-dot{width:3px; height:3px; border-radius:50%; background:var(--text-mute); opacity:0.7;}
.news-cover{--tone:var(--amber); position:relative; display:block; overflow:hidden; background:var(--bg-elev-2); aspect-ratio:1200/630;}
.news-cover.teal{--tone:var(--teal);} .news-cover.red{--tone:var(--red);} .news-cover.violet{--tone:var(--violet);} .news-cover.mute{--tone:var(--text-mute);}
.news-cover img{width:100%; height:100%; object-fit:cover; display:block;}
.news-cover.nofx{display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, color-mix(in srgb, var(--tone) 24%, var(--bg-elev-2)), var(--bg-elev-2) 72%);}
.news-cover.nofx i{font:700 2.3rem 'Sora',sans-serif; font-style:normal; letter-spacing:0.02em; color:color-mix(in srgb, var(--tone) 50%, var(--text-mute));}
.news-desc{color:var(--text-mute); font-size:0.94rem; line-height:1.6; margin:0;}
.news-more{font-size:0.84rem; font-weight:600; color:var(--amber); margin-top:2px;}
.news-index{padding-bottom:90px;}
.news-empty{border:1px dashed var(--border); border-radius:14px; padding:44px 24px; text-align:center; color:var(--text-mute); line-height:1.6;}



.news-card{display:flex; flex-direction:column; background:var(--bg-elev); border:1px solid var(--border); border-radius:14px; overflow:hidden; text-decoration:none; color:var(--text); transition:border-color .15s, transform .15s;}
.news-card:hover{border-color:var(--amber); transform:translateY(-2px);}
.news-card-body{padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px; flex:1;}
.news-card h3{font:600 1.02rem/1.25 'Sora',sans-serif; margin:0; overflow-wrap:break-word;}
.news-card .news-desc{font-size:0.86rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}

.news-page{padding-top:40px; padding-bottom:90px;}
.news-crumb{max-width:760px; margin:0 auto 22px;}
.news-article{max-width:760px; margin:0 auto;}
.news-article h1{font-size:clamp(1.75rem,4.4vw,2.5rem); margin:16px 0 14px; overflow-wrap:break-word;}
.news-lede{font-size:1.1rem; line-height:1.6; color:var(--text-mute); margin:0 0 26px;}
.news-hero-img{margin:0 0 34px; border-radius:14px; overflow:hidden; border:1px solid var(--border); aspect-ratio:1200/630; background:var(--bg-elev-2);}
.news-hero-img img{width:100%; height:100%; object-fit:cover; display:block;}
.news-body{font-size:1.02rem; line-height:1.75; color:color-mix(in srgb, var(--text) 90%, var(--text-mute)); overflow-wrap:break-word;}
.news-body > :first-child{margin-top:0;}
.news-body p{margin:0 0 1.15em;}
.news-body h2{font:600 1.35rem/1.25 'Sora',sans-serif; margin:2em 0 0.6em; color:var(--text);}
.news-body h3{font:600 1.1rem/1.3 'Sora',sans-serif; margin:1.7em 0 0.5em; color:var(--text);}
.news-body :is(p, li, blockquote, figcaption) a{color:color-mix(in srgb, var(--amber) 78%, var(--text)); text-decoration:underline; text-decoration-color:color-mix(in srgb, var(--amber) 45%, transparent); text-underline-offset:3px;}
.news-body :is(p, li, blockquote, figcaption) a:hover{text-decoration-color:currentColor;}
.news-body ul, .news-body ol{padding-left:1.35em; margin:0 0 1.15em;}
.news-body li{margin:0.4em 0; padding-left:0.2em;}
.news-body li::marker{color:var(--amber);}
.news-body blockquote{margin:1.5em 0; padding:14px 20px; border-left:3px solid var(--amber); background:var(--bg-elev); border-radius:0 10px 10px 0;}
.news-body blockquote p{margin:0; color:var(--text);}
.news-body code{font:500 0.88em 'JetBrains Mono',monospace; background:var(--bg-elev-2); padding:2px 6px; border-radius:6px;}
.news-body hr{border:0; border-top:1px dashed var(--border); margin:2.2em 0;}
.news-fig{margin:1.7em 0;}
.news-fig img{display:block; width:100%; height:auto; border-radius:12px; border:1px solid var(--border);}
.news-fig figcaption{font-size:0.82rem; line-height:1.5; color:var(--text-mute); margin-top:9px;}
.news-badge{max-width:300px; margin:1.5em 0;}
.news-badge .slot{height:auto;}
.news-related{margin-top:46px; padding-top:26px; border-top:1px dashed var(--border);}
.news-related h2{font:600 1.05rem 'Sora',sans-serif; margin:0 0 16px;}
.news-nav{max-width:760px; margin:50px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.news-nav a{background:var(--bg-elev); border:1px solid var(--border); border-radius:12px; padding:14px 16px; text-decoration:none; color:var(--text); display:flex; flex-direction:column; gap:6px; min-width:0; transition:border-color .15s;}
.news-nav a:hover{border-color:var(--amber);}
.news-nav small{font:500 0.68rem 'JetBrains Mono',monospace; color:var(--text-mute);}
.news-nav b{font:600 0.95rem/1.3 'Sora',sans-serif; overflow-wrap:break-word;}
.news-nav a.older{text-align:right;}
.news-back{max-width:760px; margin:26px auto 0; font-size:0.86rem;}
.news-back a{color:var(--text-mute); text-decoration:none;} .news-back a:hover{color:var(--amber);}
@media (max-width:640px){
  .news-nav{grid-template-columns:1fr;}
  .news-nav a.older{text-align:left;}
}

.news-index .hero{padding-bottom:20px;}
.news-chips{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px;}
.news-chip{font:500 0.84rem 'Inter',sans-serif; background:var(--bg-elev); color:var(--text-mute); border:1px solid var(--border); border-radius:20px; padding:6px 14px; cursor:pointer; transition:border-color .15s, color .15s;}
.news-chip span{font:500 0.7rem 'JetBrains Mono',monospace; margin-left:7px; opacity:0.75;}
.news-chip:hover{border-color:var(--amber); color:var(--text);}
.news-chip.on{background:var(--amber); border-color:var(--amber); color:#0B0C10;}
.news-none{color:var(--text-mute); text-align:center; padding:40px 0;}




/* cards, three across */
/* wide cards, one per row */
.news-wide{display:flex; flex-direction:column; gap:22px; margin-top:22px;}
.news-wide .news-card{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); border-radius:14px;}
.news-wide .news-card .news-cover{aspect-ratio:auto; min-height:280px; height:100%;}
.news-wide .news-card-body{padding:28px 30px; justify-content:center; gap:14px;}
.news-wide .news-card h3{font-size:1.5rem; line-height:1.2;}
.news-wide .news-desc{font-size:0.96rem; -webkit-line-clamp:4;}
.news-wide .news-meta{font-size:0.72rem;}
@media (max-width:760px){
  .news-wide .news-card{display:flex;}
  .news-wide .news-card .news-cover{aspect-ratio:1200/630; min-height:0; height:auto;}
  .news-wide .news-card-body{padding:18px 20px 20px;}
  .news-wide .news-card h3{font-size:1.25rem;}
}
@media (prefers-reduced-motion:reduce){ .news-card, .news-chip{transition:none;} .news-card:hover{transform:none;} }

/* ---------- Badge bar under the nav: "Expires today" (red) and "Just added" (teal) ---------- */
.xb-slot{position:relative; z-index:3;}
html.xb-on .xb-slot:empty{min-height:41px;}
.xb-grid{display:grid; grid-template-rows:1fr; transition:grid-template-rows .3s ease;}
.xb-slot.is-hidden .xb-grid, .xb-slot.is-entering .xb-grid{grid-template-rows:0fr;}
.xb-clip{overflow:hidden; min-height:0;}
.xb-slot.is-hidden .xb-clip{visibility:hidden; transition:visibility 0s .3s;}
.xb{--xb-soft:color-mix(in srgb, var(--text-mute) 55%, var(--text)); --xb-c:var(--red); background:var(--bg-elev); border-bottom:1px solid var(--border); outline:none;}
.xb-in{display:flex; align-items:center; gap:12px; padding-top:6px; padding-bottom:6px;}
.xb.k-new{--xb-c:var(--teal);}
.xb-tag{display:inline-flex; align-items:center; gap:6px; background:color-mix(in srgb, var(--xb-c) 16%, transparent); transition:background-color .35s ease, color .35s ease; padding:3px 9px; border-radius:6px; font:700 0.64rem 'JetBrains Mono',monospace; letter-spacing:0.05em; text-transform:uppercase; white-space:nowrap; flex-shrink:0; color:color-mix(in srgb, var(--xb-c) 72%, var(--text));}
.xb.k-new .xb-l-exp, .xb:not(.k-new) .xb-l-new{display:none;}
.xb-pulse{width:6px; height:6px; border-radius:50%; background:var(--xb-c); flex-shrink:0; animation:xbPulse 1.8s infinite; transition:background-color .35s ease;}
@keyframes xbPulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--xb-c) 65%, transparent);} 70%{box-shadow:0 0 0 8px transparent;} 100%{box-shadow:0 0 0 0 transparent;}}
.xb-spot{position:relative; flex:1; height:28px; min-width:0;}
.xb-slide{position:absolute; inset:0; display:flex; align-items:center; gap:8px; min-width:0; opacity:0; transform:translateY(7px); transition:opacity .35s ease, transform .35s ease; pointer-events:none;}
.xb-slide.on{opacity:1; transform:none; pointer-events:auto;}
.xb-nm{font-weight:700; font-size:0.86rem; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.xb-nm:hover{color:var(--amber);}
.xb-ob{color:var(--text-mute); font-size:0.76rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.xb-cta{font-size:0.76rem; white-space:nowrap; margin-left:auto; padding-left:6px; color:var(--xb-soft);}
.xb-ico{--s:22px; width:var(--s); height:var(--s); border-radius:6px; background:var(--bg-elev-2); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden;}
.xb-ico img{width:100%; height:100%; object-fit:cover; display:block;}
.xb-ico i{display:none; font:700 calc(var(--s) * 0.42) 'Sora',sans-serif; font-style:normal; color:var(--text-mute);}
.xb-ico.nofx{border:1px dashed var(--border);} .xb-ico.nofx i{display:block;}
.xb-cost{font:700 0.58rem 'JetBrains Mono',monospace; padding:1px 6px; border-radius:6px; text-transform:uppercase; letter-spacing:0.05em; white-space:nowrap; flex-shrink:0;}
.xb-cost.Free{background:color-mix(in srgb, var(--teal) 18%, transparent); color:var(--teal);}
.xb-cost.Paid{background:color-mix(in srgb, var(--amber) 18%, transparent); color:var(--amber);}
[data-theme="light"] .xb-cost.Free{color:color-mix(in srgb, var(--teal) 55%, var(--text));}
[data-theme="light"] .xb-cost.Paid{color:color-mix(in srgb, var(--amber) 55%, var(--text));}
.xb-ctrls{display:flex; align-items:center; gap:6px; flex-shrink:0;}
.xb-arw{width:24px; height:24px; border-radius:7px; border:1px solid var(--border); background:var(--bg-elev-2); color:var(--text); cursor:pointer; font:inherit; font-size:0.8rem; line-height:1; padding:0;}
.xb-arw:hover{border-color:var(--amber);}
.xb-dots{display:flex; gap:4px;}
.xb-dot{width:6px; height:6px; border-radius:50%; border:0; padding:0; background:color-mix(in srgb, var(--text-mute) 75%, var(--bg-elev)); cursor:pointer; transition:transform .2s ease;}
.xb-dot.n{background:color-mix(in srgb, var(--teal) 45%, var(--bg-elev));}
.xb-dot[aria-current="true"]{background:var(--red); transform:scale(1.3);}
.xb-dot.n[aria-current="true"]{background:var(--teal);}
.xb-x{background:none; border:0; color:var(--text-mute); font:inherit; font-size:1.1rem; line-height:1; cursor:pointer; padding:2px 6px; min-width:24px; min-height:24px; border-radius:6px; flex-shrink:0;}
.xb-x:hover{color:var(--text); background:color-mix(in srgb, var(--text) 8%, transparent);}
.xb-tab{position:absolute; top:100%; right:max(20px, calc((100% - 1080px) / 2 + 20px)); z-index:5; display:none; align-items:center; justify-content:center; padding:6px 20px 7px; background:var(--bg-elev); border:1px solid var(--border); border-top:0; border-radius:0 0 12px 12px; color:var(--text-mute); cursor:pointer; line-height:0;}
.xb-tab:hover{border-color:var(--amber); color:var(--amber);}
.xb-slot.is-hidden .xb-tab{display:inline-flex;}
@media (max-width:900px){ .xb-cta{display:none;} }
@media (max-width:640px){
  html.xb-on .xb-slot:empty{min-height:69px;}
  .xb-ob, .xb-dots{display:none;}
  .xb-in{flex-wrap:wrap; gap:4px 8px;}
  .xb-tag{order:1;} .xb-ctrls{order:2; margin-left:auto;} .xb-x{order:3;}
  .xb-single .xb-x{margin-left:auto;}
  .xb-spot{order:4; flex:1 0 100%;}
}
@media (max-width:360px){
  .xb-tag{padding:3px 7px; gap:5px;}
}
@media (prefers-reduced-motion:reduce){ .xb-pulse{animation:none;} .xb-grid, .xb-slide, .xb-dot, .xb-tag, .xb-pulse{transition:none;} .xb-slot.is-hidden .xb-clip{transition:none;} }
@media print{ .xb-slot{display:none;} }