/* =========================================================================
   Theme: Minimal Material
   Clean modern minimalism. Depth comes from soft elevation shadows, not
   borders — borders are mostly removed here, the opposite technique from
   neo-brutalist (which has no shadow language without a hard ink border).
   ========================================================================= */

:root {
    --color-ink: #1C1B1F;
    --color-paper: #F5F5F7;
    --color-surface: #FFFFFF;
    --color-accent: #0277BD;
    --color-accent-ink: #FFFFFF;
    --color-highlight: #FFB300;
    --color-active: #2E7D32;
    --color-paused: #ED6C02;
    --color-closed: #757575;
    --color-muted: #5F6368;
    --color-paused-ink: #1C1B1F;
    --color-accent-text: #01588F;

    --font-display: 'Roboto', sans-serif;
    --font-body: 'Roboto', sans-serif;
    --font-mono: 'Roboto Mono', monospace;

    --border-width: 0px;
    --shadow: 0 1px 3px rgba(0,0,0,0.10), 0 6px 16px rgba(0,0,0,0.08);
    --shadow-tight: 0 1px 2px rgba(0,0,0,0.08), 0 3px 8px rgba(0,0,0,0.06);
    --radius: 12px;
}

h1, h2, h3 {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 500;
}

.site-header, .site-footer {
    border: none;
    box-shadow: var(--shadow-tight);
}

.tier-card, .timeline-item, .trader-card, .current-trade-banner,
.button, .badge, .flash,
.field input[type="text"], .field input[type="email"],
.field input[type="file"], .field textarea {
    border: none;
    border-radius: var(--radius);
}

.tier-card {
    border-top: 4px solid var(--tier-accent);
    box-shadow: var(--shadow);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.tier-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.10), 0 12px 24px rgba(0,0,0,0.12);
}

.tier-card__image {
    border-bottom: none;
    border-radius: var(--radius) var(--radius) 0 0;
}

.button {
    box-shadow: var(--shadow-tight);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.12), 0 6px 14px rgba(0,0,0,0.10);
}

.button--primary {
    background: var(--color-accent);
    border-color: var(--color-accent);
}

.badge { border-radius: 999px; }

.timeline-item {
    box-shadow: var(--shadow-tight);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.timeline-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
}

.timeline-item--current {
    border: 2px solid var(--color-accent);
}

.timeline-item__image, .current-trade-banner img,
.trader-card__photo, .trade-detail__image {
    border: none;
    border-radius: 10px;
}

.trader-card { box-shadow: var(--shadow-tight); }
.trader-card__photo, .trader-card__photo--placeholder { border-radius: 50%; }
.trader-card__photo--placeholder { background: var(--color-highlight); }

.trade-detail__image { box-shadow: var(--shadow); border-radius: 10px; overflow: hidden; }

.trade-detail__credit, .trade-detail__nav {
    border-top: 1px solid rgba(28,27,31,0.1);
}

.empty-state {
    border: 1px dashed rgba(28,27,31,0.25);
}
