:root{
  --tc-gold:#f6c02d;
  --tc-gold-bright:#ffda59;
  --tc-gold-deep:#b87800;
  --tc-ink:#07101e;
  --tc-surface-0:#050914;
  --tc-surface-1:#0b1220;
  --tc-surface-2:#111b2b;
  --tc-surface-3:#172338;
  --tc-text:#f7f9fc;
  --tc-text-muted:#a9b6c9;
  --tc-line:rgba(255,255,255,.11);
  --tc-line-strong:rgba(255,255,255,.2);
  --tc-success:#56e39f;
  --tc-danger:#f87171;
  --tc-focus:rgba(246,192,45,.48);
  --tc-radius-sm:12px;
  --tc-radius-md:16px;
  --tc-radius-lg:22px;
  --tc-shadow-action:0 12px 30px rgba(246,192,45,.18);
  --tc-shadow-float:0 28px 70px rgba(0,0,0,.42);
}

/* Shared lightweight loading language for card data and remote artwork. */
.tc-card-loader{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:14px;width:min(440px,100%);padding:13px 15px;border:1px solid var(--tc-line);border-radius:var(--tc-radius-md);background:color-mix(in srgb,var(--tc-surface-2) 78%,transparent);color:var(--tc-text);box-shadow:0 14px 32px rgba(0,0,0,.18)}
.tc-card-loader>span:last-child{display:grid;gap:3px;min-width:0}.tc-card-loader b{font-size:.82rem;line-height:1.25}.tc-card-loader small{color:var(--tc-text-muted);font-size:.65rem;line-height:1.35}
.tc-card-loader-art{position:relative;isolation:isolate;display:grid;place-items:center;width:44px;height:58px;overflow:hidden;border:1px solid color-mix(in srgb,var(--tc-gold) 34%,var(--tc-line));border-radius:9px;background:var(--tc-surface-0);color:color-mix(in srgb,var(--tc-text-muted) 45%,transparent)}
.tc-card-loader-art:before,.tc-image-assembly:before{content:"";position:absolute;z-index:0;inset:0;transform:scaleX(.04);transform-origin:left;background:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--tc-surface-3) 88%,transparent) 0 10%,color-mix(in srgb,var(--tc-gold) 8%,var(--tc-surface-2)) 10% 12.5%);animation:tc-card-assemble .5s ease-out forwards}
.tc-card-loader-art:after,.tc-image-assembly:after{content:"";position:absolute;z-index:2;left:0;right:0;top:-2px;height:1px;background:linear-gradient(90deg,transparent,var(--tc-gold),color-mix(in srgb,var(--tc-text) 55%,var(--tc-gold)),transparent);box-shadow:0 0 8px color-mix(in srgb,var(--tc-gold) 58%,transparent)}
.tc-card-loader-art:after{animation:tc-card-scan 1.3s ease-in-out infinite}.tc-image-assembly:after{animation:tc-card-scan 1.3s ease-in-out 3}
.tc-card-loader-art i{position:relative;z-index:1;font-size:1rem;opacity:.48}
.tc-image-assembly{position:absolute;z-index:0;isolation:isolate;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;overflow:hidden;border-radius:inherit;background:linear-gradient(145deg,var(--tc-surface-2),var(--tc-surface-0));color:color-mix(in srgb,var(--tc-text-muted) 44%,transparent);transition:opacity .22s ease}
.tc-image-assembly i,.tc-image-assembly small{position:relative;z-index:1}.tc-image-assembly i{font-size:1.35rem;opacity:.58}.tc-image-assembly small{color:var(--tc-text-muted);font-size:.59rem;font-weight:850;letter-spacing:.03em}
@keyframes tc-card-assemble{to{transform:scaleX(1)}}
@keyframes tc-card-scan{0%{top:-2px;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:calc(100% + 2px);opacity:0}}
@media(prefers-reduced-motion:reduce){.tc-card-loader-art:before,.tc-image-assembly:before{transform:none;animation:none}.tc-card-loader-art:after,.tc-image-assembly:after{top:50%;opacity:.45;animation:none}}

.tc-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:10px 15px;border:1px solid var(--tc-line);border-radius:var(--tc-radius-sm);font:inherit;font-size:.875rem;line-height:1.2;font-weight:850;text-decoration:none;cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}
.tc-button:hover{transform:translateY(-1px)}
.tc-button--primary,.btn.gold{border-color:var(--tc-gold)!important;background:linear-gradient(135deg,var(--tc-gold-bright),var(--tc-gold-deep))!important;color:var(--tc-ink)!important;box-shadow:var(--tc-shadow-action)}
.tc-button--secondary{border-color:var(--tc-line);background:var(--tc-surface-2);color:var(--tc-text)}
.tc-button--secondary:hover{border-color:var(--tc-line-strong);background:var(--tc-surface-3)}
.tc-button--ghost{border-color:transparent;background:transparent;color:var(--tc-text-muted)}
.tc-button--ghost:hover{border-color:var(--tc-line);background:rgba(255,255,255,.045);color:var(--tc-text)}
.tc-button--danger,.btn.red{border-color:rgba(248,113,113,.38)!important;background:rgba(127,29,29,.24)!important;color:#fecaca!important;box-shadow:none!important}
.tc-button:focus-visible,.tc-icon-button:focus-visible{outline:3px solid var(--tc-focus);outline-offset:2px}
.tc-button:disabled,.tc-button[aria-disabled="true"]{opacity:.48;pointer-events:none;box-shadow:none}

.tc-icon-button{display:inline-grid;place-items:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:1px solid var(--tc-line);border-radius:14px;background:var(--tc-surface-2);color:var(--tc-text);cursor:pointer}
.tc-icon-button:hover{border-color:var(--tc-line-strong);background:var(--tc-surface-3)}
.tc-icon-button.is-danger{border-color:rgba(248,113,113,.3);background:rgba(127,29,29,.18);color:#fecaca}
.tc-icon-label{display:inline-flex;align-items:center;gap:8px}
.tc-icon-label>i:first-child,.tc-icon-label>svg:first-child{flex:0 0 auto}

/* Visible icon + label pairs always use a real layout gap. Icon-only controls stay compact. */
:where(
  .btn,
  .tc-button,
  .badge,
  .tc-kicker,
  .tab,
  .conversation-kind,
  .trade-status,
  summary,
  .nav a,
  .mobile-nav a,
  .mobile-nav button
):has(> i:first-child):not(.tc-icon-button){
  column-gap:8px;
}
:where(.btn,.tc-button,.badge,.tc-kicker,.tab,.conversation-kind,.trade-status,summary,.nav a,.mobile-nav a,.mobile-nav button)>i:first-child{
  flex:0 0 auto;
}

.tc-kicker{display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;min-height:30px;padding:6px 10px;border:1px solid rgba(246,192,45,.34);border-radius:999px;background:rgba(246,192,45,.1);color:var(--tc-gold-bright);font-size:.75rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}

.tc-check-input,.choice-pill>input[type="checkbox"],.bulk-include-checkbox,.bulk-review-checkbox{--tc-check-size:24px;appearance:none!important;-webkit-appearance:none!important;display:inline-grid!important;place-items:center!important;flex:0 0 var(--tc-check-size);width:var(--tc-check-size)!important;height:var(--tc-check-size)!important;margin:0;border:2px solid rgba(255,255,255,.42)!important;border-radius:8px!important;background:rgba(4,9,17,.88)!important;box-shadow:inset 0 0 0 2px rgba(12,30,44,.3);cursor:pointer;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.tc-check-input::after,.choice-pill>input[type="checkbox"]::after,.bulk-include-checkbox::after,.bulk-review-checkbox::after{content:"";width:11px;height:6px;border:solid var(--tc-ink);border-width:0 0 3px 3px;opacity:0;transform:translateY(-1px) rotate(-45deg)}
.tc-check-input:checked,.choice-pill>input[type="checkbox"]:checked,.bulk-include-checkbox:checked,.bulk-review-checkbox:checked{border-color:var(--tc-gold-bright)!important;background:var(--tc-gold)!important;box-shadow:0 0 0 3px rgba(246,192,45,.14)}
.tc-check-input:checked::after,.choice-pill>input[type="checkbox"]:checked::after,.bulk-include-checkbox:checked::after,.bulk-review-checkbox:checked::after{opacity:1}
.tc-check-input:focus-visible,.choice-pill>input[type="checkbox"]:focus-visible,.bulk-include-checkbox:focus-visible,.bulk-review-checkbox:focus-visible{outline:3px solid var(--tc-focus)!important;outline-offset:2px}
.tc-check{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--tc-text);cursor:pointer}

.tc-taxonomy-visual{display:inline-grid;place-items:center;flex:0 0 auto;width:42px;height:42px;padding:7px;border:1px solid var(--tc-line);border-radius:14px;background:rgba(255,255,255,.045);color:var(--tc-gold-bright)}
.tc-taxonomy-visual img{display:block;width:100%;height:100%;object-fit:contain}
.tc-taxonomy-visual:has(>img){border-color:color-mix(in srgb,var(--tc-ink) 14%,transparent);background:var(--tc-text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tc-ink) 5%,transparent)}
.tc-taxonomy-visual i{font-size:1.05rem}
.tc-taxonomy-visual.is-small{width:30px;height:30px;padding:5px;border-radius:10px}
.tc-taxonomy-visual.is-large{width:56px;height:56px;padding:9px;border-radius:18px}

select.tc-select,select.input,select.select{appearance:none;-webkit-appearance:none;padding-right:42px!important;background-color:var(--tc-surface-1);background-image:linear-gradient(45deg,transparent 50%,var(--tc-gold) 50%),linear-gradient(135deg,var(--tc-gold) 50%,transparent 50%);background-position:calc(100% - 19px) calc(50% - 2px),calc(100% - 13px) calc(50% - 2px);background-size:6px 6px,6px 6px;background-repeat:no-repeat;border-color:var(--tc-line);color:var(--tc-text);cursor:pointer}
select.tc-select:hover,select.input:hover,select.select:hover{border-color:var(--tc-line-strong)}
select.tc-select:focus-visible,select.input:focus-visible,select.select:focus-visible{border-color:var(--tc-gold);outline:3px solid var(--tc-focus);outline-offset:1px}

@media(max-width:700px){
  .tc-check-input,.choice-pill>input[type="checkbox"],.bulk-include-checkbox,.bulk-review-checkbox{--tc-check-size:28px}
  .tc-button,.tc-icon-button{min-height:48px}
  .tc-icon-button{width:48px;height:48px}

  /* Touch controls keep a reliable target even when page-local CSS is denser. */
  :where(button,.btn,.tc-button,.icon-btn,.tc-icon-button,[role="button"],summary[tabindex]){
    min-height:48px!important;
  }
  :where(button,.icon-btn,.tc-icon-button,[role="button"]):not(.tc-wide-action){
    min-width:48px!important;
  }

  /* Nested mobile surfaces use one visual frame instead of a border cascade. */
  :root{
    --tc-mobile-radius-outer:18px;
    --tc-mobile-radius-inner:13px;
    --tc-mobile-space-outer:14px;
    --tc-mobile-space-inner:11px;
  }
  :where(.panel,.tc-modal-card,.section-card,.settings-terms-card){
    border-radius:var(--tc-mobile-radius-outer);
  }
  :where(.panel,.tc-modal-card,.section-card,.settings-terms-card)
  :where(.panel,.section-card,.settings-terms-card){
    padding:var(--tc-mobile-space-inner);
    border-radius:var(--tc-mobile-radius-inner);
    box-shadow:none;
  }
  :where(.panel,.tc-modal-card,.section-card,.settings-terms-card)
  :where(.panel,.section-card,.settings-terms-card)
  :where(.panel,.section-card,.settings-terms-card){
    border-color:transparent;
    background:transparent;
  }
}
