/* ============================================================
   THE LOFT MC — theme
   Loads AFTER store.css. Palette sampled from the pixel logo.
   ============================================================ */

:root{
  --outline:#2e222f;
  --blue-lt:#8fd3ff;
  --blue:#4d9be6;
  --blue-dp:#4d65b4;
  --blue-dpr:#424d85;
  --gold:#f9c22b;
  --gold-lt:#fbff86;
  --gold-dp:#c9971f;

  --sky-1:#eaf6ff;
  --sky-2:#cbe7fb;
  --sky-3:#a9d4f5;

  --paper:#ffffff;
  --paper-2:#e8f4ff;
  --edge:#c3e0f8;
  --edge-dark:#8fc0e8;

  --ink:#2e222f;
  --ink-dim:#5b4f5f;
  --ink-faint:#8f8593;

  --ok:#3faa5c;
  --bad:#c8443c;

  --display:'Space Grotesk', sans-serif;
  --body:'Inter', sans-serif;
}

/* ---------- Base ---------- */
body.loft-body{
  font-family:var(--body);
  color:var(--ink);
  background:linear-gradient(180deg, var(--sky-2) 0%, var(--sky-3) 55%, #93c7f0 100%) !important;
  background-attachment:fixed;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
/* pixel art only stays crisp where there's density for it */
.loft-body img{ image-rendering:auto; }

@media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi){
  .loft-body img{ image-rendering:pixelated; }
  .loft-brand img{ image-rendering:auto; }
}

.loft-body h1, .loft-body h2, .loft-body h3,
.loft-body h4, .loft-body h5, .loft-body h6{
  font-family:var(--display);
  color:var(--ink);
  letter-spacing:-0.02em;
}
.loft-body a:not([class]){ color:var(--blue-dp); }
.loft-body a:not([class]):hover{ color:var(--gold-dp); }

/* shared block surface */
.loft-block,
.loft-content,
.loft-form-card,
.loft-card,
.loft-row-card,
.loft-tier-card,
.loft-empty,
.loft-feat-card{
  background:var(--paper);
  border:3px solid var(--outline);
  border-radius:5px;
  box-shadow:8px 8px 0 var(--blue-dpr);
}

/* ---------- Header ---------- */
.loft-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(234,246,255,0.94);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:3px solid var(--outline);
}
.loft-header-inner{
  max-width:1180px; margin:0 auto; padding:10px 22px;
  display:flex; align-items:center; gap:14px;
}
.loft-brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--display); font-weight:700; font-size:1.02rem;
  color:var(--ink) !important; flex-shrink:0;
}
.loft-brand img{ width:38px; height:38px; }

.loft-nav{ flex:1; display:flex; justify-content:center; }
.loft-nav ul{ display:flex; gap:2px; list-style:none; margin:0; padding:0; }
.loft-nav-item{ position:relative; }
.loft-nav-item > a,
.loft-nav-item > button{
  display:flex; align-items:center; gap:6px;
  background:none; border:none;
  color:var(--ink); font-size:0.88rem; font-weight:600;
  padding:8px 14px; border-radius:4px; cursor:pointer;
  text-transform:none;
  transition:background .15s, transform .15s;
}
.loft-nav-item > a:hover,
.loft-nav-item > button:hover{ background:var(--paper); transform:translateY(-1px); }
.loft-caret{
  width:6px; height:6px; border-right:2px solid currentColor;
  border-bottom:2px solid currentColor; transform:rotate(45deg); margin-top:-3px; opacity:.6;
}

.loft-nav-item .loft-dropdown{
  position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(-6px);
  min-width:200px;
  background:var(--paper); border:3px solid var(--outline); border-radius:5px;
  padding:6px; box-shadow:7px 7px 0 var(--blue-dpr);
  opacity:0; visibility:hidden; z-index:1200;
  transition:opacity .16s, transform .16s, visibility .16s;
}
/* invisible bridge so hover survives the gap */
.loft-nav-item .loft-dropdown::before{
  content:'';
  position:absolute;
  bottom:100%;
  left:0; right:0;
  height:14px;
}
.loft-nav-item:hover .loft-dropdown,
.loft-nav-item:focus-within .loft-dropdown{
  opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
}
.loft-nav-item .loft-dropdown a{
  display:block; padding:9px 12px; border-radius:3px;
  font-size:0.86rem; font-weight:600; color:var(--ink-dim);
}
.loft-nav-item .loft-dropdown a:hover{ background:var(--blue-lt); color:var(--outline); }

/* header right cluster — all buttons share one height */
.loft-header-right{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.loft-ip-text{ display:none; }
.loft-ip, .loft-discord, .loft-basket, .loft-login, .loft-user-btn, .loft-burger{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:38px; padding:0 14px;
  background:var(--paper); color:var(--ink) !important;
  border:3px solid var(--outline); border-radius:5px;
  font-size:0.8rem; font-weight:700; white-space:nowrap;
  box-shadow:4px 4px 0 var(--blue-dpr); cursor:pointer;
  transition:transform .16s, box-shadow .16s;
}
.loft-ip:hover, .loft-discord:hover, .loft-basket:hover,
.loft-login:hover, .loft-user-btn:hover, .loft-burger:hover{
  transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--blue-dpr);
}
.loft-basket{ background:var(--gold); }
/* icon-only buttons stay square */
.loft-discord{ width:38px; padding:0; background:var(--blue-lt); }
.loft-burger{ width:44px; padding:0; flex-direction:column; gap:4px; display:none; }
.loft-burger i{ display:block; width:18px; height:3px; background:var(--outline); }

.loft-user{ position:relative; }
.loft-user .dropdown-menu{
  background:var(--paper); border:3px solid var(--outline) !important;
  border-radius:5px; padding:6px; box-shadow:7px 7px 0 var(--blue-dpr);
}
.loft-user .dropdown-item,
.loft-nav .dropdown-item{
  border-bottom:none !important;
  border-radius:3px; font-weight:600; color:var(--ink-dim);
}
.loft-user .dropdown-item:hover{ background:var(--gold); color:var(--outline); }

/* ---------- Mobile nav ---------- */
.loft-mobile-nav{
  border-top:3px solid var(--outline);
  background:var(--paper); padding:12px 22px 18px;
}
.loft-mobile-nav ul{ list-style:none; margin:0; padding:0; }
.loft-mnav-item, .loft-mnav-parent, .loft-mnav-child{
  display:block; padding:11px 14px; margin-bottom:6px;
  background:var(--paper-2); border:2px solid var(--outline); border-radius:4px;
  font-size:0.9rem; font-weight:700; color:var(--ink) !important;
}
.loft-mnav-child{ margin-left:16px; background:var(--paper); font-weight:600; }
.loft-mnav-item:hover, .loft-mnav-parent:hover, .loft-mnav-child:hover{ background:var(--blue-lt); }
.loft-mnav-login{ background:var(--gold); }
.loft-mnav-ip{
  display:block; padding:10px 14px; font-family:monospace;
  font-size:0.85rem; color:var(--ink-faint); text-align:center;
}

/* ---------- Layout: content, then modules in a grid ---------- */
.loft-main{ max-width:1080px; margin:0 auto; padding:22px; }
.loft-content{ min-height:400px; overflow:hidden; margin-bottom:22px; }

.loft-modules{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:22px;
  align-items:start;
}
/* modules go full width by default */
.loft-modules > .loft-module{ grid-column:1 / -1; }
/* except these three, which sit side by side */
.loft-modules > .loft-status,
.loft-modules > .loft-recent,
.loft-modules > .loft-donator{ grid-column:auto; }

.loft-modules .loft-module{
  background:var(--paper);
  border:3px solid var(--outline) !important;
  border-radius:5px;
  box-shadow:8px 8px 0 var(--blue-dpr);
  padding:24px 22px !important;
}
.loft-modules .loft-nav-module{ display:none; }

/* homepage: sections sit on the background, not in one panel */
.loft-is-home .loft-content{
  background:transparent;
  border:none;
  box-shadow:none;
  overflow:visible;
}
.loft-is-home .loft-category{ padding:0; }

.loft-home-logo{ margin:0 0 24px; text-align:center; }
.loft-home-logo img{
  width:min(340px, 85%);
  height:auto;
  display:inline-block;
}

/* ---------- Modules ---------- */
.loft-module{
  padding:18px 16px !important;
  background:transparent;
}

/* module headings — display type, normal case (beats store.css `.module h5`) */
.loft-module h5,
.loft-modules h5,
.loft-module .loft-module-title,
.loft-goal-heading{
  font-family:var(--display) !important;
  font-weight:700 !important;
  font-size:1.18rem !important;
  letter-spacing:-0.02em !important;
  text-transform:none !important;
  color:var(--ink) !important;
  margin:0 0 8px !important;
}

/* sidebar navigation (hidden in this layout, kept for reuse) */
.loft-sidenav{ list-style:none; margin:0; padding:0; }
.loft-sidenav-item{
  display:block; padding:10px 13px; margin-bottom:5px;
  background:var(--paper-2); border:2px solid var(--outline); border-radius:4px;
  font-size:0.88rem; font-weight:700; color:var(--ink) !important;
  transition:background .15s, transform .15s;
}
.loft-sidenav-item:hover{ background:var(--blue-lt); transform:translateX(2px); }
.loft-sidenav-child{ margin-left:14px; background:var(--paper); font-weight:600; font-size:0.84rem; }
.nav-parent:after{ font-size:0.7rem; opacity:.6; }

/* ---------- Goal panel ---------- */
.loft-goal-panel{
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
}
.loft-goal-num{
  flex-shrink:0;
  font-family:var(--display); font-weight:700;
  font-size:2.6rem; line-height:1; color:var(--ink);
  letter-spacing:-0.04em;
}
.loft-goal-num span{ font-size:1.1rem; color:var(--ink-faint); }
.loft-goal-text{ flex:1; min-width:240px; }
.loft-goal-blurb{
  color:var(--ink-dim); font-size:0.9rem; line-height:1.55;
  margin:0 0 14px; max-width:460px;
}

.loft-goal-img{ text-align:center; margin-bottom:12px; }
.loft-goal-img img{
  max-width:150px; height:auto;
  border:3px solid var(--outline); border-radius:5px;
  box-shadow:4px 4px 0 var(--blue-dpr);
}
.loft-goal-desc{
  color:var(--ink-dim); font-size:0.9rem; line-height:1.55; margin-bottom:14px;
}
.loft-goal-desc p:last-child{ margin-bottom:0; }

/* segmented block progress bar */
.loft-track{
  display:flex; gap:4px; height:18px; max-width:460px;
  background:transparent; border:none;
}
.loft-track-seg{
  flex:1; background:var(--paper-2);
  border:2px solid var(--outline); border-radius:2px;
}
.loft-track-seg.on{ background:var(--gold); }

.loft-goal-repeat{
  margin:12px 0 0; padding-top:10px; border-top:2px solid var(--paper-2);
  font-size:0.82rem; color:var(--ink-dim);
}
.loft-goal-stat{
  margin:10px 0 0; font-family:var(--display);
  font-weight:700; font-size:0.9rem; color:var(--ink-dim);
}
.loft-goal-stat span{
  font-family:var(--body); font-weight:600; font-size:0.8rem; color:var(--ink-faint);
}

/* ---------- Featured package module ---------- */
.loft-feat-card{ box-shadow:5px 5px 0 var(--blue-dpr); overflow:hidden; transition:transform .18s, box-shadow .18s; }
.loft-feat-card:hover{ transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--blue-dpr); }
.loft-feat-img{
  display:block; background:var(--paper-2);
  border-bottom:3px solid var(--outline); text-align:center; padding:14px;
}
.loft-feat-img img{ max-width:100%; max-height:150px; height:auto; margin:0 auto; display:block; }
.loft-feat-noimg{ display:flex; align-items:center; justify-content:center; min-height:120px; color:var(--blue); }
.loft-feat-body{ padding:14px 14px 12px; }
.loft-feat-name{ font-family:var(--display); font-weight:700; font-size:1rem; margin:0 0 8px; }
.loft-feat-price{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.loft-feat-amount{ font-family:var(--display); font-weight:700; font-size:1.1rem; color:var(--blue-dp); }
.loft-feat-amount small{ font-size:0.72rem; color:var(--ink-faint); }
.loft-feat-was{ font-size:0.8rem; font-weight:600; color:var(--ink-faint); }
.loft-feat-foot{ padding:0 14px 14px; }
.loft-feat-btn{
  display:block; width:100%; text-align:center;
  background:var(--gold); color:var(--outline) !important;
  border:3px solid var(--outline); border-radius:5px;
  padding:9px 12px; font-weight:700; font-size:0.85rem;
  box-shadow:4px 4px 0 var(--outline);
  transition:transform .16s, box-shadow .16s;
}
.loft-feat-btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--outline); }
.loft-feat-btn:active{ transform:translate(3px,3px); box-shadow:0 0 0 var(--outline); }

/* ---------- Gift card module ---------- */
.loft-gc-row{ display:flex; gap:8px; }
.loft-gc-input{
  flex:1; min-width:0;
  background:var(--paper-2); border:3px solid var(--outline); border-radius:4px;
  padding:9px 12px; font-family:var(--body); font-weight:600; font-size:0.84rem; color:var(--ink);
}
.loft-gc-input::placeholder{ color:var(--ink-faint); }
.loft-gc-input:focus{ outline:none; box-shadow:0 0 0 3px rgba(249,194,43,0.55); }
.loft-gc-btn{
  background:var(--gold); color:var(--outline);
  border:3px solid var(--outline); border-radius:4px;
  padding:9px 14px; font-weight:700; font-size:0.82rem; cursor:pointer;
  box-shadow:3px 3px 0 var(--outline);
}
.loft-gc-btn:active{ transform:translate(3px,3px); box-shadow:none; }

/* ---------- Notes / alerts ---------- */
.loft-note{
  margin-top:12px; padding:10px 13px;
  border:3px solid var(--outline); border-radius:4px;
  font-size:0.85rem; font-weight:600; color:var(--ink);
}
.loft-note-success, .loft-note-good{ background:#d8f3de; }
.loft-note-danger, .loft-note-error, .loft-note-bad{ background:#fadad8; }
.loft-note-warning, .loft-note-warn{ background:#fdf0cd; }
.loft-note-info{ background:var(--paper-2); }
.notification .loft-note{ margin:0 0 18px; }

/* ---------- Recent supporters (avatar strip) ---------- */
.loft-recent-strip{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
}
.loft-recent-item{
  position:relative;
  display:inline-block;
  line-height:0;
}
.loft-recent-av{
  width:36px; height:36px;
  border:2px solid var(--outline); border-radius:4px;
  box-shadow:3px 3px 0 var(--blue-dpr);
  transition:transform .16s, box-shadow .16s;
}
.loft-recent-item:hover .loft-recent-av{
  transform:translate(-2px,-2px);
  box-shadow:5px 5px 0 var(--gold);
}

/* custom tooltip */
.loft-recent-item::after{
  content:attr(data-name);
  position:absolute;
  bottom:calc(100% + 10px);
  left:50%;
  transform:translateX(-50%) translateY(4px);
  background:var(--paper);
  color:var(--ink);
  border:3px solid var(--outline);
  border-radius:4px;
  box-shadow:3px 3px 0 var(--blue-dpr);
  padding:5px 10px;
  font-family:var(--body);
  font-size:0.76rem;
  font-weight:700;
  line-height:1.3;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:50;
  transition:opacity .14s, transform .14s, visibility .14s;
}
.loft-recent-item:hover::after{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}

.loft-recent-empty{
  font-size:0.87rem; color:var(--ink-faint); text-align:center; margin:0;
}

/* ---------- Server status (compact) ---------- */
.loft-status-line{
  display:flex; align-items:center; justify-content:center;
  gap:9px; flex-wrap:wrap;
  font-size:0.9rem; color:var(--ink-dim);
}
.loft-status-line strong{ font-family:var(--display); color:var(--ink); font-size:1.05rem; }
.loft-dot{
  width:10px; height:10px; border-radius:50%;
  border:2px solid var(--outline); flex-shrink:0;
}
.loft-dot-on{ background:var(--ok); }
.loft-dot-off{ background:var(--bad); }
.loft-status-sep{ color:var(--ink-faint); }
.loft-status-ip{
  font-family:monospace; font-size:0.85rem;
  color:var(--ink-dim); word-break:break-all;
}

/* ---------- Top donator ---------- */
.loft-donator-row{ display:flex; align-items:center; gap:13px; }
.loft-donator-skin{
  width:40px; height:40px;
  border:3px solid var(--gold);
  flex-shrink:0;
}
.loft-donator-name{ font-family:var(--display); font-weight:700; font-size:1rem; margin:0; }
.loft-donator-meta{ font-size:0.82rem; color:var(--ink-dim); }
.loft-donator-empty{ font-size:0.85rem; color:var(--ink-faint); text-align:center; }

/* ---------- Text module ---------- */
.loft-text-body{ font-size:0.88rem; color:var(--ink-dim); line-height:1.6; }
.loft-text-body p:last-child{ margin-bottom:0; }

/* ---------- Content topbar (category / package pages) ---------- */
.loft-topbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; padding:10px 14px;
  background:var(--paper-2); border-bottom:3px solid var(--outline);
}
.loft-topbar-left, .loft-topbar-right{ display:flex; align-items:center; gap:8px; }
.loft-topbar-btn{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--paper); color:var(--ink);
  border:2px solid var(--outline); border-radius:4px;
  padding:6px 12px; font-size:0.8rem; font-weight:700; cursor:pointer;
  box-shadow:3px 3px 0 var(--blue-dpr);
}
.loft-topbar-btn:hover{ background:var(--blue-lt); }
.loft-basket-btn{ background:var(--gold); }
.loft-basket-empty{ opacity:.6; }
.loft-basket-mobile{ display:none; }

.loft-basket-dropdown{
  min-width:26rem; padding:0 !important;
  background:var(--paper); border:3px solid var(--outline) !important;
  border-radius:5px; box-shadow:8px 8px 0 var(--blue-dpr);
}
.loft-mini-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:14px 16px; border-bottom:3px solid var(--outline); background:var(--paper-2);
}
.loft-mini-head h5{ font-family:var(--display); font-weight:700; font-size:1rem; margin:0; }
.loft-mini-body{ padding:14px 16px; max-height:320px; overflow-y:auto; }
.loft-mini-row{
  display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center;
  padding:10px; margin-bottom:6px;
  background:var(--paper-2); border:2px solid var(--outline); border-radius:4px;
}
.loft-mini-name{ font-size:0.86rem; font-weight:700; min-width:0; }
.loft-mini-name a{ color:var(--ink) !important; }
.loft-mini-qty{ color:var(--ink-faint); font-weight:600; }
.loft-mini-price{ font-family:var(--display); font-weight:700; color:var(--blue-dp); font-size:0.86rem; }
.loft-mini-foot{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding:14px 16px; border-top:3px solid var(--outline); background:var(--paper-2);
}
.loft-mini-foot h4{ font-family:var(--display); font-size:0.98rem; margin:0; }

/* ---------- Category page ---------- */
.loft-category{ padding:30px 26px 36px; }
.loft-cat-head{ text-align:center; max-width:620px; margin:0 auto 28px; }
.loft-kicker{
  display:block; font-size:0.74rem; font-weight:700;
  letter-spacing:0.1em; text-transform:uppercase;
  color:var(--gold-dp); margin-bottom:8px;
}
.loft-cat-head h1{
  font-family:var(--display); font-weight:700;
  font-size:clamp(1.7rem, 4vw, 2.3rem); margin:0 0 10px; color:var(--ink);
}
.loft-cat-desc{ color:var(--ink-dim); font-size:0.95rem; line-height:1.6; }
.loft-cat-desc p:last-child{ margin-bottom:0; }
.loft-empty{
  padding:30px 24px; text-align:center;
  color:var(--ink-dim); font-weight:600; box-shadow:6px 6px 0 var(--blue-dpr);
}

/* ---------- Grid package cards ---------- */
.loft-card{ display:flex; flex-direction:column; height:100%; overflow:hidden; transition:transform .18s, box-shadow .18s; }
.loft-card:hover{ transform:translate(-3px,-3px); box-shadow:11px 11px 0 var(--blue-dpr); }
.loft-card-img{
  position:relative; display:block; padding:16px; text-align:center;
  background:var(--paper-2); border-bottom:3px solid var(--outline);
}
.loft-card-img img{ max-width:100%; max-height:180px; height:auto; margin:0 auto; display:block; }
.loft-card-noimg{
  display:flex; align-items:center; justify-content:center;
  min-height:170px; color:var(--blue);
}
.loft-card-timer{ position:absolute; top:8px; left:0; right:0; text-align:center; }
.loft-card-body{ padding:16px; flex:1; }
.loft-card-name{ font-family:var(--display); font-weight:700; font-size:1.05rem; margin:0 0 8px; }
.loft-card-name a{ color:var(--ink) !important; }
.loft-card-name a:hover{ color:var(--gold-dp) !important; }
.loft-card-price{ display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; }
.loft-card-amount{ font-family:var(--display); font-weight:700; font-size:1.15rem; color:var(--blue-dp); }
.loft-card-amount small{ font-size:0.7rem; color:var(--ink-faint); }
.loft-card-was{ font-size:0.8rem; font-weight:600; color:var(--ink-faint); }
.loft-card-foot{ padding:0 16px 16px; }
.loft-card-btn{
  display:block; width:100%; text-align:center;
  background:var(--gold); color:var(--outline) !important;
  border:3px solid var(--outline); border-radius:5px;
  padding:10px 12px; font-weight:700; font-size:0.86rem;
  box-shadow:4px 4px 0 var(--outline);
  transition:transform .16s, box-shadow .16s;
}
.loft-card-btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--outline); }
.loft-card-btn:active{ transform:translate(3px,3px); box-shadow:0 0 0 var(--outline); }
.loft-card-btn-remove{ background:var(--bad); color:#fff !important; }
.loft-card.ending-soon, .loft-row-card.ending-soon{ border-color:var(--bad); box-shadow:8px 8px 0 var(--bad); }

/* ---------- List package rows ---------- */
.loft-row-card{
  display:grid; grid-template-columns:180px 1fr auto auto;
  gap:20px; align-items:center; padding:16px; margin-bottom:18px;
  transition:transform .18s, box-shadow .18s;
}
.loft-row-card:hover{ transform:translate(-3px,-3px); box-shadow:11px 11px 0 var(--blue-dpr); }
.loft-row-img{
  display:block; text-align:center; padding:10px;
  background:var(--paper-2); border:2px solid var(--outline); border-radius:4px;
}
.loft-row-img img{ max-width:100%; max-height:140px; height:auto; margin:0 auto; display:block; }
.loft-row-noimg{ display:flex; align-items:center; justify-content:center; min-height:120px; color:var(--blue); }
.loft-row-name{ font-family:var(--display); font-weight:700; font-size:1.15rem; margin:0 0 6px; }
.loft-row-name a{ color:var(--ink) !important; }
.loft-row-price{ text-align:center; }
.loft-row-action .loft-card-btn{ width:auto; padding:10px 22px; }

/* ---------- Tiered / subscription ---------- */
.loft-tiered{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(min(240px,100%), 1fr)); gap:22px;
}
.loft-tier-card{
  display:grid; grid-row:span 4; grid-template-rows:subgrid; gap:14px;
  padding:24px 22px; transition:transform .18s, box-shadow .18s;
}
.loft-tier-card:hover{ transform:translate(-3px,-3px); box-shadow:11px 11px 0 var(--blue-dpr); }
.loft-tier-card.subscribed{ border-color:var(--gold-dp); box-shadow:8px 8px 0 var(--gold-dp); }
.loft-tier-img{ max-width:70px; height:auto; margin:0 auto; }
.loft-tier-title{ font-family:var(--display); font-weight:700; font-size:1.15rem; margin:0; text-align:center; }
.loft-countdown{
  display:inline-block; font-size:0.68rem; font-weight:700;
  background:var(--bad); color:#fff;
  border:2px solid var(--outline); border-radius:4px;
  padding:2px 8px; margin-left:6px; vertical-align:middle;
}
.loft-tier-desc{ color:var(--ink-dim); font-size:0.88rem; line-height:1.55; }
.loft-tier-desc p:last-child{ margin-bottom:0; }
.loft-tier-price{ font-family:var(--display); font-weight:700; font-size:1.3rem; color:var(--blue-dp); margin:0 0 12px; text-align:center; }
.loft-tier-price small{ font-size:0.7rem; color:var(--ink-faint); }
.loft-tier-was{ display:block; font-size:0.82rem; color:var(--ink-faint); }
.loft-tier-actions .wide{ width:100%; }

/* ---------- Package detail ---------- */
.loft-pkg-head{ text-align:center; margin-bottom:24px; }
.loft-pkg-name{ font-family:var(--display); font-weight:700; font-size:clamp(1.6rem,3.6vw,2.2rem); margin:0 0 12px; }
.loft-pkg-price{ display:flex; align-items:baseline; justify-content:center; gap:12px; flex-wrap:wrap; }
.loft-pkg-amount{ font-family:var(--display); font-weight:700; font-size:1.7rem; color:var(--blue-dp); }
.loft-pkg-was{ font-size:1rem; font-weight:600; color:var(--ink-faint); }

/* package images hidden on the detail page — the description does the selling */
.loft-package .loft-pkg-media,
.loft-package .media-slider{ display:none; }

.loft-pkg-actions{ display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-bottom:20px; }
.loft-btn-wide{ min-width:190px; justify-content:center; }
.loft-gift-box{
  padding:20px; margin-bottom:22px;
  background:var(--paper-2); border:3px solid var(--outline); border-radius:5px;
}
.loft-pkg-desc{
  padding:24px; margin-top:26px;
  background:var(--paper-2); border:3px solid var(--outline); border-radius:5px;
  color:var(--ink-dim); line-height:1.65;
}
.loft-pkg-desc h4{ font-family:var(--display); font-weight:700; margin:0 0 12px; color:var(--ink); }
.loft-pkg-option{ font-size:0.8rem; color:var(--ink-faint); }

/* ---------- Rank / package descriptions ---------- */
.loft-rank{ display:grid; gap:18px; }
.loft-rank-section{
  background:var(--paper);
  border:3px solid var(--outline);
  border-radius:5px;
  box-shadow:5px 5px 0 var(--blue-dpr);
  padding:20px 22px;
}
.loft-rank-section h3{
  font-family:var(--display); font-weight:700; font-size:1.1rem;
  color:var(--ink); margin:0 0 14px;
  padding-bottom:10px; border-bottom:3px solid var(--paper-2);
}
.loft-rank-section ul{ list-style:none; margin:0; padding:0; }
.loft-rank-section li{
  position:relative; padding:6px 0 6px 22px;
  font-size:0.92rem; color:var(--ink-dim); line-height:1.5;
}
.loft-rank-section li::before{
  content:''; position:absolute; left:0; top:12px;
  width:9px; height:9px;
  background:var(--gold); border:2px solid var(--outline); border-radius:2px;
}
.loft-rank-section li strong{ color:var(--ink); }
.loft-rank-section li span{
  display:block; font-size:0.8rem; color:var(--ink-faint); margin-top:2px;
}
.loft-rank code{
  font-family:monospace; font-size:0.82rem; font-weight:700;
  background:var(--blue-lt); color:var(--outline);
  border:2px solid var(--outline); border-radius:3px;
  padding:1px 7px; margin-left:4px; white-space:nowrap;
}
.loft-rank a{
  color:var(--blue-dp); font-weight:700;
  border-bottom:2px solid var(--gold);
}
.loft-rank a:hover{ color:var(--gold-dp); }
.loft-rank-cmds{
  display:grid; grid-template-columns:1fr 1fr; gap:0 24px;
}
.loft-rank-intro{
  color:var(--ink-dim); font-size:0.95rem; line-height:1.6;
  margin:0 0 16px;
}
.loft-rank-note{
  margin:14px 0 0; padding:9px 12px;
  background:#fdf0cd; border:2px solid var(--outline); border-radius:4px;
  font-size:0.82rem; font-weight:600; color:var(--ink);
}
.loft-rank-inherit{
  margin:0; padding:11px 16px;
  background:var(--blue-lt); border:3px solid var(--outline); border-radius:5px;
  box-shadow:5px 5px 0 var(--blue-dpr);
  font-size:0.9rem; font-weight:600; color:var(--ink); text-align:center;
}
.loft-rank-inherit strong{ font-family:var(--display); }
.loft-rank-special{
  border-color:var(--gold-dp) !important;
  box-shadow:5px 5px 0 var(--gold-dp) !important;
}
.loft-rank-special h3{ border-bottom-color:var(--gold-lt); }
.loft-rank-special h3 em{
  font-style:normal; font-family:var(--body);
  font-size:0.72rem; font-weight:700;
  background:var(--gold); color:var(--outline);
  border:2px solid var(--outline); border-radius:100px;
  padding:2px 10px; margin-left:10px; vertical-align:middle;
}
.loft-rank-special li::before{ background:var(--gold-lt); }

/* ---------- Odds bars ---------- */
.loft-odds{ display:grid; gap:10px; }
.loft-odds-row{
  display:grid; grid-template-columns:90px 1fr 60px;
  gap:12px; align-items:center;
}
.loft-odds-rank{
  font-family:var(--display); font-weight:700;
  font-size:0.9rem; color:var(--ink);
}
.loft-odds-bar{
  height:18px; background:var(--paper-2);
  border:3px solid var(--outline); border-radius:4px;
  overflow:hidden; display:block;
}
.loft-odds-bar i{
  display:block; height:100%; background:var(--gold);
}
.loft-odds-pct{
  font-family:var(--display); font-weight:700;
  font-size:0.88rem; color:var(--blue-dp); text-align:right;
}

/* ---------- Buttons ---------- */
.loft-btn-primary, .loft-btn-alt, .loft-btn-remove, .loft-btn-muted,
.loft-btn-added, .loft-btn-discord, .loft-checkout-btn, .loft-promo-btn,
.loft-hero-btn{
  display:inline-flex; align-items:center; gap:8px;
  border:3px solid var(--outline) !important; border-radius:5px !important;
  padding:10px 22px; font-weight:700; font-size:0.88rem;
  text-transform:none; cursor:pointer;
  box-shadow:5px 5px 0 var(--outline);
  transition:transform .16s, box-shadow .16s;
}
.loft-btn-primary:hover, .loft-btn-alt:hover, .loft-btn-remove:hover,
.loft-btn-discord:hover, .loft-checkout-btn:hover, .loft-promo-btn:hover,
.loft-hero-btn:hover{ transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--outline); }
.loft-btn-primary:active, .loft-btn-alt:active, .loft-btn-remove:active,
.loft-checkout-btn:active, .loft-hero-btn:active{ transform:translate(3px,3px); box-shadow:0 0 0 var(--outline); }

.loft-btn-primary, .loft-hero-btn-gold{ background:var(--gold) !important; color:var(--outline) !important; }
.loft-btn-alt, .loft-hero-btn-blue{ background:var(--blue) !important; color:#fff !important; }
.loft-btn-remove{ background:var(--bad) !important; color:#fff !important; }
.loft-btn-added{ background:var(--blue) !important; color:#fff !important; box-shadow:4px 4px 0 var(--outline); }
.loft-btn-discord{ background:#5865f2 !important; color:#fff !important; }
.loft-btn-muted{
  background:var(--paper-2) !important; color:var(--ink-faint) !important;
  border-color:var(--edge-dark) !important; box-shadow:none; cursor:default;
}
.loft-btn-icon{ padding:8px 11px; box-shadow:3px 3px 0 var(--outline); }
.loft-content .btn:focus, .loft-content .btn.focus{ box-shadow:5px 5px 0 var(--outline); }
.loft-content .disabled, .loft-content [disabled]{ opacity:.5; pointer-events:none; }

/* ---------- Forms ---------- */
.loft-form-card{ margin-bottom:24px; overflow:hidden; }
.loft-form-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:16px 20px; background:var(--paper-2); border-bottom:3px solid var(--outline);
}
.loft-form-head h5{ font-family:var(--display); font-weight:700; font-size:1rem; margin:0; }
.loft-form-body{ padding:20px; }
.loft-form-foot{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding:16px 20px; background:var(--paper-2); border-top:3px solid var(--outline);
}
.loft-field{ margin-bottom:18px; }
.loft-label{
  display:block; margin-bottom:7px;
  font-size:0.82rem; font-weight:700; color:var(--ink);
  text-transform:none; letter-spacing:0;
}
.loft-input, .loft-select{
  width:100%; background:var(--paper-2);
  border:3px solid var(--outline); border-radius:4px;
  padding:10px 14px; color:var(--ink);
  font-family:var(--body); font-weight:600; font-size:0.88rem;
}
.loft-input::placeholder{ color:var(--ink-faint); }
.loft-input:focus, .loft-select:focus{ outline:none; box-shadow:0 0 0 3px rgba(249,194,43,0.55); }
.loft-input:disabled, .loft-input[readonly]{ opacity:.65; }
.loft-input-row{ display:flex; gap:9px; align-items:stretch; }
.loft-input-row .loft-input{ flex:1; min-width:0; }
.loft-input-suffix, .loft-input-icon{
  display:flex; align-items:center; padding:0 14px;
  background:var(--blue-lt); border:3px solid var(--outline); border-radius:4px;
  font-weight:700; font-size:0.85rem;
}
.loft-back{ font-weight:700; font-size:0.88rem; color:var(--ink-dim) !important; }
.loft-back:hover{ color:var(--gold-dp) !important; }
.loft-submit{ min-width:180px; justify-content:center; }

/* login form (Tebex-generated markup) */
.loft-loginform{ max-width:480px; }
.loft-loginform input[type="text"]{
  background:var(--paper-2);
  border:3px solid var(--outline);
  border-radius:4px;
  padding:0 14px !important;
  height:44px !important;
  line-height:38px !important;
  font-family:var(--body);
  font-size:0.9rem !important;
  font-weight:600;
  color:var(--ink);
  vertical-align:middle;
}
.loft-loginform input[type="text"]::placeholder{
  font-size:0.9rem;
  color:var(--ink-faint);
}
.loft-loginform button,
.loft-loginform input[type="submit"],
.loft-loginform .btn,
.loft-loginform a.btn{
  display:inline-block !important;
  width:auto !important;
  min-width:0 !important;
  height:44px !important;
  padding:0 22px !important;
  margin-left:14px !important;
  vertical-align:middle !important;
  font-family:var(--body) !important;
  font-size:0.84rem !important;
  font-weight:700 !important;
  line-height:38px !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  background:var(--gold) !important;
  color:var(--outline) !important;
  border:3px solid var(--outline) !important;
  border-radius:5px !important;
  box-shadow:4px 4px 0 var(--outline) !important;
  transition:transform .16s, box-shadow .16s !important;
}
.loft-loginform button:hover,
.loft-loginform input[type="submit"]:hover,
.loft-loginform .btn:hover{
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 var(--outline) !important;
}
.loft-loginform button:active,
.loft-loginform input[type="submit"]:active,
.loft-loginform .btn:active{
  transform:translate(3px,3px);
  box-shadow:0 0 0 var(--outline) !important;
}

/* ---------- Checkout ---------- */
.loft-checkout-bar{ padding:0; border-bottom:3px solid var(--outline); background:var(--paper-2); }
.loft-continue{
  display:inline-flex; align-items:center; gap:9px;
  padding:14px 20px; font-weight:700; font-size:0.88rem; color:var(--ink) !important;
  border-right:3px solid var(--outline);
}
.loft-continue:hover{ background:var(--blue-lt); }
.loft-checkout-cols{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }

.loft-basket-row{
  display:grid; grid-template-columns:1fr auto auto; gap:16px; align-items:center;
  padding:14px; margin-bottom:8px;
  background:var(--paper-2); border:2px solid var(--outline); border-radius:4px;
}
.loft-basket-info{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.loft-basket-name{ font-size:0.92rem; font-weight:700; }
.loft-basket-name a{ color:var(--ink) !important; }
.loft-basket-gift{ color:var(--gold-dp); margin-left:5px; }
.loft-basket-options{ font-size:0.78rem; color:var(--ink-faint); font-weight:600; }
.loft-basket-price{ font-family:var(--display); font-weight:700; color:var(--blue-dp); }
.loft-basket-actions{ display:flex; align-items:center; gap:8px; }
.loft-qty-input{ width:64px; text-align:center; padding:8px 6px; }
.loft-basket-total h4{ font-family:var(--display); font-size:1.15rem; margin:0; }
.loft-total{ font-family:var(--display); font-weight:700; }

.loft-applied{ margin-top:22px; padding-top:18px; border-top:3px solid var(--paper-2); }
.loft-applied-title{ font-family:var(--display); font-weight:700; font-size:0.92rem; margin:0 0 12px; }
.loft-table-wrap{ width:100%; overflow-x:auto; }
.loft-table{ width:100%; border-collapse:collapse; }
.loft-table td{
  padding:10px 12px; border-bottom:2px solid var(--paper-2);
  font-size:0.87rem; vertical-align:middle;
}
.loft-table tr:last-child td{ border-bottom:none; }
.loft-coupon-code{ font-family:monospace; font-weight:700; }
.loft-table-action{ text-align:right; width:1%; white-space:nowrap; }
.loft-table-action a{ color:var(--bad) !important; }

.loft-checkout-cta{
  padding:28px 24px; text-align:center;
  border-top:3px solid var(--outline); background:var(--paper-2);
}
.loft-checkout-btn{
  width:100%; max-width:520px; justify-content:center;
  background:var(--gold) !important; color:var(--outline) !important;
  padding:16px 26px; font-size:1.05rem;
  box-shadow:6px 6px 0 var(--outline);
}
.loft-checkout-btn:hover{ box-shadow:9px 9px 0 var(--outline); }

/* referral + gifting */
.loft-referral-box{
  margin-top:16px; padding:18px;
  background:var(--paper-2); border:3px solid var(--outline); border-radius:4px;
}
.loft-referral-intro{ font-size:0.87rem; color:var(--ink-dim); margin-bottom:14px; }
.loft-gifting{ margin-top:10px; }
.loft-gifting-check{ display:flex; align-items:center; gap:8px; font-size:0.85rem; font-weight:600; }
.loft-gifting-check label{ margin:0; text-transform:none; font-size:0.85rem; }
.loft-gifting-field{ margin-top:9px; }
.loft-share-intro{ font-size:0.9rem; color:var(--ink-dim); }

/* tier quote */
.loft-quote{ max-width:640px; margin:0 auto; padding:36px 26px; text-align:center; }
.loft-quote-head h2{ font-family:var(--display); font-weight:700; margin-bottom:12px; }
.loft-quote-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:24px; }

/* ---------- Modals ---------- */
.loft-modal .modal-content,
.remote-modal .modal-content{
  background:var(--paper);
  border:3px solid var(--outline) !important; border-radius:5px !important;
  box-shadow:10px 10px 0 var(--blue-dpr) !important;
}
.loft-modal .modal-header,
.remote-modal .modal-header{
  background:var(--paper-2); border-bottom:3px solid var(--outline);
}
.loft-modal .modal-title,
.remote-modal .modal-title{ font-family:var(--display); font-weight:700; color:var(--ink); }
.loft-modal-foot{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; flex-wrap:wrap; margin-top:20px;
}

/* ---------- CMS / prose ---------- */
.loft-cms{ color:var(--ink-dim); line-height:1.7; font-size:0.95rem; }
.loft-cms h1, .loft-cms h2, .loft-cms h3, .loft-cms h4{
  font-family:var(--display); color:var(--ink); margin-top:1.6em;
}
.loft-cms h1:first-child, .loft-cms h2:first-child{ margin-top:0; }
.loft-cms a{ color:var(--blue-dp); font-weight:600; }
.loft-cms a:hover{ color:var(--gold-dp); }
.loft-cms ul, .loft-cms ol{ padding-left:1.4em; }
.loft-cms li{ margin-bottom:.4em; }
.loft-cms img{ max-width:100%; height:auto; }

/* ---------- Promo banner ---------- */
.loft-promo{
  background:var(--gold); border-top:3px solid var(--outline); border-bottom:3px solid var(--outline);
  padding:22px; text-align:center;
}
.loft-promo-text{
  font-family:var(--display); font-weight:700; font-size:1.15rem;
  color:var(--outline); margin:0;
}
.loft-promo-btn{
  background:var(--paper) !important; color:var(--outline) !important;
  margin-left:12px; font-size:0.9rem;
}

/* ---------- Homepage ---------- */
.loft-hero{ text-align:center; padding:0 0 34px; }
.loft-hero-badge{
  display:inline-block; background:var(--gold); color:var(--outline);
  border:3px solid var(--outline); border-radius:5px;
  padding:6px 16px; font-size:0.8rem; font-weight:700;
  box-shadow:4px 4px 0 var(--outline); margin-bottom:20px;
}
.loft-hero-title{
  font-family:var(--display); font-weight:700;
  font-size:clamp(1.7rem,4vw,2.4rem); margin:0 0 14px; color:var(--ink);
}
.loft-hero-sub{ max-width:440px; margin:0 auto 26px; color:var(--ink-dim); line-height:1.6; }
.loft-hero-btns{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.loft-hero-foot{
  margin:18px 0 0; font-size:0.85rem;
  color:var(--ink-faint); font-weight:600;
}

.loft-home-cards{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.loft-home-card{
  padding:26px 24px;
  background:var(--paper); border:3px solid var(--outline); border-radius:5px;
  box-shadow:8px 8px 0 var(--blue-dpr);
  transition:transform .18s, box-shadow .18s;
}
.loft-home-card:hover{ transform:translate(-3px,-3px); box-shadow:11px 11px 0 var(--blue-dpr); }
.loft-home-icon{
  width:56px; height:56px; margin-bottom:16px;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  border:3px solid var(--outline); border-radius:5px;
}
.loft-home-icon-blue{ background:var(--blue-lt); }
.loft-home-icon-gold{ background:var(--gold-lt); }
.loft-home-card h3{ font-family:var(--display); font-weight:700; font-size:1.2rem; margin:0 0 8px; }
.loft-home-card p{ color:var(--ink-dim); font-size:0.9rem; line-height:1.55; margin:0 0 16px; }
.loft-home-link{
  display:inline-block; font-weight:700; font-size:0.87rem;
  color:var(--blue-dp) !important;
  border-bottom:2px solid var(--gold); padding-bottom:1px;
}
.loft-home-link:hover{ color:var(--gold-dp) !important; }

/* ---------- Media slider override (was teal) ---------- */
.loft-body .media-slider{
  --slider-fg:var(--gold);
  --slider-bg:var(--paper);
  --slider-border:var(--outline);
  --thumb-bg:var(--paper-2);
}
.loft-body .media-slider .slider{ border-width:3px; border-radius:5px; }
.loft-body .media-slider .thumb{ border:2px solid var(--outline); }

/* ---------- Footer ---------- */
.loft-footer{
  border-top:3px solid var(--outline);
  background:rgba(255,255,255,0.5); padding:22px 0;
}
.loft-footer-inner{
  max-width:1180px; margin:0 auto; padding:0 22px;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:10px; font-size:0.84rem; color:var(--ink-dim);
}
.loft-footer .branding{ display:block; color:var(--ink-faint); font-size:0.78rem; }
.loft-footer a{
  color:var(--blue-dp);
  font-weight:700;
  border-bottom:2px solid var(--gold);
}
.loft-footer a:hover{ color:var(--gold-dp); }

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .loft-nav{ display:none; }
  .loft-header-right{ margin-left:auto; }
  .loft-burger{ display:inline-flex; }
}
@media (max-width:1000px) and (min-width:901px){
  .loft-modules{ grid-template-columns:1fr 1fr; }
  .loft-modules > .loft-donator{ grid-column:1 / -1; }
}
@media (max-width:900px){
  .loft-modules{ grid-template-columns:1fr; }
  .loft-modules > .loft-status,
  .loft-modules > .loft-recent,
  .loft-modules > .loft-donator{ grid-column:1 / -1; }
  .loft-checkout-cols, .loft-home-cards{ grid-template-columns:1fr; }
  .loft-row-card{ grid-template-columns:1fr; text-align:center; }
  .loft-row-price, .loft-row-action{ text-align:center; }
  .loft-basket-row{ grid-template-columns:1fr; }
  .loft-basket-actions{ justify-content:center; }
  .loft-basket-dropdown{ min-width:auto; width:calc(100vw - 40px); }
  .loft-basket-label{ display:none; }
  .loft-discord, .loft-ip{ display:none; }
  .loft-main{ padding:16px; }
  .loft-category{ padding:24px 18px 28px; }
  .loft-goal-panel{ gap:18px; }
  .loft-goal-num{ font-size:2.1rem; }
  .loft-content, .loft-card, .loft-row-card,
  .loft-form-card, .loft-home-card,
  .loft-modules .loft-module{ box-shadow:6px 6px 0 var(--blue-dpr); }
}
@media (max-width:700px){
  .loft-rank-cmds{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .loft-track{ gap:3px; }
  .loft-track-seg{ border-width:1.5px; }
  .loft-mini-row{ grid-template-columns:1fr; }
  .loft-footer-inner{ justify-content:center; text-align:center; }
  .loft-pkg-actions .loft-btn-wide{ width:100%; }
}
@media (max-width:520px){
  .loft-odds-row{ grid-template-columns:80px 1fr 52px; gap:8px; }
}
@media (prefers-reduced-motion:reduce){
  .loft-body *{ transition:none !important; animation:none !important; }
}
@media (max-width:1100px){
  .loft-header{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    background:var(--sky-1);
  }
  .loft-mnav-copy{
    width:100%; text-align:left; cursor:pointer;
    font-family:var(--body);
  }
}
.loft-ip, .loft-burger, .loft-user-btn, .loft-mnav-copy{
  font-family:var(--body);
}
.loft-mobile-nav.collapsing{
  transition:none !important;
  height:auto !important;
}
@media (max-width:600px){
  .loft-rank-special h3 em{
    display:block;
    width:fit-content;
    margin:10px 0 0;
  }
}
.loft-checkout .loft-basket-row{ background:var(--paper); }
.loft-checkout .loft-mini-row{ background:var(--paper); }
.loft-checkout .loft-checkout-cta{
  background:var(--blue-lt);
  padding:34px 24px;
}
/* the total — the number people actually look for */
.loft-checkout .loft-basket-total{
  background:#e3f5e8;
  border-top:3px solid var(--outline);
}
/* coupon + referral recede, they're optional */
.loft-checkout-cols .loft-form-head{ background:var(--paper); }
/* ---------- Floating basket button ---------- */
.loft-fab{
  position:fixed; right:20px; bottom:20px; z-index:900;
  display:inline-flex; align-items:center; gap:9px;
  padding:12px 18px;
  background:var(--gold); color:var(--outline) !important;
  border:3px solid var(--outline); border-radius:100px;
  font-family:var(--body); font-weight:700; font-size:0.88rem;
  box-shadow:5px 5px 0 var(--outline);
  transition:transform .16s, box-shadow .16s;
}
.loft-fab:hover{ transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--outline); }
.loft-fab:active{ transform:translate(3px,3px); box-shadow:0 0 0 var(--outline); }
.loft-fab-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:22px; height:22px; padding:0 5px;
  background:var(--outline); color:var(--gold);
  border-radius:100px; font-size:0.76rem;
}
@media (max-width:600px){
  .loft-fab{ right:14px; bottom:14px; padding:10px 15px; font-size:0.82rem; }
  .loft-fab-price{ display:none; }
}
.loft-brand img{
  width:38px; height:38px;
  image-rendering:auto;
}
.loft-ip{ min-width:118px; justify-content:flex-start; }
/* ---------- Bootstrap tooltips ---------- */
.loft-body .tooltip-inner{
  background:var(--paper) !important;
  color:var(--ink) !important;
  border:3px solid var(--outline);
  border-radius:4px;
  box-shadow:3px 3px 0 var(--blue-dpr);
  font-family:var(--body);
  font-size:0.78rem;
  font-weight:700;
  padding:6px 11px;
  max-width:220px;
}
.loft-body .tooltip{ opacity:1 !important; }
.loft-body .tooltip .arrow::before{ display:none; }