/* mitch.pro ink layer — print geometry on top of theme tokens. */
:root {
  --surface: var(--t-bg2);
  --surface-strong: var(--t-bg3);
  --edge: var(--t-bd);
  --ink-shadow: none;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  max-width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 4.2rem;
}

body {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  -webkit-tap-highlight-color: color-mix(in srgb, var(--t-ac) 22%, transparent);
}

.app-main, .panel, .card, .cpanel, .action-card, .listing-item, main, section, article { min-width: 0; }
fieldset, form, label { min-width: 0; }
.page-head, .panel, .card, .cpanel, .action-card, .listing-item { overflow-wrap: anywhere; }
img, svg, video, canvas, iframe { max-width: 100%; }
pre, code { max-width: 100%; overflow-wrap: anywhere; }
pre { overflow-x: auto; -webkit-overflow-scrolling: touch; }
button, a, input, textarea, select { touch-action: manipulation; }

* {
  scrollbar-width: thin;
  scrollbar-color: var(--t-ac) transparent;
}

::selection {
  background: var(--t-ac);
  color: #10140c;
}

/* Full-bleed ink bar — never a floating glass capsule */
.app-topbar {
  isolation: isolate;
  width: 100% !important;
  min-height: 3.25rem;
  margin: 0 !important;
  padding: 0 clamp(0.85rem, 2.5vw, 2rem) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--t-bd) !important;
  border-radius: 0 !important;
  background: var(--t-bg) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.app-topbar::before { display: none !important; }

.app-topbar.is-scrolled {
  background: var(--t-bg) !important;
  box-shadow: none !important;
}

.app-brand {
  font-family: var(--t-font, Figtree, system-ui, sans-serif);
  font-style: normal;
  font-size: 1.05rem;
  letter-spacing: -0.03em;
}

.app-brand::before { display: none !important; }

.app-nav a {
  min-height: 3.25rem;
  padding: 0 0.7rem;
  border-radius: 0;
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.app-nav a:hover { background: transparent; color: var(--t-fg); }

.app-nav a[aria-current="page"] {
  color: var(--t-fg) !important;
  background: transparent !important;
  box-shadow: inset 0 -2px 0 var(--t-ac) !important;
}

.app-main {
  position: relative;
  width: min(1120px, 100%);
  padding-top: clamp(1.25rem, 3vw, 2.2rem);
}

.page-head { margin-bottom: 1.25rem !important; }
.page-head::before { display: none !important; }
.page-head::after { display: none !important; }

.page-head h1 {
  font-family: var(--t-font, Figtree, system-ui, sans-serif) !important;
  font-size: clamp(1.7rem, 4vw, 2.25rem) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.03em !important;
  font-style: normal;
}

.page-head h1 span,
.gradient-text {
  color: var(--t-fg) !important;
  background: none !important;
  -webkit-text-fill-color: unset;
  -webkit-background-clip: unset;
  background-clip: unset;
}

.page-sub, .subline {
  max-width: 38rem;
  color: var(--t-fg2) !important;
  font-size: 0.95rem !important;
}

.panel, .card, .cpanel, .action-card, .listing-item, .category-group {
  border: 1px solid var(--t-bd) !important;
  border-radius: 8px !important;
  background: var(--t-bg2) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.card::before, .action-card::before, .listing-item::before, .category-group::before { display: none !important; }

button:not(#sw-notif-btn):not(#theme-btn):not(#_ab):not(#theme-clean-btn),
.btn, .btn-primary, .btn-ghost, a.btn {
  border-radius: 8px !important;
  font-weight: 650 !important;
}

button::after, .btn::after, .btn-primary::after, .btn-ghost::after, a.btn::after { display: none !important; }

.btn-primary, .btn.primary, button.primary, button[type="submit"] {
  color: #10140c !important;
  border-color: var(--t-ac) !important;
  background: var(--t-ac) !important;
  box-shadow: none !important;
}

.btn-primary:hover, .btn.primary:hover, button.primary:hover, button[type="submit"]:hover {
  transform: none;
  background: var(--t-ac2) !important;
  box-shadow: none !important;
}

input, textarea, select {
  border-color: var(--t-bd) !important;
  background: var(--t-bg) !important;
  border-radius: 8px !important;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--t-ac) !important;
  box-shadow: 0 0 0 3px var(--t-gls) !important;
}

.relaunch-ready .relaunch-reveal { transition: opacity 0.4s ease, transform 0.4s ease; }
.relaunch-ready .relaunch-reveal:not(.is-visible) { opacity: 0; transform: translateY(8px); }

.shop-kicker, .marketplace-page .kicker, .casino-kicker {
  margin-bottom: 0.35rem;
  color: var(--t-fg2);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
}

.balance-value {
  font-family: inherit !important;
  font-size: 1.7rem !important;
  font-style: normal;
}

.market-grid .card:hover,
.casino-page .games > .card:hover,
.listing-item:hover {
  transform: none;
  box-shadow: none !important;
  border-color: color-mix(in srgb, var(--t-ac) 40%, var(--t-bd)) !important;
}

.price, .listing-price { color: var(--t-ac) !important; }

body.encrypt-page { height: 100vh !important; overflow: hidden !important; }
body.encrypt-page .app-topbar { display: none !important; }
body.encrypt-page #app { height: 100vh !important; padding: 0 !important; gap: 0 !important; }
body.encrypt-page #sidebar,
body.encrypt-page #chat-main {
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--t-bg) !important;
  box-shadow: none !important;
}
body.encrypt-page #sidebar { width: 300px !important; border-right: 1px solid var(--t-bd) !important; }
body.encrypt-page .user-entry:hover,
body.encrypt-page .user-entry.active { background: color-mix(in srgb, var(--t-ac) 12%, transparent) !important; }
body.encrypt-page .msg:has(.who.me) {
  background: color-mix(in srgb, var(--t-ac) 12%, transparent) !important;
  color: var(--t-fg) !important;
  border-color: color-mix(in srgb, var(--t-ac) 28%, transparent) !important;
}

@media (max-width: 980px) {
  .app-nav {
    overflow-x: auto;
    justify-content: flex-start;
    flex-wrap: nowrap;
    max-width: calc(100vw - 8rem);
    scrollbar-width: none;
  }
  .app-nav::-webkit-scrollbar { display: none; }
  .app-nav a { white-space: nowrap; }
}

@media (max-width: 760px) {
  .app-topbar {
    position: sticky;
    top: 0;
    z-index: 900;
    width: 100% !important;
    min-height: 3.25rem;
    padding: 0 max(8px, env(safe-area-inset-right, 0px)) 0 max(10px, env(safe-area-inset-left, 0px)) !important;
  }
  .app-brand { font-size: 1.15rem !important; }
  .app-nav { flex: 1; min-width: 0; max-width: none !important; overflow-x: auto; }
  .app-nav a { min-height: 3.25rem !important; padding: 0 0.65rem !important; font-size: 0.68rem !important; }
  .app-main {
    width: 100% !important;
    padding: 1.1rem max(12px, env(safe-area-inset-right, 0px)) calc(3rem + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)) !important;
  }
  .page-head h1 { font-size: clamp(2.1rem, 12vw, 3.4rem) !important; }
  button:not(#sw-notif-btn):not(#theme-btn):not(#_ab):not(#theme-clean-btn),
  .btn, .btn-primary, .btn-ghost, a.btn, [role="button"] { min-height: 44px; }
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  textarea, select { min-height: 44px; font-size: 16px !important; }
  .shop-page .page-head, .marketplace-page .page-head, .casino-page .page-head { grid-template-columns: 1fr !important; }
  .shop-page .market-grid, .casino-page .games, .marketplace-page .layout { grid-template-columns: 1fr !important; }
}

@media (hover: none) and (pointer: coarse) {
  .card:hover, .listing-item:hover, .market-grid .card:hover { transform: none !important; box-shadow: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .relaunch-ready .relaunch-reveal { opacity: 1 !important; transform: none !important; }
  .btn-primary:hover, button[type="submit"]:hover { transform: none !important; }
}
