/* ui/hype-simple (2026-10-30, newv.png): the Simple page and the Simple | Pro headline row. Radius 0, 8px grid, 1168px column. Generated selectors: one prefix for specificity. */
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-top{ display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:24px !important; max-width:1168px !important; margin:32px auto 24px !important; padding:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-hl h1{ margin:0 !important; font:500 28px/1.2 var(--sans) !important; letter-spacing:-.4px !important; color:#1a1410 !important; text-transform:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-hl p{ margin:8px 0 0 !important; font:400 15px/1.4 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-sw{ display:inline-flex !important; flex:none !important; padding:3px !important; border:1px solid #1a1410 !important; background:#fffefb !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-sw button{ width:112px !important; height:40px !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; color:#1a1410 !important; font:500 15px/1 var(--sans) !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-sw button.is-on{ background:#fe6102 !important; color:#fff !important; font-weight:600 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq{ max-width:1168px !important; margin:0 auto 48px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq[hidden]{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-card{ border:1px solid #1a1410 !important; background:#fffefb !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-panes{ display:grid !important; grid-template-columns:1fr 1fr !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-panes > div{ height:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-l{ padding:24px !important; border-right:1px solid rgba(26,20,16,.12) !important; min-width:0 !important; display:flex !important; flex-direction:column !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rp{ padding:32px 24px 24px !important; min-width:0 !important; display:flex !important; flex-direction:column !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-as{ position:relative !important; display:flex !important; align-items:center !important; gap:16px !important; padding-bottom:16px !important; margin-bottom:8px !important; border-bottom:1px solid rgba(26,20,16,.12) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-pick{ display:inline-flex !important; align-items:center !important; gap:8px !important; height:36px !important; padding:0 12px !important; border:1px solid rgba(26,20,16,.25) !important; border-radius:0 !important; background:#fff !important; cursor:pointer !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-pick b{ font:600 13px/1 var(--mono) !important; letter-spacing:.04em !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-pick i{ font-style:normal !important; font-size:10px !important; color:rgba(26,20,16,.55) !important; margin-left:4px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-pick svg,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-pick img,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-menu svg,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-menu img{ width:20px !important; height:20px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-px{ font:500 20px/1 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rd{ display:inline-flex !important; align-items:center !important; gap:6px !important; font:400 11px/1 var(--mono) !important; letter-spacing:.06em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rd i{ width:6px !important; height:6px !important; border-radius:50% !important; background:#1f8a4c !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-menu{ position:absolute !important; top:44px !important; left:0 !important; z-index:20 !important; display:flex !important; flex-direction:column !important; min-width:160px !important; padding:4px !important; border:1px solid #1a1410 !important; background:#fff !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-menu button{ display:flex !important; align-items:center !important; gap:8px !important; height:36px !important; padding:0 10px !important; border:0 !important; border-radius:0 !important; background:none !important; font:500 13px/1 var(--mono) !important; color:#1a1410 !important; cursor:pointer !important; text-align:left !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-menu button:hover{ background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lb{ display:block !important; margin:16px 0 8px !important; font:400 15px/1.3 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-cs{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; align-items:center !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-c{ display:inline-flex !important; align-items:center !important; gap:8px !important; height:40px !important; padding:0 16px !important; border:1px solid rgba(26,20,16,.12) !important; border-radius:0 !important; background:#f8f1e7 !important; color:#1a1410 !important; font:500 15px/1 var(--sans) !important; cursor:pointer !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-c.is-on{ background:#fdf3ea !important; border-color:#fe6102 !important; color:#a9521a !important; font-weight:600 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-other{ width:88px !important; height:40px !important; padding:0 12px !important; border:1px solid #fe6102 !important; border-radius:0 !important; background:#fff !important; font:500 15px/1 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lv{ display:flex !important; align-items:center !important; height:44px !important; padding:0 4px !important; border:1px solid #fe6102 !important; background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lv button{ flex:none !important; width:34px !important; height:34px !important; padding:0 !important; border:1px solid rgba(26,20,16,.2) !important; border-radius:0 !important; background:#fff !important; color:#a9521a !important; font:500 18px/1 var(--sans) !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lv button:disabled{ opacity:.35 !important; cursor:default !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lv span{ flex:1 !important; text-align:center !important; font:400 13px/1 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lv b{ font:600 16px/1 var(--sans) !important; color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-ex{ margin-top:32px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-ex h4,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rp h4{ margin:0 0 8px !important; font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r{ display:flex !important; justify-content:space-between !important; align-items:center !important; gap:16px !important; min-height:32px !important; margin:0 !important; padding:0 !important; border:0 !important; background:none !important; font:400 15px/1.3 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r span{ padding:0 !important; border:0 !important; background:none !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r b{ padding:0 !important; border:0 !important; background:none !important; font-weight:400 !important; color:#1a1410 !important; text-align:right !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r.is-b b{ font-weight:600 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r em{ font-style:normal !important; font-weight:500 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r em.pos{ color:#1f7a46 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r em.neg{ color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-r code{ font:400 13px/1 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rp hr{ width:100% !important; margin:8px 0 !important; border:0 !important; border-top:1px solid rgba(26,20,16,.12) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-p{ margin:8px 0 0 !important; font:400 13px/1.45 var(--sans) !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-fin{ margin:16px 0 0 !important; font:400 13px/1.45 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-sk{ font-style:normal !important; color:rgba(26,20,16,.4) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-det{ align-self:flex-start !important; margin:24px 0 0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; border-bottom:1px solid #1a1410 !important; background:none !important; font:400 13px/1.3 var(--sans) !important; color:#1a1410 !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-dl{ margin-top:8px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-btn{ width:100% !important; height:48px !important; margin-top:24px !important; border:0 !important; border-radius:0 !important; background:#fe6102 !important; color:#fff !important; font:600 16px/1 var(--sans) !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-btn:disabled{ background:#d9cfc3 !important; color:rgba(26,20,16,.45) !important; cursor:default !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-alt{ align-self:center !important; margin-top:12px !important; font:400 13px/1 var(--sans) !important; color:#1a1410 !important; text-decoration:underline !important; text-underline-offset:3px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-note{ color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-dly{ margin:0 0 8px !important; color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of{ margin-top:24px !important; border:1px solid #1a1410 !important; background:#fffefb !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of header{ display:flex !important; align-items:center !important; gap:16px !important; height:32px !important; padding:0 16px !important; background:#f5ede2 !important; border-bottom:1px solid #1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of header span,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of header em{ font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; font-style:normal !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of header em{ margin-left:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tag{ padding:4px 6px !important; border:1px solid rgba(26,20,16,.2) !important; font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; font-style:normal !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr{ display:grid !important; grid-template-columns:40px minmax(0,1.3fr) 140px 150px 120px minmax(0,1.6fr) !important; align-items:center !important; gap:16px !important; min-height:44px !important; padding:0 16px !important; border-bottom:1px solid rgba(26,20,16,.1) !important; font:400 15px/1.2 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr:last-child{ border-bottom:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span{ min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(1){ color:#a9521a !important; font-weight:600 !important; text-align:center !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(2){ display:flex !important; align-items:center !important; gap:10px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(4){ text-align:right !important; font-variant-numeric:tabular-nums !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(5){ color:rgba(26,20,16,.55) !important; font-variant-numeric:tabular-nums !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(6){ font-size:13px !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr img,:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr svg{ width:20px !important; height:20px !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-th{ min-height:36px !important; font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-th span:nth-child(5),:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-th span:nth-child(6){ font-size:10px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr.is-best{ background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr.is-old{ opacity:.45 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-foot{ margin:16px 0 0 !important; font:400 13px/1.45 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-dn h2{ margin:0 !important; font:500 22px/1.25 var(--sans) !important; color:#1a1410 !important; text-transform:none !important; letter-spacing:-.2px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-dn .hq-sub{ margin:8px 0 24px !important; font:400 15px/1.45 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-dn p{ margin:0 !important; font:400 15px/1.55 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-lk{ align-self:flex-start !important; margin-top:24px !important; padding:0 !important; border:0 !important; border-bottom:1px solid #1a1410 !important; background:none !important; font:400 15px/1.3 var(--sans) !important; color:#1a1410 !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-rp a{ color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-th span{ font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
@media (max-width:900px){
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-top{ flex-direction:column !important; margin:16px 16px 16px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq{ margin:0 16px 32px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-panes{ grid-template-columns:1fr !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-l{ border-right:0 !important; border-bottom:1px solid rgba(26,20,16,.12) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr{ grid-template-columns:24px minmax(0,1fr) 90px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(5),:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-tr span:nth-child(6){ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body .view[data-view="match"] .hq-of header{ height:auto !important; flex-wrap:wrap !important; padding:8px 16px !important; }
}
/* Simple on: the terminal's own Simple (#v7) and the old header mode switch stand aside; the header is logo + Connect wallet */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-on #v7{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .tm-sw{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top nav.rail{ display:none !important; }

/* fixes 2026-10-30 (Mehdi's screenshots): one 1168px column on / and /pro, plain background on /, --acc orange */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site{ --acc:#e07a2e; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-on{ background:var(--bg) !important; background-image:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-sw button.is-on{ background:var(--acc) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-btn{ background:var(--acc) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-btn:disabled{ background:#d9cfc3 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro{ width:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-chev{ display:inline-block !important; width:10px !important; height:6px !important; margin-left:6px !important; vertical-align:middle !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-det .hq-chev{ color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-chev.is-up{ transform:rotate(180deg) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-btns{ background:#fffaf3 !important; padding-top:8px !important; box-shadow:0 -8px 8px -4px #fffaf3 !important; z-index:2 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-top{ margin-top:0 !important; margin-bottom:16px !important; }

/* Pro layout fix 2026-10-30: plain background on both pages; a 69px header with nothing clipped; /pro on a 1440px
   column with 24px sides (header inner, headline, trade panel, positions); grid = chart | strikes 380 | ticket 320 */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site{ background:var(--bg) !important; background-image:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top{ top:0 !important; margin-top:0 !important; transform:none !important; box-sizing:border-box !important; height:56px !important; min-height:56px !important; align-items:center !important; }

:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site:not(.hq-on) .view[data-view="match"] .hq-top{ position:fixed !important; top:101px !important; left:max(24px, calc((100vw - 1440px) / 2 + 24px)) !important; right:max(24px, calc((100vw - 1440px) / 2 + 24px)) !important; max-width:none !important; margin:0 !important; z-index:5 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro{ grid-template-columns:minmax(0,1fr) 320px !important; column-gap:16px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-ch{ grid-template-columns:minmax(0,1fr) 380px !important; min-width:0 !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-ch > *,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro > *{ min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-cw,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-lw,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-lt,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-lh{ overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd{ flex-wrap:nowrap !important; overflow:hidden !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-tk{ width:320px !important; min-width:0 !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-tk-in{ flex:1 1 auto !important; min-height:0 !important; height:auto !important; max-height:none !important; overflow-y:auto !important; overflow-x:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-tk > .mp-btns{ flex:none !important; position:static !important; margin:0 !important; padding:8px 10px 10px !important; border-top:1px solid rgba(26,20,16,.12) !important; background:#fffaf3 !important; box-shadow:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-c small{ font:400 12px/1 var(--sans) !important; color:rgba(26,20,16,.5) !important; margin-left:2px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site:not(.hq-on)::after{ display:none !important; }

/* prices for reference, trade on Moneyness (Mehdi 2026-10-30): our row runs a 2px orange border every 2.4 s, nothing else moves */
@property --hq-a { syntax:'<angle>'; inherits:false; initial-value:0deg; }
@keyframes hq-spin { to { --hq-a:360deg; } }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr.is-me{ position:relative !important; background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-run{ position:absolute !important; inset:0 !important; padding:2px !important; background:conic-gradient(from var(--hq-a), #f0c9a6 0 50%, #f3a466 65%, var(--acc) 80%, #c4561a 88%, #f0c9a6 100%) !important; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; -webkit-mask-composite:xor !important; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important; mask-composite:exclude !important; box-shadow:0 0 14px rgba(224,122,46,.25) !important; animation:hq-spin 2.4s linear infinite !important; pointer-events:none !important; }
@media (prefers-reduced-motion: reduce){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-run{ animation:none !important; background:var(--acc) !important; } }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr.is-me span:nth-child(6){ display:flex !important; align-items:center !important; gap:12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tb{ margin-left:auto !important; height:32px !important; padding:0 12px !important; border:0 !important; border-radius:0 !important; background:var(--acc) !important; color:#fff !important; font:600 13px/1 var(--sans) !important; cursor:pointer !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tb:disabled{ background:#d9cfc3 !important; color:rgba(26,20,16,.45) !important; cursor:default !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-low{ margin:16px 0 0 !important; color:rgba(26,20,16,.55) !important; }
/* /pro: no headline, the switch alone, right-aligned on the ticket's right edge, 24px above the trade panel */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site:not(.hq-on) .view[data-view="match"] .hq-top{ top:85px !important; justify-content:flex-end !important; }

/* Simple cleanup 2026-10-30: one line left of the switch; table without the Read at column or a footer */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-top{ align-items:center !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-one{ margin:0 !important; font:400 15px/1.4 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr{ grid-template-columns:40px minmax(0,1.3fr) 140px 150px minmax(0,1.6fr) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr span:nth-child(5){ font-size:13px !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-th span:nth-child(5){ font-size:10px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-also{ margin:0 !important; padding:12px 16px !important; border-top:1px solid rgba(26,20,16,.1) !important; font:400 13px/1.4 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
@media (max-width:900px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr{ grid-template-columns:24px minmax(0,1fr) 90px !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr span:nth-child(5){ display:none !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-tr span:nth-child(4){ display:block !important; } }

/* /pro cleanup 2026-10-30: the cards decide the side, the full ladder without the "far" line, no Vol reading,
   no Settlements or Rewards tabs, seven position columns */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-lt .mp-seg[data-seg="side"]{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-bfar{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-st > span:nth-child(3){ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro [data-c="atab"][data-v="set"],:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro [data-c="atab"][data-v="rew"]{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-th,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-prow{ grid-template-columns:minmax(0,1.6fr) repeat(4, minmax(0,1fr)) minmax(0,1fr) minmax(0,1.3fr) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-th > :nth-child(6),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-th > :nth-child(7),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-th > :nth-child(9),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-prow > :nth-child(6),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-prow > :nth-child(7),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-prow > :nth-child(9){ display:none !important; }
/* stats kept: Option IV, Realized 30D, Expected move (the one-line rule in hype-simple.js drops the last first when tight) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd .mp-st > span:nth-child(1),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd .mp-st > span:nth-child(2),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd .mp-st > span:nth-child(4){ display:flex !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd .mp-st > span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-hd .mp-st > span:nth-child(5){ display:none !important; }
/* the short card's "Lose up to · Locked" line shows in full: it wraps instead of trailing off */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-rec-i > span{ white-space:normal !important; overflow:visible !important; text-overflow:clip !important; }
/* /pro cards and the "Paid if" block (finalv2.png) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .mp-rec-i > span:empty{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sum:empty{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sum{ margin-top:12px !important; padding-top:10px !important; border-top:1px solid rgba(26,20,16,.12) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sr{ display:flex !important; justify-content:space-between !important; align-items:center !important; min-height:26px !important; padding:0 4px !important; font:400 13px/1.2 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sr span{ color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sr b{ font:500 13px/1.2 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sl{ background:rgba(192,57,43,.08) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sl span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sl b{ color:#a8322a !important; font-weight:600 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site #mm-pro .hq-sw2{ margin:4px 4px 0 !important; font:400 11px/1.4 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .view[data-view="match"] .hq-top{ justify-content:flex-end !important; }      /* the switch alone, right-aligned (Mehdi 2026-10-30) */

/* TRADE | DATA tabs (every page) and the DATA page (data1.png, data2.png) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav{ display:flex !important; align-items:center !important; gap:4px !important; margin-left:40px !important; margin-right:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a{ display:inline-flex !important; align-items:center !important; height:28px !important; padding:0 12px !important; font:500 11px/1 var(--mono) !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:rgba(26,20,16,.6) !important; text-decoration:none !important; border-radius:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a.is-on{ background:var(--acc) !important; color:#fff !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data > .app,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data > footer{ display:none !important; }

:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data::after{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd{ display:block !important; box-sizing:border-box !important; width:100% !important; padding-top:16px !important; padding-bottom:40px !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd *{ box-sizing:border-box !important; border-radius:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip{ display:flex !important; align-items:center !important; height:40px !important; padding:0 16px !important; border:1px solid #1a1410 !important; background:#fffefb !important; white-space:nowrap !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip span{ display:inline-flex !important; align-items:baseline !important; gap:8px !important; padding-right:24px !important; margin-right:24px !important; border-right:1px solid rgba(26,20,16,.15) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip span:last-of-type{ border-right:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip a{ font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:#fe6102 !important; text-decoration:underline !important; text-underline-offset:2px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip i{ font:500 10px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip b{ font:600 13px/1 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip em{ margin-left:auto !important; font:500 10px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-cards{ display:grid !important; grid-template-columns:minmax(0,45fr) minmax(0,55fr) !important; gap:16px !important; margin-top:16px !important; align-items:stretch !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card{ display:flex !important; flex-direction:column !important; min-width:0 !important; border:1px solid #1a1410 !important; background:#fffefb !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header{ display:flex !important; align-items:center !important; gap:16px !important; height:32px !important; padding:0 16px !important; background:#f5ede2 !important; border-bottom:1px solid #1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header em{ font:500 10px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.62) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header em:first-of-type{ margin-left:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-live{ display:inline-block !important; width:7px !important; height:7px !important; margin-right:6px !important; border-radius:50% !important; background:#1f8a4c !important; vertical-align:middle !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-r > header em:first-of-type{ color:#1f7a46 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-bd{ display:flex !important; flex-direction:column !important; flex:1 1 auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ar,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tr{ display:grid !important; align-items:center !important; gap:12px !important; height:36px !important; padding:0 16px !important; border-bottom:1px solid rgba(26,20,16,.08) !important; font:400 14px/1 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:28px minmax(0,1fr) 80px 96px 56px 64px 72px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tr{ grid-template-columns:84px minmax(0,1fr) 84px 72px 104px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ar:nth-child(odd):not(.hd-ah),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tb .hd-tr:nth-child(even){ background:#fbf6ee !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ah,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-th{ height:32px !important; font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ah span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ah span:nth-child(5),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-th span:nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-th span:nth-child(4){ text-align:right !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-rk{ font:400 11px/1 var(--mono) !important; color:rgba(26,20,16,.45) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as{ display:flex !important; align-items:center !important; gap:10px !important; min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as b{ font:400 15px/1 var(--sans) !important; color:#1a1410 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as i{ font:400 10px/1 var(--mono) !important; font-style:normal !important; color:rgba(26,20,16,.5) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as svg,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as img,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct svg,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct img{ width:20px !important; height:20px !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-mono{ display:inline-flex !important; align-items:center !important; justify-content:center !important; flex:none !important; width:20px !important; height:20px !important; border-radius:50% !important; background:#f1e7da !important; font:600 10px/1 var(--mono) !important; font-style:normal !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pm{ text-align:right !important; font:700 13px/1 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sh{ display:flex !important; flex-direction:column !important; gap:4px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sh em{ font:400 12px/1 var(--mono) !important; font-style:normal !important; text-align:right !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sh s{ display:block !important; height:3px !important; background:rgba(26,20,16,.08) !important; text-decoration:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sh u{ display:block !important; height:3px !important; background:var(--acc) !important; text-decoration:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-n{ text-align:right !important; font:400 13px/1 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sp path{ fill:none !important; stroke:var(--acc) !important; stroke-width:1.3 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sp circle{ fill:var(--acc) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-go a{ display:inline-flex !important; align-items:center !important; height:24px !important; padding:0 10px !important; border:1px solid var(--acc) !important; border-radius:12px !important; font:500 11px/1 var(--mono) !important; color:#a9521a !important; text-decoration:none !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ft{ margin-top:auto !important; padding:10px 16px !important; border-top:1px solid rgba(26,20,16,.12) !important; font:400 12px/1.4 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-note{ margin:0 !important; padding:16px !important; font:400 13px/1.4 var(--sans) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-r{ min-height:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tb{ height:360px !important; overflow-y:auto !important; flex:1 1 auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tm{ font:400 12px/1 var(--mono) !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct{ display:flex !important; align-items:center !important; gap:8px !important; min-width:0 !important; white-space:nowrap !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct b{ font:400 14px/1 var(--sans) !important; color:#1a1410 !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct em{ font:400 12px/1 var(--mono) !important; font-style:normal !important; color:rgba(26,20,16,.5) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct .hd-x{ color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pill{ flex:none !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:72px !important; height:20px !important; border-radius:10px !important; font:500 10px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.08em !important; text-transform:uppercase !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pill.up{ background:#e3f1e7 !important; color:#1f7a46 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pill.dn{ background:#fbe4dc !important; color:#c0392b !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-sz,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pr{ text-align:right !important; font:400 13px/1 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-pr.is-b{ font-weight:700 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-vn{ display:flex !important; align-items:center !important; gap:8px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-vn i{ font:400 13px/1 var(--sans) !important; font-style:normal !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-vn svg,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-vn img{ width:18px !important; height:18px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a{ border:0 !important; box-shadow:none !important; background-image:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ah span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-th span{ font:500 10px/1 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(26,20,16,.55) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:24px minmax(0,1fr) 76px 84px 52px 62px 64px !important; gap:10px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-as b{ overflow:visible !important; text-overflow:clip !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ft{ display:block !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tr{ grid-template-columns:64px minmax(0,1fr) 64px 64px 96px !important; gap:10px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct b{ flex:none !important; overflow:visible !important; text-overflow:clip !important; font-size:13.5px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ct em{ flex:0 1 auto !important; min-width:0 !important; overflow:hidden !important; white-space:nowrap !important; }

/* one container on /, /pro and /data (Mehdi 2026-10-30): full width, 24px sides, the header's own edges.
   The Simple | Pro switch sits at the same spot on both pages (16px under the header, right edge 24px in);
   its orange block slides 180 ms; content starts 24px under it (hype-simple.js place(), match-pro.js fit()). */
header.top .hq-nav{ display:none; }

:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site::after{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .app{ }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #status{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #mm-wallet[hidden]{ display:inline-flex !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #mm-pro{ left:24px !important; right:24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-top{ position:absolute !important; top:72px !important; left:24px !important; right:24px !important; margin:0 !important; max-width:none !important; display:flex !important; justify-content:flex-end !important; z-index:5 !important; pointer-events:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw{ position:relative !important; display:inline-flex !important; box-sizing:border-box !important; width:232px !important; height:48px !important; padding:3px !important; border:1px solid #1a1410 !important; background:#fffefb !important; pointer-events:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw-i{ position:absolute !important; top:3px !important; left:3px !important; width:112px !important; height:40px !important; background:var(--acc) !important; transform:translateX(0) !important; transition:transform 180ms ease-out !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw.is-pro .hq-sw-i{ transform:translateX(112px) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw button,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw button.is-on{ position:relative !important; z-index:1 !important; width:112px !important; height:40px !important; padding:0 !important; margin:0 !important; border:0 !important; background:transparent !important; font:500 15px/1 var(--sans) !important; color:#1a1410 !important; transition:color 180ms ease-out !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw button.is-on{ color:#fff !important; }

@media (prefers-reduced-motion: reduce){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw-i,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .view[data-view="match"] .hq-sw button{ transition:none !important; } }
/* the tabs come with the page: TRADE lit everywhere but /data */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .hq-nav{ display:flex !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site:not(.hq-data) header.top .hq-nav a[data-k="trade"],:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data header.top .hq-nav a[data-k="data"]{ background:var(--acc) !important; color:#fff !important; }

/* the switch at page level (body > .hq-top): same box on / and /pro */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top{ position:absolute !important; top:72px !important; left:24px !important; right:24px !important; height:48px !important; margin:0 !important; display:flex !important; justify-content:flex-end !important; z-index:5 !important; pointer-events:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data > .hq-top{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw{ position:relative !important; display:inline-flex !important; box-sizing:border-box !important; width:232px !important; height:48px !important; padding:3px !important; border:1px solid #1a1410 !important; background:#fffefb !important; pointer-events:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw-i{ position:absolute !important; top:3px !important; left:3px !important; width:112px !important; height:40px !important; background:var(--acc) !important; transform:translateX(0) !important; transition:transform 180ms ease-out !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw.is-pro .hq-sw-i{ transform:translateX(112px) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw button{ position:relative !important; z-index:1 !important; width:112px !important; height:40px !important; padding:0 !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; font:500 15px/1 var(--sans) !important; color:#1a1410 !important; transition:color 180ms ease-out !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw button.is-on{ color:#fff !important; }
@media (prefers-reduced-motion: reduce){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw-i,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .hq-top .hq-sw button{ transition:none !important; } }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site > .app{ width:100% !important; flex:1 1 100% !important; margin-left:0 !important; margin-right:0 !important; box-sizing:border-box !important; }

/* ABOUT (/about): one 720px editorial column on a soft card over a quiet canvas; same header and tabs */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about header.top .hq-nav a[data-k="trade"]{ background:transparent !important; color:rgba(26,20,16,.6) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about header.top .hq-nav a[data-k="about"]{ background:var(--acc) !important; color:#fff !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about{ background:#fffefb !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > .app,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > footer,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > .hq-top{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about header.top{ position:relative !important; z-index:2 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > .hqa-bg{ position:fixed !important; inset:0 !important; z-index:0 !important; pointer-events:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > #hqa{ position:relative !important; z-index:1 !important; display:block !important; box-sizing:border-box !important; width:100% !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card{ box-sizing:border-box !important; max-width:720px !important; margin:0 auto !important; padding:56px 64px !important; background:rgba(255,253,249,.92) !important; border:1px solid #ede4d8 !important; border-radius:16px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa h1{ margin:0 0 28px !important; font:600 40px/1.15 var(--geist) !important; letter-spacing:-.02em !important; color:#1a1410 !important; text-transform:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p{ margin:0 0 22px !important; font:400 18px/1.7 var(--sans) !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-close{ margin:32px 0 12px !important; font:600 22px/1.35 var(--geist) !important; color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-sig{ margin:0 !important; font:400 15px/1.4 var(--sans) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft{ display:flex !important; flex-direction:column !important; align-items:center !important; gap:16px !important; margin:32px auto 0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft p{ margin:0 !important; font:400 13px/1.4 var(--sans) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos{ display:flex !important; align-items:center !important; justify-content:center !important; gap:32px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos img{ display:block !important; height:28px !important; width:auto !important; filter:grayscale(1) !important; opacity:.7 !important; transition:filter 150ms ease, opacity 150ms ease !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos a:hover img{ filter:none !important; opacity:1 !important; }
@media (max-width:760px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card{ padding:32px 24px !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa h1{ font-size:32px !important; } }

/* ABOUT, per textaaa.png: no card, the text on the page in a 760px column; ink last line; the closing line with an
   orange bar; mono signature; a hairline, then the credit line and the logos in one row */

:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card{ max-width:760px !important; padding:0 !important; background:transparent !important; border:0 !important; border-radius:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa h1{ margin:0 0 48px !important; font:600 52px/1.1 var(--geist) !important; letter-spacing:-.02em !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p{ margin:0 0 24px !important; font:400 18px/1.67 var(--sans) !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p:nth-of-type(6){ color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-close{ margin:48px 0 28px !important; padding:6px 0 6px 22px !important; border-left:2px solid #e07a2e !important; font:600 24px/1.3 var(--geist) !important; letter-spacing:-.01em !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-sig{ font:400 13px/1.4 var(--mono) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft{ flex-direction:row !important; justify-content:center !important; gap:36px !important; max-width:760px !important; margin:56px auto 0 !important; padding-top:28px !important; border-top:1px solid #ded3c4 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft p{ font:500 15px/1.4 var(--sans) !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos img{ height:36px !important; }

/* LAYOUT V5 (Mehdi 2026-10-30, newsimple.png): Simple on one screen. Full width, 24px sides; one row of two cards, the
   ticket (choices | summary, payoff under the button) and the offers card on the right; nothing under them */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq{ max-width:none !important; width:100% !important; margin:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-g{ display:grid !important; grid-template-columns:minmax(0,1fr) clamp(380px,30vw,440px) !important; gap:16px !important; align-items:stretch !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-card{ border:1px solid #1a1410 !important; background:#fffdf9 !important; min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-panes{ grid-template-columns:minmax(0,1fr) clamp(340px,27vw,400px) !important; height:100% !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-l,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-rp{ padding:20px 24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-l{ border-right:1px solid #ede4d8 !important; border-bottom:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-lb{ margin:18px 0 8px !important; font:400 14px/20px var(--sans) !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-cs{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-c{ height:40px !important; padding:0 14px !important; font-family:var(--sans) !important; font-size:14px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-c small{ font:400 11px/1 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-r{ min-height:30px !important; font:400 14px/1.3 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-rp hr{ margin:8px 0 !important; border:0 !important; border-top:1px solid #ede4d8 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-r.is-b span{ font-weight:600 !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-r.is-b b{ font:600 18px/1.2 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-rp .hq-p{ font-size:13px !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-btn{ height:48px !important; margin-top:16px !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-ex{ margin-top:20px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-ex h4{ font:500 10px/1 var(--mono) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-ex .hq-r{ min-height:28px !important; font:400 14px/1.3 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-ex em.pos{ color:#2f7a3d !important; }
/* the offers card */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of{ display:flex !important; flex-direction:column !important; min-width:0 !important; margin:0 !important; border:1px solid #1a1410 !important; background:#fffdf9 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of header{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:8px !important; height:auto !important; padding:10px 16px !important; background:#f6efe5 !important; border-bottom:1px solid #1a1410 !important; flex-wrap:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of header span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of .hq-tag{ font:500 10px/1.2 var(--mono) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:#8a7f74 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr{ grid-template-columns:minmax(0,1fr) 64px 76px !important; gap:12px !important; min-height:0 !important; padding:10px 16px !important; border-bottom:1px solid #ede4d8 !important; font:400 14px/1.2 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.hq-th{ min-height:36px !important; padding-top:0 !important; padding-bottom:0 !important; border-bottom:1px solid #ede4d8 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.hq-th span{ font:500 10px/1 var(--mono) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr span:nth-child(1){ display:flex !important; align-items:center !important; gap:10px !important; text-align:left !important; color:#1a1410 !important; font-weight:400 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr span:nth-child(2),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr span:nth-child(3){ display:block !important; text-align:right !important; font-variant-numeric:tabular-nums !important; color:#1a1410 !important; font-size:14px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr:not(.hq-th) span:nth-child(3){ font-weight:700 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.hq-th span:nth-child(2),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.hq-th span:nth-child(3){ font-size:10px !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr .hq-vn img,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr .hq-vn svg{ width:24px !important; height:24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-vn b{ display:flex !important; flex-direction:column !important; min-width:0 !important; font:500 15px/1.25 var(--sans) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-vn small{ font:400 12px/1.35 var(--sans) !important; color:#8a7f74 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.is-me{ background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.is-me .hq-vn small{ color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of .hq-also{ display:flex !important; align-items:flex-start !important; gap:10px !important; margin:auto 0 0 !important; padding:12px 16px !important; border-top:1px solid #ede4d8 !important; font:400 13px/1.4 var(--sans) !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gls{ display:inline-flex !important; gap:6px !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl{ display:inline-flex !important; align-items:center !important; justify-content:center !important; width:20px !important; height:20px !important; border-radius:50% !important; filter:grayscale(1) !important; opacity:.7 !important; overflow:hidden !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl img,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl svg{ width:20px !important; height:20px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-paradex,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-derive{ background:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-paradex img,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-paradex svg,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-derive img,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-gl-derive svg{ width:14px !important; height:14px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-at{ margin:0 !important; padding:0 16px 12px !important; text-align:right !important; font:400 11px/1 var(--mono) !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of > .hq-at:nth-child(2),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-of > .hq-also:nth-child(2){ margin-top:auto !important; }
@media (max-width:900px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-g,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-panes{ grid-template-columns:1fr !important; } V .hq-l{ border-right:0 !important; border-bottom:1px solid #ede4d8 !important; } }

/* LAYOUT FIX (Mehdi 2026-10-30): one page container. Header, Trade (Simple), Data and About carry .page-x, the only
   thing that sets their side edges; Pro is fixed, so it takes the same 24px as left/right (above). Header 56px. */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .page-x.page-x{ width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; padding-left:24px !important; padding-right:24px !important; box-sizing:border-box !important; }
/* fonts: three tokens, the families index.html already loads once (Google Fonts, display=swap) */
:root:root:root:root:root:root:root:root:root:root:root:root:has(> body.hq-site), :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site{ --geist:'Geist', system-ui, sans-serif !important; --sans:'Inter', system-ui, sans-serif !important; --mono:'Geist Mono', ui-monospace, monospace !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #mm-wallet,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #mm-wallet *{ font-family:var(--mono) !important; }
/* ABOUT: a 680px column centred in the viewport, 48px under the header, 48px at the bottom */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about > #hqa{ padding-top:48px !important; padding-bottom:48px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card{ max-width:680px !important; margin:0 auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa h1{ margin:0 0 28px !important; font:500 40px/1.15 var(--geist) !important; letter-spacing:-.02em !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p{ margin:0 0 18px !important; font:400 17px/1.65 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-close{ margin:28px 0 14px !important; font:600 20px/1.35 var(--sans) !important; letter-spacing:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-sig{ margin:0 !important; font:400 14px/1.4 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft{ max-width:680px !important; margin:32px auto 0 !important; padding-top:20px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos img{ height:28px !important; }
/* header: every item centred on the 56px row at every width (at 1280 the brand and the wallet sat high) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top.page-x .brand,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top.page-x .topright{ height:56px !important; min-height:0 !important; margin-top:0 !important; margin-bottom:0 !important; padding-top:0 !important; padding-bottom:0 !important; display:flex !important; flex-direction:row !important; align-items:center !important; align-self:center !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top.page-x .brand > *,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top.page-x .topright > *{ align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top.page-x{ padding-top:0 !important; padding-bottom:0 !important; }
/* offers rows: the note on a second line under the name, free to run under the numbers so it is never cut */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr{ row-gap:2px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr .hq-nt{ grid-column:1 / -1 !important; grid-row:2 !important; padding-left:34px !important; margin-top:-4px !important; font:400 12px/1.35 var(--sans) !important; color:#8a7f74 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr.is-me .hq-nt{ color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-on .view[data-view="match"] .hq-tr .hq-vn b{ display:block !important; }
/* ABOUT, smaller text and no title (Mehdi 2026-10-30); the curves stop at the column's edge (hype-about.js) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card{ max-width:600px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p{ margin:0 0 14px !important; font:400 15px/1.6 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-close{ margin:24px 0 10px !important; padding:4px 0 4px 16px !important; font:600 17px/1.35 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-card p.hqa-sig{ font:400 13px/1.4 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft{ max-width:600px !important; margin-top:28px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-ft p{ font:500 13px/1.4 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-logos img{ height:24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-sb{ display:inline-flex !important; align-items:center !important; gap:8px !important; color:inherit !important; text-decoration:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-sb img{ display:block !important; width:22px !important; height:22px !important; border-radius:50% !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about #hqa .hqa-sb:hover{ color:#1a1410 !important; text-decoration:underline !important; text-underline-offset:3px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about header.top.page-x{ margin-bottom:0 !important; }      /* the text starts 48px under the header, not 74 */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site #mm-pro{ padding-left:0 !important; padding-right:0 !important; }      /* Pro's panels on the same 24px edges as the header */

/* SWITCH IN THE HEADER (Mehdi 2026-10-30): Simple | Pro sits 12px left of the wallet chip, centred with it, on Trade
   only; 28px tall, Geist Mono 11px, two fixed 72px halves so switching never changes its size; the orange half slides */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top{ position:static !important; display:flex !important; align-items:center !important; height:auto !important; margin:0 12px 0 0 !important; padding:0 !important; left:auto !important; right:auto !important; top:auto !important; pointer-events:auto !important; z-index:auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data header.top .topright > .hq-top,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-about header.top .topright > .hq-top{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw{ position:relative !important; display:inline-flex !important; box-sizing:border-box !important; width:146px !important; height:28px !important; padding:0 !important; border:1px solid #1a1410 !important; border-radius:0 !important; background:transparent !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw-i{ position:absolute !important; top:0 !important; left:0 !important; width:72px !important; height:26px !important; background:#e07a2e !important; transform:translateX(0) !important; transition:transform 180ms ease-out !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw.is-pro .hq-sw-i{ transform:translateX(72px) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw button{ position:relative !important; z-index:1 !important; box-sizing:border-box !important; width:72px !important; height:26px !important; padding:0 12px !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; font:500 11px/1 var(--mono) !important; letter-spacing:.5px !important; text-transform:uppercase !important; color:#4a4038 !important; transition:color 180ms ease-out, background-color 120ms ease !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw button:not(.is-on):hover{ background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw button.is-on{ color:#fffefb !important; }
@media (prefers-reduced-motion: reduce){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw-i,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top .hq-sw button{ transition:none !important; } }

/* PRO TICKET OVERFLOW FIX (Mehdi 2026-10-30): no scroll inside the ticket; it grows to its content and the page (the
   fixed Pro frame) scrolls when the screen is shorter. Tighter rows so it fits at 1440x900. The button follows in flow. */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro{ overflow-y:auto !important; overflow-x:hidden !important; grid-template-rows:max-content minmax(160px,1fr) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-tk{ overflow:visible !important; height:auto !important; max-height:none !important; align-self:stretch !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-tk-in{ flex:none !important; height:auto !important; max-height:none !important; overflow:visible !important; gap:12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > *{ margin-top:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-sz{ gap:6px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-amt{ height:40px !important; box-sizing:border-box !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-amt .mp-in{ height:38px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-chips{ margin-top:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-chips button{ height:28px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-exs{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-exs .mp-ex{ height:28px !important; padding:0 8px !important; font-size:12px !important; flex:1 1 auto !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec{ margin-top:0 !important; padding-top:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-l{ gap:6px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i{ padding:8px 12px !important; min-height:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i .mp-rec-ic,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i .mp-rec-ic svg{ width:28px !important; height:28px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i b{ font:600 14px/1.25 var(--sans) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i u{ font:400 10px/1.2 var(--mono) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-stk{ width:100% !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-kv{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c i,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c b{ font-size:13px !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-tk > .mp-btns{ position:static !important; margin-top:16px !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-exs{ flex-wrap:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-exs .mp-ex{ flex:1 1 0 !important; min-width:0 !important; padding:0 4px !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro .mp-rec-i{ min-height:54px !important; box-sizing:border-box !important; }      /* a one-line and a two-line title take the same height: picking a card moves nothing */

/* PRO TICKET V2 (Mehdi 2026-10-30, proo.png / proo1.png): one box, no inner scroll; Size, When, a 2x2 type grid, the strike
   slider, one stats row, the button in flow. The ticket column is clamp(360px, 26.4vw, 380px); Positions 12px below. */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro{ grid-template-columns:minmax(0,1fr) clamp(360px,26.4vw,380px) !important; row-gap:12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk{ width:auto !important; border:1px solid #1a1410 !important; background:#fffdf9 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-hd{ display:flex !important; align-items:center !important; justify-content:space-between !important; height:36px !important; min-height:0 !important; padding:0 16px !important; background:#f6efe5 !important; border-bottom:1px solid #1a1410 !important; box-sizing:border-box !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-hd > span{ font:500 10px/1 var(--mono) !important; letter-spacing:1px !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-hd > em{ font:400 12px/1 var(--mono) !important; font-style:normal !important; letter-spacing:0 !important; text-transform:none !important; color:#4a4038 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in{ display:flex !important; flex-direction:column !important; gap:12px !important; padding:14px 16px 16px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-lb,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-mode,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-cust,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-two,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-dk,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-plain,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .hq-sum,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-pro-t,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec > .mp-rec-h,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > [hidden],:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > :empty,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-leg:not(.is-say){ display:none !important; }
/* 1. size */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-sz{ display:flex !important; flex-direction:row !important; align-items:stretch !important; gap:6px !important; height:36px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-amt{ flex:1 1 auto !important; display:flex !important; align-items:center !important; height:36px !important; min-width:0 !important; padding:0 10px !important; border:1px solid #1a1410 !important; background:#fff !important; box-sizing:border-box !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-amt .mp-in{ flex:1 1 auto !important; min-width:0 !important; height:34px !important; padding:0 !important; border:0 !important; background:transparent !important; font:500 17px/1 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-amt .mp-un{ font:400 10px/1 var(--mono) !important; letter-spacing:.5px !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-chips{ display:flex !important; flex:none !important; gap:0 !important; margin:0 !important; height:36px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-chips button{ width:auto !important; min-width:40px !important; flex:1 0 auto !important; height:36px !important; margin:0 0 0 -1px !important; padding:0 5px !important; border:1px solid #ede4d8 !important; border-radius:0 !important; background:#fffdf9 !important; font:400 12px/1 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-chips button:first-child{ margin-left:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-chips button.is-on{ background:#1a1410 !important; border-color:#1a1410 !important; color:#fff !important; position:relative !important; z-index:1 !important; }
/* 2. when */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-whn{ display:flex !important; justify-content:space-between !important; align-items:baseline !important; margin:0 0 -6px !important; padding:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-whn > span{ font:500 10px/1 var(--mono) !important; letter-spacing:1px !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-whn > em{ font:400 11px/1 var(--mono) !important; font-style:normal !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-exs{ display:flex !important; flex-wrap:nowrap !important; gap:0 !important; overflow-x:auto !important; overflow-y:hidden !important; scrollbar-width:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-exs::-webkit-scrollbar{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-exs .mp-ex{ flex:1 0 auto !important; min-width:0 !important; height:28px !important; margin:0 0 0 -1px !important; padding:0 8px !important; border:1px solid #ede4d8 !important; border-radius:0 !important; background:#fffdf9 !important; font:400 11.5px/1 var(--mono) !important; color:#1a1410 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-exs .mp-ex:first-child{ margin-left:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-exs .mp-ex.is-on{ background:#1a1410 !important; border-color:#1a1410 !important; color:#fff !important; position:relative !important; z-index:1 !important; }
/* 3. type grid */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec{ margin:0 !important; padding:0 !important; border:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:6px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i{ display:grid !important; grid-template-columns:24px minmax(0,1fr) !important; grid-template-rows:auto auto !important; align-content:center !important; column-gap:10px !important; row-gap:2px !important; height:46px !important; min-height:0 !important; margin:0 !important; padding:0 10px !important; border:1px solid #ede4d8 !important; border-radius:0 !important; background:#fffdf9 !important; box-shadow:none !important; text-align:left !important; box-sizing:border-box !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i .mp-rec-ic{ grid-row:1 / 3 !important; grid-column:1 !important; display:flex !important; align-items:center !important; width:24px !important; height:24px !important; align-self:center !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i .mp-rec-ic svg{ width:24px !important; height:24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i b{ grid-column:2 !important; grid-row:1 !important; font:600 13.5px/1.2 var(--sans) !important; color:#1a1410 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i em{ grid-column:2 !important; grid-row:2 !important; justify-self:start !important; font:400 12px/1.2 var(--mono) !important; font-style:normal !important; color:#4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i em.pos{ color:#2f7a3d !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i > span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i > u,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i small{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i.is-on{ border-color:#e07a2e !important; box-shadow:inset 0 0 0 1px #e07a2e !important; background:#fdf3ea !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i.is-on b,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i.is-on .mp-rec-ic{ color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-rec-l .mp-rec-i.is-on .mp-rec-ic{ color:#e07a2e !important; }
/* 4. strike slider */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-stk{ width:auto !important; margin:0 !important; padding:0 !important; border:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-k{ border:1px solid #ede4d8 !important; padding:10px 12px 8px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kt{ display:flex !important; align-items:center !important; gap:8px !important; height:24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kt > span{ font:500 10px/1 var(--mono) !important; letter-spacing:1px !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kt > b{ font:600 20px/1 var(--mono) !important; color:#1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kt > em{ font:400 12px/1 var(--mono) !important; font-style:normal !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kp{ margin-left:auto !important; padding:4px 6px !important; background:#e07a2e !important; color:#fffefb !important; font:500 10px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.6px !important; text-transform:uppercase !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kb{ margin-left:auto !important; padding:0 !important; border:0 !important; background:none !important; font:500 12px/1 var(--sans) !important; color:#a9521a !important; text-decoration:none !important; cursor:pointer !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kb:hover{ text-decoration:underline !important; text-underline-offset:3px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ks{ display:flex !important; align-items:center !important; gap:10px !important; margin-top:6px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ks .mp-stk-s{ flex:none !important; width:22px !important; height:22px !important; margin:0 !important; padding:0 !important; border:1px solid #4a4038 !important; border-radius:0 !important; background:#fff !important; font:500 13px/1 var(--mono) !important; color:#1a1410 !important; display:flex !important; align-items:center !important; justify-content:center !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kr{ position:relative !important; flex:1 1 auto !important; height:52px !important; cursor:pointer !important; touch-action:none !important; user-select:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kr > i,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kr > span{ position:absolute !important; display:block !important; font-style:normal !important; pointer-events:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kl{ left:0 !important; right:0 !important; top:21px !important; height:2px !important; background:#e6be9c !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kk{ top:17px !important; width:1px !important; height:10px !important; background:#cdbfae !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kla{ top:36px !important; transform:translateX(-50%) !important; font:400 10px/1 var(--mono) !important; color:#8a7f74 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kpd{ top:18px !important; width:8px !important; height:8px !important; border-radius:50% !important; background:#e07a2e !important; transform:translateX(-50%) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kpl{ top:4px !important; transform:translateX(-50%) !important; font:500 9.5px/1 var(--mono) !important; letter-spacing:.5px !important; text-transform:uppercase !important; color:#a9521a !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ksp{ top:14px !important; height:16px !important; width:0 !important; border-left:1px dashed #4a4038 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ksl{ top:36px !important; transform:translateX(-50%) !important; font:600 9.5px/1 var(--mono) !important; color:#4a4038 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kth{ top:13px !important; width:18px !important; height:18px !important; border-radius:50% !important; background:#fff !important; border:2px solid #1a1410 !important; box-shadow:0 1px 3px rgba(26,20,16,.25) !important; transform:translateX(-50%) !important; box-sizing:border-box !important; z-index:2 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kth.is-pick{ border-color:#e07a2e !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kr:focus-within .hq-kth{ outline:2px solid #e07a2e !important; outline-offset:2px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kin{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; margin:0 !important; opacity:0 !important; pointer-events:none !important; }
/* 5. stats */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-kv{ display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:0 !important; margin:0 !important; padding:0 !important; border-top:1px solid #ede4d8 !important; border-bottom:1px solid #ede4d8 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c{ display:flex !important; flex-direction:column !important; gap:4px !important; padding:8px 0 8px 10px !important; border:0 !important; border-left:1px solid #ede4d8 !important; min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c:first-child{ padding-left:0 !important; border-left:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c i{ font:500 9.5px/1 var(--mono) !important; font-style:normal !important; letter-spacing:.5px !important; text-transform:uppercase !important; color:#8a7f74 !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-kv .mp-c b{ font:500 14px/1.1 var(--mono) !important; color:#1a1410 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
/* 6. button */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-btns{ position:static !important; margin:0 !important; padding:0 !important; border:0 !important; background:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-btns .mp-go{ width:100% !important; height:44px !important; margin:0 !important; border:0 !important; border-radius:0 !important; background:#e07a2e !important; font:600 15px/1 var(--sans) !important; color:#fff !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-tk-in > .mp-btns .mp-go:disabled{ opacity:.55 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ksl.is-r{ transform:translateX(-100%) !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-ksl.is-l{ transform:none !important; }      /* the spot label stays inside the track at its ends */
/* the pick chip (Mehdi 2026-10-30): as Simple's "Moneyness Pro · You trade here" row, tint and running border (.hq-run, 2.4 s) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kp{ position:relative !important; display:inline-flex !important; align-items:center !important; gap:6px !important; height:24px !important; margin-left:auto !important; padding:0 8px 0 4px !important; box-sizing:border-box !important; background:#fdf3ea !important; border:1px solid #e6be9c !important; font:500 12px/1 var(--sans) !important; letter-spacing:0 !important; text-transform:none !important; color:#a9521a !important; white-space:nowrap !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kp img{ display:block !important; width:16px !important; height:16px !important; border-radius:50% !important; flex:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kp .hq-run{ inset:-1px !important; padding:1.5px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kpd{ box-shadow:0 0 0 4px rgba(224,122,46,.18) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .hq-kth.is-pick{ border-color:#e07a2e !important; box-shadow:0 0 0 4px rgba(224,122,46,.18), 0 1px 3px rgba(26,20,16,.25) !important; }

/* DATA without venue names; a share icon per row and the share modal (Mehdi 2026-10-30, share1.png / share2.png) */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:24px minmax(0,1fr) 76px 84px 52px 62px 64px 20px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-tr{ grid-template-columns:64px minmax(0,1fr) 72px 72px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-shc{ display:flex !important; justify-content:flex-end !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-share{ display:inline-flex !important; align-items:center !important; justify-content:center !important; width:20px !important; height:20px !important; padding:0 !important; border:0 !important; background:none !important; color:#8a7f74 !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-share:hover,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-data #hqd .hd-share:focus-visible{ color:#e07a2e !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-sm{ position:fixed !important; inset:0 !important; z-index:1000 !important; display:flex !important; align-items:center !important; justify-content:center !important; background:rgba(26,20,16,.45) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smp{ width:768px !important; max-width:calc(100vw - 32px) !important; background:#fffefb !important; border:1px solid #1a1410 !important; box-sizing:border-box !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smp > header{ display:flex !important; align-items:center !important; justify-content:space-between !important; height:40px !important; padding:0 12px 0 24px !important; background:#f6efe5 !important; border-bottom:1px solid #1a1410 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smp > header span{ font:500 11px/1 var(--mono) !important; letter-spacing:1px !important; text-transform:uppercase !important; color:#8a7f74 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smx{ width:28px !important; height:28px !important; padding:0 !important; border:0 !important; background:none !important; font:400 14px/1 var(--sans) !important; color:#1a1410 !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smc{ padding:24px 24px 0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smc canvas{ display:block !important; width:720px !important; max-width:100% !important; height:auto !important; aspect-ratio:1200 / 675 !important; border:1px solid #ede4d8 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smp > footer{ display:flex !important; justify-content:flex-end !important; gap:12px !important; padding:20px 24px 24px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smb{ height:44px !important; padding:0 24px !important; border:1px solid #1a1410 !important; border-radius:0 !important; background:#fffefb !important; font:600 15px/1 var(--sans) !important; color:#1a1410 !important; cursor:pointer !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site .hd-smb.is-x{ background:#e07a2e !important; border-color:#e07a2e !important; color:#fff !important; }

/* Phones (under 900px Pro is not offered, trade-mode.js): no Simple | Pro switch in the header, tighter tabs, no wrapping,
   so the logo, the three tabs and Connect wallet fit a 390px screen instead of the switch being cut off at the edge. */
@media (max-width:899px){
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site header.top .topright > .hq-top{ display:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav{ margin-left:8px !important; gap:2px !important; min-width:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a{ padding:0 7px !important; white-space:nowrap !important; letter-spacing:.04em !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .topright{ flex:none !important; min-width:0 !important; }
}
@media (max-width:480px){
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav{ margin-left:4px !important; gap:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a{ padding:0 6px !important; font-size:10px !important; letter-spacing:.02em !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .mm-wallet{ padding:0 8px !important; font-size:10px !important; letter-spacing:.02em !important; white-space:nowrap !important; }
}
@media (max-width:374px){
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .hq-nav a{ padding:0 5px !important; font-size:9px !important; letter-spacing:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site header.top .mm-wallet{ padding:0 6px !important; font-size:9px !important; letter-spacing:0 !important; }
}

/* Data on a phone: the two cards stack, and each card body scrolls sideways instead of clipping its fixed columns. */
@media (max-width:900px){
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-cards{ grid-template-columns:minmax(0,1fr) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-bd{ overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-ar{ min-width:520px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-tr{ min-width:440px !important; }
}
@media (max-width:600px){
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip{ height:auto !important; flex-wrap:wrap !important; gap:6px 14px !important; padding:8px 12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip span{ border-right:0 !important; padding:0 !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-strip em{ margin-left:0 !important; flex-basis:100% !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header{ height:auto !important; min-height:32px !important; flex-wrap:wrap !important; gap:4px 12px !important; padding:6px 12px !important; }
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header span,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-data #hqd .hd-card > header em{ white-space:nowrap !important; }
}

/* Pro: the makers behind the picked rung (the pool's breakdown); the brand on the ticket stays Moneyness */
#mm-pro .mp-mkrs:empty{ display:none; }
#mm-pro .mp-mkrs{ display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; padding:6px 12px 2px; font:500 10px/1.4 var(--mono); letter-spacing:.04em; color:rgba(26,20,16,.55); }
#mm-pro .mp-mkrs i{ font-style:normal; text-transform:uppercase; letter-spacing:.1em; color:rgba(26,20,16,.45); }
#mm-pro .mp-mkrs .mp-mk b{ color:#1a1410; font-weight:600; }
#mm-pro .mp-mkrs .mp-mk.is-best b{ color:#c2410c; }
#mm-pro .mp-mkrs em{ font-style:normal; color:#c2410c; }

/* PRO PROPORTIONS: the chart and ticket row takes the free height (never shorter than the ticket's own content), the
   positions panel sizes to its rows up to about a third of the window and scrolls inside. Desktop only. */
@media (min-width:900px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro{ grid-template-rows:minmax(max-content,2fr) minmax(150px,1fr) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-pn{ min-height:0 !important; max-height:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-pn .mp-paper{ flex:1 1 auto !important; min-height:0 !important; overflow-y:auto !important; }
}

/* phones: each table keeps the columns that fit, no sideways scroll */
@media (max-width:600px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar,:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-tr{ min-width:0 !important; gap:8px !important; padding:0 12px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-bd{ overflow-x:visible !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:minmax(0,1fr) 84px 76px 20px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-pm{ text-align:right !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ct .hd-pill{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar > :nth-child(1),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar > :nth-child(4),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar > :nth-child(5),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar > :nth-child(6),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-as i{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-as b{ overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-tr{ grid-template-columns:auto minmax(0,1fr) auto !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-tr > :nth-child(3),:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ct em{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ct{ min-width:0 !important; overflow:hidden !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ct b{ overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; }
}
/* narrow phones: the read time drops under the price instead of past the edge */
@media (max-width:400px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-as{ flex-wrap:wrap !important; row-gap:8px !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-rd{ flex-basis:100% !important; } }

/* phones: one menu for the tabs and the wallet, bigger type */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-burger, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu{ display:none !important; }
@media (max-width:600px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site header.top .hq-nav, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site header.top #mm-wallet{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site header.top{ position:relative !important; overflow:visible !important; z-index:50 !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-burger{ display:inline-flex !important; flex-direction:column !important; justify-content:center !important; gap:5px !important; width:44px !important; height:44px !important; margin-left:auto !important; padding:0 10px !important; background:transparent !important; border:0 !important; cursor:pointer !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-burger i{ display:block !important; height:2px !important; background:#1a1410 !important; border-radius:1px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu:not([hidden]){ display:flex !important; flex-direction:column !important; position:absolute !important; top:100% !important; right:12px !important; left:12px !important; z-index:60 !important; background:#fffaf3 !important; border:1px solid #1a1410 !important; box-shadow:0 8px 24px rgba(26,20,16,.12) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu a, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu button{ display:block !important; padding:16px 20px !important; font:500 17px/1.2 Inter, system-ui, sans-serif !important; color:#1a1410 !important; text-decoration:none !important; text-align:left !important; background:transparent !important; border:0 !important; border-bottom:1px solid rgba(26,20,16,.1) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu a[aria-current=page]{ color:#fe6102 !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-mmenu .hq-mw{ border-bottom:0 !important; color:#fe6102 !important; font-weight:600 !important; }
}

/* phones: the ticket fits one screen; date as a picker, one-line choice rows, the trade button pinned to the bottom */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site .hq-exw{ display:none !important; }
@media (max-width:600px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-exc{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-exw{ display:block !important; position:relative !important; } body.hq-site.hq-site.hq-site.hq-on #hq .hq-expick{ display:flex !important; width:100% !important; height:44px !important; justify-content:space-between !important; font:500 16px Inter, system-ui, sans-serif !important; text-transform:none !important; letter-spacing:0 !important; } body.hq-site.hq-site.hq-site.hq-on #hq .hq-exw .hq-menu{ right:0 !important; min-width:0 !important; } body.hq-site.hq-site.hq-site.hq-on #hq .hq-exw .hq-menu button{ min-height:44px !important; font-size:16px !important; text-align:left !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs{ flex-wrap:nowrap !important; overflow-x:auto !important; scrollbar-width:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs::-webkit-scrollbar{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs .hq-c{ flex:0 0 auto !important; min-height:44px !important; font-size:15px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-lb{ margin-top:14px !important; margin-bottom:6px !important; font-size:15px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-ex{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-btn{ position:fixed !important; left:16px !important; right:16px !important; bottom:calc(12px + env(safe-area-inset-bottom)) !important; width:auto !important; z-index:40 !important; min-height:52px !important; font-size:17px !important; box-shadow:0 6px 20px rgba(26,20,16,.18) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on .view[data-view="match"]{ padding-bottom:88px !important; }
}
/* phones: the ticket uses the width; three wrappers' side padding was 64px */
@media (max-width:600px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on .app.page-x{ padding-left:12px !important; padding-right:12px !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on .view[data-view="match"]{ padding-left:0 !important; padding-right:0 !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-l, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-rp{ padding-left:16px !important; padding-right:16px !important; } }

/* phones: comparison rows stack venue over prices; the read time gets its own row; 40px tap targets; the analytics notice sits in the page flow */
@media (max-width:600px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-of header{ flex-wrap:wrap !important; height:auto !important; gap:6px !important; padding:10px 16px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-of header > *{ white-space:normal !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-tr{ grid-template-columns:1fr 1fr !important; gap:4px 12px !important; padding:10px 16px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-tr .hq-vn, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-tr .hq-nt{ grid-column:1 / -1 !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-tr > span:nth-of-type(3){ text-align:right !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-as{ flex-wrap:wrap !important; row-gap:8px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-rd{ flex-basis:100% !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-lk{ min-height:40px !important; display:inline-flex !important; align-items:center !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-share{ width:40px !important; height:40px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:minmax(0,1fr) 84px 76px 40px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .m-notice{ position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; margin:0 !important; max-width:none !important; border-radius:0 !important; border-width:1px 0 0 !important; padding:12px 16px calc(12px + env(safe-area-inset-bottom)) !important; align-items:center !important; font-size:14px !important; z-index:70 !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site:has(.m-notice) #hq .hq-btn{ bottom:calc(var(--m-notice-h, 84px) + 12px) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site:has(.m-notice) .view[data-view="match"], :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data:has(.m-notice) #hqd, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-about:has(.m-notice) main{ padding-bottom:calc(var(--m-notice-h, 84px) + 76px) !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .m-notice button{ min-height:40px !important; min-width:56px !important; }
}
/* phones: the page scrolls; Pro's desktop terminal lock does not apply */
@media (max-width:600px){ html.mp-lock:root:root, html.mp-lock:root:root body{ overflow-y:auto !important; overflow-x:hidden !important; height:auto !important; } }
/* Pro: the strikes ladder's tab bar and column header line up with the chart's header and toolbar */
@media (min-width:900px){ :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-lt.mp-tk-hd{ height:56px !important; min-height:56px !important; box-sizing:border-box !important; align-items:center !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-lh{ height:34px !important; min-height:34px !important; box-sizing:border-box !important; align-items:center !important; } :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-site #mm-pro .mp-lbody{ top:34px !important; } }
/* phones: 44px rows and targets, comparison header over its own columns, Data keeps the ticker readable; a stale price says Delayed */
:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .hq-rd.is-old i{ background:#b5aca2 !important; animation:none !important; }
@media (max-width:600px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar:not(.hd-ah){ height:44px !important; min-height:44px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-th > :first-child{ display:none !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-th > :nth-child(3){ text-align:right !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-th > :nth-child(2), :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-tr:not(.hq-th) > span:nth-of-type(2){ text-align:left !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-pick, :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-menu button{ min-height:44px !important; height:auto !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data .hd-smx{ min-width:40px !important; min-height:40px !important; }
}
@media (max-width:400px){
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar{ grid-template-columns:minmax(0,1fr) 84px 40px !important; }
  :root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-data #hqd .hd-ar > :nth-child(7){ display:none !important; }
}
/* one shell for every tab: content at most 1872px wide, centred, never closer than 24px to the edge */
:root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .page-x.page-x{ padding-left:max(24px, calc((100vw - 1872px) / 2)) !important; padding-right:max(24px, calc((100vw - 1872px) / 2)) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site #mm-pro{ left:max(24px, calc((100vw - 1872px) / 2)) !important; right:max(24px, calc((100vw - 1872px) / 2)) !important; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site .view[data-view="match"] .hq-top{ left:max(24px, calc((100vw - 1872px) / 2)) !important; right:max(24px, calc((100vw - 1872px) / 2)) !important; }
/* choice rows stay on one line on desktop too, scrolling sideways when a coin's labels are long */
@media (min-width:601px){ :root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs{ flex-wrap:nowrap !important; overflow-x:auto !important; scrollbar-width:none !important; } :root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs::-webkit-scrollbar{ display:none !important; } :root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-cs .hq-c{ flex:0 0 auto !important; } }

/* loading a new price: the skeleton shimmer (the earlier Simple's), no words */
@keyframes hq-sk { from { background-position:200% 0; } to { background-position:0 0; } }
:root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-btn.is-sk{ background:linear-gradient(90deg,#f1e9de 0%,#f8f3ec 50%,#f1e9de 100%) !important; background-size:200% 100% !important; animation:hq-sk 1.2s linear infinite !important; color:transparent !important; border-color:#f1e9de !important; box-shadow:none !important; }
:root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-skb{ display:inline-block !important; width:6.5em !important; height:.8em !important; vertical-align:middle !important; background:linear-gradient(90deg,#f1e9de 0%,#f8f3ec 50%,#f1e9de 100%) !important; background-size:200% 100% !important; animation:hq-sk 1.2s linear infinite !important; }
@media (prefers-reduced-motion: reduce){ :root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-btn.is-sk, :root:root:root:root:root:root:root:root:root:root:root:root:root body.hq-site.hq-site.hq-site.hq-on #hq .hq-skb{ animation:none !important; } }

