/* Rally app — tokens mirror rally.echoaisms.com */
:root {
  --navy: #0b1c3d;
  --navy-soft: #132847;
  --coral: #ed5851;
  --coral-hover: #d94a44;
  --green: #1f8a5b;
  --white: #fff;
  --off-white: #f7f8fa;
  --line: rgba(11, 28, 61, 0.12);
  --muted: #5a6578;
  --radius: 12px;
  --shadow: 0 12px 40px rgba(11, 28, 61, 0.10);
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Manrope", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-body); color: var(--navy); background: var(--off-white); line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: inherit; text-underline-offset: 3px; }
a:hover { color: var(--coral); }
h1, h2, h3 { font-family: var(--font-display); line-height: 1.2; margin: 0 0 .5rem; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.2rem; margin-top: .25rem; }
h3 { font-size: 1rem; margin-top: 1rem; font-family: var(--font-body); }
.muted { color: var(--muted); }
.pre { white-space: pre-line; }
[hidden] { display: none !important; }

.topbar { display: flex; align-items: center; justify-content: space-between; padding: .75rem 1rem; background: var(--white); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; text-decoration: none; font-family: var(--font-display); font-size: 1.15rem; }
.brand img { border-radius: 7px; }
.container { max-width: 1040px; margin: 0 auto; padding: 1.25rem 1rem 3rem; }
.footer { text-align: center; color: var(--muted); font-size: .85rem; padding: 1.5rem 1rem 2.5rem; }

.panel { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1rem; }
.center { text-align: center; }
.btn-primary, .btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; border: 0; border-radius: 999px; padding: .8rem 1.4rem; font: 600 1rem var(--font-body); cursor: pointer; text-decoration: none; }
.btn-primary { background: var(--coral); color: var(--white); width: 100%; font-size: 1.05rem; padding: 1rem; }
.btn-primary:hover { background: var(--coral-hover); color: var(--white); }
.btn-primary:disabled { opacity: .55; cursor: not-allowed; }
.btn { background: var(--navy); color: var(--white); }
.btn.secondary { background: var(--white); color: var(--navy); border: 1px solid var(--line); }
.btn.danger { background: var(--white); color: var(--coral-hover); border: 1px solid var(--coral); }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* Share page */
.share-main { max-width: 560px; margin: 0 auto; padding: 0 0 2rem; }
.share-card { background: var(--white); min-height: 100vh; }
@media (min-width: 600px) { .share-main { padding: 1.5rem 0 2rem; } .share-card { border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; min-height: 0; } }
.gallery { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; background: #eef1f6; }
.gallery img { flex: 0 0 100%; aspect-ratio: 1 / 1; object-fit: cover; scroll-snap-align: start; }
.share-card > section, .share-card > form { padding: 1rem 1.25rem; }
.eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: .75rem; font-weight: 700; color: var(--coral); margin: 0 0 .25rem; }
.opened-by { margin: 0; color: var(--muted); }
.custom-message { margin: .75rem 0 0; padding: .75rem 1rem; background: var(--off-white); border-left: 3px solid var(--coral); border-radius: 0 8px 8px 0; white-space: pre-line; }
.price-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem .75rem; padding-top: 0 !important; }
.group-price { font-family: var(--font-display); font-size: 2rem; font-weight: 700; }
.orig-price { text-decoration: line-through; color: var(--muted); font-size: 1.1rem; }
.off { background: #fff0ef; color: var(--coral-hover); font-weight: 700; font-size: .85rem; padding: .15rem .5rem; border-radius: 999px; }
.price-note { width: 100%; color: var(--muted); font-size: .85rem; }
.progress-card { background: var(--navy); color: var(--white); margin: 0 1.25rem; border-radius: var(--radius); padding: 1rem 1.1rem !important; }
.progress-top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.count { font-size: 1.05rem; }
.count strong { font-size: 1.5rem; font-family: var(--font-display); }
.badge { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: .25rem .6rem; border-radius: 999px; }
.badge.guaranteed { background: var(--green); color: var(--white); }
.bar { height: 10px; background: rgba(255,255,255,.18); border-radius: 999px; margin: .6rem 0; overflow: hidden; }
.bar span { display: block; height: 100%; background: var(--coral); border-radius: 999px; transition: width .6s ease; }
.countdown { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.status-note { margin: .25rem 0 0; color: #c8d0dc; font-size: .9rem; }
.notices ul { margin: 0; padding-left: 1.1rem; }
.notices li { margin-bottom: .5rem; }
.draft-note { color: var(--muted); font-size: .75rem; font-style: italic; }
.join-form { border-top: 1px solid var(--line); }
.join-form label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .75rem; }
.join-form input, .join-form select { display: block; width: 100%; margin-top: .3rem; padding: .7rem .8rem; font: 400 1rem var(--font-body); border: 1px solid var(--line); border-radius: 10px; background: var(--white); color: var(--navy); }
.join-form input:focus, .join-form select:focus { outline: 2px solid rgba(11, 28, 61, .25); border-color: var(--navy); }
.join-form fieldset { border: 0; padding: 0; margin: 0 0 .75rem; }
.join-form legend { font-weight: 700; margin-bottom: .5rem; }
.join-form.closed { opacity: .5; }
.variants { display: grid; gap: .5rem; }
.variant { display: flex !important; align-items: center; gap: .75rem; border: 1px solid var(--line); border-radius: 10px; padding: .6rem .8rem; cursor: pointer; margin: 0 !important; }
.variant:has(input:checked) { border-color: var(--navy); box-shadow: 0 0 0 1px var(--navy); }
.variant input { width: auto !important; margin: 0 !important; accent-color: var(--navy); }
.variant img { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; }
.variant .v-name { flex: 1; }
.variant .v-price { font-weight: 700; }
.variant .v-tag { font-size: .75rem; color: var(--coral-hover); font-weight: 700; }
.variant.sold-out { opacity: .5; cursor: not-allowed; }
.grid2 { display: grid; gap: 0 .75rem; }
.grid3 { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 0 .5rem; }
@media (min-width: 480px) { .grid2 { grid-template-columns: 1fr 1fr; } }
.card-box { margin: .25rem 0 1rem; }
.card-box .label { display: block; font-weight: 700; margin-bottom: .5rem; }
.form-error { background: #fff0ef; color: var(--coral-hover); border-radius: 10px; padding: .7rem .9rem; font-weight: 600; }
.fineprint { color: var(--muted); font-size: .8rem; text-align: center; margin: .75rem 0 0; }
.seller-disclosure { color: var(--muted); font-size: .8rem; line-height: 1.45; margin: 1rem 0 0; }
.checkout-lines { margin: 1rem 0 .25rem; }
.price-breakdown { margin: .5rem 0 1rem; padding: .75rem 1rem; border: 1px solid var(--line, #e3e6ee); border-radius: 10px; font-size: .9rem; }
.price-breakdown div { display: flex; justify-content: space-between; padding: .2rem 0; }
.price-breakdown dt { color: var(--muted); }
.price-breakdown dd { margin: 0; font-weight: 600; }
.price-breakdown div:last-child { border-top: 1px solid var(--line, #e3e6ee); margin-top: .3rem; padding-top: .45rem; }
.join-result { margin: 1rem 1.25rem; border-radius: var(--radius); padding: 1.1rem !important; }
.join-result.ok { background: #e8f6ef; border: 1px solid #b7e3cc; }
.join-result.pending { background: #eef1f6; border: 1px solid var(--line); }
.join-result.bad { background: #fff0ef; border: 1px solid #f5c2bf; }
.through-link { margin: 0; padding: 1rem 1.25rem 0; font-weight: 700; }
.share-box { border-top: 1px solid var(--line); }
.share-kicker { margin: 0; font-size: .75rem; font-weight: 700; letter-spacing: .04em; color: var(--muted); }
.share-headline { font-family: var(--font-display); font-size: 1.55rem; margin: .15rem 0 .35rem; }
.share-pitch { margin: 0 0 .75rem; }
.share-invite { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #b7e3cc; }
.share-invite .share-headline { font-size: 1.15rem; }
.share-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.share-link-row { display: flex; gap: .5rem; flex: 1 0 100%; }
.share-link-row input { flex: 1; min-width: 0; padding: .7rem .8rem; font: 400 .9rem var(--font-body); border: 1px solid var(--line); border-radius: 10px; background: var(--white); color: var(--navy); }
.share-link-row .btn { flex: 0 0 auto; }
.share-more { width: 100%; margin-top: .15rem; }
.share-text { display: none; }
@media (hover: none) and (pointer: coarse) { .share-text { display: inline-flex; } }
.policies, .description { border-top: 1px solid var(--line); }
.ftc-disclosure { background: #fff8e6; border-top: 1px solid #f1dfa8; font-size: .9rem; }

/* Dashboard */
.dash-grid { display: grid; gap: 1rem; }
.checklist { list-style: none; padding: 0; margin: 0; }
.checklist li { display: flex; gap: .6rem; align-items: flex-start; padding: .5rem 0; border-bottom: 1px solid var(--line); }
.checklist li:last-child { border-bottom: 0; }
.dot { width: 1.3rem; height: 1.3rem; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; color: var(--white); margin-top: .1rem; }
.dot.ok { background: var(--green); }
.dot.todo { background: #c8d0dc; }
table.data { width: 100%; border-collapse: collapse; font-size: .92rem; }
table.data th, table.data td { text-align: left; padding: .55rem .5rem; border-bottom: 1px solid var(--line); vertical-align: top; }
table.data th { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.pill { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .75rem; font-weight: 700; background: #eef1f6; }
.pill.published, .pill.OPEN { background: #e6effd; color: #1d4ed8; }
.pill.GUARANTEED, .pill.FILLED { background: #e8f6ef; color: var(--green); }
.pill.delisted, .pill.CANCELLED, .pill.EXPIRED { background: #fff0ef; color: var(--coral-hover); }
.pill.CAPTURED, .pill.AUTHORIZED { background: #e8f6ef; color: var(--green); }
.pill.CAPTURE_FAILED { background: #fff0ef; color: var(--coral-hover); }
.pill.paid { background: #e8f6ef; color: var(--green); }
.pill.partially_refunded, .pill.refund_pending { background: #fff8e6; color: #8a5a00; }
.pill.refunded { background: #eef1f6; color: var(--muted); }
.pill.refund_failed, .pill.disputed { background: #fff0ef; color: var(--coral-hover); }
tr.refund-history > td { padding-top: 0; }
.refund-history summary { cursor: pointer; color: var(--muted); font-size: .85rem; }
.refund-history ul { list-style: none; margin: .4rem 0 0; padding: 0; }
.refund-history li { display: grid; grid-template-columns: 11rem 9rem 1fr 1fr; gap: .25rem .75rem; padding: .3rem 0; border-top: 1px dashed var(--line); font-size: .85rem; }
.refund-failed { color: var(--coral-hover); font-weight: 600; }
.tabs { gap: .25rem; margin-bottom: 1rem; }
.tabs > a { flex: 0 0 auto; padding: .45rem .9rem; border-radius: 999px; text-decoration: none; font-weight: 600; border: 1px solid var(--line); background: var(--white); }
.tabs > a.active { background: var(--navy); color: var(--white); }
.form-grid label { display: block; font-weight: 600; font-size: .88rem; margin-bottom: .7rem; }
.form-grid input, .form-grid textarea, .form-grid select { display: block; width: 100%; margin-top: .25rem; padding: .55rem .7rem; font: 400 .95rem var(--font-body); border: 1px solid var(--line); border-radius: 8px; }
.form-grid textarea { min-height: 5rem; }
.duration-choices { border: 0; padding: 0; margin: 0 0 .7rem; }
.duration-choices legend { font-weight: 600; font-size: .88rem; padding: 0; margin-bottom: .25rem; }
.duration-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .5rem; }
.form-grid .duration-option { position: relative; margin: 0; padding: .6rem .8rem .7rem 2.2rem; border: 1px solid var(--line); border-radius: 10px; font-weight: 400; cursor: pointer; }
.duration-option:has(input:checked) { border-color: var(--navy); box-shadow: 0 0 0 1px var(--navy); }
.form-grid .duration-option input { position: absolute; left: .8rem; top: .75rem; width: auto; margin: 0; padding: 0; accent-color: var(--navy); }
.duration-option .d-title { display: block; font-weight: 600; font-size: .9rem; }
.duration-option .d-desc { display: block; margin-top: .15rem; color: var(--muted); font-size: .82rem; line-height: 1.4; }.row { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.row > * { flex: 1 1 10rem; }
.notice { padding: .75rem 1rem; border-radius: 10px; background: #eef1f6; margin: .5rem 0; }
.notice.warn { background: #fff8e6; }
.notice.err { background: #fff0ef; color: var(--coral-hover); }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1rem; margin: 0; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 600; }

.consent { display: flex; gap: .6rem; align-items: flex-start; font-size: .85rem; line-height: 1.45; margin: 1rem 0 .75rem; cursor: pointer; }
.consent input { margin-top: .2rem; flex: none; width: 1.05rem; height: 1.05rem; }
.legal-doc { max-width: 760px; margin: 0 auto; padding: 1rem 0 3rem; line-height: 1.6; }
.legal-doc h1 { margin-bottom: .25rem; }
.legal-doc h2 { font-size: 1.1rem; margin-top: 1.75rem; }
.legal-doc li { margin: .35rem 0; }
.agreement-accept { display: flex; flex-direction: column; gap: .6rem; margin-top: .5rem; }
.caption { display: block; color: var(--muted); font-weight: 400; font-size: .82rem; margin-top: .15rem; }
.open-dialog { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; width: min(34rem, calc(100vw - 2rem)); box-shadow: var(--shadow); }
.open-dialog::backdrop { background: rgba(11, 28, 61, 0.35); }
.partner-list { list-style: none; padding: 0; margin: 0 0 .75rem; }
.partner-list li { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; padding: .5rem 0; border-bottom: 1px solid var(--line); }
.partner-list li > strong { flex: 1 1 8rem; }
