:root{
  --wood-deep:#0a0c10;
  --wood:#0f1115;
  --wood-mid:#13161c;
  --wood-light:#1a1d24;
  --panel:#13161c;
  --panel-inset:#0a0c10;
  --panel-stripe:#13161c;

  --gold:#3d8eff;
  --gold-light:#7fb3ff;
  --gold-soft:#3d8eff;
  --gold-dark:#1f5cc4;
  --gold-deep:#1a2535;

  --cream:#e6e8ec;
  --cream-dim:#9aa0a8;
  --dim:#6c7280;
  --muted:#5a606b;

  --green:#34d399;
  --green-dark:#0e7a52;
  --red:#f87171;
  --red-dark:#9b2828;

  --gold-border:1px solid #2a3445;
  --gold-border-soft:1px solid #1a2535;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Inter','DM Sans',system-ui,sans-serif;
  color:var(--cream);
  height:100vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  background:var(--wood);
  background-attachment:fixed;
}

body::before{
  content:none;
}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#0a0c10;border-left:1px solid var(--gold-deep)}
::-webkit-scrollbar-thumb{
  background:var(--gold-dark);
  border-radius:0;
  border:1px solid var(--gold-deep);
}
::-webkit-scrollbar-thumb:hover{background:var(--gold);}

/* App layout */
#app{
  display:flex;
  flex:1;
  overflow:hidden;
  min-height:0;
  position:relative;
  z-index:2;
  padding:14px 16px 16px;
  gap:14px;
}

/* Panel base */
.panel{
  position:relative;
  background:var(--panel);
  border:1px solid var(--gold-soft);
  box-shadow:
    0 0 0 1px #1a0e07,
    0 0 0 2px var(--gold-deep),
    inset 0 0 0 1px rgba(127,179,255,.06),
    inset 0 0 40px rgba(0,0,0,.5),
    0 8px 30px rgba(0,0,0,.6);
}
/* Decorative corner diamonds */
.panel::before,
.panel::after,
.panel > .corner-tl,
.panel > .corner-br{
  content:"";
  position:absolute;
  width:9px;height:9px;
  background:var(--gold);
  transform:rotate(45deg);
  box-shadow:0 0 0 1px var(--gold-deep), inset 0 0 0 1px rgba(255,255,255,.15);
  z-index:3;
}
.panel::before{top:-5px;left:-5px}
.panel::after{top:-5px;right:-5px}
.panel > .corner-tl{bottom:-5px;left:-5px}
.panel > .corner-br{bottom:-5px;right:-5px}

/* Sidebar */
#sidebar{
  width:252px;
  min-width:230px;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  overflow:visible;
  position:relative;
  transition:width .32s cubic-bezier(.2,.8,.3,1), min-width .32s cubic-bezier(.2,.8,.3,1);
}
#sidebarInner{
  overflow-y:auto;
  overflow-x:hidden;
  padding:18px 16px 18px;
  flex:1;
  transition:opacity .2s ease;
}

/* Collapse handle, sits on the right edge */
#sidebarToggle{
  position:absolute;
  top:50%;
  right:-13px;
  transform:translateY(-50%);
  width:26px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  border-radius:0 4px 4px 0;
  color:var(--gold-light);
  font-family:'Cinzel',serif;
  font-size:13px;
  cursor:pointer;
  z-index:20;
  box-shadow:
    inset 0 0 0 1px rgba(127,179,255,.06),
    2px 2px 8px rgba(0,0,0,.4);
  padding:0;
  line-height:1;
  text-shadow:0 0 8px rgba(127,179,255,.4), 0 1px 0 #000;
  transition:background .15s, border-color .15s, color .15s;
}
#sidebarToggle:hover{
  background:#261408;
  border-color:var(--gold);
  color:var(--gold);
}
#sidebarToggle::before{
  content:"◀";
  display:block;
  transition:transform .32s cubic-bezier(.2,.8,.3,1);
}
body[data-sidebar="collapsed"] #sidebarToggle::before{transform:rotate(180deg)}

/* Collapsed state */
body[data-sidebar="collapsed"] #sidebar{
  width:18px;
  min-width:18px;
}
body[data-sidebar="collapsed"] #sidebarInner{
  opacity:0;
  pointer-events:none;
  visibility:hidden;
  transition:opacity .15s ease, visibility 0s linear .2s;
}
body[data-sidebar="collapsed"] #sidebar > .corner-tl,
body[data-sidebar="collapsed"] #sidebar > .corner-br,
body[data-sidebar="collapsed"] #sidebar::before,
body[data-sidebar="collapsed"] #sidebar::after{display:none}
body[data-sidebar="collapsed"] #sidebar{
  background:rgba(26,14,7,.4);
  border-color:transparent;
  box-shadow:none;
}

/* Slate theme overrides for the handle */
body #sidebarToggle{
  background:#0a0c10;
  border:1px solid #2a3445;
  border-radius:0 6px 6px 0;
  color:var(--cream-dim);
  text-shadow:none;
  box-shadow:2px 2px 8px rgba(0,0,0,.5);
}
body #sidebarToggle:hover{
  border-color:#3d8eff;
  color:var(--gold-light);
  background:#181d26;
}
body[data-sidebar="collapsed"] #sidebar{
  background:transparent;
}

/* sidebar masthead removed (top banner replaces it) */
.side-logo{display:none}

.s-section{margin-bottom:18px}
.s-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:'Cinzel',serif;
  font-weight:600;
  font-size:11px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-light);
  text-align:center;
  margin-bottom:11px;
  text-shadow:0 1px 0 #000;
}
.s-title::before, .s-title::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--gold-soft);
}

/* form rows */
.frow{margin-bottom:9px;display:grid;grid-template-columns:78px 1fr;align-items:center;gap:8px}
#langLevel{font-family:'Cormorant Garamond',serif;font-size:13px;font-weight:600}
.frow label,.flabel{
  display:block;
  font-size:10px;
  letter-spacing:.5px;
  color:var(--cream-dim);
  text-transform:none;
  font-family:'Cinzel',serif;
  line-height:1.2;
}

/* Inputs */
select, input[type=text], input[type=number]{
  background:#1f120a;
  color:var(--cream);
  border:1px solid var(--gold-dark);
  border-radius:0;
  padding:5px 22px 5px 9px;
  font-family:'Cinzel',serif;
  font-size:11px;
  width:100%;
  cursor:pointer;
  appearance:none;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.7), inset 0 0 0 1px rgba(0,0,0,.4);
  transition:border-color .15s, box-shadow .15s;
}
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23d4a843'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 8px center;
  background-color:#140a04;
}
input[type=text]{padding-right:9px;cursor:text}
select:hover, input[type=text]:hover{border-color:var(--gold-soft)}
select:focus, input[type=text]:focus, input[type=number]:focus{
  outline:none;
  border-color:var(--gold-light);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.7), 0 0 0 1px rgba(127,179,255,.25);
}
select option{background:#1a0e07;color:var(--cream)}

/* Checkbox row */
.check-row{
  display:flex;align-items:center;gap:9px;
  margin-bottom:7px;
  padding:5px 7px;
  background:rgba(0,0,0,.1);
  border:1px solid var(--gold-deep);
}
.check-row input[type=checkbox]{
  width:14px;height:14px;
  accent-color:var(--gold);
  cursor:pointer;flex-shrink:0;
  filter:hue-rotate(-5deg);
}
.check-row label{
  font-size:10px;
  color:var(--cream);
  cursor:pointer;
  margin:0;
  letter-spacing:.3px;
}

/* Stats footer block, flat list, like reference */
.stats-block{
  margin-top:14px;
  padding:10px 4px 0;
  border-top:1px solid var(--gold-deep);
  font-size:10px;
  color:var(--cream-dim);
  letter-spacing:.5px;
  line-height:1.85;
  font-family:'Cinzel',serif;
}
.stats-block .row{display:flex;justify-content:space-between;gap:10px}
.stats-block .row b{color:var(--cream);font-weight:600}
.stats-block .total{
  color:var(--gold-light);
  font-weight:700;
  border-top:1px dashed var(--gold-deep);
  padding-top:5px;
  margin-top:5px;
}

/* Main + topbar */
#main{
  flex:1;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-width:0;
}
#mainInner{
  flex:1;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-width:0;
}

/* Inner masthead w/ title + currency chip */
#masthead{
  flex-shrink:0;
  position:relative;
  padding:12px 18px 12px;
  border-bottom:1px solid var(--gold-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0);
}
#masthead .title{
  font-family:'Cinzel',serif;
  font-weight:700;
  font-size:20px;
  letter-spacing:5px;
  color:var(--gold-light);
  text-shadow:0 1px 0 #000, 0 0 24px rgba(61,142,255,.35);
  text-transform:uppercase;
  white-space:nowrap;
}
.coinchip{
  position:absolute;
  right:14px;top:50%;
  transform:translateY(-50%);
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:5px 12px 5px 14px;
  background:#150a04;
  border:1px solid var(--gold-soft);
  color:var(--gold-light);
  font-family:'Cinzel',serif;
  box-shadow:inset 0 0 8px rgba(0,0,0,.6), 0 1px 0 var(--gold-deep);
  max-width:300px;
}
.coinchip::before{
  content:"✮";
  color:var(--gold);
  font-size:11px;
  text-shadow:0 0 8px rgba(61,142,255,.6);
}
.chip-label{
  font-size:9px;
  font-weight:600;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--cream-dim);
  border-right:1px solid var(--gold-deep);
  padding-right:10px;
}
.chip-val{
  font-size:11px;
  font-weight:600;
  letter-spacing:.5px;
  color:var(--gold-light);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:200px;
}
.chip-val .chip-profit{
  color:var(--green);
  font-weight:700;
  margin-left:6px;
}

#masthead .closebtn{
  position:absolute;
  right:14px;top:50%;
  transform:translateY(-50%);
  /* placeholder, hidden */
  display:none;
}

/* Tabs row + toolbar */
#tabsRow{
  flex-shrink:0;
  display:flex;
  align-items:center;
  gap:0;
  padding:0 16px;
  border-bottom:1px solid var(--gold-deep);
  background:rgba(0,0,0,.15);
}
.tab{
  padding:9px 24px;
  font-family:'Cinzel',serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:3px;
  cursor:pointer;
  color:var(--cream-dim);
  text-transform:uppercase;
  transition:all .15s;
  user-select:none;
  border-right:1px solid var(--gold-deep);
  position:relative;
}
.tab:first-child{border-left:1px solid var(--gold-deep)}
.tab:hover{color:var(--gold-light);background:rgba(61,142,255,.06)}
.tab.active{
  color:var(--gold-light);
  background:rgba(61,142,255,.04);
  text-shadow:0 1px 0 #000;
}
.tab.active::after{
  content:"";
  position:absolute;
  left:8%;right:8%;bottom:-1px;
  height:2px;
  background:var(--gold);
}

/* Toolbar (sort-by + search + buttons) */
#toolbar{
  flex-shrink:0;
  padding:11px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--gold-deep);
  background:rgba(0,0,0,0);
}
#toolbar .tlabel{
  font-size:10px;
  letter-spacing:1.5px;
  color:var(--cream-dim);
  text-transform:uppercase;
}
#sortBy{
  width:auto;min-width:170px;
  padding:5px 24px 5px 10px;
}
.spacer{flex:1}
#searchInput{
  width:240px;
  padding:5px 10px;
}
.toolbar-budget-input{
  width:88px;min-width:0;
  padding:5px 8px;
  background:var(--panel-inset);color:var(--cream);
  border:1px solid var(--gold-dark);border-radius:2px;font-size:13px;font-family:inherit;
}
.toolbar-budget-input::placeholder{color:var(--muted)}
.toolbar-budget-input:focus{outline:none;border-color:var(--gold)}
#searchInput::placeholder{color:var(--muted);font-style:italic}
.route-controls-head{flex-shrink:0;border-bottom:1px solid var(--gold-deep)}
.route-controls-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:8px 16px;margin:0;border:none;background:rgba(0,0,0,.2);color:var(--cream);font:inherit;cursor:pointer;text-align:left;justify-content:space-between}
.route-controls-toggle:hover{background:rgba(0,0,0,.32)}
.rct-chevron{display:inline-block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid currentColor;opacity:.75;transition:transform .15s ease;transform-origin:50% 35%;flex-shrink:0}
#routeControls[data-collapsed="1"] .rct-chevron{transform:rotate(-90deg)}
.rct-label{font-size:11px;letter-spacing:.55px;text-transform:uppercase;font-weight:600;flex:1;min-width:0}
.route-controls-body{display:flex;flex-direction:column}
#routeControls[data-collapsed="1"] .route-controls-body{display:none}
.routes-data-notice{
  margin:0;
  padding:6px 16px 8px;
  font-size:11px;
  line-height:1.35;
  text-align:center;
  color:var(--muted);
  flex-shrink:0;
  letter-spacing:.2px;
}

.btn{
  padding:5px 14px;
  font-size:10px;
  font-weight:600;
  letter-spacing:2px;
  cursor:pointer;
  border:1px solid var(--gold-soft);
  background:#221308;
  color:var(--gold-light);
  font-family:'Cinzel',serif;
  text-transform:uppercase;
  transition:all .15s;
  box-shadow:inset 0 1px 0 rgba(127,179,255,.08), 0 1px 0 #000;
}
.btn:hover{
  background:#2c1a0a;
  color:var(--gold-light);
  border-color:var(--gold-light);
  box-shadow:inset 0 1px 0 rgba(127,179,255,.15), 0 0 8px rgba(61,142,255,.25);
}
.btn:active{transform:translateY(1px)}
.btn-red{border-color:#b91c1c;color:#fca5a5}
.btn-red:hover{border-color:#f87171;background:#200a06}

/* Routes table */
#routesPanel{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}
.routes-divider{display:flex;align-items:center;gap:0;margin:4px 14px 0;opacity:.7}
.routes-divider::before,.routes-divider::after{content:'';flex:1;height:1px;background:var(--gold-deep)}
.routes-divider::after{background:var(--gold-deep)}
.routes-divider-label{font-family:'Cinzel',serif;font-size:8px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-soft);padding:0 12px;white-space:nowrap}
#tableWrap{flex:1;overflow:auto;padding:0;contain:layout paint;will-change:transform}
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:11.5px;
  font-family:'Cinzel',serif;
}
thead{position:sticky;top:0;z-index:10}
th{
  background:#1a0e07;
  border-bottom:1px solid var(--gold-soft);
  border-top:1px solid var(--gold-deep);
  padding:10px 12px;
  text-align:left;
  color:var(--gold-light);
  letter-spacing:1.5px;
  font-size:10px;
  font-weight:600;
  text-transform:uppercase;
  cursor:pointer;
  white-space:nowrap;
  user-select:none;
  text-shadow:0 1px 0 #000;
}
th:not(:last-child){border-right:1px solid var(--gold-deep)}
th:hover{background:#10141c;color:var(--gold-light)}
th.sort-asc::after{content:" ▲";color:var(--gold-light);font-size:9px}
th.sort-desc::after{content:" ▼";color:var(--gold-light);font-size:9px}

td{
  border-bottom:1px solid #2a1810;
  padding:6px 12px;
  white-space:nowrap;
  font-size:11.5px;
  color:var(--cream);
  vertical-align:middle;
}
td:not(:last-child){border-right:1px solid rgba(31,92,196,.18)}
tbody tr:nth-child(odd) td{background:rgba(61,142,255,0.025)}
tbody tr:nth-child(even) td{background:transparent}
tbody tr:hover td{background:rgba(61,142,255,0.08)}

/* Top row - best route: star only, no highlight */
.top-marker{
  display:inline-block;
  margin-right:6px;
  color:var(--gold-light);
  font-size:10px;
  text-shadow:0 0 8px rgba(127,179,255,.7);
  vertical-align:1px;
}

.profit{color:var(--green);font-weight:600}
.loss{color:var(--red);font-weight:600}
.zero{color:var(--dim)}

/* Good name + icon */
.good-cell{display:inline-flex;align-items:center;gap:8px;line-height:1}
.good-icon{
  width:26px;height:26px;
  flex-shrink:0;
  object-fit:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.5));
  image-rendering:auto;
}
.good-name{letter-spacing:.3px}
.retcard{display:inline-flex;flex-direction:row;align-items:center;gap:8px}
.retcard .retcard-text{display:inline-flex;flex-direction:column;gap:1px}
.retcard .good-icon{width:22px;height:22px}

/* Featured Profit/Min column, the headline metric */
th.featured{
  background:#1f1108;
  color:var(--gold-light);
  border-top:1px solid var(--gold);
  border-bottom:2px solid var(--gold);
  font-size:11px;
  letter-spacing:2px;
  position:relative;
}
th.featured::before{
  content:"✮";
  position:absolute;
  top:2px;left:50%;
  transform:translateX(-50%);
  font-size:8px;
  color:var(--gold);
  opacity:.7;
}
td.featured{
  background:rgba(61,142,255,.07) !important;
  border-left:1px solid var(--gold-soft);
  border-right:1px solid var(--gold-soft);
  font-size:13px;
  font-weight:700;
  letter-spacing:.3px;
  color:var(--gold-light);
}
tbody tr:hover td.featured{background:rgba(61,142,255,.13) !important}
td.featured.profit{color:var(--green);text-shadow:0 0 10px rgba(180,204,98,.25)}
td.featured.loss{color:var(--red);text-shadow:0 0 10px rgba(217,107,90,.25)}
.no-rows{text-align:center;padding:48px;color:var(--cream-dim);font-family:'Cinzel',serif;font-weight:600;font-size:13px;letter-spacing:3px}

/* City badges (now subtle gold-trimmed pills) */
.badge{
  display:inline-block;
  padding:2px 9px;
  border-radius:0;
  font-size:11px;
  font-weight:600;
  letter-spacing:.5px;
  font-family:'Cinzel',serif;
  border:1px solid;
}

/* Return cargo cell, small card */
.retcell{
  padding:5px 10px !important;
  font-size:10.5px !important;
}
.retcard{
  display:inline-flex;
  flex-direction:column;
  gap:1px;
  padding:4px 10px;
  background:rgba(0,0,0,.1);
  border:1px solid var(--gold-deep);
  border-left:2px solid var(--gold-soft);
  line-height:1.3;
}
.retcard .rname{color:var(--cream);font-size:10.5px;letter-spacing:.3px}
.retcard .rprofit{color:var(--green);font-size:10px;font-weight:600}
.retcard.empty{color:var(--muted);border-left-color:var(--muted)}

/* Mobile card view, hidden on desktop */
#routeCards{display:none}

/* Expand row (return trip detail) */
tbody tr:not(.expand-row){cursor:pointer}
.expand-row{display:none}
.expand-row.open{display:table-row}
tr.row-expanded td{border-bottom-color:transparent !important;border-top:2px solid var(--gold-soft) !important}
tr.row-expanded td:first-child{border-left:3px solid var(--gold-soft) !important}
tr.row-expanded td:last-child{border-right:3px solid var(--gold-soft) !important}
.expand-td{
  background:rgba(0,0,0,.28) !important;
  border-top:none !important;
  border-bottom:2px solid var(--gold-soft) !important;
  padding:8px 10px !important;
  font-size:11px;
  vertical-align:middle;
}
.exp-first{border-left:3px solid var(--gold-soft) !important}
.exp-last{border-right:3px solid var(--gold-soft) !important}
.expand-label{
  display:block;font-size:8px;letter-spacing:2px;
  text-transform:uppercase;color:var(--gold-soft);margin-bottom:5px;
}
.expand-empty{font-size:11px;color:var(--dim);font-style:italic}
.exp-total{text-align:center !important;vertical-align:middle !important}
.exp-total-label{display:block;font-family:'Cinzel',serif;font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-soft);margin-bottom:4px}
.exp-total-val{font-family:'Cinzel',serif;font-size:15px;font-weight:600;letter-spacing:.5px}
.exp-total-rate{display:block;font-family:'Cinzel',serif;font-size:10px;letter-spacing:.5px;margin-top:3px;opacity:.8}
.exp-total .profit{color:var(--green)}
.exp-total .loss{color:var(--red)}

/* Tooltip */
[data-tip]{position:relative;cursor:help}
[data-tip]:hover::after{
  content:attr(data-tip);
  position:absolute;
  bottom:calc(100% + 6px);
  left:0;
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  padding:6px 10px;
  border-radius:0;
  font-size:10px;
  color:var(--cream);
  white-space:nowrap;
  z-index:200;
  pointer-events:none;
  letter-spacing:.5px;
  box-shadow:0 4px 12px rgba(0,0,0,.7);
  font-family:'Cinzel',serif;
  text-transform:none;
}

/* Events panel */
#eventsPanel{display:none;flex:1;overflow:auto;padding:20px 26px;flex-direction:column;gap:14px}

/* Prices mode toggle */
.prices-mode-toggle{display:inline-flex;border:1px solid var(--gold-deep);overflow:hidden;border-radius:3px}
.pmt-btn{
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;
  padding:8px 18px;cursor:pointer;border:none;
  background:transparent;color:var(--gold-soft);
  transition:background .12s,color .12s;
}
.pmt-btn.active{background:#13284a;color:var(--gold-light)}
.pmt-btn + .pmt-btn{border-left:1px solid var(--gold-deep)}
.prices-mode-hint{font-family:'Cormorant Garamond',serif;font-size:12px;font-style:italic;color:var(--dim)}
body .prices-mode-toggle{border-color:#2a3445}
body .pmt-btn{color:#7fb3ff}
body .pmt-btn.active{background:#0a0c10;color:#e0edff}
body .pmt-btn + .pmt-btn{border-left-color:#2a3445}

/* Prices panel */
#pricesPanel{
  display:none;
  flex:1;
  min-height:0;
  overflow:hidden;
  padding:14px 20px 14px;
  flex-direction:column;
  gap:10px;
}
.prices-head-row{
  display:flex;
  align-items:center;
  gap:16px;
  flex-shrink:0;
  flex-wrap:wrap;
}
#pricesGrid{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overflow-x:auto;
  border:1px solid var(--gold-deep);
  background:rgba(20,12,4,.4);
  box-shadow:inset 0 0 14px rgba(0,0,0,.35);
}

/* Price matrix table */
.pt2-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-family:'Cinzel',serif;
}
.pt2-th-good,.pt2-th-city{
  background:#1c0e07;
  border-bottom:2px solid var(--gold);
  border-right:1px solid rgba(31,92,196,.3);
  color:var(--gold-light);
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  font-weight:600;
  padding:9px 8px 7px;
  text-align:center;
  white-space:nowrap;
  position:sticky;
  top:0;
  z-index:2;
}
.pt2-th-good{
  text-align:left;
  padding-left:14px;
  width:140px;
  z-index:3;
}
.pt2-city-culture{
  display:block;
  font-family:'Cormorant Garamond',serif;
  font-size:9px;
  font-style:italic;
  font-weight:400;
  color:var(--cream-dim);
  letter-spacing:.2px;
  margin-top:2px;
  text-transform:none;
}
.pt2-origin-th{
  background:rgba(13,24,42,.7) !important;
  color:var(--gold-light);
  border-bottom-color:var(--gold-light);
}

/* Type separator rows */
.pt2-type-row td{
  padding:3px 14px;
  font-size:8px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-soft);
  background:rgba(0,0,0,.28);
  border-bottom:1px solid rgba(31,92,196,.2);
  border-top:1px solid rgba(31,92,196,.2);
  font-family:'Cinzel',serif;
}

/* Data rows */
.pt2-row td{
  border-bottom:1px solid rgba(31,92,196,.15);
  border-right:1px solid rgba(31,92,196,.15);
  padding:0;
  vertical-align:middle;
  text-align:center;
  height:30px;
}
.pt2-row:nth-child(even) .pt2-price-cell{background:rgba(0,0,0,.1)}
.pt2-row:hover .pt2-td-good,
.pt2-row:hover .pt2-price-cell{background:rgba(61,142,255,.06) !important}

.pt2-td-good{
  text-align:left;
  padding:0 8px 0 14px;
  font-size:11px;
  letter-spacing:.5px;
  color:var(--cream);
  background:rgba(0,0,0,.18);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  border-right:1px solid rgba(31,92,196,.3) !important;
}

/* Price cells */
.pt2-price-cell{
  position:relative;
}
.pt2-val{
  display:block;
  font-size:13px;
  font-weight:600;
  font-variant-numeric:tabular-nums;
  letter-spacing:.2px;
  line-height:30px;
}

/* Buy mode */
.pt2-table.mode-buy .pt2-price-cell{background:rgba(217,107,90,.04)}
.pt2-table.mode-buy .pt2-val{color:#fca5a5}
/* Sell mode */
.pt2-table.mode-sell .pt2-price-cell{background:rgba(122,217,122,.04)}
.pt2-table.mode-sell .pt2-val{color:var(--green)}

/* Locally produced in that city */
.pt2-produced .pt2-val{opacity:.45}

/* Not available to buy (luxury elsewhere) */
.pt2-unavail .pt2-val{color:var(--muted) !important;font-size:11px;letter-spacing:0;opacity:.5}

/* Current city column */
.pt2-origin-col{
  border-left:2px solid var(--gold) !important;
  border-right:2px solid var(--gold) !important;
  background:rgba(61,142,255,.08) !important;
}
.pt2-table.mode-buy .pt2-origin-col{background:rgba(61,142,255,.12) !important}
.pt2-table.mode-sell .pt2-origin-col{background:rgba(61,142,255,.12) !important}

/* Event indicator dot */
.pt2-event-dot{
  position:absolute;
  top:5px;right:5px;
  width:5px;height:5px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 5px rgba(127,179,255,.8);
  pointer-events:none;
}
.pt2-event-dot.dir-down{background:var(--green);box-shadow:0 0 5px rgba(122,217,122,.7)}

/* Slate theme overrides */
body #pricesGrid{background:#0c0f14;border-color:#1f2a3a;box-shadow:none}
body .pt2-th-good,
body .pt2-th-city{background:#10141c;border-bottom-color:#3d8eff;border-right-color:#1f2530;color:#d0e4ff;letter-spacing:1.2px}
body .pt2-origin-th{background:#10141c !important;color:#7fb3ff;border-bottom-color:#3d8eff}
body .pt2-city-culture{color:#6b82a8}
body .pt2-type-row td{background:#0a0c12;color:#4a6080;border-color:#1f2530}
body .pt2-row td{border-color:#1a2030}
body .pt2-td-good{background:#0a0c12;color:#c8d8f0;border-right-color:#1f2530 !important}
body .pt2-row:nth-child(even) .pt2-price-cell{background:rgba(0,0,0,.15)}
body .pt2-table.mode-buy .pt2-price-cell{background:rgba(248,113,113,.03)}
body .pt2-table.mode-buy .pt2-val{color:#fca5a5}
body .pt2-table.mode-sell .pt2-price-cell{background:rgba(52,211,153,.03)}
body .pt2-table.mode-sell .pt2-val{color:#86efac}
body .pt2-origin-col{border-color:#3d8eff !important;background:rgba(61,142,255,.07) !important}
body .pt2-table.mode-buy .pt2-origin-col,
body .pt2-table.mode-sell .pt2-origin-col{background:rgba(61,142,255,.12) !important}
body .pt2-event-dot{background:#5b9eff;box-shadow:0 0 5px rgba(91,158,255,.8)}
body .pt2-event-dot.dir-down{background:#86efac;box-shadow:0 0 5px rgba(52,211,153,.7)}
/* Events tab */
.ev-desc{font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--cream-dim);line-height:1.6;max-width:680px}
.ev-desc b{color:var(--gold-light)}
.ev-legend{display:flex;flex-wrap:wrap;gap:6px}
.ev-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--gold-deep);background:rgba(61,142,255,.04)}
.ev-chip.dir-down{border-color:rgba(100,200,100,.3);background:rgba(10,50,10,.3)}
.ev-chip-glyph{font-size:13px;line-height:1}
.ev-chip-label{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--gold-soft)}
.ev-chip.dir-down .ev-chip-label{color:var(--green)}
.ev-chip-sub{font-family:'Cormorant Garamond',serif;font-size:11px;color:var(--muted)}
/* Event row list */
.evlist{display:flex;flex-direction:column;border:1px solid rgba(31,92,196,.35);overflow:hidden}
.evrow{display:flex;align-items:center;min-height:58px;border-bottom:1px solid rgba(31,92,196,.2);background:rgba(20,13,5,.5);position:relative;overflow:hidden}
.evrow:last-child{border-bottom:none}
.evrow.active{background:rgba(42,26,7,.6)}
.evrow.active.dir-down{background:rgba(8,30,8,.55)}
.evrow-accent{width:3px;align-self:stretch;flex-shrink:0;background:rgba(31,92,196,.3)}
.evrow.active .evrow-accent{background:var(--gold)}
.evrow.active.dir-down .evrow-accent{background:#7ad97a}
.evrow.active.is-low .evrow-accent{background:#fca5a5}
.evrow-city{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-soft);width:100px;flex-shrink:0;padding:0 14px}
.evrow.active .evrow-city{color:var(--gold)}
.evrow.active.dir-down .evrow-city{color:var(--green)}
.evrow-mid{flex:1;display:flex;align-items:center;gap:10px;padding:10px 0;min-width:0}
.evrow-glyph{font-size:22px;line-height:1;flex-shrink:0}
.evrow-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.evrow-ename{font-family:'Cinzel',serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-light)}
.evrow-elevel{font-family:'Cormorant Garamond',serif;font-size:13px;color:var(--cream-dim)}
.evrow-selects{display:flex;gap:6px;flex:1;max-width:360px}
.evrow-selects select{background:rgba(16,9,2,.7);color:var(--cream);border:1px solid rgba(31,92,196,.5);padding:7px 8px;font-family:'Cormorant Garamond',serif;font-size:13px;min-width:0;flex:1}
.evrow-selects select:first-child{flex:1.8}
.evrow-dur{display:flex;gap:4px;align-items:center}
.evrow-dur .btn-preset{padding:5px 9px;font-size:9px;letter-spacing:.5px}
.evrow-dur .btn-preset.sel{background:rgba(31,92,196,.55);border-color:var(--gold-soft);color:var(--gold-light)}
.evrow-right{display:flex;align-items:center;gap:10px;padding:0 16px;flex-shrink:0}
.evc-timer{font-family:'Cinzel',serif;font-size:19px;letter-spacing:1px;font-variant-numeric:tabular-nums;color:var(--gold);min-width:54px;text-align:right}
.evrow.active.dir-down .evc-timer{color:var(--green)}
.evrow.active.is-low .evc-timer{color:#fca5a5;text-shadow:0 0 8px rgba(217,107,90,.5)}
.evc-btn-clear{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;padding:6px 13px;cursor:pointer;background:rgba(50,15,10,.6);color:var(--red);border:1px solid #3a1722;white-space:nowrap}
.evc-btn-clear:hover{border-color:#f87171;color:#fca5a5}
.evrow-btn-start{font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;padding:7px 14px;cursor:pointer;background:#13284a;color:var(--gold-light);border:1px solid var(--gold-deep);white-space:nowrap}
.evrow-btn-start:hover{border-color:var(--gold);color:var(--gold)}
.evrow-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:rgba(0,0,0,.4)}
.evcard-progress-fill{height:100%;background:var(--gold-light);box-shadow:0 0 6px rgba(127,179,255,.4);transition:width 1s linear}
.evrow.active.dir-down .evcard-progress-fill{background:#4da84d;box-shadow:0 0 6px rgba(122,217,122,.4)}
.evrow.active.is-low .evcard-progress-fill{background:#fca5a5;box-shadow:0 0 8px rgba(217,107,90,.6)}
.btn-preset{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.5px;padding:6px 10px;cursor:pointer;background:rgba(13,24,42,.6);color:var(--gold-soft);border:1px solid var(--gold-deep);text-transform:uppercase;white-space:nowrap}
.btn-preset:hover{border-color:var(--gold-soft);color:var(--gold)}

/* Event indicator on city badges in the table */
.event-tag{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;
  margin-left:6px;
  font-size:11px;
  border:1px solid var(--gold);
  background:rgba(31,92,196,.6);
  color:var(--gold-light);
  border-radius:50%;
  vertical-align:middle;
  cursor:help;
}
.event-tag.dir-down{background:rgba(40,90,40,.6);border-color:#7ad97a;color:#cfe9cf}

/* Event floater.. active timers pinned to the right side */
#eventFloater{
  position:fixed;
  right:0;
  top:65%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:8px;
  z-index:900;
  padding:0;
  pointer-events:none;
}
#eventFloater:empty{display:none}

.ef-pill{
  pointer-events:auto;
  position:relative;
  display:flex;
  align-items:stretch;
  min-width:220px;
  max-width:260px;
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  border-right:none;
  box-shadow:
    inset 0 0 0 1px rgba(127,179,255,.06),
    inset 0 0 22px rgba(0,0,0,.5),
    -3px 4px 18px rgba(0,0,0,.55);
  transform:translateX(0);
  animation:ef-slide-in .35s cubic-bezier(.2,.8,.3,1) both;
  overflow:hidden;
  font-family:'Cinzel',serif;
}
@keyframes ef-slide-in{
  from{transform:translateX(110%);opacity:0}
  to{transform:translateX(0);opacity:1}
}

/* Glyph block on the left */
.ef-glyph{
  display:flex;
  align-items:center;
  justify-content:center;
  width:46px;
  flex-shrink:0;
  background:rgba(61,142,255,.04);
  border-right:1px solid var(--gold-deep);
  font-size:22px;
  color:var(--gold-light);
  text-shadow:0 0 12px rgba(127,179,255,.55), 0 1px 0 #000;
  line-height:1;
}
.ef-pill[data-dir="down"] .ef-glyph{
  background:rgba(122,217,122,.03);
  color:#cfe9cf;
  text-shadow:0 0 10px rgba(122,217,122,.55), 0 1px 0 #000;
  border-right-color:rgba(122,217,122,.25);
}

/* Info column */
.ef-info{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:8px 10px 9px;
  min-width:0;
}
.ef-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.ef-name{
  font-family:'Cinzel',serif;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--gold-light);
  text-shadow:0 1px 0 #000;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.1;
}
.ef-city{
  font-family:'Cormorant Garamond',serif;
  font-size:12px;
  font-style:italic;
  color:var(--cream-dim);
  letter-spacing:.4px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ef-meta{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
  margin-top:3px;
}
.ef-time{
  font-family:'Cinzel',serif;
  font-size:18px;
  font-weight:700;
  letter-spacing:1.2px;
  font-variant-numeric:tabular-nums;
  color:var(--gold);
  line-height:1;
  text-shadow:0 1px 0 #000;
}
.ef-level{
  font-family:'Cinzel',serif;
  font-size:8.5px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--cream-dim);
  padding:2px 7px;
  border:1px solid var(--gold-deep);
  background:rgba(0,0,0,.3);
  white-space:nowrap;
}

/* Close button */
.ef-close{
  position:absolute;
  top:5px;
  right:6px;
  width:18px;height:18px;
  display:flex;align-items:center;justify-content:center;
  background:transparent;
  border:1px solid transparent;
  color:var(--cream-dim);
  font-family:inherit;
  font-size:11px;
  line-height:1;
  cursor:pointer;
  opacity:0;
  transition:opacity .15s, background .12s, color .12s, border-color .12s;
  padding:0;
}
.ef-pill:hover .ef-close{opacity:1}
.ef-close:hover{
  background:rgba(217,107,90,.18);
  border-color:#b91c1c;
  color:#fca5a5;
}

/* Progress bar across bottom */
.ef-progress{
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background:rgba(0,0,0,.5);
  border-top:1px solid rgba(0,0,0,.6);
}
.ef-progress-fill{
  height:100%;
  background:var(--gold-light);
  box-shadow:0 0 8px rgba(127,179,255,.55);
  transform-origin:left center;
  transition:width 1s linear;
}
.ef-pill[data-dir="down"] .ef-progress-fill{
  background:var(--green);
  box-shadow:0 0 8px rgba(122,217,122,.5);
}

/* Low time urgency pulse (last 5 min) */
.ef-pill.is-low{
  border-color:#f87171;
  box-shadow:
    inset 0 0 0 1px rgba(217,107,90,.3),
    inset 0 0 22px rgba(0,0,0,.5),
    -3px 4px 18px rgba(0,0,0,.55),
    0 0 16px rgba(217,107,90,.25);
  animation:ef-slide-in .35s cubic-bezier(.2,.8,.3,1) both, ef-pulse 1.5s ease-in-out infinite;
}
.ef-pill.is-low .ef-time{color:#fca5a5;text-shadow:0 0 12px rgba(217,107,90,.6), 0 1px 0 #000}
.ef-pill.is-low .ef-glyph{
  background:rgba(217,107,90,.04);
  border-right-color:rgba(217,107,90,.4);
}
.ef-pill.is-low .ef-progress-fill{
  background:#fca5a5;
  box-shadow:0 0 10px rgba(217,107,90,.7);
}
@keyframes ef-pulse{
  0%,100%{box-shadow:inset 0 0 0 1px rgba(217,107,90,.3),inset 0 0 22px rgba(0,0,0,.5),-3px 4px 18px rgba(0,0,0,.55),0 0 16px rgba(217,107,90,.25)}
  50%   {box-shadow:inset 0 0 0 1px rgba(217,107,90,.5),inset 0 0 22px rgba(0,0,0,.5),-3px 4px 18px rgba(0,0,0,.55),0 0 26px rgba(217,107,90,.55)}
}

/* Slate theme overrides */
body .ef-pill{
  background:#0a0c10;
  border:1px solid #2a3445;
  border-right:none;
  border-radius:8px 0 0 8px;
  box-shadow:-2px 4px 14px rgba(0,0,0,.5);
}
body .ef-glyph{
  background:rgba(61,142,255,.10);
  border-right-color:#1f2530;
  color:var(--gold-light);
  text-shadow:none;
}
body .ef-pill[data-dir="down"] .ef-glyph{
  background:rgba(52,211,153,.10);
  color:#86efac;
  text-shadow:none;
  border-right-color:rgba(52,211,153,.20);
}
body .ef-name{color:var(--cream);text-shadow:none;letter-spacing:.5px;font-weight:600}
body .ef-city{color:var(--cream-dim)}
body .ef-time{color:var(--gold-light);text-shadow:none}
body .ef-level{
  border:1px solid #2a3445;
  background:#0a0c10;
  color:var(--cream-dim);
  border-radius:4px;
  letter-spacing:1px;
}
body .ef-close{
  border-radius:4px;
  border-color:transparent;
}
body .ef-close:hover{
  background:rgba(248,113,113,.15);
  border-color:#5a2828;
  color:#fca5a5;
}
body .ef-progress{background:#0a0c10}
body .ef-progress-fill{
  background:#5b9eff;
  box-shadow:0 0 6px rgba(91,158,255,.4);
}
body .ef-pill[data-dir="down"] .ef-progress-fill{
  background:#34d399;
  box-shadow:0 0 6px rgba(52,211,153,.4);
}
body .ef-pill.is-low{
  border-color:#f87171;
  box-shadow:-2px 4px 14px rgba(0,0,0,.5), 0 0 14px rgba(248,113,113,.18);
}
body .ef-pill.is-low .ef-time{color:#fca5a5;text-shadow:none}
body .ef-pill.is-low .ef-progress-fill{
  background:#fca5a5;
}

@media (max-width:640px){
  #eventFloater{
    top:auto;bottom:12px;
    transform:none;
    left:8px;right:8px;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:flex-end;
    justify-content:flex-end;
  }
  .ef-pill{
    border-right:1px solid var(--gold-soft);
    min-width:0;flex:1 1 200px;
    max-width:none;
  }
  body .ef-pill{border-radius:8px;border-right:1px solid #2a3445}
}

/* Slate theme: events */
body .evlist{border-color:#1f2530}
body .evrow{background:#13161c;border-bottom-color:#1f2530}
body .evrow.active{background:rgba(61,142,255,.06)}
body .evrow.active .evrow-accent{background:#3d8eff}
body .evrow.active.dir-down{background:rgba(0,180,80,.05)}
body .evrow.active.dir-down .evrow-accent{background:#34d399}
body .evc-timer{color:#7fb3ff}
body .evrow.active.dir-down .evc-timer{color:#34d399}
body .evrow-selects select{background:#0a0c10;border-color:#2a3445;color:var(--cream)}
body .evc-btn-clear{background:#13161c;border-color:#4a2535;color:#f87171}
body .evc-btn-clear:hover{background:#1e1020;border-color:#7a3545}
body .evrow-btn-start{background:#142133;color:var(--blue);border-color:#2a3a52}
body .evrow-btn-start:hover{border-color:var(--blue)}
body .event-tag{background:#142133;border-color:var(--blue);color:var(--blue)}
body .event-tag.dir-down{background:#0e1e14;border-color:#5fcc7e;color:#a8e9b4}

/* Settings + About panels */
#settingsPanel, #aboutPanel{display:none;flex:1;overflow:auto;padding:32px 40px}
.set-h{
  font-family:'Cinzel',serif;
  font-weight:700;
  font-size:13px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-light);
  border-bottom:1px solid var(--gold-deep);
  padding-bottom:8px;
  margin-bottom:14px;
  margin-top:28px;
}
.set-h:first-child{margin-top:0}
.set-p{
  font-size:12px;
  line-height:1.9;
  color:var(--cream);
  max-width:700px;
}
.set-p strong{color:var(--gold-light);letter-spacing:.5px}
.set-btns{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
.setup-block{margin-bottom:14px}
.setup-label{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:6px;font-family:'Cinzel',serif}
.setup-row{display:flex;gap:8px;align-items:center}
.setup-row input[type=text]{flex:1;max-width:280px}
.setup-row select{flex:1;max-width:280px}

/* About */
#aboutPanel .about-hero{
  text-align:center;
  padding:30px 0 12px;
  font-family:'Cinzel',serif;
  font-weight:700;
  color:var(--gold-light);
  font-size:22px;
  letter-spacing:5px;
  text-transform:uppercase;
  text-shadow:0 1px 0 #000, 0 0 24px rgba(61,142,255,.35);
}
#aboutPanel .about-sub{
  text-align:center;
  color:var(--cream-dim);
  font-size:11px;
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:30px;
}
#aboutPanel .about-sub::before, #aboutPanel .about-sub::after{
  content:"❦";color:var(--gold-soft);margin:0 14px;
}

.credits-card{
  max-width:380px;
  margin:0 auto;
  padding:24px 28px 22px;
  text-align:center;
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  box-shadow:
    inset 0 0 0 1px rgba(127,179,255,.06),
    inset 0 0 30px rgba(0,0,0,.5),
    0 6px 20px rgba(0,0,0,.5);
  position:relative;
}
.credits-card::before, .credits-card::after{
  content:"❦";
  position:absolute;
  top:-1px;
  color:var(--gold-soft);
  background:#1a0e07;
  padding:0 10px;
  font-size:11px;
  transform:translateY(-50%);
}
.credits-card::before{left:24px}
.credits-card::after{right:24px}
.credits-label{
  font-family:'Cinzel',serif;
  font-size:10px;
  font-weight:600;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--cream-dim);
  margin-bottom:8px;
}
.credits-name{
  font-family:'Cinzel',serif;
  font-size:26px;
  font-weight:700;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-light);
  line-height:1;
}
.credits-handle{
  font-family:'Cinzel',serif;
  font-size:12px;
  letter-spacing:2px;
  color:var(--cream-dim);
  margin-top:4px;
  margin-bottom:18px;
}
.credits-analyst{
  font-family:'Cinzel',serif;
  font-size:17px;
  font-weight:600;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:4px;
}
.credits-team-box{
  border:1px solid var(--gold-deep);
  background:rgba(61,142,255,.05);
  border-radius:6px;
  padding:18px 24px 16px;
  margin-bottom:22px;
}
@keyframes credits-glow-gold{
  0%,100%{text-shadow:0 1px 0 #000, 0 0 12px rgba(61,142,255,.2)}
  50%{text-shadow:0 1px 0 #000, 0 0 28px rgba(127,179,255,.6), 0 0 8px rgba(61,142,255,.4)}
}
.credits-team-box .credits-name,
.credits-team-box .credits-analyst{
  animation:credits-glow-gold 3s ease-in-out infinite;
}
body .credits-team-box{
  border-color:#2a3445;
  background:rgba(61,142,255,.05);
}
@keyframes credits-glow-blue{
  0%,100%{text-shadow:0 0 8px rgba(61,142,255,.15)}
  50%{text-shadow:0 0 22px rgba(61,142,255,.55), 0 0 8px rgba(100,180,255,.3)}
}
body .credits-team-box .credits-name,
body .credits-team-box .credits-analyst{
  animation:credits-glow-blue 3s ease-in-out infinite;
}
.credits-divider{
  border:none;
  border-top:1px solid var(--gold-deep);
  margin:14px auto 14px;
  width:50%;
  opacity:.5;
}
.credits-special-thanks{
  font-family:'Cinzel',serif;
  font-size:10px;
  font-weight:600;
  letter-spacing:4px;
  text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:14px;
}
.credits-analyst-role{
  font-family:'Cormorant Garamond',serif;
  font-size:12px;
  font-style:italic;
  letter-spacing:.6px;
  color:var(--cream-dim);
  margin-bottom:18px;
}
.discord-btn{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 20px;
  font-family:'Cinzel',serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:2px;
  text-transform:uppercase;
  color:#e8eaff;
  background:#404bd1;
  border:1px solid #7b86ff;
  text-decoration:none;
  cursor:pointer;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.2),
    0 2px 0 #2c34a0,
    0 4px 12px rgba(88,101,242,.35);
  transition:transform .1s, box-shadow .15s, background .15s;
}
.discord-btn:hover{
  background:#4a55e0;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 2px 0 #2c34a0,
    0 6px 18px rgba(88,101,242,.5);
}
.discord-btn:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 0 #2c34a0}
.discord-btn svg{flex-shrink:0}
.credits-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.wiki-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 18px;
  background:#1f5cc4;
  color:#fff;
  font-family:'Cinzel',serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:.5px;
  text-decoration:none;
  border:1px solid #2858a8;
  border-radius:4px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 1px 0 #13284a,
    0 3px 10px rgba(31,92,196,.4);
  transition:transform .1s, box-shadow .15s, background .15s;
}
.wiki-btn:hover{
  background:#3d8eff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 1px 0 #13284a,
    0 6px 18px rgba(31,92,196,.5);
}
.wiki-btn:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 0 #13284a}
.wiki-btn svg{flex-shrink:0}

/* Helpers */
.hidden{display:none !important}

/* New features (v1.1) */


/* Here-marker (current city in table) */
.here-marker{
  color:var(--gold-light);
  font-size:14px;
  margin-right:6px;
  vertical-align:middle;
}
tr.here-row td{background:rgba(61,142,255,.04)}

/* Best Round-Trip card */
#bestLoopCard{
  margin:10px 14px;
  border:1px solid var(--gold-soft);
  background:rgba(58,37,22,.55);
  position:relative;
}
#bestLoopCard:empty{display:none}
#bestLoopCard::before, #bestLoopCard::after{
  content:"";position:absolute;width:8px;height:8px;background:var(--gold);
  transform:rotate(45deg);
}
#bestLoopCard::before{top:-4px;left:-4px}
#bestLoopCard::after{bottom:-4px;right:-4px}
.loop-empty{padding:18px;text-align:center;color:var(--muted);font-style:italic;font-family:'Cormorant Garamond',serif}
.loop-head{
  display:flex;align-items:center;gap:14px;
  padding:6px 18px;
  border-bottom:1px solid var(--gold-deep);
  background:rgba(0,0,0,.18);
}
.loop-crown{color:var(--gold-light);font-size:16px}
.loop-title{
  font-family:'Cinzel',serif;font-weight:600;font-size:12px;
  letter-spacing:3px;text-transform:uppercase;color:var(--gold-light);
  flex:1;
}
.loop-ppm{
  font-family:'Cinzel',serif;font-weight:700;font-size:20px;color:var(--green);
  text-shadow:0 0 14px rgba(122,217,122,.4);
  line-height:1;
}
.loop-ppm .loop-unit{font-size:11px;font-weight:500;color:var(--cream-dim);margin-left:4px;text-shadow:none}
.loop-body{
  display:grid;
  grid-template-columns:1fr auto 1fr auto auto;
  gap:14px;
  align-items:center;
  padding:10px 18px 12px;
}
.loop-leg-h{
  font-family:'Cinzel',serif;font-size:9px;letter-spacing:2px;text-transform:uppercase;
  color:var(--cream-dim);margin-bottom:4px;
}
.loop-leg-inline{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.loop-leg-route{display:flex;align-items:center;gap:8px}
.loop-arrow{color:var(--gold);font-weight:700}
.loop-leg-cargo{display:flex;align-items:center;gap:6px;font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:600;color:var(--cream);line-height:1.2}
.loop-leg-cargo img.good-icon{width:16px;height:16px}
.loop-leg-stats{font-family:'Cormorant Garamond',serif;font-size:12px;color:var(--cream-dim);font-style:italic;line-height:1.2}
.loop-divider{width:1px;background:var(--gold-deep);align-self:stretch}
.loop-totals{display:flex;flex-direction:column;gap:1px;min-width:150px;padding-left:6px}
.loop-totals-row{display:flex;justify-content:space-between;gap:14px;font-size:10px;color:var(--cream-dim);font-family:'Cinzel',serif;letter-spacing:1px;text-transform:uppercase;line-height:1.4}
.loop-totals-row b{color:var(--cream);font-weight:600;font-size:11px}
.loop-totals-row.big{margin-top:2px;padding-top:3px;border-top:1px solid var(--gold-deep)}
.loop-totals-row.big b{font-size:15px}
.loop-totals-row .profit{color:var(--green) !important}

button.loop-head.loop-head-toggle{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  border:none;
  margin:0;
  font:inherit;
  color:inherit;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
}
button.loop-head.loop-head-toggle .rct-chevron{
  display:inline-block;width:0;height:0;
  border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid currentColor;
  opacity:.75;transition:transform .15s ease;transform-origin:50% 35%;
  flex-shrink:0;
}
button.loop-head.loop-head-toggle.is-collapsed .rct-chevron{transform:rotate(-90deg)}
button.loop-head.loop-head-toggle:hover{background:rgba(61,142,255,.08)}

.loop-head-collapsed{border-bottom:none}
.loop-collapsed-summary{
  display:flex;align-items:center;gap:10px;
  flex:1;
  font-family:'Cormorant Garamond',serif;
  font-size:14px;
  color:var(--cream);
}
.loop-collapsed-cargo{display:flex;align-items:center;gap:4px}
.loop-collapsed-cargo img.good-icon{width:18px;height:18px}
.loop-collapsed-arrow{color:var(--gold-soft)}
.loop-head-collapsed .loop-title{flex:0 0 auto}

/* Tools panel */
#toolsPanel{padding:18px 24px;display:none;overflow-y:auto;min-height:0;flex:1}
.planner-empty{margin-top:14px;padding:16px;color:var(--muted);font-style:italic;font-family:'Cormorant Garamond',serif;text-align:center;border:1px dashed var(--gold-deep)}
#courierResult{margin-top:18px}
#optimalResult{margin-top:18px}

.trip-card{
  border:1px solid var(--gold-soft);
  background:rgba(58,37,22,.4);
  padding:16px;
}
.trip-summary{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  padding-bottom:14px;
  border-bottom:1px solid var(--gold-deep);
  margin-bottom:14px;
}
.trip-stat{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.trip-stat span{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cream-dim)}
.trip-stat b{font-family:'Cinzel',serif;font-size:16px;color:var(--cream);font-weight:600}
.trip-stat.big b{font-size:22px;color:var(--green)}
.trip-stat .profit{color:var(--green)}

.trip-legs{display:flex;flex-direction:column;gap:6px}
.trip-end-note{
  margin:-4px 0 12px;
  padding:8px 12px;
  background:rgba(61,142,255,.08);
  border:1px solid var(--gold-deep);
  border-left:3px solid var(--gold);
  font-family:'Cormorant Garamond',serif;
  font-size:13px;
  color:var(--cream-dim);
  font-style:italic;
}
.trip-end-note b{color:var(--gold-light);font-style:normal;font-weight:700}

.onward-card{
  margin-top:18px;
  padding-top:14px;
  border-top:1px dashed var(--gold-deep);
}
.onward-h{
  font-family:'Cinzel',serif;font-weight:600;font-size:11px;
  letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-light);
  margin-bottom:10px;
}
.onward-body{
  display:grid;
  grid-template-columns:1fr auto 1fr auto auto;
  gap:14px;
  align-items:center;
  padding:10px 14px;
  background:rgba(61,142,255,.05);
  border:1px solid var(--gold-deep);
}
.onward-leg-h{font-family:'Cinzel',serif;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--cream-dim);margin-bottom:4px}
.onward-leg-route{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.onward-leg-cargo{display:flex;align-items:center;gap:6px;font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:600;color:var(--cream);margin-bottom:2px}
.onward-leg-cargo img.good-icon{width:16px;height:16px}
.onward-leg-stats{font-family:'Cormorant Garamond',serif;font-size:12px;color:var(--cream-dim);font-style:italic}
.onward-divider{width:1px;background:var(--gold-deep);align-self:stretch}
.onward-totals{display:flex;flex-direction:column;gap:2px;min-width:140px;padding-left:6px}
.onward-totals-row{display:flex;justify-content:space-between;gap:14px;font-size:10px;color:var(--cream-dim);font-family:'Cinzel',serif;letter-spacing:1px;text-transform:uppercase;line-height:1.4}
.onward-totals-row b{color:var(--cream);font-weight:600;font-size:11px}
.onward-totals-row.big{margin-top:2px;padding-top:3px;border-top:1px solid var(--gold-deep)}
.onward-totals-row.big b{font-size:14px}
.onward-totals-row .profit{color:var(--green) !important}
.trip-leg{
  display:flex;gap:14px;align-items:flex-start;
  padding:10px 12px;
  background:rgba(0,0,0,.18);
  border:1px solid var(--gold-deep);
}
.trip-leg-num{
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--gold-dark);
  color:#1c100a;font-family:'Cinzel',serif;font-weight:700;font-size:13px;
  flex-shrink:0;
}
.trip-leg-body{flex:1;min-width:0}
.trip-leg-route{display:flex;gap:8px;align-items:center;margin-bottom:4px}
.trip-leg-cargo{display:flex;gap:6px;align-items:center;font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:600;color:var(--cream);margin-bottom:2px}
.trip-leg-cargo img.good-icon{width:16px;height:16px}
.trip-leg-stats{font-family:'Cormorant Garamond',serif;font-size:12px;color:var(--cream-dim);font-style:italic}
.trip-arrow{text-align:center;color:var(--gold);font-size:14px;line-height:1}

/* Courier Route Planner */
.courier-quest-block{margin:14px 0 8px;padding:12px 14px;border:1px solid var(--gold-deep);background:rgba(0,0,0,.12)}
.courier-quest-block-title{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--cream-dim);margin-bottom:10px}
.courier-quest-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.courier-quest-row:last-child{margin-bottom:0}
.courier-quest-check{display:flex;align-items:center;gap:7px;cursor:pointer;min-width:130px;flex-shrink:0}
.courier-quest-label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cream-dim)}
.courier-quest-check input[type=checkbox]:checked ~ .courier-quest-label{color:var(--gold-light)}
.courier-quest-badge{display:inline-block;padding:1px 6px;border-radius:2px;font-family:'Cinzel',serif;font-size:9px;letter-spacing:1px;font-weight:700;text-transform:uppercase;margin-right:4px}
.courier-quest-badge.short{background:#1a3010;color:var(--green);border:1px solid #3f7a3a}
.courier-quest-badge.long{background:#1a1a40;color:#9ab8ef;border:1px solid #2a3a80}
.courier-quest-row select:disabled{opacity:.35;pointer-events:none}

.courier-delivery-event{margin:2px 0}
.courier-delivery-badge{display:flex;align-items:center;gap:10px;padding:9px 12px;background:rgba(61,142,255,.10);border:1px solid var(--gold-soft);border-left:3px solid var(--gold);font-family:'Cormorant Garamond',serif;font-size:13px;font-weight:600;color:var(--gold-light)}

.courier-section-label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--cream-dim);margin:12px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--gold-deep)}
.courier-return-header{font-family:'Cinzel',serif;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-light);margin:18px 0 8px;padding-bottom:6px;border-bottom:1px dashed var(--gold-deep)}
.courier-deliver-wrap{display:flex;justify-content:center;margin-top:16px;padding-top:14px;border-top:1px solid var(--gold-deep)}
.courier-complete-msg{text-align:center;padding:14px;font-family:'Cormorant Garamond',serif;font-size:14px;font-style:italic;color:var(--gold-light);border:1px solid var(--gold-deep);background:rgba(61,142,255,.06);margin-top:12px}
.trip-leg-hint{font-family:'Cormorant Garamond',serif;font-size:12px;color:var(--muted);font-style:italic}

/* Optimal finder */
.optimal-card{
  border:1px solid var(--gold-soft);
  background:rgba(58,37,22,.5);
  padding:18px;
}
.optimal-h{
  font-family:'Cinzel',serif;font-weight:600;font-size:13px;
  letter-spacing:3px;text-transform:uppercase;color:var(--gold-light);
  margin-bottom:14px;
}
.optimal-grid{
  display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px 24px;
  padding:14px 18px;
  background:rgba(0,0,0,.2);
  border:1px solid var(--gold-deep);
  margin-bottom:14px;
}
.optimal-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;font-family:'Cinzel',serif;font-size:12px;letter-spacing:1px;text-transform:uppercase;min-width:0}
.optimal-row span{color:var(--cream-dim);flex-shrink:0}
.optimal-row b{color:var(--cream);font-weight:700;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.optimal-loop{padding-top:14px;border-top:1px solid var(--gold-deep)}
.optimal-loop-h{font-family:'Cinzel',serif;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--cream-dim);margin-bottom:10px}
.optimal-loop-body{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.optimal-loop-route{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.optimal-loop-cargo{display:flex;align-items:center;gap:8px;font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--cream);font-size:14px}
.optimal-loop-cargo img.good-icon{width:16px;height:16px}
.optimal-loop-stats{font-family:'Cormorant Garamond',serif;font-size:13px;color:var(--cream-dim)}
.optimal-loop-stats b{color:var(--cream);font-weight:700}
.optimal-loop-stats .profit{color:var(--green)}

.btn-gold{
  background:var(--gold-dark) !important;
  color:#1c100a !important;
  border-color:var(--gold-light) !important;
  font-weight:700;
}
.btn-gold:hover{background:var(--gold) !important}

/* Math breakdown tooltip */
#priceTip{
  position:absolute;
  z-index:9999;
  min-width:240px;
  padding:10px 12px;
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  box-shadow:0 8px 24px rgba(0,0,0,.6);
  font-family:'Cormorant Garamond',serif;
  font-size:13px;
  color:var(--cream);
  pointer-events:none;
}
.bk-title{font-family:'Cinzel',serif;font-weight:600;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-light);margin-bottom:6px;padding-bottom:6px;border-bottom:1px solid var(--gold-deep)}
.bk-row{display:flex;justify-content:space-between;gap:14px;padding:2px 0}
.bk-row b{font-weight:700}
.bk-row .profit{color:var(--green)}
.bk-row .loss{color:var(--red)}
.bk-row.total{margin-top:6px;padding-top:6px;border-top:1px solid var(--gold-deep);font-weight:700}
.bk-row.total b{font-size:15px;color:var(--gold-light)}
.price-cell{cursor:help;border-bottom:1px dotted var(--gold-deep)}

/* Discord copy button */
.share-cell{text-align:center}
.copy-btn{
  background:rgba(61,142,255,.1);
  border:1px solid var(--gold-deep);
  color:var(--gold-light);
  cursor:pointer;
  font-size:14px;
  padding:4px 8px;
  transition:background .12s, border-color .12s;
  font-family:inherit;
}
.copy-btn:hover{background:rgba(61,142,255,.2);border-color:var(--gold-soft);color:var(--cream)}

/* Toast */
#toast{
  position:fixed;
  bottom:24px;left:50%;
  transform:translateX(-50%) translateY(20px);
  background:#1a0e07;
  border:1px solid var(--gold-soft);
  color:var(--cream);
  padding:10px 18px;
  font-family:'Cinzel',serif;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;
  opacity:0;pointer-events:none;
  transition:opacity .25s, transform .25s;
  z-index:10000;
  box-shadow:0 6px 20px rgba(0,0,0,.5);
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Changelog */
.changelog-card{
  margin:24px auto 0;max-width:560px;
  border:1px solid var(--gold-deep);
  background:rgba(0,0,0,.15);
  padding:18px 22px;
}
.changelog-h{
  font-family:'Cinzel',serif;font-weight:600;font-size:13px;
  letter-spacing:3px;text-transform:uppercase;color:var(--gold-light);
  text-align:center;margin-bottom:14px;
  padding-bottom:10px;
  border-bottom:1px solid var(--gold-deep);
}
.changelog-entry{margin-bottom:14px}
.changelog-entry:last-child{margin-bottom:0}
.changelog-ver{
  font-family:'Cinzel',serif;font-weight:700;font-size:14px;color:var(--cream);
  letter-spacing:2px;margin-bottom:6px;
  display:flex;align-items:center;gap:10px;
}
.changelog-date{
  font-family:'Cinzel',serif;font-weight:500;font-size:9px;letter-spacing:2px;
  color:#1c100a;background:var(--gold);padding:2px 8px;text-transform:uppercase;
}
.changelog-entry ul{list-style:none;padding:0;margin:0}
.changelog-entry li{
  font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--cream-dim);
  padding:3px 0 3px 18px;position:relative;
}
.changelog-entry li::before{content:"⚜";position:absolute;left:0;color:var(--gold-soft);font-size:11px;top:5px}
.changelog-entry li strong{color:var(--cream)}
.changelog-thanks{
  font-family:'Cormorant Garamond',serif;font-size:12px;font-style:italic;
  color:var(--gold-soft);margin-top:10px;padding-left:2px;letter-spacing:.3px;
}

body *,
body *::before,
body *::after{
  font-family:'Inter','DM Sans',system-ui,sans-serif !important;
}
body .price-cell, body .bk-row b, body .bk-row span{font-family:inherit !important}
body .corner-tl, body .corner-br,
body #bestLoopCard::before, body #bestLoopCard::after{display:none}
body .panel{
  background:var(--panel);
  border:1px solid #1f2530;
  box-shadow:none;
  border-radius:8px;
}
body .panel::before, body .panel::after{display:none}
body .s-title, body .set-h, body .loop-title,
body .optimal-h, body .changelog-h, body .title{
  text-shadow:none;
  background:none;
  letter-spacing:1.5px;
  color:var(--cream);
  font-weight:600;
  border-bottom:none;
}
body .title{font-size:18px;letter-spacing:2px}
body .tab{
  background:transparent;color:var(--cream-dim);border:none;text-shadow:none;
  letter-spacing:1.5px;
  border-bottom:2px solid transparent;
  padding:10px 16px;
}
body .tab.active{color:var(--gold-light);border-bottom-color:var(--gold);background:transparent}
body .tab.active::after{display:none}
body .tab:hover{color:var(--cream);background:transparent}
body #tabsRow{border-bottom-color:#2a3445;background:rgba(0,0,0,.12)}
body select, body input[type="text"]{
  background:#0a0c10;
  border:1px solid #2a3445;
  color:var(--cream);
  border-radius:6px;
}
body .btn{
  background:#1a1d24;
  border:1px solid #2a3445;
  color:var(--cream);
  border-radius:6px;
  text-shadow:none;
  letter-spacing:1.2px;
}
body .btn:hover{background:#262b35;border-color:#3a4555}
body .btn-gold{
  background:#1f5cc4 !important;
  color:#fff !important;
  border-color:#5b9eff !important;
}
body .btn-gold:hover{background:#3d8eff !important}
body .btn-red{background:#1a1d24;border-color:#5a2828;color:#f87171}
body .btn-red:hover{background:#2a1818;border-color:#7a3838}
body th{
  background:#0a0c10 !important;
  color:var(--cream-dim) !important;
  text-shadow:none;
  letter-spacing:1.5px;
  border-bottom:1px solid #2a3445 !important;
  border-top:none !important;
}
body td{
  background:transparent !important;
  border-bottom:1px solid #1f2530;
}
body tbody tr:hover td{background:#13161c !important}
body tbody tr:nth-child(even) td{background:rgba(255,255,255,.015) !important}
body tr.here-row td{background:rgba(61,142,255,.05) !important}
body td.featured{
  background:rgba(61,142,255,.08) !important;
  border-left:1px solid #3d8eff;
  border-right:1px solid #3d8eff;
  color:var(--gold-light);
}
body td.featured.profit{color:#34d399;text-shadow:none}
body td.featured.loss{color:#f87171;text-shadow:none}
body td.profit, body .profit{color:#34d399 !important;text-shadow:none}
body td.loss, body .loss{color:#f87171 !important;text-shadow:none}
body .badge{
  border-radius:999px;
  text-shadow:none;
  letter-spacing:.5px;
  font-weight:600;
  font-size:11px;
}
body .top-marker, body .here-marker{color:#3d8eff;text-shadow:none}
body .route-controls-head{border-bottom-color:#2a3445}
body .route-controls-toggle{background:rgba(0,0,0,.22);color:var(--cream-dim)}
body .route-controls-toggle:hover{background:#1a1d24;color:var(--cream)}
body .routes-data-notice{color:#9aa0a8;font-family:inherit !important}
body #bestLoopCard{
  background:rgba(20,24,32,.4);
  border:1px solid #2a3445;
  border-radius:8px;
  margin:0;
}
body .loop-ppm{color:#34d399;text-shadow:none}
body .loop-totals-row.big b, body .trip-stat.big b{color:#34d399}
body .loop-divider{background:#2a3445}
body button.loop-head.loop-head-toggle:hover{background:rgba(26,29,36,.45)}
body .trip-card{
  background:#13161c;border:1px solid #2a3445;border-radius:8px;
}
body .trip-leg{background:#0f1115;border:1px solid #1f2530;border-radius:6px}
body .onward-card{border-top-color:#2a3445}
body .onward-body{background:#0f1115;border:1px solid #1f2530;border-radius:6px}
body .onward-divider{background:#2a3445}
body .onward-totals-row.big{border-top-color:#2a3445}
body .trip-leg-num{
  background:#3d8eff;color:#fff;
}
body .optimal-card{
  background:#13161c;
  border:1px solid #2a3445;border-radius:8px;
}
body .optimal-grid{background:#0f1115;border:1px solid #1f2530;border-radius:6px}
body #priceTip{
  background:#0a0c10;border:1px solid #2a3445;border-radius:6px;
  font-family:inherit !important;
}
body .copy-btn{
  background:#13161c;border:1px solid #2a3445;color:var(--gold-light);border-radius:6px;
}
body .copy-btn:hover{background:#1a1d24;border-color:#3d8eff;color:var(--cream)}
body #toast{background:#0a0c10;border:1px solid #2a3445;border-radius:8px;color:var(--cream);text-shadow:none}
body .changelog-card{background:#0f1115;border:1px solid #1f2530;border-radius:8px}
body .changelog-date{background:#3d8eff;color:#fff}
body .changelog-entry li::before{color:#3d8eff;content:"›";font-weight:700}
body .credits-card{background:#0f1115;border:1px solid #1f2530;border-radius:8px}
body .about-hero, body .credits-name{color:var(--cream);text-shadow:none}
body .stats-block{background:#0a0c10;border:1px solid #1f2530;border-radius:6px}
body .stats-block .row.total b{color:#3d8eff;text-shadow:none}
body .check-row input[type="checkbox"]{accent-color:#3d8eff}
body hr, body .set-h{border-color:#2a3445}
body .good-cell, body .retcard{font-family:inherit !important}
body .retcard{background:#0f1115;border:1px solid #1f2530;border-radius:6px}
body .retcard.empty{color:var(--muted)}
body .retcard .rprofit{color:#34d399}

/* Slate-specific Cinzel override merged into body above */

body ::-webkit-scrollbar-track{background:#0a0c10;border-left:1px solid #1f2530}
body ::-webkit-scrollbar-thumb{background:#1a2840;border:1px solid #2a3445}
body ::-webkit-scrollbar-thumb:hover{background:#2a3850}
body select option{background:#0a0c10;color:var(--cream)}
body input[type=number]{background:#0a0c10;border:1px solid #2a3445;color:var(--cream);border-radius:6px}
body .check-row{background:#0f1115;border-color:#1f2530}
body .btn-preset{background:#13161c;border-color:#2a3445;color:var(--cream-dim)}
body .btn-preset:hover{border-color:#3d8eff;color:var(--cream)}
body .evrow-dur .btn-preset.sel{background:#0f1a2e;border-color:#3d8eff;color:#7fb3ff}
body .evrow-bar{background:#0a0c10}
body .evcard-progress-fill{background:#5b9eff;box-shadow:0 0 6px rgba(91,158,255,.4)}
body .evrow.active.dir-down .evcard-progress-fill{background:#34d399;box-shadow:0 0 6px rgba(52,211,153,.4)}
body .evrow.active.is-low .evcard-progress-fill{background:#fca5a5}
body .evrow.active.is-low .evc-timer{color:#fca5a5}
body .setup-block .setup-label{color:var(--dim)}
body tr.row-expanded td{border-top-color:#3d8eff !important}
body tr.row-expanded td:first-child{border-left-color:#3d8eff !important}
body tr.row-expanded td:last-child{border-right-color:#3d8eff !important}
body .expand-td{background:#0d0f14 !important;border-bottom-color:#3d8eff !important}
body .exp-first{border-left-color:#3d8eff !important}
body .exp-last{border-right-color:#3d8eff !important}
body .expand-label{color:#7fb3ff}
body .route-card{border-color:#2a3445;background:rgba(61,142,255,.03)}
body .route-card.is-top{border-color:#3d8eff;background:rgba(61,142,255,.08)}
body .rc-expand{border-top-color:#2a3445}
body .rc-ret-label{color:#7fb3ff}
body #whatsNewBox{background:#0f1115;border-color:#2a3445;box-shadow:0 16px 60px rgba(0,0,0,.75),0 0 0 1px rgba(61,142,255,.06)}
body .wn-body li::before{color:#3d8eff;content:"›";font-weight:700}
body .wn-body li{border-bottom-color:#1f2530}
body .wn-footer{border-top-color:#1f2530}
body .wn-dont-label input[type=checkbox]{accent-color:#3d8eff}

/* Onboarding tour */

/* Full-screen scrim that dims everything */
#onbScrim{
  position:fixed; inset:0; z-index:9000;
  pointer-events:none;
  display:none;
}
#onbScrim.is-active{display:block}

/* Backdrop is built from 4 "frame" divs (top/right/bottom/left of the spot rect).
   This leaves a real, clickable hole for the highlighted element. */
#onbBackdrop{
  position:fixed; inset:0;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
}
#onbScrim.is-active #onbBackdrop{opacity:1}
.onb-frame{
  position:fixed;
  background:rgba(0,0,0,.72);
  pointer-events:auto;
  transition:top .45s cubic-bezier(.2,.8,.25,1),
             left .45s cubic-bezier(.2,.8,.25,1),
             width .45s cubic-bezier(.2,.8,.25,1),
             height .45s cubic-bezier(.2,.8,.25,1);
}
/* Centered (no target) - single full-screen dim */
#onbScrim.is-centered .onb-frame{
  top:0 !important; left:0 !important;
  width:100vw !important; height:100vh !important;
}
#onbScrim.is-centered .onb-frame.frame-r,
#onbScrim.is-centered .onb-frame.frame-b,
#onbScrim.is-centered .onb-frame.frame-l{display:none}

/* Spotlight: just the gold ring + glow. The dim is handled by .onb-frame divs. */
#onbSpot{
  position:fixed;
  border-radius:8px;
  pointer-events:none;
  z-index:9002;
  top:50%; left:50%; width:0; height:0;
  box-shadow:
    0 0 0 2px var(--gold),
    0 0 22px rgba(127,179,255,.55),
    0 0 56px rgba(127,179,255,.28),
    inset 0 0 0 1px rgba(157,196,255,.18);
  transition:
    opacity .15s ease;
  opacity:0;
}
#onbSpot.is-visible{opacity:1}
#onbSpot.is-pulsing::after{
  content:"";
  position:absolute; inset:-4px;
  border-radius:10px;
  border:1px solid var(--gold-light);
  opacity:0;
  animation:onb-ring 2.4s ease-out infinite;
  pointer-events:none;
}
@keyframes onb-ring{
  0%   { transform:scale(.96); opacity:.0 }
  20%  { opacity:.55 }
  100% { transform:scale(1.10); opacity:0 }
}

/* Clicks reach highlighted element naturally via frame divs */

/* Slate theme spotlight */
body #onbSpot{
  box-shadow:
    0 0 0 2px #5b9eff,
    0 0 22px rgba(91,158,255,.5),
    0 0 56px rgba(91,158,255,.22);
}
body #onbSpot.is-pulsing::after{border-color:#7fb3ff}

/* The card */
#onbCard{
  position:fixed;
  z-index:9003;
  width:380px;
  max-width:calc(100vw - 32px);
  background:#160a04;
  border:1px solid var(--gold-soft);
  box-shadow:
    inset 0 0 0 1px rgba(127,179,255,.07),
    inset 0 0 28px rgba(0,0,0,.55),
    0 12px 32px rgba(0,0,0,.65);
  padding:22px 24px 16px;
  font-family:'Cormorant Garamond',serif;
  color:var(--cream);
  opacity:0;
  transform:translateY(8px);
  transition:
    opacity .15s ease,
    transform .2s cubic-bezier(.2,.8,.25,1);
  pointer-events:auto;
}
#onbCard.is-visible{opacity:1; transform:translateY(0)}

/* Centered (intro / outro / no-target) */
#onbCard.is-center{
  top:50%; left:50%;
  transform:translate(-50%, -50%) scale(.97);
  width:460px;
  text-align:center;
  padding:34px 32px 24px;
}
#onbCard.is-center.is-visible{transform:translate(-50%, -50%) scale(1)}

/* Decorative corner brackets on the card */
#onbCard::before, #onbCard::after{
  content:"";
  position:absolute; width:12px; height:12px;
  pointer-events:none;
}
#onbCard::before{top:-1px; left:-1px; border-top:1px solid var(--gold); border-left:1px solid var(--gold)}
#onbCard::after {bottom:-1px; right:-1px; border-bottom:1px solid var(--gold); border-right:1px solid var(--gold)}

/* Arrow pointer */
.onb-arrow{
  position:absolute;
  width:14px; height:14px;
  background:#160a04;
  border:1px solid var(--gold-soft);
  transform:rotate(45deg);
  display:none;
  z-index:-1;
}
#onbCard[data-arrow="top"]    .onb-arrow{display:block; top:-8px;    left:32px;  border-right:none;  border-bottom:none}
#onbCard[data-arrow="bottom"] .onb-arrow{display:block; bottom:-8px; left:32px;  border-left:none;   border-top:none}
#onbCard[data-arrow="left"]   .onb-arrow{display:block; left:-8px;   top:32px;   border-right:none;  border-top:none}
#onbCard[data-arrow="right"]  .onb-arrow{display:block; right:-8px;  top:32px;   border-left:none;   border-bottom:none}

/* Eyebrow + step counter */
#onbCard .onb-eyebrow{
  font-family:'Cinzel',serif;
  font-size:9.5px;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#onbCard .onb-step{color:var(--cream-dim); font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:1.8px}

/* Title */
#onbCard h3{
  font-family:'Cinzel',serif;
  font-weight:700;
  font-size:18px;
  letter-spacing:1.5px;
  color:var(--gold-light);
  margin:0 0 10px;
  text-shadow:0 1px 0 #000;
  line-height:1.3;
}
#onbCard.is-center h3{font-size:24px; letter-spacing:2px}

/* Body */
#onbCard p{
  font-family:'Cormorant Garamond',serif;
  font-size:15.5px;
  line-height:1.55;
  color:var(--cream);
  margin:0 0 6px;
}
#onbCard p + p{margin-top:8px}
#onbCard em{color:var(--gold-light); font-style:italic; letter-spacing:.3px; font-weight:600}
#onbCard strong{color:var(--gold-light); font-weight:600}

/* "Try this" callout */
#onbCard .onb-try{
  margin-top:12px;
  padding:9px 12px;
  border:1px dashed var(--gold-soft);
  background:rgba(61,142,255,.07);
  font-family:'Cinzel',serif;
  font-size:10.5px;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:var(--gold-light);
  display:flex;
  align-items:center;
  gap:8px;
}
#onbCard .onb-try::before{
  content:"➜";
  font-size:13px;
  color:var(--gold);
  animation:onb-arrow-bob 1.6s ease-in-out infinite;
}
@keyframes onb-arrow-bob{
  0%,100% { transform:translateX(0) }
  50%     { transform:translateX(3px) }
}
#onbCard .onb-try.is-done{
  border-style:solid;
  border-color:#6ec47a;
  color:#9bd9a4;
  background:rgba(110,196,122,.10);
}
#onbCard .onb-try.is-done::before{content:"✓"; color:#9bd9a4; animation:none}

/* Actions row */
#onbCard .onb-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--gold-deep);
}
#onbCard .onb-dots{display:flex; gap:5px; flex-wrap:wrap; max-width:55%}
#onbCard .onb-dot{
  width:6px; height:6px;
  background:rgba(61,142,255,.25);
  transition:background .25s, transform .25s;
  cursor:pointer;
}
#onbCard .onb-dot:hover{background:rgba(61,142,255,.5)}
#onbCard .onb-dot.is-current{background:var(--gold-light); transform:scale(1.4)}
#onbCard .onb-dot.is-done{background:var(--gold-soft)}

/* Buttons */
.onb-btn{
  font-family:'Cinzel',serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:1.6px;
  text-transform:uppercase;
  padding:9px 16px;
  cursor:pointer;
  border:1px solid var(--gold-deep);
  background:#1a0e07;
  color:var(--cream);
  transition:background .18s, border-color .18s, color .18s, transform .12s;
}
.onb-btn:hover{border-color:var(--gold); color:var(--gold-light)}
.onb-btn:active{transform:translateY(1px)}
.onb-btn.primary{
  background:rgba(31,92,196,.55);
  border-color:var(--gold);
  color:var(--gold-light);
  text-shadow:0 1px 0 #000;
}
.onb-btn.primary:hover{
  background:rgba(61,142,255,.7);
  color:#fff5d0;
  box-shadow:0 0 14px rgba(127,179,255,.35);
}
.onb-btn.primary:disabled{
  opacity:.4;
  cursor:not-allowed;
  box-shadow:none;
}
.onb-btn.ghost{
  background:transparent;
  border-color:transparent;
  color:var(--cream-dim);
  text-decoration:underline;
  text-underline-offset:3px;
  padding:9px 8px;
}
.onb-btn.ghost:hover{color:var(--gold-light); border-color:transparent}
.onb-btn-row{display:flex; gap:8px; align-items:center}

/* "Don't show again" row */
#onbCard .onb-skip-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-top:10px;
  font-family:'Cormorant Garamond',serif;
  font-size:12.5px;
  font-style:italic;
  color:var(--cream-dim);
}
#onbCard .onb-skip-row label{cursor:pointer; display:flex; align-items:center; gap:6px}
#onbCard .onb-skip-row input{accent-color:var(--gold); cursor:pointer}

/* Slate theme card */
body #onbCard{
  background:#0a0c10;
  border:1px solid #2a3445;
  border-radius:8px;
}
body #onbCard::before{border-color:#3d8eff}
body #onbCard::after {border-color:#3d8eff}
body #onbCard .onb-eyebrow,
body #onbCard .onb-step{color:var(--cream-dim); letter-spacing:1.4px}
body #onbCard h3{color:var(--cream); text-shadow:none; letter-spacing:.6px; font-weight:600}
body #onbCard em,
body #onbCard strong{color:#7fb3ff}
body #onbCard .onb-actions{border-top-color:#2a3445}
body #onbCard .onb-dot{background:#2a3445}
body #onbCard .onb-dot.is-current{background:#5b9eff}
body #onbCard .onb-dot.is-done{background:#3d8eff}
body #onbCard .onb-try{
  border-color:#3d8eff;
  background:rgba(91,158,255,.08);
  color:#7fb3ff;
}
body #onbCard .onb-try::before{color:#5b9eff}
body #onbCard .onb-try.is-done{border-color:#6ec47a; background:rgba(110,196,122,.10); color:#9bd9a4}
body .onb-arrow{
  background:#13161c;
  border-color:#2a3445;
}
body .onb-btn{
  background:#13161c;
  border:1px solid #2a3445;
  border-radius:5px;
  color:var(--cream);
  text-shadow:none;
}
body .onb-btn:hover{border-color:#3d8eff; color:#7fb3ff}
body .onb-btn.primary{
  background:#1f5cc4;
  border-color:#3d8eff;
  color:#fff;
  text-shadow:none;
}
body .onb-btn.primary:hover{background:#2a6cd6; color:#fff; box-shadow:0 0 14px rgba(91,158,255,.4)}
body .onb-btn.ghost{background:transparent; border-color:transparent; color:var(--cream-dim)}
body .onb-btn.ghost:hover{color:#7fb3ff}

/* Mobile adjustments */
@media (max-width:768px){
  #onbCard{
    width:calc(100vw - 24px) !important;
    max-width:none !important;
    padding:18px 18px 14px !important;
  }
  #onbCard:not(.is-center){
    left:12px !important;
    right:12px !important;
    top:auto !important;
    bottom:18px !important;
  }
  #onbCard.is-center{
    width:calc(100vw - 24px) !important;
    padding:24px 20px 18px !important;
  }
  #onbCard h3{font-size:16px}
  #onbCard.is-center h3{font-size:20px}
  #onbCard p{font-size:14.5px}
  #onbCard[data-arrow] .onb-arrow{display:none !important}
  /* Hide the feedback button while the tour is running so it doesn't overlap */
  body.tour-active #feedbackContainer{display:none !important}
}

/* Hide the feedback button while the tour runs on desktop too (the tour
   highlights it explicitly for the credits step). The 'show-feedback'
   class on body re-shows it for the specific step that points at it. */
body.tour-active:not(.tour-show-feedback) #feedbackContainer{
  display:none !important;
}
/* When we DO show it, lift it above the dim so it's actually visible */
body.tour-show-feedback #feedbackContainer{
  z-index: 9004 !important;
}

/* Mobile (<=768px) */
@media (max-width:768px){

  html,body{height:auto;min-height:100svh;overflow-x:hidden}

  /* App shell */
  #app{
    flex-direction:column !important;
    overflow:visible !important;
    height:auto !important;
    min-height:0 !important;
    padding:60px 8px 8px !important;
    gap:8px !important;
  }

  /* Sidebar fixed to top */
  #sidebar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    min-width:0 !important;
    z-index:100 !important;
    height:min(600px,72vh) !important;
    overflow:hidden !important;
    transition:height .35s cubic-bezier(.2,.8,.3,1);
  }
  body[data-sidebar="collapsed"] #sidebar{
    height:56px !important;
    background:var(--panel) !important;
    box-shadow:0 2px 10px rgba(0,0,0,.5) !important;
    border-color:var(--gold-deep) !important;
  }
  body[data-sidebar="collapsed"] #sidebar>.corner-tl,
  body[data-sidebar="collapsed"] #sidebar>.corner-br,
  body[data-sidebar="collapsed"] #sidebar::before,
  body[data-sidebar="collapsed"] #sidebar::after{display:block !important}

  /* Toggle: sits in normal flow at the top of the fixed sidebar */
  #sidebarToggle{
    position:relative !important;
    top:auto !important; left:auto !important; right:auto !important; bottom:auto !important;
    width:100% !important; height:56px !important;
    appearance:none !important; -webkit-appearance:none !important;
    border-radius:0 !important;
    border:none !important;
    border-bottom:1px solid var(--gold-deep) !important;
    transform:none !important;
    box-shadow:none !important;
    background:var(--panel) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px;
    z-index:10;
  }
  #sidebarToggle::before{
    content:"Merchant Setup" !important;
    font-family:'Inter','DM Sans',system-ui,sans-serif !important;
    font-size:10px !important;
    letter-spacing:2px !important;
    text-transform:uppercase !important;
    transform:none !important;
    color:var(--gold-light) !important;
    transition:none !important;
  }
  #sidebarToggle::after{
    content:"▴";
    font-size:11px;
    color:var(--gold-soft);
    transition:transform .3s;
  }
  body[data-sidebar="collapsed"] #sidebarToggle::after{transform:rotate(180deg)}
  body[data-sidebar="collapsed"] #sidebarToggle::before{transform:none !important}

  /* Inner content scrolls within the fixed sidebar below the 56px toggle bar */
  #sidebarInner{
    position:absolute !important;
    top:56px !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding-top:8px !important;
  }
  body[data-sidebar="collapsed"] #sidebarInner{
    opacity:0 !important;pointer-events:none !important;visibility:hidden !important;
    transition:opacity .15s ease,visibility 0s linear .2s !important;
  }

  /* Main panel */
  #main{flex:none !important;width:100% !important;overflow:visible !important;min-height:0 !important}
  #mainInner{flex:none !important;overflow:visible !important;height:auto !important}

  /* Tabs */
  #tabsRow{
    padding:0 !important;
    overflow-x:visible !important;
    flex-wrap:wrap !important;
  }
  .tab{
    flex:1 0 33.33% !important;
    box-sizing:border-box !important;
    text-align:center !important;
    padding:13px 4px !important;
    font-size:8px !important;
    letter-spacing:1px !important;
    white-space:nowrap;
    min-height:42px;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  /* Bigger touch targets */
  select, input[type=text], input[type=number]{
    font-size:14px !important;
    padding:11px 28px 11px 12px !important;
    min-height:46px !important;
  }
  .btn{
    min-height:46px !important;
    padding:11px 18px !important;
    font-size:10px !important;
  }
  .check-row{
    min-height:46px !important;
    padding:9px 10px !important;
  }
  .check-row input[type=checkbox]{
    width:22px !important;
    height:22px !important;
  }
  .check-row label{
    font-size:13px !important;
  }
  /* Events tab mobile: grid layout so rows are explicit */
  .evrow{display:grid !important;grid-template-columns:1fr auto;padding:0 !important;min-height:215px !important;align-items:unset !important}
  .evrow-accent{grid-column:1/-1 !important;grid-row:1 !important;width:auto !important;height:3px !important;align-self:stretch !important}
  .evrow-city{grid-column:1 !important;grid-row:2 !important;width:auto !important;padding:10px 12px 6px !important;font-size:10px !important;letter-spacing:2px !important;align-self:center !important}
  .evrow-right{grid-column:2 !important;grid-row:2 !important;padding:8px 12px 6px !important;gap:8px !important;align-self:center !important}
  .evrow-mid{grid-column:1/-1 !important;grid-row:3 !important;flex-direction:row !important;flex-wrap:wrap !important;align-items:center !important;padding:4px 12px 10px !important;gap:6px !important;min-width:0}
  .evrow-bar{grid-column:1/-1 !important;grid-row:4 !important;position:relative !important;bottom:auto !important;left:auto !important;right:auto !important;height:2px !important}
  .evrow-selects{flex:0 0 100% !important;flex-direction:column !important;max-width:none !important;gap:6px !important}
  .evrow-selects select{width:100% !important;padding:9px 10px !important;font-size:14px !important}
  .evrow-dur{display:flex !important;width:100% !important;gap:6px !important}
  .evrow-dur .btn-preset{flex:1 !important;padding:8px 0 !important;text-align:center !important;font-size:10px !important}
  .evrow-btn-start{width:100% !important;padding:10px 16px !important;font-size:11px !important;letter-spacing:2px !important}
  .evc-btn-clear{padding:6px 12px !important;font-size:10px !important}
  .evc-timer{font-size:18px !important}
  .evrow-glyph{font-size:18px !important}
  .evrow-ename{font-size:10px !important}
  .evrow-elevel{font-size:12px !important}

  /* Toolbar */
  #toolbar{flex-wrap:wrap !important;padding:8px 10px !important;gap:6px !important}
  #toolbar .tlabel{display:none !important}
  #sortBy{min-width:0 !important;flex:1 1 auto}
  #rowLimit{display:none !important}
  #routesFilterRow #searchInput{width:100% !important;max-width:none !important}
  .spacer{display:none !important}
  .routes-data-notice{font-size:10px !important;padding:5px 10px 6px !important}

  /* Sidebar form controls */
  .setup-row{flex-direction:column !important;gap:6px !important}
  .setup-row select, .setup-row input[type=text]{max-width:100% !important;width:100% !important}
  .setup-label{font-size:11px !important;letter-spacing:1px !important}
  .set-row{flex-wrap:wrap !important;gap:6px !important}

  /* Routes panel */
  #routesPanel{overflow:visible !important;height:auto !important;flex:none !important;min-height:0 !important}
  #tableWrap{overflow:visible !important;flex:none !important;min-height:0 !important}
  #routeTable{display:none !important}
  #routeCards{display:flex;flex-direction:column;gap:5px;padding:4px 2px}
  #routeControls .routes-best-loop-row #bestLoopCard{margin:0 !important;max-width:none !important}
  .loop-head{flex-wrap:wrap;gap:8px}
  .loop-body{grid-template-columns:1fr !important;gap:8px !important;padding:10px 12px 12px !important}
  .loop-sep{display:none !important}
  .loop-ppm{font-size:16px !important}
  .loop-leg-inline{gap:10px !important}

  /* Route cards */
  .route-card{
    background:rgba(61,142,255,.05);
    border:1px solid var(--gold-deep);
    padding:10px 12px 8px;
    cursor:pointer;
    position:relative;
  }
  .route-card.is-top{border-color:var(--gold);background:rgba(61,142,255,.10)}
  .rc-header{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:5px}
  .rc-route{display:flex;align-items:center;gap:5px;flex:1;flex-wrap:wrap}
  .rc-arrow{color:var(--gold-soft);font-size:10px}
  .rc-ppm{font-family:'Cinzel',serif;font-size:11px;font-weight:700;white-space:nowrap}
  .rc-ppm.profit{color:var(--green)}.rc-ppm.loss{color:var(--red)}.rc-ppm.zero{color:var(--dim)}
  .rc-body{display:flex;align-items:center;justify-content:space-between;gap:6px}
  .rc-stats{display:flex;gap:10px;font-family:'Cormorant Garamond',serif;font-size:12.5px;color:var(--cream-dim);white-space:nowrap}
  .rc-pu.profit{color:var(--green)}.rc-pu.loss{color:var(--red)}
  .rc-time{color:var(--dim)}
  .rc-detail{
    display:flex;align-items:center;gap:5px;
    margin-top:5px;
    font-family:'Cormorant Garamond',serif;font-size:12px;color:var(--cream-dim);
    flex-wrap:wrap;
  }
  .rc-sep{color:var(--gold-deep)}
  .rc-price{color:var(--cream-dim)}
  .rc-pt{color:var(--cream-dim)}
  .rc-pt.profit{color:var(--green)}.rc-pt.loss{color:var(--red)}
  .rc-expand{display:none;margin-top:8px;padding-top:8px;border-top:1px solid var(--gold-deep)}
  .route-card.card-open .rc-expand{display:block}
  .rc-ret-label{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-soft);margin-right:2px}
  .rc-ret-route{display:flex;align-items:center;gap:5px;margin-bottom:5px;flex-wrap:wrap}
  .rc-empty-msg{color:var(--dim);font-family:'Cormorant Garamond',serif;font-size:12px}
  .rc-roundtrip{display:flex;align-items:center;gap:8px;margin-top:7px;padding-top:7px;border-top:1px solid rgba(61,142,255,.15)}
  .rc-rt-label{font-family:'Cinzel',serif;font-size:8px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-soft);flex:1}
  .rc-rt-val{font-family:'Cinzel',serif;font-size:13px;font-weight:600}
  .rc-rt-rate{font-family:'Cinzel',serif;font-size:10px;opacity:.85}
  .rc-rt-val.profit,.rc-rt-rate.profit{color:var(--green)}
  .rc-rt-val.loss,.rc-rt-rate.loss{color:var(--red)}

  /* Optimal setup card */
  .optimal-grid{grid-template-columns:1fr !important;gap:6px 0 !important}
  .optimal-row b{white-space:normal !important;overflow:visible !important;text-overflow:unset !important}

  textarea{min-height:80px;font-size:14px !important}

  /* Settings and About panels */
  #settingsPanel,#aboutPanel{padding:18px 14px !important}
  #eventsPanel{padding:16px 12px !important}
  #toolsPanel{padding:16px 14px !important}
  #pricesPanel{padding:10px 10px !important}

  /* Events grid */
  .events-grid{grid-template-columns:1fr !important}

  /* Title */
  #masthead .title{
    font-size:13px !important;
    letter-spacing:2px !important;
    white-space:normal !important;
    text-align:center;
    line-height:1.3;
  }
  #masthead{padding:10px 12px !important}

}

/* Small phones (<=480px) */
@media (max-width:480px){
  .tab{padding:12px 2px !important;font-size:7.5px !important;letter-spacing:0.5px !important}
  #toolbar{padding:6px 8px !important}
  #settingsPanel,#aboutPanel{padding:14px 10px !important}
  .set-h{font-size:11px;letter-spacing:2px}
  select, input[type=text], input[type=number]{font-size:15px !important}
  #whatsNewBox{padding:20px 16px 16px;max-height:88vh}
  .wn-title{font-size:14px}
  .wn-body{font-size:12px}
}

/* Tour character */
#tourChar{
  position:fixed; z-index:9010; pointer-events:none;
  width:70px; height:110px; display:none;
  transition:left .38s cubic-bezier(.3,.8,.3,1), top .38s cubic-bezier(.3,.8,.3,1);
}
#tourChar svg{
  width:70px; height:110px; overflow:visible;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.65));
  transition:transform .25s ease;
}

/* Idle float */
@keyframes tc-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
#tourChar.tc-idle{animation:tc-bob 2s ease-in-out infinite}

/* Walk bounce */
@keyframes tc-walk{0%,100%{transform:translateY(0) rotate(-.8deg)}50%{transform:translateY(-3px) rotate(.8deg)}}
#tourChar.tc-walk{animation:tc-walk .32s ease-in-out infinite}

/* Entry pop */
@keyframes tc-pop{0%{transform:scale(0) translateY(20px);opacity:0}70%{transform:scale(1.1) translateY(-2px);opacity:1}100%{transform:scale(1) translateY(0);opacity:1}}
#tourChar.tc-entering{animation:tc-pop .4s cubic-bezier(.3,.8,.3,1) forwards}

/* Talking mouth */
@keyframes tc-talk{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
#tourChar.tc-talking #tcMouth{
  transform-box:fill-box; transform-origin:center center;
  animation:tc-talk .18s ease-in-out infinite;
}

/* Leg walk */
@keyframes tc-ll{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-18deg)}}
@keyframes tc-lr{0%,100%{transform:rotate(0deg)}50%{transform:rotate(18deg)}}
#tourChar.tc-walk #tcLegL{transform-box:fill-box;transform-origin:center top;animation:tc-ll .32s ease-in-out infinite}
#tourChar.tc-walk #tcLegR{transform-box:fill-box;transform-origin:center top;animation:tc-lr .32s ease-in-out 0.16s infinite}

/* Pointing arm */
#tcArmR{transform-box:fill-box;transform-origin:50% 0%;transition:transform .35s cubic-bezier(.3,.8,.3,1)}

/* Wave at end */
@keyframes tc-wave{0%,100%{transform:rotate(0deg)}25%{transform:rotate(-35deg)}75%{transform:rotate(20deg)}}
#tourChar.tc-wave #tcArmR{animation:tc-wave .5s ease-in-out 3}

/* Finish splash */
#tourSplash{
  position:fixed;inset:0;z-index:10000;
  background:#0d0602;
  display:none;flex-direction:column;
  align-items:center;justify-content:center;
  gap:20px;
}
#tourSplash::before{
  content:'';position:absolute;inset:0;
  background:rgba(61,142,255,.18);
  pointer-events:none;
}
.ts-title{
  font-family:Georgia,'Times New Roman',serif;
  font-size:15px;letter-spacing:.38em;
  text-transform:uppercase;color:#3d8eff;
  opacity:0;animation:ts-fi .6s ease .15s forwards;
}
#ts-rblx{
  width:190px;height:287px;overflow:visible;
  filter:drop-shadow(0 8px 30px rgba(61,142,255,.25)) drop-shadow(0 0 60px rgba(61,142,255,.08));
}
.ts-dp{fill-opacity:0;stroke-dasharray:100;stroke-dashoffset:100}
@keyframes ts-drw{to{stroke-dashoffset:0}}
@keyframes ts-col{to{fill-opacity:1}}
@keyframes ts-fi{to{opacity:1}}
.ts-ph {stroke:#3d8eff;stroke-width:2.0;fill:#7fb3ff;animation:ts-drw .55s ease .20s forwards,ts-col .45s ease 4.00s forwards}
.ts-pr {stroke:#3d8eff;stroke-width:1.6;fill:#3b1c07;animation:ts-drw .30s ease .75s forwards,ts-col .45s ease 4.00s forwards}
.ts-pel{stroke:#3d8eff;stroke-width:1.2;fill:#0c0401;animation:ts-drw .17s ease 1.05s forwards,ts-col .45s ease 4.00s forwards}
.ts-per{stroke:#3d8eff;stroke-width:1.2;fill:#0c0401;animation:ts-drw .17s ease 1.22s forwards,ts-col .45s ease 4.00s forwards}
.ts-psm{fill:none;stroke:#0c0401;stroke-width:3;stroke-linecap:round;animation:ts-drw .38s ease 1.39s forwards}
.ts-pnk{stroke:#3d8eff;stroke-width:1.6;fill:#7fb3ff;animation:ts-drw .18s ease 1.77s forwards,ts-col .45s ease 4.00s forwards}
.ts-pto{stroke:#3d8eff;stroke-width:2.2;fill:url(#ts-jgrad);animation:ts-drw .62s ease 1.95s forwards,ts-col .45s ease 4.00s forwards}
.ts-pal{stroke:#3d8eff;stroke-width:1.8;fill:url(#ts-agrad);animation:ts-drw .42s ease 2.57s forwards,ts-col .45s ease 4.00s forwards}
.ts-par{stroke:#3d8eff;stroke-width:1.8;fill:url(#ts-agrad);animation:ts-drw .42s ease 2.99s forwards,ts-col .45s ease 4.00s forwards}
.ts-pll{stroke:#3d8eff;stroke-width:1.8;fill:url(#ts-lgrad);animation:ts-drw .28s ease 3.41s forwards,ts-col .45s ease 4.00s forwards}
.ts-plr{stroke:#3d8eff;stroke-width:1.8;fill:url(#ts-lgrad);animation:ts-drw .28s ease 3.69s forwards,ts-col .45s ease 4.00s forwards}
.ts-jl{fill:none;stroke:rgba(0,0,0,.32);stroke-width:1;stroke-dasharray:100;stroke-dashoffset:100;animation:ts-drw .45s ease 4.45s forwards}
.ts-bar-track{width:150px;height:2px;background:rgba(61,142,255,.13);border-radius:2px;overflow:hidden}
.ts-bar-fill{height:100%;width:0;background:#3d8eff;border-radius:2px;animation:ts-bf 4.8s cubic-bezier(.15,.85,.2,1) .2s forwards}
@keyframes ts-bf{to{width:100%}}
.ts-bar-label{font-family:Georgia,serif;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:rgba(61,142,255,.5);opacity:0;animation:ts-fi .5s ease .5s forwards}
.ts-bar-label::after{content:'';animation:ts-el 1.5s steps(4,end) 1s infinite}
.ts-fb-hint{font-family:Georgia,serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(61,142,255,.42);text-align:center;opacity:0;animation:ts-fi .6s ease 3.2s forwards}
@keyframes ts-el{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}

/* Whats New popup */
#whatsNewModal{
  display:none;position:fixed;inset:0;z-index:9500;
  background:rgba(8,12,20,.75);
  align-items:center;justify-content:center;
  padding:16px;
  opacity:0;transition:opacity .35s ease;
}
#whatsNewModal.is-visible{opacity:1}
#whatsNewBox{
  background:var(--panel);
  border:1px solid rgba(61,142,255,.4);
  border-radius:12px;
  padding:28px 28px 22px;
  max-width:500px;width:100%;
  box-shadow:0 16px 60px rgba(0,0,0,.65),0 0 0 1px rgba(61,142,255,.1);
  max-height:82vh;
  display:flex;flex-direction:column;
}
.wn-title{
  font-family:Georgia,'Times New Roman',serif;
  font-size:17px;letter-spacing:.14em;
  color:var(--gold);text-align:center;
  margin-bottom:18px;
}
.wn-ver-badge{
  display:inline-block;
  background:var(--gold-deep);
  color:var(--gold-light);
  font-size:10px;letter-spacing:.15em;
  padding:2px 8px;border-radius:4px;
  margin-left:8px;vertical-align:middle;
}
.wn-body{
  overflow-y:auto;flex:1;
  font-size:13px;color:var(--cream-dim);
  line-height:1.65;
  margin-bottom:18px;
}
.wn-body ul{list-style:none;padding:0;margin:0}
.wn-body li{
  padding:5px 0 5px 20px;
  position:relative;
  border-bottom:1px solid rgba(255,255,255,.04);
}
.wn-body li:last-child{border-bottom:none}
.wn-body li::before{content:"⚜";position:absolute;left:0;color:var(--gold-soft);font-size:11px;top:7px}
.wn-body li strong{color:var(--cream)}
.wn-notice{font-size:12.5px;color:var(--cream-dim);background:rgba(61,142,255,.07);border:1px solid rgba(61,142,255,.2);padding:9px 13px;margin-bottom:14px;line-height:1.6}
.wn-notice strong{color:var(--gold-light)}
.wn-thanks{font-size:11px;color:var(--dim);letter-spacing:.06em;margin-top:10px}
.wn-footer{
  display:flex;align-items:center;gap:12px;
  border-top:1px solid rgba(255,255,255,.07);
  padding-top:16px;
}
.wn-dont-label{
  display:flex;align-items:center;gap:7px;
  font-size:11px;color:var(--dim);
  cursor:pointer;letter-spacing:.05em;flex:1;
  user-select:none;
}
.wn-dont-label input[type=checkbox]{
  width:14px;height:14px;
  accent-color:var(--gold);
  cursor:pointer;flex-shrink:0;
}

body.no-walker #walkerBar{display:none !important}

/* Walker */
#walkerBar{
  position:fixed;bottom:0;left:0;width:100%;height:72px;
  pointer-events:none;z-index:50;overflow:visible;
}
#walkerGroup{
  position:absolute;bottom:0;left:0;width:100%;height:100%;
}
#wkCamelWrap,#wkCharWrap{
  position:absolute;bottom:0;left:-200px;
  display:flex;align-items:flex-end;
  will-change:left;
}
#wkPeekHead{
  position:absolute;bottom:10px;left:-65px;
  will-change:left;display:none;
}
@keyframes wk-fwd{0%,100%{transform:rotate(-13deg)}50%{transform:rotate(13deg)}}
@keyframes wk-bwd{0%,100%{transform:rotate(13deg)} 50%{transform:rotate(-13deg)}}
@keyframes wk-bob-char {0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes wk-bob-camel{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes wk-arm-wave{0%,100%{transform:rotate(-15deg)}50%{transform:rotate(-75deg)}}
#walkerChar {animation:wk-bob-char  .5s  ease-in-out infinite;overflow:visible}
#walkerCamel{animation:wk-bob-camel .65s ease-in-out infinite}
#wkCharLegL,#wkCharLegR,#wkCharArmL,#wkCharArmR{transform-box:fill-box;transform-origin:50% 0%}
#wkCharLegL,#wkCharArmR{animation:wk-fwd .5s ease-in-out infinite}
#wkCharLegR,#wkCharArmL{animation:wk-bwd .5s ease-in-out infinite}
.wk-cl-a,.wk-cl-b{transform-box:fill-box;transform-origin:50% 0%}
.wk-cl-a{animation:wk-fwd .65s ease-in-out infinite}
.wk-cl-b{animation:wk-bwd .65s ease-in-out infinite}
/* Looking: pause legs, both arms wave (shield eyes) */
#wkCharWrap.wk-looking #wkCharLegL,
#wkCharWrap.wk-looking #wkCharLegR{animation-play-state:paused}
#wkCharWrap.wk-looking #wkCharArmL,
#wkCharWrap.wk-looking #wkCharArmR{animation:wk-arm-wave .75s ease-in-out infinite}
/* Camel stopped: freeze legs and bob */
#wkCamelWrap.wk-stopped .wk-cl-a,
#wkCamelWrap.wk-stopped .wk-cl-b{animation-play-state:paused}
#wkCamelWrap.wk-stopped #walkerCamel{animation-play-state:paused}
/* Forearm elbow joint */
#wkCharForeArmR{transform-box:fill-box;transform-origin:50% 0%}
/* Scratching head: legs + left arm frozen, upper-right arm raises, forearm scratches */
@keyframes wk-arm-scratch-up  {0%,100%{transform:rotate(-148deg)}50%{transform:rotate(-160deg)}}
@keyframes wk-arm-scratch-fore{0%,100%{transform:rotate(-85deg)} 50%{transform:rotate(-120deg)}}
#wkCharWrap.wk-scratching #wkCharLegL,
#wkCharWrap.wk-scratching #wkCharLegR,
#wkCharWrap.wk-scratching #wkCharArmL{animation-play-state:paused}
#wkCharWrap.wk-scratching #wkCharArmR    {animation:wk-arm-scratch-up   .65s ease-in-out infinite}
#wkCharWrap.wk-scratching #wkCharForeArmR{animation:wk-arm-scratch-fore .65s ease-in-out infinite}
/* Cartoon jump: bounce up then settle, arms fly up, legs freeze */
@keyframes wk-jump{0%,100%{bottom:0}20%{bottom:28px}52%{bottom:2px}72%{bottom:16px}88%{bottom:1px}}
#wkCharWrap.wk-jumping{animation:wk-jump .46s ease-out}
#wkCharWrap.wk-jumping #wkCharLegL,
#wkCharWrap.wk-jumping #wkCharLegR{animation-play-state:paused}
#wkCharWrap.wk-jumping #wkCharArmL,
#wkCharWrap.wk-jumping #wkCharArmR{animation:wk-arm-wave .23s ease-out forwards}
/* Running: faster limb animation */
#wkCharWrap.wk-running #wkCharLegL,
#wkCharWrap.wk-running #wkCharLegR,
#wkCharWrap.wk-running #wkCharArmL,
#wkCharWrap.wk-running #wkCharArmR{animation-duration:.22s}
#wkCharWrap.wk-running #walkerChar{animation-duration:.22s}

/* Feedback launcher */
#feedbackContainer{
  position:fixed;
  left:12px;
  bottom:12px;
  z-index:10000;
}
.feedback-fab-mini{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 10px;
  font-family:'Cinzel',serif;
  font-size:9px;
  font-weight:600;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--gold-light);
  background:rgba(26,14,8,.94);
  border:1px solid var(--gold-dark);
  border-radius:3px;
  cursor:pointer;
  box-shadow:0 4px 16px rgba(0,0,0,.35);
}
.feedback-fab-mini:hover,
.feedback-fab-mini:focus-visible{
  border-color:var(--gold-soft);
  color:var(--cream);
  outline:none;
}

/* Feedback modal */
#feedbackModal{
  display:none;
  position:fixed;inset:0;
  z-index:11000;
  background:rgba(4,2,0,.78);
  backdrop-filter:blur(2px);
  align-items:center;justify-content:center;
  padding:16px;
  opacity:0;
  transition:opacity .3s ease;
}
#feedbackModal.is-visible{opacity:1}

#feedbackModalBox{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:440px;
  animation:fbSlideIn .32s ease-out both;
}
@keyframes fbSlideIn{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}

/* Character gripping top of modal */
.fb-char-topper{
  position:relative;
  z-index:1;
  width:100%;
  margin-bottom:-22px;
  pointer-events:none;
  line-height:0;
}
.fb-char-topper svg{
  width:100%;height:auto;
  filter:drop-shadow(0 -3px 10px rgba(0,0,0,.5));
}

/* Form body (the "held" panel) */
.fb-bubble-body{
  position:relative;
  width:100%;
  background:#130a04;
  border:1px solid var(--gold-soft);
  border-radius:12px;
  padding:20px 22px 18px;
  box-shadow:0 16px 60px rgba(0,0,0,.9),inset 0 1px 0 rgba(127,179,255,.06);
}

.fb-close{
  position:absolute;
  top:10px;right:10px;
  background:transparent;
  border:1px solid var(--gold-deep);
  color:var(--cream-dim);
  cursor:pointer;
  width:22px;height:22px;
  font-size:11px;
  line-height:1;
  padding:0;
  display:flex;align-items:center;justify-content:center;
  font-family:inherit;
  transition:background .12s, border-color .12s, color .12s;
}
.fb-close:hover{
  background:rgba(61,142,255,.12);
  border-color:var(--gold-soft);
  color:var(--cream);
}

.fb-title{
  margin:0 0 10px;
  padding-bottom:9px;
  border-bottom:1px solid var(--gold-deep);
  font-family:'Cinzel',serif;
  font-size:10px;font-weight:600;
  letter-spacing:3px;text-transform:uppercase;
  color:var(--gold-light);text-shadow:0 1px 0 #000;
  display:flex;align-items:center;gap:8px;
}
.fb-title-glyph{
  color:var(--gold);font-size:9px;
  text-shadow:0 0 8px rgba(61,142,255,.5);
}

.fb-field-label{
  display:block;
  font-family:'Cinzel',serif;
  font-size:9px;
  font-weight:600;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--cream-dim);
  margin:8px 0 5px;
}
.fb-field-label .fb-opt{
  color:var(--muted);
  font-weight:400;
  letter-spacing:1px;
  text-transform:none;
  font-style:italic;
  font-family:'Cormorant Garamond',serif;
  font-size:11px;
}

/* Type selector - segmented (wood) */
.fb-type-row{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:0;
  margin-bottom:4px;
  border:1px solid var(--gold-dark);
  background:#1f120a;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.7), inset 0 0 0 1px rgba(0,0,0,.4);
}
.fb-type{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:7px 6px;
  font-family:'Cinzel',serif;
  font-size:9.5px;
  font-weight:600;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--cream-dim);
  cursor:pointer;
  user-select:none;
  border-right:1px solid var(--gold-deep);
  transition:background .12s, color .12s;
}
.fb-type:last-child{border-right:none}
.fb-type input{
  position:absolute;
  opacity:0;
  pointer-events:none;
  width:0;height:0;
}
.fb-type:hover{
  background:rgba(61,142,255,.06);
  color:var(--cream);
}
.fb-type-glyph{
  font-size:11px;
  color:var(--gold-soft);
  line-height:1;
  transition:color .12s, text-shadow .12s;
}
.fb-type:has(input:checked){
  background:rgba(61,142,255,.06);
  color:var(--gold-light);
  text-shadow:0 1px 0 #000;
  box-shadow:inset 0 0 0 1px var(--gold-soft);
}
.fb-type:has(input:checked) .fb-type-glyph{
  color:var(--gold-light);
  text-shadow:0 0 8px rgba(127,179,255,.55);
}
.fb-type:has(input[value="bug"]:checked){
  background:rgba(217,107,90,.05);
  color:#fca5a5;
  box-shadow:inset 0 0 0 1px #b91c1c;
}
.fb-type:has(input[value="bug"]:checked) .fb-type-glyph{
  color:#fca5a5;
  text-shadow:0 0 8px rgba(217,107,90,.5);
}

#feedbackForm input,
#feedbackForm textarea{
  width:100%;
  padding:7px 10px;
  font-size:12px;
  margin:0;
  background:#1a1008;
  color:var(--cream);
}
#feedbackForm textarea{
  font-family:'Cormorant Garamond',serif;
  font-size:13px;
  line-height:1.45;
  background:#1a1008;
  color:var(--cream);
  resize:vertical;
  min-height:80px;
  cursor:text;
}

.fb-submit{
  width:100%;
  margin-top:10px;
  padding:8px 14px;
  font-size:10px;
  letter-spacing:2.5px;
}

.fb-status{
  text-align:center;
  margin-top:8px;
  min-height:14px;
  font-family:'Cormorant Garamond',serif;
  font-size:13px;
  font-style:italic;
  color:var(--cream-dim);
  letter-spacing:.3px;
}
.fb-status.ok{color:var(--green);font-style:normal;font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;text-transform:uppercase}
.fb-status.err{color:var(--red);font-style:normal;font-family:'Cinzel',serif;font-size:10px;letter-spacing:2px;text-transform:uppercase}
.fb-status.pending{color:var(--gold-soft)}

body .feedback-fab-mini{
  background:rgba(19,22,28,.94);
  border-color:#3a4555;
  color:#7fb3ff;
}
body .feedback-fab-mini:hover,
body .feedback-fab-mini:focus-visible{
  border-color:#3d8eff;
  color:var(--cream);
}

body .fb-bubble-body{
  background:#0d1018;
  border-color:#3d8eff;
}
body .fb-bubble-body::before{border-top-color:#3d8eff}
body .fb-bubble-body::after{border-top-color:#0d1018}
body .fb-title{color:var(--cream);text-shadow:none;border-bottom-color:#1f2530}
body .fb-title-glyph{color:var(--gold);text-shadow:none}
body .fb-close{border-color:#2a3445;border-radius:4px}
body .fb-close:hover{background:#1f2530;border-color:#3a4555;color:var(--cream)}
body .fb-field-label{color:var(--cream-dim);letter-spacing:1px;font-weight:500}
body .fb-type-row{border-color:#2a3445;background:#0a0c10;border-radius:6px;box-shadow:none;overflow:hidden}
body .fb-type{color:var(--cream-dim);letter-spacing:1px;font-weight:500;border-right-color:#1f2530}
body .fb-type:hover{background:#13161c;color:var(--cream)}
body .fb-type-glyph{color:var(--gold-soft)}
body .fb-type:has(input:checked){background:rgba(61,142,255,.14);color:var(--gold-light);text-shadow:none;box-shadow:inset 0 0 0 1px var(--gold)}
body .fb-type:has(input:checked) .fb-type-glyph{color:var(--gold-light);text-shadow:none}
body .fb-type:has(input[value="bug"]:checked){background:rgba(248,113,113,.14);color:#fca5a5;box-shadow:inset 0 0 0 1px #f87171}
body .fb-type:has(input[value="bug"]:checked) .fb-type-glyph{color:#fca5a5;text-shadow:none}
body .fb-status.ok{color:#34d399}
body .fb-status.err{color:#f87171}
body .fb-status.pending{color:var(--gold-light)}

@media (max-width:520px){
  #feedbackModalBox{max-width:min(96vw,440px)}
}

/* Compact rows */
body.compact td{padding:2px 10px !important;font-size:11px;line-height:1.3}
body.compact .good-icon{width:13px;height:13px}

#footer{flex-shrink:0}
