/* Claude Max Pricing Guide - component styles.
 * Loads after release-tracker.css and reuses its .rt variables, so the light and auto themes (embeds, PNG export) work the same way.
 * Layout uses flex with wrap only. No CSS grid in this file.
 */
.rt,.rt-tip{--cm-claude:#e07b52;--cm-claude-soft:rgba(224,123,82,.16)}
.rt.rt-light,.rt-tip.rt-light{--cm-claude:#b4532a;--cm-claude-soft:rgba(180,83,42,.12)}
@media (prefers-color-scheme: light){.rt.rt-auto,.rt-tip.rt-auto{--cm-claude:#b4532a;--cm-claude-soft:rgba(180,83,42,.12)}}

/* ---------- shared chart pieces ---------- */
.cm-chart-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 18px;margin-bottom:18px}
.cm-chart-head .rt-seg{margin:0}
.cm-chart{position:relative;width:100%;min-height:60px}
.cm-legend{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:14px;color:var(--rt-fg3)}
.cm-leg{display:inline-flex;align-items:center;gap:8px;line-height:1.3}
.cm-leg-sw{display:inline-block;width:12px;height:12px;border-radius:3px;flex:none}
.cm-leg-sw.is-hollow{background:transparent;border:1.5px solid var(--rt-fg4);border-radius:50%}
.cm-seg .rt-btn{font-size:14px;padding:7px 14px}
.hall-page .rt p.cm-note,.cm-note{font-size:14px;line-height:1.55;color:var(--rt-fg4);margin:16px 0 0}
.cm-strip{margin-bottom:22px}
.cm-strip .cm-legend{margin-top:6px}

/* ---------- calculator ---------- */
.cm-calc{display:flex;flex-wrap:wrap;gap:22px 28px;align-items:flex-start}
.cm-calc-in{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:18px}
.cm-calc-out{flex:1.25 1 400px;min-width:0;display:flex;flex-direction:column;gap:14px}
.cm-pane[hidden]{display:none!important}
.cm-pane{display:flex;flex-direction:column;gap:16px}
.cm-field{display:flex;flex-direction:column;gap:8px}
.cm-field-l{font-size:15px;line-height:1.45;font-weight:600;color:var(--rt-fg)}
.cm-field-h{font-size:14px;line-height:1.5;color:var(--rt-fg4)}
.cm-out-v{font-weight:700;color:var(--rt-violet);margin-left:4px;font-variant-numeric:tabular-nums}
.cm-money-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.cm-money-row .cm-range{flex:1 1 180px;min-width:160px}
.cm-money{display:inline-flex;align-items:center;gap:4px;padding:0 14px;height:52px;border:1px solid var(--rt-b2);border-radius:10px;background:var(--rt-panel);font-size:22px;font-weight:700;color:var(--rt-fg)}
.cm-money:focus-within{border-color:var(--rt-violet)}
.cm-money--sm{height:46px;font-size:18px;align-self:flex-start}
.rt input.cm-num{appearance:textfield;-moz-appearance:textfield;width:120px;margin:0;padding:0;border:0;outline:0;background:transparent;box-shadow:none;color:var(--rt-fg);font:inherit;font-variant-numeric:tabular-nums;line-height:1.2}
.cm-money--sm input.cm-num{width:96px}
.rt input.cm-num::-webkit-outer-spin-button,.rt input.cm-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cm-range{width:100%;accent-color:var(--rt-violet);height:28px;margin:0;cursor:pointer}
.rt .cm-select{font-size:16px}
.cm-field--api{padding-top:16px;border-top:1px solid var(--rt-b1)}
.cm-calc-total{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 14px;padding:16px 18px;border:1px solid var(--rt-b1);border-radius:12px;background:var(--rt-panel)}
.cm-calc-total-l{font-size:15px;color:var(--rt-fg3)}
.cm-calc-total-v{font-size:34px;line-height:1;font-weight:700;color:var(--rt-fg);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cm-bars{display:flex;flex-direction:column;gap:12px}
.cm-bar-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:10px 12px;border:1px solid transparent;border-radius:10px}
.cm-bar-row.is-best{border-color:var(--rt-b2);background:var(--rt-panel)}
.cm-bar-l{flex:0 0 170px;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.cm-bar-name{font-size:15px;font-weight:600;color:var(--rt-fg)}
.cm-bar-sub{flex-basis:100%;font-size:13px;line-height:1.35;color:var(--rt-fg4)}
.cm-best{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;border:1px solid var(--rt-good);color:var(--rt-good-text)}
.cm-bar-track{flex:1 1 160px;min-width:120px;position:relative;height:14px;border-radius:7px;background:var(--rt-elev)}
.cm-bar-fill{position:absolute;left:0;top:0;bottom:0;border-radius:7px;background:var(--rt-fg4);transition:width .35s cubic-bezier(.2,.7,.2,1)}
.cm-bar-fill--api{background:var(--rt-blue)}
.cm-bar-fill--pro{background:var(--rt-fg3)}
.cm-bar-fill--max5,.cm-bar-fill--max20{background:var(--cm-claude)}
.cm-bar-fill--two5{background:var(--rt-violet)}
.cm-bar-netfill{position:absolute;left:0;top:3px;bottom:3px;border-radius:5px;background:var(--rt-good);opacity:.9;transition:width .35s cubic-bezier(.2,.7,.2,1)}
.cm-bar-v{flex:0 0 120px;display:flex;flex-direction:column;align-items:flex-end;text-align:right;line-height:1.3}
.cm-bar-v b{font-size:17px;font-weight:700;color:var(--rt-fg);font-variant-numeric:tabular-nums}
.cm-bar-net{font-size:13px;color:var(--rt-fg4)}
.hall-page .rt p.cm-reading,.cm-reading{margin:4px 0 0;padding:14px 16px;border-left:3px solid var(--rt-violet);border-radius:0 10px 10px 0;background:var(--rt-panel);font-size:16px;line-height:1.6;color:var(--rt-fg2)}
.cm-bars--founder .cm-bar-l{flex-basis:230px}
.cm-bars--founder .cm-bar-row{padding:8px 0}

/* ---------- plan cards (section 1) ---------- */
.cm-plans{display:flex;flex-wrap:wrap;gap:16px}
.cm-plan{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:10px;padding:22px 20px;border:1px solid var(--rt-b1);border-radius:var(--rt-radius);background:var(--rt-surface)}
.cm-plan.is-max{border-color:color-mix(in srgb,var(--cm-claude) 45%,transparent)}
.cm-plan-name{font-size:18px;font-weight:700;color:var(--rt-fg);line-height:1.25}
.cm-plan-price{font-size:36px;font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--rt-fg);font-variant-numeric:tabular-nums}
.cm-plan-price small{font-size:16px;font-weight:500;color:var(--rt-fg3);letter-spacing:0;margin-left:4px}
.cm-plan-bill{font-size:14px;line-height:1.45;color:var(--rt-fg3)}
.cm-plan ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.cm-plan li{position:relative;padding-left:18px;font-size:15px;line-height:1.5;color:var(--rt-fg2)}
.cm-plan li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--rt-fg4)}
.cm-plan.is-max li::before{background:var(--cm-claude)}

/* ---------- timeline (section 9) ---------- */
.cm-tl-filter{margin:0 0 18px}
.cm-tl{list-style:none;margin:0;padding:0;position:relative}
.cm-tl::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:var(--rt-b1)}
.cm-tl-item{position:relative;padding:0 0 22px 32px}
.cm-tl-item[hidden]{display:none}
.cm-tl-item::before{content:"";position:absolute;left:1px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--rt-surface);border:2px solid var(--tl,var(--rt-fg4))}
.cm-tl-item[data-cm-type="price"]{--tl:var(--rt-good)}
.cm-tl-item[data-cm-type="limits"]{--tl:var(--rt-warn)}
.cm-tl-item[data-cm-type="models"]{--tl:var(--cm-claude)}
.cm-tl-item[data-cm-type="legal"]{--tl:var(--rt-bad)}
.cm-tl-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:14px;color:var(--rt-fg3)}
.cm-tl-meta time{font-weight:600;color:var(--rt-fg);font-variant-numeric:tabular-nums}
.cm-tl-type{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;padding:2px 8px;border-radius:999px;border:1px solid var(--rt-b2);color:var(--rt-fg3)}
.hall-page .rt .cm-tl-t,.cm-tl-t{margin:6px 0 0;font-size:17px;line-height:1.4;font-weight:600;color:var(--rt-fg)}
.hall-page .rt .cm-tl-d,.cm-tl-d{margin:6px 0 0;font-size:16px;line-height:1.6;color:var(--rt-fg3)}
.cm-tl-d a{color:var(--rt-fg2);text-decoration:underline;text-underline-offset:2px}
.hall-page .rt .cm-tl-d a{color:#a78bfa}
.rt-light .cm-tl-d a,.rt.rt-light .cm-tl-d a{color:var(--rt-violet)}

/* ---------- tables inside widgets (tiers): theme-aware, used in embeds too ---------- */
.cm-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--rt-b1);border-radius:12px}
.cm-table{width:100%;min-width:680px;border-collapse:collapse;font-size:15px;line-height:1.5}
.cm-table th,.cm-table td{padding:12px 14px;text-align:left;vertical-align:top;border-top:1px solid var(--rt-b1);color:var(--rt-fg2);font-weight:400}
.cm-table thead th{border-top:0;font-size:13px;letter-spacing:.07em;text-transform:uppercase;font-weight:600;color:var(--rt-fg3);background:var(--rt-head-bg);white-space:nowrap}
.cm-table tbody th{color:var(--rt-fg);font-weight:600;min-width:150px}
.cm-table td:nth-child(2){white-space:nowrap;font-weight:600;color:var(--rt-fg);font-variant-numeric:tabular-nums}
.cm-table a{color:var(--rt-fg);text-decoration:underline;text-decoration-color:var(--rt-b3);text-underline-offset:3px}
.cm-table a:hover{text-decoration-color:var(--rt-fg)}
.cm-table .cm-row-supr th,.cm-table .cm-row-supr td{background:color-mix(in srgb,var(--rt-violet) 7%,transparent)}
.rt-exporting .cm-table-wrap{overflow:visible}
.rt-exporting .cm-table{min-width:0}

/* page tables (house .hall-table) with row headers and left-aligned text */
.hall-page .hall-table tbody th{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,0.04);color:#fafafa;font-weight:500;text-align:left;white-space:nowrap}
.hall-page .hall-table.cm-table-left thead th,.hall-page .hall-table.cm-table-left tbody td{text-align:left}
.hall-page .hall-table.cm-table-wrap-text tbody th,.hall-page .hall-table.cm-table-wrap-text tbody td{white-space:normal}
.hall-page .hall-table.cm-api-table td:last-child{white-space:normal;min-width:200px;font-size:15px;color:#a1a1aa}
.hall-page .cm-plans{margin:0}
.hall-page .cm-sup{font-size:12px;line-height:0;margin-left:2px}
.hall-page .cm-sup a{color:#a1a1aa}
.hall-page .cm-sup a:hover{color:#c4b5fd}

/* ---------- tables stack into cards on phones ---------- */
@media (max-width:640px){
  .cm-stack thead{display:none}
  .cm-stack,.cm-stack tbody,.cm-stack tr,.cm-stack th,.cm-stack td{display:block;width:100%}
  .cm-table.cm-stack{min-width:0}
  .cm-stack tr{padding:14px 16px}
  .cm-stack tr+tr{border-top:1px solid rgba(255,255,255,0.08)}
  .rt-light .cm-stack tr+tr,.rt.rt-light .cm-stack tr+tr{border-top-color:rgba(17,12,30,.1)}
  .hall-page .cm-stack tbody th,.cm-stack tbody th{padding:0 0 6px;border:0;white-space:normal;font-size:16px;text-align:left}
  .hall-page .hall-table.cm-stack tbody td,.cm-stack td{padding:3px 0;border:0;text-align:left;white-space:normal;min-width:0}
  .cm-stack td[data-label]::before{content:attr(data-label) ": ";font-weight:500;opacity:.7}
  .cm-stack td.cm-empty{display:none}
  .hall-page .hall-table.cm-stack tbody tr:nth-child(even){background:rgba(255,255,255,0.02)}
}

/* ---------- responsive ---------- */
@media (max-width:760px){
  .cm-calc-total-v{font-size:28px}
  .cm-bar-l{flex-basis:100%}
  .cm-bar-v{flex-basis:auto;min-width:90px}
  .cm-bars--founder .cm-bar-l{flex-basis:100%}
  .cm-money{font-size:20px}
  .rt input.cm-num{width:100px}
}
@media (prefers-reduced-motion:reduce){.cm-bar-fill,.cm-bar-netfill{transition:none}}

/* ---------- PNG export ---------- */
.rt-exporting .cm-field--api,.rt-exporting .cm-seg,.rt-exporting .cm-tl-filter{display:none!important}
.rt-exporting .cm-bar-fill,.rt-exporting .cm-bar-netfill{transition:none!important}

/* ==========================================================================
 * Page-only blocks (outside .rt): hero offer, quick answers, callouts, plan table, founder note, Suprmind section.
 * Same palette as the house template: #05020B page, #a78bfa links, #8b5cf6 single border accents.
 * ======================================================================= */
.cm-offer{max-width:860px;margin:30px auto 0;padding:22px 24px;border:1px solid rgba(139,92,246,0.35);border-radius:14px;background:rgba(139,92,246,0.04);text-align:center}
.hall-page .cm-offer p.cm-offer-lead{margin:0 auto 18px;max-width:700px;font-size:18px;line-height:1.55;color:rgba(255,255,255,0.82)}
.cm-offer-lead b{color:#fafafa;font-weight:600}
.cm-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.cm-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 28px;font-size:16px;font-weight:600;line-height:1.2;border-radius:10px;text-decoration:none!important;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.cm-btn--primary{color:#fafafa!important;background:linear-gradient(180deg,#1c1425 0%,#120c1a 100%);border:1px solid rgba(139,92,246,0.6);box-shadow:0 0 22px rgba(139,92,246,0.3)}
.cm-btn--primary:hover{border-color:rgba(139,92,246,0.95);box-shadow:0 0 34px rgba(139,92,246,0.45);color:#fafafa!important}
.cm-btn--ghost{color:#e4e4e7!important;background:transparent;border:1px solid rgba(255,255,255,0.22)}
.cm-btn--ghost:hover{border-color:rgba(255,255,255,0.45);color:#fafafa!important}
.cm-btn:focus-visible{outline:2px solid #a78bfa;outline-offset:3px}
.hall-page .cm-offer p.cm-offer-fine{margin:14px 0 0;font-size:15px;line-height:1.5;color:#a1a1aa}

.cm-qa{max-width:1180px;margin:40px auto 0;padding:0 24px;box-sizing:border-box}
.cm-qa h2{text-align:left}
.cm-qa-list{display:flex;flex-wrap:wrap;gap:16px 20px}
.cm-qa-item{flex:1 1 calc(50% - 10px);min-width:280px;box-sizing:border-box;padding:18px 20px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-left:3px solid rgba(139,92,246,0.45);border-radius:8px}
.hall-page .cm-qa-item h3{margin:0 0 8px;font-size:18px;line-height:1.35;font-weight:600;color:#fafafa}
.hall-page .cm-qa-item p{margin:0;font-size:16px;line-height:1.6;color:rgba(255,255,255,0.72)}

.cm-callout{margin:28px 0;padding:22px 24px;border:1px solid rgba(255,255,255,0.08);border-left:3px solid #8b5cf6;border-radius:10px;background:rgba(255,255,255,0.025)}
.hall-page .cm-callout h3{margin:0 0 10px;font-size:20px;line-height:1.35}
.hall-page .cm-callout p{margin:0 0 12px}
.hall-page .cm-callout p:last-child{margin-bottom:0}
.cm-callout--warn{border-left-color:#eab308}
.cm-callout--legal{border-left-color:#ef4444}

/* founder card: photo left, his own words right (same layout as the homepage "Why we built Suprmind" card) */
.cm-founder{display:flex;flex-wrap:wrap;align-items:flex-start;gap:28px 40px;margin:4px 0 0;padding:40px;border:1px solid rgba(255,255,255,0.1);border-radius:20px;background:rgba(255,255,255,0.02)}
.hall-page img.cm-founder__photo{flex:0 0 240px;display:block;width:240px;height:240px;max-width:100%;border-radius:16px;object-fit:cover;position:sticky;top:110px}
.cm-founder__body{flex:1 1 360px;min-width:0}
.hall-page .cm-founder p{margin:0 0 16px;font-size:17px;line-height:1.75;color:rgba(255,255,255,0.75)}
.hall-page .cm-founder p.cm-founder__eyebrow{margin:0 0 12px;font-size:13px;line-height:1.4;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,0.5)}
.hall-page .cm-founder p.cm-founder__title{margin:0 0 18px;font-size:28px;line-height:1.25;font-weight:700;letter-spacing:-0.5px;color:#fafafa;text-wrap:balance}
.cm-founder__by{display:flex;flex-direction:column;gap:2px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,0.1)}
.cm-founder__by b{font-size:16px;font-weight:600;color:#fafafa}
.cm-founder__by span{font-size:15px;line-height:1.5;color:#a1a1aa}

.cm-split{display:flex;flex-wrap:wrap;gap:16px;margin:24px 0}
.cm-split-col{flex:1 1 300px;min-width:0;box-sizing:border-box;padding:20px 22px;border:1px solid rgba(255,255,255,0.08);border-radius:12px;background:rgba(255,255,255,0.02)}
.hall-page .cm-split-col h3{margin:0 0 10px;font-size:19px}
.hall-page .cm-split-col ul{margin:0;padding-left:20px}
.hall-page .cm-split-col li{font-size:16px;line-height:1.6;margin-bottom:8px;color:rgba(255,255,255,0.75)}

.cm-supr{max-width:1000px;margin:56px auto;padding:44px 40px;border:1px solid rgba(139,92,246,0.3);border-radius:16px;background:rgba(139,92,246,0.03);box-sizing:border-box}
.hall-page .cm-supr h2{margin-top:0}
.cm-supr .cm-split-col{background:rgba(5,2,11,0.6)}
.cm-supr .cm-btns{justify-content:flex-start;margin-top:26px}

.cm-ref-note{font-size:15px;line-height:1.6;color:#a1a1aa}
.hall-page p.cm-cap{margin:14px 0 0;font-size:15px;line-height:1.55;color:#a1a1aa}
.hall-page .cm-wide-gap{margin-top:28px}
.hall-page code.cm-code{display:inline-block;padding:2px 8px;border:1px solid rgba(255,255,255,0.12);border-radius:6px;background:rgba(255,255,255,0.04);font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#e4e4e7}
.hall-page blockquote.cm-quote{margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid #8b5cf6;font-size:19px;line-height:1.6;color:#e4e4e7}
.hall-page blockquote.cm-quote p{margin:0 0 8px}
.hall-page blockquote.cm-quote cite{display:block;font-style:normal;font-size:15px;color:#a1a1aa}

@media (max-width:767px){
  .cm-offer{padding:18px 16px;margin-top:24px}
  .hall-page .cm-offer p.cm-offer-lead{font-size:17px}
  .cm-btn{width:100%}
  .cm-qa{padding:0 16px}
  .cm-qa-item{flex-basis:100%;min-width:0}
  .cm-supr{padding:28px 20px;margin:40px 16px}
  .cm-founder{margin:4px -16px 0;padding:22px 18px;gap:20px}
  .hall-page img.cm-founder__photo{flex-basis:160px;width:160px;height:160px;border-radius:14px;position:static}
  .hall-page .cm-founder p.cm-founder__title{font-size:23px}
}

/* ==========================================================================
 * Hero: two columns. The guide's headline and buttons sit left, the live pricing card sits right.
 * Max width 1120px keeps the hero clear of both wide-screen sidebars: AI Models on the left, "On this page" on the right.
 * ======================================================================= */
.hall-page .hall-hero.cm-hero{display:flex;flex-wrap:wrap;align-items:flex-start;gap:40px 44px;max-width:1120px;margin:0 auto;padding:108px 24px 36px;text-align:left}
.cm-hero__content{flex:1 1 500px;min-width:0}
.cm-hero__widget{flex:0 1 470px;min-width:0;display:flex;justify-content:flex-end}
.hall-page .cm-hero .eyebrow{margin:0 0 18px;text-align:left}
.hall-page .cm-hero h1{margin:0 0 20px;font-size:48px;line-height:1.12;letter-spacing:-1.4px}
.hall-page .cm-hero .subtitle{max-width:none;margin:0;font-size:19px;line-height:1.55}
.cm-hero .cm-offer{max-width:none;margin:26px 0 0;padding:24px 0 0;border:0;border-top:1px solid rgba(255,255,255,0.08);border-radius:0;background:none;text-align:left}
.hall-page .cm-hero .cm-offer p.cm-offer-lead{max-width:none;margin:0 0 18px;font-size:17px}
.cm-hero .cm-btns{justify-content:flex-start;gap:12px}
.cm-hero .cm-btn{padding:13px 22px}
.hall-page .cm-hero .cm-offer p.cm-offer-fine{margin:12px 0 0}
.hall-page .cm-hero .updated{max-width:none;margin:18px 0 0;padding-top:0;font-size:15px;line-height:1.6}
@media (max-width:1079px){
  .cm-hero__widget{flex:1 1 100%;justify-content:flex-start}
}
@media (max-width:768px){
  .hall-page .hall-hero.cm-hero{gap:32px;padding:84px 16px 16px}
  /* the theme sets every mobile h1 to 40px !important, which pushed the buttons below the fold */
  .hall-page .cm-hero h1{font-size:clamp(28px,7.6vw,40px)!important;line-height:1.14;letter-spacing:-0.8px}
  .hall-page .cm-hero .subtitle{font-size:17px}
  .cm-hero .cm-offer{margin-top:20px;padding-top:20px}
}

/* CTA headlines: no one-word last line */
.hall-page .sg-cta h2{text-wrap:balance}

/* "On this page" sits on the right edge here. The hub's AI Models sidebar already holds the left edge on Claude pages. */
html body #hall-toc-sidebar-left{left:auto;right:10px;transform:translateX(12px)}
html body #hall-toc-sidebar-left.htsl-visible{transform:translateX(0)}

/* ---------- live pricing card: same look as the provider pricing cards on the hub's other pricing pages ---------- */
.cm-gpx{--gpx-border:rgba(255,255,255,0.08);--gpx-border-strong:rgba(255,255,255,0.16);--gpx-surface:rgba(255,255,255,0.02);--gpx-surface-2:rgba(255,255,255,0.04);--gpx-text:#f4f4f5;--gpx-text-2:#e5e7eb;--gpx-mute:#9ca3af;--gpx-faint:#71717a;--gpx-green:#10b981;--gpx-a:#d97757;--gpx-a55:rgba(217,119,87,0.33);--gpx-a10:rgba(217,119,87,0.06);width:100%;max-width:600px;color:var(--gpx-text);text-align:left}
.hall-page .cm-gpx p{margin:0;padding:0}
.cm-gpx .cm-gpx__card{padding:22px 24px 20px;border:2px solid var(--gpx-border);border-radius:14px;background:var(--gpx-surface);overflow:hidden}
.cm-gpx .cm-gpx__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px}
.cm-gpx .cm-gpx__eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gpx-mute)}
.cm-gpx .cm-gpx__livedot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--gpx-green);animation:cm-gpx-pulse 2.4s ease-out infinite}
@keyframes cm-gpx-pulse{0%{box-shadow:0 0 0 0 rgba(16,185,129,.45)}70%{box-shadow:0 0 0 7px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
.cm-gpx .cm-gpx__verified{font-size:15px;color:var(--gpx-faint)}
.cm-gpx .cm-gpx__id{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.cm-gpx .cm-gpx__id-name{flex:1 1 auto;min-width:0}
.hall-page .cm-gpx .cm-gpx__name{font-size:22px;line-height:1.15;font-weight:700;letter-spacing:-.01em;color:var(--gpx-text)}
.hall-page .cm-gpx .cm-gpx__by{margin-top:3px;font-size:15px;line-height:1.4;color:var(--gpx-mute)}
.cm-gpx .cm-gpx__range{flex:none;text-align:right}
.hall-page .cm-gpx .cm-gpx__range-v{font-size:27px;line-height:1;font-weight:700;color:var(--gpx-text)}
.hall-page .cm-gpx .cm-gpx__range-l{margin-top:4px;font-size:15px;line-height:1.4;color:var(--gpx-mute)}
.cm-gpx .cm-gpx__spectrum{position:relative;margin:20px 0 4px;padding-top:6px}
.cm-gpx .cm-gpx__spectrum-line{position:absolute;left:4%;right:4%;top:11px;height:2px;border-radius:1px;background:rgba(255,255,255,.1)}
.cm-gpx .cm-gpx__spectrum-row{position:relative;display:flex}
.cm-gpx .cm-gpx__tick{flex:1;min-width:0;text-align:center}
.cm-gpx .cm-gpx__dot{display:inline-block;width:11px;height:11px;border-radius:50%}
.cm-gpx .cm-gpx__dot--fill{background:var(--gpx-a)}
.cm-gpx .cm-gpx__dot--outline{background:#0b0713;border:2px solid var(--gpx-a)}
.hall-page .cm-gpx .cm-gpx__tick-price{margin:5px 0 0;font-size:15px;line-height:1.4;font-weight:600;color:var(--gpx-text)}
.hall-page .cm-gpx .cm-gpx__tick-name{margin:1px 0 0;font-size:15px;line-height:1.4;color:var(--gpx-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hall-page .cm-gpx .cm-gpx__legend{margin:8px 0 0;font-size:15px;line-height:1.5;color:var(--gpx-faint)}
.hall-page .cm-gpx .cm-gpx__oneliner{margin:14px 0 0;font-size:16px;line-height:1.6;color:var(--gpx-text-2)}
.cm-gpx .cm-gpx__tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cm-gpx .cm-gpx__tab{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;margin:0;padding:11px 12px;border:1px solid var(--gpx-border-strong);border-radius:9px;background:transparent;box-shadow:none;color:var(--gpx-text-2);font:inherit;font-size:15px;font-weight:600;line-height:1.2;letter-spacing:normal;text-transform:none;cursor:pointer;transition:background 160ms ease,border-color 160ms ease,color 160ms ease}
.cm-gpx .cm-gpx__tab:hover,.cm-gpx .cm-gpx__tab:focus{border-color:var(--gpx-border-strong);background:var(--gpx-surface-2);color:var(--gpx-text-2)}
.cm-gpx .cm-gpx__tab:focus-visible{outline:2px solid var(--gpx-a);outline-offset:2px}
.cm-gpx .cm-gpx__tab.is-active,.cm-gpx .cm-gpx__tab.is-active:hover,.cm-gpx .cm-gpx__tab.is-active:focus{border-color:var(--gpx-a55);background:var(--gpx-a10);color:#fff}
.cm-gpx .cm-gpx__chev{flex:none;transition:transform 220ms ease}
.cm-gpx .cm-gpx__tab.is-active .cm-gpx__chev{transform:rotate(180deg)}
.cm-gpx .cm-gpx__panel{padding-top:16px}
.cm-gpx .cm-gpx__panel[hidden]{display:none}
.cm-gpx .cm-gpx__panel.is-entering{animation:cm-gpx-in 260ms ease}
@keyframes cm-gpx-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.cm-gpx .cm-gpx__row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.06)}
.cm-gpx .cm-gpx__row:last-of-type{border-bottom:0}
.cm-gpx .cm-gpx__row-name{font-size:16px;line-height:1.4;font-weight:600;color:var(--gpx-text)}
.cm-gpx .cm-gpx__row-note{display:block;margin-top:2px;font-size:15px;line-height:1.45;font-weight:400;color:var(--gpx-mute)}
.cm-gpx .cm-gpx__row-price{flex:none;font-size:16px;line-height:1.4;font-weight:600;white-space:nowrap;color:var(--gpx-text)}
.hall-page .cm-gpx .cm-gpx__panel-note{margin:10px 0 0;font-size:15px;line-height:1.55;color:var(--gpx-mute)}
.hall-page .cm-gpx .cm-gpx__anchor{margin:12px 0 0;font-size:15px;line-height:1.5}
.hall-page .cm-gpx .cm-gpx__anchor a{color:var(--gpx-mute);text-decoration:underline;text-underline-offset:2px}
.hall-page .cm-gpx .cm-gpx__anchor a:hover{color:var(--gpx-text-2)}
.hall-page .cm-gpx .cm-gpx__foot{margin:16px 2px 0;font-size:15px;line-height:1.55;color:var(--gpx-faint)}
@media (max-width:480px){
  .cm-gpx .cm-gpx__card{padding:18px 16px 14px}
  .cm-gpx .cm-gpx__id{flex-direction:column;align-items:flex-start;gap:10px}
  .cm-gpx .cm-gpx__range{text-align:left}
  .hall-page .cm-gpx .cm-gpx__name{font-size:19px}
  .hall-page .cm-gpx .cm-gpx__range-v{font-size:22px}
  .cm-gpx .cm-gpx__tab{padding:10px 8px}
}
@media (prefers-reduced-motion:reduce){
  .cm-gpx .cm-gpx__livedot,.cm-gpx .cm-gpx__panel.is-entering{animation:none}
  .cm-gpx .cm-gpx__chev,.cm-gpx .cm-gpx__tab{transition:none}
}