/* ═══════════════════════════════════════════════════════════════════════
   سيادة — "Sovereign HUD" layer (theme-hud.css)
   Loads AFTER styles.css and theme.css. Pure override: no ID/class renamed.
   Navy #0b1a3a + gold, chamfered panels with gold hairlines, Cairo, RTL, mobile-first.
   Rule kept: no transform/filter/backdrop-filter on #view or its direct children.
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  --hx-bg:#050c20; --hx-navy:#0b1a3a; --hx-navy2:#10244d; --hx-well:#06102a;
  --hx-gold:#e9c25a; --hx-gold2:#ffe7a3; --hx-gold3:#b07d1f; --hx-hair:rgba(233,194,90,.42); --hx-hair2:rgba(233,194,90,.16);
  --hx-text:#eef2fb; --hx-muted:#8e9dc0; --hx-steel:rgba(150,175,235,.16);
  --hx-ch:12px; --hx-ch-sm:7px;
  --hx-cut:polygon(var(--hx-ch) 0,100% 0,100% calc(100% - var(--hx-ch)),calc(100% - var(--hx-ch)) 100%,0 100%,0 var(--hx-ch));
  --hx-cut-in:polygon(calc(var(--hx-ch) - .6px) 0,100% 0,100% calc(100% - var(--hx-ch) + .6px),calc(100% - var(--hx-ch) + .6px) 100%,0 100%,0 calc(var(--hx-ch) - .6px));
  --hx-cut-sm:polygon(var(--hx-ch-sm) 0,100% 0,100% calc(100% - var(--hx-ch-sm)),calc(100% - var(--hx-ch-sm)) 100%,0 100%,0 var(--hx-ch-sm));
  --hx-gold-grad:linear-gradient(180deg,#ffe9a8 0%,#e9c25a 48%,#b98a26 100%);
  --hx-panel:linear-gradient(165deg,rgba(22,44,94,.97) 0%,rgba(12,27,62,.97) 55%,rgba(8,19,46,.98) 100%);
  --nav:70px;
}

/* ── background: deep navy + faint hex lattice + light pools */
html{background:var(--hx-bg)}
body{background:
  radial-gradient(700px 380px at 100% -60px,rgba(233,194,90,.11),transparent 65%),
  radial-gradient(640px 520px at -10% 110%,rgba(40,86,190,.22),transparent 65%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='72' viewBox='0 0 42 72'%3E%3Cg fill='none' stroke='%23e9c25a' stroke-opacity='.055' stroke-width='1'%3E%3Cpath d='M21 0l21 12v24L21 48 0 36V12z'/%3E%3Cpath d='M21 48v24M0 36l-0 0M42 36v0'/%3E%3C/g%3E%3C/svg%3E") 0 0/42px 72px,
  linear-gradient(180deg,#081633 0%,#050c20 70%) !important;
  background-attachment:fixed !important; color:var(--hx-text)}

/* ── drawn icons (hud.js swaps emoji → <img class="ei">) */
img.ei{display:inline-block;width:1.25em;height:1.25em;vertical-align:-.28em;object-fit:contain;margin:0 .06em;pointer-events:none;user-select:none}
img.ei.flag{width:1.35em;height:1.05em;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.35)}
img.ei.sm{width:18px;height:18px}
.tile .i img.ei,.qa .qi img.ei{width:38px;height:38px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}
.ctype .ci img.ei,.big-i img.ei{width:46px;height:46px}
.av img.ei{width:72%;height:72%;margin:0}
.av img.ei.flag{width:70%;height:52%}
.tabs .ti img.ei{width:20px;height:20px;vertical-align:-.3em}
.btn img.ei{width:1.3em;height:1.3em}

/* ═════════ TOP BAR (HUD) ═════════ */
.top{background:linear-gradient(180deg,rgba(9,22,52,.97),rgba(6,15,38,.95)) !important;border-bottom:0 !important;box-shadow:0 10px 24px -14px rgba(0,0,0,.8)}
.top::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--hx-hair) 18%,var(--hx-gold) 50%,var(--hx-hair) 82%,transparent)}
.top.hud-on .brand,.top.hud-on .chips .chip{display:none !important}
.top.hud-on .top-in{padding:8px 12px 6px;gap:8px}
.hud-id{display:flex;align-items:center;gap:9px;min-width:0;flex:1;color:var(--hx-text);text-decoration:none}
.hud-av{--p:0;position:relative;flex:0 0 auto;width:48px;height:48px;border-radius:50%;padding:3px;
  background:conic-gradient(var(--hx-gold) calc(var(--p)*1%),rgba(150,175,235,.18) 0);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 14px -2px rgba(233,194,90,.45)}
.hud-av.founder{background:conic-gradient(#ffe7a3 calc(var(--p)*1%),#a46cf0 0);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 16px -2px rgba(255,214,110,.7)}
.hud-face{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;overflow:hidden;background:var(--hx-navy);border:2px solid var(--hx-bg);font-size:1.3rem}
.hud-face img{width:100%;height:100%;object-fit:cover;display:block}
.hud-face img.ei{width:70%;height:70%}
.hud-lv{position:absolute;bottom:-5px;inset-inline-start:50%;transform:translateX(50%);min-width:22px;height:17px;padding:0 4px;display:grid;place-items:center;
  font-size:.68rem;font-weight:900;color:#1d1300;background:var(--hx-gold-grad);clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 50%,calc(100% - 5px) 100%,5px 100%,0 50%)}
[dir=ltr] .hud-lv{transform:translateX(-50%)}
.hud-nm{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.hud-nm b{font-size:.98rem;font-weight:900;color:#fff;max-width:100%}
.hud-nm small{display:flex;align-items:center;gap:5px;font-size:.74rem;color:var(--hx-muted);font-weight:700;min-width:0}
.hud-nm small img.ei.flag{width:18px;height:13px;margin:0}
.hud-time{display:flex;align-items:center;gap:5px;padding:4px 9px 4px 8px;background:var(--hx-well);border:1px solid var(--hx-hair2);clip-path:var(--hx-cut-sm);line-height:1.05}
.hud-time span{display:flex;flex-direction:column;align-items:center}
.hud-time b{font-size:.82rem;color:var(--hx-gold2);letter-spacing:.5px}
.hud-time small{font-size:.62rem;color:var(--hx-muted);font-weight:700}
.top .bell{position:relative;display:grid;place-items:center;width:40px;height:40px;background:var(--hx-well);border:1px solid var(--hx-hair2);clip-path:var(--hx-cut-sm);font-size:1.15rem}
.top .bell img.ei{width:24px;height:24px}
.top .bell .badge{top:2px;inset-inline-end:2px}

/* four stat chips */
.hud-stats{padding:0 10px 9px}
.hud-in{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.hs{position:relative;display:flex;align-items:center;gap:5px;min-width:0;padding:5px 6px 6px;color:var(--hx-text);text-decoration:none;
  background:linear-gradient(180deg,rgba(18,38,82,.95),rgba(7,16,40,.95));clip-path:var(--hx-cut-sm)}
.hs::before{content:"";position:absolute;inset:0;pointer-events:none;clip-path:var(--hx-cut-sm);
  background:linear-gradient(90deg,var(--hx-hair2),var(--hx-hair2)) top/100% 1px no-repeat,linear-gradient(90deg,var(--hx-hair2),var(--hx-hair2)) bottom/100% 1px no-repeat,
  linear-gradient(var(--hx-hair2),var(--hx-hair2)) left/1px 100% no-repeat,linear-gradient(var(--hx-hair2),var(--hx-hair2)) right/1px 100% no-repeat}
.hs::after{content:"";position:absolute;top:0;inset-inline-end:var(--hx-ch-sm);width:16px;height:2px;background:var(--hx-acc,var(--hx-gold))}
.hs-i{flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px}
.hs-i img.ei{width:24px;height:24px;margin:0}
.hs-i img.ei.flag{width:22px;height:16px}
.hs-b{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.1}
.hs-l{font-size:.6rem;color:var(--hx-muted);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs b{font-size:.84rem;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.2px}
.hs b small{font-size:.66rem;color:var(--hx-muted);font-weight:700}
.hs-bar{display:block;height:4px;margin-top:3px;background:rgba(0,0,0,.45);box-shadow:inset 0 0 0 1px rgba(150,175,235,.12);overflow:hidden}
.hs-bar>i{display:block;height:100%;background:var(--hx-acc,var(--hx-gold));box-shadow:0 0 8px var(--hx-acc,var(--hx-gold));transition:width .6s ease}
.hs-sub{display:block;font-style:normal;font-size:.58rem;color:var(--hx-acc,var(--hx-gold));opacity:.85;margin-top:2px;font-weight:700;white-space:nowrap}
.hs.en{--hx-acc:#3ee0a1}.hs.xp{--hx-acc:#6fa8ff}.hs.gd{--hx-acc:#f3c64e}.hs.mn{--hx-acc:#9fe870}
.hs.gd b{color:var(--hx-gold2)}

/* ═════════ PANELS: chamfered cards with a gold hairline ═════════ */
.card{position:relative;isolation:isolate;border:0 !important;border-radius:0 !important;padding:14px 14px 15px;margin:12px 0;box-shadow:none !important;
  background:linear-gradient(135deg,var(--hx-hair) 0%,rgba(233,194,90,.10) 28%,var(--hx-steel) 60%,rgba(233,194,90,.5) 100%) !important;
  -webkit-backdrop-filter:none !important;backdrop-filter:none !important;clip-path:var(--hx-cut)}
.card::before{content:"" !important;position:absolute !important;inset:1px !important;z-index:-1;padding:0 !important;border-radius:0 !important;-webkit-mask:none !important;mask:none !important;
  clip-path:var(--hx-cut-in);opacity:1 !important;
  background:radial-gradient(130% 60% at 100% 0%,rgba(233,194,90,.07),transparent 60%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 3px),var(--hx-panel) !important}
.card::after{content:"" !important;position:absolute !important;inset:5px !important;pointer-events:none;z-index:0;border:0 !important;border-radius:0 !important;opacity:.9 !important;box-shadow:none !important;
  background:linear-gradient(var(--hx-gold),var(--hx-gold)) top right/14px 2px no-repeat,linear-gradient(var(--hx-gold),var(--hx-gold)) top right/2px 14px no-repeat,
    linear-gradient(var(--hx-gold),var(--hx-gold)) bottom left/14px 2px no-repeat,linear-gradient(var(--hx-gold),var(--hx-gold)) bottom left/2px 14px no-repeat !important}
.hero-card::before{background:radial-gradient(90% 70% at 100% 0%,rgba(233,194,90,.16),transparent 60%),radial-gradient(80% 60% at 0% 100%,rgba(70,130,255,.13),transparent 60%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 3px),var(--hx-panel) !important}

/* section headers: accent bar + icon + hairline */
.card-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:8px;margin-bottom:8px;
  background:linear-gradient(90deg,transparent,var(--hx-hair2) 30%,var(--hx-hair) 100%) bottom/100% 1px no-repeat}
[dir=rtl] .card-h{background:linear-gradient(270deg,transparent,var(--hx-hair2) 30%,var(--hx-hair) 100%) bottom/100% 1px no-repeat}
.card-h h2,.card>h2,section>h2,.wrap>h1{display:flex;align-items:center;gap:7px;margin:0;font-size:1.02rem;font-weight:900;color:#fff;letter-spacing:.1px}
.card>h2{margin-bottom:6px}
.card-h h2::before,.card>h2::before,section>h2::before,.wrap>h1::before{content:"";flex:0 0 auto;width:5px;height:1.05em;background:var(--hx-gold-grad);clip-path:polygon(0 0,100% 18%,100% 100%,0 82%);box-shadow:0 0 8px rgba(233,194,90,.6)}
.card-h a.small{font-size:.76rem;font-weight:800;color:var(--hx-gold);padding:3px 8px;background:rgba(233,194,90,.08);clip-path:var(--hx-cut-sm)}
section>h2{margin:18px 4px 8px !important}

/* ═════════ SEGMENTED TABS ═════════ */
.tabs{position:relative;display:flex;gap:3px;padding:3px !important;margin:10px 0;border:0 !important;border-radius:0 !important;
  background:linear-gradient(180deg,var(--hx-hair2),rgba(150,175,235,.10)) !important;clip-path:var(--hx-cut-sm)}
.tabs::before{content:"";position:absolute;inset:1px;z-index:0;background:var(--hx-well);clip-path:var(--hx-cut-sm)}
.tabs a,.tabs button{position:relative;z-index:1;flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:5px;border-radius:0 !important;
  padding:8px 10px !important;font-size:.84rem;font-weight:800;color:var(--hx-muted);background:transparent;box-shadow:none !important;
  clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.tabs a:not(.on)+a:not(.on)::before{content:"";position:absolute;inset-inline-end:-2px;top:28%;bottom:28%;width:1px;background:var(--hx-steel)}
.tabs a.on,.tabs button.on{background:var(--hx-gold-grad) !important;color:#1d1300 !important;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.tabs a:not(.on) img.ei{opacity:.7;filter:saturate(.6)}

/* ═════════ BUTTONS ═════════ */
.btn{border-radius:0 !important;clip-path:var(--hx-cut-sm);font-weight:800;border:1px solid var(--hx-hair2) !important;background:linear-gradient(180deg,#16305f,#0c1d42) !important;color:var(--hx-text)}
.btn.primary{background:var(--hx-gold-grad) !important;color:#1d1300 !important;border:0 !important;text-shadow:0 1px 0 rgba(255,255,255,.35);box-shadow:inset 0 -2px 0 rgba(120,80,10,.45),inset 0 1px 0 rgba(255,255,255,.6) !important}
.btn.danger{background:linear-gradient(180deg,#4a1620,#2a0c14) !important;border-color:rgba(248,113,113,.4) !important;color:#ffc9c9 !important}
.btn.ghost{background:transparent !important}
.btn.big{min-height:56px;font-size:1.1rem;letter-spacing:.3px;--hx-ch-sm:12px}
.btn.sm{min-height:36px;padding:6px 14px}
.btn[disabled],.btn[aria-disabled=true]{filter:grayscale(.7) brightness(.8);opacity:.65}

/* ═════════ LIST ROWS (market offers, jobs, companies, ranks) ═════════ */
.list{display:flex;flex-direction:column;gap:6px}
.li{position:relative;gap:10px;padding:8px 10px !important;border:0 !important;border-radius:0;
  background:linear-gradient(90deg,rgba(255,255,255,.035),rgba(255,255,255,.01));clip-path:var(--hx-cut-sm);box-shadow:inset 0 0 0 1px rgba(150,175,235,.08)}
.li::before{content:"";position:absolute;inset-inline-start:0;top:8px;bottom:8px;width:2px;background:var(--hx-hair)}
a.li:hover,.li:has(a):hover{background:linear-gradient(90deg,rgba(233,194,90,.08),rgba(255,255,255,.015))}
.list .av,.li .av{border-radius:0 !important;clip-path:var(--hx-cut-sm);background:radial-gradient(80% 80% at 50% 30%,#1d3a74,#0a1736) !important;box-shadow:inset 0 0 0 1px var(--hx-hair2);display:grid;place-items:center;overflow:hidden}
.li .av.sm{width:40px;height:40px}
.li.co .av{width:52px;height:52px}
.li .num.gold,.li b.num{font-size:1rem;font-weight:900;color:var(--hx-gold2);text-shadow:0 0 10px rgba(233,194,90,.35)}
.li .btn.sm{min-width:64px}
.li.offer.state{background:linear-gradient(90deg,rgba(111,168,255,.08),rgba(255,255,255,.01))}
.li.offer.state::before{background:#6fa8ff}

/* ═════════ READOUTS: stat boxes, tiles, quick actions ═════════ */
.statbox,.tile,.qa,.ctype,.cooldown,.itemc,.day,.reward-lines{border:0 !important;border-radius:0 !important;clip-path:var(--hx-cut-sm);
  background:linear-gradient(180deg,rgba(8,18,44,.9),rgba(4,11,30,.92)) !important;box-shadow:inset 0 0 0 1px rgba(150,175,235,.12),inset 0 1px 0 rgba(233,194,90,.18) !important}
.statbox{padding:9px 10px !important;text-align:start}
.statbox .tiny{display:flex;align-items:center;gap:4px;font-weight:700;color:var(--hx-muted)}
.statbox .v{font-size:1.15rem;font-weight:900;color:var(--hx-gold2);text-shadow:0 0 10px rgba(233,194,90,.3)}
.grid3,.grid2{gap:6px}
.tile{position:relative;padding:14px 6px 10px !important;gap:6px;font-weight:800;font-size:.84rem;color:var(--hx-text)}
.tile::after{content:"";position:absolute;bottom:0;inset-inline:22%;height:2px;background:linear-gradient(90deg,transparent,var(--hx-gold),transparent);opacity:.55}
.tile.soon{opacity:.55}
.tile.soon .pill{font-size:.6rem;padding:0 6px}
.qa{padding:10px 4px !important}
.qa.go{background:radial-gradient(110% 80% at 50% 0%,rgba(233,194,90,.24),rgba(4,11,30,.92) 70%) !important;box-shadow:inset 0 0 0 1px rgba(233,194,90,.6),inset 0 1px 0 rgba(255,231,163,.5) !important}
.qa b{font-size:.84rem}
.ctype{padding:10px 6px !important}
.cooldown{padding:12px !important;text-align:center}
.big-clock{font-size:2rem !important;font-weight:900;letter-spacing:2px;color:var(--hx-gold2);text-shadow:0 0 14px rgba(233,194,90,.55);font-variant-numeric:tabular-nums}

/* bars: segmented HUD meters */
.bar{height:9px !important;border-radius:0 !important;background:rgba(0,0,0,.5) !important;box-shadow:inset 0 0 0 1px rgba(150,175,235,.14);clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%);position:relative}
.bar>i{border-radius:0 !important}
.bar::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(5,12,32,.85) 9px 11px)}
.stat{margin-top:10px}
.stat-h{display:flex;justify-content:space-between;align-items:center;font-weight:800;margin-bottom:4px}
.stat-h .num{color:var(--hx-gold2)}

/* pills → angled tags */
.pill{border-radius:0 !important;clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%);padding:2px 10px !important;font-weight:800}
.pill.gold{background:var(--hx-gold-grad) !important;color:#1d1300 !important;box-shadow:none !important}
.pill.founder{background:linear-gradient(90deg,#6c3fd1,#a46cf0) !important;color:#fff !important;border:0}

/* avatars (big) */
.av.lg{border-radius:0 !important;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);box-shadow:inset 0 0 0 2px var(--hx-hair)}
.av.lg.frame{padding:3px;background:var(--hx-gold-grad) !important;animation:none}
.av.lg.frame .avi{clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}

/* big avatars get a gold chamfer frame */
.av.lg:not(.frame){padding:2px;background:var(--hx-gold-grad) !important;box-shadow:none}
.av.lg .avi{width:100%;height:100%;object-fit:cover;clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px)}
.statbox .tiny{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.7rem}

/* inputs */
.input{border-radius:0 !important;clip-path:var(--hx-cut-sm);background:var(--hx-well) !important;border:1px solid var(--hx-hair2) !important}
.input:focus{border-color:var(--hx-gold) !important;box-shadow:none !important}

/* ═════════ HOME specifics ═════════ */
.card[aria-label="ملفك"] h1{font-size:1.25rem !important}
.today .card-h h2{color:var(--hx-gold2)}
.check{border-radius:0 !important;clip-path:var(--hx-cut-sm)}
.tip{--hx-hair:rgba(111,168,255,.5)}

/* ═════════ PROFILE ═════════ */
.founder-card::before{background:radial-gradient(90% 60% at 50% 0%,rgba(164,108,240,.22),transparent 60%),radial-gradient(70% 50% at 50% 0%,rgba(233,194,90,.22),transparent 70%),var(--hx-panel) !important}
.founder-card{background:linear-gradient(135deg,#ffe7a3,rgba(164,108,240,.6) 40%,rgba(233,194,90,.3) 70%,#e9c25a) !important}
.card.center h1{color:#fff;text-shadow:0 0 18px rgba(233,194,90,.35)}

/* ═════════ BOTTOM NAV: fixed command dock ═════════ */
.nav{background:transparent !important;border-top:0 !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;filter:drop-shadow(0 -6px 14px rgba(0,0,0,.55))}
.nav-in{position:relative;height:var(--nav) !important;padding:0 6px !important;max-width:560px;
  background:linear-gradient(180deg,rgba(14,31,68,.98),rgba(6,14,36,.99));
  clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%,0 16px)}
.nav-in::before{content:"";position:absolute;top:0;inset-inline:16px;height:1px;background:linear-gradient(90deg,transparent,var(--hx-gold),transparent)}
.nav a{position:relative;gap:3px !important;font-size:.7rem !important;font-weight:800;color:var(--hx-muted) !important;padding-top:4px}
.nav a::before{content:"" !important;position:absolute !important;top:6px !important;left:50% !important;width:44px !important;height:36px !important;margin-left:-22px !important;border-radius:0 !important;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(180deg,rgba(233,194,90,.30),rgba(233,194,90,.06)) !important;box-shadow:none !important;opacity:0;transform:scale(.7);transition:opacity .25s,transform .25s}
.nav a.on::before{opacity:1 !important;transform:scale(1) !important}
.nav a .i{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;font-size:1.3rem;filter:grayscale(.85) brightness(1.05) !important;opacity:.62 !important}
.nav a .i img.ei{width:28px;height:28px;margin:0}
.nav a.on{color:var(--hx-gold2) !important}
.nav a.on .i{filter:drop-shadow(0 0 8px rgba(233,194,90,.6)) !important;opacity:1 !important}
.nav a.on::after{content:"" !important;position:absolute !important;top:0 !important;bottom:auto !important;width:26px !important;height:3px !important;border-radius:0 !important;background:var(--hx-gold) !important;box-shadow:0 0 10px var(--hx-gold) !important}
/* centre slot (work) is a raised command button */
.nav a:nth-child(3) .i{width:46px;height:46px;margin-top:-20px;background:radial-gradient(70% 70% at 50% 30%,#1f3f80,#0a1736);
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);box-shadow:none;filter:none !important;opacity:1 !important}
.nav a:nth-child(3) .i::before{content:"";position:absolute;inset:0;z-index:-1;clip-path:inherit;background:var(--hx-gold-grad);padding:2px}
.nav a:nth-child(3) .i img.ei{width:30px;height:30px;position:relative;z-index:1}
.nav a:nth-child(3)::before{display:none}
.nav a:nth-child(3).on .i{background:var(--hx-gold-grad)}

/* modals keep their sheet, re-edged */
.modal{border-radius:0 !important;clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%,0 18px);border-top:1px solid var(--hx-hair) !important}

@media (min-width:600px){ .hud-in{gap:8px} .hs b{font-size:.92rem} }
@media (max-width:360px){ .hs-i{width:20px;height:20px} .hs-i img.ei{width:20px;height:20px} .hs b{font-size:.76rem} .hud-time{display:none} }
@media (prefers-reduced-motion:reduce){ .hs-bar>i,.nav a::before{transition:none !important} }