/* Echo's charcoal and violet theme. Layout and responsive rules live in styles.css. */
:root {
  color-scheme: dark;
  --paper: #0d0d0f;
  --white: #141417;
  --ink: #f2f0f5;
  --muted: #a3a1ae;
  --line: #29292f;
  --accent: #a895ff;
  --accent-deep: #bbaaff;
  --peach: #221d31;
  --green: #85d9b8;
  --soft: #1b1b20;
  --panel: #141417;
  --panel-raised: #1b1b20;
  --input: #101013;
  --range-track: #34313f;
  --focus-ring: #a895ff30;
}

::selection { background: #a895ff45; color: #fff; }
html { scrollbar-color: #494451 var(--paper); }
button:hover { filter: none; }
button:focus-visible, a:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, .upload-zone:focus-within {
  outline-color: var(--accent);
}
.skip-link { background: var(--accent); color: #14111d; }
.header { background: var(--paper); }
.on-solana { background: #17171b; border-color: #303038; color: #b4b1bf; }
.on-solana svg, .powered-note svg { fill: var(--accent); }
.nav-wrap nav>a { color: var(--muted); }
.nav-wrap nav>a:hover, .nav-wrap nav>a.active { color: var(--ink); }
.wallet-button { background: #23212c; color: #e2dafb; box-shadow: inset 0 0 0 1px #3c354d; }
.wallet-button:hover { background: #30283f; }
.eyebrow, .hero .eyebrow, .discover-heading .eyebrow { color: #a9a3b8; }
.hero-note, .preview-label, .preview-label>span:last-child,
.preview-status>span:last-child { color: #aaa5b9; }
.orbit { border-color: #27232f; }
.post-stamp { background: #17161b; border-color: #39303f; box-shadow: 3px 4px 0 #28222f; }
.stamp-x { color: #eeebf5; }
.tiny-dot { background: #8c829e; }
.preview-badge { color: #b4a8d2; background: #17141e; border-color: #36303f; }
.preview-badge>span, .status-dot, .local-indicator i { background: var(--green); }
.live-dot { box-shadow: 0 0 0 3px #85d9b812; }

.form-panel, .coin-preview, .mini-card, .explore-card {
  background: var(--panel);
  border-color: var(--line);
  box-shadow: 0 6px 20px #00000012;
}
.step-number { background: #211b2e; border-color: #3b2f51; color: var(--accent-deep); }
.hero-copy>p, .step-heading p, .field-help, .optional, .character-count,
.color-row, .range-labels, .credit-note, .coin-body>p, .creator-line,
.split-heading, .split-legend>div>span, .preview-status, .preview-caption,
.why-echo p, .powered-note, .examples-disclaimer, .footer-main>span,
.footer-meta, .form-bottom>p:last-child, .upload-zone>span, .upload-zone small,
.fee-control label>span, .mini-card small, .route-heading>p, .explore-card p,
.card-foot, .sort-label, .modal-description, .how-step p, .review-details dt,
.modal-note, .empty-state p, .review-summary p, .wallet-option small {
  color: var(--muted);
}
input:not([type=range]):not([type=file]), textarea, select {
  background: var(--input);
  border-color: #323239;
  color: var(--ink);
}
input::placeholder, textarea::placeholder { color: #92909f; }
input:not([type=range]):focus, textarea:focus, .post-input-wrap:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
.post-input-wrap { background: var(--input); border-color: #323239; }
.post-input-wrap input { background: transparent !important; }
.input-prefix>span { color: #b4afc2; }
.attach-button { background: #24212e; border-color: #3a3447; color: #ddd4f5; }
.attach-button:hover { background: #30293f; border-color: #665181; }
.field-error { color: #ffa8b2; }
.upload-zone { background: #111114; border-color: #3d3947; }
.upload-zone:hover, .upload-zone.dragging { background: #201b2b; border-color: var(--accent); }
.upload-zone svg, .credit-note svg, .form-bottom>p svg { stroke: #a59ab9; }
.swatch[data-color=violet] { background: #a895ff; }
.swatch[data-color=lilac] { background: #d2a4ed; }
.swatch[data-color=mint] { background: #85d9b8; }
.swatch[data-color=blue] { background: #8fc3fa; }
.swatch.selected:after { border-color: #d0c4e5; }
.fee-control { background: #111114; border-color: #2e2b35; }
input[type=range] { background: linear-gradient(to right,var(--accent) 50%,var(--range-track) 50%); }
input[type=range]::-webkit-slider-thumb { border-color: #24202d; }
input[type=range]::-moz-range-thumb { border-color: #24202d; }
.primary-button { background: var(--accent); color: #171220; font-weight: 700; }
.primary-button:hover { background: #bdadff; box-shadow: 0 4px 20px #a895ff14; }

.coin-art, .coin-art[data-color=violet] { background: #242033; color: #b7a3ff; }
.coin-art[data-color=lilac] { background: #2c2037; color: #d2a4ed; }
.coin-art[data-color=mint] { background: #172d28; color: #85d9b8; }
.coin-art[data-color=blue] { background: #192a3a; color: #8fc3fa; }
.art-grain { opacity: .2; }
.art-corner { opacity: .85; }
.art-edition { opacity: .85; }
.ticker { color: #c9c1dc; background: #24202e; border-color: #36303f; }
.avatar-mini { background: #332b40; color: #cfc0e8; }
.creator-line strong, .x-mini { color: #d1cbdc; }
.info-dot { border-color: #777082; }
.split-bar>span:nth-child(2), .dark-dot { background: #79cbb5; }
.split-bar>span:nth-child(3), .light-dot { background: #5d586d; }
.split-legend strong { color: #e3dfee; }
.why-echo { background: #18151f; border-color: #31283e; }
.hand-star, .why-echo button { color: var(--accent); }
.why-echo h3 { color: #dfd8ed; }
.discover-heading>a, .footer-main>button { color: #c0b4d8; }
.mini-card:hover, .explore-card:hover { border-color: #655181; box-shadow: 0 8px 25px #00000025; }
.mini-card .mini-arrow { color: #9f91b9; }
.mini-art, .explore-art { background: var(--art-bg,#242033); color: var(--art-ink,#b7a3ff); }
.attached-post { background: #19161f; border-color: #35303f; }
.attached-post-head>span:last-child { color: #b1a0cd; }
.attached-post p { color: #d3cadf; }
.attached-post small { color: #a79cb9; }
.attached-post a, .attached-post button { color: var(--accent-deep); }

.search-wrap svg { stroke: #aaa2b8; }
.search-wrap input { background: var(--input) !important; }
.sort-label select { background: var(--input); color: #d1c9df; }
.filter-tabs button { color: #aaa2b8; }
.filter-tabs button:hover { background: #1c1824; }
.filter-tabs button.active { background: #272030; border-color: #4b3b60; color: #d0baff; }
.card-badge { background: #121017b5; color: #dfd3f2; border: 1px solid #c4afff26; }
.card-foot { border-color: var(--line); }
.card-foot strong { color: #bdabf0; }
.empty-state { background: #141217; border-color: #3a3247; }
.empty-state>svg { stroke: var(--accent); }
.empty-state>span { color: var(--accent); }
.empty-state h2 { color: #e4dcee; }

dialog { background: #161419; border-color: #3b3347; box-shadow: 0 24px 90px #00000070; }
dialog::backdrop { background: #050408b8; }
.modal-close { color: #b9afc9; }
.modal-close:hover { background: #302738; }
.modal-note { background: #211b2a; border-color: #382d46; }
.review-summary { border-color: #382f43; }
.success-icon { color: #93e0c0; background: #1a3229; }
.modal-secondary { background: #211b2a; color: #d0c2e5; border-color: #42354f; }
.modal-secondary:hover { background: #2d2339; }
.wallet-option { background: #201b28; border-color: #393044; }
.wallet-option:hover { background: #2a2135; }
.wallet-monogram { color: #c1a7f3; background: #382746; }
.solflare-monogram { color: #c9c4ec; background: #302d43; }
.wallet-feedback { color: #d4baf4; }
.toast { background: #2a2038; color: #eee7fa; box-shadow: 0 8px 32px #00000050; border: 1px solid #59436f; }
.detail-story { color: #c5b9d4; }