/* QuantHarbour identity V1: cream, ink, bottle green, editorial serif, Swiss grid. Shared by real/ and demo/. */
@font-face{font-family:'Noto Serif Display';src:url('NotoSerifDisplay-subset.woff2') format('woff2');font-weight:400 600;font-style:normal;font-display:swap}
:root{--cream:#F5F1E7;--paper:#FBF9F3;--ink:#202923;--muted:#5B645E;--rule:#DDD6C6;--green:#174F40;--green-soft:#E3EAE1;--u:8px;
--serif:'Noto Serif Display',Georgia,'Times New Roman',serif;--sans:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
html{background:var(--cream)}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
main{max-width:1080px;margin:0 auto;padding:calc(var(--u)*3) calc(var(--u)*4) calc(var(--u)*8)!important}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);letter-spacing:-.015em;line-height:1.15}
h1{font-size:40px;margin:0 0 calc(var(--u)*2)!important}
h2{font-size:26px;margin:calc(var(--u)*6) 0 calc(var(--u)*2);padding-top:calc(var(--u)*3);border-top:1px solid var(--rule)}
h3{font-size:19px!important;font-weight:500!important;color:var(--green)!important}
p{max-width:72ch}
a{color:var(--green)}
hr{border:none!important;border-top:1px solid var(--rule)!important}
/* header */
.qh-header{display:flex;align-items:flex-end;justify-content:space-between;padding:0 0 calc(var(--u)*2);margin:0 0 calc(var(--u)*3);border-bottom:2px solid var(--ink)}
.qh-brand{display:block;line-height:0}
.qh-logo{height:84px;width:auto;display:block}
/* numbers and tables */
table{font-variant-numeric:tabular-nums;border-collapse:collapse}
th{font-size:12px!important;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)!important;border-bottom:1px solid var(--ink)!important}
td{border-bottom:1px solid var(--rule)!important}
/* cards (KPI grid) */
div[style*="grid-template-columns"]>div{background:var(--paper);border:1px solid var(--rule)!important;border-radius:2px!important;border-top:2px solid var(--green)!important}
div[style*="grid-template-columns"]>div>div:last-child{font-family:var(--serif);font-weight:400!important}
/* section switch and language: tab-like pills */
#top-section{display:flex;gap:0;padding:0!important;border:none!important;border-bottom:1px solid var(--rule)!important;border-radius:0!important;margin:0 0 calc(var(--u)*3)!important}
#top-section label{display:inline-block;padding:12px 22px;margin:0!important;cursor:pointer;font-family:var(--serif);font-size:18px;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px!important}
#top-section label:hover{color:var(--ink)}
#top-section label:has(input:checked){color:var(--green);border-bottom-color:var(--green)}
#top-section input,#language input{position:absolute;opacity:0;width:0;height:0}
#language{display:inline-flex;gap:0}
#language label{padding:4px 12px;margin:0!important;border:1px solid var(--rule);font-size:13px;cursor:pointer;color:var(--muted);background:transparent}
#language label:first-child{border-radius:2px 0 0 2px}
#language label:last-child{border-radius:0 2px 2px 0;border-left:none}
#language label:has(input:checked){background:var(--green);border-color:var(--green);color:var(--cream)}
#top-section input:focus-visible+*,#language input:focus-visible+*{outline:2px solid var(--green)}
#top-section label:has(input:focus-visible),#language label:has(input:focus-visible){outline:2px solid var(--green);outline-offset:2px}
/* buttons: explicit update controls */
button{font-family:var(--sans);font-weight:600;letter-spacing:.01em;background:var(--green)!important;color:var(--cream)!important;border:1px solid var(--green)!important;border-radius:2px!important;padding:11px 20px!important;cursor:pointer}
button:hover{background:var(--ink)!important;border-color:var(--ink)!important}
button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
/* inputs and dropdowns */
.Select-control,.dash-dropdown,.dash-dropdown-trigger,input[type=number],input[type=text]{border-radius:2px!important;border-color:var(--rule)!important;background:var(--paper)!important;color:var(--ink)!important}
label{color:var(--ink)}
.rc-slider-track{background:var(--green)!important}
.rc-slider-handle{border-color:var(--green)!important;background:var(--cream)!important}
@media(max-width:600px){main{padding:16px!important}h1{font-size:30px}h2{font-size:22px}.qh-logo{height:64px}#top-section label{padding:10px 12px;font-size:16px}}
#language{margin-left:12px;vertical-align:middle}
.qh-session{max-width:1080px;margin:0 auto;padding:12px 32px 0;text-align:right;font-size:13px}
.qh-session a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--rule)}
.qh-session a:hover{color:var(--green);border-bottom-color:var(--green)}
#language{margin-left:16px!important}
label[for=language]{margin-right:4px}
.rc-slider-dot{border-color:var(--rule)!important;background:var(--cream)!important}.rc-slider-dot-active{border-color:var(--green)!important}

/* wide constraint tables scroll inside their column on small screens */
div:has(>#cn-ind-title),div:has(>#cn-stock-title){min-width:0;max-width:100%}
#cn-ind-title~table,#cn-stock-title~table{display:block;max-width:100%;overflow-x:auto}
