/* TREND ROULETTE / WEB PORTAL EDITION — v0.12.0
   Authentic turn-of-the-millennium web grammar, modern touch and accessibility.
   Source CSS has no external fonts, GIF dependencies or tracking pixels. */
:root{
 color-scheme:light;
 --paper:#e1e9f4;--surface:#fff;--ink:#162947;--sub:#506684;
 --chrome:#dce7f8;--line:#93a8c8;--line-soft:#c4d2e6;
 --navy:#16417a;--blue:#2059a7;--blue-light:#e8f1ff;
 --yellow:#ffda6a;--orange:#d35424;--green:#246d47;
}
*{box-sizing:border-box}
html{background:#dfe8f5;scroll-padding-top:20px;scroll-behavior:smooth}
body{margin:0;color:var(--ink);background-color:var(--paper)!important;background-image:repeating-linear-gradient(90deg,transparent 0,transparent 31px,#c8d5e722 32px),linear-gradient(180deg,#e5eef9 0,#dce6f4 460px,#e4eaf4 100%)!important;
 font:13px/1.45 Tahoma,Verdana,Arial,sans-serif}
body:before{display:none!important}
button,input,select{font-family:Tahoma,Verdana,Arial,sans-serif}
a{color:#124c99}
a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid #c76123;outline-offset:3px}
button{touch-action:manipulation}
.topbar{position:relative!important;top:auto!important;background:linear-gradient(#fff 0%,#f5f8fe 24%,#d2e1f6 100%)!important;box-shadow:inset 0 1px #fff,0 2px 0 #adc2df!important;border-top:4px solid #2056a0;border-bottom:1px solid #7e9abe;height:79px;max-width:none!important;padding:0 max(18px,calc((100vw - 1190px)/2));backdrop-filter:none!important;z-index:10}
.brand{display:flex;align-items:center;gap:11px;color:#173d72;font:900 22px/1.1 'Trebuchet MS',Verdana,Arial,sans-serif!important;letter-spacing:-.035em!important;text-decoration:none;white-space:nowrap}
.brand-symbol{display:grid;place-items:center;width:40px;height:40px;border:1px solid #123e79;border-radius:7px;background:linear-gradient(160deg,#387ac6,#15477e);color:#fff1ae;transform:none!important;text-shadow:0 1px 0 #0c3665;box-shadow:inset 1px 1px #8db6ed,inset -1px -1px #0c3062,1px 1px 0 white;font-size:29px}
.brand-wordmark{display:flex;flex-direction:column;gap:4px}
.brand-subtitle{font:700 9px/1.1 Tahoma,Verdana,sans-serif;letter-spacing:.16em;color:#5379a4}
.toplinks{display:flex;gap:7px;align-items:center}
.navbtn,.langbtn{min-height:32px;border:1px solid #7d9fc9;border-radius:4px!important;padding:7px 13px;background:linear-gradient(#fff,#e2ebfa);box-shadow:inset 1px 1px #fff,0 1px 0 #fff;color:#1b4a83;font-size:12px;font-weight:800}
.navbtn:hover,.langbtn:hover{background:linear-gradient(#fff8dc,#f8e4a8)}
.langbtn[aria-pressed="true"]{color:#1c3764!important;background:linear-gradient(#ffe99b,#f6cf5b)!important;border-color:#ac8740!important;box-shadow:inset 1px 1px #fff8d5!important}
.portal-status{background:#143e75;color:#e4edf9;border-bottom:1px solid #0a2954}
.portal-status-inner{max-width:1190px;margin:auto;padding:7px 8px;display:flex;align-items:center;gap:9px;font:700 10px/1.15 Tahoma,Verdana,sans-serif;letter-spacing:.045em;min-height:30px}
.portal-led{width:8px;height:8px;background:#98e2aa;border:1px solid #c2ffd3;border-radius:50%;box-shadow:none;flex:none}
.portal-status-label{color:#f5f4d7}
.portal-status-count{padding-left:10px;border-left:1px solid #5175a1;color:#eaffc1;font-variant-numeric:tabular-nums}
.portal-status-right{margin-left:auto;color:#a4c2e7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quickbar{max-width:1190px;padding:17px 7px 12px;margin:auto}
.quickbar-inner{display:flex;align-items:center;gap:12px}
.quickbar-title{font:800 11px Tahoma,Verdana,sans-serif;color:#48638a;text-transform:uppercase;letter-spacing:.025em;white-space:nowrap}
.quick-categories{gap:5px;overflow-x:auto;scrollbar-width:thin}
.quick-chip{border:1px solid #97a9c7;border-radius:4px!important;background:linear-gradient(#fff,#e4eaf3);color:#284976;font:750 11px Tahoma,Verdana,sans-serif;min-height:32px;padding:8px 12px;box-shadow:inset 1px 1px white;white-space:nowrap;transition:none}
.quick-chip:hover{background:linear-gradient(#fff9dd,#f2e3b0)}
.quick-chip.active{background:linear-gradient(#fff2b5,#f7d465)!important;color:#293d59!important;border-color:#aa9253!important;box-shadow:inset 1px 1px #fff8cf!important}
.hero{max-width:1190px;padding:0 7px 12px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.73fr) minmax(300px,.94fr);gap:14px;align-items:start}
.stage{--tier:#df8e31;position:relative;isolation:isolate;height:486px;min-height:0;border:2px solid #6987b5!important;border-radius:7px!important;background:#fffdf6!important;box-shadow:inset 1px 1px #fff,0 2px 0 #fff,0 4px 10px #46658b21!important;padding:0!important;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 170px;grid-template-rows:42px minmax(0,1fr) 90px;gap:0}
.stage:before,.stage:after,.energy,.orb,.ring,.orb-core{display:none!important}
.stage-top{position:relative;left:auto;right:auto;top:auto;grid-row:1;grid-column:1/-1;background:linear-gradient(#3477bd 0%,#1d5599 52%,#12417d 100%);padding:0 15px;border-bottom:1px solid #143b76;display:flex;justify-content:space-between;align-items:center;gap:10px}
.mode-label{color:#f9fcff;font:850 11px Tahoma,Verdana,sans-serif;letter-spacing:.045em}
.live-dot{width:7px;height:7px;background:#f7e396;box-shadow:none;border:1px solid #fff4ba;margin-right:8px;vertical-align:middle}
.counter{border:1px solid #7198c7;border-radius:3px!important;background:#143b74;padding:5px 10px;color:#e5f3ff;font:750 11px Tahoma,Verdana,sans-serif;letter-spacing:0;white-space:nowrap}
.story{position:relative;left:auto;right:auto;bottom:auto;grid-row:2;grid-column:1;align-self:center;z-index:3;padding:24px 16px 22px 29px;min-width:0}
.countryline{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 16px}
.chip{background:#e7eefb;border:1px solid #b3c3dc;border-radius:2px!important;color:#305180;font:750 11px Tahoma,Verdana,sans-serif;padding:5px 8px}
.eyebrow{color:#7b583d;font:800 10px Tahoma,Verdana,sans-serif;letter-spacing:.08em}
.topic-name{font:900 clamp(32px,3.7vw,49px)/1.06 'Trebuchet MS',Verdana,Arial,sans-serif!important;letter-spacing:-.045em;color:#19375a;text-shadow:none!important;margin:12px 0 13px;max-width:100%;overflow-wrap:anywhere}
.topic-name a{color:#19375a!important;text-decoration:none;border:0!important}
.topic-name a:hover{color:#b74d21!important;text-decoration:underline}
.original-title{font:11px/1.4 Tahoma,Verdana,sans-serif;color:#687991;margin:5px 0}
.record-link{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(#fff5ce,#f4d46f);color:#4e3b1b!important;border:1px solid #b49a53;border-radius:4px!important;font:800 12px Tahoma,Verdana,sans-serif;padding:10px 14px;margin:11px 0 0;text-decoration:none;box-shadow:inset 1px 1px white,0 1px 0 #d4c7a1;transition:none}
.record-link:hover{background:linear-gradient(#ffedb0,#edc453);transform:none}
.topic-sub{color:#6b7690;font:11px/1.55 Tahoma,Verdana,sans-serif;margin:16px 0 0;max-width:550px}
.story .hint{display:none}
.tier-visual{grid-row:2;grid-column:2;position:relative;top:auto;left:auto;right:auto;align-self:stretch;display:flex;flex-direction:column;align-items:stretch;justify-content:center;text-align:center;gap:9px;z-index:2;background:#f0f4fa;border-left:1px dashed #afc1d9;padding:20px 13px}
.meter-heading{font:900 10px Tahoma,Verdana,sans-serif;letter-spacing:.07em;color:#49638b}
.level-label{font:800 10px Tahoma,Verdana,sans-serif;color:#865222;letter-spacing:.025em;border:0;background:transparent;padding:0}
.traffic{font:900 clamp(36px,4.4vw,63px)/1.05 'Trebuchet MS',Verdana,Arial,sans-serif;color:#c35524!important;text-shadow:none!important;letter-spacing:-.055em;white-space:nowrap}
.meter-bars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;height:18px;padding:3px;background:#dbe4f2;border:1px inset #b4c1d4;border-radius:1px}
.meter-bars i{display:block;background:#c6d3e1;border:1px solid #b0bece}
.stage[data-tier="1"] .meter-bars i:nth-child(-n+1),.stage[data-tier="2"] .meter-bars i:nth-child(-n+2),.stage[data-tier="3"] .meter-bars i:nth-child(-n+3),.stage[data-tier="4"] .meter-bars i:nth-child(-n+4),.stage[data-tier="5"] .meter-bars i:nth-child(-n+5){background:linear-gradient(#ffdb7b,#eeab42);border-color:#d59b41}
.stage[data-tier="4"] .traffic,.stage[data-tier="5"] .traffic{color:#b73924!important}
.stage[data-tier="4"] .meter-bars i:nth-child(-n+4),.stage[data-tier="5"] .meter-bars i:nth-child(-n+5){background:linear-gradient(#ffbb71,#de7143);border-color:#bd6338}
.traffic-desc{font:10px/1.45 Tahoma,Verdana,sans-serif;color:#748398;max-width:none}
.stage-actions{grid-column:1/-1;grid-row:3;border-top:1px solid #b3c4dc;background:linear-gradient(#ebf0f9,#d8e3f4);display:flex;align-items:center;justify-content:space-between;padding:14px 18px;gap:11px}
.stage-actions .actions{display:grid;grid-template-columns:73px 165px 82px 95px;width:auto;gap:7px;margin:0}
.stage-actions .railbtn{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:6px;min-height:47px;padding:7px 9px;background:linear-gradient(180deg,#fff,#e5edf9);border:1px solid #8da3c4;color:#29466c;border-radius:4px!important;box-shadow:inset 1px 1px white,0 1px 0 white}
.stage-actions .railbtn span:first-child{font-size:17px}
.stage-actions .railbtn small{font:800 11px Tahoma,Verdana,sans-serif;color:#31547e}
.stage-actions .railbtn:hover{background:linear-gradient(#fff8d9,#f3e0b0)}
.stage-actions .main-next{background:linear-gradient(#ffdf81,#f4b94d);border-color:#ae8140;color:#463319!important;box-shadow:inset 1px 1px #ffecaf,0 1px 0 white}
.stage-actions .main-next small{color:#463319!important;font-size:12px}
.stage-actions .main-next:hover{background:linear-gradient(#ffe9a6,#f5c466)}
.stage-actions .railbtn[aria-pressed="true"]{background:#ffe6ae;border-color:#bc9652;color:#71451c}
.stage-keyhint{font:10px/1.55 Tahoma,Verdana,sans-serif;color:#586e8f;max-width:148px;text-align:right}
.rail{margin:0;display:flex;flex-direction:column;gap:12px}
.rail-panel{position:relative;background:#fdfefe;border:1px solid #8ba5ca;border-radius:5px!important;box-shadow:inset 1px 1px white,0 2px 0 white!important;padding:13px 15px 16px;color:#1b3253}
.rail-head{display:flex;align-items:center;justify-content:space-between;gap:9px}
.discovery-board{background:#fff;border:1px solid #708eb8}
.discovery-board>.rail-head{margin:-13px -15px 12px;padding:11px 14px;background:linear-gradient(#d9e7fa,#b5cdec);border-bottom:1px solid #8da9ca}
.rail-title{font:850 10px Tahoma,Verdana,sans-serif;letter-spacing:.07em;color:#506f9e}
.board-title{font:900 17px/1.2 'Trebuchet MS',Verdana,Arial,sans-serif;letter-spacing:-.025em;color:#173e77;margin:5px 0 0}
.board-count{font:800 10px Tahoma,Verdana,sans-serif;letter-spacing:0;border:1px solid #8caaca;background:#f5f9ff;border-radius:3px;color:#3b5d8d;padding:5px 8px;white-space:nowrap}
.board-modes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;margin:0 0 9px;padding:0;border-bottom:1px solid #bfcde0}
.mode-button{min-width:0;border:1px solid #b3c4d9;border-bottom:0;border-radius:4px 4px 0 0!important;background:linear-gradient(#fff,#dce7f5);color:#426188;font:800 10px Tahoma,Verdana,sans-serif;min-height:33px;padding:5px 2px;white-space:nowrap}
.mode-button.active{border-color:#7e9ac2;background:#fff9e5;color:#80501d;box-shadow:inset 0 2px #f5bc51}
.mode-button:hover{background:#fff2bf}
.suggestions{display:grid;gap:0}
.suggestion{width:100%;min-height:57px;display:flex;align-items:center;gap:11px;text-align:left;border:0;border-bottom:1px dotted #afc0d8;border-radius:0!important;background:#fff;color:#243e65;padding:8px 6px;transition:none}
.suggestion:nth-child(even){background:#f2f6fc}
.suggestion:hover,.suggestion:focus-visible{background:#fff2c9!important;transform:none}
.suggest-copy{display:flex;flex-direction:column;flex:1;min-width:0;gap:5px}
.suggest-name{font:800 12px/1.35 Tahoma,Verdana,sans-serif;color:#214f8b}
.suggest-meta{font:10px Tahoma,Verdana,sans-serif;color:#7689a4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.suggest-traffic{font:900 11px Tahoma,Verdana,sans-serif;color:#ac5225;white-space:nowrap;background:#fff0c8;border:1px solid #e8cc8a;padding:4px 5px}
.deck-note{font:10px/1.5 Tahoma,Verdana,sans-serif;color:#6a7c92;margin:11px 0 0}
.rail>.rail-panel:nth-child(n+2){padding:14px 15px}
.rail>.rail-panel:nth-child(n+2) .rail-head{border-bottom:1px dotted #bacbdf;padding-bottom:8px}
.rail-big{font:900 15px/1.25 'Trebuchet MS',Verdana,Arial,sans-serif;color:#234b80;margin:12px 0 5px}
.rail-muted{font:11px/1.6 Tahoma,Verdana,sans-serif;color:#6b7e9a}
.links{border-top:1px dotted #afc2dc;display:flex;flex-wrap:wrap;gap:8px;padding-top:11px;margin-top:12px}
.links a,.details a{color:#1d589d;font:800 11px Tahoma,Verdana,sans-serif;text-decoration:underline;text-underline-offset:2px}
.details{border-color:#a6bddc;font-size:12px}
.details h3{color:#214c88;font:850 14px 'Trebuchet MS',Verdana,sans-serif}
.rail-panel .navbtn{background:linear-gradient(#fff,#e2ecfa);border:1px solid #96accb;border-radius:4px;color:#204d83;font:800 11px Tahoma,Verdana,sans-serif}
.rail-panel .navbtn:hover{background:#fff2d3}
.filter-grid{grid-template-columns:1fr 1fr;gap:11px}
.filter-grid label{font:800 10px Tahoma,Verdana,sans-serif;color:#5b7090;letter-spacing:.02em}
.filter-grid select{background:#fff;border:1px solid #9bb1cf;border-radius:3px;color:#173d77;padding:9px 6px;margin-top:7px;width:100%}
.filter-grid label.check{font-size:11px;letter-spacing:0;font-weight:700;color:#4b6384}
#seo-live{max-width:1190px;margin:13px auto;padding:18px 20px;background:#fff;border:1px solid #95aed0;border-radius:5px;color:#263d5b;box-shadow:inset 1px 1px white,0 2px 0 white}
#seo-live h2{font:900 19px 'Trebuchet MS',Verdana,sans-serif;color:#214a82;margin:3px 0 11px}
#seo-live ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(218px,1fr));gap:5px}
#seo-live li{border:1px dotted #c0d1e3;border-radius:0;background:#f5f8fe;padding:10px 12px}
#seo-live a{color:#1a589f;text-decoration:underline;font:800 12px Tahoma,Verdana,sans-serif}
#seo-live small{color:#6b81a1;font:10px/1.4 Tahoma,Verdana,sans-serif}
.footnote{max-width:1190px;margin:0 auto;padding:17px 7px 31px;color:#526c90;border-top:1px solid #b0c3dd;font:10px Tahoma,Verdana,sans-serif}
.footnote a{color:#1a528e}
.mobile-picks-jump{display:none}
.toast{background:#173f76;color:#fdf8e9;border:1px solid #7da5d6;border-radius:4px;padding:12px 18px;font:800 12px Tahoma,Verdana,sans-serif}
.fly-in .topic-name,.fly-in .eyebrow,.fly-in .level-label,.fly-in .traffic{animation:portal-change .22s ease-out both!important}
@keyframes portal-change{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:1250px){.quickbar,.hero,.footnote,#seo-live{margin-left:16px;margin-right:16px}.portal-status-inner{padding-left:17px;padding-right:17px}}
@media(max-width:1020px){.hero{grid-template-columns:minmax(0,1.35fr) minmax(285px,.9fr);gap:10px}.stage{grid-template-columns:minmax(0,1fr) 133px}.story{padding-left:20px}.topic-name{font-size:clamp(29px,3.8vw,42px)}.tier-visual{padding:12px 9px}.traffic{font-size:42px}.stage-actions .actions{grid-template-columns:55px 133px 65px 70px;gap:4px}.stage-keyhint{display:none}}
@media(max-width:820px){.topbar{height:69px;padding:0 14px}.brand{font-size:18px!important}.brand-symbol{width:32px;height:32px;font-size:22px}.brand-subtitle{font-size:8px}.portal-status-right{display:none}.quickbar{margin:0 10px;padding:12px 0 10px}.quickbar-inner{display:block}.quickbar-title{display:block;margin-bottom:7px}.hero{display:block;margin:0 10px;padding:0}.stage{height:auto;min-height:444px;grid-template-columns:minmax(0,1fr) 148px;grid-template-rows:40px minmax(298px,auto) 79px}.topic-name{font-size:clamp(32px,5.4vw,47px)}.rail{margin:12px 0}.mobile-picks-jump{display:flex;align-items:center;justify-content:center;background:linear-gradient(#fff9dd,#ead5a3);border:1px solid #bea577;color:#3f4a61;text-decoration:none;font:800 11px Tahoma,Verdana,sans-serif;padding:10px 12px;margin:9px 0;border-radius:4px}.suggestions{display:flex;overflow-x:auto;gap:6px;scroll-snap-type:x proximity;padding-bottom:7px}.suggestion{flex:0 0 min(68vw,250px);height:86px;align-items:flex-start;scroll-snap-align:start;border:1px solid #b2c4df;padding:10px}.stage,.discovery-board{scroll-margin-top:12px}}
@media(max-width:540px){.topbar{height:62px}.brand{font-size:14px!important;gap:7px}.brand-symbol{width:29px;height:29px}.brand-subtitle{font-size:7px;letter-spacing:.1em}.navbtn,.langbtn{font-size:10px;padding:7px 9px;min-height:33px}.toplinks{gap:4px}.portal-status-inner{font-size:9px;gap:7px;min-height:27px;padding:6px 10px}.portal-status-count{font-size:9px;padding-left:7px}.quickbar{margin:0 8px;padding:10px 0 8px}.quick-chip{font-size:10px;padding:7px 10px;min-height:30px}.hero{margin:0 7px}.stage{grid-template-columns:1fr;grid-template-rows:38px 101px minmax(180px,auto) 77px;height:auto;min-height:0;border-radius:5px!important}.stage-top{grid-column:1;grid-row:1;padding:0 11px}.counter,.mode-label{font-size:9px}.tier-visual{grid-row:2;grid-column:1;border:0;border-bottom:1px dashed #b0c4da;display:grid;grid-template-columns:auto auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;justify-content:start;text-align:left;gap:3px 12px;padding:10px 14px;background:#f2f5fc}.meter-heading{grid-column:1/-1;font-size:9px}.level-label{grid-column:2;grid-row:2;font-size:9px}.traffic{grid-column:1;grid-row:2;font-size:53px}.meter-bars{grid-column:3;grid-row:2;min-width:65px;width:100%;max-width:105px;margin-left:auto}.traffic-desc{display:none}.story{grid-column:1;grid-row:3;padding:16px 15px;align-self:center}.countryline{margin-bottom:9px}.chip{font-size:10px;padding:4px 7px}.eyebrow{font-size:9px}.topic-name{font-size:clamp(30px,8.2vw,42px);line-height:1.05;margin:8px 0 11px}.record-link{margin-top:9px;padding:9px 11px;font-size:11px}.topic-sub{font-size:10px;margin:12px 0 0}.stage-actions{grid-row:4;grid-column:1;padding:9px 9px}.stage-actions .actions{display:grid;width:100%;grid-template-columns:.8fr 1.45fr .8fr .85fr;gap:4px}.stage-actions .railbtn{min-height:52px;padding:4px 2px;flex-direction:column;gap:1px}.stage-actions .railbtn span:first-child{font-size:17px}.stage-actions .railbtn small{font-size:9px}.stage-keyhint{display:none}.rail-panel{padding:13px}.board-modes{grid-template-columns:repeat(4,minmax(0,1fr))}.mode-button{font-size:9px}.board-title{font-size:17px}.footnote,#seo-live{margin-left:7px;margin-right:7px;padding-left:12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:0ms!important;scroll-behavior:auto!important}}

/* RSS Hub v0.13: source disclosure, genuine unranked feed signals. */
.source-disclosure{max-width:1190px;margin:12px auto 0;padding:17px 20px;background:#f8fbff;border:1px solid #93b0d1;border-radius:5px;color:#445e81}
.source-disclosure h2{margin:0 0 9px;font:900 18px/1.25 'Trebuchet MS',Verdana,sans-serif;color:#1c5289}
.source-disclosure p{font:12px/1.65 Tahoma,Verdana,sans-serif;margin:5px 0}
.source-disclosure .source-links{padding-top:9px;border-top:1px dotted #abc2dd;font-weight:800}
.source-disclosure a{color:#18599e;text-decoration:underline}
.stage[data-tier="0"] .meter-bars i{background:#c8d2e0!important;border-color:#b8c8d8!important}
.stage[data-tier="0"] .traffic{font-size:clamp(37px,4.4vw,62px);color:#2c6091!important}
.stage[data-tier="0"] .tier-visual{background:#ecf5fd}
.filter-grid select#platform{font-size:11px}
.suggest-traffic{font-variant-numeric:tabular-nums}
@media(max-width:1250px){.source-disclosure{margin-left:16px;margin-right:16px}}
@media(max-width:540px){.source-disclosure{margin:10px 7px 0;padding:14px 12px}.source-disclosure h2{font-size:16px}}
