/* Final layout rules: landscape display, tablet, and phone. */
@media(min-width:901px){
 :root{--pad:clamp(10px,1.8vmin,40px);--gap:clamp(8px,1.5vmin,26px)}
 .dashboard{height:100vh;height:100dvh;min-height:620px;grid-template-rows:clamp(70px,9vh,140px) minmax(0,1fr) clamp(165px,24vh,350px) clamp(30px,4vh,60px) clamp(16px,2vh,28px)}
 .panel{padding:clamp(12px,1.3vmin,28px)}
 .header{min-width:0;gap:clamp(8px,1vw,24px)}
 .header>*{min-width:0}.brand{flex-shrink:1}.brand h1{white-space:nowrap}
 .header-indices{flex-shrink:0}.daily-quote{flex:1 1 0}.datetime{flex-shrink:0}
 .weather.panel{padding:clamp(10px,1.3vmin,28px)}
 .markets{min-height:0;padding-top:10px;padding-bottom:10px;row-gap:6px}
 .market-group .section-head{margin-bottom:6px}
 .news-tabs{flex-wrap:wrap;gap:4px;margin:clamp(7px,1vh,16px) 0}
 .news-tabs button{padding:5px 8px}
 .news-footer{min-width:0}.footer{gap:8px;min-width:0}.footer #updatedAt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(min-width:901px) and (max-width:1250px){
 .dashboard{min-height:660px;grid-template-rows:108px minmax(0,1fr) 165px 30px 16px}
 .header{flex-wrap:wrap;gap:4px 8px}.header .brand h1{font-size:clamp(19px,2.2vw,27px)}
 .daily-quote{flex:1 0 100%;order:5;max-height:28px;overflow:hidden}
 .daily-quote p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .header-indices{width:auto}.stock-index{font-size:9px}.stock-index strong{font-size:12px}
 .header .datetime{gap:10px}#clock{font-size:44px}#weekday{font-size:18px}#date{font-size:13px}
 .traffic-score strong{font-size:32px}.traffic-score span{font-size:8px}
 .weather .weather-metrics>div{font-size:8px}.weather .weather-metrics strong{font-size:10px}
 .rate-code{margin-bottom:5px}.rate-change{margin-top:4px}.equities{padding-top:5px}
}
@media(min-width:1251px) and (max-width:1500px){
 .header .brand h1{font-size:24px}.header .datetime{gap:14px}#clock{font-size:52px}#weekday{font-size:23px}#date{font-size:16px}
 .daily-quote{padding-left:10px;padding-right:0;margin:0}.daily-quote p{font-size:12px}.quote-label,.daily-quote a{font-size:8px}
 .traffic-score strong{font-size:36px}.header-indices{width:auto}.stock-index{font-size:10px}.stock-index strong{font-size:13px}
}
@media(max-width:900px){
 .dashboard{height:auto;min-height:100vh;min-height:100dvh;padding:16px;gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 410px auto minmax(760px,auto) 40px auto;grid-template-areas:"header header" "weather traffic" "markets markets" "news news" "ticker ticker" "footer footer"}
 .header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding-bottom:14px}
 .header>*{min-width:0;order:0;margin:0}.brand{grid-column:1}.datetime{grid-column:2;grid-row:1 / span 2;flex-direction:column-reverse;gap:8px;align-items:flex-end}
 .brand h1{font-size:25px;white-space:normal}.traffic-score{grid-column:1;grid-row:2;margin:0}
 .header-indices{grid-column:1/-1;width:auto;display:flex;gap:10px;flex-wrap:wrap}.header-indices #stockIndices{gap:16px;flex:1}.stock-index{min-width:0}
 .daily-quote{grid-column:1/-1;display:block;max-width:none}.daily-quote p{white-space:normal;margin:5px 0;font-size:15px}
 #clock{font-size:48px}#weekday{font-size:19px}#date{font-size:13px}.world-clocks{flex-wrap:wrap;max-width:270px;gap:6px 10px;font-size:10px}
 .markets{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);min-height:0;grid-template-rows:auto auto;padding:18px;gap:18px}
 .crypto{padding-left:16px;border-left:1px solid var(--line);border-top:0;padding-top:0}.equities{grid-column:1/-1;min-width:0}
 .news-tabs{flex-wrap:wrap}.news-hero{min-height:300px}.news-grid{min-height:220px;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px}
 .news-card,.news-card:first-child{min-height:0}.news .news-title{font-size:15px}.news-footer{margin-top:10px}
 .news.sports-active .news-hero{min-height:200px}.news.sports-active .football-panel{flex:0 0 auto}.news.sports-active.rpl-visible .rpl-table{font-size:15px}
 .footer{flex-wrap:wrap;gap:8px}.footer #updatedAt{margin-left:0}.footer button{max-width:100%}
 .weather .weather-source{font-size:9px}.weather .weather-hour time{font-size:11px}.weather .weather-hour strong{font-size:16px}.weather .weather-tomorrow{font-size:13px}.weather .weather-tomorrow strong{font-size:16px}
}
@media(max-width:560px){
 .dashboard{padding:12px;gap:12px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 410px 340px auto minmax(820px,auto) 38px auto;grid-template-areas:"header" "weather" "traffic" "markets" "news" "ticker" "footer"}
 .header{gap:12px 8px}.brand h1{font-size:20px}.datetime{max-width:185px}.date-wrap{max-width:none}#clock{font-size:36px}#weekday{font-size:16px}#date{font-size:11px}.world-clocks{max-width:185px;font-size:9px;gap:5px 8px}
 .header-indices{display:block}.header-indices #stockIndices{display:flex;justify-content:space-between;gap:10px}.index-credit{display:block;margin-top:6px}
 .markets{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;padding:16px;gap:18px}.crypto{padding:14px 0 0;border-left:0;border-top:1px solid var(--line)}
 .equities{grid-template-columns:minmax(0,1fr);gap:14px}.stock-card+ .stock-card{border-left:0;padding-left:0}.stock-name{font-size:15px}.stock-main strong{font-size:20px}.stock-meta{font-size:9px}.stock-heading{font-size:10px}
 .news .hero-title{font-size:21px}.news .hero-summary{font-size:14px}.news .news-title{font-size:14px}.news-tabs button{font-size:10px;padding:6px}.news-footer{font-size:8px}
}