#market-view{font:16px/1.3 "Arial Narrow","Bahnschrift",Arial,sans-serif;color:var(--text)}
:where(#market-view h1,#market-view h2,#market-view h3,#market-view p){margin:0}
:where(#market-view button){font:inherit;color:inherit;cursor:pointer}
:where(#market-view button):focus-visible{outline:2px solid #a7dfff;outline-offset:3px}
:where(#market-view img){object-fit:contain}
.market-browser,.analysis{min-width:0}
.market-browser{font-family:'Roboto Condensed',Arial,sans-serif}
/* All six paired views share one horizontal row. Auto margins centre the cards when they
   fit and start from the first card when they overflow: `justify-content: safe center`
   does the same only in Chromium 115+, and older engines push cards off the left edge. */
.position-card:first-child{margin-left:auto}.position-card:last-child{margin-right:auto}
/* Engines without scrollbar-color (Chromium before 121, Safari) show no scroll hint
   at all; these draw the same thin bar. Newer Chromium ignores them in favour of
   scrollbar-color. */
.position-cards::-webkit-scrollbar{height:6px}
.position-cards::-webkit-scrollbar-track{background:transparent}
.position-cards::-webkit-scrollbar-thumb{background:#416476;border-radius:3px}
.market-browser{padding:12px 14px 6px;border-top:2px solid #81c6e7;background:linear-gradient(160deg,#12334288,transparent)}
.position-cards{display:flex;justify-content:flex-start;min-width:0;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#416476 transparent;scroll-snap-type:x proximity;gap:14px;padding:2px 2px 10px}
.position-card:focus-visible{outline-offset:-4px}
.position-card{display:flex;flex-direction:column;flex:0 0 270px;min-width:0;height:230px;border:1px solid #2d4b5e;border-radius:5px;overflow:hidden;padding:0;background:linear-gradient(135deg,#102733,#081b25);text-align:left;scroll-snap-align:start}
.position-card[aria-pressed=true]{background:linear-gradient(120deg,#173847,#0d2531);border-color:#8bd3f3;box-shadow:inset 0 -2px #82c7e8}
.position-card:hover{border-color:#8db8cf}
.position-photo{width:100%;height:auto;aspect-ratio:67/16;object-fit:cover;object-position:50% 45%;flex:none;-webkit-mask-image:linear-gradient(#000 65%,#0005);mask-image:linear-gradient(#000 65%,#0005)}
.position-copy{display:flex;flex:1;min-height:0;min-width:0;flex-direction:column;padding:10px 15px 12px;width:100%}
.position-name{position:relative;font-size:20px;font-weight:600;line-height:1.13;color:#e2edf5;text-wrap:balance}
.position-card[aria-pressed=true] .position-name::after{content:"";position:absolute;left:0;bottom:-8px;width:40px;height:3px;border-radius:2px;background:#3297f0;box-shadow:0 0 8px #3297f030}
.position-meta{font-size:13px;line-height:1.3;color:#a5bfce;text-align:center;margin-top:auto;padding-top:6px}
.pair-card-signals{display:grid;gap:3px;margin-top:4px;padding-top:4px;border-top:1px solid #3e5c6c80}
.pair-card-columns,.pair-card-row{display:grid;grid-template-columns:minmax(0,1.3fr) 1fr 1fr;align-items:center;gap:8px}
.pair-card-columns{color:#8da8b9;font-size:12px;line-height:1.1;text-align:center}
.pair-card-label{color:#aac1d2;font-size:13px}
.pair-card-signal{display:flex;justify-content:center;color:#6d8797;font-size:16px;line-height:22px}
.pair-card-signal img{width:22px;height:22px}
.analysis{position:relative;margin-top:16px;margin-bottom:24px}
.assessment-option{margin-top:8px}
.assessment-option strong{font-weight:500}
.assessment-option small{display:block;font-size:12px;margin-top:3px}
.analysis-pairs{display:grid;grid-template-columns:minmax(0,1fr);gap:26px}
.instrument-pair{min-width:0}
.pair-title{display:flex;align-items:center;gap:14px;min-height:44px;margin-bottom:10px;font:650 28px/1.15 'Roboto Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.25px}
.pair-title img{width:38px;height:34px;flex:none}
.pair-title span{background:linear-gradient(#f4f8fc 20%,#bbcbd7 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.instrument-pair:first-child .pair-title{padding-right:180px}
.is-paired .analysis-instruments{gap:16px 14px}
.analysis-actions{position:absolute;right:0;top:0;display:flex;align-items:center;gap:24px;min-height:44px}
@media(min-width:1440px){
 .is-paired .analysis-pairs{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 22px}
 .is-paired .instrument-pair:first-child .pair-title{padding-right:0}
 .is-paired .instrument-pair:last-child .pair-title{padding-right:180px}
}
.analysis-report{display:inline-flex;align-items:center;gap:8px;padding:10px 0;color:#a0bdcf;text-decoration:none;font:16px 'Roboto Condensed',Arial,sans-serif}
.analysis-report{color:#c9e4f5}
.analysis-report:hover{color:white}
.analysis-report:focus-visible{outline:2px solid #a7dfff;outline-offset:4px}
@media(max-width:960px){
 .market-main{padding:12px 18px 0}
 .analysis-instruments{gap:16px 14px!important}
}
@media(max-width:700px){
 .market-main{padding:10px 12px 0}
 .position-search{width:100%;max-width:none}
 .market-browser{padding:10px 2px 4px}
 .position-cards{gap:12px}
 .analysis{margin-top:14px}
 .pair-title{gap:9px;font-size:23px;margin-bottom:8px}
 .pair-title img{width:28px;height:30px}
 .instrument-pair:first-child .pair-title{padding-right:124px}
 .analysis-actions{gap:14px}
 .analysis-report{font-size:14px;padding-block:4px}
 .analysis-instruments{grid-template-columns:1fr!important;gap:20px!important}
 .site-footer{padding:10px!important;gap:10px!important;align-items:flex-start!important}
 .site-footer img{width:75px!important;height:26px!important}
 .site-footer div{padding-left:10px!important}
 .site-footer p,.site-footer small{font-size:10px!important}
}
@media(max-width:450px){
 .pair-title{font-size:clamp(16px,4.8vw,22px)}
 .pair-title img{display:none}
 .instrument-pair:first-child .pair-title{padding-right:114px}
 .analysis-actions{gap:12px}
 .analysis-report{font-size:13px}
}
@media(prefers-reduced-motion:no-preference){.position-card{transition:border-color .15s,background-color .15s,color .15s}}



.instrument{min-width:0}.gp-brand img{object-fit:contain}.gp-panel{border-radius:6px}.gp-heading{border-radius:5px 5px 0 0}


.site-footer{display:flex;align-items:center;gap:18px;margin-top:7px;padding:7px 24px;background:#071720;border-top:1px solid #25465a;font-size:13px;min-height:48px}.site-footer img{width:132px;height:36px}.site-footer div{border-left:1px solid #6a94ae;padding-left:18px}.site-footer p{color:#bdcfdd}.site-footer small{font-size:12px}


.analysis-instruments { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.analysis-guide { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 14px; padding: 8px 14px 7px; border: 1px solid #203743; border-radius: 6px; background: linear-gradient(110deg,#0a1d2780,#07172030); }
.analysis-guide-items { display: flex; flex: 1 1 740px; align-items: center; justify-content: center; gap: 12px clamp(20px,2.4vw,54px); }
.analysis-guide-item { display: flex; align-items: center; gap: 10px; }
.analysis-guide-item > img { width: 48px; height: 40px; flex: none; }
.analysis-guide-item.is-thermo > img { width: 22px; }
.analysis-guide-item strong { color: #b9cbd7; font: 500 14px/1.4 'Roboto Condensed', Arial, sans-serif; white-space: nowrap; }
.analysis-guide-footer { display: flex; flex: 1 1 440px; align-items: center; min-height: 40px; padding-left: 22px; border-left: 1px solid #29414e; }
.analysis-directions { display: flex; flex: 1; flex-wrap: wrap; justify-content: center; gap: 10px clamp(22px,3vw,64px); color: #8fa6b6; font: 13px/1.4 'Roboto Condensed', Arial, sans-serif; }
.analysis-directions span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.analysis-directions .direction-copy { display: grid; gap: 1px; }
.analysis-directions small { color: #8fa6b6; font-size: 12px; }
.analysis-directions img { width: 18px; height: 22px; margin-right: 5px; }
.analysis-directions strong { font-weight: 500; color: #b9cbd7; }
.analysis-guide-note { flex-basis: 100%; grid-column: 1 / -1; padding-top: 6px; border-top: 1px solid #203743; color: #92aab9; font: 13px/1.4 'Roboto Condensed', Arial, sans-serif; }
.analysis-guide-note strong { color: #c0d1dc; font-weight: 500; }
@media(min-width:1440px){
 .analysis-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
}
@media(max-width:1439px){
 .analysis-guide-footer{padding:8px 0 0;border-left:0;border-top:1px solid #203743}
}
@media(max-width:800px){
 .analysis-guide-items{flex-wrap:wrap;justify-content:flex-start}
 .analysis-guide-footer{flex-wrap:wrap;gap:4px 16px}
 .analysis-directions{justify-content:flex-start;gap:10px 16px}
}
@media(max-width:700px){
 .analysis-guide-items{display:grid;grid-template-columns:1fr;gap:4px}
 .analysis-guide-item.is-thermo>img{width:48px;padding-inline:13px}
}


/* Missing forecasts keep the same four-gauge layout without implying a neutral signal. */
.instrument{position:relative}
.instrument-pair.is-empty .pair-title{opacity:.5}
.instrument.is-empty .gp-frame{opacity:.32;filter:saturate(.32);pointer-events:none;user-select:none}
.instrument.is-empty .gp-status,.instrument.is-empty .gp-summary{visibility:hidden}
.instrument-empty{position:absolute;inset:0;display:grid;place-items:center;border:1px solid #243947;border-radius:6px;background:linear-gradient(180deg,#03101830,#020c1466 35%,#020b1477);pointer-events:none}
.instrument-empty>span{padding:13px 25px;color:#9cb1c1;font:500 20px/1.2 'Roboto Condensed',Arial,sans-serif;letter-spacing:.2px;border:1px solid #2a424f;border-radius:5px;background:#07131eef;box-shadow:0 8px 30px #0005}

#market-load-status{margin:24px 0;color:var(--muted)}
#market-load-status button{color:#a3d7fc;text-decoration:underline;text-underline-offset:3px}