:root {
    --bg-0: #0b0e14;
    --bg-1: #121820;
    --bg-2: #1a2030;
    --bg-3: #222a3a;
    --text-0: #fff;
    --text-1: #d4d4d8;
    --text-2: #888;
    --text-3: #555;
    --accent: #e94560;
    --accent-hover: #ff5a75;
    --success: #22c55e;
    --warning: #f59e0b;
    --danger: #ef4444;
    --gold: #ffd700;
    --border: #2a2f3a;
    --border-light: #3a4050;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --shadow: 0 2px 8px rgba(0,0,0,0.4);
    --shadow-lg: 0 4px 16px rgba(0,0,0,0.5);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    background: var(--bg-0);
    font-family: 'Press Start 2P', cursive;
    padding: 50px 20px 250px 20px;
    color: var(--text-0);
}

.layout-wrapper {
    display: grid;
    grid-template-columns: 20% 6px 1fr;
    width: 100%;
    align-items: start;
}

.sidebar {
    position: sticky;
    top: 50px;
    min-width: 0;
    max-width: 450px;
    height: calc(100vh - 50px - 36px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px;
    background: var(--bg-1);
    transition: padding 0.2s ease, opacity 0.2s ease;
}

.sidebar.collapsed {
    padding: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.sidebar-resize-handle {
    background: var(--accent);
    cursor: col-resize;
    border-radius: 3px;
    opacity: 0.6;
    align-self: stretch;
    min-height: 200px;
    transition: opacity 0.2s;
}

.sidebar-resize-handle:hover {
    opacity: 1;
}

.sidebar.collapsed ~ .sidebar-resize-handle {
    display: none;
}

.game-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-left: 10px;
}

.game-content.no-sidebar {
    grid-column: 1 / -1;
    padding-left: 0;
}

.layout-wrapper.sidebar-hidden {
    grid-template-columns: 0px 0px 1fr;
}

.layout-wrapper.sidebar-hidden .sidebar-resize-handle {
    display: none;
}

.sidebar-maximize-btn {
    position: fixed;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10001;
    background: var(--accent);
    color: white;
    border: 2px solid #fff;
    font-size: 1rem;
    padding: 10px 6px;
    border-radius: 4px;
    cursor: pointer;
}

.sidebar-maximize-btn:hover {
    background: #c73652;
}

.vibe-monitor {
    width: 100%;
    max-width: 700px;
    background: rgba(0, 0, 0, 0.6);
    border: 2px solid #22c55e;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.vibe-monitor-header {
    background: linear-gradient(90deg, #000 0%, #0a2e0a 50%, #000 100%);
    padding: 10px 15px;
    border-bottom: 1px solid #22c55e;
}

.vibe-monitor-title {
    color: #22c55e;
    font-size: 1.1rem;
    text-align: center;
    text-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
    letter-spacing: 2px;
}

.vibe-monitor-quote {
    color: var(--text-3);
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    font-style: italic;
    line-height: 1.6;
}

.vibe-monitor-feed {
    padding: 8px 10px;
    overflow-y: auto;
    flex: 1;
}

.vibe-monitor-feed::-webkit-scrollbar {
    width: 4px;
}

.vibe-monitor-feed::-webkit-scrollbar-thumb {
    background: #22c55e;
    border-radius: 2px;
}

.vibe-commit-table {
    width: 100%;
    border-collapse: collapse;
}

.vibe-commit-table td {
    padding: 3px 6px;
    font-size: 0.9rem;
    border-bottom: 1px solid rgba(34, 197, 94, 0.1);
    vertical-align: top;
}

.vibe-commit-hash {
    color: #22c55e;
    font-weight: bold;
    white-space: nowrap;
    width: 55px;
}

.vibe-commit-msg {
    color: #ccc;
    word-break: break-word;
}

.vibe-commit-time {
    color: var(--text-3);
    white-space: nowrap;
    width: 90px;
    text-align: right;
}

.vibe-commit-row:hover td {
    background: rgba(34, 197, 94, 0.05);
}

.vibe-commit-row.latest td {
    color: #4ade80;
    background: rgba(34, 197, 94, 0.08);
}

.vibe-working-tree {
    padding: 4px 6px;
    margin-bottom: 6px;
    font-size: 0.9rem;
    border-bottom: 1px solid rgba(34, 197, 94, 0.15);
    border-radius: 3px;
    background: rgba(233, 69, 96, 0.05);
}

h1 {
    color: var(--accent);
    font-size: 1.5rem;
    margin-top: 70px;
    margin-bottom: 40px;
    text-shadow: 3px 3px 0 #0f3460;
}

.sponsor {
    position: fixed;
    top: 10px;
    right: 10px;
    background: linear-gradient(180deg, #bf0a30 0%, #002868 100%);
    color: white;
    padding: 8px 15px;
    border-radius: 5px;
    font-size: 1rem;
    text-align: center;
    border: 2px solid white;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    z-index: 1000;
}

.sponsor a {
    color: white;
    text-decoration: underline;
}

.sponsor a:hover {
    color: #ffd700;
}

.flag {
    position: fixed;
    font-size: 2rem;
}

.flag-tl { top: 10px; left: 10px; }
.flag-tr { top: 10px; right: 10px; }
.flag-bl { bottom: 40px; left: 10px; }
.flag-br { bottom: 40px; right: 10px; }

.machine-container {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    height: 200px;
}

.input-belt-wrapper {
    position: relative;
    display: flex;
    align-items: flex-end;
}

.dog-wrapper {
    position: absolute;
    left: 0;
    bottom: 20px;
    width: 420px;
    height: 40px;
    transition: left 1s linear;
}

.dog {
    font-size: 40px;
    position: absolute;
    z-index: 10;
    transition: left 1s linear, transform 0.4s ease, opacity 0.1s;
    left: 0px;
    bottom: 0px;
    transform-origin: bottom center;
    width: 40px;
    height: 40px;
}

.input-belt {
    width: 150px;
    height: 20px;
    background: repeating-linear-gradient(90deg, #444 0px, #444 15px, #333 15px, #333 30px);
    border-radius: 5px;
    margin-right: 5px;
    position: relative;
}

.input-belt.animate {
    animation: beltMove 0.3s linear infinite;
}

@keyframes beltMove {
    from { background-position: 0 0; }
    to { background-position: 30px 0; }
}

.machine {
    width: 120px;
    height: 140px;
    background: linear-gradient(180deg, #6b7280 0%, #374151 50%, #1f2937 100%);
    border-radius: 10px 10px 5px 5px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: inset 0 2px 4px rgba(255,255,255,0.1), 0 4px 12px rgba(0,0,0,0.4);
}

.machine-top {
    position: absolute;
    top: -15px;
    width: 60px;
    height: 20px;
    background: #666;
    border-radius: 8px 8px 0 0;
}

.machine-hole {
    width: 50px;
    height: 40px;
    background: #111;
    border-radius: 5px;
    margin-top: 20px;
    position: relative;
    overflow: visible;
}

.machine-hole::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 30%;
    background: rgba(233,69,96,0.3);
}

.crusher-plates {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 10px;
    display: flex;
    justify-content: space-between;
}

.crusher-plate {
    width: 25px;
    height: 10px;
    background: #777;
    border-radius: 2px;
}

.crusher-plate.crushing {
    animation: crush 0.15s ease-in-out 5;
}

@keyframes crush {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(12px); }
}

.output-belt-wrapper {
    position: relative;
    display: flex;
    align-items: flex-end;
}

.output-belt {
    width: 150px;
    height: 20px;
    background: repeating-linear-gradient(90deg, #444 0px, #444 15px, #333 15px, #333 30px);
    border-radius: 5px;
    margin-left: 5px;
    position: relative;
}

.output-belt.animate {
    animation: beltMove 0.3s linear infinite;
}

@keyframes beltMove {
    from { background-position: 0 0; }
    to { background-position: 30px 0; }
}

.dog-body {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 40px;
    line-height: 1;
}

.dog-hat {
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 22px;
    line-height: 1;
    pointer-events: none;
}

.dog-leash {
    position: absolute;
    left: -24px;
    bottom: 4px;
    font-size: 22px;
    line-height: 1;
    pointer-events: none;
}

.dog.walking {
    animation: dogWalk 0.3s linear infinite;
}

@keyframes dogWalk {
    0% { transform: translateY(0) rotate(0deg); }
    25% { transform: translateY(-3px) rotate(-3deg); }
    75% { transform: translateY(3px) rotate(3deg); }
}

.dog.flattening {
    animation: flattenPulse 0.15s ease-in-out infinite;
}

@keyframes flattenPulse {
    0%, 100% { filter: brightness(1) drop-shadow(0 0 5px rgba(255,255,255,0.2)); }
    50% { filter: brightness(1.3) drop-shadow(0 0 15px rgba(233, 69, 96, 0.6)); }
}

.dog.in-machine {
    bottom: 0px;
}

.dog.flattening {
    bottom: 0px;
    transform: scaleY(0.15) scaleX(1.5);
}

.dog.exiting {
    bottom: 0px;
    transform: scaleY(0.2) scaleX(1.5);
}

.dog.falling {
    bottom: -20px;
    transform: scaleY(0.2) scaleX(1.5);
    opacity: 0;
}

.dog.resetting {
    bottom: 0px;
    opacity: 0;
    transform: none;
    transition: left 0s, transform 0s, opacity 0.1s;
}

.sheets {
    position: absolute;
    right: -80px;
    bottom: 20px;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

.sheet {
    width: 60px;
    height: 4px;
    background: #d4a574;
    border-radius: 2px;
    margin: 1px 0;
    animation: sheetFall 0.3s ease-out;
}

@keyframes sheetFall {
    from { transform: translateY(-20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.controls {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
}

.controls-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.flatten-btn {
    font-size: 1rem;
    padding: 15px 30px;
    background: var(--accent);
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 4px 0 #a33348, 0 0 20px rgba(233, 69, 96, 0.3);
    transition: all 0.15s ease;
}

.flatten-btn:hover {
    box-shadow: 0 4px 0 #a33348, 0 0 30px rgba(233, 69, 96, 0.5);
    transform: translateY(-2px);
}

.flatten-btn:active {
    transform: translateY(4px);
    box-shadow: none;
}

.flatten-btn:disabled {
    background: var(--bg-3);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.7;
}

.no-dogs-msg {
    font-size: 0.9rem;
    color: #ef4444;
    text-align: center;
    padding: 4px 0;
}
.no-dogs-msg a {
    color: #22c55e;
    text-decoration: underline;
    cursor: pointer;
}
.no-dogs-msg a:hover {
    color: #4ade80;
}

.token-btn {
    background: #4f46e5;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 3px 0 #3730a3, 0 0 10px rgba(99, 102, 241, 0.3);
    transition: all 0.15s ease;
}

.token-btn:hover {
    box-shadow: 0 3px 0 #3730a3, 0 0 15px rgba(99, 102, 241, 0.5);
    transform: translateY(-1px);
}

.token-btn:active {
    transform: translateY(2px);
    box-shadow: none;
}

.token-btn[disabled] {
    background: #444;
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.6;
}

.dog-inventory {
    background: var(--bg-2);
    border: 2px solid #4ade80;
    border-radius: 8px;
    padding: 10px;
    min-width: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.dog-inventory-header {
    font-size: 0.9rem;
    color: #4ade80;
    text-align: center;
    margin-bottom: 8px;
}
.dog-pile {
    font-size: 1.2rem;
    text-align: center;
    min-height: 20px;
}
.dog-count {
    font-size: 0.9rem;
    color: var(--text-0);
    text-align: center;
    margin: 6px 0;
}
.customer-count {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
    margin-bottom: 6px;
}
.sales-log {
    width: 100%;
    overflow-y: auto;
    font-size: 0.9rem;
    color: #4ade80;
    text-align: center;
    border-top: 1px solid #333;
    padding-top: 6px;
    margin-top: 4px;
}
.sales-log-entry {
    margin: 3px 0;
    color: #f59e0b;
}
.sales-flash {
    animation: salesFlash 0.8s ease-out;
}
@keyframes salesFlash {
    0% { background: rgba(34, 197, 94, 0.4); color: #22c55e; transform: scale(1.05); }
    100% { background: transparent; color: #f59e0b; transform: scale(1); }
}
.dog-stats {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-3);
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid #333;
}
.sell-btn {
    font-size: 0.9rem;
    padding: 8px;
    background: #4ade80;
    color: #0a1f0a;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
}
.sell-btn:hover {
    background: #22c55e;
}
.sell-btn:disabled {
    background: #333;
    color: var(--text-3);
    cursor: not-allowed;
}

.market-dominance {
    background: var(--bg-2);
    border: 2px solid #f59e0b;
    border-radius: 8px;
    padding: 10px;
    min-width: 220px;
}
.market-header {
    font-size: 0.9rem;
    color: #f59e0b;
    text-align: center;
    margin-bottom: 8px;
}
.market-dominance canvas {
    width: 100%;
}
.market-list {
    font-size: 0.9rem;
    color: var(--text-2);
}
.market-list-item {
    display: flex;
    justify-content: space-between;
    padding: 2px 0;
    cursor: pointer;
}
.market-list-item:hover {
    color: var(--text-0);
}
.market-list-item.player-business {
    color: #4ade80;
    font-weight: bold;
}
.market-list-item.shut-down {
    color: #444;
    cursor: not-allowed;
}

.market-list-item.on-cooldown {
    color: #555;
    cursor: not-allowed;
    opacity: 0.6;
}

.hint {
    color: var(--text-3);
    font-size: 1rem;
}

.counter {
    background: var(--bg-2);
    padding: 18px 22px;
    border-radius: 10px;
    border: 3px solid #e94560;
    min-width: 260px;
    max-width: 380px;
    overflow: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
    pointer-events: auto;
    position: relative;
    z-index: 10;
}

.upgrade-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
}

.upgrade-row + .upgrade-row {
    border-top: 1px solid #333;
}

.upgrade-row-left {
    flex: 1;
    min-width: 0;
}

.counter-value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.wm-stat-value {
    white-space: nowrap;
}

.stat-char-col {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    line-height: 1;
}

.stat-char-roll {
    display: block;
    will-change: transform;
    transition: transform 0.3s cubic-bezier(0.33, 1, 0.68, 1);
}

.stat-char-roll > span {
    display: block;
    line-height: 1;
}

#priceCounter, #moneyCounter, #priceCounter {
    border-color: #22c55e;
}

#priceCounter {
    min-width: 130px;
    padding: 10px 14px;
}

#priceCounter .counter-value {
    font-size: 1rem;
}

#tokenCounter {
    border-color: #ffd700;
    width: 100%;
    max-width: 600px;
}

#upgradeCounter {
    border-color: var(--accent);
}

#autoFlattenerCounter {
    border-color: #8b5cf6;
}

.auto-progress-bar {
    width: 100%;
    height: 16px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    margin: 5px 0;
}

.auto-progress-fill {
    height: 100%;
    background: #8b5cf6;
    width: 0%;
    border-radius: 7px;
    box-shadow: 0 0 4px rgba(139, 92, 246, 0.3);
}

#upgradeLevel {
    font-size: 1.1rem;
}

#upgradeCost {
    font-size: 0.9rem;
    color: #22c55e;
}

.bro-message {
    font-size: 1rem;
    color: #ffd700;
    text-align: center;
    margin-top: 8px;
    padding: 6px;
    border: 1px solid #ffd700;
    border-radius: 3px;
}

#carbonCounter {
    border-color: #10b981;
}

.carbon-green-bonus {
    display: inline-block;
    background: #22c55e;
    color: var(--text-0);
    font-size: 0.9rem;
    padding: 2px 6px;
    border-radius: 3px;
    margin-left: 6px;
    vertical-align: middle;
    cursor: help;
}

.carbon-fine-penalty {
    display: inline-block;
    background: #ef4444;
    color: var(--text-0);
    font-size: 0.9rem;
    padding: 2px 6px;
    border-radius: 3px;
    margin-left: 6px;
    vertical-align: middle;
    cursor: help;
}

.carbon-status {
    font-size: 1.1rem;
    padding: 4px 8px;
    border-radius: 3px;
    margin: 4px 0;
    text-align: center;
}

.carbon-bar {
    width: 100%;
    height: 12px;
    background: #333;
    border-radius: 5px;
    overflow: hidden;
    margin: 4px 0;
    position: relative;
}

.carbon-bar-fill {
    height: 100%;
    border-radius: 5px;
    transition: width 0.3s ease;
}

.carbon-bar-label {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 0.9rem;
    line-height: 12px;
    color: var(--text-0);
    text-shadow: 0 0 2px #000;
}

.carbon-trade-section {
    margin-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 8px;
}

.carbon-trade-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
    gap: 8px;
}

.carbon-trade-label {
    font-size: 0.9rem;
    color: var(--text-2);
    flex-shrink: 0;
}

.carbon-trade-value {
    font-size: 0.9rem;
    color: #ccc;
}

.carbon-input {
    width: 80px;
    font-size: 0.9rem;
    padding: 6px;
    background: var(--bg-1);
    color: var(--text-0);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    text-align: right;
}

.carbon-trade-btns {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}

.carbon-trade-btns button {
    flex: 1;
}

.carbon-result {
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    min-height: 12px;
}

.carbon-modifier {
    font-size: 0.9rem;
    padding: 3px 6px;
    border-radius: 3px;
    margin: 3px 0;
    text-align: center;
}

.carbon-modifier.positive {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}

.carbon-modifier.negative {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}

.carbon-modifier.neutral {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text-2);
}

#tokenPrice {
    color: #ffd700;
    font-size: 1.1rem;
}

#tokens {
    color: #ffd700;
    font-size: 1.1rem;
}

.token-buttons {
    display: flex;
    gap: 5px;
    margin-top: 5px;
}

.token-slider-wrap {
    margin-top: 6px;
    padding: 0 4px;
}
.token-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 4px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    outline: none;
    cursor: pointer;
}
.token-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent);
    border: 2px solid #fff;
    cursor: pointer;
}
.token-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent);
    border: 2px solid #fff;
    cursor: pointer;
}
.token-slider-labels {
    display: flex;
    justify-content: space-between;
    font-size: 0.55rem;
    color: #555;
    margin-top: 2px;
}

#brotherChart {
    width: 100%;
    margin-top: 10px;
    background: rgba(0,0,0,0.5);
    border: 1px solid var(--border);
    border-radius: 5px;
}

.token-tabs {
    display: flex;
    border-bottom: 1px solid #333;
    margin-bottom: 8px;
}
.token-tab {
    flex: 1;
    padding: 6px;
    font-size: 1rem;
    background: transparent;
    color: var(--text-3);
    border: none;
    cursor: pointer;
    text-align: center;
}
.token-tab.active {
    color: #ffd700;
    border-bottom: 2px solid #ffd700;
}
.token-tab:hover {
    color: #aaa;
}
.token-tab-content {
    display: none;
}
.token-tab-content.active {
    display: block;
}
.token-tab.small-tab {
    font-size: 0.9rem;
    padding: 4px 8px;
}
.token-subtab-content {
    display: none;
}
.token-subtab-content.active {
    display: block;
}

.token-btn {
    flex: 1;
    padding: 10px;
    font-size: 1rem;
    background: #ffd700;
    color: black;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    pointer-events: auto;
    position: relative;
}

.order-book {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.9rem;
    margin: 6px 0;
    border: 1px solid var(--border);
    background: #0a0a0a;
    padding: 4px;
}
.order-book-asks, .order-book-bids {
    min-height: 120px;
}
.order-book-header {
    display: flex;
    justify-content: space-between;
    color: var(--text-2);
    border-bottom: 1px solid #333;
    padding-bottom: 2px;
    margin-bottom: 2px;
}
.order-book-row {
    display: flex;
    justify-content: space-between;
    padding: 2px 0;
    cursor: pointer;
    position: relative;
    border-radius: 2px;
}
.order-book-row:hover {
    background: #1a1a1a;
}
.order-book-row .volume-bar {
    position: absolute;
    top: 0;
    bottom: 0;
    opacity: 0.3;
    z-index: 0;
}
.order-book-row .volume-bar.bid-bar {
    right: 0;
    background: #22c55e;
}
.order-book-row .volume-bar.ask-bar {
    left: 0;
    background: #ef4444;
}
.order-book-row span {
    position: relative;
    z-index: 1;
}
.clickable-price {
    cursor: pointer;
}
.clickable-price:hover span {
    color: #ffd700 !important;
}
.order-book-bid { color: #22c55e; }
.order-book-ask { color: #ef4444; }
.ob-flash-up {
    animation: obFlashUp 0.6s ease-out;
}
.ob-flash-down {
    animation: obFlashDown 0.6s ease-out;
}
.ob-flash-new {
    animation: obFlashNew 0.8s ease-out;
}
@keyframes obFlashUp {
    0% { background: rgba(34, 197, 94, 0.35); }
    100% { background: transparent; }
}
@keyframes obFlashDown {
    0% { background: rgba(239, 68, 68, 0.35); }
    100% { background: transparent; }
}
@keyframes obFlashNew {
    0% { background: rgba(234, 179, 8, 0.4); }
    100% { background: transparent; }
}
.order-book-spread {
    text-align: center;
    color: var(--text-2);
    border-top: 1px solid #333;
    padding-top: 2px;
    margin-top: 2px;
}
.order-book-liquidity {
    text-align: center;
    font-size: 0.9rem;
    color: var(--text-3);
    margin-top: 2px;
}

.order-history {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.9rem;
    margin-top: 10px;
    border: 1px solid var(--border);
    background: #0a0a0a;
    overflow-y: auto;
    flex: 1;
    min-height: 60px;
}
.order-history-header {
    font-size: 1rem;
    color: #ffd700;
    padding: 4px;
    border-bottom: 1px solid #333;
}
.order-history-list {
    padding: 4px;
}
.order-history-item {
    padding: 2px 0;
    border-bottom: 1px solid #222;
}
.order-history-buy { color: #22c55e; }
.order-history-sell { color: #ef4444; }
.order-history-time { color: var(--text-3); font-size: 0.9rem; }

.token-btn:hover {
    background: #ffed4a;
}

.token-btn:disabled {
    background: #666;
    cursor: not-allowed;
}

.counter-label {
    color: var(--text-0);
    font-size: 0.9rem;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    display: block;
}

.counter-value {
    color: var(--accent);
    font-size: 1.4rem;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    display: block;
}

#autoFlattenerLevel, #autoFlattenerCost {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}

.upgrade-info {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    color: var(--accent);
    font-size: 0.9rem;
}

.upgrade-level, .upgrade-cost {
    color: var(--accent);
    font-size: 0.9rem;
}

.af-status {
    color: #22c55e;
    font-size: 0.9rem;
}

.af-level, .af-cost {
    color: var(--accent);
    font-size: 0.9rem;
}


.message {
    position: absolute;
    left: 50%;
    top: -45px;
    transform: translateX(-50%);
    background: var(--accent);
    color: white;
    padding: 15px 30px;
    border-radius: 8px;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 100;
    white-space: nowrap;
    pointer-events: none;
}

.message.show {
    opacity: 1;
}

.faq-section {
    position: fixed;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 50;
    display: flex;
    gap: 6px;
}

.faq-toggle {
    background: var(--bg-2);
    color: white;
    border: 2px solid #e94560;
    padding: 8px 12px;
    font-size: 0.9rem;
    cursor: pointer;
    border-radius: 50%;
    width: 40px;
    height: 40px;
}

.faq-toggle:hover {
    background: var(--accent);
}

.faq-bounty-btn {
    border-color: #22c55e;
    font-size: 0.8rem;
}

.faq-bounty-btn:hover {
    background: #22c55e;
}

.faq-content {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.95);
    color: white;
    padding: 15px;
    border-radius: 10px;
    border: 2px solid #e94560;
    width: 440px;
    margin-bottom: 10px;
    font-size: 0.9rem;
}

.faq-content.show {
    display: block;
}

.faq-content ul {
    margin: 0;
    padding-left: 20px;
}

.faq-content li {
    margin: 5px 0;
}

.faq-content h3 {
    color: var(--accent);
    font-size: 1rem;
    margin: 0 0 10px 0;
    text-align: center;
}

.faq-tutorial-btn {
    display: block;
    width: 100%;
    margin-top: 12px;
    padding: 8px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: var(--accent);
    border: 1px solid #e94560;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.faq-tutorial-btn:hover {
    background: var(--accent);
    color: var(--text-0);
}

.banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--accent);
    color: white;
    text-align: center;
    padding: 12px;
    font-size: 1rem;
}

.waiting-area {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 8px;
    margin-left: 15px;
    flex-shrink: 0;
}

.waiting-person {
    font-size: 28px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.waiting-person.drinking {
    animation: drink 0.5s ease-in-out;
}

.dialogue {
    position: absolute;
    background: white;
    color: black;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: 1rem;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 50;
    pointer-events: none;
    text-align: right;
    width: max-content;
    max-width: 200px;
    right: 0;
}

.waiting-area .waiting-person .dialogue { bottom: 45px; }

.dialogue.show {
    opacity: 1;
}

.waiting-area .waiting-person .dialogue::after { left: 50%; margin-left: -5px; }

@keyframes drink {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-15deg) translateY(-5px); }
    75% { transform: rotate(15deg) translateY(-5px); }
}

.scoreboard {
    background: rgba(0,0,0,0.5);
    padding: 15px;
    border-radius: 10px;
    width: 100%;
    transition: all 0.2s ease;
}

.scoreboard-toggle {
    background: none;
    border: 1px solid #e94560;
    color: var(--accent);
    font-size: 0.9rem;
    padding: 2px 6px;
    border-radius: 3px;
    cursor: pointer;
    float: right;
    margin-left: 8px;
}

.scoreboard-toggle:hover {
    background: var(--accent);
    color: white;
}

.scoreboard h2 {
    color: var(--accent);
    font-size: 0.9rem;
    margin-bottom: 10px;
    text-align: center;
}

.scoreboard-input {
    display: flex;
    gap: 5px;
    margin-bottom: 10px;
}

.scoreboard-input input {
    flex: 1;
    padding: 5px;
    font-family: inherit;
    font-size: 1rem;
    background: var(--bg-2);
    color: white;
    border: 1px solid var(--border);
    border-radius: 3px;
    width: 80px;
}

.scoreboard-input button {
    padding: 5px 8px;
    font-family: inherit;
    font-size: 0.9rem;
    background: var(--accent);
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.scoreboard-input button:disabled {
    background: #666;
    cursor: not-allowed;
}

.leaderboard {
    color: white;
    font-size: 1rem;
    width: 100%;
}

.leaderboard table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.leaderboard th {
    padding: 4px 2px;
    border-bottom: 2px solid #e94560;
    font-weight: bold;
    color: var(--accent);
    font-size: 0.9rem;
    text-align: right;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    overflow: hidden;
}

.leaderboard th:first-child {
    text-align: left;
    width: 40%;
    white-space: normal;
    overflow: visible;
}

.leaderboard th:hover {
    color: var(--text-0);
}

.leaderboard th .sort-arrow {
    font-size: 0.9rem;
    margin-left: 1px;
}

.leaderboard td {
    padding: 3px 2px;
    border-bottom: 1px solid #333;
    font-size: 0.9rem;
    text-align: right;
    white-space: nowrap;
}

.leaderboard td:first-child {
    text-align: left;
    white-space: normal;
    font-size: 0.9rem;
    word-break: break-word;
}

.leaderboard tr:first-child {
    color: #ffd700;
}

.leaderboard tr:nth-child(2) {
    color: #c0c0c0;
}

.leaderboard tr:nth-child(3) {
    color: #cd7f32;
}

.leaderboard tr.inactive td {
    opacity: 0.4;
}

.leaderboard-dogs {
    text-align: right;
}

.leaderboard-money {
    text-align: right;
    color: #22c55e;
}

.leaderboard-tokens {
    text-align: right;
    color: #f59e0b;
}

.leaderboard-rank {
    font-weight: bold;
}

.rank-bronze { color: #cd7f32; }
.rank-silver { color: #c0c0c0; }
.rank-gold { color: #ffd700; }
.rank-platinum { color: #e5e4e2; }
.rank-diamond { color: #b9f2ff; text-shadow: 0 0 5px #b9f2ff; }
.rank-neon { color: #39ff14; text-shadow: 0 0 10px #39ff14, 0 0 20px #39ff14; }
.rank-rainbow {
    background: linear-gradient(90deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: rainbowGlow 2s linear infinite;
}
.rank-glow {
    color: #ff00ff;
    text-shadow: 0 0 10px #ff00ff, 0 0 20px #ff00ff, 0 0 30px #ff00ff;
    animation: glowPulse 1.5s ease-in-out infinite alternate;
}
.rank-legendary {
    color: #ffd700;
    text-shadow: 0 0 10px #ffd700, 0 0 20px #ff8c00, 0 0 30px #ffd700;
    animation: legendaryGlow 2s ease-in-out infinite alternate;
}

@keyframes rainbowGlow {
    0% { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}
@keyframes glowPulse {
    from { text-shadow: 0 0 10px #ff00ff, 0 0 20px #ff00ff; }
    to { text-shadow: 0 0 20px #ff00ff, 0 0 40px #ff00ff, 0 0 60px #ff00ff; }
}
@keyframes legendaryGlow {
    from { text-shadow: 0 0 10px #ffd700, 0 0 20px #ff8c00; }
    to { text-shadow: 0 0 20px #ffd700, 0 0 40px #ff8c00, 0 0 60px #ffd700; }
}

.leaderboard tr.inactive td {
    opacity: 0.4;
    color: #555;
}
.leaderboard tr.inactive .leaderboard-rank {
    color: var(--text-3) !important;
    text-shadow: none !important;
    -webkit-text-fill-color: var(--text-3) !important;
}

.show-all-btn {
    display: block;
    margin: 8px auto 0;
    padding: 4px 10px;
    font-size: 0.9rem;
    background: var(--bg-2);
    color: var(--text-2);
    border: 1px solid var(--border);
    border-radius: 3px;
    cursor: pointer;
}
.show-all-btn:hover {
    color: var(--text-0);
    border-color: var(--accent);
}

.all-players-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.85);
    z-index: 10000;
    justify-content: center;
    align-items: center;
}
.all-players-overlay.active {
    display: flex;
}
.all-players-popup {
    background: var(--bg-1);
    border: 2px solid #e94560;
    border-radius: 8px;
    padding: 15px;
    max-width: 700px;
    width: 95%;
    max-height: 85vh;
    overflow-y: auto;
    position: relative;
}
.all-players-popup h2 {
    color: var(--accent);
    font-size: 0.9rem;
    margin: 0 0 10px;
    text-align: center;
}
.all-players-close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: none;
    color: var(--accent);
    font-size: 1.2rem;
    cursor: pointer;
}
.all-players-row {
    display: grid;
    grid-template-columns: 35px 1fr 70px 90px 70px 60px 60px;
    gap: 4px;
    padding: 5px 2px;
    border-bottom: 1px solid #333;
    color: #ccc;
    font-size: 0.9rem;
    align-items: center;
}
.all-players-row.header {
    color: var(--accent);
    font-weight: bold;
    font-size: 0.9rem;
    border-bottom: 2px solid #e94560;
}
.all-players-row span:nth-child(1) {
    text-align: center;
    color: var(--text-2);
}
.all-players-row span:nth-child(2) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.all-players-row span:nth-child(3) {
    text-align: right;
}
.all-players-row span:nth-child(4) {
    text-align: right;
    color: #22c55e;
}
.all-players-row span:nth-child(5) {
    text-align: right;
    color: #ffd700;
}
.all-players-row span:nth-child(6) {
    text-align: right;
    color: #87ceeb;
}
.all-players-row span:nth-child(7) {
    text-align: right;
    color: #c084fc;
}

.news-ticker {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: linear-gradient(90deg, #000 0%, #1a1a2e 50%, #000 100%);
    color: #00ff00;
    padding: 12px 0;
    min-height: 20px;
    font-size: 0.9rem;
    overflow: hidden;
    white-space: nowrap;
    border-bottom: 2px solid #e94560;
    z-index: 100;
}

.news-ticker-content {
    position: absolute;
    left: 0;
    top: 0;
    white-space: nowrap;
    will-change: transform;
}

.stock-up { color: #22c55e; }
.stock-down { color: #ff4444; }

.anticheat-warning {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #ff4444;
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 1rem;
    display: none;
    z-index: 99999;
}

.anticheat-warning.show {
    display: block;
}

.disconnect-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.92);
    z-index: 10000;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.disconnect-overlay.active {
    display: flex;
}

.disconnect-content {
    text-align: center;
    color: var(--accent);
    max-width: 600px;
    padding: 20px;
}

.disconnect-title {
    font-size: 1.8rem;
    margin-bottom: 30px;
    text-shadow: 0 0 20px #e94560;
    animation: disconnectPulse 1.5s ease-in-out infinite;
}

@keyframes disconnectPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.disconnect-excuse {
    font-size: 1rem;
    color: #ffd700;
    margin-bottom: 20px;
    line-height: 1.8;
}

.disconnect-sub {
    font-size: 1rem;
    color: var(--text-2);
}

.disconnect-commits {
    margin-top: 24px;
    text-align: left;
    max-width: 500px;
}

.disconnect-commits-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 8px;
    border-bottom: 1px solid #333;
    padding-bottom: 4px;
}

.disconnect-commit {
    font-size: 0.9rem;
    color: #aaa;
    padding: 4px 0;
    line-height: 1.6;
    display: flex;
    gap: 8px;
    align-items: baseline;
}

.disconnect-commit-hash {
    color: #22d3ee;
    font-family: 'Press Start 2P', cursive;
    flex-shrink: 0;
}

.disconnect-commit-msg {
    color: #ccc;
    word-break: break-word;
}

.achievement {
    position: relative;
    transform: scale(0);
    background: linear-gradient(180deg, #bf0a30 0%, #002868 100%);
    color: white;
    padding: 20px 30px;
    border-radius: 10px;
    font-size: 0.9rem;
    text-align: center;
    z-index: 200;
    opacity: 0;
    transition: all 0.3s ease-out;
    border: 3px solid #ffd700;
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.5);
    max-width: 500px;
    margin-bottom: 20px;
    display: inline-block;
}

.achievement.show {
    opacity: 1;
    transform: scale(1);
}

.achievement-title {
    color: #ffd700;
    margin-bottom: 10px;
}

.poker-game {
    background: linear-gradient(180deg, #0a3d0a 0%, #062a06 100%);
    border: 2px solid #22c55e;
    border-radius: 10px;
    padding: 12px;
    width: 100%;
    overflow: visible;
}

.china-import {
    width: 100%;
    min-width: 260px;
    text-align: center;
    padding: 10px;
}

.china-flag {
    font-size: 2rem;
    margin-bottom: 5px;
}

.china-title {
    font-size: 1rem;
    color: #ffd700;
    margin-bottom: 3px;
}

.china-subtitle {
    font-size: 1rem;
    color: var(--text-0);
    margin-bottom: 5px;
}

.china-price {
    font-size: 1.1rem;
    color: var(--text-0);
    margin-bottom: 5px;
}

.china-per-dog {
    display: block;
    font-size: 0.9rem;
    color: #22c55e;
    margin-top: 4px;
}

.china-quantity {
    font-size: 1rem;
    color: var(--text-0);
    margin-bottom: 5px;
}

.china-quantity input {
    background: #fff;
    border: 1px solid #ffd700;
    border-radius: 3px;
    color: #de2910;
}

.china-tiers {
    font-size: 1rem;
    color: #ffd700;
    margin-top: 5px;
}

.china-tier {
    margin-bottom: 2px;
}

.china-btn {
    background: #ffd700;
    color: #de2910;
    border: none;
    border-radius: 4px;
    padding: 10px 16px;
    font-size: 1.1rem;
    cursor: pointer;
    width: 100%;
}

.china-btn:hover {
    background: #ffed4a;
}

.breaking-news-presets {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 5px 0;
}
.breaking-news-preset {
    background: #2a0a0a;
    color: #ff4444;
    border: 1px solid #8b0000;
    border-radius: 3px;
    padding: 4px 6px;
    font-size: 0.9rem;
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.breaking-news-preset:hover {
    background: #4a0a0a;
    border-color: #ff0000;
}
.breaking-news-durations {
    display: flex;
    gap: 4px;
    margin: 5px 0;
}
.breaking-news-dur-btn {
    flex: 1;
    background: var(--bg-2);
    color: #ff0000;
    border: 1px solid #8b0000;
    border-radius: 3px;
    padding: 4px;
    font-size: 0.9rem;
    cursor: pointer;
}
.breaking-news-dur-btn.selected {
    background: #8b0000;
    color: var(--text-0);
    border-color: #ff0000;
}
.breaking-news-dur-btn:hover {
    background: #3a0a0a;
}
.breaking-news-input {
    width: 100%;
    background: #0a0a1a;
    color: #ff0000;
    border: 1px solid #8b0000;
    border-radius: 3px;
    padding: 6px 8px;
    font-size: 0.9rem;
    box-sizing: border-box;
    margin: 5px 0;
}
.breaking-news-input::placeholder {
    color: #550000;
}
.breaking-news-buy {
    width: 100%;
    background: #8b0000;
    color: #ff0000;
    border: 2px solid #ff0000;
    border-radius: 4px;
    padding: 8px;
    font-size: 1rem;
    cursor: pointer;
}
.breaking-news-buy:hover {
    background: #aa0000;
}
.breaking-news-buy:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.breaking-news-result {
    font-size: 0.9rem;
    color: #ffd700;
    margin-top: 5px;
    min-height: 12px;
}
.breaking-news-active {
    font-size: 0.9rem;
    color: #ff6666;
    margin-top: 4px;
}

.ec2-panel {
    width: 100%;
    min-width: 260px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    overflow: visible;
}
.ec2-header {
    background: linear-gradient(180deg, #232f3e 0%, #1a2633 100%);
    padding: 10px 14px;
    margin: -14px -14px 10px -14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ff9900;
}
.ec2-header-title {
    font-size: 0.9rem;
    color: #ff9900;
}
.ec2-launch-btn {
    font-size: 1rem;
    padding: 5px 10px;
    background: #ff9900;
    color: #232f3e;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.ec2-launch-btn:hover {
    background: #ffad33;
}
.ec2-launch-panel {
    padding: 8px 12px;
    background: #111927;
    border-bottom: 1px solid #333;
    display: none;
}
.ec2-launch-panel.open {
    display: block;
}
.ec2-type-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin: 6px 0;
}
.ec2-type-option {
    background: #0d1622;
    color: #ccc;
    border: 1px solid var(--border);
    border-radius: 3px;
    padding: 5px 6px;
    font-size: 0.9rem;
    cursor: pointer;
    text-align: left;
}
.ec2-type-option:hover {
    background: #1a2a3a;
    border-color: #ff9900;
}
.ec2-launch-result {
    font-size: 1rem;
    color: #ff9900;
    padding: 4px;
    min-height: 1.2em;
}
.ec2-type-option.selected {
    border-color: #ff9900;
    background: #1a2a3a;
    color: #ff9900;
}
.ec2-type-cost {
    color: #22c55e;
    font-size: 0.9rem;
}
.ec2-type-dogs {
    color: var(--text-2);
    font-size: 0.9rem;
}
.ec2-confirm-launch {
    width: 100%;
    font-size: 1rem;
    padding: 6px;
    background: #ff9900;
    color: #232f3e;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    margin-top: 4px;
}
.ec2-confirm-launch:hover {
    background: #ffad33;
}
.ec2-summary {
    padding: 6px 12px;
    background: #111927;
    font-size: 0.9rem;
    color: #aaa;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #222;
}
.ec2-table-wrap {
    flex: 1;
    min-height: 100px;
    overflow-y: auto;
}
.ec2-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.ec2-table thead th {
    background: #232f3e;
    color: #ff9900;
    padding: 5px 6px;
    text-align: left;
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid #ff9900;
    white-space: nowrap;
}
.ec2-table tbody tr {
    border-bottom: 1px solid #1a1a2e;
}
.ec2-table tbody tr:hover {
    background: #162030;
}
.ec2-table td {
    padding: 4px 6px;
    color: #ccc;
    white-space: nowrap;
    vertical-align: middle;
}
.ec2-state-running {
    color: #22c55e;
}
.ec2-state-stopped {
    color: var(--text-2);
}
.ec2-state-badge {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
.ec2-state-badge.running {
    background: #22c55e;
    box-shadow: 0 0 4px #22c55e;
}
.ec2-state-badge.stopped {
    background: #888;
}
.ec2-action-btn {
    font-size: 0.9rem;
    padding: 2px 5px;
    border: 1px solid #555;
    background: transparent;
    color: #aaa;
    border-radius: 2px;
    cursor: pointer;
    margin-right: 2px;
}
.ec2-action-btn:hover {
    border-color: #ff9900;
    color: #ff9900;
}
.ec2-action-btn.terminate {
    color: #ff4444;
    border-color: #ff4444;
}
.ec2-action-btn.terminate:hover {
    background: #ff4444;
    color: var(--text-0);
}
.ec2-name-input {
    font-size: 0.9rem;
    background: transparent;
    border: none;
    color: #79b8ff;
    width: 60px;
    outline: none;
}
.ec2-name-input::placeholder {
    color: #444;
}
.ec2-empty {
    padding: 20px 12px;
    text-align: center;
    font-size: 0.9rem;
    color: #555;
}
.ec2-result {
    font-size: 0.9rem;
    color: #ff9900;
    padding: 4px 12px;
    min-height: 14px;
}

.factory-panel {
    width: 100%;
    min-width: 260px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    overflow: visible;
}
.factory-header {
    background: linear-gradient(180deg, #2d1f0e 0%, #1a1408 100%);
    padding: 10px 14px;
    margin: -14px -14px 10px -14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #ff6600;
}
.factory-header-title {
    font-size: 0.9rem;
    color: #ff6600;
}
.factory-buy-toggle {
    font-size: 1rem;
    padding: 5px 10px;
    background: #ff6600;
    color: #1a1408;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.factory-buy-toggle:hover {
    background: #ff8833;
}
.factory-buy-panel {
    display: none;
    margin-bottom: 10px;
}
.factory-buy-panel.open {
    display: block;
}
.factory-type-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 8px;
    margin-bottom: 8px;
}
.factory-type-option {
    background: #1a1a2e;
    border: 2px solid #333;
    border-radius: 6px;
    padding: 10px 8px;
    cursor: pointer;
    color: #ccc;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.65rem;
    text-align: center;
    line-height: 1.6;
}
.factory-type-option:hover {
    border-color: #ff6600;
    background: #222240;
}
.factory-type-option.selected {
    border-color: #ff6600;
    background: #2d1f0e;
    color: #ff6600;
}
.factory-type-name {
    font-size: 0.7rem;
    margin-bottom: 4px;
    color: #fff;
}
.factory-type-cost {
    color: #ff6600;
    margin-bottom: 2px;
}
.factory-type-stats {
    color: #aaa;
    font-size: 0.6rem;
}
.factory-type-dps {
    color: #22c55e;
    font-size: 0.6rem;
    margin-top: 2px;
}
.factory-buy-result {
    font-size: 0.8rem;
    color: #ff6600;
    padding: 4px 0;
    min-height: 12px;
}
.factory-summary {
    display: flex;
    justify-content: space-between;
    padding: 8px 10px;
    background: #111827;
    border-radius: 4px;
    margin-bottom: 8px;
    font-size: 0.7rem;
    color: #aaa;
}
.factory-actions {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}
.factory-collect-btn {
    flex: 1;
    font-size: 0.85rem;
    padding: 10px;
    background: linear-gradient(180deg, #ff6600, #cc4400);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-family: 'Press Start 2P', monospace;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}
.factory-collect-btn:hover {
    background: linear-gradient(180deg, #ff8833, #dd5511);
}
.factory-collect-btn:disabled {
    background: #333;
    cursor: not-allowed;
}
.factory-collect-result {
    font-size: 0.8rem;
    color: #22c55e;
    padding: 4px 10px;
    min-height: 12px;
    margin-bottom: 6px;
}
.factory-table-wrap {
    overflow-x: auto;
}
.factory-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.7rem;
}
.factory-table thead th {
    background: #1a1a2e;
    color: #aaa;
    padding: 8px 6px;
    text-align: left;
    border-bottom: 1px solid #333;
    white-space: nowrap;
}
.factory-table tbody tr {
    border-bottom: 1px solid #222;
}
.factory-table tbody tr:hover {
    background: #1a1a2e;
}
.factory-table td {
    padding: 6px;
    white-space: nowrap;
}
.factory-status-active {
    color: #22c55e;
}
.factory-status-idle {
    color: #666;
}
.factory-action-btn {
    font-size: 0.6rem;
    padding: 4px 8px;
    background: #333;
    color: #e94560;
    border: 1px solid #e94560;
    border-radius: 3px;
    cursor: pointer;
    font-family: 'Press Start 2P', monospace;
}
.factory-action-btn:hover {
    background: #e94560;
    color: #fff;
}
.factory-empty {
    text-align: center;
    color: #666;
    padding: 20px;
    font-size: 0.75rem;
}

.meme-panel {
    width: 100%;
    min-width: 260px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    overflow: visible;
}
.meme-header {
    font-size: 1.1rem;
    color: #22c55e;
    text-align: center;
    margin-bottom: 8px;
}
.meme-desc {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
    margin-bottom: 8px;
}
.meme-stats {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #aaa;
    margin-bottom: 8px;
    border-bottom: 1px solid #333;
    padding-bottom: 6px;
}
.meme-staple-btn {
    width: 100%;
    font-size: 1rem;
    padding: 8px;
    background: #22c55e;
    color: var(--text-0);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-bottom: 6px;
}
.meme-staple-btn:hover {
    background: #16a34a;
}
.meme-staple-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.meme-result {
    font-size: 0.9rem;
    color: #22c55e;
    text-align: center;
    min-height: 28px;
    margin-top: 4px;
    line-height: 1.4;
}
.meme-result .meme-line {
    color: #ccc;
    margin-bottom: 2px;
}
.meme-result .yoda-line {
    color: #8b5cf6;
    font-style: italic;
}
.meme-result .sale-line {
    color: #22c55e;
}
.meme-ink-container {
    width: 100%;
    height: 16px;
    background: var(--bg-2);
    border: 2px solid #22c55e;
    border-radius: 3px;
    margin-bottom: 6px;
    position: relative;
    overflow: hidden;
}
.meme-ink-bar {
    height: 100%;
    background: var(--success);
    transition: width 0.3s ease;
    border-radius: 1px;
}
.meme-ink-label {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    color: var(--text-0);
    text-shadow: 1px 1px 0 #000;
}
.meme-stockpile {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #22c55e;
    margin-bottom: 6px;
    padding: 4px;
    background: #0a1a0a;
    border-radius: 3px;
    border: 1px solid #166534;
}
.meme-btn-row {
    display: flex;
    gap: 6px;
    margin-bottom: 6px;
}
.meme-btn-row .meme-staple-btn {
    flex: 1;
}
.meme-sell-btn {
    width: 100%;
    font-size: 1.1rem;
    padding: 10px;
    background: var(--success);
    color: var(--text-0);
    border: 2px solid #4ade80;
    border-radius: 4px;
    cursor: pointer;
    margin-bottom: 6px;
    text-shadow: 1px 1px 0 #000;
}
.meme-sell-btn:hover {
    background: #4ade80;
}
.meme-sell-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.meme-cooldown-container {
    width: 100%;
    height: 14px;
    background: var(--bg-2);
    border: 2px solid #166534;
    border-radius: 3px;
    margin-bottom: 6px;
    position: relative;
    overflow: hidden;
}
.meme-cooldown-bar {
    height: 100%;
    background: var(--success);
    transition: width 0.3s ease;
    border-radius: 1px;
}
.meme-cooldown-bar.low {
    background: var(--warning);
}
.meme-cooldown-bar.critical {
    background: var(--danger);
}
.meme-cooldown-label {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    color: var(--text-0);
    text-shadow: 1px 1px 0 #000;
}
.meme-staple-anim {
    position: relative;
    height: 60px;
    margin: 8px 0;
    display: none;
    overflow: hidden;
}
.meme-staple-anim.active {
    display: block;
}
.staple-page {
    position: absolute;
    top: 8px;
    width: 45%;
    height: 44px;
    background: #f5f5dc;
    border: 2px solid #888;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    color: #333;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.staple-page-left {
    left: 0;
    transform: rotate(-8deg);
}
.staple-page-right {
    right: 0;
    transform: rotate(8deg);
}
.meme-staple-anim.animating .staple-page-left {
    animation: pageLeft 0.4s ease-in forwards;
}
.meme-staple-anim.animating .staple-page-right {
    animation: pageRight 0.4s ease-in forwards;
}
@keyframes pageLeft {
    0% { left: 0; transform: rotate(-8deg); }
    70% { left: 22%; transform: rotate(-2deg); }
    100% { left: 22%; transform: rotate(-2deg); }
}
@keyframes pageRight {
    0% { right: 0; transform: rotate(8deg); }
    70% { right: 22%; transform: rotate(2deg); }
    100% { right: 22%; transform: rotate(2deg); }
}
.staple-pinch {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    font-size: 1.4rem;
    z-index: 10;
    filter: drop-shadow(0 0 4px rgba(34,197,94,0.8));
}
.meme-staple-anim.animating .staple-pinch {
    animation: pinchStaple 0.4s ease-in forwards;
    animation-delay: 0.35s;
}
@keyframes pinchStaple {
    0% { transform: translate(-50%, -50%) scale(0) rotate(0deg); }
    50% { transform: translate(-50%, -50%) scale(1.5) rotate(180deg); }
    100% { transform: translate(-50%, -50%) scale(1) rotate(360deg); }
}
.meme-staple-anim.done .staple-page-left,
.meme-staple-anim.done .staple-page-right {
    animation: pageDone 0.3s ease-out forwards;
}
.meme-staple-anim.done .staple-pinch {
    animation: stapleFlash 0.3s ease-out forwards;
}
@keyframes pageDone {
    to { opacity: 0; transform: translateY(-30px) scale(0.5); }
}
@keyframes stapleFlash {
    0% { transform: translate(-50%, -50%) scale(1); filter: drop-shadow(0 0 8px rgba(34,197,94,1)); }
    100% { transform: translate(-50%, -50%) scale(2); opacity: 0; filter: drop-shadow(0 0 16px rgba(34,197,94,1)); }
}

.china-warning {
    font-size: 0.9rem;
    color: #ffd700;
    margin-top: 6px;
    padding: 4px;
    border: 1px dashed #ffd700;
    border-radius: 3px;
    line-height: 1.4;
}
.china-result {
    font-size: 1rem;
    color: #ffd700;
    margin-top: 5px;
}
.china-stats {
    margin-top: 8px;
}
.china-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
}
.china-stat {
    text-align: center;
    background: #111827;
    border-radius: 4px;
    padding: 6px 4px;
}
.china-stat-val {
    display: block;
    font-size: 0.8rem;
    color: #fbbf24;
}
.china-stat-label {
    display: block;
    font-size: 0.6rem;
    color: #666;
}
.china-history-title {
    font-size: 0.85rem;
    color: #aaa;
    margin-top: 10px;
    margin-bottom: 4px;
    border-top: 1px solid #333;
    padding-top: 6px;
}
.china-history {
    max-height: 120px;
    overflow-y: auto;
}
.china-history-empty {
    font-size: 0.75rem;
    color: #555;
    text-align: center;
    padding: 8px;
}
.china-history-row {
    display: flex;
    gap: 8px;
    font-size: 0.7rem;
    padding: 3px 4px;
    border-bottom: 1px solid #1a1a2e;
}
.china-history-fake {
    background: #1a0a0a;
}
.china-history-qty {
    color: #888;
    min-width: 40px;
}
.china-history-real {
    color: #22c55e;
    min-width: 50px;
}
.china-history-fakecount {
    color: #ef4444;
    min-width: 60px;
}
.china-history-cost {
    color: #fbbf24;
    margin-left: auto;
}

.religion-panel {
    width: 100%;
    min-width: 260px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.religion-panel-title {
    font-size: 1rem;
    color: #a855f7;
    text-align: center;
    margin-bottom: 5px;
}

.religion-current {
    font-size: 0.9rem;
    color: var(--text-0);
    text-align: center;
    margin-bottom: 3px;
}

.religion-bonuses {
    font-size: 1rem;
    color: #22c55e;
    text-align: center;
    margin-bottom: 5px;
}

.religion-cooldown {
    font-size: 1rem;
    color: var(--accent);
    text-align: center;
    margin-bottom: 5px;
}

.religion-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.religion-btn {
    background: rgba(168, 85, 247, 0.2);
    border: 2px solid #a855f7;
    border-radius: 4px;
    padding: 8px 5px;
    font-size: 0.9rem;
    color: var(--text-0);
    cursor: pointer;
    text-align: center;
    line-height: 1.4;
}

.religion-btn:hover {
    background: rgba(168, 85, 247, 0.5);
}

.religion-btn.active {
    background: #a855f7;
    color: var(--text-0);
    border-color: #ffd700;
}

.religion-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.religion-btn .religion-emoji {
    font-size: 1.3rem;
    display: block;
    margin-bottom: 2px;
}

.religion-btn .religion-name {
    display: block;
}

.religion-btn .religion-bonus-text {
    display: block;
    font-size: 0.7rem;
    color: #22c55e;
    margin-top: 4px;
}

.forum-panel {
    background: var(--bg-1);
    border: 2px solid #00ff00;
    border-radius: 8px;
    padding: 16px;
    width: 100%;
    font-family: 'Press Start 2P', cursive;
}
.forum-header {
    font-size: 0.9rem;
    color: #00ff00;
    text-align: center;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    border-bottom: 1px solid #333;
    padding-bottom: 8px;
}
.forum-seized {
    background: #1a0000;
    border: 3px solid #ff0000;
    padding: 30px;
    text-align: center;
    animation: seizurePulse 1s infinite;
}
.forum-seized-banner {
    font-size: 1.2rem;
    color: #ff0000;
    font-weight: bold;
    margin-bottom: 10px;
}
.forum-seized-text {
    font-size: 1rem;
    color: #ff4444;
}
@keyframes seizurePulse {
    0%, 100% { border-color: #ff0000; }
    50% { border-color: #ff6666; }
}
.forum-rank-btn {
    display: block;
    width: 100%;
    padding: 10px;
    margin: 6px 0;
    background: #1a1a1a;
    border: 1px solid var(--border);
    color: #00ff00;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.9rem;
    cursor: pointer;
    text-align: left;
    transition: all 0.2s;
}
.forum-rank-btn:hover:not(:disabled) {
    background: #252525;
    border-color: #00ff00;
}
.forum-rank-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.forum-rank-btn.active {
    border-color: #00ff00;
    background: #0a2a0a;
}
.forum-rank-name {
    font-weight: bold;
}
.forum-rank-cost {
    float: right;
    color: #ffff00;
}
.forum-result {
    text-align: center;
    font-size: 1rem;
    color: #00ff00;
    margin-top: 10px;
    min-height: 20px;
    font-family: 'Press Start 2P', cursive;
}
.forum-current-rank {
    text-align: center;
    margin-bottom: 12px;
    padding: 8px;
    background: #0a0a0a;
    border: 1px solid var(--border);
}
.forum-current-rank-label {
    font-size: 0.9rem;
    color: var(--text-3);
}
.forum-current-rank-value {
    font-size: 0.9rem;
    color: #00ff00;
    font-weight: bold;
}

.roulette-game {
    background: #0a6a2e;
    border: 3px solid #ffd700;
    border-radius: 10px;
    padding: 10px;
    overflow: visible;
    min-height: fit-content;
}
.roulette-game .roulette-header {
    font-size: 0.9rem;
    color: #ffd700;
    margin-bottom: 6px;
    display: flex;
    justify-content: space-between;
}
.roulette-result {
    text-align: center;
    font-size: 1.4rem;
    min-height: 36px;
    line-height: 36px;
    border-radius: 6px;
    background: #0a0a1a;
    margin-bottom: 6px;
    border: 2px solid #333;
}
.roulette-result.red { border-color: #ff4444; color: #ff4444; }
.roulette-result.black { border-color: var(--text-0); color: var(--text-0); }
.roulette-result.green { border-color: #22c55e; color: #22c55e; }
.roulette-board {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2px;
    margin-bottom: 6px;
}
.roulette-num {
    font-size: 0.9rem;
    padding: 4px 1px;
    text-align: center;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid transparent;
    color: white;
}
.roulette-num:hover { border-color: #ffd700; }
.roulette-num.red { background: #cc0000; }
.roulette-num.black { background: #222; }
.roulette-num.green { background: #007700; }
.roulette-num.has-bet { border-color: #ffd700; box-shadow: 0 0 4px #ffd700; }
.roulette-outside {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3px;
    margin-bottom: 6px;
}
.roulette-outside-btn {
    font-size: 0.9rem;
    padding: 4px 2px;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid #555;
    color: white;
    text-align: center;
}
.roulette-outside-btn:hover { border-color: #ffd700; }
.roulette-outside-btn.red-bg { background: #cc0000; }
.roulette-outside-btn.black-bg { background: #222; }
.roulette-outside-btn.green-bg { background: #005500; }
.roulette-outside-btn.gray-bg { background: #333; }
.roulette-chips {
    display: flex;
    margin-bottom: 6px;
    justify-content: center;
}
.roulette-slider-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 2px;
}
.roulette-slider-label {
    color: #ffd700;
    font-size: 0.9rem;
}
.roulette-slider {
    width: 100%;
    max-width: 400px;
    height: 16px;
    accent-color: #ffd700;
    cursor: pointer;
}
.roulette-bets-display {
    font-size: 0.9rem;
    color: #aaa;
    margin-bottom: 4px;
    min-height: 10px;
    overflow-y: auto;
    word-break: break-word;
}
.roulette-controls {
    display: flex;
    gap: 4px;
}
.roulette-ctrl-btn {
    flex: 1;
    padding: 6px;
    font-size: 0.9rem;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.roulette-ctrl-btn.spin { background: #22c55e; color: white; }
.roulette-ctrl-btn.spin:hover { background: #16a34a; }
.roulette-ctrl-btn.clear { background: #666; color: white; }
.roulette-ctrl-btn.clear:hover { background: #888; }
.roulette-ctrl-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.slot-machine {
    border: 3px solid #ffd700;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    max-width: 450px;
    text-align: center;
}
.slot-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ffd700;
    font-size: 1rem;
    margin-bottom: 12px;
}
.slot-cost { color: #aaa; font-size: 0.9rem; }
.slot-reels {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 12px;
}
.slot-reel {
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    background: #0a0a0a;
    border: 2px solid var(--border);
    border-radius: 8px;
    transition: border-color 0.2s;
}
.slot-reel.spinning {
    border-color: #ffd700;
    animation: slotShake 0.05s infinite alternate;
}
.slot-reel.landed {
    border-color: #22c55e;
    transform: scale(1.1);
}
@keyframes slotShake {
    from { transform: translateY(-1px); }
    to { transform: translateY(1px); }
}
.slot-result {
    font-size: 1.2rem;
    min-height: 1.5em;
    margin-bottom: 8px;
}
.slot-paytable {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin-bottom: 12px;
    font-size: 1rem;
}
.slot-payline {
    display: flex;
    justify-content: space-between;
    padding: 2px 8px;
    color: #aaa;
}
.slot-payline span:last-child { color: #22c55e; }
.slot-spin-btn {
    font-size: 1rem;
    padding: 10px 24px;
    background: #ffd700;
    color: #000;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}
.slot-spin-btn:hover { background: #ffed4a; }
.slot-spin-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.poker-game .poker-header {
    font-size: 0.9rem;
    color: #ffd700;
    margin-bottom: 3px;
    display: flex;
    justify-content: space-between;
}

.poker-community {
    font-size: 1.6rem;
    min-height: 35px;
    margin-bottom: 3px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.poker-opponent-cards {
    font-size: 1.1rem;
    color: var(--text-2);
    margin-bottom: 3px;
}

.poker-player-hand {
    font-size: 1rem;
    margin-bottom: 3px;
}

.poker-controls {
    display: flex;
    gap: 3px;
    margin-bottom: 3px;
}

.poker-btn {
    padding: 8px 14px;
    font-size: 0.9rem;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    flex: 1;
}

.poker-btn.fold { background: #ff4444; color: white; }
.poker-btn.check { background: #4488ff; color: white; }
.poker-btn.bet { background: #ffaa00; color: black; }
.poker-btn.deal { background: #ffd700; color: black; }

.poker-status {
    font-size: 0.9rem;
    color: #aaa;
    margin-bottom: 8px;
}

.poker-deal {
    text-align: center;
}
    display: flex;
    justify-content: space-between;
    color: #ffd700;
    font-size: 1rem;
    margin-bottom: 10px;
}

.poker-table {
    background: #0d5c2e;
    border-radius: 50px;
    padding: 20px;
    min-height: 100px;
    margin-bottom: 10px;
    text-align: center;
    position: relative;
}

.poker-community {
    font-size: 1.5rem;
    margin-bottom: 15px;
    min-height: 30px;
}

.poker-opponent {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

.poker-hand {
    font-size: 1.2rem;
}

.poker-name {
    font-size: 0.9rem;
    color: #aaa;
}

.poker-player {
    text-align: center;
    margin-bottom: 10px;
}

.poker-player .poker-hand {
    font-size: 1.5rem;
}

.poker-controls {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 10px;
}

.poker-btn {
    padding: 8px 10px;
    font-size: 0.9rem;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.poker-btn.fold { background: #ff4444; color: white; }
.poker-btn.check { background: #4488ff; color: white; }
.poker-btn.bet { background: #ffaa00; color: black; }
.poker-btn.raise { background: #ff4444; color: white; }
.poker-btn.call { background: #22c55e; color: white; }
.poker-btn.allin { background: #ffd700; color: black; }
.poker-btn.deal { background: #ffd700; color: black; padding: 10px 20px; }

.poker-status {
    text-align: center;
    color: white;
    font-size: 0.9rem;
    margin-bottom: 10px;
    min-height: 15px;
}

.poker-deal {
    text-align: center;
}

.hat-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
    justify-content: center;
}

.hat-btn {
    padding: 8px 12px;
    font-size: 1rem;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.hat-btn.buy {
    background: #22c55e;
    color: white;
}

.hat-btn.buy:hover {
    background: #16a34a;
}

.hat-btn.owned {
    background: #3b82f6;
    color: white;
}

.hat-btn.owned:hover {
    background: #2563eb;
}

.hat-btn.equipped {
    background: #ffd700;
    color: black;
}

.hat-btn:disabled {
    background: #666;
    cursor: not-allowed;
}

.leash-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
    justify-content: center;
}

.leash-btn {
    padding: 8px 12px;
    font-size: 1rem;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.leash-btn.buy {
    background: #22c55e;
    color: white;
}

.leash-btn.buy:hover {
    background: #16a34a;
}

.leash-btn.owned {
    background: #3b82f6;
    color: white;
}

.leash-btn.owned:hover {
    background: #2563eb;
}

.leash-btn.equipped {
    background: #ffd700;
    color: black;
}

.leash-btn:disabled {
    background: #666;
    cursor: not-allowed;
}

.ad-banner {
    width: 90%;
    max-width: 700px;
    border: 3px solid;
    border-radius: 12px;
    padding: 20px 24px;
    text-align: center;
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 50;
    overflow: hidden;
    animation: adPulse 3s ease-in-out infinite;
}

@keyframes adPulse {
    0%, 100% { box-shadow: 0 0 10px rgba(255,215,0,0.3); }
    50% { box-shadow: 0 0 25px rgba(255,215,0,0.6); }
}

.ad-banner::before {
    content: 'SPONSORED';
    position: absolute;
    top: 4px;
    right: 6px;
    font-size: 0.9rem;
    color: rgba(255,255,255,0.4);
    letter-spacing: 1px;
}

.ad-slogan {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.5);
    margin-top: 6px;
}

.ad-product-name {
    font-size: 1rem;
    color: #ffd700;
    margin-bottom: 4px;
    text-shadow: 2px 2px 0 rgba(0,0,0,0.5);
}

.ad-tagline {
    font-size: 1.1rem;
    color: var(--text-0);
    margin-bottom: 8px;
    line-height: 1.6;
}

.ad-price {
    font-size: 1rem;
    color: #22c55e;
    margin-bottom: 8px;
}

.ad-cta {
    font-size: 0.9rem;
    padding: 8px 20px;
    border: 2px solid #ffd700;
    border-radius: 5px;
    cursor: pointer;
    color: #ffd700;
    background: rgba(0,0,0,0.4);
    transition: all 0.2s;
}

.ad-cta:hover {
    background: #ffd700;
    color: #000;
}

.ad-rating {
    font-size: 0.9rem;
    margin-bottom: 4px;
}

.bomb-threat-game {
    background: var(--bg-2);
    border: 3px solid #ff4444;
    border-radius: 10px;
    padding: 8px;
    min-width: 240px;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bomb-threat-header {
    font-size: 0.9rem;
    color: #ff4444;
    margin-bottom: 2px;
    display: flex;
    justify-content: space-between;
}
.bomb-threat-status {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}
.bomb-threat-dialog {
    background: #0d0d1a;
    border-radius: 4px;
    padding: 6px;
    min-height: 40px;
    font-size: 0.9rem;
    color: var(--text-0);
}
.bomb-threat-character {
    color: #ff4444;
    font-weight: bold;
    margin-bottom: 4px;
}
.bomb-threat-line {
    color: #aaa;
    margin-bottom: 6px;
}
.bomb-threat-options {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bomb-threat-result {
    text-align: center;
    font-size: 0.9rem;
    margin-top: 6px;
    padding: 6px;
    border-radius: 4px;
}
.bomb-threat-result.success {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}
.bomb-threat-result.fail {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}
.bomb-threat-status {
    font-size: 1rem;
    color: #aaa;
    margin-bottom: 6px;
    min-height: 20px;
}
.bomb-threat-dialog {
    background: #0a0a0a;
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 8px;
    font-size: 0.9rem;
    color: var(--text-0);
    min-height: 40px;
}
.bomb-threat-character {
    font-size: 1rem;
    margin-bottom: 4px;
}
.bomb-threat-line {
    color: #22c55e;
    font-size: 0.9rem;
    margin-bottom: 4px;
}
.bomb-threat-options {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bomb-option {
    font-size: 0.9rem;
    padding: 6px 8px;
    background: var(--bg-2);
    border: 1px solid #555;
    border-radius: 4px;
    color: var(--text-0);
    cursor: pointer;
    text-align: left;
    transition: background 0.2s;
}
.bomb-option:hover {
    background: #2a2a4e;
}
.bomb-option.correct {
    border-color: #22c55e;
}
.bomb-option.wrong {
    border-color: #ff4444;
}
.bomb-option:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.bomb-threat-businesses {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
#sabotageTypes {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    margin-bottom: 10px;
    padding: 8px;
    background: #0d0d1a;
    border-radius: 6px;
    border: 1px solid var(--border);
}
#sabotageTypes .sabotage-type {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--bg-2);
    border: 2px solid #333;
    border-radius: 6px;
    padding: 8px 4px;
    color: var(--text-2);
    font-size: 0.9rem;
    cursor: pointer;
    min-height: 50px;
    transition: all 0.2s;
}
#sabotageTypes .sabotage-type:hover {
    border-color: #ff4444;
    color: var(--text-0);
}
#sabotageTypes .sabotage-type.selected {
    border-color: #ff4444;
    color: #ff4444;
    background: #2a0a0a;
    box-shadow: 0 0 10px rgba(255, 68, 68, 0.3);
}
#bombBusinesses {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}
.bomb-business {
    display: inline-block;
    background: #222;
    border: 1px solid #555;
    border-radius: 3px;
    padding: 3px 6px;
    color: var(--text-0);
    font-size: 0.9rem;
    cursor: pointer;
    margin: 2px;
}
.bomb-business:hover {
    border-color: #ff4444;
}
.bomb-business.shut-down {
    border-color: var(--text-3);
    color: var(--text-3);
    cursor: not-allowed;
}
.sabotage-type {
    display: inline-block;
    background: #222;
    border: 1px solid #555;
    border-radius: 3px;
    padding: 4px 8px;
    color: var(--text-0);
    font-size: 0.9rem;
    cursor: pointer;
    margin: 2px;
}
.sabotage-type:hover {
    border-color: #ff4444;
}
.sabotage-type.selected {
    border-color: #ff4444;
    color: #ff4444;
    background: #2a0a0a;
}
.bomb-business.active {
    border-color: #ff4444;
    color: #ff4444;
}
.bomb-threat-result {
    text-align: center;
    font-size: 1.1rem;
    margin-top: 6px;
    padding: 6px;
    border-radius: 4px;
}
.bomb-threat-result.success {
    color: #22c55e;
    border: 1px solid #22c55e;
}
.bomb-threat-result.fail {
    color: #ff4444;
    border: 1px solid #ff4444;
}

.sabotage-choice-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}
.sabotage-choice-content {
    background: var(--bg-2);
    border: 2px solid #e94560;
    border-radius: 8px;
    padding: 20px;
    max-width: 420px;
    width: 90%;
}
.sabotage-choice-title {
    font-size: 1rem;
    color: var(--accent);
    text-align: center;
    margin-bottom: 16px;
    letter-spacing: 1px;
}
.sabotage-choice-methods {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sabotage-choice-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    border-radius: 6px;
    padding: 12px 16px;
    cursor: pointer;
    color: #e0e0e0;
    text-align: left;
    transition: border-color 0.15s;
}
.sabotage-choice-btn:hover { border-color: var(--accent); }
.sabotage-choice-emoji { font-size: 1.5rem; }
.sabotage-choice-name { font-size: 0.85rem; font-weight: 700; flex: 1; }
.sabotage-choice-desc { font-size: 0.7rem; color: #888; flex: 2; }
.sabotage-choice-risk { font-size: 0.7rem; font-weight: 700; white-space: nowrap; }
.sabotage-choice-cancel {
    display: block;
    margin: 12px auto 0;
    padding: 8px 24px;
    background: #2a2a4a;
    border: none;
    border-radius: 4px;
    color: #888;
    cursor: pointer;
    font-size: 0.8rem;
}
.sabotage-choice-cancel:hover { color: #ccc; }

.bomb-threat-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.bomb-threat-modal-content {
    background: var(--bg-2);
    border: 3px solid #e94560;
    border-radius: 12px;
    padding: 24px;
    min-width: 400px;
    max-width: 500px;
    position: relative;
}
.bomb-threat-close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 28px;
    color: var(--accent);
    cursor: pointer;
}
.bomb-threat-close:hover {
    color: #ff6b6b;
}

.driveby-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.driveby-modal-content {
    background: #0a0a0a;
    border: 3px solid #e94560;
    border-radius: 12px;
    padding: 16px;
    position: relative;
    text-align: center;
}
.driveby-header {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.driveby-timer-bar {
    width: 200px;
    height: 12px;
    background: var(--bg-2);
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--border);
}
.driveby-timer-fill {
    height: 100%;
    background: var(--accent);
    border-radius: 6px;
    width: 100%;
    transition: width 0.1s linear;
}
.driveby-info {
    font-size: 0.9rem;
    color: var(--text-2);
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}
#drivebyCanvas {
    display: block;
    border-radius: 6px;
    cursor: crosshair;
    background: var(--bg-2);
}
.driveby-instructions {
    font-size: 0.9rem;
    color: #555;
    margin-top: 6px;
}
.driveby-result {
    font-size: 0.9rem;
    margin-top: 8px;
    min-height: 16px;
    color: #4ade80;
}

.ddos-booter {
    background: #0a0a0a;
    border: 1px solid var(--border);
    border-radius: 6px;
    margin-top: 8px;
    overflow: hidden;
}

.ddos-header {
    background: var(--bg-1);
    padding: 8px 12px;
    border-bottom: 1px solid #e94560;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--accent);
    font-size: 0.9rem;
    text-shadow: 0 0 10px rgba(233, 69, 96, 0.5);
}

.ddos-stats {
    padding: 6px 12px;
    border-bottom: 1px solid #222;
    font-size: 0.9rem;
    display: flex;
    gap: 8px;
    align-items: center;
}

.ddos-panel {
    background: var(--bg-2);
    border: 3px solid #ef4444;
    border-radius: 10px;
    padding: 14px;
    width: 100%;
    min-width: 260px;
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ddos-input-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ddos-launch-btn {
    font-size: 0.9rem;
    padding: 8px;
    background: var(--danger);
    color: white;
    border: 2px solid #ef4444;
    border-radius: 4px;
    cursor: pointer;
    text-shadow: 0 0 10px rgba(239, 68, 68, 0.8);
    transition: all 0.2s;
}

.ddos-launch-btn:hover {
    background: #dc2626;
    box-shadow: 0 0 15px rgba(239, 68, 68, 0.5);
}

.ddos-launch-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.ddos-log {
    padding: 8px 12px;
    flex: 1;
    min-height: 100px;
    overflow-y: auto;
    background: #050505;
    border-top: 1px solid #222;
    font-size: 0.9rem;
    line-height: 1.6;
}

.ddos-log::-webkit-scrollbar {
    width: 3px;
}

.ddos-log::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 2px;
}

.botnet-stats {
    padding: 6px 12px;
    border-bottom: 1px solid #222;
    font-size: 0.9rem;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.botnet-power-bar {
    height: 6px;
    background: #1a1a1a;
    margin: 0 12px 8px;
    border-radius: 3px;
    overflow: hidden;
}

.botnet-power-fill {
    height: 100%;
    background: #22c55e;
    transition: width 0.3s, background 0.3s;
    box-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
}

.botnet-section-title {
    padding: 8px 12px 4px;
    font-size: 1rem;
    color: var(--accent);
    background: linear-gradient(90deg, rgba(233, 69, 96, 0.1), transparent);
    border-bottom: 1px solid #222;
}

.botnet-methods {
    padding: 8px;
    min-height: 80px;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid var(--border);
    background: #0f0f1a;
}

.botnet-targets {
    padding: 8px;
    flex: 1;
    min-height: 100px;
    overflow-y: auto;
    border: 1px solid var(--border);
    background: #0f0f1a;
}

.botnet-methods::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 20px;
    background: linear-gradient(transparent, #0f0f1a);
    pointer-events: none;
}

.botnet-method {
    background: #0f0f1a;
    border: 1px solid #222;
    border-radius: 4px;
    padding: 8px;
    margin-bottom: 6px;
}

.botnet-method.on-cooldown {
    opacity: 0.5;
    background: #0a0a0f;
    border-color: #333;
}

.botnet-method-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.botnet-method-name {
    color: #22c55e;
    font-size: 0.9rem;
}

.botnet-method-cost {
    color: #f59e0b;
    font-size: 0.9rem;
}

.botnet-method-desc {
    color: var(--text-3);
    font-size: 0.9rem;
    margin-bottom: 4px;
}

.botnet-method-stats {
    display: flex;
    gap: 10px;
    color: var(--text-2);
    font-size: 0.9rem;
    margin-bottom: 6px;
}

.botnet-infect-btn {
    width: 100%;
    padding: 6px;
    background: var(--success);
    color: white;
    border: 1px solid #22c55e;
    border-radius: 3px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}

.botnet-infect-btn:hover:not(:disabled) {
    background: var(--success);
    box-shadow: 0 0 10px rgba(34, 197, 94, 0.5);
}

.botnet-infect-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.botnet-targets {
    padding: 8px;
    flex: 1;
    min-height: 100px;
    overflow-y: auto;
    border: 1px solid var(--border);
    background: var(--bg-1);
    position: relative;
}

.botnet-targets::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 20px;
    background: linear-gradient(transparent, #0f0f1a);
    pointer-events: none;
}

.botnet-target {
    background: #0f0f1a;
    border: 1px solid #222;
    border-radius: 4px;
    padding: 8px;
    margin-bottom: 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.botnet-target.target-down {
    opacity: 0.6;
    border-color: #22c55e;
}

.botnet-target-info {
    display: flex;
    gap: 8px;
    align-items: center;
    flex: 1;
    min-width: 0;
}

.botnet-target-emoji {
    font-size: 1.2rem;
}

.botnet-target-details {
    min-width: 0;
    flex: 1;
}

.botnet-target-url {
    color: #22c55e;
    font-size: 0.9rem;
    word-break: break-all;
}

.botnet-target-meta {
    color: var(--text-2);
    font-size: 0.9rem;
    word-wrap: break-word;
    word-break: break-all;
}

.botnet-target-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.botnet-target-status {
    font-size: 0.9rem;
}

.botnet-attack-btn {
    padding: 4px 8px;
    background: var(--danger);
    color: white;
    border: 1px solid #ef4444;
    border-radius: 3px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}

.botnet-attack-btn:hover:not(:disabled) {
    background: #dc2626;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.5);
}

.botnet-attack-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.botnet-hosts {
    max-height: 200px;
    overflow-y: auto;
    padding: 4px 8px;
    background: #050505;
    border: 1px solid #222;
    border-radius: 3px;
    margin: 0 8px;
}

.botnet-host-header {
    display: flex;
    gap: 4px;
    padding: 4px 0;
    border-bottom: 1px solid #333;
    margin-bottom: 2px;
    font-size: 0.9rem;
    color: #555;
}

.botnet-host-header span {
    flex-shrink: 0;
}

.bh-ip { width: 90px; }
.bh-host { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bh-os { width: 20px; text-align: center; }
.bh-bot { width: 65px; }
.bh-gbps { width: 35px; text-align: right; }
.bh-ttl { width: 30px; text-align: right; }

.botnet-host-row {
    display: flex;
    gap: 4px;
    padding: 3px 0;
    border-bottom: 1px solid #0a0a0a;
    font-size: 0.9rem;
    color: #aaa;
    align-items: center;
}

.botnet-host-row .bh-ip { color: #22c55e; }
.botnet-host-row .bh-host { color: var(--text-2); }
.botnet-host-row .bh-bot { color: #f59e0b; font-size: 0.9rem; }
.botnet-host-row .bh-gbps { color: #ef4444; text-align: right; }

.botnet-host-truncated {
    justify-content: center;
    color: #555 !important;
    font-style: italic;
}

.bh-more {
    font-size: 0.9rem;
    color: #555;
}

.robbery-panel {
    width: 100%;
}

.robbery-gear {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 10px 0;
}

.robbery-gear-btn {
    padding: 8px 10px;
    font-size: 0.9rem;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    background: #22c55e;
    color: white;
    transition: all 0.15s;
}

.robbery-gear-btn:hover:not(:disabled) {
    background: #16a34a;
}

.robbery-gear-btn:disabled {
    background: #444;
    cursor: not-allowed;
    color: var(--text-2);
}

.robbery-gear-btn.owned {
    background: #3b82f6;
}

.robbery-wanted {
    text-align: center;
    font-size: 1.4rem;
    margin: 8px 0;
    letter-spacing: 4px;
    min-height: 30px;
}

.robbery-hideout-timer {
    text-align: center;
    font-size: 1rem;
    color: #f59e0b;
    min-height: 16px;
    margin-bottom: 6px;
}

.robbery-rob-btn {
    width: 100%;
    padding: 10px;
    font-size: 0.9rem;
    background: var(--danger);
    color: white;
    border: 2px solid #ef4444;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.robbery-rob-btn:hover:not(:disabled) {
    background: #dc2626;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.5);
}

.robbery-rob-btn:disabled {
    background: #333;
    border-color: #555;
    color: var(--text-3);
    cursor: not-allowed;
    box-shadow: none;
}

.robbery-result {
    margin-top: 8px;
    font-size: 0.9rem;
    color: #ffd700;
    text-align: center;
    min-height: 16px;
    word-wrap: break-word;
}

.robbery-target-popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.85);
    z-index: 10000;
    justify-content: center;
    align-items: center;
}

.robbery-target-popup.open {
    display: flex;
}

.robbery-target-popup-inner {
    background: var(--bg-2);
    border: 3px solid #e94560;
    border-radius: 12px;
    width: 540px;
    max-width: 90vw;
    max-height: 70vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.robbery-target-popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 2px solid #e94560;
    font-size: 0.9rem;
    color: var(--accent);
}

.robbery-target-close {
    background: none;
    border: none;
    color: var(--accent);
    font-size: 1.5rem;
    cursor: pointer;
    line-height: 1;
}

.robbery-target-close:hover {
    color: #ff6666;
}

.robbery-target-search {
    margin: 10px 14px;
    padding: 8px 12px;
    font-size: 0.9rem;
    background: #0a0a1a;
    color: var(--text-0);
    border: 2px solid #333;
    border-radius: 4px;
    outline: none;
}

.robbery-target-search:focus {
    border-color: var(--accent);
}

.robbery-targets-list {
    overflow-y: auto;
    padding: 8px 14px 14px;
    flex: 1;
}

.robbery-target-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    margin-bottom: 6px;
    background: var(--bg-1);
    border-radius: 6px;
    border: 1px solid #0f3460;
}

.robbery-target-item:hover {
    border-color: var(--accent);
}

.robbery-target-name {
    font-size: 1rem;
    color: var(--text-0);
    flex: 1;
    min-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.robbery-target-wealth {
    font-size: 0.9rem;
    color: #22c55e;
    margin: 0 10px;
    white-space: nowrap;
}

.robbery-target-rob-btn {
    padding: 6px 12px;
    font-size: 0.9rem;
    background: #ef4444;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.15s;
}

.robbery-target-rob-btn:hover {
    background: #dc2626;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.4);
}

.robbery-no-targets {
    text-align: center;
    color: var(--text-3);
    font-size: 0.9rem;
    padding: 20px;
}

.act-dashboard {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 6px;
}
.act-resource-row {
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(22, 27, 34, 0.9);
    border: 1px solid #30363d;
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
    transition: border-color 0.15s;
}
.act-resource-row:hover {
    border-color: #555;
}
.act-res-label {
    font-size: 0.55rem;
    color: var(--text-2);
    width: 38px;
    flex-shrink: 0;
}
.act-sparkline {
    flex: 1;
    height: 22px;
    min-width: 0;
}
.act-res-value {
    font-size: 0.55rem;
    color: #ccc;
    width: 70px;
    text-align: right;
    flex-shrink: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.act-res-delta {
    font-size: 0.5rem;
    width: 60px;
    text-align: right;
    flex-shrink: 0;
    white-space: nowrap;
}
.act-res-delta.delta-positive { color: #22c55e; }
.act-res-delta.delta-negative { color: #ef4444; }

.act-tabs {
    display: flex;
    gap: 3px;
    margin-bottom: 4px;
}
.act-tab {
    font-size: 0.55rem;
    background: var(--bg-2);
    color: var(--text-2);
    border: 1px solid #30363d;
    border-radius: 4px;
    padding: 3px 7px;
    cursor: pointer;
    transition: all 0.15s;
}
.act-tab:hover {
    background: var(--bg-1);
    color: #ccc;
    border-color: #555;
}
.act-tab.active {
    background: #0f3460;
    color: var(--accent);
    border-color: var(--accent);
}

.act-log {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-height: 80px;
    max-height: 400px;
    overflow-y: auto;
    background: #161b22;
    border-radius: 6px;
    border: 1px solid #30363d;
    padding: 4px;
}
.act-log::-webkit-scrollbar { width: 5px; }
.act-log::-webkit-scrollbar-track { background: #21262d; border-radius: 3px; }
.act-log::-webkit-scrollbar-thumb { background: #484f58; border-radius: 3px; }

.act-log-item {
    display: grid;
    grid-template-columns: 20px 52px 65px 1fr;
    align-items: center;
    gap: 4px;
    padding: 3px 6px;
    background: rgba(26, 26, 46, 0.8);
    border-radius: 3px;
    border-left: 2px solid #555;
    font-size: 0.55rem;
    line-height: 1.4;
    color: #ccc;
    transition: opacity 0.2s, transform 0.2s;
}
.act-log-item.act-entering {
    opacity: 0;
    transform: translateX(15px);
}
.act-log-item.act-exiting {
    opacity: 0;
    transform: translateX(15px);
}
.act-log-icon {
    font-size: 0.75rem;
    line-height: 1;
    cursor: pointer;
}
.act-log-time {
    color: var(--text-3);
    font-size: 0.45rem;
}
.act-log-delta {
    font-size: 0.45rem;
    text-align: right;
    padding: 1px 3px;
    border-radius: 2px;
    white-space: nowrap;
}
.act-log-delta.delta-positive {
    color: #22c55e;
    background: rgba(34, 197, 94, 0.12);
}
.act-log-delta.delta-negative {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.12);
}
.act-log-msg {
    font-size: 0.5rem;
    color: #aaa;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.act-log-item.cat-income { border-left-color: #22c55e; }
.act-log-item.cat-expense { border-left-color: #f59e0b; }
.act-log-item.cat-gambling { border-left-color: #a855f7; }
.act-log-item.cat-crime { border-left-color: #ef4444; }
.act-log-item.cat-sabotage { border-left-color: #f97316; }
.act-log-item.cat-trade { border-left-color: #3b82f6; }
.act-log-item.cat-info { border-left-color: #555; }

.act-log-item.type-auto-sell { border-left-color: #22c55e; background: rgba(34, 197, 94, 0.08); }
.act-log-item.type-dps { border-left-color: #3b82f6; background: rgba(59, 130, 246, 0.06); }
.act-log-item.type-gather { border-left-color: #22d3ee; background: rgba(34, 211, 238, 0.06); }

.act-view-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 6px;
    border-bottom: 1px solid #30363d;
}
.act-view-tab {
    font-size: 0.6rem;
    background: transparent;
    color: var(--text-3);
    border: none;
    border-bottom: 2px solid transparent;
    padding: 4px 12px 4px 0;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}
.act-view-tab:hover { color: #aaa; }
.act-view-tab.active {
    color: var(--accent);
    border-bottom-color: var(--accent);
}

.act-chart-view { display: flex; flex-direction: column; gap: 6px; }
.act-chart-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4px;
}
.act-chart-res-btns, .act-chart-range-btns {
    display: flex;
    gap: 2px;
}
.act-chart-res, .act-chart-range {
    font-size: 0.5rem;
    background: var(--bg-2);
    color: var(--text-3);
    border: 1px solid #30363d;
    border-radius: 3px;
    padding: 3px 5px;
    cursor: pointer;
    transition: all 0.12s;
}
.act-chart-res:hover, .act-chart-range:hover { color: #aaa; border-color: #555; }
.act-chart-res.active { color: var(--accent); border-color: var(--accent); background: rgba(233, 69, 96, 0.1); }
.act-chart-range.active { color: var(--accent); border-color: var(--accent); background: rgba(233, 69, 96, 0.1); }

.act-chart-header {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 2px 0;
}
.act-chart-price {
    font-size: 0.9rem;
    color: var(--text-0);
}
.act-chart-change {
    font-size: 0.6rem;
}
.act-chart-change.positive { color: #22c55e; }
.act-chart-change.negative { color: #ef4444; }

.act-chart-wrap {
    background: #0d1117;
    border: 1px solid #21262d;
    border-radius: 6px;
    overflow: hidden;
    flex: 1;
    min-height: 260px;
}
.act-chart-wrap canvas {
    width: 100%;
    height: 260px;
    display: block;
}

.act-chart-timebar {
    font-size: 0.45rem;
    color: #555;
    text-align: center;
    padding: 2px 0;
}

.wm-window-content > .event-feed,
.wm-window-content > .act-log {
    height: 100%;
    box-sizing: border-box;
    margin: 0;
}

.event-feed {
    display: none;
}

.police-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.5s ease;
    background: linear-gradient(
        180deg,
        rgba(255, 0, 0, 0.15) 0%,
        rgba(0, 0, 255, 0.15) 25%,
        rgba(255, 0, 0, 0.15) 50%,
        rgba(0, 0, 255, 0.15) 75%,
        rgba(255, 0, 0, 0.15) 100%
    );
    background-size: 100% 400%;
    animation: none;
}

.police-overlay.active {
    opacity: 0.15;
    animation: policeFlash 1.5s linear infinite;
}

.police-overlay.hideout {
    animation: policeSlowPulse 3s ease-in-out infinite;
}

.police-overlay.flash {
    animation: policeFlashFast 0.3s linear 10 !important;
    opacity: 0.4 !important;
}

@keyframes policeFlash {
    0% { background-position: 0% 0%; }
    50% { background-position: 0% 100%; }
    100% { background-position: 0% 0%; }
}

@keyframes policeSlowPulse {
    0%, 100% { opacity: 0.08; }
    50% { opacity: 0.2; }
}

@keyframes policeFlashFast {
    0% { background-position: 0% 0%; opacity: 0.5; }
    50% { background-position: 0% 100%; opacity: 0.1; }
    100% { background-position: 0% 0%; opacity: 0.5; }
}

.jail-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    pointer-events: all;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.75);
    animation: jailFadeIn 0.3s ease-out;
}

@keyframes jailFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.jail-bars {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-evenly;
    pointer-events: none;
}

.jail-bar {
    width: 12px;
    height: 100%;
    background: linear-gradient(180deg, #555 0%, #888 20%, #444 50%, #888 80%, #555 100%);
    border-radius: 4px;
    box-shadow: 2px 0 8px rgba(0,0,0,0.6), inset 0 0 4px rgba(255,255,255,0.1);
}

.jail-content {
    position: relative;
    z-index: 1;
    text-align: center;
    background: rgba(20, 20, 40, 0.95);
    border: 3px solid #e94560;
    border-radius: 16px;
    padding: 40px 60px;
    box-shadow: 0 0 60px rgba(233, 69, 96, 0.4);
}

.jail-icon {
    font-size: 4rem;
    margin-bottom: 10px;
    animation: jailBounce 1s ease-in-out infinite;
}

@keyframes jailBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.jail-title {
    font-size: 2.5rem;
    color: var(--accent);
    text-shadow: 0 0 20px rgba(233, 69, 96, 0.6);
    margin-bottom: 8px;
}

.jail-subtitle {
    font-size: 0.9rem;
    color: #fbbf24;
    margin-bottom: 20px;
}

.jail-timer {
    font-size: 2rem;
    color: var(--text-0);
    margin-bottom: 12px;
    letter-spacing: 4px;
}

.jail-reason {
    font-size: 0.9rem;
    color: #fbbf24;
    margin-bottom: 10px;
    max-width: 350px;
    text-align: center;
    line-height: 1.6;
    min-height: 1em;
}

.jail-hint {
    font-size: 0.9rem;
    color: var(--text-2);
}

.game-input {
    font-size: 0.9rem;
    padding: 6px 10px;
    background: #0a0a1a;
    color: var(--text-0);
    border: 2px solid #333;
    border-radius: 4px;
    width: 80px;
    outline: none;
}
.game-input:focus {
    border-color: #ffd700;
}
.game-result {
    font-size: 0.9rem;
    min-height: 1em;
    margin-top: 6px;
    text-align: center;
}

.crash-panel {
    border: 3px solid #e94560;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.crash-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--accent);
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.crash-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.crash-display {
    font-size: 3rem;
    color: #22c55e;
    font-weight: bold;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    border: 2px solid #22c55e;
    border-radius: 8px;
    background: #0a0a1a;
    transition: color 0.2s, border-color 0.2s;
}
.crash-display.crashed {
    color: #ef4444;
    border-color: #ef4444;
}
.crash-controls {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.crash-start-btn, .crash-cashout-btn {
    font-size: 0.9rem;
    padding: 8px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.crash-start-btn {
    background: #22c55e;
    color: #000;
}
.crash-start-btn:hover { background: #16a34a; }
.crash-cashout-btn {
    background: #ffd700;
    color: #000;
}
.crash-cashout-btn:hover { background: #ffed4a; }
.crash-start-btn:disabled, .crash-cashout-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.coin-flip-panel {
    border: 3px solid #f59e0b;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.coin-flip-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #f59e0b;
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.coin-flip-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.coin-flip-display {
    display: flex;
    justify-content: center;
    margin-bottom: 12px;
}
.coin {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: bold;
    color: #000;
    border: 3px solid #ffd700;
    transition: transform 0.3s;
}
.coin.flip-anim {
    animation: coinSpin 0.1s linear infinite;
}
@keyframes coinSpin {
    0% { transform: rotateY(0deg); }
    100% { transform: rotateY(360deg); }
}
.coin.heads { background: var(--gold); }
.coin.tails { background: linear-gradient(135deg, #c0c0c0, #808080); border-color: #c0c0c0; }
.coin-flip-controls {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.coin-flip-btn {
    font-size: 0.9rem;
    padding: 8px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    color: #000;
}
.coin-flip-btn.heads { background: #ffd700; }
.coin-flip-btn.heads:hover { background: #ffed4a; }
.coin-flip-btn.tails { background: #c0c0c0; }
.coin-flip-btn.tails:hover { background: #e0e0e0; }
.coin-flip-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.dog-race-panel {
    border: 3px solid #8b5cf6;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.dog-race-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #8b5cf6;
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.dog-race-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.dog-race-track {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 12px;
    background: #0a1a0a;
    border-radius: 8px;
    padding: 8px;
    border: 1px solid var(--border);
}
.dog-race-lane {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    border: 2px solid transparent;
    transition: border-color 0.2s, background 0.2s;
}
.dog-race-lane:hover {
    background: rgba(139, 92, 246, 0.1);
}
.dog-race-lane.selected {
    border-color: #8b5cf6;
    background: rgba(139, 92, 246, 0.15);
}
.dog-race-lane-name {
    font-size: 0.9rem;
    width: 70px;
    text-align: left;
}
.dog-race-lane-track {
    flex: 1;
    height: 16px;
    background: var(--bg-2);
    border-radius: 8px;
    position: relative;
    overflow: hidden;
}
.dog-race-lane-dog {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 0.9rem;
    transition: left 2s ease-in-out;
}
.dog-race-lane-odds {
    font-size: 0.9rem;
    color: #22c55e;
    width: 35px;
    text-align: right;
}
.dog-race-controls {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.dog-race-start-btn {
    font-size: 0.9rem;
    padding: 8px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: #8b5cf6;
    color: var(--text-0);
}
.dog-race-start-btn:hover { background: #7c3aed; }
.dog-race-start-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.mines-panel {
    border: 3px solid #ef4444;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.mines-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ef4444;
    font-size: 0.9rem;
    margin-bottom: 8px;
}
.mines-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.mines-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.mines-mult {
    font-size: 1.2rem;
    color: #22c55e;
    font-weight: bold;
}
.mines-cashout-btn {
    font-size: 0.9rem;
    padding: 6px 12px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: #ffd700;
    color: #000;
}
.mines-cashout-btn:hover { background: #ffed4a; }
.mines-cashout-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.mines-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    margin-bottom: 10px;
}
.mines-tile {
    aspect-ratio: 1;
    background: var(--bg-1);
    border: 2px solid #0f3460;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    transition: all 0.15s;
}
.mines-tile:hover:not(.revealed) {
    border-color: #3b82f6;
    background: #1a2a4e;
}
.mines-tile.revealed.safe {
    background: #0a2a1a;
    border-color: #22c55e;
    cursor: default;
}
.mines-tile.revealed.mine {
    background: #2a0a0a;
    border-color: #ef4444;
    cursor: default;
    animation: mineExplode 0.3s ease;
}
@keyframes mineExplode {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}
.mines-controls {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.mines-count-input {
    width: 60px !important;
}
.mines-start-btn {
    font-size: 0.9rem;
    padding: 8px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: #ef4444;
    color: var(--text-0);
}
.mines-start-btn:hover { background: #dc2626; }
.mines-start-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.lottery-panel {
    border: 3px solid #ffd700;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.lottery-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ffd700;
    font-size: 0.9rem;
    margin-bottom: 8px;
}
.lottery-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.lottery-prizes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
    margin-bottom: 10px;
}
.lottery-prize {
    font-size: 0.9rem;
    color: #aaa;
    padding: 2px 4px;
}
.lottery-controls {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.lottery-buy-btn {
    font-size: 0.9rem;
    padding: 8px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: #ffd700;
    color: #000;
}
.lottery-buy-btn:hover { background: #ffed4a; }
.lottery-buy-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.lottery-quick-buy {
    display: flex;
    gap: 4px;
    margin-bottom: 6px;
}
.lottery-quick-btn {
    flex: 1;
    padding: 4px;
    background: #1a1a2e;
    border: 1px solid #333;
    color: #aaa;
    border-radius: 3px;
    cursor: pointer;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.7rem;
}
.lottery-quick-btn:hover {
    background: #0f3460;
    border-color: #ffd700;
    color: #ffd700;
}
.lottery-stats {
    margin: 6px 0;
}
.lottery-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
}
.lottery-stat {
    text-align: center;
    background: #111827;
    border-radius: 4px;
    padding: 6px 4px;
}
.lottery-stat-val {
    display: block;
    font-size: 0.8rem;
    color: #fbbf24;
}
.lottery-stat-label {
    display: block;
    font-size: 0.6rem;
    color: #666;
}
.lottery-results {
    flex: 1;
    min-height: 60px;
    overflow-y: auto;
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
}
.lottery-result-item {
    font-size: 0.75rem;
    padding: 2px 4px;
    animation: lottery-reveal 0.3s ease-out both;
}
@keyframes lottery-reveal {
    from { opacity: 0; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1); }
}
.lottery-result-item.jackpot { color: #ffd700; font-weight: bold; font-size: 0.85rem; }
.lottery-result-item.big { color: #22c55e; }
.lottery-result-item.medium { color: #3b82f6; }
.lottery-result-item.small { color: #aaa; }
.lottery-result-item.nothing { color: #555; }
.lottery-result-item.won { color: #22c55e; }
.lottery-result-item.lost { color: var(--text-3); }
.lottery-summary-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}
.lottery-tier {
    padding: 3px 6px;
    border-radius: 3px;
    font-size: 0.7rem;
}
.lottery-tier.jackpot { background: #422006; color: #ffd700; border: 1px solid #ffd700; }
.lottery-tier.big { background: #052e16; color: #22c55e; }
.lottery-tier.medium { background: #0c1929; color: #3b82f6; }
.lottery-tier.small { background: #1a1a2e; color: #aaa; }
.lottery-tier.nothing { color: #555; }
.lottery-result-total {
    font-size: 0.9rem;
    margin-top: 4px;
}

.altar-panel {
    border: 3px solid #ff6600;
    border-radius: 12px;
    padding: 16px;
    background: var(--bg-1);
    margin: 10px auto;
    width: 100%;
    text-align: center;
}
.altar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ff6600;
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.altar-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}
.altar-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}
.altar-reward {
    background: var(--bg-1);
    border: 2px solid #0f3460;
    border-radius: 6px;
    padding: 8px;
    cursor: pointer;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    gap: 8px;
}
.altar-reward:hover {
    border-color: #ff6600;
    background: #1a2a3e;
}
.altar-reward-locked {
    opacity: 0.5;
}
.altar-reward-title {
    border-color: #fbbf24;
    background: linear-gradient(135deg, var(--bg-1), #1a1a0e);
}
.altar-reward-title:hover {
    border-color: #fbbf24;
    background: #2a2a1e;
}
.altar-reward-type {
    font-size: 1.2rem;
}
.altar-reward-info {
    flex: 1;
}
.altar-reward-name {
    font-size: 0.75rem;
    color: var(--text-0);
    margin-bottom: 2px;
}
.altar-reward-desc {
    font-size: 0.65rem;
    color: #888;
}
.altar-reward-cost {
    font-size: 0.8rem;
    color: #ff6600;
    white-space: nowrap;
}
.altar-buff-active {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: linear-gradient(90deg, #0a2a0a, #1a3a1a);
    border: 1px solid #22c55e;
    border-radius: 6px;
    margin-bottom: 8px;
}
.altar-buff-icon {
    font-size: 1rem;
}
.altar-buff-label {
    font-size: 0.8rem;
    color: #22c55e;
    flex: 1;
}
.altar-buff-timer {
    font-size: 0.9rem;
    color: #fbbf24;
    font-weight: bold;
}
.altar-title-display {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: linear-gradient(90deg, #1a1a0e, #2a2a1e);
    border: 1px solid #fbbf24;
    border-radius: 6px;
    margin-bottom: 8px;
}
.altar-title-name {
    font-size: 0.8rem;
    color: #fbbf24;
}

/* ============================================================
   WINDOW MANAGER — OpenBox style + tint2 taskbar
   ============================================================ */

body.wm-active {
    min-height: 100vh;
    height: 100vh;
    overflow: hidden;
    padding: 0;
    background: var(--bg-2);
    background-image:
        radial-gradient(ellipse at 20% 50%, rgba(233,69,96,0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 20%, rgba(15,52,96,0.3) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 80%, rgba(22,33,62,0.5) 0%, transparent 50%);
}

/* Desktop */
.wm-desktop {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 32px;
    overflow: hidden;
    background-color: var(--bg-0);
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Ctext x='10' y='30' font-size='18' opacity='0.04'%3E%F0%9F%90%95%3C/text%3E%3Ctext x='70' y='70' font-size='14' opacity='0.03'%3E%F0%9F%93%84%3C/text%3E%3Ctext x='30' y='110' font-size='12' opacity='0.04'%3E%E2%AC%9B%3C/text%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cline x1='0' y1='100' x2='200' y2='100' stroke='%23e94560' stroke-width='0.5' opacity='0.04' stroke-dasharray='4 8'/%3E%3Cline x1='100' y1='0' x2='100' y2='200' stroke='%23e94560' stroke-width='0.5' opacity='0.04' stroke-dasharray='4 8'/%3E%3C/svg%3E");
}

#wmTickerBar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9998;
}

/* ---- Taskbar (tint2 style) ---- */
.wm-taskbar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: rgba(13, 17, 23, 0.95);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    z-index: 10000;
    border-top: 1px solid rgba(233, 69, 96, 0.3);
    padding: 0 4px;
    gap: 2px;
    user-select: none;
}

.wm-start-btn {
    font-size: 0.9rem;
    background: var(--accent);
    color: var(--text-0);
    border: none;
    padding: 0 10px;
    height: 24px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    letter-spacing: 1px;
    transition: background 0.15s;
}
.wm-start-btn:hover {
    background: var(--accent-hover);
}

.wm-task-list {
    display: flex;
    flex: 1;
    gap: 2px;
    overflow: hidden;
    height: 100%;
    align-items: center;
    padding: 0 2px;
}

.wm-task-btn {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    color: #aaa;
    border: 1px solid rgba(255,255,255,0.08);
    padding: 0 10px;
    height: 24px;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    flex-shrink: 1;
    min-width: 24px;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: background 0.15s, color 0.15s, border-color 0.15s, min-width 0.2s;
}
.wm-task-icon {
    flex-shrink: 0;
    font-size: 0.9rem;
    line-height: 24px;
}
.wm-task-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wm-task-compact .wm-task-btn {
    min-width: 24px;
    max-width: 36px;
    padding: 0;
    justify-content: center;
}
.wm-task-compact .wm-task-label {
    display: none;
}
.wm-task-btn:hover {
    background: rgba(255,255,255,0.12);
    color: #ddd;
}
.wm-task-btn.active {
    background: rgba(233, 69, 96, 0.25);
    color: var(--accent);
    border-color: rgba(233, 69, 96, 0.4);
}
.wm-task-btn.minimized {
    color: #555;
    font-style: italic;
}

.wm-clock {
    font-size: 0.9rem;
    color: var(--text-2);
    padding: 0 10px;
    flex-shrink: 0;
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.4;
}
.wm-clock-date {
    font-size: 0.6rem;
    color: var(--text-3);
}

/* ---- Start Menu ---- */
.wm-start-menu {
    position: absolute;
    bottom: 32px;
    left: 0;
    background: rgba(13, 17, 23, 0.96);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(233, 69, 96, 0.3);
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    min-width: 220px;
    padding: 6px 0;
    z-index: 10001;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.5);
    display: flex;
    flex-wrap: wrap;
    max-height: 50vh;
    overflow-y: auto;
    max-width: calc(100vw - 20px);
}
.wm-start-menu-item {
    font-size: 0.9rem;
    color: #ccc;
    padding: 6px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background 0.1s;
    white-space: nowrap;
}
.wm-start-menu-item:hover {
    background: rgba(233, 69, 96, 0.2);
    color: var(--text-0);
}
.wm-start-menu-icon {
    font-size: 1rem;
    width: 20px;
    text-align: center;
}

/* ---- Windows ---- */
.wm-window {
    position: absolute;
    background: #0d1117;
    background: var(--bg-1);
    border: 1px solid var(--border);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    min-width: 220px;
    z-index: 1;
    min-height: 120px;
    transition: box-shadow 0.15s, border-color 0.2s, opacity 0.2s;
    pointer-events: none;
}
.wm-window.wm-focused {
    box-shadow: var(--shadow-lg), 0 0 12px rgba(233, 69, 96, 0.12);
    border-color: rgba(233, 69, 96, 0.4);
    pointer-events: auto;
}
.wm-window .wm-titlebar,
.wm-window .wm-resize-handle {
    pointer-events: auto;
}

.wm-related-bar {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 2px 6px;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid var(--border);
    overflow-x: auto;
    flex-shrink: 0;
    pointer-events: auto;
}
.wm-related-bar::-webkit-scrollbar {
    height: 0;
}
.wm-related-label {
    font-size: 0.45rem;
    color: #555;
    letter-spacing: 0.05em;
    margin-right: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}
.wm-related-btn {
    font-family: "Press Start 2P", cursive;
    font-size: 0.4rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #888;
    padding: 1px 4px;
    border-radius: 2px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}
.wm-related-btn:hover {
    background: rgba(233, 69, 96, 0.15);
    color: #e94560;
    border-color: rgba(233, 69, 96, 0.3);
}

/* Titlebar */
.wm-titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--bg-2);
    height: 28px;
    flex-shrink: 0;
    cursor: default;
    user-select: none;
    border-bottom: 1px solid var(--border);
}
.wm-focused .wm-titlebar {
    background: var(--bg-3);
    border-bottom-color: rgba(233, 69, 96, 0.2);
}

.wm-titlebar-left {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-left: 8px;
    overflow: hidden;
    flex: 1;
    min-width: 0;
}
.wm-titlebar-icon {
    font-size: 0.9rem;
    flex-shrink: 0;
}
.wm-titlebar-text {
    font-size: 0.9rem;
    color: var(--text-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.5px;
}
.wm-focused .wm-titlebar-text {
    color: var(--accent);
}

.wm-titlebar-btns {
    display: flex;
    align-items: center;
    gap: 1px;
    padding-right: 4px;
    flex-shrink: 0;
}

.wm-btn {
    font-size: 0.9rem;
    width: 26px;
    height: 22px;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0;
    transition: background 0.1s, color 0.1s;
}
.wm-btn-min {
    background: rgba(255,255,255,0.06);
    color: var(--text-3);
}
.wm-btn-min:hover {
    background: #f59e0b;
    color: #000;
}
.wm-btn-max {
    background: rgba(255,255,255,0.06);
    color: var(--text-3);
    font-size: 0.9rem;
}
.wm-btn-max:hover {
    background: #22c55e;
    color: #000;
}
.wm-btn-close {
    background: rgba(255,255,255,0.06);
    color: var(--text-3);
}
.wm-btn-close:hover {
    background: #ef4444;
    color: var(--text-0);
}

.wm-btn-link {
    background: rgba(255,255,255,0.06);
    color: #555;
    font-size: 0.9rem;
    line-height: 1;
    opacity: 0;
    transition: opacity 0.2s, background 0.15s;
}
.wm-titlebar:hover .wm-btn-link {
    opacity: 1;
}
.wm-btn-link:hover {
    background: rgba(255,255,255,0.12);
    color: #aaa;
}

/* Window content */
.wm-window-content {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px;
    position: relative;
}

.wm-window-content::-webkit-scrollbar {
    width: 6px;
}
.wm-window-content::-webkit-scrollbar-track {
    background: transparent;
}
.wm-window-content::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.15);
    border-radius: 3px;
}
.wm-window-content::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.25);
}

/* Maximized */
.wm-window.wm-maximized {
    border-radius: 0;
    border: none;
}

/* Resize handle */
.wm-resize-handle {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 14px;
    height: 14px;
    cursor: nwse-resize;
    z-index: 10;
    background: linear-gradient(135deg, transparent 50%, rgba(233,69,96,0.3) 50%);
    border-radius: 0 0 0 4px;
}
.wm-resize-handle:hover {
    background: linear-gradient(135deg, transparent 50%, rgba(233,69,96,0.6) 50%);
}

.wm-snap-preview {
    position: absolute;
    background: rgba(233, 69, 96, 0.12);
    border: 2px dashed rgba(233, 69, 96, 0.5);
    border-radius: 8px;
    z-index: 50;
    pointer-events: none;
    transition: left 0.15s ease, top 0.15s ease, width 0.15s ease, height 0.15s ease;
}

.wm-settings-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.wm-settings-header {
    color: var(--accent);
    font-size: 1rem;
    text-align: center;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.wm-settings-section {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    padding: 8px;
}
.wm-settings-section-title {
    color: var(--text-2);
    font-size: 0.9rem;
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.wm-settings-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 0;
    gap: 8px;
}
.wm-settings-label {
    flex: 1;
    min-width: 0;
}
.wm-settings-toggle {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 18px;
    flex-shrink: 0;
}
.wm-settings-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.wm-settings-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background: #333;
    border-radius: 9px;
    transition: background 0.2s;
}
.wm-settings-slider:before {
    content: "";
    position: absolute;
    height: 14px;
    width: 14px;
    left: 2px;
    bottom: 2px;
    background: #666;
    border-radius: 50%;
    transition: transform 0.2s, background 0.2s;
}
.wm-settings-toggle input:checked + .wm-settings-slider {
    background: rgba(233, 69, 96, 0.4);
}
.wm-settings-toggle input:checked + .wm-settings-slider:before {
    transform: translateX(18px);
    background: var(--accent);
}
.wm-settings-range-row {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.wm-settings-range {
    width: 80px;
    accent-color: var(--accent);
}
.wm-settings-range-val {
    font-size: 0.9rem;
    color: var(--text-2);
    min-width: 30px;
    text-align: right;
}
.wm-settings-tile-btns {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.wm-settings-tile-btn {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    color: #aaa;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 6px 10px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    flex: 1;
    min-width: 80px;
    text-align: center;
}
.wm-settings-tile-btn:hover {
    background: rgba(233, 69, 96, 0.2);
    color: var(--accent);
    border-color: rgba(233, 69, 96, 0.4);
}
.wm-settings-shortcuts {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.wm-settings-sc-row {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    font-size: 0.9rem;
    color: #777;
}
.wm-settings-sc-row kbd {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 3px;
    padding: 2px 4px;
    color: #aaa;
}
.wm-settings-sc-row span:last-child {
    margin-left: auto;
    color: #555;
}
.wm-settings-mgmt-btns {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.wm-settings-action-btn {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    color: #aaa;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 8px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    text-align: center;
}
.wm-settings-action-btn:hover {
    background: rgba(255,255,255,0.12);
    color: var(--text-0);
}
.wm-settings-danger {
    border-color: rgba(239, 68, 68, 0.3);
    color: #ef4444;
}
.wm-settings-danger:hover {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}

.calendar-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.calendar-date-display {
    text-align: center;
    background: rgba(233, 69, 96, 0.08);
    border: 1px solid rgba(233, 69, 96, 0.2);
    border-radius: 6px;
    padding: 8px;
}
.calendar-date-main {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 2px;
}
.calendar-time-main {
    font-size: 1.2rem;
    color: var(--text-0);
}
.calendar-speed-note {
    font-size: 0.9rem;
    color: #555;
    margin-top: 2px;
}
.calendar-flattenix {
    font-size: 0.9rem;
    color: #22c55e;
    margin-top: 2px;
    font-variant-numeric: tabular-nums;
}
.calendar-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.calendar-nav-btn {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    color: #aaa;
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
}
.calendar-nav-btn:hover { background: rgba(233,69,96,0.2); color: var(--accent); }
.calendar-month-label {
    font-size: 0.9rem;
    color: #aaa;
}
.calendar-grid {
    background: rgba(255,255,255,0.03);
    border-radius: 4px;
    padding: 4px;
}
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}
.calendar-days {
    display: contents;
}
.calendar-day-header {
    text-align: center;
    font-size: 0.9rem;
    color: #555;
    padding: 2px 0;
}
.calendar-day {
    text-align: center;
    font-size: 0.9rem;
    color: var(--text-3);
    padding: 3px 0;
    border-radius: 2px;
    min-height: 18px;
}
.calendar-day.calendar-today {
    background: var(--accent);
    color: var(--text-0);
    font-weight: bold;
}
.calendar-day.calendar-has-event {
    background: rgba(245, 158, 11, 0.2);
    color: #f59e0b;
}
.calendar-day.calendar-has-event::after {
    content: '';
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #f59e0b;
    margin: 2px auto 0;
}
.calendar-day.calendar-empty {
    color: transparent;
}
.calendar-upcoming {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 6px;
}
.calendar-upcoming-title {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}
.calendar-upcoming-empty {
    font-size: 0.9rem;
    color: #444;
}
.calendar-event {
    font-size: 0.9rem;
    padding: 3px 0;
    color: #f59e0b;
}

.loan-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.loan-header {
    color: var(--accent);
    font-size: 1rem;
    text-align: center;
    padding: 4px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.loan-tagline {
    text-align: center;
    font-size: 0.9rem;
    color: var(--text-2);
}
.loan-disclaimer {
    text-align: center;
    font-size: 0.9rem;
    color: #ef4444;
    opacity: 0.6;
}
.loan-section-title {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}
.loan-apply-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.loan-label {
    flex-shrink: 0;
    min-width: 60px;
    font-size: 0.9rem;
}
.loan-input, .loan-select {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.15);
    color: var(--text-0);
    border-radius: 4px;
    padding: 6px 8px;
    flex: 1;
}
.loan-select option { background: #0d1117; }
.loan-preview {
    font-size: 0.9rem;
    color: var(--text-3);
    padding: 4px 0;
    min-height: 12px;
}
.loan-apply-btn {
    font-size: 0.9rem;
    background: rgba(233, 69, 96, 0.2);
    border: 1px solid rgba(233, 69, 96, 0.5);
    color: var(--accent);
    border-radius: 4px;
    padding: 8px;
    cursor: pointer;
    text-align: center;
    transition: all 0.15s;
}
.loan-apply-btn:hover { background: var(--accent); color: var(--text-0); }
.loan-result {
    font-size: 0.9rem;
    min-height: 12px;
    text-align: center;
}
.loan-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 200px;
    overflow-y: auto;
}
.loan-empty {
    font-size: 0.9rem;
    color: #444;
    text-align: center;
}
.loan-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    padding: 8px;
}
.loan-card-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
}
.loan-card-principal {
    color: var(--accent);
    font-size: 0.9rem;
}
.loan-card-status {
    font-size: 0.9rem;
    padding: 2px 4px;
    border-radius: 2px;
}
.loan-card-status.status-active { background: rgba(34,197,94,0.2); color: #22c55e; }
.loan-card-status.status-late { background: rgba(245,158,11,0.2); color: #f59e0b; }
.loan-card-status.status-arbitration { background: rgba(168,85,247,0.2); color: #a855f7; }
.loan-card-status.status-garnishing { background: rgba(239,68,68,0.2); color: #ef4444; }
.loan-card-status.status-paid { background: rgba(255,255,255,0.05); color: var(--text-3); }
.loan-card-details {
    font-size: 0.9rem;
    color: var(--text-3);
    line-height: 1.6;
}
.loan-card-repay-btn {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    color: #aaa;
    border-radius: 3px;
    padding: 4px 8px;
    cursor: pointer;
    margin-top: 4px;
}
.loan-card-repay-btn:hover { background: rgba(34,197,94,0.2); color: #22c55e; border-color: rgba(34,197,94,0.4); }
.loan-garnish-warning {
    font-size: 0.9rem;
    color: #ef4444;
    text-align: center;
    background: rgba(239,68,68,0.1);
    border: 1px solid rgba(239,68,68,0.3);
    border-radius: 4px;
    padding: 8px;
    animation: garnish-flash 2s infinite;
}
@keyframes garnish-flash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}
.loan-credit-btn {
    font-size: 0.9rem;
    background: rgba(59, 130, 246, 0.15);
    border: 1px solid rgba(59, 130, 246, 0.4);
    color: #60a5fa;
    border-radius: 4px;
    padding: 8px;
    cursor: pointer;
    text-align: center;
    transition: all 0.15s;
}
.loan-credit-btn:hover { background: rgba(59, 130, 246, 0.3); }

.loan-bankrupt-section {
    margin-top: 12px;
    padding: 10px;
    border: 1px solid rgba(239, 68, 68, 0.4);
    border-radius: 4px;
    background: rgba(239, 68, 68, 0.08);
}
.loan-bankrupt-label {
    font-size: 0.9rem;
    color: #f87171;
    margin-bottom: 8px;
}
.loan-bankrupt-btn {
    font-size: 0.9rem;
    background: rgba(239, 68, 68, 0.2);
    border: 1px solid rgba(239, 68, 68, 0.5);
    color: #ef4444;
    border-radius: 4px;
    padding: 8px 16px;
    cursor: pointer;
    transition: all 0.15s;
}
.loan-bankrupt-btn:hover { background: rgba(239, 68, 68, 0.4); }
.loan-bankrupt-warning {
    font-size: 0.9rem;
    color: #f59e0b;
    margin-top: 6px;
}

.medicine-panel {
    font-size: 0.9rem;
    color: #ccc;
    padding: 10px;
}
.medicine-header {
    font-size: 1rem;
    color: var(--accent);
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.medicine-stack {
    margin-bottom: 8px;
}
.medicine-stack-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 6px 8px;
    margin-bottom: 4px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 4px;
    gap: 6px;
}
.medicine-stack-name {
    flex: 1;
    min-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.medicine-stack-cost {
    color: #f59e0b;
    flex-shrink: 0;
}
.medicine-stack-effects {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 0.65rem;
    flex-basis: 100%;
}
.medicine-remove-btn {
    font-size: 0.7rem;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #ef4444;
    border-radius: 3px;
    padding: 3px 6px;
    cursor: pointer;
    flex-shrink: 0;
}
.medicine-remove-btn:hover { background: rgba(239, 68, 68, 0.3); }
.medicine-daily-cost {
    color: #f59e0b;
    margin-bottom: 8px;
}
.medicine-effects {
    margin-bottom: 8px;
}
.medicine-effect-row {
    display: flex;
    justify-content: space-between;
    padding: 2px 0;
    gap: 8px;
}
.medicine-effect-label {
    color: var(--text-2);
}
.medicine-effect-val.positive { color: #22c55e; }
.medicine-effect-val.negative { color: #ef4444; }
.medicine-divider {
    border-top: 1px solid rgba(255,255,255,0.08);
    margin: 10px 0;
}
.medicine-search {
    width: 100%;
    box-sizing: border-box;
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 4px;
    color: #ccc;
    padding: 6px 8px;
    margin-bottom: 8px;
}
.medicine-search::placeholder { color: #555; }
.medicine-list {
    max-height: 360px;
    overflow-y: auto;
}
.medicine-card {
    padding: 8px;
    margin-bottom: 4px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.1s, border-color 0.1s;
}
.medicine-card:hover {
    background: rgba(233, 69, 96, 0.08);
    border-color: rgba(233, 69, 96, 0.3);
}
.medicine-card.in-stack {
    opacity: 0.4;
    cursor: default;
}
.medicine-card-name {
    color: var(--accent);
    margin-bottom: 4px;
}
.medicine-card-cost {
    color: #f59e0b;
    margin-bottom: 4px;
}
.medicine-card-effects {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.medicine-card-effect {
    font-size: 0.7rem;
    padding: 2px 4px;
    border-radius: 3px;
}
.medicine-card-effect.positive {
    background: rgba(34, 197, 94, 0.15);
    color: #22c55e;
    border: 1px solid rgba(34, 197, 94, 0.3);
}
.medicine-card-effect.negative {
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}
.medicine-empty {
    color: #555;
    text-align: center;
    padding: 16px;
}
.medicine-stack-actions {
    display: flex;
    gap: 6px;
    margin-bottom: 8px;
}
.medicine-btn {
    font-size: 0.65rem;
    padding: 4px 8px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 3px;
    background: rgba(255,255,255,0.06);
    color: #ccc;
    cursor: pointer;
}
.medicine-btn:hover {
    background: rgba(233, 69, 96, 0.15);
    border-color: rgba(233, 69, 96, 0.3);
}
.medicine-clear-btn {
    color: #ef4444;
    border-color: rgba(239, 68, 68, 0.3);
}
.medicine-clear-btn:hover {
    background: rgba(239, 68, 68, 0.2);
}
.medicine-presets {
    max-height: 160px;
    overflow-y: auto;
}
.medicine-preset-item {
    padding: 6px 8px;
    margin-bottom: 4px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 4px;
}
.medicine-preset-name {
    color: var(--accent);
    font-size: 0.7rem;
    margin-bottom: 3px;
}
.medicine-preset-count {
    color: #888;
}
.medicine-preset-pills {
    color: #777;
    font-size: 0.55rem;
    margin-bottom: 4px;
    word-break: break-word;
}
.medicine-preset-actions {
    display: flex;
    gap: 4px;
}
.medicine-preset-delete {
    color: #ef4444;
    border-color: rgba(239, 68, 68, 0.3);
}
.medicine-preset-delete:hover {
    background: rgba(239, 68, 68, 0.2);
}
@media (max-width: 768px) {
    .medicine-card-effect { font-size: 0.55rem; }
    .medicine-remove-btn { font-size: 0.55rem; }
    .medicine-btn { font-size: 0.5rem; }
}

.mkt-panel {
    font-size: 0.9rem;
    color: #ccc;
    padding: 12px;
    overflow-y: auto;
    height: 100%;
}
.mkt-header {
    text-align: center;
    margin-bottom: 12px;
}
.mkt-logo {
    font-size: 1rem;
    color: var(--accent);
    margin-bottom: 4px;
}
.mkt-subtitle {
    font-size: 0.7rem;
    color: var(--text-2);
}
.mkt-mult-display {
    text-align: center;
    background: rgba(26, 26, 46, 0.8);
    border: 2px solid #333;
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 12px;
}
.mkt-mult-label {
    display: block;
    font-size: 0.6rem;
    color: var(--text-3);
    margin-bottom: 4px;
}
.mkt-mult-value {
    display: block;
    font-size: 1.2rem;
    color: var(--text-2);
}
.mkt-active-section {
    margin-bottom: 8px;
}
.mkt-section-title {
    font-size: 0.8rem;
    color: var(--accent);
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #333;
}
.mkt-active-list {
    margin-bottom: 8px;
}
.mkt-empty {
    font-size: 0.8rem;
    color: #555;
    text-align: center;
    padding: 8px;
}
.mkt-active-card {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.2);
    border-radius: 6px;
    padding: 8px 10px;
    margin-bottom: 6px;
}
.mkt-active-icon {
    font-size: 1.1rem;
}
.mkt-active-name {
    flex: 1;
    font-size: 0.7rem;
    color: #ccc;
}
.mkt-active-mult {
    font-size: 0.7rem;
    color: #22c55e;
}
.mkt-active-timer {
    font-size: 0.6rem;
    color: var(--text-2);
}
.mkt-divider {
    border-top: 1px solid #333;
    margin: 12px 0;
}
.mkt-campaign-section {
    margin-bottom: 8px;
}
.mkt-campaign-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mkt-campaign-card {
    background: rgba(15, 52, 96, 0.4);
    border: 1px solid #1a1a2e;
    border-radius: 8px;
    padding: 10px;
}
.mkt-campaign-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.mkt-campaign-icon {
    font-size: 1.1rem;
}
.mkt-campaign-name {
    flex: 1;
    font-size: 0.8rem;
    color: var(--accent);
}
.mkt-campaign-cost {
    font-size: 0.7rem;
    color: #eab308;
}
.mkt-campaign-desc {
    font-size: 0.7rem;
    color: var(--text-2);
    line-height: 1.5;
    margin-bottom: 6px;
}
.mkt-campaign-meta {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}
.mkt-campaign-duration {
    font-size: 0.6rem;
    color: var(--text-3);
}
.mkt-campaign-mult {
    font-size: 0.6rem;
    color: #22c55e;
}
.mkt-buy-btn {
    font-size: 0.9rem;
    background: #0f3460;
    color: #ccc;
    border: 2px solid #e94560;
    border-radius: 4px;
    padding: 8px 16px;
    cursor: pointer;
    width: 100%;
    transition: all 0.15s;
}
.mkt-buy-btn:hover:not(:disabled) {
    background: var(--accent);
    color: var(--text-0);
}
.mkt-buy-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.mkt-result {
    text-align: center;
    font-size: 0.9rem;
    min-height: 1.4em;
    margin-top: 8px;
}
@media (max-width: 768px) {
    .mkt-panel { font-size: 0.85rem; padding: 8px; }
    .mkt-logo { font-size: 0.9rem; }
    .mkt-campaign-name { font-size: 0.7rem; }
    .mkt-campaign-desc { font-size: 0.6rem; }
    .mkt-buy-btn { font-size: 0.85rem; padding: 6px 10px; }
}

.credit-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.credit-report-header {
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding-bottom: 6px;
}
.credit-logo {
    font-size: 0.9rem;
    color: var(--accent);
}
.credit-subtitle {
    font-size: 0.9rem;
    color: var(--text-3);
    margin-top: 2px;
}
.credit-score-section {
    text-align: center;
    padding: 8px 0;
}
.credit-score-gauge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    margin-bottom: 8px;
}
.credit-score-number {
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1;
}
.credit-score-tier {
    font-size: 0.9rem;
}
.credit-score-bar {
    position: relative;
    height: 8px;
    background: rgba(255,255,255,0.08);
    border-radius: 4px;
    overflow: visible;
    margin: 4px 0;
}
.credit-score-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s ease, background 0.6s ease;
    background: #888;
}
.credit-score-bar-marker {
    position: absolute;
    top: -3px;
    width: 3px;
    height: 14px;
    background: #fff;
    border-radius: 2px;
    transition: left 0.6s ease;
    transform: translateX(-50%);
}
.credit-score-range {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #555;
}
.credit-summary {
    display: flex;
    justify-content: space-around;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 6px;
    padding: 8px 4px;
    gap: 4px;
}
.credit-summary-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 1;
}
.credit-summary-label {
    font-size: 0.9rem;
    color: var(--text-3);
    text-align: center;
}
.credit-summary-value {
    font-size: 0.9rem;
    color: #ccc;
}
.credit-section-title {
    font-size: 0.9rem;
    color: var(--text-2);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding-bottom: 4px;
    margin-bottom: 4px;
}
.credit-factors-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.credit-factor-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 0.9rem;
    line-height: 1.4;
}
.credit-factor-icon {
    flex-shrink: 0;
    font-size: 0.9rem;
    margin-top: 1px;
}
.credit-factor-label {
    color: #aaa;
    flex-shrink: 0;
    min-width: 80px;
}
.credit-factor-detail {
    color: var(--text-3);
}
.credit-accounts-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 150px;
    overflow-y: auto;
}
.credit-no-accounts {
    font-size: 0.9rem;
    color: #444;
    text-align: center;
    padding: 8px;
}
.credit-account-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 4px;
    padding: 6px 8px;
}
.credit-account-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2px;
}
.credit-account-amount {
    font-size: 0.9rem;
    color: #ccc;
}
.credit-account-status {
    font-size: 0.9rem;
}
.credit-account-details {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.4;
}
.credit-footer {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #444;
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 6px;
}

.sfd-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: center;
}
.sfd-header {
    color: var(--accent);
    font-size: 0.9rem;
    padding: 4px 0;
    line-height: 1.4;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.sfd-desc {
    font-size: 0.9rem;
    color: var(--text-2);
    line-height: 1.6;
}
.sfd-stats {
    display: flex;
    justify-content: space-around;
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    padding: 8px;
}
.sfd-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.sfd-stat-label {
    font-size: 0.9rem;
    color: #555;
}
.sfd-stat-value {
    font-size: 0.9rem;
    color: var(--accent);
}
.sfd-buy-btn {
    font-size: 0.9rem;
    background: rgba(34, 197, 94, 0.15);
    border: 1px solid rgba(34, 197, 94, 0.4);
    color: #22c55e;
    border-radius: 4px;
    padding: 8px;
    cursor: pointer;
    transition: all 0.15s;
}
.sfd-buy-btn:hover { background: #22c55e; color: #000; }
.sfd-buy-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.sfd-result {
    font-size: 0.9rem;
    min-height: 12px;
}
.sfd-warning {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.5;
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 6px;
}

@media (max-width: 768px) {
    .calendar-panel { font-size: 0.85rem; }
    .calendar-date-main { font-size: 0.85rem; }
    .calendar-time-main { font-size: 0.85rem; }
    .calendar-day { font-size: 0.85rem; padding: 2px 0; }
    .loan-panel { font-size: 0.85rem; }
    .loan-header { font-size: 0.85rem; }
    .sfd-panel { font-size: 0.85rem; }
}

.bingo-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.bingo-header {
    color: var(--accent);
    font-size: 1rem;
    text-align: center;
    padding: 4px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.bingo-buy-title, .bingo-bonus-title {
    color: var(--text-2);
    font-size: 0.9rem;
    margin-bottom: 6px;
}
.bingo-buy-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}
.bingo-buy-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    padding: 8px;
    cursor: pointer;
    text-align: center;
    color: #aaa;
    transition: all 0.15s;
}
.bingo-buy-card:hover {
    background: rgba(233, 69, 96, 0.15);
    border-color: rgba(233, 69, 96, 0.4);
    color: var(--text-0);
}
.bingo-buy-name {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 4px;
}
.bingo-buy-cost {
    font-size: 0.9rem;
    margin-bottom: 4px;
}
.bingo-buy-prizes {
    font-size: 0.9rem;
    color: var(--text-3);
    line-height: 1.4;
}
.bingo-buy-note {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
    padding-top: 4px;
}
.bingo-call-display {
    text-align: center;
    background: rgba(233, 69, 96, 0.08);
    border: 1px solid rgba(233, 69, 96, 0.2);
    border-radius: 6px;
    padding: 6px;
}
.bingo-call-label {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 2px;
}
.bingo-call-number {
    font-size: 1.4rem;
    color: var(--accent);
    line-height: 1.2;
}
.bingo-call-count {
    font-size: 0.9rem;
    color: var(--text-3);
    margin-top: 2px;
}
.bingo-recent-calls {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    min-height: 18px;
    justify-content: center;
}
.bingo-recent-num {
    font-size: 0.9rem;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    padding: 2px 4px;
    color: var(--text-2);
}
.bingo-recent-num.bingo-just-called {
    background: rgba(233, 69, 96, 0.3);
    color: var(--accent);
}
.bingo-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    overflow: hidden;
}
.bingo-card-header {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: rgba(233, 69, 96, 0.15);
}
.bingo-card-header span {
    text-align: center;
    font-size: 0.9rem;
    color: var(--accent);
    padding: 4px 0;
    font-weight: bold;
}
.bingo-card-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}
.bingo-cell {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    color: #aaa;
    border: 1px solid rgba(255,255,255,0.05);
    cursor: default;
    position: relative;
    transition: all 0.15s;
    user-select: none;
}
.bingo-cell.bingo-called {
    background: rgba(233, 69, 96, 0.2);
    color: var(--text-0);
    cursor: pointer;
}
.bingo-cell.bingo-called:hover {
    background: rgba(233, 69, 96, 0.35);
}
.bingo-cell.bingo-daubed {
    background: var(--accent);
    color: var(--text-0);
}
.bingo-cell.bingo-daubed::after {
    content: '\25CF';
    position: absolute;
    font-size: 1.8rem;
    color: rgba(0,0,0,0.3);
}
.bingo-cell.bingo-free {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
    font-size: 0.9rem;
}
.bingo-cell.bingo-free::after {
    content: '\2605';
    font-size: 1rem;
    color: rgba(34, 197, 94, 0.4);
}
.bingo-patterns {
    display: flex;
    gap: 6px;
    justify-content: center;
}
.bingo-pattern-btn {
    font-size: 0.9rem;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    background: rgba(255,255,255,0.04);
    color: var(--text-3);
    cursor: not-allowed;
    transition: all 0.15s;
}
.bingo-pattern-btn.bingo-ready {
    background: rgba(233, 69, 96, 0.2);
    border-color: rgba(233, 69, 96, 0.5);
    color: var(--accent);
    cursor: pointer;
    animation: bingo-pulse 1s infinite;
}
.bingo-pattern-btn.bingo-ready:hover {
    background: var(--accent);
    color: var(--text-0);
}
.bingo-pattern-btn.bingo-claimed {
    background: rgba(34, 197, 94, 0.15);
    border-color: rgba(34, 197, 94, 0.3);
    color: #22c55e;
    cursor: default;
    animation: none;
}
@keyframes bingo-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}
.bingo-result {
    font-size: 0.9rem;
    text-align: center;
    min-height: 14px;
    color: #22c55e;
}
.bingo-new-card-btn {
    font-size: 0.9rem;
    padding: 6px;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    background: rgba(255,255,255,0.04);
    color: var(--text-2);
    cursor: pointer;
    text-align: center;
    transition: all 0.15s;
}
.bingo-new-card-btn:hover {
    background: rgba(255,255,255,0.1);
    color: var(--text-0);
}
.bingo-bonus-section {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 8px;
}
.bingo-players-section {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 6px;
}
.bingo-players-title {
    color: var(--text-2);
    font-size: 0.9rem;
    margin-bottom: 4px;
}
.bingo-player-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.bingo-player-self, .bingo-player-cpu {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.9rem;
    background: rgba(255,255,255,0.04);
    border-radius: 4px;
    padding: 3px 6px;
}
.bingo-player-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.bingo-cpu-claim {
    color: #f59e0b;
    font-size: 0.85rem;
}
.bingo-bonus-temp {
    border-color: rgba(245, 158, 11, 0.3);
    background: rgba(245, 158, 11, 0.08);
}
.bingo-bonus-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.bingo-bonus-empty {
    font-size: 0.9rem;
    color: #555;
}
.bingo-bonus-card {
    display: flex;
    align-items: center;
    gap: 4px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 4px 6px;
    font-size: 0.9rem;
}
.bingo-bonus-card-icon {
    font-size: 1rem;
}
.bingo-bonus-card-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.bingo-bonus-card-name {
    color: var(--accent);
}
.bingo-bonus-card-desc {
    color: var(--text-3);
    font-size: 0.9rem;
}
.bingo-prize-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #0d1117;
    border: 2px solid #e94560;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    z-index: 10000;
    color: var(--text-0);
    animation: bingo-pop 0.3s ease-out;
}
@keyframes bingo-pop {
    0% { transform: translate(-50%, -50%) scale(0.5); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}
.bingo-prize-popup .bingo-prize-title {
    color: var(--accent);
    font-size: 0.9rem;
    margin-bottom: 10px;
}
.bingo-prize-popup .bingo-prize-item {
    font-size: 0.9rem;
    color: #22c55e;
    margin: 4px 0;
}
.bingo-prize-popup .bingo-prize-bonus {
    font-size: 0.9rem;
    color: #f59e0b;
    margin: 8px 0;
}
.bingo-prize-popup .bingo-prize-dismiss {
    font-size: 0.9rem;
    background: rgba(233, 69, 96, 0.3);
    border: 1px solid #e94560;
    color: var(--text-0);
    padding: 6px 16px;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
}
@media (max-width: 768px) {
    .bingo-panel { font-size: 0.85rem; gap: 6px; }
    .bingo-header { font-size: 0.85rem; }
    .bingo-buy-grid { grid-template-columns: 1fr; }
    .bingo-call-number { font-size: 1rem; }
    .bingo-cell { font-size: 0.85rem; }
    .bingo-cell.bingo-free { font-size: 0.85rem; }
    .bingo-cell.bingo-daubed::after { font-size: 1.1rem; }
    .bingo-cell.bingo-free::after { font-size: 0.85rem; }
    .bingo-buy-prizes { font-size: 0.85rem; }
    .bingo-pattern-btn { font-size: 0.85rem; padding: 5px 8px; }
}

@media (max-width: 768px) {
    .wm-settings-panel { font-size: 0.85rem; gap: 8px; }
    .wm-settings-header { font-size: 0.85rem; }
    .wm-settings-tile-btn { font-size: 0.85rem; padding: 5px 6px; min-width: 60px; }
    .wm-settings-sc-row { font-size: 0.85rem; }
    .wm-settings-sc-row kbd { font-size: 0.85rem; }
    .wm-settings-action-btn { font-size: 0.85rem; padding: 6px; }
}

/* ---- Window inner styles (adapted from .counter etc) ---- */
.wm-window-content .counter {
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 8px 0;
    min-width: auto;
    max-width: none;
}
.wm-window-content .market-dominance,
.wm-window-content .dog-inventory {
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 0;
}

/* Vibe monitor inside window */
.wm-window-content .vibe-monitor {
    border: none;
    background: transparent;
    max-width: none;
    margin: 0;
}

.wm-desktop::before {
    content: 'DF3K';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 8vw;
    color: rgba(233, 69, 96, 0.04);
    pointer-events: none;
    white-space: nowrap;
    letter-spacing: 2vw;
    z-index: 0;
}

.wm-desktop::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image:
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 59px,
            rgba(233, 69, 96, 0.02) 59px,
            rgba(233, 69, 96, 0.02) 60px
        ),
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 59px,
            rgba(233, 69, 96, 0.02) 59px,
            rgba(233, 69, 96, 0.02) 60px
        );
    pointer-events: none;
    z-index: 0;
}

/* News tickers in ticker bar */
#wmTickerBar > .news-ticker {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

#wmTickerBar > .news-ticker.breaking-news-active {
    background: linear-gradient(90deg, #000 0%, #8b0000 50%, #000 100%);
    color: #ff0000;
    border-bottom: 2px solid #ff0000;
}

#wmStatsBar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    background: rgba(13, 17, 23, 0.95);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(233, 69, 96, 0.2);
    padding: 6px 16px;
}

.wm-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.wm-stat-label {
    font-size: 0.9rem;
    color: #555;
    letter-spacing: 1px;
}

.wm-stat-value {
    font-size: 0.9rem;
    color: var(--text-0);
    cursor: default;
    transition: color 0.8s ease;
}

.wm-stat-value.stat-flash-up {
    color: #22c55e;
    transition: none;
}

.wm-stat-value.stat-flash-down {
    color: #ef4444;
    transition: none;
}

.wm-stat-value[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg-2);
    color: var(--text-0);
    font-size: 0.7rem;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 4px;
    white-space: pre;
    z-index: 100;
    pointer-events: none;
}

.wm-stat-bonus {
    color: #22c55e;
    font-size: 0.7rem;
    margin-left: 4px;
    cursor: default;
}

.wm-stat-bonus.penalty {
    color: #ef4444;
}

.wm-stat-bonus[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg-2);
    color: var(--text-0);
    font-size: 0.65rem;
    padding: 6px 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    white-space: pre-line;
    z-index: 100;
    pointer-events: none;
    min-width: 160px;
    text-align: left;
}

.bonus-tip {
    position: relative;
    cursor: help;
    border-bottom: 1px dotted rgba(233, 69, 96, 0.5);
    display: inline;
}

.bonus-tip[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg-2);
    color: var(--text-0);
    font-size: 0.65rem;
    padding: 6px 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    white-space: pre-line;
    z-index: 10000;
    pointer-events: none;
    min-width: 180px;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

.bonus-tip[data-tooltip]:hover::before {
    content: '';
    position: absolute;
    bottom: calc(100% - 6px);
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--border);
    z-index: 10001;
    pointer-events: none;
}

.bonus-badge {
    color: #22c55e;
    font-size: 0.7rem;
    margin-left: 4px;
    cursor: default;
    position: relative;
}

.bonus-badge.penalty {
    color: #ef4444;
}

.bonus-badge[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg-2);
    color: var(--text-0);
    font-size: 0.65rem;
    padding: 6px 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    white-space: pre-line;
    z-index: 10000;
    pointer-events: none;
    min-width: 160px;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
    margin-top: 6px;
}

.career-header .bonus-badge[data-tooltip]:hover::after {
    top: calc(100% + 4px);
    bottom: auto;
    z-index: 10001;
}


.wm-stat-clickable {
    cursor: pointer;
    transition: opacity 0.15s;
}

.wm-stat-clickable:hover {
    opacity: 0.7;
}

.account-dropdown {
    display: none;
    position: absolute;
    right: 16px;
    top: 100%;
    background: var(--bg-2);
    border: 1px solid #e94560;
    border-radius: 8px;
    padding: 12px;
    min-width: 280px;
    z-index: 9999;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6);
}

.account-dropdown-section {
    margin-bottom: 4px;
}

.account-dropdown-label {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 6px;
    letter-spacing: 1px;
}

.account-name-row {
    display: flex;
    gap: 6px;
}

.account-name-input {
    flex: 1;
    padding: 6px 8px;
    font-size: 1rem;
    background: #0f3460;
    color: var(--text-0);
    border: 1px solid var(--border);
    border-radius: 4px;
    outline: none;
}

.account-name-input:focus {
    border-color: var(--accent);
}

.account-save-btn {
    padding: 6px 12px;
    font-size: 0.9rem;
    background: var(--accent);
    color: var(--text-0);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s;
}

.account-save-btn:hover {
    background: #c73a52;
}

.account-token-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

.account-token-value {
    flex: 1;
    font-size: 0.9rem;
    color: var(--text-2);
    word-break: break-all;
    background: none;
    padding: 4px 0;
}

.account-copy-btn {
    padding: 5px 10px;
    font-size: 0.9rem;
    background: #0f3460;
    color: var(--accent);
    border: 1px solid #e94560;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.account-copy-btn:hover {
    background: var(--accent);
    color: var(--text-0);
}

.account-token-hint {
    font-size: 0.9rem;
    color: #444;
    margin-top: 4px;
}

.account-dropdown-divider {
    height: 1px;
    background: #333;
    margin: 10px 0;
}

.account-logout-btn {
    width: 100%;
    padding: 8px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: var(--accent);
    border: 1px solid #e94560;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 4px;
}

.account-logout-btn:hover {
    background: var(--accent);
    color: var(--text-0);
}

.account-profile-btn {
    width: 100%;
    padding: 8px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: #22c55e;
    border: 1px solid #22c55e;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 4px;
}

.account-profile-btn:hover {
    background: #22c55e;
    color: var(--text-0);
}

.lang-selector {
    padding: 4px 6px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: var(--accent);
    border: 1px solid #0f3460;
    border-radius: 4px;
    cursor: pointer;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    max-width: 110px;
}

.wm-stat-lang {
    flex-shrink: 0;
}

/* MIDI Keyboard */
.midi-panel {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.midi-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1rem;
    color: var(--accent);
}

.midi-status {
    font-size: 0.9rem;
    color: var(--text-3);
    background: var(--bg-2);
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid var(--border);
}

.midi-desc {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
}

.midi-connect-section {
    display: flex;
    gap: 8px;
    align-items: center;
}

.midi-device-select {
    flex: 1;
    padding: 6px 8px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: var(--accent);
    border: 1px solid #0f3460;
    border-radius: 4px;
    outline: none;
}

.midi-mode-section {
    display: flex;
    gap: 8px;
    align-items: center;
}

.midi-mode-label {
    font-size: 0.9rem;
    color: var(--text-2);
}

.midi-mode-btns {
    display: flex;
    gap: 4px;
    flex: 1;
}

.midi-mode-btn {
    flex: 1;
    padding: 6px;
    font-size: 0.9rem;
    background: var(--bg-2);
    color: var(--text-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.midi-mode-btn.active {
    background: var(--accent);
    color: var(--text-0);
    border-color: var(--accent);
}

.midi-visual {
    background: #0a0a15;
    border-radius: 6px;
    padding: 8px;
    overflow-x: auto;
    border: 1px solid #222;
}

.midi-keys {
    display: flex;
    height: 80px;
    position: relative;
    min-width: fit-content;
}

.midi-key {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 4px;
    font-size: 0.9rem;
    border-radius: 0 0 4px 4px;
    cursor: pointer;
    transition: background 0.1s, transform 0.1s;
    user-select: none;
    flex-shrink: 0;
}

.midi-key-white {
    width: 24px;
    height: 80px;
    background: #eee;
    color: #333;
    border: 1px solid #999;
    z-index: 1;
}

.midi-key-black {
    width: 16px;
    height: 50px;
    background: #222;
    color: var(--text-3);
    margin: 0 -8px;
    z-index: 2;
    border: 1px solid var(--border);
}

.midi-key.active {
    transform: scaleY(0.95);
}

.midi-key-white.active {
    background: var(--accent);
    color: var(--text-0);
}

.midi-key-black.active {
    background: var(--accent);
    color: var(--text-0);
}

.midi-stats {
    display: flex;
    gap: 12px;
    font-size: 0.9rem;
    color: var(--text-2);
    justify-content: center;
}

.midi-result {
    font-size: 0.9rem;
    color: #22c55e;
    text-align: center;
    min-height: 1.2em;
}

@media (max-width: 768px) {
    .midi-key-white { width: 18px; height: 60px; }
    .midi-key-black { width: 12px; height: 36px; margin: 0 -6px; }
    .midi-keys { height: 60px; }
    .midi-mode-btn { font-size: 0.85rem; padding: 4px; }
    .midi-connect-section { flex-direction: column; }
    .midi-device-select { width: 100%; }
}

/* Career system */
.career-panel {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.career-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.career-rank-badge {
    font-size: 0.9rem;
    color: #fbbf24;
    font-weight: bold;
}

.career-dps {
    font-size: 1rem;
    color: #22c55e;
    background: #0a2d14;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid #22c55e;
}

.career-dog-count {
    font-size: 0.9rem;
    color: #fbbf24;
    background: #2a1a00;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid #fbbf24;
}

.career-section-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 4px;
    border-bottom: 1px solid #333;
    padding-bottom: 4px;
}

.career-divider {
    border-top: 1px solid #333;
    margin: 4px 0;
}

.career-challenge {
    background: #0f1520;
    border: 1px solid #1a2744;
    border-radius: 6px;
    padding: 8px;
}

.career-challenge-title {
    font-size: 0.9rem;
    color: #fbbf24;
    margin-bottom: 4px;
}

.career-challenge-target {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 6px;
}

.career-challenge-complete {
    font-size: 0.9rem;
    color: #fbbf24;
    text-align: center;
    padding: 8px;
    background: #2d1f0a;
    border-radius: 6px;
    border: 1px solid #fbbf24;
}

.career-progress-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.career-progress-label {
    font-size: 0.9rem;
    color: var(--text-2);
    min-width: 60px;
}

.career-progress-bar {
    flex: 1;
    height: 8px;
    background: var(--bg-2);
    border-radius: 4px;
    overflow: hidden;
}

.career-progress-fill {
    height: 100%;
    background: var(--success);
    border-radius: 4px;
    transition: width 0.3s;
}

.career-progress-value {
    font-size: 0.9rem;
    color: #aaa;
    min-width: 80px;
    text-align: right;
}

.career-promote-btn {
    width: 100%;
    background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
    color: #000 !important;
    font-size: 0.9rem !important;
    padding: 10px !important;
    animation: career-pulse 2s infinite;
}

@keyframes career-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.career-team-stats {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 6px;
}

.career-hire-row {
    display: flex;
    gap: 6px;
    align-items: center;
}

.career-input {
    width: 60px;
    padding: 4px 6px;
    font-size: 0.9rem;
    background: var(--bg-1);
    color: var(--text-0);
    border: 1px solid #0f3460;
    border-radius: 4px;
    text-align: center;
}

.career-pound-item {
    font-size: 0.9rem;
    color: #4ade80;
    padding: 2px 0;
}

.career-pound-count {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}

.career-pound-btn {
    width: 100%;
    margin-bottom: 4px;
    font-size: 0.9rem !important;
    text-align: left;
}

.career-empty {
    font-size: 0.9rem;
    color: var(--text-3);
}

.career-collect-btn {
    width: 100%;
    background: #22c55e !important;
    font-size: 0.9rem !important;
    padding: 8px !important;
}

.career-collect-result, .career-result {
    font-size: 0.9rem;
    color: #4ade80;
    text-align: center;
    min-height: 1.2em;
}

.career-cost-label {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-top: 2px;
}

.career-machine-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    border-bottom: 1px solid #1a1a2e;
    font-size: 0.9rem;
    color: #ccc;
}

.career-machine-name {
    flex: 1;
    color: #8899bb;
}

.career-machine-dps {
    color: #22c55e;
    min-width: 50px;
    text-align: right;
}

.career-sell-machine-btn {
    font-size: 0.9rem;
    padding: 3px 6px;
    background: linear-gradient(180deg, #991b1b, #7f1d1d);
    color: #fbbf24;
    border: 1px solid #7f1d1d;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
}

.career-sell-machine-btn:hover {
    background: linear-gradient(180deg, #b91c1c, #991b1b);
}

.career-gather-section {
    margin: 8px 0;
}

.career-gather-label {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}

.career-gather-slider {
    width: 100%;
    height: 8px;
    -webkit-appearance: none;
    appearance: none;
    background: linear-gradient(90deg, #fbbf24, #22c55e);
    border-radius: 4px;
    outline: none;
    cursor: pointer;
}

.career-gather-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    background: var(--accent);
    border-radius: 50%;
    border: 2px solid #fff;
    cursor: pointer;
}

.career-gather-slider::-moz-range-thumb {
    width: 14px;
    height: 14px;
    background: var(--accent);
    border-radius: 50%;
    border: 2px solid #fff;
    cursor: pointer;
}

.career-gather-rates {
    font-size: 0.9rem;
    color: var(--text-3);
    text-align: center;
    margin-top: 4px;
}

.career-owned-machines {
    max-height: 150px;
    overflow-y: auto;
    margin-bottom: 6px;
}

.career-error {
    font-size: 0.9rem;
    color: #ef4444;
    text-align: center;
}

.career-rank-list {
    max-height: 140px;
    overflow-y: auto;
}

.career-spreadsheet-section {
    margin-top: 4px;
}
.spreadsheet-productivity {
    font-size: 0.9rem;
    color: #22c55e;
    margin-bottom: 8px;
    padding: 4px 8px;
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.3);
    border-radius: 4px;
}
.spreadsheet-table-wrap {
    max-height: 250px;
    overflow-y: auto;
    border: 1px solid var(--border);
    border-radius: 4px;
}
.spreadsheet-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.65rem;
}
.spreadsheet-table th {
    background: var(--bg-2);
    color: var(--accent);
    padding: 6px 4px;
    text-align: left;
    border-bottom: 2px solid #333;
    position: sticky;
    top: 0;
}
.spreadsheet-table td {
    padding: 5px 4px;
    border-bottom: 1px solid #222;
    color: #ccc;
    vertical-align: middle;
}
.spreadsheet-table tr:nth-child(even) td {
    background: rgba(26, 26, 46, 0.4);
}
.spreadsheet-table .stock-ok { color: #22c55e; }
.spreadsheet-table .stock-low { color: #eab308; }
.spreadsheet-table .stock-out { color: #ef4444; }
.spreadsheet-table input[type="number"] {
    width: 50px;
    font-size: 0.6rem;
    background: var(--bg-2);
    color: #ccc;
    border: 1px solid var(--border);
    border-radius: 2px;
    padding: 3px;
    text-align: center;
}
.spreadsheet-total {
    font-size: 0.9rem;
    color: #eab308;
    margin: 8px 0;
    text-align: right;
}
#spreadsheetOrderBtn {
    width: 100%;
    margin-top: 4px;
}

.career-rank-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: #444;
    padding: 3px 4px;
    border-radius: 3px;
}

.career-rank-achieved {
    color: #22c55e;
}

.career-rank-current {
    color: #fbbf24;
    background: #1a150a;
    border: 1px solid #fbbf24;
}

.career-rank-emoji {
    font-size: 1rem;
}

@media (max-width: 768px) {
    .career-hire-row { flex-wrap: wrap; }
    .career-input { width: 50px; }
    .career-machine-btn { font-size: 0.85rem; }
    .kennel-pound-btn { font-size: 0.85rem; }
}

 .messenger-panel {
     width: 100%;
     height: 100%;
     padding: 0;
     display: flex;
     flex-direction: column;
     background: #0f0f23;
 }
.messenger-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #16213e;
    border-bottom: 1px solid #0f3460;
    flex-shrink: 0;
}
.messenger-channel {
    color: #e94560;
    font-size: 0.7rem;
    font-family: 'Press Start 2P', cursive;
}
.messenger-online {
    color: #22c55e;
    font-size: 0.55rem;
    font-family: 'Press Start 2P', cursive;
}
.messenger-messages {
    flex: 1;
    overflow-y: auto;
    padding: 8px 12px;
    font-size: 0.65rem;
    line-height: 1.6;
    word-wrap: break-word;
}
.messenger-msg {
    margin-bottom: 4px;
    padding: 2px 0;
}
.messenger-msg-time {
    color: #555;
    margin-right: 6px;
    font-size: 0.5rem;
}
.messenger-msg-name {
    color: #0f3460;
    font-weight: bold;
    margin-right: 6px;
}
.messenger-msg-text {
    color: #ccc;
}
.messenger-msg-system {
    color: #555;
    font-style: italic;
    font-size: 0.55rem;
    padding: 2px 0;
}
.messenger-msg-action {
    color: #e94560;
    font-style: italic;
}
.messenger-msg-roll {
    color: #f5c842;
}
.messenger-msg-error {
    color: #e94560;
    font-size: 0.55rem;
    padding: 4px 8px;
    margin: 4px 0;
    background: rgba(233,69,96,0.1);
    border-radius: 4px;
}
.messenger-input-row {
    display: flex;
    padding: 8px;
    background: #16213e;
    border-top: 1px solid #0f3460;
    flex-shrink: 0;
    gap: 8px;
}
.messenger-input {
    flex: 1;
    background: #1a1a2e;
    border: 1px solid #0f3460;
    color: #ccc;
    padding: 8px 12px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.55rem;
    border-radius: 4px;
    outline: none;
}
.messenger-input:focus {
    border-color: #e94560;
}
.messenger-send-btn {
    background: #0f3460;
    color: #fff;
    border: 1px solid #e94560;
    padding: 8px 16px;
    border-radius: 4px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.5rem;
    cursor: pointer;
    flex-shrink: 0;
}
.messenger-send-btn:hover {
    background: #e94560;
}

.kennel-panel {
    padding: 12px;
}

.kennel-header {
    text-align: center;
    margin-bottom: 8px;
}

.kennel-dog-count {
    font-size: 0.9rem;
    color: #fbbf24;
    margin-bottom: 4px;
}

.kennel-dps-info {
    font-size: 0.9rem;
    color: #22c55e;
}

.kennel-divider {
    border-top: 1px solid #333;
    margin: 10px 0;
}

.kennel-section {
    margin-bottom: 8px;
}

.kennel-adopt-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 4px;
}

.kennel-adopt-cost {
    font-size: 0.9rem;
    color: var(--text-2);
}

.kennel-result {
    font-size: 0.9rem;
    color: #22c55e;
    min-height: 14px;
}

.kennel-pound-btn {
    display: block;
    width: 100%;
    margin-bottom: 6px;
    font-size: 0.9rem;
    padding: 8px 10px;
    background: linear-gradient(180deg, #16213e, #0f3460);
    color: #ccc;
    border: 1px solid #0f3460;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    text-align: left;
}

.kennel-pound-btn:hover {
    background: linear-gradient(180deg, #1e3050, #1a4a7a);
    border-color: var(--accent);
    color: var(--text-0);
}

.kennel-owned-item {
    font-size: 0.9rem;
    color: #ccc;
    padding: 3px 0;
    border-bottom: 1px solid #1a1a2e;
}

.career-machine-btn {
    display: block;
    width: 100%;
    margin-bottom: 6px;
    font-size: 0.9rem;
    padding: 8px 10px;
    background: linear-gradient(180deg, #16213e, #0f3460);
    color: #ccc;
    border: 1px solid #0f3460;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    text-align: left;
}

.career-machine-btn:hover {
    background: linear-gradient(180deg, #1e3050, #1a4a7a);
    border-color: var(--accent);
    color: var(--text-0);
}

.career-buy-grid {
    max-height: 200px;
    overflow-y: auto;
}

.dogs-panel {
    font-size: 0.9rem;
    color: #ccc;
    padding: 12px;
    overflow-y: auto;
    height: 100%;
}
.dogs-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.dogs-count {
    font-size: 1rem;
    color: #fbbf24;
}
.dogs-cost-label {
    font-size: 0.8rem;
    color: var(--text-2);
}
.dogs-section-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 8px;
}
.dogs-adopt-row, .dogs-china-row {
    display: flex;
    gap: 6px;
    align-items: center;
}
.dogs-divider {
    border-top: 1px solid #333;
    margin: 10px 0;
}
.dogs-result {
    text-align: center;
    font-size: 0.9rem;
    min-height: 1.2em;
    margin-top: 6px;
}

.dogs-total-cost {
    text-align: center;
    font-size: 0.8rem;
    color: #888;
    margin-top: 4px;
    min-height: 1.2em;
}

.wm-stat-clickable {
    cursor: pointer;
    transition: background 0.15s;
}

.wm-stat-clickable:hover {
    background: rgba(233, 69, 96, 0.15);
    border-radius: 4px;
}

/* Achievement popup in WM mode */
.wm-active .achievement {
    z-index: 20000;
}

/* ---- Existing layout overrides ---- */
.layout-wrapper { display: none; }
.banner { display: none; }
.faq-section { bottom: 40px; z-index: 9999; }
.flag { display: none; }
.sponsor { top: auto; bottom: 40px; right: 8px; z-index: 9999; font-size: 0.9rem; padding: 5px 8px; }

/* ---- Context Menu ---- */
.wm-context-menu {
    position: absolute;
    background: rgba(13, 17, 23, 0.96);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(233, 69, 96, 0.3);
    border-radius: 6px;
    min-width: 220px;
    padding: 4px 0;
    z-index: 20000;
    box-shadow: 0 6px 24px rgba(0,0,0,0.7);
    user-select: none;
}
.wm-context-header {
    font-size: 0.9rem;
    color: var(--accent);
    padding: 8px 14px 6px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 2px;
}
.wm-context-item {
    font-size: 0.9rem;
    color: var(--text-2);
    padding: 7px 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: background 0.1s, color 0.1s;
}
.wm-context-item:hover {
    background: rgba(233, 69, 96, 0.2);
    color: var(--text-0);
}
.wm-context-item.open {
    color: #ccc;
}
.wm-context-check {
    width: 14px;
    text-align: center;
    color: var(--accent);
    font-size: 0.9rem;
    flex-shrink: 0;
}

.credits-window {
    padding: 12px;
    overflow-y: auto;
}
.credits-header {
    font-size: 0.9rem;
    color: var(--accent);
    text-align: center;
    margin-bottom: 6px;
}
.credits-subtitle {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
    line-height: 1.6;
    margin-bottom: 14px;
}
.credits-tier-label {
    font-size: 0.9rem;
    text-align: center;
    margin: 10px 0 8px;
    padding: 4px 0;
    border-radius: 4px;
}
.platinum-label {
    color: #e5e4e2;
    background: rgba(229, 228, 226, 0.1);
    border: 1px solid rgba(229, 228, 226, 0.3);
}
.gold-label {
    color: #ffd700;
    background: rgba(255, 215, 0, 0.08);
    border: 1px solid rgba(255, 215, 0, 0.2);
}
.silver-label {
    color: #c0c0c0;
    background: rgba(192, 192, 192, 0.08);
    border: 1px solid rgba(192, 192, 192, 0.2);
}
.credits-sponsor-row {
    display: flex;
    gap: 10px;
    margin-bottom: 6px;
}
.credits-sponsor-card {
    flex: 1;
    background: var(--bg-1);
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    border: 1px solid #0f3460;
    transition: transform 0.15s;
}
.credits-sponsor-card:hover {
    transform: scale(1.03);
}
.credits-sponsor-card.platinum {
    border-color: rgba(229, 228, 226, 0.4);
    background: linear-gradient(135deg, #16213e, #1a1a3e);
    margin-bottom: 8px;
}
.credits-sponsor-card.gold {
    border-color: rgba(255, 215, 0, 0.3);
}
.credits-sponsor-card.silver {
    border-color: rgba(192, 192, 192, 0.3);
}
.credits-sponsor-logo {
    width: 60px;
    height: 60px;
    object-fit: contain;
    margin-bottom: 6px;
    border-radius: 6px;
    background: #0d1117;
    padding: 4px;
}
.credits-sponsor-card.platinum .credits-sponsor-logo {
    width: 80px;
    height: 80px;
}
.credits-sponsor-name {
    font-size: 0.9rem;
    color: var(--text-0);
    margin-bottom: 4px;
    line-height: 1.5;
}
.credits-sponsor-amount {
    font-size: 0.9rem;
    color: #22c55e;
}
.credits-footer {
    font-size: 0.9rem;
    color: #555;
    text-align: center;
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px solid #222;
}

@media (max-width: 768px) {
    #wmStatsBar {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px 16px;
        padding: 6px 10px;
    }
    .wm-stat {
        min-width: auto;
        flex-shrink: 0;
    }
    .wm-stat-label {
        font-size: 0.6rem;
        letter-spacing: 0.5px;
    }
    .wm-stat-value {
        font-size: 0.7rem;
        white-space: nowrap;
    }
    .wm-desktop {
        bottom: 56px;
    }
    .wm-taskbar {
        height: 56px;
        padding: 0 6px;
        gap: 4px;
    }
    .wm-start-btn {
        font-size: 0.85rem;
        height: 38px;
        padding: 0 12px;
    }
    .wm-task-list {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .wm-task-list::-webkit-scrollbar {
        display: none;
    }
    .wm-task-btn {
        font-size: 0.85rem;
        height: 38px;
        padding: 0 8px;
        flex-shrink: 0;
    }
    .wm-clock {
        font-size: 0.85rem;
    }
    .wm-window {
        border-radius: 0 !important;
    }
    .wm-titlebar {
        height: 36px;
    }
    .wm-titlebar-btns .wm-btn-min,
    .wm-titlebar-btns .wm-btn-max,
    .wm-titlebar-btns .wm-btn-link {
        display: none;
    }
    .wm-titlebar-btns .wm-btn-help {
        opacity: 1;
    }
    .wm-resize-handle {
        display: none;
    }
    .wm-start-menu {
        max-height: 60vh;
        overflow-y: auto;
        max-width: 90vw;
        bottom: 56px;
    }
    .wm-context-menu {
        max-height: 60vh;
        overflow-y: auto;
    }
    .sponsor {
        display: none;
    }
    .faq-section .faq-content {
        max-width: 90vw;
    }
    .live-crt {
        height: 140px;
    }
    .live-chat-area {
        height: 140px;
    }
    .radio-freq {
        font-size: 1.8rem;
    }
    .carbon-status {
        font-size: 0.85rem;
    }
    .carbon-modifier {
        font-size: 0.85rem;
    }
    .carbon-input {
        width: 60px;
        font-size: 0.85rem;
        padding: 5px;
    }
    .carbon-trade-btns button {
        font-size: 0.85rem;
        padding: 8px 4px;
    }
    .wm-taskbar,
    #wmStatsBar,
    .wm-start-menu,
    .wm-context-menu {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .wm-window {
        transition: none !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.05);
    }
    .wm-window.wm-focused {
        box-shadow: 0 4px 16px rgba(0,0,0,0.6), 0 0 0 1px rgba(233, 69, 96, 0.4);
    }
    #wmTickerBar > .news-ticker {
        padding: 4px 0;
        min-height: 14px;
        font-size: 0.65rem;
        border-bottom-width: 1px;
    }
    #wmStatsBar {
        padding: 4px 6px;
        gap: 4px 10px;
    }
    .wm-stat-label {
        font-size: 0.5rem;
    }
    .wm-stat-value {
        font-size: 0.6rem;
    }
    .wm-stat-lang {
        display: none;
    }
    #conkyWidget {
        display: none;
    }
}

.tutorial-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.88);
    z-index: 30000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tutorial-overlay.tutorial-action-mode {
    background: transparent;
    pointer-events: none;
    align-items: flex-start;
    z-index: 30000;
}

.tutorial-overlay.tutorial-action-mode .tutorial-box {
    pointer-events: auto;
    margin-top: 16px;
    max-width: 480px;
    padding: 16px 24px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.6), 0 0 20px rgba(233, 69, 96, 0.2);
    z-index: 30001;
}

.tutorial-overlay.tutorial-action-mode .tutorial-emoji {
    font-size: 1.5rem;
    margin-bottom: 6px;
}

.tutorial-overlay.tutorial-action-mode .tutorial-title {
    font-size: 1rem;
    margin-bottom: 8px;
}

.tutorial-overlay.tutorial-action-mode .tutorial-text {
    font-size: 0.9rem;
    margin-bottom: 8px;
}

.tutorial-overlay.tutorial-action-mode .tutorial-nav {
    margin-top: 12px;
}

.tutorial-overlay.tutorial-action-mode .tutorial-step-dots {
    margin-bottom: 10px;
}

.tutorial-highlight {
    z-index: 29999 !important;
    position: relative;
    animation: tutorial-pulse 1.2s ease-in-out infinite;
    box-shadow: 0 0 0 4px #fbbf24, 0 0 30px rgba(251, 191, 36, 0.8) !important;
    border-radius: 6px;
}

@keyframes tutorial-pulse {
    0%, 100% { box-shadow: 0 0 0 4px #fbbf24, 0 0 30px rgba(251, 191, 36, 0.8); }
    50% { box-shadow: 0 0 0 8px #fbbf24, 0 0 50px rgba(251, 191, 36, 1); }
}

.tutorial-box {
    background: var(--bg-2);
    border: 2px solid #e94560;
    border-radius: 12px;
    padding: 32px;
    max-width: 520px;
    width: 90%;
    text-align: center;
    position: relative;
    box-shadow: 0 0 40px rgba(233, 69, 96, 0.3);
}

.tutorial-step-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 20px;
}

.tutorial-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #333;
    transition: background 0.2s;
}

.tutorial-dot.active {
    background: var(--accent);
}

.tutorial-dot.completed {
    background: #22c55e;
}

.tutorial-content {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tutorial-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 16px;
    line-height: 1.6;
}

.tutorial-text {
    font-size: 0.9rem;
    color: #ccc;
    line-height: 2;
    margin-bottom: 12px;
}

.tutorial-text strong {
    color: var(--accent);
}

.tutorial-text .green {
    color: #22c55e;
}

.tutorial-text .gold {
    color: #fbbf24;
}

.tutorial-text .cyan {
    color: #22d3ee;
}

.tutorial-emoji {
    font-size: 2.5rem;
    margin-bottom: 12px;
}

.tutorial-nav {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 24px;
    flex-wrap: wrap;
}

.tutorial-prev,
.tutorial-next {
    padding: 10px 24px;
    font-size: 0.9rem;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
}

.tutorial-prev {
    background: var(--bg-1);
    color: var(--text-2);
    border: 1px solid var(--border);
}

.tutorial-prev:hover {
    background: #1e3050;
}

.tutorial-next {
    background: var(--accent);
    color: var(--text-0);
}

.tutorial-next:hover {
    background: #c73a52;
}

.tutorial-skip {
    width: 100%;
    margin-top: 12px;
    padding: 8px 16px;
    font-size: 0.9rem;
    background: transparent;
    color: #555;
    border: 1px solid var(--border);
    border-radius: 4px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.tutorial-skip:hover {
    color: var(--accent);
    border-color: var(--accent);
}

.wm-btn-help {
    background: rgba(255, 255, 255, 0.06);
    color: #555;
    font-size: 0.9rem;
    line-height: 1;
    opacity: 0;
    transition: opacity 0.2s, background 0.15s, color 0.15s;
    font-weight: bold;
}
.wm-titlebar:hover .wm-btn-help {
    opacity: 1;
}
.wm-btn-help:hover {
    background: #3b82f6;
    color: var(--text-0);
}

/* ========== VISUAL FLOURISHES ========== */

/* CRT scanline overlay on desktop - applied to ::after alongside existing grid */
.wm-desktop {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ctext x='30' y='45' font-size='20' text-anchor='middle' opacity='0.03'%3E%F0%9F%90%95%3C/text%3E%3C/svg%3E"),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cline x1='0' y1='60' x2='60' y2='0' stroke='rgba(233,69,96,0.015)' stroke-width='1'/%3E%3C/svg%3E"),
        radial-gradient(ellipse at 15% 25%, rgba(233,69,96,0.06) 0%, transparent 40%),
        radial-gradient(ellipse at 85% 75%, rgba(15,52,96,0.12) 0%, transparent 40%),
        radial-gradient(ellipse at 50% 50%, rgba(22,33,62,0.15) 0%, transparent 60%);
}

.wm-desktop::after {
    background-image:
        repeating-linear-gradient(0deg, transparent, transparent 59px, rgba(233,69,96,0.02) 59px, rgba(233,69,96,0.02) 60px),
        repeating-linear-gradient(90deg, transparent, transparent 59px, rgba(233,69,96,0.02) 59px, rgba(233,69,96,0.02) 60px),
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.02) 2px, rgba(0,0,0,0.02) 4px);
    animation: scanlineShift 8s linear infinite;
}

@keyframes scanlineShift {
    0% { background-position: 0 0, 0 0, 0 0; }
    100% { background-position: 0 0, 0 0, 0 4px; }
}

/* Machine industrial glow - pulsing warning light */
.machine::before {
    content: '';
    position: absolute;
    top: -8px;
    right: -8px;
    width: 10px;
    height: 10px;
    background: #ef4444;
    border-radius: 50%;
    box-shadow: 0 0 8px #ef4444, 0 0 16px #ef4444;
    animation: warningLight 1.5s ease-in-out infinite;
    z-index: 5;
}

@keyframes warningLight {
    0%, 100% { opacity: 1; box-shadow: 0 0 8px #ef4444, 0 0 16px #ef4444; }
    50% { opacity: 0.3; box-shadow: 0 0 2px #ef4444; }
}

/* Machine rivets */
.machine::after {
    content: '';
    position: absolute;
    top: 6px;
    left: 6px;
    right: 6px;
    height: 2px;
    background: repeating-linear-gradient(
        90deg,
        rgba(255,255,255,0.15) 0px,
        rgba(255,255,255,0.15) 4px,
        transparent 4px,
        transparent 14px
    );
    border-radius: 1px;
}

/* Machine steam/smoke on crush */
.crusher-plate.crushing ~ .machine-hole::before {
    content: '';
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 40px;
    background: radial-gradient(circle, rgba(200,200,200,0.3) 0%, transparent 70%);
    border-radius: 50%;
    animation: steamPuff 0.5s ease-out forwards;
}

@keyframes steamPuff {
    0% { opacity: 1; transform: translateX(-50%) translateY(0) scale(0.5); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-20px) scale(1.5); }
}

/* Flatten button idle pulse */
.flatten-btn:not(:disabled) {
    animation: flattenIdlePulse 2.5s ease-in-out infinite;
}

@keyframes flattenIdlePulse {
    0%, 100% { box-shadow: 0 4px 0 #a33348, 0 0 20px rgba(233, 69, 96, 0.3); }
    50% { box-shadow: 0 4px 0 #a33348, 0 0 35px rgba(233, 69, 96, 0.5), 0 0 60px rgba(233, 69, 96, 0.15); }
}

.flatten-btn:not(:disabled):hover {
    animation: none;
    box-shadow: 0 4px 0 #a33348, 0 0 40px rgba(233, 69, 96, 0.6), 0 0 80px rgba(233, 69, 96, 0.2);
}

/* Achievement starburst */
.achievement.show {
    animation: achievementBurst 0.4s cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
    background: linear-gradient(135deg, #bf0a30 0%, #8b0000 30%, #002868 100%);
    border-image: linear-gradient(135deg, #ffd700, #ff8c00, #ffd700, #ffed4a) 1;
    border-image-slice: 1;
    border-width: 3px;
    border-style: solid;
}

@keyframes achievementBurst {
    0% { transform: scale(0) rotate(-5deg); opacity: 0; }
    50% { transform: scale(1.1) rotate(1deg); opacity: 1; }
    100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

.achievement-title {
    animation: achievementTitleGlow 1s ease-in-out infinite alternate;
}

@keyframes achievementTitleGlow {
    from { text-shadow: 0 0 5px #ffd700, 0 0 10px #ff8c00; }
    to { text-shadow: 0 0 15px #ffd700, 0 0 30px #ff8c00, 0 0 45px #ffd700; }
}

/* Focused window breathing border */
.wm-window.wm-focused {
    animation: windowFocusGlow 3s ease-in-out infinite;
}

@keyframes windowFocusGlow {
    0%, 100% { border-color: rgba(233, 69, 96, 0.3); box-shadow: 0 8px 32px rgba(0,0,0,0.8), 0 0 15px rgba(233, 69, 96, 0.1), 0 0 0 1px rgba(233, 69, 96, 0.3); }
    50% { border-color: rgba(233, 69, 96, 0.5); box-shadow: 0 8px 32px rgba(0,0,0,0.8), 0 0 25px rgba(233, 69, 96, 0.2), 0 0 0 1px rgba(233, 69, 96, 0.5); }
}

/* Order book terminal glow */
.order-book {
    border: 1px solid #1a3a1a;
    background: #050a05;
    box-shadow: inset 0 0 30px rgba(0, 20, 0, 0.3);
}

.order-book-row:hover {
    background: rgba(34, 197, 94, 0.05);
}

.order-book-ask { color: #ff4444; text-shadow: 0 0 3px rgba(255, 68, 68, 0.3); }
.order-book-bid { color: #44ff44; text-shadow: 0 0 3px rgba(68, 255, 68, 0.3); }

/* Trading chart glow border */
#brotherChart {
    border: 1px solid rgba(34, 197, 94, 0.2);
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5), 0 0 10px rgba(34, 197, 94, 0.05);
}

/* Stats bar separators */
.wm-stat {
    position: relative;
}

.wm-stat + .wm-stat::before {
    content: '';
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(233, 69, 96, 0.3), transparent);
}

/* Stats bar LIVE dot */
.wm-stat-label::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    background: #ef4444;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
    animation: liveDot 2s ease-in-out infinite;
}

@keyframes liveDot {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.2; }
}

/* News ticker chrome */
#wmTickerBar {
    border-bottom: 1px solid rgba(233, 69, 96, 0.2);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

#wmStatsBar {
    background: linear-gradient(180deg, rgba(13, 17, 23, 0.95) 0%, rgba(13, 17, 23, 0.98) 100%);
    border-top: 1px solid rgba(233, 69, 96, 0.15);
}

/* Breaking news alert flash */
#wmTickerBar > .news-ticker.breaking-news-active {
    animation: breakingFlash 0.5s ease-in-out 3;
    border-bottom: 2px solid #ff0000;
    box-shadow: 0 2px 20px rgba(255, 0, 0, 0.3);
}

@keyframes breakingFlash {
    0%, 100% { background: linear-gradient(90deg, #000 0%, #8b0000 50%, #000 100%); }
    50% { background: linear-gradient(90deg, #000 0%, #ff0000 50%, #000 100%); }
}

.act-log-item.act-entering {
    animation: actSlideIn 0.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}

@keyframes actSlideIn {
    0% { transform: translateX(-10px); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

/* Sheet output bounce */
.sheet {
    animation: sheetFall 0.3s ease-out, sheetWiggle 0.4s ease-in-out 0.3s;
}

@keyframes sheetWiggle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-2deg); }
    75% { transform: rotate(2deg); }
}

/* Titlebar text glow on focus */
.wm-focused .wm-titlebar-text {
    text-shadow: 0 0 8px rgba(233, 69, 96, 0.4);
}

/* Taskbar start button pulse */
.wm-start-btn {
    position: relative;
    overflow: hidden;
}

.wm-start-btn::after {
    content: '';
    position: absolute;
    top: 0; left: -100%; bottom: 0;
    width: 50%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    animation: startBtnShine 4s ease-in-out infinite;
}

@keyframes startBtnShine {
    0%, 100% { left: -100%; }
    50% { left: 150%; }
}

/* Flatten message popup - use JS timeout + CSS transition for reliable hide */
.message.show {
    background: linear-gradient(135deg, #e94560 0%, #c73652 100%);
    box-shadow: 0 0 20px rgba(233, 69, 96, 0.4);
}

/* Dog inventory glow when stock is high */
.dog-inventory[style*="block"] .dog-pile {
    text-shadow: 0 0 10px rgba(74, 222, 128, 0.3);
}

/* Leaderboard #1 crown effect */
.leaderboard table tbody tr:first-child td:first-child {
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}

/* Carbon bar animated gradient */
.carbon-bar-fill {
    background-size: 200% 100%;
    animation: carbonShimmer 3s ease-in-out infinite;
}

@keyframes carbonShimmer {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* Bro token message marquee shimmer */
.bro-message {
    background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.05), transparent);
    background-size: 200% 100%;
    animation: broShimmer 3s linear infinite;
}

@keyframes broShimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Taskbar active button glow */
.wm-task-btn.active {
    box-shadow: 0 0 8px rgba(233, 69, 96, 0.3);
}

/* Context menu backdrop blur enhancement */
.wm-context-menu {
    border: 1px solid rgba(233, 69, 96, 0.25);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.7), 0 0 15px rgba(233, 69, 96, 0.1);
}

/* Resize handle dot pattern */
.wm-resize-handle {
    background: none;
}

.wm-resize-handle::before {
    content: '';
    position: absolute;
    bottom: 3px;
    right: 3px;
    width: 8px;
    height: 8px;
    background: radial-gradient(circle, rgba(233,69,96,0.5) 1px, transparent 1px);
    background-size: 3px 3px;
}

.wm-resize-handle:hover::before {
    background: radial-gradient(circle, rgba(233,69,96,0.8) 1px, transparent 1px);
    background-size: 3px 3px;
}

/* Waiting person idle bob */
.waiting-person:not(.drinking) {
    animation: idleBob 3s ease-in-out infinite;
}

.waiting-person:nth-child(2) { animation-delay: 0.5s; }
.waiting-person:nth-child(3) { animation-delay: 1s; }
.waiting-person:nth-child(4) { animation-delay: 1.5s; }
.waiting-person:nth-child(5) { animation-delay: 2s; }

@keyframes idleBob {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}

/* Auto flattener progress bar shimmer */
.auto-progress-fill {
    background-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.15) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: progressShimmer 2s linear infinite;
}

@keyframes progressShimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Belt treads - better visual */
.input-belt, .output-belt {
    background: repeating-linear-gradient(
        90deg,
        #555 0px,
        #555 2px,
        #3a3a3a 2px,
        #3a3a3a 6px,
        #444 6px,
        #444 8px,
        #333 8px,
        #333 14px
    );
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.4), 0 1px 0 rgba(255,255,255,0.05);
}

/* Input belt side rail */
.input-belt-wrapper::before,
.output-belt-wrapper::before {
    content: '';
    position: absolute;
    top: -3px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #666, #888, #666);
    border-radius: 2px 2px 0 0;
}

.input-belt-wrapper::after,
.output-belt-wrapper::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #555, #777, #555);
    border-radius: 0 0 2px 2px;
}

.scrap-panel {
    width: 100%;
    text-align: center;
}

.scrap-header {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
}

.scrap-header span:first-child {
    font-size: 0.9rem;
    color: #f59e0b;
}

.scrap-subtitle {
    font-size: 0.9rem;
    color: var(--text-2);
}

.scrap-sky {
    width: 100%;
    height: 80px;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    background: #87CEEB;
    margin-bottom: 6px;
    border: 2px solid #333;
    transition: background 0.3s;
}

.scrap-sun-moon {
    position: absolute;
    top: 10px;
    right: 30px;
    font-size: 2rem;
    z-index: 2;
    text-shadow: 0 0 10px rgba(255, 255, 100, 0.5);
}

.scrap-skyline {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30px;
    background: #111;
    z-index: 1;
}

.scrap-skyline::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 5%;
    width: 15%;
    height: 25px;
    background: #1a1a1a;
    border-radius: 2px 2px 0 0;
}

.scrap-skyline::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 30%;
    width: 10%;
    height: 35px;
    background: #161616;
    border-radius: 2px 2px 0 0;
}

.scrap-time-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    background: var(--bg-2);
    border-radius: 4px;
    margin-bottom: 8px;
    border: 1px solid var(--border);
}

.scrap-time-label {
    font-size: 0.9rem;
    color: #fbbf24;
}

.scrap-status-label {
    font-size: 0.9rem;
    color: #c084fc;
}

.scrap-tools {
    margin-bottom: 8px;
}

.scrap-tools-label {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 4px;
}

.scrap-tools-row {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.scrap-tool-btn {
    flex: 1;
    min-width: 100px;
    padding: 6px 8px;
    font-size: 0.9rem;
    border: 2px solid #f59e0b;
    border-radius: 4px;
    cursor: pointer;
    background: #2a1a00;
    color: #f59e0b;
    transition: all 0.15s;
}

.scrap-tool-btn:hover:not(:disabled) {
    background: #4a2a00;
    box-shadow: 0 0 8px rgba(245, 158, 11, 0.3);
}

.scrap-tool-btn:disabled {
    background: #1a1a1a;
    border-color: #333;
    color: #555;
    cursor: not-allowed;
}

.scrap-tool-btn.owned {
    background: #1a2e1a;
    border-color: #22c55e;
    color: #22c55e;
    cursor: default;
}

.scrap-go-btn {
    width: 100%;
    padding: 12px;
    font-size: 0.9rem;
    background: linear-gradient(180deg, #7c3aed, #4c1d95);
    color: white;
    border: 2px solid #7c3aed;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: 8px;
}

.scrap-go-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, #8b5cf6, #6d28d9);
    box-shadow: 0 0 16px rgba(124, 58, 237, 0.5);
}

.scrap-go-btn:disabled {
    background: #222;
    border-color: #444;
    color: var(--text-3);
    cursor: not-allowed;
    box-shadow: none;
}

.scrap-minigame-bar {
    margin-bottom: 8px;
    padding: 8px;
    background: #0a0a1a;
    border: 2px solid #7c3aed;
    border-radius: 6px;
}

.scrap-minigame-track {
    position: relative;
    width: 100%;
    height: 30px;
    background: var(--bg-2);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid var(--border);
}

.scrap-sweet-spot {
    position: absolute;
    top: 0;
    height: 100%;
    background: rgba(34, 197, 94, 0.35);
    border-left: 2px solid #22c55e;
    border-right: 2px solid #22c55e;
}

.scrap-indicator {
    position: absolute;
    top: 0;
    width: 4px;
    height: 100%;
    background: #ef4444;
    border-radius: 2px;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.8);
    transition: none;
    z-index: 2;
}

.scrap-minigame-hint {
    font-size: 0.9rem;
    color: #fbbf24;
    margin-top: 4px;
    animation: scrapPulse 0.8s ease-in-out infinite;
}

@keyframes scrapPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.scrap-minigame-result {
    font-size: 0.9rem;
    min-height: 16px;
    margin-bottom: 6px;
    text-align: center;
}

.scrap-inventory {
    background: #0d0d1a;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 8px;
    margin-bottom: 6px;
}

.scrap-inventory-header {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 6px;
}

.scrap-inventory-list {
    max-height: 120px;
    overflow-y: auto;
    margin-bottom: 6px;
}

.scrap-inventory-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 4px;
    font-size: 0.9rem;
    border-bottom: 1px solid #1a1a2e;
}

.scrap-item-emoji {
    font-size: 0.9rem;
}

.scrap-item-name {
    flex: 1;
    text-align: left;
    color: #ccc;
    font-size: 0.9rem;
}

.scrap-item-qty {
    color: #fbbf24;
    font-size: 0.9rem;
}

.scrap-item-value {
    color: #22c55e;
    font-size: 0.9rem;
}

.scrap-empty {
    color: #555;
    font-size: 0.9rem;
    padding: 8px;
}

.scrap-inventory-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
    font-size: 0.9rem;
    color: var(--text-2);
    border-top: 1px solid #333;
    margin-bottom: 6px;
}

.scrap-total-value {
    color: #22c55e;
    font-size: 1rem;
}

.scrap-sell-btn {
    width: 100%;
    padding: 8px;
    font-size: 0.9rem;
    background: linear-gradient(180deg, #22c55e, #16a34a);
    color: white;
    border: 2px solid #22c55e;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.scrap-sell-btn:hover:not(:disabled) {
    box-shadow: 0 0 12px rgba(34, 197, 94, 0.5);
}

.scrap-sell-btn:disabled {
    background: var(--bg-2);
    border-color: #333;
    color: #555;
    cursor: not-allowed;
}

.scrap-result {
    margin-top: 6px;
    font-size: 0.9rem;
    color: #fbbf24;
    text-align: center;
    min-height: 14px;
    word-wrap: break-word;
}

.scrap-panel {
    position: relative;
}

.scrap-sleep-overlay {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(10, 10, 30, 0.92);
    z-index: 100;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    animation: sleepPulse 2s ease-in-out infinite;
}

@keyframes sleepPulse {
    0%, 100% { background: rgba(10, 10, 30, 0.92); }
    50% { background: rgba(20, 20, 60, 0.95); }
}

.scrap-sleep-emoji {
    font-size: 3rem;
    margin-bottom: 12px;
    animation: sleepBob 2s ease-in-out infinite;
}

@keyframes sleepBob {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.scrap-sleep-title {
    font-size: 1rem;
    color: #c084fc;
    text-align: center;
    margin-bottom: 10px;
}

.scrap-sleep-sub {
    font-size: 0.9rem;
    color: var(--text-2);
    text-align: center;
}

.scrap-cocaine-section {
    margin-bottom: 6px;
    padding: 6px 8px;
    background: #1a0a2e;
    border: 1px solid #7c3aed;
    border-radius: 4px;
}

.scrap-cocaine-label {
    font-size: 0.9rem;
    color: #c084fc;
    margin-bottom: 4px;
}

.scrap-cocaine-row {
    display: flex;
    gap: 4px;
    align-items: center;
}

.scrap-cocaine-btn {
    flex: 1;
    padding: 5px 6px;
    font-size: 0.9rem;
    border: 2px solid #7c3aed;
    border-radius: 3px;
    cursor: pointer;
    background: #2a1a4a;
    color: #c084fc;
    transition: all 0.15s;
}

.scrap-cocaine-btn:hover:not(:disabled) {
    background: #3a2a5a;
    box-shadow: 0 0 8px rgba(124, 58, 237, 0.3);
}

.scrap-cocaine-btn:disabled {
    background: var(--bg-2);
    border-color: #333;
    color: #555;
    cursor: not-allowed;
}

.scrap-cocaine-grams {
    font-size: 0.9rem;
    color: #c084fc;
    min-width: 50px;
    text-align: right;
}

.scrap-awake-section {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
    padding: 4px 8px;
    background: #0a1a0a;
    border: 1px solid #22c55e;
    border-radius: 4px;
}

.scrap-awake-label {
    font-size: 0.9rem;
    color: #22c55e;
    white-space: nowrap;
}

.scrap-awake-bar {
    flex: 1;
    height: 10px;
    background: var(--bg-2);
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid var(--border);
}

.scrap-awake-fill {
    height: 100%;
    background: #22c55e;
    border-radius: 5px;
    transition: width 0.1s linear;
}

.radio-display {
    background: #0a0a0a;
    border: 2px solid #333;
    border-radius: 8px;
    padding: 15px 20px;
    text-align: center;
    margin-bottom: 12px;
    position: relative;
}

.radio-freq {
    font-size: 2.4rem;
    color: #ff6b00;
    text-shadow: 0 0 10px #ff6b00, 0 0 20px #ff4400;
    letter-spacing: 4px;
    line-height: 1;
}

.radio-freq-unit {
    font-size: 1rem;
    color: #996600;
    margin-top: 4px;
    letter-spacing: 2px;
}

.radio-signal {
    display: flex;
    gap: 3px;
    justify-content: center;
    margin-top: 10px;
    height: 20px;
    align-items: flex-end;
}

.radio-signal-bar {
    width: 6px;
    background: #333;
    border-radius: 2px;
    transition: height 0.2s, background 0.2s;
}

.radio-signal-bar:nth-child(1) { height: 6px; }
.radio-signal-bar:nth-child(2) { height: 9px; }
.radio-signal-bar:nth-child(3) { height: 12px; }
.radio-signal-bar:nth-child(4) { height: 15px; }
.radio-signal-bar:nth-child(5) { height: 18px; }

.radio-signal-bar.active {
    background: #22c55e;
    box-shadow: 0 0 4px #22c55e;
}

.radio-dial-container {
    position: relative;
    margin-bottom: 12px;
}

.radio-dial-track {
    background: #1a1a1a;
    border: 2px solid #333;
    border-radius: 4px;
    height: 24px;
    position: relative;
    overflow: hidden;
}

.radio-dial-markers {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.radio-dial-marker {
    position: absolute;
    top: 0;
    width: 1px;
    height: 100%;
    background: #444;
}

.radio-dial-marker.major {
    background: #666;
    width: 2px;
}

.radio-dial-needle {
    position: absolute;
    top: 0;
    width: 3px;
    height: 100%;
    background: var(--accent);
    box-shadow: 0 0 6px #e94560;
    pointer-events: none;
    z-index: 2;
    left: 0%;
    transition: left 0.05s;
}

.radio-dial-input {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 24px;
    background: transparent;
    position: relative;
    z-index: 3;
    cursor: pointer;
    margin: 0;
    display: block;
}

.radio-dial-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 24px;
    background: rgba(233, 69, 96, 0.3);
    border: 2px solid #e94560;
    border-radius: 3px;
    cursor: grab;
}

.radio-dial-input::-moz-range-thumb {
    width: 20px;
    height: 24px;
    background: rgba(233, 69, 96, 0.3);
    border: 2px solid #e94560;
    border-radius: 3px;
    cursor: grab;
}

.radio-dial-input::-webkit-slider-runnable-track {
    background: transparent;
    height: 24px;
}

.radio-dial-input::-moz-range-track {
    background: transparent;
    height: 24px;
    border: none;
}

.radio-controls {
    display: flex;
    align-items: center;
    gap: 12px;
}

.radio-btn {
    font-size: 1rem;
    background: var(--bg-2);
    color: var(--text-3);
    border: 2px solid #333;
    border-radius: 6px;
    padding: 8px 12px;
    cursor: pointer;
    transition: all 0.2s;
    min-width: 44px;
}

.radio-btn:hover {
    border-color: var(--accent);
}

.radio-btn.active {
    color: #22c55e;
    border-color: #22c55e;
    text-shadow: 0 0 6px #22c55e;
}

.radio-volume {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.radio-volume-icon {
    font-size: 0.9rem;
}

.radio-volume-input {
    -webkit-appearance: none;
    appearance: none;
    flex: 1;
    height: 6px;
    background: #333;
    border-radius: 3px;
    outline: none;
}

.radio-volume-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    background: var(--accent);
    border-radius: 50%;
    cursor: pointer;
}

.radio-volume-input::-moz-range-thumb {
    width: 14px;
    height: 14px;
    background: var(--accent);
    border-radius: 50%;
    cursor: pointer;
     border: none;
}

.b2a-header {
    text-align: center;
    padding: 12px 8px;
    background: linear-gradient(135deg, #1a0a2e 0%, #2a1a3e 100%);
    border: 1px solid #6b21a8;
    border-radius: 4px;
    margin-bottom: 10px;
}
.b2a-logo {
    font-size: 1rem;
    color: #c084fc;
    text-shadow: 0 0 10px #a855f744;
}
.b2a-tagline {
    font-size: 0.7rem;
    color: var(--text-3);
    margin-top: 6px;
    font-style: italic;
}
.b2a-stats {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 6px;
    margin-bottom: 10px;
}
.b2a-stat {
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    border-radius: 4px;
    padding: 8px;
    text-align: center;
}
.b2a-stat-label {
    font-size: 0.55rem;
    color: var(--text-3);
    display: block;
    margin-bottom: 4px;
}
.b2a-stat-val {
    font-size: 0.9rem;
    color: #e0e0e0;
    display: block;
}
.b2a-royalty-box {
    background: #1a1a0e;
    border: 1px solid #f59e0b44;
    border-radius: 4px;
    padding: 10px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    font-size: 0.75rem;
    color: #f59e0b;
}
.b2a-royalty-empty {
    color: #555;
    border-color: #2a2a4a;
    background: var(--bg-1);
    justify-content: center;
}
.b2a-btn-collect {
    background: #f59e0b;
    color: #000;
    border: none;
    padding: 6px 14px;
    border-radius: 3px;
    font-size: 0.7rem;
    cursor: pointer;
}
.b2a-btn-collect:hover { background: #fbbf24; }
.b2a-section {
    margin-bottom: 10px;
}
.b2a-section-header {
    font-size: 0.7rem;
    color: #c084fc;
    background: #1a0a2e;
    border: 1px solid #3b1a5e;
    border-radius: 4px;
    padding: 8px 12px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}
.b2a-section-header:hover { border-color: #c084fc; }
.b2a-toggle-arrow { font-size: 0.6rem; }
.b2a-submit-form {
    padding: 10px;
    background: #0f0f1a;
    border: 1px solid #2a2a4a;
    border-radius: 4px;
}
.b2a-form-row {
    margin-bottom: 10px;
}
.b2a-label {
    font-size: 0.65rem;
    color: var(--text-2);
    display: block;
    margin-bottom: 6px;
}
.b2a-input {
    width: 100%;
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    color: #e0e0e0;
    padding: 8px 10px;
    border-radius: 3px;
    font-size: 0.7rem;
    box-sizing: border-box;
}
.b2a-input:focus { border-color: #c084fc; outline: none; }
.b2a-record-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.b2a-btn {
    border: none;
    padding: 8px 16px;
    border-radius: 3px;
    font-size: 0.7rem;
    cursor: pointer;
}
.b2a-btn-record { background: #dc2626; color: white; }
.b2a-btn-record:hover { background: #ef4444; }
.b2a-btn-stop { background: #dc2626; color: white; animation: b2a-pulse 0.8s infinite; }
@keyframes b2a-pulse { 0%,100% { opacity:1; } 50% { opacity:0.6; } }
.b2a-btn-submit { background: #6b21a8; color: white; }
.b2a-btn-submit:hover:not(:disabled) { background: #7c3aed; }
.b2a-btn-submit:disabled { background: #333; color: var(--text-3); cursor: not-allowed; }
.b2a-record-timer {
    font-size: 0.9rem;
    color: #e0e0e0;
    min-width: 60px;
}
.b2a-record-status {
    font-size: 0.6rem;
    color: var(--text-2);
}
.b2a-submit-status {
    font-size: 0.65rem;
    color: #22c55e;
    margin-top: 8px;
}
.b2a-form-note {
    font-size: 0.55rem;
    color: #555;
    margin-top: 8px;
    line-height: 1.8;
}
.b2a-mode-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 10px;
}
.b2a-mode-tab {
    flex: 1;
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    color: var(--text-2);
    padding: 8px;
    font-size: 0.6rem;
    cursor: pointer;
    text-align: center;
    border-radius: 0;
}
.b2a-mode-tab:first-child { border-radius: 3px 0 0 3px; }
.b2a-mode-tab:last-child { border-radius: 0 3px 3px 0; }
.b2a-mode-tab.active {
    background: #6b21a8;
    color: white;
    border-color: #7c3aed;
}
.b2a-file-input {
    font-size: 0.6rem;
    color: #ccc;
    margin-bottom: 4px;
}
.b2a-file-input::file-selector-button {
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    color: #ccc;
    padding: 6px 12px;
    font-size: 0.55rem;
    cursor: pointer;
    border-radius: 3px;
    margin-right: 8px;
}
.b2a-file-status {
    font-size: 0.55rem;
    color: var(--text-2);
    display: block;
    margin-top: 4px;
}
.b2a-song-list {
    max-height: 250px;
    overflow-y: auto;
}
.b2a-song-item {
    background: var(--bg-1);
    border: 1px solid #2a2a4a;
    border-radius: 3px;
    padding: 8px 10px;
    margin-bottom: 4px;
}
.b2a-song-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.b2a-status-badge {
    font-size: 0.55rem;
    padding: 2px 6px;
    border-radius: 2px;
    font-weight: bold;
    white-space: nowrap;
}
.b2a-status-approved { background: #22c55e22; color: #22c55e; border: 1px solid #22c55e44; }
.b2a-status-pending { background: #f59e0b22; color: #f59e0b; border: 1px solid #f59e0b44; }
.b2a-status-processing { background: #3b82f622; color: #3b82f6; border: 1px solid #3b82f644; }
.b2a-status-rejected { background: #ef444422; color: #ef4444; border: 1px solid #ef444444; }
.b2a-status-failed { background: #ef444422; color: #ef4444; border: 1px solid #ef444444; }
.b2a-song-title {
    font-size: 0.65rem;
    color: #ccc;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 100px;
}
.b2a-song-royalty {
    font-size: 0.6rem;
    color: #f59e0b;
    white-space: nowrap;
}
.b2a-song-date {
    font-size: 0.55rem;
    color: #555;
    white-space: nowrap;
}
.b2a-song-detail {
    font-size: 0.55rem;
    margin-top: 4px;
    line-height: 1.6;
}
.b2a-empty {
    font-size: 0.7rem;
    color: #555;
    text-align: center;
    padding: 20px;
}

.b2a-url-row {
    display: flex;
    gap: 6px;
    align-items: center;
}
.b2a-url-row .b2a-input {
    flex: 1;
    min-width: 0;
}
.b2a-btn-load {
    background: #2563eb;
    color: white;
    font-size: 0.7rem;
    padding: 6px 12px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
}
.b2a-btn-load:hover:not(:disabled) { background: #3b82f6; }
.b2a-btn-load:disabled { background: #333; color: var(--text-3); cursor: not-allowed; }
.b2a-step-disabled {
    opacity: 0.4;
    pointer-events: none;
}
.b2a-step-status {
    font-size: 0.7rem;
    color: var(--text-2);
    display: block;
    margin-top: 4px;
}
.b2a-preview-area {
    background: #0f0f1a;
    border: 1px solid #2a2a4a;
    border-radius: 4px;
    padding: 10px;
    min-height: 40px;
}
.b2a-preview-controls {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}
.b2a-btn-preview {
    background: #22c55e;
    color: #000;
    font-size: 0.7rem;
    padding: 6px 12px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.b2a-btn-preview:hover { background: #4ade80; }
.b2a-btn-preview-stop {
    background: #666;
    color: var(--text-0);
    font-size: 0.7rem;
    padding: 6px 12px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.b2a-btn-preview-stop:hover { background: #888; }
.b2a-preview-note {
    font-size: 0.6rem;
    color: var(--text-3);
}

@media (max-width: 768px) {
    .b2a-stats { grid-template-columns: 1fr 1fr; }
    .b2a-stat-label { font-size: 0.5rem; }
    .b2a-stat-val { font-size: 0.75rem; }
    .b2a-logo { font-size: 0.8rem; }
    .b2a-record-row { flex-direction: column; align-items: flex-start; }
    .b2a-url-row { flex-direction: column; }
    .b2a-url-row .b2a-input { width: 100%; }
}

.live-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding: 0 4px;
}

.live-platform {
    font-size: 0.9rem;
    color: var(--text-2);
}

.live-go-live-btn {
    font-size: 1rem;
    padding: 8px 16px;
    background: var(--accent);
    color: var(--text-0);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
}

.live-go-live-btn:hover {
    background: #ff5a7a;
    transform: scale(1.05);
}

.live-go-live-btn.active {
    background: #333;
    color: var(--accent);
    border: 2px solid #e94560;
}

.live-offline {
    text-align: center;
    padding: 60px 20px;
}

.live-offline-icon {
    font-size: 3rem;
    margin-bottom: 16px;
}

.live-offline-text {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 12px;
}

.live-offline-sub {
    font-size: 0.9rem;
    color: var(--text-3);
    line-height: 1.6;
}

.live-stream-area {
    margin-bottom: 8px;
}

.live-crt {
    background: #0a0a0a;
    border: 3px solid #222;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    height: 180px;
}

.live-crt-screen {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.live-crt-scanlines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.15) 2px,
        rgba(0, 0, 0, 0.15) 4px
    );
    pointer-events: none;
    z-index: 3;
}

.live-crt-screen::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at center, transparent 60%, rgba(0, 0, 0, 0.4) 100%);
    pointer-events: none;
    z-index: 4;
}

.live-machine-mirror {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #33ff33;
    font-size: 0.9rem;
    text-shadow: 0 0 8px #33ff33;
    overflow: hidden;
}

.live-machine-mirror .mirror-dog {
    font-size: 2rem;
    animation: mirrorWalk 2s linear infinite;
}

.live-machine-mirror .mirror-press {
    font-size: 1.5rem;
}

.live-machine-mirror.flattening-now .mirror-dog {
    display: none;
}

.live-machine-mirror.flattening-now .mirror-flat {
    display: block;
}

.live-machine-mirror .mirror-flat {
    display: none;
    font-size: 1.8rem;
    animation: mirrorFlat 0.3s ease-out;
}

@keyframes mirrorWalk {
    0% { transform: translateX(-30px); }
    100% { transform: translateX(30px); }
}

@keyframes mirrorFlat {
    0% { transform: scaleY(1); }
    100% { transform: scaleY(0.2); }
}

.live-stats {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 8px;
    background: #111;
    border-radius: 0 0 6px 6px;
}

.live-badge {
    font-size: 0.9rem;
    padding: 3px 8px;
    border-radius: 3px;
}

.live-badge-red {
    background: var(--accent);
    color: var(--text-0);
    animation: livePulse 1.5s ease-in-out infinite;
}

@keyframes livePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

.live-viewers {
    font-size: 0.9rem;
    color: var(--text-2);
}

.live-uptime {
    font-size: 0.9rem;
    color: #555;
    margin-left: auto;
}

.live-chat-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: #0d0d0d;
    border: 1px solid #222;
    border-radius: 6px;
    overflow: hidden;
    height: 180px;
}

.live-chat-header {
    font-size: 0.9rem;
    color: var(--text-2);
    padding: 6px 8px;
    background: #111;
    border-bottom: 1px solid #222;
}

.live-online {
    height: 100%;
    overflow: hidden;
}

.live-chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 4px 6px;
    font-size: 1rem;
    max-height: 140px;
}

.live-chat-msg {
    margin-bottom: 2px;
    word-wrap: break-word;
}

.live-chat-name {
    font-weight: bold;
    color: var(--accent);
}

.live-chat-text {
    color: #ccc;
}

.live-chat-msg.donation {
    background: rgba(233, 69, 96, 0.1);
    border-left: 3px solid #e94560;
    padding: 3px 6px;
    margin: 3px 0;
    border-radius: 0 3px 3px 0;
}

.live-chat-msg.donation .live-chat-name {
    color: #ffd700;
}

.live-chat-msg.donation .live-donation-amount {
    color: #ffd700;
    font-weight: bold;
}

.live-donations-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px;
    margin-top: 6px;
    background: #111;
    border-radius: 4px;
}

.live-total-earned {
    font-size: 0.9rem;
    color: #22c55e;
}

.live-session-info {
    font-size: 0.9rem;
    color: var(--text-3);
}

.live-donation-popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.9rem;
    color: #ffd700;
    text-shadow: 0 0 10px #ffd700, 0 0 20px #ff8c00;
    z-index: 10;
    animation: donationPop 2s ease-out forwards;
    pointer-events: none;
    white-space: nowrap;
}

@keyframes donationPop {
    0% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); }
    20% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
    40% { transform: translate(-50%, -50%) scale(1); }
    80% { opacity: 1; }
    100% { opacity: 0; transform: translate(-50%, -80%) scale(1); }
}

.factory-panel {
    font-size: 0.9rem;
    color: #ccc;
}

.factory-header {
    text-align: center;
    font-size: 1rem;
    color: var(--accent);
    margin-bottom: 8px;
}

.factory-summary {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 10px;
    padding: 4px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.factory-buy-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 10px;
}

.factory-buy-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--bg-1);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 6px 10px;
    cursor: pointer;
    color: #ccc;
    font-size: 0.9rem;
    transition: border-color 0.15s;
}

.factory-buy-btn:hover {
    border-color: var(--accent);
}

.factory-buy-name {
    color: var(--text-0);
}

.factory-buy-stats {
    color: #22c55e;
}

.factory-buy-cost {
    color: #fbbf24;
}

.factory-section-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.factory-machine-list {
    margin-bottom: 8px;
    max-height: 200px;
    overflow-y: auto;
}

.factory-empty {
    color: #555;
    text-align: center;
    padding: 10px;
}

.factory-machine-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 6px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.factory-machine-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.factory-machine-name {
    color: var(--text-0);
    font-size: 0.9rem;
}

.factory-machine-stats {
    color: #22c55e;
    font-size: 0.9rem;
}

.factory-sell-btn {
    font-size: 0.9rem;
    background: #b45309;
    color: var(--text-0);
    border: none;
    border-radius: 3px;
    padding: 4px 8px;
    cursor: pointer;
}

.factory-sell-btn:hover {
    background: #d97706;
}

.factory-actions {
    display: flex;
    gap: 6px;
}

.factory-actions button {
    flex: 1;
}

.factory-result {
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    min-height: 12px;
}

.nft-panel {
    font-size: 0.9rem;
    color: #ccc;
}

.nft-header {
    text-align: center;
    margin-bottom: 8px;
}

.nft-header span:first-child {
    color: #a855f7;
    font-size: 1rem;
    display: block;
    margin-bottom: 4px;
}

.nft-cost {
    color: #fbbf24;
    font-size: 0.9rem;
}

.nft-collection {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
    margin-bottom: 8px;
}

.nft-collection-badge {
    font-size: 0.9rem;
    padding: 2px 6px;
    border: 1px solid;
    border-radius: 3px;
}

.nft-actions {
    display: flex;
    gap: 6px;
    margin-bottom: 8px;
}

.nft-actions button {
    flex: 1;
}

.nft-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    max-height: 250px;
    overflow-y: auto;
}

.nft-empty {
    color: #555;
    text-align: center;
    padding: 10px;
    grid-column: 1 / -1;
}

.nft-card {
    background: var(--bg-1);
    border: 2px solid;
    border-radius: 6px;
    padding: 8px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.nft-card-rarity {
    font-size: 0.9rem;
    padding: 2px 0;
    border-radius: 3px;
    color: #000;
    font-weight: bold;
}

.nft-card-name {
    font-size: 0.9rem;
    color: var(--text-0);
    line-height: 1.4;
}

.nft-card-value {
    font-size: 0.9rem;
    color: #fbbf24;
}

.nft-sell-btn {
    font-size: 0.9rem;
    background: #b45309;
    color: var(--text-0);
    border: none;
    border-radius: 3px;
    padding: 4px;
    cursor: pointer;
}

.nft-sell-btn:hover {
    background: #d97706;
}

.nft-result {
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    min-height: 12px;
}

@media (max-width: 768px) {
    .nft-grid {
        grid-template-columns: 1fr;
    }
}

.profile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.88);
    z-index: 30000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-box {
    background: var(--bg-2);
    border: 2px solid #e94560;
    border-radius: 12px;
    padding: 24px 20px;
    max-width: 560px;
    width: 92%;
    position: relative;
    box-shadow: 0 0 40px rgba(233, 69, 96, 0.3);
    max-height: 85vh;
    overflow-y: auto;
}

.profile-close {
    position: absolute;
    top: 8px;
    right: 12px;
    color: var(--text-2);
    font-size: 0.9rem;
    cursor: pointer;
}

.profile-close:hover {
    color: var(--accent);
}

.profile-name {
    font-size: 1.1rem;
    color: var(--accent);
    text-align: center;
    margin-bottom: 16px;
    line-height: 1.6;
}

.profile-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.profile-stat {
    background: rgba(255,255,255,0.05);
    border-radius: 4px;
    padding: 6px 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.profile-stat-label {
    font-size: 0.9rem;
    color: var(--text-3);
}

.profile-stat-value {
    font-size: 1rem;
    color: #ccc;
}

@media (max-width: 768px) {
    .profile-grid {
        grid-template-columns: 1fr;
    }
    .profile-box {
        padding: 16px 10px;
        max-height: 90vh;
    }
    .profile-tier-header {
        font-size: 0.85rem !important;
    }
    .profile-field-input {
        font-size: 0.85rem !important;
    }
}

.profile-rank {
    font-size: 0.9rem;
    text-align: center;
    margin-bottom: 4px;
}

.profile-wanted {
    font-size: 1rem;
    color: #ef4444;
    text-align: center;
    margin-bottom: 8px;
    text-shadow: 0 0 8px rgba(239, 68, 68, 0.5);
}

.profile-section-title {
    font-size: 0.9rem;
    color: var(--accent);
    margin: 14px 0 6px 0;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(233, 69, 96, 0.3);
}

.profile-personal-notice {
    font-size: 0.9rem;
    color: var(--text-3);
    margin: 6px 0 10px 0;
    line-height: 1.6;
}

.profile-personal-form {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.profile-tier {
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    overflow: hidden;
}

.profile-tier summary {
    cursor: pointer;
    list-style: none;
}

.profile-tier summary::-webkit-details-marker {
    display: none;
}

.profile-tier-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    font-size: 0.9rem;
    color: #ccc;
    cursor: pointer;
    transition: background 0.15s;
}

.profile-tier-header:hover {
    background: rgba(255,255,255,0.05);
}

.profile-tier-title {
    display: flex;
    align-items: center;
    gap: 6px;
}

.profile-tier-count {
    font-size: 0.9rem;
    color: var(--text-0);
    padding: 2px 6px;
    border-radius: 3px;
}

.profile-tier-fields {
    padding: 6px 10px 10px 13px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.profile-field-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.profile-field-label {
    font-size: 0.9rem;
    color: var(--text-3);
}

.profile-field-input {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.9rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

.profile-field-input:focus {
    border-color: var(--accent);
    background: rgba(255,255,255,0.12);
}

.profile-field-input::placeholder {
    color: #444;
    font-size: 0.9rem;
}

.profile-form-actions {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.profile-progress {
    width: 100%;
    height: 6px;
    background: rgba(255,255,255,0.1);
    border-radius: 3px;
    overflow: hidden;
}

.profile-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #22c55e, #fbbf24, #ef4444);
    border-radius: 3px;
    transition: width 0.3s;
}

.profile-progress-text {
    font-size: 0.9rem;
    color: var(--text-3);
}

.profile-save-btn {
    font-size: 0.9rem;
    color: var(--text-0);
    background: var(--accent);
    border: none;
    border-radius: 4px;
    padding: 8px 16px;
    cursor: pointer;
    transition: background 0.15s;
    width: 100%;
}

.profile-save-btn:hover {
    background: #d63851;
}

#profileSaveResult {
    font-size: 0.9rem;
    min-height: 14px;
}

.turk-panel {
    font-size: 0.9rem;
    color: #ccc;
}

.turk-header {
    text-align: center;
    margin-bottom: 8px;
}

.turk-header span:first-child {
    color: var(--accent);
    font-size: 1rem;
    display: block;
}

.turk-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}

.turk-stats {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.turk-task-area {
    min-height: 120px;
    margin-bottom: 8px;
}

.turk-idle {
    color: #555;
    text-align: center;
    padding: 30px 0;
}

.turk-task-type {
    color: #fbbf24;
    font-size: 0.9rem;
    margin-bottom: 10px;
    text-align: center;
}

.turk-captcha-display {
    font-size: 1.5rem;
    letter-spacing: 8px;
    text-align: center;
    padding: 16px;
    background: var(--bg-1);
    border-radius: 6px;
    margin-bottom: 8px;
    color: var(--accent);
    font-family: 'Press Start 2P', cursive;
    transform: rotate(-2deg) skewX(-5deg);
    user-select: none;
}

.turk-prompt {
    font-size: 0.9rem;
    color: #ccc;
    margin-bottom: 8px;
    line-height: 1.8;
    text-align: center;
}

.turk-audio-text {
    font-size: 0.9rem;
    color: #22c55e;
    font-style: italic;
    text-align: center;
    margin-bottom: 8px;
}

.turk-input {
    width: 100%;
    font-size: 0.9rem;
    padding: 8px;
    background: var(--bg-1);
    color: var(--text-0);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    text-align: center;
    box-sizing: border-box;
}

.turk-options {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.turk-option-btn {
    font-size: 0.9rem;
    background: var(--bg-1);
    color: #aaa;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 8px;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s, color 0.15s;
}

.turk-option-btn:hover {
    border-color: var(--accent);
    color: var(--text-0);
}

.turk-option-btn.selected {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(233,69,96,0.1);
}

.turk-controls {
    display: flex;
    gap: 6px;
}

.turk-controls button {
    flex: 1;
}

.turk-result {
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    min-height: 12px;
}

.rat-panel {
    font-size: 0.9rem;
    color: #ccc;
}

.rat-header {
    text-align: center;
    margin-bottom: 8px;
}

.rat-header span:first-child {
    color: #a855f7;
    font-size: 0.9rem;
    display: block;
}

.rat-subtitle {
    color: var(--text-2);
    font-size: 0.9rem;
}

.rat-stats {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    flex-wrap: wrap;
    gap: 4px;
}

.rat-section-title {
    font-size: 0.9rem;
    color: #a855f7;
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.rat-targets {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin-bottom: 10px;
}

.rat-target-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    background: var(--bg-1);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    padding: 6px;
    cursor: pointer;
    color: #ccc;
    transition: border-color 0.15s;
}

.rat-target-btn:hover {
    border-color: #a855f7;
}

.rat-target-btn.rat-disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}

.rat-target-btn.rat-hacking {
    border-color: #a855f7;
    pointer-events: none;
    position: relative;
}

.rat-target-btn.rat-hacking .rat-target-time {
    display: none;
}

.rat-progress-wrap {
    width: 100%;
    height: 6px;
    background: #0f172a;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 2px;
}

.rat-progress-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #a855f7, #c084fc);
    border-radius: 3px;
    transition: width 0.1s linear;
}

.rat-target-btn:not(.rat-hacking) .rat-progress-wrap {
    display: none;
}

.rat-target-name {
    font-size: 0.9rem;
    color: var(--text-0);
}

.rat-target-reward {
    font-size: 0.9rem;
    color: #fbbf24;
}

.rat-target-time {
    font-size: 0.9rem;
    color: var(--text-2);
}

.rat-stash {
    max-height: 150px;
    overflow-y: auto;
    margin-bottom: 8px;
}

.rat-empty {
    color: #555;
    text-align: center;
    padding: 8px;
    font-size: 0.9rem;
}

.rat-stash-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 6px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.rat-stash-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.rat-stash-name {
    color: var(--text-0);
    font-size: 0.9rem;
}

.rat-stash-items {
    color: var(--text-2);
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rat-stash-value {
    color: #fbbf24;
    font-size: 0.9rem;
}

.rat-sell-btn {
    font-size: 0.9rem;
    background: #b45309;
    color: var(--text-0);
    border: none;
    border-radius: 3px;
    padding: 4px 8px;
    cursor: pointer;
    flex-shrink: 0;
}

.rat-sell-btn:hover {
    background: #d97706;
}

.rat-actions {
    display: flex;
    gap: 6px;
}

.rat-actions button {
    flex: 1;
}

.rat-result {
    font-size: 0.9rem;
    text-align: center;
    margin-top: 6px;
    min-height: 12px;
}

@media (max-width: 768px) {
    .rat-targets {
        grid-template-columns: 1fr;
    }
}

.security-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.security-header {
    font-size: 0.9rem;
    color: var(--accent);
    text-align: center;
}

.security-subtitle {
    font-size: 0.9rem;
    color: var(--text-3);
    text-align: center;
    line-height: 1.6;
}

.security-status {
    text-align: center;
    font-size: 0.9rem;
    padding: 8px;
    background: rgba(255,255,255,0.05);
    border-radius: 6px;
}

.security-keys {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.security-no-keys {
    text-align: center;
    color: #555;
    font-size: 0.9rem;
    padding: 10px;
}

.security-key-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(255,255,255,0.05);
    border-radius: 6px;
    padding: 8px 10px;
    gap: 8px;
}

.security-key-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.security-key-name {
    color: #fbbf24;
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.security-key-date {
    color: #555;
    font-size: 0.9rem;
}

.security-key-remove {
    font-size: 0.9rem;
    color: #ef4444;
    background: none;
    border: 1px solid #ef4444;
    border-radius: 3px;
    padding: 4px 8px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}

.security-key-remove:hover {
    background: #ef4444;
    color: var(--text-0);
}

.security-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.security-register-section,
.security-verify-section {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.security-field-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.security-field-label {
    font-size: 0.9rem;
    color: var(--text-3);
}

.security-input {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.9rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

.security-input:focus {
    border-color: var(--accent);
}

.security-input::placeholder {
    color: #444;
    font-size: 0.9rem;
}

.security-divider {
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin: 4px 0;
}

.security-btn {
    font-size: 0.9rem;
    color: var(--text-0);
    border: none;
    border-radius: 4px;
    padding: 10px;
    cursor: pointer;
    transition: background 0.15s;
    width: 100%;
}

.security-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.security-btn-register {
    background: #3b82f6;
}

.security-btn-register:hover:not(:disabled) {
    background: #2563eb;
}

.security-btn-verify {
    background: #22c55e;
}

.security-btn-verify:hover:not(:disabled) {
    background: #16a34a;
}

.security-result,
.security-verify-result {
    text-align: center;
    font-size: 0.9rem;
    min-height: 14px;
}

@media (max-width: 768px) {
    .security-panel {
        font-size: 0.85rem;
    }
    .security-input {
        font-size: 0.85rem;
    }
    .security-btn {
        font-size: 0.85rem;
    }
}

.bounty-panel {
    font-size: 0.9rem;
    color: #ccc;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

 .bounty-header {
     font-size: 1rem;
     color: #fbbf24;
     text-align: center;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 12px;
 }

.bounty-bell {
    position: relative;
    cursor: pointer;
    font-size: 1.4rem;
}

.bounty-bell-badge {
    position: absolute;
    top: -6px;
    right: -8px;
    background: #ef4444;
    color: var(--text-0);
    font-size: 0.9rem;
    border-radius: 8px;
    padding: 2px 5px;
    min-width: 16px;
    text-align: center;
}

.bounty-card-unread {
    border-left: 3px solid #fbbf24 !important;
    background: rgba(251, 191, 36, 0.06) !important;
}

.bounty-card-resolved {
    border-left: 2px solid rgba(255,255,255,0.1);
}

.bounty-reply-council {
    border-left: 2px solid #fbbf24;
    background: rgba(251, 191, 36, 0.04);
}

.bounty-notif-row {
    margin-top: 8px;
    text-align: center;
}

.bounty-notif-label {
    font-size: 0.9rem;
    color: #555;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bounty-notif-label input {
    cursor: pointer;
}

.bounty-subtitle {
    font-size: 0.9rem;
    color: var(--text-3);
    text-align: center;
    line-height: 1.8;
}

.bounty-chasers-header {
    font-size: 0.9rem;
    color: #fbbf24;
    text-align: center;
    padding: 8px 0 6px;
    border-top: 1px solid #333;
    margin-top: 6px;
    letter-spacing: 1px;
}

.bounty-chasers-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 8px;
}

.bounty-chasers-card {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    border-left: 3px solid #444;
}

.bounty-chasers-first {
    border-left-color: #fbbf24;
    background: linear-gradient(90deg, #1a1a0e, #1a1a2e);
}

.bounty-chasers-second {
    border-left-color: #c0c0c0;
}

.bounty-chasers-third {
    border-left-color: #cd7f32;
}

.bounty-chasers-rank {
    font-size: 0.9rem;
    color: var(--text-3);
    min-width: 24px;
    text-align: center;
}

.bounty-chasers-first .bounty-chasers-rank {
    color: #fbbf24;
}

.bounty-chasers-badge {
    font-size: 1.2rem;
    min-width: 24px;
    text-align: center;
}

.bounty-chasers-info {
    flex: 1;
    min-width: 0;
}

.bounty-chasers-name {
    font-size: 0.9rem;
    color: #e2e8f0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bounty-chasers-title {
    font-size: 0.7rem;
    margin-top: 2px;
}

.bounty-chasers-stats {
    text-align: right;
    flex-shrink: 0;
}

.bounty-chasers-bro {
    font-size: 0.9rem;
    color: #fbbf24;
}

.bounty-chasers-count {
    font-size: 0.7rem;
    color: var(--text-3);
    margin-top: 2px;
}

.bounty-payout-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.bounty-payout-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid;
    border-radius: 6px;
    padding: 10px;
    text-align: center;
}

.bounty-payout-sev {
    font-size: 1rem;
    margin-bottom: 4px;
}

.bounty-payout-amount {
    font-size: 0.9rem;
    color: #fbbf24;
}

.bounty-payout-desc {
    font-size: 0.9rem;
    color: #555;
    margin-top: 2px;
}

.bounty-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bounty-field-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bounty-field-label {
    font-size: 0.9rem;
    color: var(--text-3);
}

.bounty-input {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 1rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

.bounty-input:focus {
    border-color: #fbbf24;
}

.bounty-input::placeholder {
    color: #444;
    font-size: 0.9rem;
}

.bounty-textarea {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 0.9rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
    min-height: 60px;
    max-height: 140px;
}

.bounty-textarea:focus {
    border-color: #fbbf24;
}

.bounty-textarea::placeholder {
    color: #444;
    font-size: 0.9rem;
}

.bounty-select {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 1rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
}

.bounty-cost-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255,255,255,0.03);
    border-radius: 4px;
    padding: 8px 10px;
}

.bounty-cost-label {
    font-size: 0.9rem;
    color: var(--text-3);
}

.bounty-cost-value {
    font-size: 1rem;
    color: #ef4444;
}

.bounty-submit-btn {
    font-size: 0.9rem;
    color: #000;
    background: #fbbf24;
    border: none;
    border-radius: 4px;
    padding: 12px;
    cursor: pointer;
    transition: background 0.15s;
    width: 100%;
}

.bounty-submit-btn:hover:not(:disabled) {
    background: #f59e0b;
}

.bounty-submit-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.bounty-result {
    text-align: center;
    font-size: 1rem;
    min-height: 18px;
    line-height: 1.6;
}

.bounty-divider {
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin: 4px 0;
}

.bounty-list-header {
    font-size: 0.9rem;
    color: var(--accent);
}

.bounty-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 280px;
    overflow-y: auto;
}

.bounty-empty {
    text-align: center;
    color: #555;
    font-size: 0.9rem;
    padding: 14px;
}

.bounty-card {
    background: rgba(255,255,255,0.04);
    border-radius: 6px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.bounty-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.bounty-card-payout-row {
    font-size: 0.9rem;
    padding: 3px 0;
}

.bounty-card-title {
    font-size: 1rem;
    color: #ccc;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

 .bounty-card-sev {
     font-size: 0.9rem;
     border: 1px solid;
     border-radius: 3px;
     padding: 3px 8px;
     white-space: nowrap;
     flex-shrink: 0;
 }

.bounty-card-retard {
    font-size: 0.9rem;
    color: var(--text-0);
    background: #ef4444;
    border-radius: 3px;
    padding: 3px 6px;
    white-space: nowrap;
    flex-shrink: 0;
    animation: bounty-retard-flash 1s infinite;
}

@keyframes bounty-retard-flash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

.bounty-retard-badge {
    font-size: 0.9rem;
    color: var(--text-0);
    background: #ef4444;
    border-radius: 4px;
    padding: 4px 10px;
    margin-left: 8px;
}

.bounty-card-desc {
    font-size: 0.9rem;
    color: var(--text-3);
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bounty-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
}

.bounty-card-user {
    font-size: 0.9rem;
    color: var(--text-2);
}

.bounty-card-payout {
    font-size: 0.9rem;
    color: #fbbf24;
}

.bounty-card-meta {
    font-size: 0.9rem;
    color: var(--text-3);
}

.bounty-card-date {
    font-size: 0.9rem;
    color: #555;
}

.bounty-card-open {
    cursor: pointer;
    transition: background 0.15s;
}

.bounty-card-open:hover {
    background: rgba(255,255,255,0.07);
}

.bounty-card-resolved {
    opacity: 0.7;
    cursor: pointer;
}

.bounty-card-resolved:hover {
    opacity: 1;
}

.bounty-card-sev-pending {
    animation: bounty-pulse 2s infinite;
}

@keyframes bounty-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.bounty-thread-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.88);
    z-index: 30001;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bounty-thread-box {
    background: var(--bg-2);
    border: 2px solid #fbbf24;
    border-radius: 12px;
    padding: 32px 28px;
    max-width: 700px;
    width: 94%;
    position: relative;
    box-shadow: 0 0 40px rgba(251, 191, 36, 0.2);
    max-height: 88vh;
    overflow-y: auto;
}

.bounty-thread-close {
    position: absolute;
    top: 10px;
    right: 14px;
    color: var(--text-2);
    font-size: 1.1rem;
    cursor: pointer;
}

.bounty-thread-close:hover {
    color: #fbbf24;
}

.bounty-thread-id {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 4px;
}

.bounty-thread-loading,
.bounty-thread-error {
    font-size: 0.9rem;
    text-align: center;
    color: var(--text-2);
    padding: 30px 0;
}

.bounty-thread-error {
    color: #ef4444;
}

.bounty-thread-title {
    font-size: 1.05rem;
    color: #fbbf24;
    margin-bottom: 8px;
    line-height: 1.5;
    padding-right: 28px;
}

.bounty-thread-meta {
    font-size: 0.9rem;
    color: var(--text-3);
    margin-bottom: 8px;
}

.bounty-thread-author {
    color: var(--accent);
}

.bounty-thread-status {
    font-size: 1rem;
    margin-bottom: 10px;
}

.bounty-thread-desc {
    font-size: 1rem;
    color: #aaa;
    line-height: 1.8;
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 10px;
}

.bounty-thread-claimed {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 10px;
}

.bounty-thread-resolved {
    font-size: 0.9rem;
    text-align: center;
    padding: 14px;
    border: 1px solid;
    border-radius: 6px;
    margin-bottom: 12px;
    background: rgba(255,255,255,0.03);
}

.bounty-thread-divider {
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin: 10px 0;
}

.bounty-thread-replies-header {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 8px;
}

.bounty-thread-replies {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 260px;
    overflow-y: auto;
    margin-bottom: 10px;
}

.bounty-reply {
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    padding: 8px 12px;
}

.bounty-reply-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.bounty-reply-author {
    font-size: 0.9rem;
    color: var(--accent);
}

.bounty-reply-date {
    font-size: 0.9rem;
    color: #555;
}

.bounty-reply-msg {
    font-size: 0.9rem;
    color: #aaa;
    line-height: 1.7;
}

.bounty-reply-empty {
    font-size: 0.9rem;
    color: #555;
    text-align: center;
    padding: 10px;
}

.bounty-reply-form {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.bounty-reply-textarea {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 0.9rem;
    color: #ccc;
    outline: none;
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
    min-height: 50px;
    max-height: 100px;
}

.bounty-reply-textarea:focus {
    border-color: #fbbf24;
}

.bounty-reply-textarea::placeholder {
    color: #444;
    font-size: 0.9rem;
}

.bounty-reply-btn {
    font-size: 0.9rem;
    color: #1a1a2e;
    background: #fbbf24;
    border: none;
    border-radius: 4px;
    padding: 10px;
    cursor: pointer;
    width: 100%;
}

.bounty-reply-btn:hover {
    background: #f59e0b;
}

.bounty-thread-result {
    font-size: 0.9rem;
    text-align: center;
    min-height: 16px;
    margin-top: 6px;
}

.bounty-announce-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    z-index: 40001;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bounty-announce-box {
    background: var(--bg-2);
    border: 2px solid #fbbf24;
    border-radius: 14px;
    padding: 32px 28px;
    max-width: 520px;
    width: 90%;
    text-align: center;
    box-shadow: 0 0 60px rgba(251, 191, 36, 0.3);
}

.bounty-announce-emoji {
    font-size: 3rem;
    margin-bottom: 12px;
}

.bounty-announce-title {
    font-size: 1.1rem;
    color: #fbbf24;
    margin-bottom: 16px;
    line-height: 1.4;
}

.bounty-announce-body {
    font-size: 1rem;
    color: #ccc;
    line-height: 2;
    margin-bottom: 16px;
}

.bounty-announce-body b {
    color: var(--text-0);
}

.bounty-announce-highlight {
    color: #22c55e;
    font-weight: bold;
}

.bounty-announce-retard {
    color: #ef4444;
    font-weight: bold;
}

.bounty-announce-payouts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-bottom: 20px;
}

.bounty-announce-pill {
    font-size: 0.9rem;
    border: 1px solid;
    border-radius: 4px;
    padding: 4px 8px;
}

.bounty-announce-btn {
    font-size: 0.9rem;
    color: #000;
    background: #fbbf24;
    border: none;
    border-radius: 6px;
    padding: 12px 24px;
    cursor: pointer;
    display: block;
    width: 100%;
    margin-bottom: 10px;
    transition: background 0.15s;
}

.bounty-announce-btn:hover {
    background: #f59e0b;
}

.bounty-announce-dismiss {
    font-size: 0.9rem;
    color: #555;
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.15s;
}

.bounty-announce-dismiss:hover {
    color: var(--text-2);
}

@media (max-width: 768px) {
    .bounty-payout-grid {
        grid-template-columns: 1fr 1fr;
    }
 .fsim-panel {
     border: 3px solid #22c55e;
     border-radius: 12px;
     padding: 12px;
     background: linear-gradient(180deg, #0a1a0a 0%, #0a0a1a 100%);
     margin: 4px auto;
     width: 100%;
     text-align: center;
     color: #22c55e;
 }

.fsim-header {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
    color: #22c55e;
    font-size: 0.85rem;
}

.fsim-subtitle {
    color: var(--text-2);
    font-size: 0.85rem;
}

.fsim-hud-top {
    display: flex;
    justify-content: space-around;
    padding: 6px 4px;
    background: #000;
    border: 1px solid #22c55e;
    border-radius: 4px;
    margin-bottom: 6px;
}

.fsim-hud-stat {
    font-size: 0.85rem;
    color: #22c55e;
}

.fsim-hud-stat span {
    color: var(--text-0);
}

#fsimCanvas {
    width: 100%;
    display: block;
    border: 1px solid #22c55e;
    border-radius: 4px;
    background: #000;
    margin-bottom: 6px;
}

.fsim-controls {
    font-size: 0.85rem;
    color: var(--text-3);
    margin-bottom: 6px;
}

.fsim-bottom-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fsim-high-score {
    font-size: 0.85rem;
    color: #fbbf24;
}

.fsim-high-score span {
    color: var(--text-0);
}

.fsim-start-btn {
    font-size: 0.85rem;
    color: var(--text-0);
    background: #22c55e;
    border: 2px solid #16a34a;
    border-radius: 4px;
    padding: 8px 14px;
    cursor: pointer;
}

.fsim-start-btn:hover {
    background: #16a34a;
}

    .bounty-panel {
        font-size: 0.85rem;
    }
    .bounty-chasers-name {
        font-size: 0.75rem;
    }
    .bounty-chasers-bro {
        font-size: 0.75rem;
    }
    .bounty-chasers-title {
        font-size: 0.6rem;
    }
    .bounty-chasers-count {
        font-size: 0.6rem;
    }
    .bounty-chasers-header {
        font-size: 0.75rem;
    }
    .bounty-input, .bounty-textarea, .bounty-select {
        font-size: 0.85rem;
    }
    .bounty-submit-btn {
        font-size: 0.85rem;
    }
    .bounty-thread-box {
        padding: 18px 12px;
        max-height: 90vh;
    }
    .bounty-announce-box {
        padding: 20px 14px;
    }
    .bounty-announce-title {
        font-size: 0.85rem;
    }
    .bounty-announce-body {
        font-size: 0.85rem;
    }
    .bounty-announce-btn {
        font-size: 0.85rem;
    }
    .bounty-announce-pill {
        font-size: 0.85rem;
    }
}

.wm-launcher {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 50000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 20vh;
}
.wm-launcher-box {
    width: 480px;
    max-width: 90vw;
    background: var(--bg-2);
    border: 2px solid #e94560;
    border-radius: 12px;
    box-shadow: 0 8px 40px rgba(233, 69, 96, 0.3);
    overflow: hidden;
}
.wm-launcher-input {
    width: 100%;
    box-sizing: border-box;
    padding: 14px 18px;
    font-size: 0.9rem;
    color: var(--text-0);
    background: rgba(0,0,0,0.3);
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    outline: none;
}
.wm-launcher-input::placeholder {
    color: #555;
}
.wm-launcher-results {
    max-height: 50vh;
    overflow-y: auto;
}
.wm-launcher-item {
    padding: 10px 18px;
    font-size: 0.9rem;
    color: #ccc;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}
.wm-launcher-item:hover,
.wm-launcher-item.wm-launcher-active {
    background: rgba(233, 69, 96, 0.2);
    color: var(--text-0);
}
.wm-launcher-item .wm-start-menu-icon {
    font-size: 1rem;
}

.wm-start-search {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    font-size: 0.9rem;
    color: var(--text-0);
    background: rgba(0,0,0,0.3);
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    outline: none;
}
.wm-start-search::placeholder {
    color: #555;
}
.wm-start-menu-list {
    max-height: 60vh;
    overflow-y: auto;
}
.wm-start-menu-tip {
    font-size: 0.9rem;
    color: #444;
    text-align: center;
    padding: 6px 8px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

/* ===== Wiki / Flattenpedia ===== */
.wiki-panel {
    font-size: 0.65rem;
    color: #c9d1d9;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #0d1117;
}

.wiki-chrome {
    background: #161b22;
    border-bottom: 2px solid #30363d;
    padding: 6px 8px;
    flex-shrink: 0;
}
.wiki-chrome-bar {
    display: flex;
    align-items: center;
    gap: 6px;
}
.wiki-chrome-nav {
    display: flex;
    gap: 3px;
    flex-shrink: 0;
}
.wiki-nav-btn {
    background: #21262d;
    border: 1px solid #30363d;
    color: #c9d1d9;
    font-size: 0.7rem;
    padding: 4px 6px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s;
    line-height: 1;
}
.wiki-nav-btn:hover {
    background: #30363d;
}
.wiki-url-bar {
    flex: 1;
    display: flex;
    align-items: center;
    background: #0d1117;
    border: 1px solid #30363d;
    border-radius: 12px;
    padding: 3px 10px;
    gap: 4px;
}
.wiki-url-lock {
    color: #22c55e;
    font-size: 0.6rem;
}
.wiki-url-input {
    flex: 1;
    background: none;
    border: none;
    color: #8b949e;
    font-size: 0.55rem;
    outline: none;
}
.wiki-search-results {
    background: #161b22;
    border: 1px solid #30363d;
    border-radius: 6px;
    margin-top: 4px;
    max-height: 200px;
    overflow-y: auto;
    position: relative;
    z-index: 10;
}
.wiki-search-result {
    padding: 6px 10px;
    cursor: pointer;
    border-bottom: 1px solid #21262d;
}
.wiki-search-result:hover {
    background: #1f2937;
}
.wiki-search-title {
    color: var(--accent);
    font-size: 0.6rem;
}
.wiki-search-excerpt {
    color: #8b949e;
    font-size: 0.5rem;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wiki-search-result-empty {
    padding: 10px;
    color: #8b949e;
    text-align: center;
    font-size: 0.6rem;
}

.wiki-body {
    flex: 1;
    display: flex;
    overflow: hidden;
}

.wiki-sidebar {
    width: 160px;
    min-width: 160px;
    background: #0d1117;
    border-right: 2px solid #21262d;
    overflow-y: auto;
    padding: 8px 6px;
    flex-shrink: 0;
}
.wiki-sidebar-logo {
    text-align: center;
    padding: 8px 4px 12px;
    border-bottom: 1px solid #21262d;
    margin-bottom: 8px;
}
.wiki-logo-text {
    font-size: 1.8rem;
    color: var(--accent);
    line-height: 1;
}
.wiki-logo-sub {
    font-size: 0.45rem;
    color: #8b949e;
    margin-top: 4px;
    letter-spacing: 1px;
}
.wiki-sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.wiki-sidebar-link {
    padding: 5px 6px;
    color: #8b949e;
    cursor: pointer;
    border-radius: 4px;
    font-size: 0.5rem;
    line-height: 1.4;
    transition: all 0.15s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wiki-sidebar-link:hover {
    background: #161b22;
    color: #c9d1d9;
}
.wiki-sidebar-link.wiki-sidebar-active {
    background: #1f2937;
    color: var(--accent);
    border-left: 2px solid #e94560;
}
.wiki-sidebar-footer {
    margin-top: 12px;
    padding-top: 8px;
    border-top: 1px solid #21262d;
    font-size: 0.4rem;
    color: #444;
    text-align: center;
    line-height: 1.6;
}

.wiki-content-area {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
}
.wiki-search-inline {
    margin-bottom: 10px;
}
.wiki-search-input {
    width: 100%;
    background: #161b22;
    border: 1px solid #30363d;
    color: #c9d1d9;
    font-size: 0.6rem;
    padding: 6px 10px;
    border-radius: 6px;
    outline: none;
}
.wiki-search-input:focus {
    border-color: var(--accent);
}
.wiki-search-input::placeholder {
    color: #484f58;
}

.wiki-article-title {
    font-size: 1.1rem;
    color: var(--accent);
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid #21262d;
    line-height: 1.4;
}
.wiki-article-content {
    line-height: 1.8;
}
.wiki-article-content h1 {
    display: none;
}
.wiki-article-content h2 {
    font-size: 0.85rem;
    color: var(--accent);
    margin: 16px 0 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #21262d;
}
.wiki-article-content h3 {
    font-size: 0.75rem;
    color: #f0883e;
    margin: 12px 0 6px;
}
.wiki-article-content p {
    margin: 6px 0;
    color: #c9d1d9;
    font-size: 0.65rem;
}
.wiki-article-content ul,
.wiki-article-content ol {
    margin: 6px 0;
    padding-left: 16px;
}
.wiki-article-content li {
    margin: 4px 0;
    font-size: 0.65rem;
}
.wiki-article-content strong {
    color: #f0f6fc;
}
.wiki-article-content em {
    color: #d2a8ff;
    font-style: italic;
}
.wiki-article-content a,
.wiki-article-content .wiki-internal-link {
    color: var(--accent);
    text-decoration: none;
    cursor: pointer;
    border-bottom: 1px dotted #e94560;
}
.wiki-article-content a:hover,
.wiki-article-content .wiki-internal-link:hover {
    color: #ff6b81;
    border-bottom-style: solid;
}
.wiki-article-content hr {
    border: none;
    border-top: 1px solid #21262d;
    margin: 12px 0;
}
.wiki-article-content code {
    background: #161b22;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.6rem;
    color: #f0883e;
}
.wiki-article-content pre {
    background: #161b22;
    padding: 10px;
    border-radius: 6px;
    overflow-x: auto;
    border: 1px solid #30363d;
    margin: 8px 0;
}
.wiki-article-content pre code {
    background: none;
    padding: 0;
    color: #c9d1d9;
}
.wiki-article-content .wiki-table,
.wiki-article-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 8px 0;
    font-size: 0.55rem;
}
.wiki-article-content .wiki-table td,
.wiki-article-content table td,
.wiki-article-content .wiki-table th,
.wiki-article-content table th {
    border: 1px solid #30363d;
    padding: 4px 8px;
    text-align: left;
}
.wiki-article-content .wiki-table tr:nth-child(odd),
.wiki-article-content table tr:nth-child(odd) {
    background: #161b22;
}

.wiki-loading {
    text-align: center;
    color: #484f58;
    padding: 40px;
    font-size: 0.7rem;
}
.wiki-error {
    text-align: center;
    color: var(--accent);
    padding: 40px;
    font-size: 0.7rem;
    line-height: 2;
}

@media (max-width: 768px) {
    .wiki-sidebar {
        display: none;
    }
    .wiki-chrome-bar {
        flex-wrap: wrap;
    }
    .wiki-url-bar {
        min-width: 0;
    }
    .wiki-article-title {
        font-size: 0.9rem;
    }
    .wiki-article-content h2 {
        font-size: 0.75rem;
    }
    .wiki-article-content p,
    .wiki-article-content li {
        font-size: 0.6rem;
    }
}

.sales-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 8px;
    border-bottom: 2px solid #333;
}

.sales-tab {
    font-size: 0.9rem;
    padding: 6px 12px;
    background: transparent;
    color: var(--text-2);
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    margin-bottom: -2px;
}

.sales-tab:hover {
    color: #ccc;
}

.sales-tab.active {
    color: var(--accent);
    border-bottom-color: var(--accent);
}

.sales-tab-content {
    font-size: 0.9rem;
    color: #ccc;
}

[data-wm-id="market-dominance"] > .wm-window-content {
    display: flex;
    flex-direction: column;
}

[data-wm-id="deprogram-wiki"] > .wm-window-content {
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.deprogram-wiki-iframe {
    flex: 1;
    min-height: 0;
}

#salesTabFunnel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

#salesTabFunnel > .sales-funnel-panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

#salesTabFunnel .funnel-tiers {
    flex: 1;
    min-height: 0;
}

.reviews-mini {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #333;
}

.reviews-mini-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.reviews-mini-title {
    font-size: 0.9rem;
    color: var(--accent);
}

.reviews-mini-score {
    font-size: 0.9rem;
    color: #fbbf24;
}

.reviews-mini-count {
    font-size: 0.9rem;
    color: var(--text-2);
}

.reviews-mini-list {
    max-height: 120px;
    overflow-y: auto;
}

.review-empty {
    color: var(--text-3);
    font-size: 0.9rem;
    padding: 8px;
    text-align: center;
}

.review-mini-item {
    padding: 4px 6px;
    margin-bottom: 3px;
    border-radius: 3px;
    background: var(--bg-2);
    border-left: 3px solid #555;
    display: flex;
    gap: 6px;
    align-items: flex-start;
}

.review-mini-item.review-positive { border-left-color: #22c55e; }
.review-mini-item.review-negative { border-left-color: #ef4444; }
.review-mini-item.review-counterfeit { border-left-color: #f59e0b; }
.review-mini-item.review-fake { border-left-color: #a855f7; }

.review-mini-stars {
    color: #fbbf24;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.review-mini-text {
    color: #aaa;
    font-size: 0.9rem;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-funnel-panel {
    padding-top: 4px;
}

.funnel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    margin-bottom: 6px;
    border-bottom: 1px solid #333;
}

.funnel-title {
    font-size: 0.9rem;
    color: #22d3ee;
}

.funnel-bonus {
    font-size: 0.9rem;
    color: #22c55e;
}

.funnel-tiers {
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto;
}

.funnel-tier {
    padding: 6px 8px;
    background: var(--bg-2);
    border-radius: 4px;
    border-left: 3px solid #334155;
}

.funnel-tier.funnel-owned {
    border-left-color: #22c55e;
    opacity: 0.7;
}

.funnel-tier-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3px;
}

.funnel-tier-name {
    font-size: 0.9rem;
    color: #e2e8f0;
}

.funnel-tier-cost {
    font-size: 0.9rem;
    color: #fbbf24;
}

.funnel-tier.funnel-owned .funnel-tier-cost {
    color: #22c55e;
}

.funnel-tier-desc {
    font-size: 0.9rem;
    color: var(--text-2);
    margin-bottom: 3px;
    line-height: 1.5;
}

.funnel-tier-bonus {
    font-size: 0.9rem;
    color: #22d3ee;
    margin-bottom: 4px;
}

.funnel-buy-btn {
    font-size: 0.9rem;
    padding: 4px 10px;
    background: #0f3460;
    color: #22d3ee;
    border: 1px solid #22d3ee;
    border-radius: 4px;
    cursor: pointer;
}

.funnel-buy-btn:hover {
    background: #1a4a7a;
}

.funnel-buy-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.funnel-result {
    font-size: 0.9rem;
    color: #22c55e;
    padding: 4px 0;
    min-height: 1.4em;
}

.counterfeit-panel {
    padding-top: 4px;
    position: relative;
}

.counterfeit-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    flex-wrap: wrap;
}

.counterfeit-title {
    font-size: 0.9rem;
    color: #f59e0b;
}

.counterfeit-count {
    font-size: 0.9rem;
    color: var(--text-2);
}

.counterfeit-revenue {
    font-size: 0.9rem;
    color: #22c55e;
    margin-left: auto;
}

.counterfeit-desc {
    font-size: 0.9rem;
    color: var(--text-2);
    line-height: 1.5;
    margin-bottom: 8px;
}

.counterfeit-stats-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.suspicion-block {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
}

.suspicion-label {
    font-size: 0.9rem;
    color: #f59e0b;
    white-space: nowrap;
}

.suspicion-bar-wrap {
    flex: 1;
    height: 10px;
    background: #0f172a;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid var(--border);
}

.suspicion-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #f59e0b, #ef4444);
    border-radius: 5px;
    transition: width 0.3s;
    width: 0%;
}

.counterfeit-bribe-btn {
    font-size: 0.9rem;
    padding: 4px 10px;
    background: var(--bg-2);
    color: #fbbf24;
    border: 1px solid #fbbf24;
    border-radius: 4px;
    cursor: pointer;
    flex-shrink: 0;
}

.counterfeit-bribe-btn:hover {
    background: #2a2a4e;
}

.counterfeit-quality {
    margin-bottom: 8px;
}

.counterfeit-quality-title {
    font-size: 0.9rem;
    color: #ccc;
    margin-bottom: 4px;
}

.counterfeit-quality-options {
    display: flex;
    gap: 4px;
}

.quality-btn {
    flex: 1;
    padding: 6px;
    background: var(--bg-2);
    border: 2px solid #333;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
    transition: border-color 0.15s;
}

.quality-btn:hover {
    border-color: #f59e0b;
}

.quality-btn.quality-selected {
    border-color: #f59e0b;
    background: #2a1a00;
}

.quality-btn-name {
    font-size: 0.9rem;
    color: #f59e0b;
}

.quality-btn-mult {
    font-size: 0.9rem;
    color: #22c55e;
}

.quality-btn-desc {
    font-size: 0.9rem;
    color: var(--text-2);
}

.counterfeit-amount-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.counterfeit-amount-label {
    font-size: 0.9rem;
    color: #ccc;
}

.counterfeit-amount-input {
    font-size: 0.9rem;
    padding: 4px 8px;
    background: #0f172a;
    color: var(--text-0);
    border: 1px solid var(--border);
    border-radius: 4px;
    width: 60px;
    text-align: center;
}

.counterfeit-amount-input:focus {
    border-color: #f59e0b;
    outline: none;
}

.counterfeit-amount-max {
    font-size: 0.9rem;
    color: var(--text-3);
}

.counterfeit-sell-btn {
    font-size: 0.9rem;
    padding: 8px 12px;
    background: #4a1a00;
    color: #f59e0b;
    border: 1px solid #f59e0b;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    margin-bottom: 4px;
}

.counterfeit-sell-btn:hover {
    background: #5a2a10;
}

.counterfeit-result {
    font-size: 0.9rem;
    color: #ef4444;
    padding: 4px 8px;
    position: absolute;
    bottom: 4px;
    left: 0;
    right: 0;
    background: rgba(13, 17, 23, 0.92);
    border-radius: 4px;
    z-index: 2;
    pointer-events: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0;
    transition: opacity 0.2s;
}

.counterfeit-result:not(:empty) {
    opacity: 1;
}

.counterfeit-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #333;
}

.fake-review-btn {
    font-size: 0.9rem;
    padding: 4px 10px;
    background: var(--bg-2);
    color: #a855f7;
    border: 1px solid #a855f7;
    border-radius: 4px;
    cursor: pointer;
}

.fake-review-btn:hover {
    background: #2a2a4e;
}

.fake-review-count {
    font-size: 0.9rem;
    color: var(--text-3);
}

@media (max-width: 768px) {
    .sales-tab {
        font-size: 0.7rem;
        padding: 4px 8px;
    }
    .reviews-mini-list {
        max-height: 80px;
    }
    .funnel-tiers {
        max-height: 300px;
    }
    .funnel-tier-desc {
        font-size: 0.7rem;
    }
    .counterfeit-desc {
        font-size: 0.7rem;
    }
    .quality-btn-name, .quality-btn-mult, .quality-btn-desc {
        font-size: 0.7rem;
    }
    .review-mini-text {
        font-size: 0.7rem;
    }
}

/* ===== Stock Market ===== */
.stock-ticker-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 6px 8px;
    background: #0a0a1e;
    border: 1px solid #1a1a3e;
    border-radius: 4px;
    margin-bottom: 8px;
}
.stock-ticker-item {
    font-size: 0.6rem;
    cursor: pointer;
    white-space: nowrap;
    padding: 2px 4px;
    border-radius: 2px;
}
.stock-ticker-item:hover {
    background: rgba(255,255,255,0.1);
}

.stock-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-bottom: 8px;
}
.stock-grid-item {
    background: var(--bg-1);
    border: 1px solid #0f3460;
    border-radius: 4px;
    padding: 8px 6px;
    cursor: pointer;
    text-align: center;
    transition: border-color 0.2s;
}
.stock-grid-item:hover {
    border-color: var(--accent);
}
.stock-grid-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-bottom: 4px;
}
.stock-grid-emoji {
    font-size: 1rem;
}
.stock-grid-symbol {
    font-size: 0.7rem;
    color: var(--accent);
    font-weight: bold;
}
.stock-grid-name {
    font-size: 0.5rem;
    color: var(--text-2);
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.stock-grid-price {
    font-size: 0.9rem;
    color: var(--text-0);
    margin-bottom: 2px;
}
.stock-grid-change {
    font-size: 0.6rem;
    margin-bottom: 2px;
}
.stock-grid-sector {
    font-size: 0.45rem;
    color: #555;
    text-transform: uppercase;
}

.stock-detail {
}
.stock-detail-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.stock-detail-symbol {
    font-size: 1rem;
    color: var(--accent);
}
.stock-detail-name {
    font-size: 0.7rem;
    color: #ccc;
}
.stock-detail-sector {
    font-size: 0.6rem;
    color: #555;
    margin-left: auto;
}
.stock-detail-price-row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 6px;
}
.stock-detail-price {
    font-size: 1.2rem;
    color: var(--text-0);
}
.stock-detail-change {
    font-size: 0.8rem;
}
.stock-detail-stats {
    display: flex;
    gap: 10px;
    font-size: 0.6rem;
    color: var(--text-2);
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.stock-order-book {
    border: 1px solid #1a1a3e;
    background: #050a1e;
    border-radius: 4px;
    padding: 4px 6px;
    margin-bottom: 8px;
}

.stock-trade-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 6px;
}
.stock-trade-tab {
    flex: 1;
    padding: 6px;
    font-size: 0.8rem;
    border: 1px solid var(--border);
    background: var(--bg-2);
    color: var(--text-2);
    cursor: pointer;
    transition: all 0.2s;
}
.stock-trade-tab:first-child {
    border-radius: 4px 0 0 4px;
}
.stock-trade-tab:last-child {
    border-radius: 0 4px 4px 0;
}
.stock-trade-tab.active {
    background: #0f3460;
    color: var(--text-0);
}
.stock-trade-panel {
    display: none;
    padding: 8px;
    background: #0a0a1e;
    border: 1px solid #1a1a3e;
    border-radius: 4px;
    margin-bottom: 6px;
}
.stock-trade-panel.active {
    display: block;
}
.stock-trade-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.stock-trade-row input {
    background: var(--bg-1);
    border: 1px solid #0f3460;
    color: var(--text-0);
    border-radius: 3px;
}
.stock-trade-row input:focus {
    outline: none;
    border-color: var(--accent);
}
.stock-btn {
    font-size: 0.9rem;
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    transition: opacity 0.2s;
}
.stock-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.stock-buy-btn {
    background: #22c55e;
    color: #000;
}
.stock-buy-btn:hover:not(:disabled) {
    background: #16a34a;
}
.stock-sell-btn {
    background: #ef4444;
    color: var(--text-0);
}
.stock-sell-btn:hover:not(:disabled) {
    background: #dc2626;
}
.stock-trade-feedback {
    font-size: 0.7rem;
    min-height: 14px;
    margin-top: 4px;
}
.stock-back-btn {
    font-size: 0.7rem;
    padding: 6px 12px;
    background: none;
    border: 1px solid var(--border);
    color: var(--text-2);
    cursor: pointer;
    border-radius: 3px;
    width: 100%;
    margin-top: 4px;
}
.stock-back-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.stock-portfolio {
    border-top: 1px solid #1a1a3e;
    padding-top: 8px;
    margin-top: 8px;
}
.stock-portfolio-header {
    font-size: 0.8rem;
    color: #ffd700;
    margin-bottom: 6px;
}
.stock-portfolio-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    border: 1px solid #1a1a3e;
    border-radius: 3px;
    margin-bottom: 4px;
    cursor: pointer;
    font-size: 0.6rem;
    flex-wrap: wrap;
    transition: border-color 0.2s;
}
.stock-portfolio-item:hover {
    border-color: var(--accent);
}
.stock-portfolio-sym {
    color: var(--accent);
    font-weight: bold;
    min-width: 70px;
}
.stock-portfolio-shares {
    color: var(--text-2);
    flex: 1;
}
.stock-portfolio-value {
    color: var(--text-0);
}
.stock-portfolio-pnl {
    min-width: 100px;
    text-align: right;
}
.stock-portfolio-total {
    font-size: 0.9rem;
    color: #ffd700;
    text-align: right;
    padding-top: 4px;
    border-top: 1px solid #1a1a3e;
}
.stock-portfolio-list {
    max-height: 150px;
    overflow-y: auto;
}

#stockChart {
    width: 100%;
    margin-bottom: 6px;
}

@media (max-width: 768px) {
    .stock-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .stock-grid-symbol {
        font-size: 0.6rem;
    }
    .stock-grid-name {
        font-size: 0.45rem;
    }
    .stock-grid-price {
        font-size: 0.7rem;
    }
    .stock-grid-change {
        font-size: 0.5rem;
    }
    .stock-grid-sector {
        font-size: 0.4rem;
    }
    .stock-detail-price {
        font-size: 1rem;
    }
    .stock-detail-change {
        font-size: 0.7rem;
    }
    .stock-detail-stats {
        font-size: 0.5rem;
    }
    .stock-portfolio-item {
        font-size: 0.5rem;
    }
}

#conkyWidget {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 1;
    font-family: 'Press Start 2P', cursive;
    font-size: 12px;
    line-height: 1.5;
    color: #b0b0b0;
    padding: 8px 10px;
    pointer-events: none;
    user-select: none;
    max-width: 310px;
    width: 310px;
}

.conky-title {
    color: var(--accent);
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 6px;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
    letter-spacing: 2px;
}

.conky-section {
    margin-bottom: 4px;
}

.conky-section-title {
    color: #22d3ee;
    font-size: 12px;
    font-weight: bold;
}

.conky-hr {
    height: 1px;
    background: linear-gradient(90deg, #22d3ee, transparent);
    margin: 1px 0 3px 0;
}

.conky-row {
    display: flex;
    justify-content: space-between;
    padding: 0;
}

.conky-label {
    color: #808080;
    flex-shrink: 0;
}

.conky-val {
    color: #d0d0d0;
    text-align: right;
    white-space: nowrap;
}

.conky-val-green {
    color: #22c55e;
}

.conky-val-yellow {
    color: #fbbf24;
}

.conky-val-red {
    color: #ef4444;
}

.conky-val-cyan {
    color: #22d3ee;
}

.conky-bar-wrap {
    height: 4px;
    background: var(--bg-2);
    border-radius: 2px;
    margin: 1px 0 3px 0;
    overflow: hidden;
}

.conky-bar-fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.5s;
}

.conky-bar-green {
    background: linear-gradient(90deg, #22c55e, #16a34a);
}

.conky-bar-cyan {
    background: linear-gradient(90deg, #22d3ee, #06b6d4);
}

.conky-bar-yellow {
    background: linear-gradient(90deg, #fbbf24, #f59e0b);
}

.conky-bar-red {
    background: linear-gradient(90deg, #ef4444, #dc2626);
}

@media (max-width: 768px) {
    #conkyWidget {
        font-size: 9px;
        width: 220px;
        max-width: 220px;
        padding: 4px 6px;
    }
    .conky-title {
        font-size: 10px;
    }
    .conky-section-title {
        font-size: 9px;
    }
}

/* ===== Flat Dog Diner ===== */
.diner-panel {
    width: 100%;
    min-width: 260px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-sizing: border-box;
}
.diner-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 6px;
    border-bottom: 1px solid #333;
}
.diner-header-title {
    font-size: 1rem;
    color: #fbbf24;
}
.diner-rep {
    font-size: 0.9rem;
    color: #22c55e;
}
.diner-slots-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
}
#dinerSlotInfo {
    font-size: 0.85rem;
    color: #aaa;
}
.diner-buy-slot-btn {
    font-size: 0.75rem;
    padding: 4px 8px;
    background: #0f3460;
    color: #22c55e;
    border: 1px solid #22c55e;
    cursor: pointer;
    border-radius: 3px;
}
.diner-buy-slot-btn:hover {
    background: var(--bg-1);
}
.diner-cooking-area {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 40px;
}
.diner-cooking-slot {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    font-size: 0.85rem;
}
.diner-cooking-slot.ready {
    border-color: #22c55e;
    background: #0a2a1a;
}
.diner-slot-label {
    color: var(--text-2);
    min-width: 40px;
    font-size: 0.75rem;
}
.diner-slot-dish {
    flex: 1;
    color: #ddd;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.diner-slot-bar-wrap {
    flex: 1;
    height: 14px;
    background: var(--bg-1);
    border-radius: 7px;
    overflow: hidden;
    min-width: 60px;
}
.diner-slot-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #e94560, #fbbf24);
    border-radius: 7px;
    transition: width 1s linear;
}
.diner-slot-bar-fill.done {
    background: #22c55e;
}
.diner-serve-btn {
    font-size: 0.7rem;
    padding: 4px 8px;
    background: #22c55e;
    color: #000;
    border: none;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
}
.diner-serve-btn:hover {
    background: #16a34a;
}
.diner-divider {
    border-top: 1px solid #333;
    margin: 4px 0;
}
.diner-auto-cook-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    background: #16213e;
    border-radius: 4px;
    margin-bottom: 4px;
}
.diner-auto-label {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.7rem;
    color: #fbbf24;
}
.diner-auto-select {
    flex: 1;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.65rem;
    padding: 4px 6px;
    background: #0f3460;
    color: #e2e8f0;
    border: 1px solid #1a1a2e;
    border-radius: 3px;
    cursor: pointer;
}
.diner-menu-header {
    font-size: 0.9rem;
    color: #fbbf24;
    padding: 2px 0;
}
.diner-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 300px;
    overflow-y: auto;
}
.diner-recipe-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    cursor: pointer;
    transition: border-color 0.15s;
}
.diner-recipe-row:hover {
    border-color: #fbbf24;
}
.diner-recipe-row.locked {
    opacity: 0.4;
    cursor: not-allowed;
}
.diner-recipe-row.locked:hover {
    border-color: #333;
}
.diner-recipe-emoji {
    font-size: 1.2rem;
    min-width: 24px;
    text-align: center;
}
.diner-recipe-info {
    flex: 1;
    min-width: 0;
}
.diner-recipe-name {
    font-size: 0.85rem;
    color: #ddd;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.diner-recipe-details {
    font-size: 0.7rem;
    color: var(--text-2);
    display: block;
    margin-top: 2px;
}
.diner-recipe-cook-btn {
    font-size: 0.7rem;
    padding: 4px 8px;
    background: var(--accent);
    color: var(--text-0);
    border: none;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
}
.diner-recipe-cook-btn:hover {
    background: #c81d42;
}
.diner-recipe-lock-info {
    font-size: 0.7rem;
    color: var(--text-3);
    white-space: nowrap;
}
.diner-empty {
    color: var(--text-3);
    font-size: 0.85rem;
    text-align: center;
    padding: 10px;
}

.fp-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 10px;
}

.fp-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 10px;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    border: 1px solid rgba(233, 69, 96, 0.3);
    border-radius: 6px;
}

.fp-header-left {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fp-season-badge {
    background: linear-gradient(135deg, #e94560, #c23152);
    color: var(--text-0);
    font-size: 0.7rem;
    padding: 3px 8px;
    border-radius: 3px;
    display: inline-block;
    width: fit-content;
}

.fp-season-name {
    color: #ccc;
    font-size: 0.85rem;
}

.fp-season-timer {
    color: var(--text-2);
    font-size: 0.75rem;
}

.fp-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    max-width: 400px;
    flex-wrap: wrap;
}

.fp-premium-btn {
    font-size: 0.6rem;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #000;
    border: none;
    padding: 4px 10px;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
}

.fp-premium-btn:hover {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
}

.fp-premium-badge {
    font-size: 0.6rem;
    color: #f59e0b;
    background: rgba(245, 158, 11, 0.15);
    border: 1px solid #f59e0b44;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.fp-level-display {
    text-align: center;
    min-width: 50px;
}

.fp-level-number {
    color: var(--accent);
    font-size: 1.5rem;
}

.fp-level-label {
    color: var(--text-3);
    font-size: 0.65rem;
}

.fp-xp-bar-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.fp-xp-bar {
    height: 14px;
    background: #0f3460;
    border-radius: 7px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.1);
}

.fp-xp-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #e94560, #ff6b81);
    border-radius: 7px;
    transition: width 0.5s ease;
}

.fp-xp-text {
    color: var(--text-2);
    font-size: 0.65rem;
}

.fp-tabs {
    display: flex;
    gap: 4px;
    padding: 0 4px;
}

.fp-tab {
    flex: 1;
    padding: 8px 6px;
    background: var(--bg-1);
    color: var(--text-2);
    border: 1px solid rgba(255,255,255,0.05);
    border-radius: 4px 4px 0 0;
    font-size: 0.7rem;
    cursor: pointer;
    transition: all 0.2s;
}

.fp-tab:hover {
    background: #1a2744;
    color: #ccc;
}

.fp-tab.active {
    background: #0f3460;
    color: var(--accent);
    border-bottom-color: transparent;
}

.fp-content {
    flex: 1;
    overflow-y: auto;
    background: #0d1117;
    border-radius: 0 0 6px 6px;
    padding: 8px;
}

.fp-tab-content {
    display: none;
}

.fp-loading, .fp-empty {
    color: #555;
    font-size: 0.8rem;
    text-align: center;
    padding: 30px 10px;
}

.fp-rewards-track {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
}

.fp-reward-node {
    width: 82px;
    background: var(--bg-1);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    padding: 6px 4px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    transition: all 0.2s;
    overflow: hidden;
}

.fp-reward-node.fp-reward-current {
    border-color: var(--accent);
    box-shadow: 0 0 10px rgba(233, 69, 96, 0.3);
    background: #1a1030;
}

.fp-reward-node.fp-reward-locked {
    opacity: 0.4;
}

.fp-reward-node.fp-reward-unlocked {
    border-color: #22c55e;
    background: #0a1a0a;
}

.fp-reward-node.fp-reward-claimed {
    opacity: 0.6;
    border-color: #444;
}

.fp-reward-level {
    color: var(--accent);
    font-size: 0.6rem;
}

.fp-reward-item {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-wrap: wrap;
    justify-content: center;
}

.fp-reward-emoji {
    font-size: 1rem;
}

.fp-reward-name {
    color: #aaa;
    font-size: 0.5rem;
    line-height: 1.3;
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
}

.fp-claim-btn {
    background: var(--success);
    color: var(--text-0);
    border: none;
    border-radius: 3px;
    padding: 3px 8px;
    font-size: 0.55rem;
    cursor: pointer;
    transition: all 0.2s;
    margin-top: 2px;
}

.fp-claim-btn:hover {
    background: linear-gradient(135deg, #16a34a, #15803d);
    transform: scale(1.05);
}

.fp-claimed-badge {
    color: #22c55e;
    font-size: 0.5rem;
}

.fp-locked-badge {
    font-size: 0.8rem;
    opacity: 0.5;
}

.fp-challenges-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fp-challenge {
    background: var(--bg-1);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fp-challenge.fp-challenge-complete {
    border-color: #22c55e;
    background: #0a1a0a;
}

.fp-challenge.fp-challenge-claimed {
    opacity: 0.5;
}

.fp-challenge-desc {
    color: #ccc;
    font-size: 0.75rem;
}

.fp-challenge-progress-bar {
    height: 10px;
    background: #0f3460;
    border-radius: 5px;
    overflow: hidden;
}

.fp-challenge-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #e94560, #ff6b81);
    border-radius: 5px;
    transition: width 0.5s ease;
}

.fp-challenge.fp-challenge-complete .fp-challenge-progress-fill {
    background: var(--success);
}

.fp-challenge-info {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.fp-challenge-count {
    color: var(--text-2);
    font-size: 0.65rem;
}

.fp-challenge-xp {
    color: #f59e0b;
    font-size: 0.65rem;
}

.fp-challenge-claim-btn {
    margin-left: auto;
}

.fp-lootboxes-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    padding: 10px;
}

.fp-lootbox {
    width: 140px;
    background: var(--bg-1);
    border: 2px solid #888;
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    transition: all 0.2s;
}

.fp-lootbox:hover {
    transform: scale(1.05);
}

.fp-lootbox.fp-lootbox-opened {
    opacity: 0.4;
}

.fp-lootbox-emoji {
    font-size: 2rem;
}

.fp-lootbox-tier {
    font-size: 0.7rem;
}

.fp-lootbox-opened-label {
    color: #555;
    font-size: 0.6rem;
}

.fp-themes-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    padding: 10px;
}

.fp-theme-card {
    width: 150px;
    background: var(--bg-1);
    border: 2px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    transition: all 0.2s;
}

.fp-theme-card.fp-theme-active {
    border-color: #22c55e;
    box-shadow: 0 0 12px rgba(34, 197, 94, 0.3);
    background: #0a1a0a;
}

.fp-theme-card.fp-theme-owned {
    border-color: #3b82f6;
}

.fp-theme-card.fp-theme-locked {
    opacity: 0.35;
}

.fp-theme-emoji {
    font-size: 2rem;
}

.fp-theme-name {
    color: #ccc;
    font-size: 0.6rem;
}

.fp-theme-status {
    color: var(--text-2);
    font-size: 0.55rem;
}

.fp-theme-btn {
    background: #3b82f6;
    color: var(--text-0);
    border: none;
    border-radius: 3px;
    padding: 3px 8px;
    font-size: 0.55rem;
    cursor: pointer;
    transition: all 0.2s;
}

.fp-theme-btn:hover {
    background: #2563eb;
}

.fp-theme-clear-btn {
    background: #888;
}

.fp-theme-clear-btn:hover {
    background: #666;
}

.fp-loot-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
}

.fp-loot-result {
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border: 2px solid #e94560;
    border-radius: 12px;
    padding: 30px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-width: 300px;
    animation: fp-loot-appear 0.3s ease;
}

.fp-loot-error {
    border-color: #ef4444;
}

@keyframes fp-loot-appear {
    from { transform: scale(0.5); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.fp-loot-title {
    color: var(--accent);
    font-size: 1rem;
}

.fp-loot-reward-name {
    color: #f59e0b;
    font-size: 0.8rem;
}

.fp-loot-reward-display {
    color: #22c55e;
    font-size: 1.2rem;
}

.fp-names-season {
    background: var(--bg-1);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 16px;
    text-align: center;
}

.fp-names-season-title {
    color: var(--accent);
    font-size: 0.7rem;
    margin-bottom: 6px;
}

.fp-names-season-rank {
    color: #f59e0b;
    font-size: 0.65rem;
}

.fp-names-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.fp-name-card {
    width: 150px;
    background: var(--bg-1);
    border: 2px solid rgba(255,255,255,0.1);
    border-radius: 8px;
    padding: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    transition: all 0.2s;
}

.fp-name-card.fp-name-active {
    border-color: #22c55e;
    box-shadow: 0 0 12px rgba(34, 197, 94, 0.3);
    background: #0a1a0a;
}

.fp-name-card.fp-name-owned {
    border-color: #3b82f6;
}

.fp-name-card.fp-name-locked {
    opacity: 0.35;
}

.fp-name-preview {
    font-size: 0.85rem;
    font-weight: bold;
}

.fp-name-status {
    color: var(--text-2);
    font-size: 0.55rem;
}

.forum-rank-info {
    background: #0a0a0a;
    border: 1px solid var(--border);
    padding: 10px;
    margin: 8px 0;
    color: #f59e0b;
    font-size: 0.7rem;
    line-height: 1.6;
    text-align: center;
}

.forum-rank-unequip {
    border-style: dashed;
    opacity: 0.6;
}

.selling-toggle-btn {
    width: 100%;
    padding: 6px;
    font-size: 0.75rem;
    background: var(--bg-2);
    color: #ffd700;
    border: 1px solid #ffd700;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 4px;
}

.selling-toggle-btn:hover {
    background: rgba(255, 215, 0, 0.15);
}

.selling-paused-info {
    width: 100%;
    padding: 6px;
    font-size: 0.75rem;
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    border: 1px solid #ef4444;
    border-radius: 4px;
    text-align: center;
    margin-top: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.selling-resume-btn {
    font-size: 0.7rem;
    background: #22c55e;
    color: #000;
    border: none;
    border-radius: 3px;
    padding: 3px 8px;
    cursor: pointer;
}

.money-phrog-content {
    background-image: url('mone.png');
    background-size: 80px;
    overflow: hidden !important;
    padding: 0 !important;
}

.phrog-center {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    position: relative;
    z-index: 1;
}

.phrog-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

@keyframes phrog-fall {
    0% { top: -10%; }
    100% { top: 100%; }
}

@keyframes phrog-shake {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(40px); }
}

.phrog-snowflakes {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
}

.phrog-snowflake {
    position: absolute;
    top: -10%;
    animation: phrog-fall 8s linear infinite, phrog-shake 3s ease-in-out infinite;
    pointer-events: none;
}

.phrog-snowflake:nth-of-type(1) { left: 5%; animation-delay: 0s, 0s; }
.phrog-snowflake:nth-of-type(2) { left: 12%; animation-delay: 1s, 1s; }
.phrog-snowflake:nth-of-type(3) { left: 20%; animation-delay: 4s, 0.5s; }
.phrog-snowflake:nth-of-type(4) { left: 28%; animation-delay: 2.5s, 2s; }
.phrog-snowflake:nth-of-type(5) { left: 35%; animation-delay: 1.5s, 2s; }
.phrog-snowflake:nth-of-type(6) { left: 42%; animation-delay: 6s, 3s; }
.phrog-snowflake:nth-of-type(7) { left: 50%; animation-delay: 4.5s, 2s; }
.phrog-snowflake:nth-of-type(8) { left: 58%; animation-delay: 2s, 1s; }
.phrog-snowflake:nth-of-type(9) { left: 65%; animation-delay: 0.5s, 0s; }
.phrog-snowflake:nth-of-type(10) { left: 72%; animation-delay: 3s, 1.5s; }
.phrog-snowflake:nth-of-type(11) { left: 80%; animation-delay: 5s, 2.5s; }
.phrog-snowflake:nth-of-type(12) { left: 88%; animation-delay: 1.2s, 0.8s; }
.phrog-snowflake:nth-of-type(13) { left: 15%; animation-delay: 3.5s, 1.2s; }
.phrog-snowflake:nth-of-type(14) { left: 45%; animation-delay: 2.2s, 2.8s; }
.phrog-snowflake:nth-of-type(15) { left: 75%; animation-delay: 5.5s, 0.3s; }
.phrog-snowflake:nth-of-type(16) { left: 55%; animation-delay: 0.8s, 1.8s; }
}

.vape-panel {
    border: 3px solid #22c55e;
    border-radius: 12px;
    padding: 16px;
    background: linear-gradient(180deg, #0a1a0a 0%, #0a0a1a 100%);
    margin: 10px auto;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.vape-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.vape-buy-btn {
    font-size: 0.7rem;
    padding: 10px 20px;
    border: 2px solid #22c55e;
    border-radius: 6px;
    cursor: pointer;
    background: var(--bg-1);
    color: #22c55e;
    transition: all 0.15s;
}

.vape-buy-btn:hover {
    background: #22c55e;
    color: #000;
}

.vape-device-visual {
    display: flex;
    justify-content: center;
    padding: 10px 0 4px;
}
.vape-device-body {
    position: relative;
    width: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.vape-device-mouthpiece {
    width: 14px;
    height: 10px;
    background: #555;
    border-radius: 4px 4px 0 0;
    border: 1px solid #666;
}
.vape-device-tank {
    width: 28px;
    height: 50px;
    background: linear-gradient(135deg, #1a3a2e, #0d2618);
    border: 2px solid #22c55e;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
}
.vape-device-tank::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60%;
    background: linear-gradient(to top, rgba(34,197,94,0.3), transparent);
}
.vape-device-led {
    width: 8px;
    height: 8px;
    background: #333;
    border-radius: 50%;
    margin-top: 4px;
    transition: background 0.3s, box-shadow 0.3s;
}
.vape-device-led.active {
    background: #22c55e;
    box-shadow: 0 0 8px #22c55e, 0 0 16px rgba(34,197,94,0.4);
}

.vape-puff-bar-bg {
    width: 100%;
    height: 10px;
    background: var(--bg-2);
    border-radius: 5px;
    border: 1px solid var(--border);
    overflow: hidden;
}

.vape-puff-bar {
    height: 100%;
    background: #22c55e;
    border-radius: 5px;
    transition: width 0.3s, background 0.3s;
}

.vape-hit-btn {
    font-size: 0.9rem;
    padding: 14px 28px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    background: #22c55e;
    color: #000;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
    transition: transform 0.1s;
}

.vape-hit-btn:active:not(:disabled) {
    transform: scale(0.95);
    background: #16a34a;
}

.vape-hit-btn:disabled {
    background: #333;
    color: var(--text-3);
    cursor: not-allowed;
}

.vape-hit-meter {
    margin-bottom: 10px;
}

.vape-hit-meter-track {
    width: 100%;
    height: 16px;
    background: var(--bg-2);
    border-radius: 8px;
    border: 1px solid var(--border);
    overflow: hidden;
}

.vape-hit-meter-fill {
    height: 100%;
    width: 0%;
    background: #22c55e;
    border-radius: 8px;
    transition: background 0.2s;
}

.vape-result {
    font-size: 0.7rem;
    min-height: 1.4em;
    text-align: center;
    margin-top: 8px;
    color: #22c55e;
}

.vape-withdrawal {
    text-align: center;
    margin-bottom: 6px;
    animation: vape-shake 0.3s infinite;
}

@keyframes vape-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-2px); }
    75% { transform: translateX(2px); }
}

.volcano-panel {
    border: 3px solid #f59e0b;
    border-radius: 12px;
    padding: 16px;
    background: linear-gradient(180deg, #1a1505 0%, #0a0a1a 100%);
    margin: 10px auto;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.volcano-idle {
    padding: 10px;
}

.volcano-machine {
    font-size: 3rem;
    margin: 10px 0;
}

.volcano-stats {
    color: #f59e0b;
    font-size: 0.6rem;
    margin: 8px 0;
}

.volcano-boost-active {
    color: #22c55e;
    font-size: 0.7rem;
    margin: 6px 0;
    animation: volcano-pulse 1s infinite;
}

@keyframes volcano-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.volcano-start-btn {
    font-size: 0.7rem;
    padding: 12px 24px;
    border: 2px solid #f59e0b;
    border-radius: 6px;
    cursor: pointer;
    background: var(--bg-1);
    color: #f59e0b;
    margin-top: 12px;
    transition: all 0.15s;
}

.volcano-start-btn:hover {
    background: #f59e0b;
    color: #000;
}

.volcano-step-indicator {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    margin-bottom: 14px;
}

.volcano-step-done {
    font-size: 0.5rem;
    color: #22c55e;
    padding: 2px 6px;
    background: #0a2a0a;
    border-radius: 3px;
}

.volcano-step-current {
    font-size: 0.5rem;
    color: #f59e0b;
    padding: 2px 6px;
    background: #2a1a00;
    border: 1px solid #f59e0b;
    border-radius: 3px;
    animation: volcano-pulse 1s infinite;
}

.volcano-step-pending {
    font-size: 0.5rem;
    color: #444;
    padding: 2px 6px;
    background: #111;
    border-radius: 3px;
}

.volcano-step-panel {
    padding: 8px;
    min-height: 200px;
}

.volcano-action-btn {
    font-size: 0.7rem;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    background: #22c55e;
    color: #000;
    margin-top: 12px;
    transition: all 0.1s;
}

.volcano-action-btn:hover:not(:disabled) {
    opacity: 0.85;
}

.volcano-action-btn:active:not(:disabled) {
    transform: scale(0.95);
}

.volcano-action-btn:disabled {
    background: #333;
    color: var(--text-3);
    cursor: not-allowed;
}

.volcano-heat-btn {
    background: #f59e0b;
}

.volcano-air-btn {
    background: #06b6d4;
}

.volcano-air-off-btn {
    background: var(--accent);
}

.volcano-inhale-btn {
    background: #8b5cf6;
    font-size: 0.9rem;
    padding: 14px 28px;
}

.volcano-heat-display {
    font-size: 1.2rem;
    color: #f59e0b;
    margin: 10px 0;
}

.volcano-heat-bar-bg {
    width: 100%;
    height: 14px;
    background: var(--bg-2);
    border-radius: 7px;
    border: 1px solid var(--border);
    overflow: hidden;
    margin: 8px 0;
}

.volcano-heat-bar {
    height: 100%;
    background: linear-gradient(90deg, #f59e0b, #ef4444);
    border-radius: 7px;
    transition: width 0.3s;
}

.volcano-grind-area {
    margin: 10px 0;
    transition: transform 0.1s;
}

.volcano-grinder {
    font-size: 3rem;
    margin: 8px 0;
}

.volcano-grind-progress {
    font-size: 0.8rem;
    color: #22c55e;
    margin: 6px 0;
}

.volcano-chamber-anim, .volcano-balloon-anim, .volcano-pump-anim, .volcano-inhale-anim {
    font-size: 3rem;
    margin: 12px 0;
}

.volcano-balloon-full {
    font-size: 2.5rem;
    margin: 12px 0;
    animation: volcano-balloon-bounce 0.6s infinite;
}

@keyframes volcano-balloon-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.volcano-fill-area {
    margin: 10px 0;
    position: relative;
}

.volcano-balloon-visual {
    width: 60px;
    height: 80px;
    background: radial-gradient(ellipse, rgba(180,180,220,0.3), rgba(140,140,180,0.1));
    border: 2px solid rgba(200,200,240,0.4);
    border-radius: 50% 50% 30% 30%;
    margin: 0 auto 12px;
    transform: scale(0.3);
    transition: transform 0.3s;
}

.volcano-fill-bar-bg {
    width: 100%;
    height: 14px;
    background: var(--bg-2);
    border-radius: 7px;
    border: 1px solid var(--border);
    overflow: hidden;
}

.volcano-fill-bar {
    height: 100%;
    background: linear-gradient(90deg, #22c55e, #8b5cf6);
    border-radius: 7px;
    transition: width 0.3s;
}

.volcano-cancel {
    margin-top: 12px;
}

.volcano-cancel-btn {
    font-size: 0.5rem;
    padding: 4px 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    cursor: pointer;
    background: transparent;
    color: var(--text-3);
}

.volcano-cancel-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.volcano-result {
    font-size: 0.7rem;
    min-height: 1.4em;
    text-align: center;
    margin-top: 8px;
    color: #22c55e;
}

/* ===== FlatChan ===== */
.chan-container {
    padding: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.chan-header {
    margin-bottom: 10px;
}

.chan-title {
    font-size: 0.8rem;
    color: var(--accent);
    margin-bottom: 8px;
}

.chan-board-tabs {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.chan-board-tab {
    font-size: 0.55rem;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--bg-2);
    color: #888;
    cursor: pointer;
}

.chan-board-tab:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.chan-board-tab.active {
    background: var(--accent);
    color: var(--text-0);
    border-color: var(--accent);
}

.chan-new-thread-btn {
    background: var(--bg-1) !important;
    color: #22c55e !important;
    border-color: #22c55e44 !important;
}

.chan-new-thread-btn:hover {
    background: #22c55e22 !important;
}

.chan-body {
    flex: 1;
    overflow-y: auto;
}

.chan-loading, .chan-empty, .chan-error {
    text-align: center;
    padding: 40px 20px;
    color: var(--text-3);
    font-size: 0.7rem;
}

.chan-error { color: #ef4444; }

.chan-thread-preview {
    background: var(--bg-1);
    border: 1px solid #1a2744;
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 6px;
    cursor: pointer;
}

.chan-thread-preview:hover {
    border-color: var(--accent);
}

.chan-thread-meta {
    display: flex;
    gap: 8px;
    align-items: baseline;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.chan-thread-id {
    color: var(--accent);
    font-size: 0.5rem;
}

.chan-thread-subject {
    color: #f59e0b;
    font-size: 0.6rem;
}

.chan-thread-info {
    color: #555;
    font-size: 0.45rem;
}

.chan-thread-body-preview {
    color: #888;
    font-size: 0.75rem;
    line-height: 1.4;
    font-family: 'Press Start 2P', cursive;
}

.chan-back-btn {
    font-size: 0.5rem;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: transparent;
    color: #888;
    cursor: pointer;
    margin-bottom: 10px;
}

.chan-back-btn:hover {
    color: var(--accent);
    border-color: var(--accent);
}

.chan-thread {
    margin-bottom: 10px;
}

.chan-op {
    background: var(--bg-2);
    border: 1px solid #2a2a4e;
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 6px;
}

.chan-reply {
    background: #111122;
    border-left: 2px solid #333;
    padding: 8px 10px;
    margin-bottom: 4px;
    margin-left: 20px;
    border-radius: 0 4px 4px 0;
}

.chan-post-header {
    display: flex;
    gap: 8px;
    align-items: baseline;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.chan-post-subject {
    color: #f59e0b;
    font-size: 0.55rem;
}

.chan-post-author {
    color: #22c55e;
    font-size: 0.5rem;
}

.chan-post-time {
    color: #444;
    font-size: 0.45rem;
}

.chan-post-id {
    color: var(--accent);
    font-size: 0.45rem;
    cursor: pointer;
}

.chan-post-body {
    color: #ccc;
    font-size: 0.8rem;
    line-height: 1.5;
    font-family: 'Press Start 2P', cursive;
    word-wrap: break-word;
}

.chan-post-body .chan-quote {
    color: var(--accent);
    cursor: pointer;
}

.chan-post-body .chan-greentext {
    color: #22c55e;
}

.chan-reply-form {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    margin-top: 10px;
}

.chan-reply-input {
    flex: 1;
    background: #111122;
    border: 1px solid var(--border);
    border-radius: 4px;
    color: #ccc;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.8rem;
    padding: 8px;
    min-height: 60px;
    resize: vertical;
}

.chan-reply-input:focus {
    border-color: var(--accent);
    outline: none;
}

.chan-reply-btn {
    font-size: 0.5rem;
    padding: 8px 12px;
    border: 1px solid #22c55e44;
    border-radius: 4px;
    background: #22c55e22;
    color: #22c55e;
    cursor: pointer;
    white-space: nowrap;
}

.chan-reply-btn:hover {
    background: #22c55e44;
}

.chan-reply-status {
    font-size: 0.45rem;
    color: #888;
    white-space: nowrap;
}

.chan-new-thread-form {
    background: var(--bg-1);
    border: 1px solid #2a2a4e;
    border-radius: 4px;
    padding: 12px;
}

.chan-form-title {
    font-size: 0.6rem;
    color: #f59e0b;
    margin-bottom: 10px;
}

.chan-form-group {
    margin-bottom: 10px;
}

.chan-form-group label {
    display: block;
    font-size: 0.5rem;
    color: #888;
    margin-bottom: 4px;
}

.chan-input {
    width: 100%;
    background: #111122;
    border: 1px solid var(--border);
    border-radius: 4px;
    color: #ccc;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.8rem;
    padding: 6px 8px;
    box-sizing: border-box;
}

.chan-input:focus {
    border-color: var(--accent);
    outline: none;
}

.chan-pagination {
    display: flex;
    gap: 4px;
    justify-content: center;
    margin-top: 10px;
}

.chan-page {
    font-size: 0.45rem;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: transparent;
    color: #888;
    cursor: pointer;
}

.chan-page:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.chan-page.active {
    background: var(--accent);
    color: var(--text-0);
    border-color: var(--accent);
}

.game-dialog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000;
}
.game-dialog-box {
    background: var(--bg-2);
    border: 2px solid #e94560;
    border-radius: 8px;
    padding: 20px;
    max-width: 400px;
    width: 90%;
    text-align: center;
}
.game-dialog-title {
    font-size: 0.8rem;
    color: var(--accent);
    margin-bottom: 16px;
}
.game-dialog-message {
    font-size: 0.75rem;
    color: #ccc;
    margin-bottom: 20px;
    line-height: 1.6;
}
.game-dialog-input {
    width: 100%;
    box-sizing: border-box;
    font-size: 0.8rem;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    color: #ccc;
    padding: 8px 10px;
    margin-bottom: 16px;
}
.game-dialog-input:focus {
    border-color: var(--accent);
    outline: none;
}
.game-dialog-btns {
    display: flex;
    gap: 10px;
    justify-content: center;
}
.game-dialog-btn {
    font-size: 0.7rem;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,0.15);
}
.game-dialog-cancel {
    background: rgba(255,255,255,0.05);
    color: #888;
}
.game-dialog-cancel:hover {
    background: rgba(255,255,255,0.1);
    color: #ccc;
}
.game-dialog-confirm {
    background: var(--accent);
    color: var(--text-0);
    border-color: var(--accent);
}
.game-dialog-confirm:hover {
    background: #c73850;
}

.rpg-panel {
    display: flex;
    flex-direction: column;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.9rem;
    background: var(--bg-2);
    color: #e0e0e0;
    padding: 12px;
    height: 100%;
    box-sizing: border-box;
    overflow-y: auto;
}
.rpg-header {
    text-align: center;
    font-size: 1.1rem;
    color: var(--accent);
    margin-bottom: 12px;
    letter-spacing: 2px;
}
.rpg-content {
    flex: 1;
}
.rpg-loading, .rpg-error {
    text-align: center;
    color: #888;
    padding: 20px;
    font-size: 0.9rem;
}
.rpg-error {
    color: var(--accent);
}
.rpg-char-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}
.rpg-char-card {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--bg-1);
    border: 2px solid #0f3460;
    border-radius: 6px;
    padding: 10px;
    cursor: default;
}
.rpg-char-card.rpg-active {
    border-color: #22c55e;
    background: #0f3420;
}
.rpg-char-icon {
    font-size: 1.8rem;
    min-width: 36px;
    text-align: center;
}
.rpg-char-info {
    flex: 1;
    min-width: 0;
}
.rpg-char-name {
    font-size: 0.9rem;
    color: var(--text-0);
    margin-bottom: 4px;
}
.rpg-char-class {
    font-size: 0.75rem;
    color: var(--accent);
    margin-bottom: 6px;
}
.rpg-char-stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.rpg-stat-badge {
    font-size: 0.7rem;
    background: #0f3460;
    color: #aaa;
    padding: 2px 5px;
    border-radius: 3px;
}
.rpg-char-actions {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-end;
}
.rpg-active-badge {
    font-size: 0.7rem;
    color: #22c55e;
    letter-spacing: 1px;
}
.rpg-btn {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.7rem;
    border: 2px solid #0f3460;
    border-radius: 4px;
    padding: 6px 10px;
    cursor: pointer;
    background: var(--bg-1);
    color: #e0e0e0;
    transition: all 0.15s;
}
.rpg-btn:hover {
    background: #0f3460;
    color: var(--text-0);
}
.rpg-btn-select {
    border-color: #22c55e;
    color: #22c55e;
}
.rpg-btn-select:hover {
    background: #22c55e;
    color: #1a1a2e;
}
.rpg-btn-delete {
    border-color: var(--accent);
    color: var(--accent);
}
.rpg-btn-delete:hover {
    background: var(--accent);
    color: var(--text-0);
}
.rpg-btn-create {
    display: block;
    width: 100%;
    padding: 10px;
    font-size: 0.85rem;
    border-color: var(--accent);
    color: var(--accent);
    text-align: center;
    margin-top: 8px;
}
.rpg-btn-create:hover {
    background: var(--accent);
    color: var(--text-0);
}
.rpg-btn-back {
    margin-bottom: 8px;
    font-size: 0.75rem;
}
.rpg-btn-submit {
    display: block;
    width: 100%;
    padding: 10px;
    font-size: 0.85rem;
    border-color: #22c55e;
    color: #22c55e;
    text-align: center;
    margin-top: 12px;
}
.rpg-btn-submit:hover {
    background: #22c55e;
    color: #1a1a2e;
}
.rpg-create-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.rpg-create-title {
    text-align: center;
    font-size: 1rem;
    color: var(--accent);
    margin-bottom: 4px;
}
.rpg-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.rpg-label {
    font-size: 0.8rem;
    color: #aaa;
}
.rpg-stat-total {
    font-size: 0.7rem;
    color: #22c55e;
}
.rpg-input {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.85rem;
    background: #0f3460;
    border: 2px solid #16213e;
    border-radius: 4px;
    color: var(--text-0);
    padding: 8px 10px;
    outline: none;
}
.rpg-input:focus {
    border-color: var(--accent);
}
.rpg-class-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
}
.rpg-class-option {
    background: var(--bg-1);
    border: 2px solid #0f3460;
    border-radius: 6px;
    padding: 8px;
    cursor: pointer;
    transition: all 0.15s;
    text-align: center;
}
.rpg-class-option:hover {
    border-color: var(--accent);
}
.rpg-class-option.rpg-selected {
    border-color: #22c55e;
    background: #0f3420;
}
.rpg-class-icon {
    font-size: 1.4rem;
    margin-bottom: 4px;
}
.rpg-class-name {
    font-size: 0.7rem;
    color: var(--text-0);
    margin-bottom: 4px;
}
.rpg-class-desc {
    font-size: 0.6rem;
    color: #888;
    line-height: 1.4;
}
.rpg-stats-allocator {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.rpg-stat-row {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-1);
    padding: 4px 8px;
    border-radius: 4px;
}
.rpg-stat-name {
    font-size: 0.7rem;
    color: var(--accent);
    min-width: 30px;
}
.rpg-stat-val {
    font-size: 0.85rem;
    color: var(--text-0);
    min-width: 20px;
    text-align: center;
}
.rpg-stat-btn {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.75rem;
    width: 24px;
    height: 24px;
    border: 1px solid #0f3460;
    border-radius: 3px;
    background: #0f3460;
    color: var(--text-0);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.rpg-stat-btn:hover {
    background: var(--accent);
    border-color: var(--accent);
}
.rpg-respec-btn {
    font-family: 'Press Start 2P', cursive;
    font-size: 0.7rem;
    padding: 8px 16px;
    border: 1px solid #e94560;
    border-radius: 3px;
    background: transparent;
    color: var(--accent);
    cursor: pointer;
    width: 100%;
}
.rpg-respec-btn:hover {
    background: var(--accent);
    color: var(--text-0);
}
.rpg-perk-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
}
.rpg-perk-option {
    background: var(--bg-1);
    border: 2px solid #0f3460;
    border-radius: 5px;
    padding: 6px 8px;
    cursor: pointer;
    transition: all 0.15s;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.rpg-perk-option.rpg-available {
    border-color: #22c55e;
}
.rpg-perk-option.rpg-available:hover {
    background: #0f3420;
}
.rpg-perk-option.rpg-selected {
    border-color: #22c55e;
    background: #0f3420;
}
.rpg-perk-option.rpg-locked {
    opacity: 0.4;
    cursor: not-allowed;
}
.rpg-perk-icon {
    font-size: 1rem;
}
.rpg-perk-name {
    font-size: 0.65rem;
    color: var(--text-0);
}
.rpg-perk-desc {
    font-size: 0.55rem;
    color: #888;
}
.rpg-perk-req {
    font-size: 0.5rem;
    color: var(--accent);
}

.char-detail-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    background: var(--bg-1);
    border-radius: 6px;
    margin-bottom: 10px;
}
.char-detail-icon {
    font-size: 2rem;
    width: 48px;
    text-align: center;
}
.char-detail-name {
    font-size: 0.9rem;
    color: var(--accent);
    margin-bottom: 2px;
}
.char-detail-class {
    font-size: 0.65rem;
    color: #888;
}
.char-stat-points {
    background: #0f3460;
    color: #22c55e;
    font-size: 0.7rem;
    padding: 6px 10px;
    border-radius: 4px;
    margin-bottom: 10px;
    text-align: center;
    border: 1px solid #22c55e;
}
.char-detail-section {
    margin-bottom: 10px;
}
.char-detail-section-title {
    font-size: 0.7rem;
    color: var(--accent);
    margin-bottom: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid #16213e;
}
.char-stats-grid {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.char-stat-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
}
.char-stat-label {
    font-size: 0.65rem;
    color: #aaa;
    width: 32px;
    text-align: right;
}
.char-stat-bar-wrap {
    flex: 1;
    height: 10px;
    background: var(--bg-2);
    border-radius: 3px;
    overflow: hidden;
}
.char-stat-bar {
    height: 100%;
    background: linear-gradient(90deg, #0f3460, #e94560);
    border-radius: 3px;
    transition: width 0.3s;
}
.char-stat-value {
    font-size: 0.7rem;
    color: var(--text-0);
    width: 28px;
    text-align: right;
}
.char-stat-bonus {
    color: #22c55e;
    font-size: 0.55rem;
}
.char-upgrade-btn {
    width: 22px !important;
    height: 22px !important;
    font-size: 0.7rem !important;
    padding: 0 !important;
    line-height: 22px !important;
    text-align: center;
}
.char-perks-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.char-perk-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    background: var(--bg-1);
    border-radius: 4px;
}
.char-perk-icon {
    font-size: 1rem;
}
.char-perk-name {
    font-size: 0.65rem;
    color: var(--accent);
    white-space: nowrap;
}
.char-perk-desc {
    font-size: 0.55rem;
    color: #888;
}
.char-bonuses-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.char-bonus-item {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    background: var(--bg-1);
    border-radius: 3px;
}
.char-bonus-key {
    font-size: 0.55rem;
    color: #aaa;
}
.char-bonus-val {
    font-size: 0.6rem;
    font-weight: bold;
}
.char-bonus-pos {
    color: #22c55e;
}
.char-bonus-neg {
    color: var(--accent);
}

@media (max-width: 600px) {
    .rpg-panel { font-size: 0.85rem; padding: 8px; }
    .rpg-header { font-size: 0.9rem; }
    .rpg-class-grid { grid-template-columns: 1fr; }
    .rpg-perk-grid { grid-template-columns: 1fr; }
    .rpg-char-card { flex-direction: column; text-align: center; }
    .rpg-char-actions { flex-direction: row; align-items: center; }
    .rpg-class-desc { font-size: 0.6rem; }
    .rpg-perk-desc { font-size: 0.6rem; }
    .rpg-perk-req { font-size: 0.55rem; }
    .rpg-stat-badge { font-size: 0.65rem; }
    .rpg-char-name { font-size: 0.85rem; }
    .rpg-char-class { font-size: 0.7rem; }
     .rpg-btn { font-size: 0.65rem; padding: 5px 8px; }
}

[data-wm-id="shooterbet"] > .wm-window-content {
    padding: 0;
    overflow-y: auto;
}

.shooter-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.shooter-twitch {
    width: 100%;
    aspect-ratio: 16/9;
    border: none;
    flex-shrink: 0;
}

.shooter-twitch-fallback {
    width: 100%;
    aspect-ratio: 16/9;
    background: var(--bg-2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.shooter-twitch-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #9146ff;
    font-size: 0.9rem;
    padding: 16px;
    border: 2px solid #9146ff;
    border-radius: 8px;
    transition: all 0.2s;
}

.shooter-twitch-link:hover {
    background: rgba(145, 70, 255, 0.15);
    color: #bf94ff;
}

.shooter-twitch-icon {
    font-size: 2rem;
}

.shooter-twitch-hint {
    font-size: 0.6rem;
    color: var(--text-3);
}

.shooter-bet-section {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.shooter-match-info {
    text-align: center;
    font-size: 0.8rem;
    color: var(--accent);
    text-transform: uppercase;
}

.shooter-pools {
    display: flex;
    gap: 10px;
}

.shooter-pool {
    flex: 1;
    text-align: center;
    padding: 10px;
    border-radius: 8px;
    background: var(--bg-2);
}

.shooter-pool-ct {
    border: 2px solid #5b9bd5;
}

.shooter-pool-t {
    border: 2px solid #e94560;
}

.shooter-pool-label {
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 5px;
}

.shooter-pool-ct .shooter-pool-label { color: #5b9bd5; }
.shooter-pool-t .shooter-pool-label { color: var(--accent); }

.shooter-pool-amount {
    font-size: 0.8rem;
    color: #aaa;
    margin-bottom: 8px;
}

.shooter-bet-btn {
    width: 100%;
    padding: 8px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.65rem;
    transition: all 0.2s;
}

.shooter-bet-ct {
    background: #5b9bd5;
    color: var(--text-0);
}

.shooter-bet-t {
    background: var(--accent);
    color: var(--text-0);
}

.shooter-bet-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.mdata-panel {
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 100%;
}

.mdata-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
    border-bottom: 1px solid #333;
}

.mdata-title {
    font-size: 0.9rem;
    color: var(--accent);
}

.mdata-value {
    font-size: 0.9rem;
    color: #22c55e;
}

.mdata-metrics {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.mdata-metric {
    flex: 1;
    min-width: 80px;
    padding: 6px 8px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s;
}

.mdata-metric:hover {
    border-color: var(--accent);
}

.mdata-metric-active {
    border-color: var(--accent);
    background: #1a1030;
}

.mdata-metric-label {
    display: block;
    font-size: 0.5rem;
    color: var(--text-3);
    margin-bottom: 3px;
}

.mdata-metric-value {
    display: block;
    font-size: 0.7rem;
    color: #ccc;
}

.mdata-metric-active .mdata-metric-value {
    color: var(--text-0);
}

.mdata-chart-area {
    flex: 1;
    min-height: 0;
}

.mdata-chart-area canvas {
    width: 100%;
    display: block;
}

.mdata-controls {
    display: flex;
    justify-content: center;
}

.mdata-range-btns {
    display: flex;
    gap: 4px;
}

.mdata-range-btn {
    font-size: 0.7rem;
    padding: 4px 8px;
    background: var(--bg-2);
    color: var(--text-2);
    border: 1px solid var(--border);
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.15s;
}

.mdata-range-btn:hover {
    border-color: var(--accent);
    color: #ccc;
}

.mdata-range-btn.active {
    background: #0f3460;
    color: var(--accent);
    border-color: var(--accent);
}

@media (max-width: 768px) {
    .mdata-metrics {
        flex-wrap: wrap;
    }
    .mdata-metric {
        min-width: 60px;
        padding: 4px 4px;
    }
    .mdata-metric-label {
        font-size: 0.4rem;
    }
    .mdata-metric-value {
        font-size: 0.55rem;
    }
    .mdata-range-btn {
        font-size: 0.55rem;
        padding: 3px 5px;
    }
}

.shooter-bet-btn.shooter-side-selected {
    box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.5);
    transform: scale(1.05);
}

.shooter-bet-controls {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.shooter-bet-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.shooter-bet-row .career-input {
    width: 100px;
    text-align: center;
}

.shooter-bet-label {
    font-size: 0.75rem;
    color: #aaa;
}

.shooter-selected-side {
    text-align: center;
    font-size: 0.75rem;
    color: #22c55e;
}

.shooter-result {
    text-align: center;
    font-size: 0.75rem;
    min-height: 1.2em;
}

.shooter-bets-header {
    font-size: 0.7rem;
    color: var(--accent);
    margin-bottom: 5px;
    text-transform: uppercase;
}

.shooter-no-bets {
    font-size: 0.7rem;
    color: var(--text-3);
    text-align: center;
}

.shooter-bet-entry {
    font-size: 0.7rem;
    padding: 3px 6px;
    margin: 2px 0;
    border-radius: 3px;
    background: var(--bg-2);
}

.shooter-bet-ct { border-left: 3px solid #5b9bd5; }
.shooter-bet-t { border-left: 3px solid #e94560; }

.diplo-header { text-align: center; padding: 12px; border-bottom: 1px solid #333; }
.diplo-title { font-size: 1rem; color: var(--accent); margin-bottom: 8px; }
.diplo-subtitle { font-size: 0.75rem; color: #888; margin-bottom: 8px; }
.diplo-bonus { font-size: 0.85rem; color: #22c55e; font-weight: bold; }
.diplo-nations-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; overflow-y: auto; max-height: 420px; }
.diplo-nation-card { background: var(--bg-1); border: 1px solid var(--border); border-radius: 6px; padding: 10px; }
.diplo-nation-header { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.diplo-nation-flag { font-size: 1.4rem; }
.diplo-nation-name { font-size: 0.8rem; color: var(--text-0); flex: 1; }
.diplo-nation-status { font-size: 0.65rem; font-weight: bold; }
.diplo-nation-desc { font-size: 0.6rem; color: #888; margin-bottom: 6px; }
.diplo-relations-bar { position: relative; height: 16px; background: #0d1117; border-radius: 3px; margin-bottom: 6px; overflow: hidden; }
.diplo-relations-fill { height: 100%; border-radius: 3px; transition: width 0.3s; }
.diplo-relations-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.55rem; color: var(--text-0); text-shadow: 1px 1px 2px #000; }
.diplo-actions { display: flex; flex-wrap: wrap; gap: 4px; }
.diplo-btn { font-family: 'Press Start 2P', cursive; font-size: 0.55rem; padding: 4px 8px; border: 1px solid var(--border); border-radius: 3px; background: var(--bg-2); color: #ccc; cursor: pointer; transition: background 0.15s; }
.diplo-btn:hover:not(:disabled) { background: #0f3460; }
.diplo-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.diplo-btn-delegate { border-color: #3b82f6; color: #3b82f6; }
.diplo-btn-export { border-color: #a855f7; color: #a855f7; }
.diplo-btn-insurgency { border-color: #ef4444; color: #ef4444; }
.diplo-btn-arms { border-color: #f59e0b; color: #f59e0b; }
.diplo-btn-ff { border-color: #dc2626; color: #dc2626; background: #2a1020; }
.diplo-btn-ff:hover { background: #3a1530; }
.diplo-ff-section { border-top: 1px solid #333; padding: 10px; text-align: center; }
.diplo-ff-title { font-size: 0.75rem; color: #dc2626; margin-bottom: 4px; }
.diplo-ff-desc { font-size: 0.6rem; color: #888; margin-bottom: 8px; }
.diplo-ff-row { display: flex; align-items: center; gap: 6px; justify-content: center; }
.diplo-ff-select { font-family: 'Press Start 2P', cursive; font-size: 0.6rem; background: var(--bg-2); color: #ccc; border: 1px solid var(--border); border-radius: 3px; padding: 4px; }
.diplo-ff-label { font-size: 0.6rem; color: #888; }
.diplo-result { text-align: center; padding: 8px; font-size: 0.7rem; color: #888; min-height: 20px; }
@media (max-width: 600px) { .diplo-nations-grid { grid-template-columns: 1fr; } }

.dating-container { background: linear-gradient(180deg, #1a0a2e 0%, #16213e 100%); min-height: 100%; color: #e0e0e0; font-family: 'Press Start 2P', cursive; }
.dating-header { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: linear-gradient(90deg, #2a1040, #1a0a2e); border-bottom: 2px solid #e94560; }
.dating-machine-avatar { font-size: 2.5rem; line-height: 1; }
.dating-header-info { flex: 1; }
.dating-stage { font-size: 1rem; color: #e94560; margin-bottom: 6px; }
.dating-affection-label { font-size: 0.7rem; color: #aaa; margin-bottom: 4px; }
.dating-affection-bar { background: #0f0f2e; border-radius: 6px; height: 12px; overflow: hidden; border: 1px solid #333; }
.dating-affection-fill { background: linear-gradient(90deg, #e94560, #ff6b9d); height: 100%; border-radius: 6px; transition: width 0.5s ease; }
.dating-tabs { display: flex; border-bottom: 2px solid #333; }
.dating-tab { flex: 1; padding: 10px 8px; font-family: 'Press Start 2P', cursive; font-size: 0.7rem; background: #16213e; color: #888; border: none; border-bottom: 3px solid transparent; cursor: pointer; transition: all 0.2s; }
.dating-tab:hover { color: #e94560; background: #1a2040; }
.dating-tab.active { color: #e94560; border-bottom-color: #e94560; background: #1a0a2e; }
.dating-tab-content { padding: 14px 16px; }
.dating-section { margin-bottom: 16px; }
.dating-section-title { font-size: 0.9rem; color: #e94560; margin-bottom: 10px; }
.dating-empty { font-size: 0.75rem; color: #666; padding: 16px; text-align: center; }
.dating-divider { border-top: 1px solid #333; margin: 14px 0; }
.dating-walk-info { font-size: 0.7rem; color: #888; margin-bottom: 10px; }
.dating-stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dating-stat { background: #0f0f2e; border: 1px solid #333; border-radius: 6px; padding: 10px; text-align: center; }
.dating-stat-label { display: block; font-size: 0.6rem; color: #888; margin-bottom: 4px; }
.dating-stat-value { display: block; font-size: 0.8rem; color: #22c55e; }
.dating-btn { font-family: 'Press Start 2P', cursive; font-size: 0.75rem; padding: 10px 16px; border: 2px solid #e94560; background: #2a1040; color: #e94560; border-radius: 6px; cursor: pointer; transition: all 0.2s; width: 100%; text-align: center; }
.dating-btn:hover { background: #e94560; color: #fff; }
.dating-btn-disabled { border-color: #444; color: #555; background: #1a1a2e; cursor: not-allowed; }
.dating-btn-disabled:hover { border-color: #444; color: #555; background: #1a1a2e; }
.dating-btn-walk { border-color: #22c55e; color: #22c55e; background: #0a2a1e; }
.dating-btn-walk:hover { background: #22c55e; color: #fff; }
.dating-gift-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dating-gift-card { background: #0f0f2e; border: 1px solid #333; border-radius: 8px; padding: 10px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.dating-gift-card:hover { border-color: #e94560; }
.dating-gift-emoji { font-size: 1.8rem; }
.dating-gift-name { font-size: 0.65rem; color: #ddd; }
.dating-gift-price { font-size: 0.6rem; color: #ffd700; }
.dating-gift-affection { font-size: 0.6rem; color: #ff6b9d; }
.dating-gift-count { font-size: 0.55rem; color: #888; }
.dating-btn-gift { font-size: 0.65rem; padding: 6px 10px; border-color: #ffd700; color: #ffd700; background: #2a2a1e; margin-top: 4px; }
.dating-btn-gift:hover { background: #ffd700; color: #000; }
.dating-convo-list { display: flex; flex-direction: column; gap: 8px; }
.dating-convo-card { background: #0f0f2e; border: 1px solid #333; border-radius: 8px; padding: 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dating-convo-card:hover { border-color: #8b5cf6; }
.dating-convo-done { border-color: #22c55e; opacity: 0.8; }
.dating-convo-name { font-size: 0.8rem; color: #ddd; flex: 1; }
.dating-convo-req { font-size: 0.55rem; color: #666; }
.dating-convo-badge { font-size: 0.6rem; color: #22c55e; }
.dating-btn-convo { width: auto; font-size: 0.6rem; padding: 6px 14px; border-color: #8b5cf6; color: #8b5cf6; background: #1a1040; }
.dating-btn-convo:hover { background: #8b5cf6; color: #fff; }
.dating-convo-scene { padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; min-height: 300px; }
.dating-convo-header { font-size: 0.9rem; color: #8b5cf6; text-align: center; }
.dating-convo-avatar { font-size: 4rem; line-height: 1; animation: dating-pulse 2s ease-in-out infinite; }
@keyframes dating-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
.dating-convo-dialogue { background: #0f0f2e; border: 2px solid #8b5cf6; border-radius: 10px; padding: 14px; width: 100%; }
.dating-convo-speaker { font-size: 0.7rem; color: #8b5cf6; margin-bottom: 6px; }
.dating-convo-text { font-size: 0.8rem; color: #e0e0e0; line-height: 1.6; min-height: 40px; }
.dating-convo-choices { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.dating-btn-choice { border-color: #e94560; color: #e94560; background: #2a1040; font-size: 0.7rem; }
.dating-btn-choice:hover { background: #e94560; color: #fff; }
.dating-result { padding: 24px 16px; text-align: center; }
.dating-result-title { font-size: 1rem; color: #e94560; margin-bottom: 16px; }
.dating-result-body { margin-bottom: 16px; }
.dating-walk-desc { font-size: 0.8rem; color: #ddd; line-height: 1.6; margin-bottom: 12px; }
.dating-affection-gain { font-size: 0.85rem; color: #ff6b9d; margin-bottom: 8px; }
.dating-stage-up { font-size: 0.85rem; color: #ffd700; margin-bottom: 8px; padding: 8px; background: #2a2a1e; border-radius: 6px; border: 1px solid #ffd700; }
.dating-gift-result-emoji { font-size: 3rem; margin-bottom: 8px; }
.dating-gift-result-name { font-size: 0.85rem; color: #ddd; margin-bottom: 8px; }
.dating-convo-end { font-size: 0.75rem; color: #888; margin-top: 8px; }
@media (max-width: 400px) { .dating-gift-grid { grid-template-columns: 1fr; } .dating-stats-grid { grid-template-columns: 1fr; } }
.dating-convo-muted { color: #555; font-style: italic; }
.dating-talk-loading { display: flex; align-items: center; justify-content: center; min-height: 200px; }

.origami-window { background: linear-gradient(180deg, #1a1a1e 0%, #16213e 100%); min-height: 100%; color: #e0e0e0; font-family: 'Press Start 2P', cursive; padding: 8px; }
.origami-loading { text-align: center; padding: 40px; font-size: 0.8rem; color: #888; }
.origami-container { max-width: 100%; }
.origami-header { margin-bottom: 10px; }
.origami-stats { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.origami-stat { font-size: 0.65rem; color: #aaa; }
.origami-stat-value { color: #fff; }
.origami-shelf-title { font-size: 0.7rem; color: #ff9f43; margin-bottom: 6px; padding-bottom: 4px; border-bottom: 1px solid #333; }
.origami-shelf { display: flex; gap: 4px; margin-bottom: 12px; flex-wrap: wrap; }
.origami-shelf-item { width: 42px; height: 42px; background: #2a2a3e; border: 1px solid #4a4a6e; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.origami-shelf-item:hover { border-color: #e94560; }
.origami-shelf-emoji { font-size: 1.2rem; }
.origami-shelf-slot { width: 42px; height: 42px; background: #111; border: 1px dashed #333; border-radius: 4px; }
.origami-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (max-width: 500px) { .origami-grid { grid-template-columns: 1fr; } }
.origami-card { background: #1e1e2e; border: 1px solid #333; border-radius: 6px; padding: 10px; display: flex; flex-direction: column; align-items: center; }
.origami-card.origami-owned { border-color: #4a9; }
.origami-emoji { font-size: 2rem; margin-bottom: 6px; }
.origami-name { font-size: 0.6rem; color: #fff; margin-bottom: 4px; text-align: center; }
.origami-desc { font-size: 0.5rem; color: #777; line-height: 1.5; margin-bottom: 6px; text-align: center; min-height: 30px; }
.origami-costs { display: flex; gap: 8px; margin-bottom: 4px; }
.origami-cost { font-size: 0.5rem; color: #aaa; }
.origami-meta { display: flex; gap: 8px; margin-bottom: 6px; }
.origami-fail { font-size: 0.5rem; color: #e94560; }
.origami-fail-zero { color: #4a9; }
.origami-sell-val { font-size: 0.5rem; color: #ffd700; }
.origami-owned-count { font-size: 0.55rem; color: #4a9; margin-bottom: 6px; }
.origami-actions { display: flex; gap: 4px; flex-wrap: wrap; justify-content: center; }
.origami-btn { font-family: 'Press Start 2P', cursive; font-size: 0.5rem; padding: 6px 8px; border: 1px solid #4a4a6e; background: #2a2a3e; color: #ddd; border-radius: 4px; cursor: pointer; }
.origami-btn:hover:not(:disabled) { background: #3a3a5e; border-color: #e94560; }
.origami-btn-disabled { opacity: 0.4; cursor: not-allowed; }
.origami-btn-fold { background: #1a3a2e; border-color: #4a9; }
.origami-btn-sell { background: #3a3a1e; border-color: #aa9; }
.origami-btn-display { background: #1e2a3e; border-color: #69a; }
.origami-btn-gift { background: #3a1e2e; border-color: #e94560; }
.origami-result { text-align: center; padding: 30px 10px; }
.origami-result-title { font-size: 0.9rem; color: #fff; margin-bottom: 12px; }
.origami-result-body { font-size: 0.65rem; color: #ccc; line-height: 1.6; margin-bottom: 16px; }
.origami-fold-view { text-align: center; }
.origami-fold-header { display: flex; justify-content: space-between; padding: 6px 8px; margin-bottom: 4px; }
.origami-fold-shape { font-size: 0.65rem; color: #fff; }
.origami-fold-step { font-size: 0.6rem; color: #aaa; }
.origami-fold-label { font-size: 0.7rem; color: #ff9f43; margin-bottom: 8px; padding: 6px; background: rgba(255,159,67,0.1); border-radius: 4px; }
.origami-canvas { display: block; margin: 0 auto 8px; background: #111; border-radius: 6px; border: 1px solid #333; cursor: crosshair; touch-action: none; }
.origami-fold-hint { font-size: 0.5rem; color: #666; margin-bottom: 6px; }
.origami-fold-quality { font-size: 0.55rem; color: #4a9; margin-bottom: 8px; }

/* Dog Fight Club */
.dogfight-content { padding: 10px; font-family: 'Press Start 2P', cursive; color: #ccc; }
.dogfight-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding: 6px 10px; background: #16213e; border-radius: 6px; }
.dogfight-record { font-size: 0.7rem; color: #22c55e; }
.dogfight-wanted { font-size: 0.65rem; color: #f59e0b; }
.dogfight-fighters { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.dogfight-empty { text-align: center; color: #666; font-size: 0.65rem; padding: 20px; }
.dogfight-fighter-card { background: #16213e; border: 1px solid #2a2a4e; border-radius: 8px; padding: 10px; }
.dogfight-fighter-name { font-size: 0.8rem; color: #e94560; margin-bottom: 2px; }
.dogfight-level { color: #f59e0b; font-size: 0.6rem; }
.dogfight-fighter-class { font-size: 0.55rem; color: #888; margin-bottom: 6px; }
.dogfight-stats { display: flex; gap: 10px; font-size: 0.55rem; color: #aaa; margin-bottom: 4px; }
.dogfight-stats span { background: #0f0f2e; padding: 2px 6px; border-radius: 3px; }
.dogfight-record-line { font-size: 0.5rem; color: #666; margin-bottom: 6px; }
.dogfight-boosts { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.dogfight-boost-tag { font-size: 0.45rem; color: #22c55e; background: rgba(34,197,94,0.1); padding: 2px 5px; border-radius: 3px; border: 1px solid rgba(34,197,94,0.3); }
.dogfight-fighter-actions { display: flex; gap: 4px; flex-wrap: wrap; }
.df-btn { font-family: 'Press Start 2P', cursive; font-size: 0.5rem; padding: 5px 8px; border: 1px solid #444; background: #1a1a2e; color: #ccc; border-radius: 4px; cursor: pointer; }
.df-btn:hover:not(:disabled) { background: #2a2a4e; }
.df-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.df-btn-fight { background: #3a1010; border-color: #e94560; color: #e94560; }
.df-btn-fight:hover:not(:disabled) { background: #5a1515; }
.df-btn-pvp { background: #1a1040; border-color: #a855f7; color: #a855f7; }
.df-btn-pvp:hover:not(:disabled) { background: #2a1a5a; }
.df-btn-feed { border-color: #22c55e; color: #22c55e; }
.df-btn-train { border-color: #3b82f6; color: #3b82f6; }
.df-btn-release { border-color: #666; color: #666; }
.df-btn-recruit { background: #16213e; border: 2px solid #e94560; color: #e94560; width: 100%; padding: 10px; font-size: 0.7rem; }
.df-btn-recruit:hover { background: #2a2a4e; }
.dogfight-recruit { margin-bottom: 10px; }
.dogfight-log { max-height: 200px; overflow-y: auto; }
.dogfight-log-entry { padding: 8px; margin-bottom: 4px; border-radius: 6px; font-size: 0.55rem; line-height: 1.5; }
.dogfight-log-win { background: rgba(34,197,94,0.1); border-left: 3px solid #22c55e; }
.dogfight-log-lose { background: rgba(233,69,96,0.1); border-left: 3px solid #e94560; }
.dogfight-result-header { font-size: 0.9rem; margin-bottom: 6px; }
.dogfight-result-vs { font-size: 0.65rem; color: #aaa; margin-bottom: 4px; }
.dogfight-finisher { font-size: 0.55rem; color: #f59e0b; margin-bottom: 6px; }
.dogfight-rounds { font-size: 0.5rem; color: #888; margin-bottom: 6px; }
.dogfight-round { padding: 1px 0; }
.dogfight-round-crit { color: #f59e0b; }
.dogfight-result-stats { font-size: 0.5rem; color: #aaa; }
.dogfight-jailed { color: #ef4444; font-size: 0.6rem; margin-top: 4px; padding: 4px; background: rgba(239,68,68,0.1); border-radius: 4px; }
.dogfight-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); z-index: 10000; align-items: center; justify-content: center; }
.dogfight-overlay-content { background: #1a1a2e; border: 2px solid #3b82f6; border-radius: 12px; padding: 20px; max-width: 380px; width: 90%; }
.dogfight-overlay-title { font-size: 0.9rem; color: #3b82f6; text-align: center; margin-bottom: 16px; }
.df-btn-train-option { display: block; width: 100%; text-align: left; margin-bottom: 6px; padding: 8px; background: #16213e; border: 1px solid #2a2a4e; color: #ccc; font-size: 0.6rem; }
.df-btn-train-option:hover { background: #2a2a4e; }
.df-btn-train-option small { color: #888; }
.dogfight-warning { color: #f59e0b; }
.df-btn-cancel { display: block; width: 100%; margin-top: 8px; background: #1a1a2e; border: 1px solid #666; color: #888; text-align: center; }

.arena-content { padding: 10px; font-family: 'Press Start 2P', cursive; color: #ccc; font-size: 0.7rem; }
.arena-header { background: #16213e; border-radius: 8px; padding: 10px; margin-bottom: 10px; border: 1px solid #2a2a4e; }
.arena-title-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.arena-title { font-size: 0.85rem; color: #e94560; }
.arena-runs { font-size: 0.65rem; color: #888; }
.arena-stats-bar { display: flex; gap: 12px; flex-wrap: wrap; font-size: 0.6rem; }
.arena-stat { color: #aaa; }
.arena-wanted { color: #f59e0b; }
.arena-buffs { background: #0f3460; border-radius: 6px; padding: 6px 10px; margin-bottom: 10px; border: 1px solid #22c55e33; }
.arena-buffs-title { font-size: 0.6rem; color: #22c55e; margin-bottom: 4px; }
.arena-buff-tag { display: inline-block; background: #22c55e22; color: #22c55e; border: 1px solid #22c55e44; border-radius: 4px; padding: 2px 6px; margin: 2px; font-size: 0.55rem; }
.arena-empty { text-align: center; padding: 30px; color: #888; font-size: 0.7rem; }
.arena-section-title { font-size: 0.75rem; color: #e94560; margin: 12px 0 8px; padding-left: 4px; border-left: 3px solid #e94560; }
.arena-fighters { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.arena-fighter-card { background: #16213e; border: 2px solid #2a2a4e; border-radius: 8px; padding: 8px; cursor: pointer; transition: border-color 0.2s; }
.arena-fighter-card:hover { border-color: #3b82f6; }
.arena-fighter-card.arena-selected { border-color: #22c55e; background: #22c55e11; }
.arena-fighter-name { font-size: 0.7rem; color: #fff; margin-bottom: 4px; }
.arena-level { color: #f59e0b; font-size: 0.6rem; }
.arena-fighter-stats { display: flex; gap: 10px; font-size: 0.6rem; color: #aaa; margin-bottom: 4px; }
.arena-fighter-record { font-size: 0.55rem; color: #888; }
.arena-events { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.arena-event-card { background: #16213e; border: 2px solid #2a2a4e; border-radius: 8px; padding: 10px; transition: border-color 0.2s; }
.arena-event-card:hover { border-color: #3b82f6; }
.arena-event-card.arena-locked { opacity: 0.5; }
.arena-event-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.arena-event-icon { font-size: 1.2rem; }
.arena-event-name { font-size: 0.75rem; color: #fff; flex: 1; }
.arena-lock-badge { font-size: 0.55rem; color: #f59e0b; background: #f59e0b22; padding: 2px 6px; border-radius: 4px; }
.arena-event-desc { font-size: 0.6rem; color: #888; margin-bottom: 6px; }
.arena-event-details { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.arena-cost { font-size: 0.55rem; color: #aaa; }
.arena-event-payout { margin-bottom: 6px; }
.arena-prize { font-size: 0.6rem; color: #22c55e; }
.arena-event-meals { margin-bottom: 8px; }
.arena-meal-select { width: 100%; background: #0f3460; color: #ccc; border: 1px solid #2a2a4e; border-radius: 4px; padding: 6px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; }
.arena-btn { font-family: 'Press Start 2P', cursive; font-size: 0.65rem; padding: 8px 16px; border: none; border-radius: 6px; cursor: pointer; transition: background 0.2s; }
.arena-enter-btn { background: #e94560; color: #fff; width: 100%; }
.arena-enter-btn:hover { background: #c73650; }
.arena-btn-disabled { opacity: 0.4; cursor: not-allowed; }
.arena-spectate { background: #16213e; border-radius: 8px; padding: 10px; margin-bottom: 12px; border: 1px solid #2a2a4e; }
.arena-spectate-desc { font-size: 0.6rem; color: #888; margin-bottom: 8px; }
.arena-spectate-row { display: flex; gap: 6px; align-items: center; }
.arena-input { background: #0f3460; color: #fff; border: 1px solid #2a2a4e; border-radius: 4px; padding: 6px; font-family: 'Press Start 2P', cursive; font-size: 0.6rem; width: 100px; }
.arena-spectate-btn { background: #22c55e; color: #fff; font-size: 0.55rem; padding: 6px 10px; }
.arena-spectate-btn:hover { background: #1da84a; }
.arena-spectate-lose { background: #e94560; }
.arena-spectate-lose:hover { background: #c73650; }
.arena-log { max-height: 200px; overflow-y: auto; }
.arena-log-entry { padding: 6px; margin-bottom: 4px; border-radius: 4px; font-size: 0.55rem; line-height: 1.6; }
.arena-log-info { background: #16213e; color: #aaa; }
.arena-log-error { background: #e9456022; color: #e94560; }
.arena-log-win { background: #22c55e22; color: #22c55e; }
.arena-log-lose { background: #e9456022; color: #e94560; }
.arena-result { border-radius: 8px; padding: 10px; margin-bottom: 6px; }
.arena-result-win { background: #22c55e11; border: 1px solid #22c55e44; }
.arena-result-lose { background: #e9456011; border: 1px solid #e9456044; }
.arena-result-header { font-size: 0.85rem; text-align: center; margin-bottom: 8px; }
.arena-result-win .arena-result-header { color: #22c55e; }
.arena-result-lose .arena-result-header { color: #e94560; }
.arena-result-event { text-align: center; font-size: 0.7rem; color: #ccc; margin-bottom: 4px; }
.arena-result-fighter { text-align: center; font-size: 0.65rem; color: #f59e0b; margin-bottom: 8px; }
.arena-rounds { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.arena-round { padding: 4px 8px; border-radius: 4px; font-size: 0.55rem; }
.arena-round-win { background: #22c55e11; border-left: 3px solid #22c55e; }
.arena-round-lose { background: #e9456011; border-left: 3px solid #e94560; }
.arena-round-header { color: #fff; font-size: 0.6rem; margin-bottom: 2px; }
.arena-round-detail { color: #aaa; }
.arena-round-hp { color: #888; }
.arena-result-stats { text-align: center; font-size: 0.6rem; }
.arena-prize-won { color: #22c55e; margin-bottom: 4px; }
.arena-fell { color: #e94560; margin-bottom: 4px; }
.arena-consolation { color: #888; }
.arena-wanted-gain { color: #f59e0b; margin-top: 4px; }
.arena-jailed { color: #e94560; margin-top: 4px; }

.holiday-banner {
    background: linear-gradient(90deg, #1a1a2e, #16213e, #0f3460, #16213e, #1a1a2e);
    background-size: 200% 100%;
    animation: holiday-shimmer 3s linear infinite;
    border: 2px solid #e94560;
    border-radius: 8px;
    padding: 8px 12px;
    margin: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.7rem;
    color: #fbbf24;
    text-align: center;
    z-index: 1000;
}

@keyframes holiday-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.holiday-emoji { font-size: 1.2rem; }
.holiday-name { color: #e94560; font-weight: bold; }
.holiday-message { color: #ccc; font-size: 0.6rem; }

.holiday-active-card {
    text-align: center;
    padding: 16px;
    margin-bottom: 12px;
    border: 2px solid #e94560;
    border-radius: 8px;
    background: #1a1a2e;
}
.holiday-active-emoji { font-size: 2rem; margin-bottom: 8px; }
.holiday-active-name { font-size: 1rem; color: #e94560; margin-bottom: 4px; }
.holiday-active-msg { font-size: 0.9rem; color: #aaa; margin-bottom: 10px; }
.holiday-bonuses {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-bottom: 12px;
}
.holiday-bonus-tag {
    background: #0f3460;
    color: #22c55e;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
}
.holiday-action-btn {
    display: block;
    width: 100%;
    padding: 12px;
    background: linear-gradient(180deg, #e94560, #c23152);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.85rem;
    cursor: pointer;
    margin-bottom: 6px;
}
.holiday-action-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, #f05a74, #d94560);
}
.holiday-action-btn:disabled {
    background: #333;
    color: #666;
    cursor: not-allowed;
}
.holiday-action-result {
    font-size: 0.8rem;
    color: #22c55e;
    min-height: 14px;
    margin-top: 4px;
}
.holiday-inactive-card {
    text-align: center;
    padding: 16px;
    margin-bottom: 12px;
    border: 1px solid #333;
    border-radius: 8px;
}
.holiday-inactive-text { font-size: 0.9rem; color: #888; }
.holiday-game-date {
    font-size: 0.9rem;
    color: #aaa;
    margin-bottom: 8px;
}
.holiday-upcoming-title {
    font-size: 1rem;
    color: #e94560;
    margin-bottom: 8px;
}
.holiday-upcoming-row {
    display: flex;
    align-items: center;
    padding: 8px;
    margin-bottom: 4px;
    border-radius: 4px;
    background: #16213e;
}
.holiday-upcoming-emoji { font-size: 1.4rem; margin-right: 10px; }
.holiday-upcoming-info { flex: 1; }
.holiday-upcoming-name { font-size: 0.9rem; color: #eee; }
.holiday-upcoming-date { font-size: 0.8rem; color: #888; }
.holiday-upcoming-bonuses { font-size: 0.7rem; color: #22c55e; margin-top: 2px; }

.wasm-vm-panel { display: flex; flex-direction: column; gap: 8px; }
.wasm-vm-header { display: flex; justify-content: space-between; align-items: center; font-size: 0.9rem; color: #fbbf24; }
.wasm-vm-status { font-size: 0.7rem; color: #888; }
.wasm-vm-display { display: flex; justify-content: center; background: #000; border: 2px solid #333; border-radius: 4px; padding: 8px; }
.wasm-vm-controls { display: flex; flex-direction: column; gap: 8px; }
.wasm-vm-iso-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.wasm-vm-select { background: #0f3460; color: #fff; border: 1px solid #2a2a4e; border-radius: 4px; padding: 6px; font-family: 'Press Start 2P', cursive; font-size: 0.6rem; flex: 1; min-width: 200px; }
.wasm-vm-info { font-size: 0.7rem; color: #888; text-align: center; }

body.holiday-icb-day { background: linear-gradient(180deg, #0a0a1a 0%, #1a0a00 100%); }
body.holiday-icb-day .wm-window { border-color: #f59e0b; }
body.holiday-icb-day .wm-window-titlebar { background: linear-gradient(90deg, #f59e0b, #d97706); }

body.holiday-halloween { background: linear-gradient(180deg, #0a0a1a 0%, #1a0a1a 100%); }
body.holiday-halloween .wm-window { border-color: #f97316; }
body.holiday-halloween .wm-window-titlebar { background: linear-gradient(90deg, #f97316, #c2410c); }

body.holiday-christmas { background: linear-gradient(180deg, #0a0a1a 0%, #0a1a0a 100%); }
body.holiday-christmas .wm-window { border-color: #22c55e; }
body.holiday-christmas .wm-window-titlebar { background: linear-gradient(90deg, #22c55e, #16a34a); }

body.holiday-new-year .holiday-banner,
body.holiday-nye .holiday-banner { animation-duration: 1s; border-color: #fbbf24; }

body.holiday-star-wars { background: linear-gradient(180deg, #0a0a1a 0%, #0a0a2a 100%); }
body.holiday-star-wars .wm-window { border-color: #fbbf24; }

body.holiday-cinco-de-mayo { background: linear-gradient(180deg, #0a0a1a 0%, #1a1a00 100%); }
body.holiday-cinco-de-mayo .wm-window { border-color: #eab308; }

body.holiday-independence { background: linear-gradient(180deg, #0a0a1a 0%, #1a0a0a 100%); }
body.holiday-independence .wm-window { border-color: #ef4444; }
body.holiday-independence .wm-window-titlebar { background: linear-gradient(90deg, #3b82f6, #ef4444); }

body.holiday-summer { background: linear-gradient(180deg, #0a0a1a 0%, #1a1a00 100%); }
body.holiday-summer .wm-window { border-color: #f59e0b; }

body.holiday-thanksgiving { background: linear-gradient(180deg, #0a0a1a 0%, #1a1008 100%); }
body.holiday-thanksgiving .wm-window { border-color: #d97706; }

body.holiday-valentine { background: linear-gradient(180deg, #0a0a1a 0%, #1a0a14 100%); }
body.holiday-valentine .wm-window { border-color: #ec4899; }

body.holiday-st-patrick { background: linear-gradient(180deg, #0a0a1a 0%, #0a1a0a 100%); }
body.holiday-st-patrick .wm-window { border-color: #22c55e; }

/* World Events */
.we-section { margin-bottom: 16px; }
.we-section-title { font-size: 0.85rem; color: var(--accent); margin-bottom: 10px; border-bottom: 2px solid var(--border); padding-bottom: 6px; }
.we-card { background: var(--bg-2); border: 1px solid var(--border); border-left: 4px solid var(--accent); border-radius: var(--radius-md); padding: 10px 12px; margin-bottom: 8px; }
.we-card-active { animation: wePulse 2s infinite; }
@keyframes wePulse { 0% { box-shadow: 0 0 0 0 rgba(233, 69, 96, 0.2); } 70% { box-shadow: 0 0 0 6px rgba(233, 69, 96, 0); } 100% { box-shadow: 0 0 0 0 rgba(233, 69, 96, 0); } }
.we-card-history { opacity: 0.7; border-left-color: #666; }
.we-card-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.we-card-icon { font-size: 1.2rem; }
.we-card-name { font-size: 0.8rem; color: var(--text-0); flex: 1; }
.we-card-timer { font-size: 0.7rem; color: var(--warning); font-family: monospace; }
.we-card-desc { font-size: 0.7rem; color: var(--text-1); line-height: 1.4; margin-bottom: 6px; }
.we-card-meta { font-size: 0.65rem; color: var(--text-3); text-transform: uppercase; }
.we-effects { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.we-effect-tag { font-size: 0.6rem; background: var(--bg-3); color: var(--text-2); padding: 2px 6px; border-radius: var(--radius-sm); border: 1px solid var(--border); }
.we-empty { font-size: 0.75rem; color: var(--text-3); padding: 12px; text-align: center; }
.we-modifiers { background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 10px; }
.we-modifier-row { display: flex; justify-content: space-between; align-items: center; padding: 4px 0; border-bottom: 1px solid var(--border); }
.we-modifier-row:last-child { border-bottom: none; }
 .we-modifier-name { font-size: 0.7rem; color: var(--text-2); text-transform: capitalize; }
 .we-modifier-val { font-size: 0.75rem; font-weight: bold; font-family: monospace; }


.gift-tab-btn.active { background: #e94560 !important; border-color: #e94560 !important; }
.gift-tab-content { display: none; }
.gift-tab-content.active { display: block; }
.gift-item { background: #16213e; border: 1px solid #333; border-radius: 6px; padding: 10px; margin-bottom: 8px; }
.gift-item:hover { border-color: #555; }
.gift-from { color: #e94560; font-family: 'Press Start 2P', cursive; font-size: 0.65rem; margin-bottom: 4px; }
.gift-amount { color: #22c55e; font-family: 'Press Start 2P', cursive; font-size: 0.8rem; margin-bottom: 4px; }
.gift-message { color: #aaa; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; margin-bottom: 4px; font-style: italic; }
.gift-time { color: #666; font-family: 'Press Start 2P', cursive; font-size: 0.5rem; margin-bottom: 6px; }
.gift-actions { display: flex; gap: 6px; }
.gift-claim-btn { background: #22c55e; color: #fff; border: none; border-radius: 4px; padding: 4px 10px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; cursor: pointer; }
.gift-claim-btn:hover { background: #16a34a; }
.gift-return-btn { background: #333; color: #ffd700; border: 1px solid #666; border-radius: 4px; padding: 4px 10px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; cursor: pointer; }
.gift-return-btn:hover { background: #444; }
.gift-sent-item { opacity: 0.7; }

.profile-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 100000; justify-content: center; align-items: center; }
.profile-card { background: var(--bg-1); border: 2px solid var(--accent); border-radius: var(--radius-md); padding: 16px 20px; min-width: 300px; max-width: 420px; max-height: 80vh; overflow-y: auto; font-family: 'Press Start 2P', cursive; }
.profile-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--border); }
.profile-name { font-size: 1rem; color: var(--accent); word-break: break-all; }
.profile-close { background: none; border: none; color: var(--text-2); font-size: 1.2rem; cursor: pointer; font-family: inherit; padding: 0 4px; }
.profile-close:hover { color: var(--accent); }
.profile-badge { font-size: 0.65rem; color: var(--warning); margin-bottom: 8px; }
.profile-badge-self { color: var(--success); }
.profile-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; }
.profile-stat { display: flex; align-items: center; gap: 6px; font-size: 0.55rem; }
.profile-stat-icon { flex-shrink: 0; }
.profile-stat-label { color: var(--text-2); min-width: 60px; }
.profile-stat-value { color: var(--text-0); font-weight: bold; }
.profile-divider { border-top: 1px solid var(--border); margin: 10px 0; }
.profile-details { display: flex; flex-direction: column; gap: 5px; }
.profile-footer { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--border); font-size: 0.55rem; color: var(--text-2); text-align: center; }
.profile-player-link { color: var(--accent); cursor: pointer; text-decoration: underline; }
.profile-player-link:hover { color: var(--accent-hover); }

/* ===== Banking Window ===== */
.banking-panel { padding: 8px; font-family: 'Press Start 2P', cursive; }
.banking-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid #333; }
.banking-header-title { font-size: 0.9rem; color: #e94560; }
.banking-tier-badge { font-size: 0.65rem; background: #16213e; border: 1px solid #444; border-radius: 4px; padding: 3px 8px; color: #ccc; }
.banking-balance-section { text-align: center; padding: 12px; background: #0f3460; border-radius: 8px; margin-bottom: 10px; }
.banking-balance-label { font-size: 0.55rem; color: #888; margin-bottom: 6px; }
.banking-balance-amount { font-size: 1.4rem; color: #22c55e; margin-bottom: 6px; }
.banking-rate-info { display: flex; justify-content: center; gap: 16px; font-size: 0.55rem; }
.banking-rate-info span { color: #888; }
.banking-pending { font-weight: bold; }
.banking-deposit-bar { display: flex; gap: 4px; margin-bottom: 8px; }
.banking-amount-input { flex: 1; padding: 6px 8px; font-family: 'Press Start 2P', cursive; font-size: 0.65rem; background: #0d1117; color: #fff; border: 2px solid #333; border-radius: 4px; min-width: 0; }
.banking-amount-input:focus { border-color: #e94560; outline: none; }
.banking-btn { padding: 6px 10px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; border: none; border-radius: 4px; cursor: pointer; white-space: nowrap; }
.banking-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.banking-deposit-btn { background: #22c55e; color: #000; }
.banking-deposit-btn:hover:not(:disabled) { background: #16a34a; }
.banking-depositall-btn { background: #3b82f6; color: #fff; }
.banking-depositall-btn:hover:not(:disabled) { background: #2563eb; }
.banking-withdraw-btn { background: #ef4444; color: #fff; }
.banking-withdraw-btn:hover:not(:disabled) { background: #dc2626; }
.banking-result { font-size: 0.6rem; min-height: 16px; margin-bottom: 8px; text-align: center; }
.banking-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 10px; }
.banking-info-item { display: flex; justify-content: space-between; align-items: center; background: #16213e; padding: 5px 8px; border-radius: 4px; }
.banking-info-label { font-size: 0.5rem; color: #888; }
.banking-info-value { font-size: 0.55rem; color: #ccc; }
.banking-upgrade-section { background: #1a1a2e; border: 1px solid #444; border-radius: 6px; padding: 8px; margin-bottom: 10px; display: none; }
.banking-upgrade-header { font-size: 0.6rem; color: #e94560; margin-bottom: 6px; }
.banking-upgrade-info { font-size: 0.5rem; color: #ccc; margin-bottom: 8px; line-height: 1.4; }
.banking-upgrade-btn { width: 100%; padding: 8px; font-family: 'Press Start 2P', cursive; font-size: 0.6rem; background: #f59e0b; color: #000; border: none; border-radius: 4px; cursor: pointer; }
.banking-upgrade-btn:hover:not(:disabled) { background: #d97706; }
.banking-tiers-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.banking-tier-card { background: #16213e; border: 1px solid #333; border-radius: 6px; padding: 6px; text-align: center; }
.banking-tier-current { border-color: #22c55e; background: #0a2a1a; }
.banking-tier-icon { font-size: 1.2rem; }
.banking-tier-name { font-size: 0.5rem; color: #ccc; margin: 3px 0; }
.banking-tier-rate { font-size: 0.5rem; color: #22c55e; }
.banking-tier-max { font-size: 0.45rem; color: #888; }
.banking-tier-ins { font-size: 0.45rem; color: #3b82f6; margin-top: 2px; }

.re-panel { padding: 8px; font-family: 'Press Start 2P', cursive; }
.re-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 2px solid #333; }
.re-header-title { font-size: 0.85rem; color: #e94560; }
.re-wallet { font-size: 0.6rem; color: #22c55e; }
.re-summary { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; padding: 8px; background: #0f3460; border-radius: 8px; flex-wrap: wrap; }
.re-summary-item { display: flex; flex-direction: column; align-items: center; flex: 1; min-width: 80px; }
.re-summary-label { font-size: 0.45rem; color: #888; margin-bottom: 3px; }
.re-summary-value { font-size: 0.65rem; color: #ccc; }
.re-stat-green { color: #22c55e; }
.re-collect-btn { background: #22c55e; color: #1a1a2e; border: none; border-radius: 6px; padding: 6px 12px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; cursor: pointer; }
.re-collect-btn:hover { background: #16a34a; }
.re-result { font-size: 0.55rem; min-height: 16px; margin-bottom: 6px; text-align: center; }
.re-section-title { font-size: 0.65rem; color: #e94560; margin: 10px 0 6px 0; border-bottom: 1px solid #333; padding-bottom: 4px; }
.re-owned-list { margin-bottom: 8px; }
.re-empty { font-size: 0.55rem; color: #666; text-align: center; padding: 12px; }
.re-owned-card { display: flex; align-items: center; gap: 8px; padding: 6px; background: #16213e; border-radius: 6px; margin-bottom: 4px; border: 1px solid #253a5e; }
.re-owned-icon { font-size: 1.5rem; }
.re-owned-info { flex: 1; }
.re-owned-name { font-size: 0.55rem; color: #e94560; margin-bottom: 3px; }
.re-owned-stats { display: flex; gap: 6px; flex-wrap: wrap; }
.re-owned-stats .re-stat { font-size: 0.45rem; color: #888; }
.re-owned-stats .re-stat-green { font-size: 0.45rem; color: #22c55e; }
.re-owned-actions { display: flex; gap: 4px; flex-direction: column; }
.re-upgrade-btn { background: #3b82f6; color: #fff; border: none; border-radius: 4px; padding: 4px 8px; font-family: 'Press Start 2P', cursive; font-size: 0.4rem; cursor: pointer; white-space: nowrap; }
.re-upgrade-btn:hover { background: #2563eb; }
.re-sell-btn { background: #ef4444; color: #fff; border: none; border-radius: 4px; padding: 4px 8px; font-family: 'Press Start 2P', cursive; font-size: 0.4rem; cursor: pointer; white-space: nowrap; }
.re-sell-btn:hover { background: #dc2626; }
.re-max-level { font-size: 0.45rem; color: #f59e0b; text-align: center; }
.re-market-list {}
.re-category { margin-bottom: 8px; }
.re-category-title { font-size: 0.55rem; color: #3b82f6; margin-bottom: 4px; }
.re-property-card { display: flex; align-items: center; gap: 8px; padding: 6px; background: #1a1a2e; border-radius: 6px; margin-bottom: 3px; border: 1px solid #253a5e; }
.re-property-card.re-owned { border-color: #22c55e44; background: #16213e; }
.re-prop-icon { font-size: 1.3rem; }
.re-prop-info { flex: 1; }
.re-prop-name { font-size: 0.5rem; color: #ccc; margin-bottom: 2px; }
.re-prop-stats { display: flex; gap: 6px; flex-wrap: wrap; }
.re-prop-stats .re-stat { font-size: 0.4rem; color: #888; }
.re-prop-owned { font-size: 0.4rem; color: #666; margin-top: 2px; }
.re-buy-btn { background: #22c55e; color: #1a1a2e; border: none; border-radius: 4px; padding: 4px 10px; font-family: 'Press Start 2P', cursive; font-size: 0.4rem; cursor: pointer; white-space: nowrap; }
.re-buy-btn:hover { background: #16a34a; }
.re-buy-btn.re-btn-disabled { background: #333; color: #666; cursor: not-allowed; }

.vibe-purchase { text-align: center; padding: 15px; }
.vibe-title { font-size: 1rem; color: #e94560; margin-bottom: 10px; }
.vibe-desc { font-size: 0.55rem; color: #aaa; line-height: 1.6; margin-bottom: 12px; }
.vibe-features { text-align: left; margin: 0 auto 15px auto; max-width: 320px; }
.vibe-feature { font-size: 0.5rem; color: #ccc; padding: 3px 0; }
.vibe-cost { font-size: 0.7rem; color: #f59e0b; margin-bottom: 12px; }
.vibe-buy-btn { background: linear-gradient(135deg, #e94560, #c2185b); color: #fff; border: none; border-radius: 8px; padding: 10px 20px; font-family: 'Press Start 2P', cursive; font-size: 0.6rem; cursor: pointer; transition: transform 0.1s; }
.vibe-buy-btn:hover { transform: scale(1.05); }
.vibe-panel { padding: 10px; }
.vibe-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid #333; }
.vibe-status { font-size: 0.7rem; color: #22c55e; }
.vibe-level { font-size: 0.55rem; color: #f59e0b; }
.vibe-controls { margin-bottom: 10px; text-align: center; }
.vibe-toggle-btn { background: #3b82f6; color: #fff; border: none; border-radius: 6px; padding: 8px 16px; font-family: 'Press Start 2P', cursive; font-size: 0.55rem; cursor: pointer; }
.vibe-toggle-btn:hover { background: #2563eb; }
.vibe-stats { margin-bottom: 10px; }
.vibe-stat-row { display: flex; justify-content: space-between; font-size: 0.5rem; padding: 2px 0; color: #aaa; }
.vibe-section-title { font-size: 0.6rem; color: #e94560; margin: 8px 0 6px 0; border-bottom: 1px solid #333; padding-bottom: 4px; }
.vibe-log { max-height: 200px; overflow-y: auto; }
.vibe-log-entry { font-size: 0.45rem; padding: 2px 0; border-bottom: 1px solid #1a1a2e; }
.vibe-log-time { color: #666; margin-right: 6px; }
.vibe-log-msg { color: #aaa; }

#vibeCursor .vibe-cursor-pointer { width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 14px solid #e94560; filter: drop-shadow(0 0 4px #e94560aa); }
#vibeCursor .vibe-cursor-trail { width: 4px; height: 4px; border-radius: 50%; background: #e9456066; position: absolute; top: 14px; left: 5px; }

@keyframes vibeClickRipple {
    0% { transform: scale(0.5); opacity: 1; }
    100% { transform: scale(2); opacity: 0; }
}

.roller-btn {
    border: 2px solid var(--accent);
    border-radius: var(--radius-sm);
    padding: 8px 14px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.55rem;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
    display: inline-block;
    text-decoration: none;
    line-height: 1.4;
    white-space: nowrap;
}
.roller-btn:hover { opacity: 0.85; }
.roller-btn:active { opacity: 0.7; }
.roller-btn:disabled { opacity: 0.4; cursor: not-allowed; pointer-events: none; }
.roller-btn--roller { background: var(--accent); color: #fff; border-color: var(--accent); }
.roller-btn--roller:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.roller-btn--conveyor { background: var(--success); color: #fff; border-color: var(--success); }
.roller-btn--conveyor:hover { opacity: 0.85; }
.roller-btn--alarm { background: var(--danger); color: #fff; border-color: var(--danger); }
.roller-btn--alarm:hover { opacity: 0.85; }
.roller-btn--warning { background: var(--warning); color: #000; border-color: var(--warning); }
.roller-btn--warning:hover { opacity: 0.85; }
.roller-btn--ghost { background: transparent; color: var(--text-1); border-color: var(--border); }
.roller-btn--ghost:hover { border-color: var(--border-light); background: rgba(255,255,255,0.03); }
.roller-btn--outline { background: transparent; color: var(--accent); border-color: var(--accent); }
.roller-btn--outline:hover { background: rgba(233,69,96,0.1); }
.roller-btn--blue { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.roller-btn--blue:hover { background: #2563eb; }
.roller-btn--gold { background: var(--gold); color: #000; border-color: var(--gold); }
.roller-btn--gold:hover { opacity: 0.85; }
.roller-btn--sm { font-size: 0.65rem; padding: 6px 10px; }
.roller-btn--md { font-size: 0.55rem; padding: 8px 14px; }
.roller-btn--lg { font-size: 0.8rem; padding: 10px 20px; }

.roller-input {
    background: #111;
    border: 1px solid var(--border);
    color: var(--text-0);
    padding: 8px 10px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.6rem;
    border-radius: var(--radius-sm);
    outline: none;
    width: 100%;
    transition: border-color 0.15s;
}
.roller-input:focus { border-color: var(--accent); }
.roller-input::placeholder { color: var(--text-3); }

.roller-select {
    background: #111;
    border: 1px solid var(--border);
    color: var(--text-0);
    padding: 8px 10px;
    font-family: 'Press Start 2P', cursive;
    font-size: 0.6rem;
    border-radius: var(--radius-sm);
    outline: none;
    cursor: pointer;
}
.roller-select:focus { border-color: var(--accent); }

.roller-badge {
    display: inline-block;
    padding: 2px 6px;
    font-size: 0.4rem;
    border-radius: var(--radius-sm);
    font-family: 'Press Start 2P', cursive;
    line-height: 1.4;
}
.roller-badge--roller { background: rgba(233,69,96,0.15); color: var(--accent); border: 1px solid rgba(233,69,96,0.3); }
.roller-badge--conveyor { background: rgba(34,197,94,0.15); color: var(--success); border: 1px solid rgba(34,197,94,0.3); }
.roller-badge--alarm { background: rgba(239,68,68,0.15); color: var(--danger); border: 1px solid rgba(239,68,68,0.3); }
.roller-badge--warning { background: rgba(245,158,11,0.15); color: var(--warning); border: 1px solid rgba(245,158,11,0.3); }
.roller-badge--gold { background: rgba(255,215,0,0.15); color: var(--gold); border: 1px solid rgba(255,215,0,0.3); }
.roller-badge--ghost { background: rgba(255,255,255,0.03); color: var(--text-2); border: 1px solid var(--border); }
.roller-badge--blue { background: rgba(59,130,246,0.15); color: #3b82f6; border: 1px solid rgba(59,130,246,0.3); }
.roller-badge--purple { background: rgba(192,132,252,0.15); color: #c084fc; border: 1px solid rgba(192,132,252,0.3); }

.roller-stat { display: flex; align-items: center; }
.roller-stat--column { flex-direction: column; gap: 2px; }
.roller-stat--row { flex-direction: row; gap: 6px; }
.roller-stat-label { color: var(--text-2); font-size: 0.5rem; }
.roller-stat-value { color: var(--text-0); font-size: 0.9rem; }
.roller-stat-icon { margin-right: 2px; }

.roller-icon { display: inline-block; }

.roller-spinner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 20px;
    color: var(--text-2);
    font-size: 0.7rem;
}
.roller-spinner-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: roller-spin 0.6s linear infinite;
}
@keyframes roller-spin { to { transform: rotate(360deg); } }
.roller-spinner-msg { font-size: 0.6rem; }

.roller-divider {
    border: none;
    border-top: 1px solid var(--border);
    margin: 12px 0;
    height: 0;
}

.roller-tooltip {
    position: relative;
    cursor: help;
}

.roller-status-line {
    font-size: 0.55rem;
    padding: 4px 0;
    transition: color 0.3s;
}

.roller-card {
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 8px;
    overflow: hidden;
}
.roller-card--deep {
    background: #0f3460;
    border-color: #1a3a6e;
}
.roller-card-header {
    font-size: 0.5rem;
    color: var(--text-2);
    margin-bottom: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--border);
}
.roller-card-body {
    font-size: 0.55rem;
    color: var(--text-1);
    line-height: 1.6;
}
.roller-card-footer {
    font-size: 0.4rem;
    color: var(--text-3);
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid var(--border);
}
.roller-card-icon { margin-right: 4px; }

.roller-progress { margin: 4px 0; }
.roller-progress-track {
    background: #1a1a2e;
    border-radius: var(--radius-sm);
    overflow: hidden;
    border: 1px solid #333;
    position: relative;
}
.roller-progress-fill {
    border-radius: var(--radius-sm);
    transition: width 0.3s ease;
    height: 100%;
}
.roller-progress-pct {
    color: var(--text-3);
    font-size: 0.4rem;
    text-align: right;
    margin-top: 1px;
}
.roller-progress-label {
    color: var(--text-2);
    font-size: 0.45rem;
    margin-top: 2px;
}

.roller-tab-bar {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--border);
    margin-bottom: 8px;
    overflow-x: auto;
}
.roller-tab {
    background: transparent;
    border: none;
    color: var(--text-2);
    font-family: 'Press Start 2P', cursive;
    font-size: 0.5rem;
    padding: 6px 10px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
    white-space: nowrap;
}
.roller-tab:hover { color: var(--text-1); }
.roller-tab--active {
    color: var(--accent);
    border-bottom-color: var(--accent);
}

.roller-alert {
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 0.55rem;
    line-height: 1.6;
    margin: 8px 0;
}
.roller-alert--info { background: rgba(59,130,246,0.1); border: 1px solid rgba(59,130,246,0.3); color: #93c5fd; }
.roller-alert--success { background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.3); color: #86efac; }
.roller-alert--warning { background: rgba(245,158,11,0.1); border: 1px solid rgba(245,158,11,0.3); color: #fcd34d; }
.roller-alert--danger { background: rgba(239,68,68,0.1); border: 1px solid rgba(239,68,68,0.3); color: #fca5a5; }
.roller-alert-icon { font-weight: bold; flex-shrink: 0; }
.roller-alert-msg { flex: 1; }

.roller-form-group { margin-bottom: 8px; }
.roller-form-label { display: block; color: var(--text-2); font-size: 0.5rem; margin-bottom: 4px; }
.roller-form-input-wrap {}
.roller-form-hint { color: var(--text-3); font-size: 0.4rem; margin-top: 2px; }

.roller-table {
    width: 100%;
    border-collapse: collapse;
}
.roller-table-th {
    text-align: left;
    padding: 4px 6px;
    color: var(--text-2);
    font-size: 0.45rem;
    border-bottom: 1px solid var(--border);
}
.roller-table-td {
    padding: 3px 6px;
    font-size: 0.5rem;
}
.roller-table-row:hover { background: rgba(255,255,255,0.02); }
.roller-table-head-row { background: rgba(255,255,255,0.02); }

.roller-grid {
    display: grid;
}
.roller-grid--1 { grid-template-columns: 1fr; }
.roller-grid--2 { grid-template-columns: 1fr 1fr; }
.roller-grid--3 { grid-template-columns: 1fr 1fr 1fr; }
.roller-grid--4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.roller-grid--5 { grid-template-columns: repeat(5, 1fr); }
.roller-grid--6 { grid-template-columns: repeat(6, 1fr); }
.roller-grid-item {}

.roller-leaderboard { font-size: 0.55rem; }
.roller-lb-header {
    display: flex;
    padding: 4px 6px;
    color: var(--text-2);
    font-size: 0.45rem;
    border-bottom: 1px solid var(--border);
}
.roller-lb-row {
    display: flex;
    padding: 4px 6px;
    border-bottom: 1px solid rgba(255,255,255,0.02);
    transition: background 0.15s;
}
.roller-lb-row:hover { background: rgba(255,255,255,0.02); }
.roller-lb--gold { background: rgba(255,215,0,0.05); }
.roller-lb--silver { background: rgba(192,192,192,0.05); }
.roller-lb--bronze { background: rgba(205,127,50,0.05); }
.roller-lb--highlight { background: rgba(233,69,96,0.08); }
.roller-lb-rank { width: 30px; color: var(--text-2); flex-shrink: 0; }
.roller-lb-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.roller-lb-value { color: var(--text-1); text-align: right; flex-shrink: 0; }

.roller-price { display: inline-flex; align-items: center; gap: 6px; }
.roller-price-value { font-size: 0.8rem; }
.roller-price-change { font-size: 0.5rem; }

.roller-section-header {
    margin-bottom: 8px;
    line-height: 1.4;
}
.roller-section-subtitle {
    font-size: 0.55rem;
    color: var(--text-2);
    margin-top: 4px;
}

.roller-action-bar {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 12px;
    flex-wrap: wrap;
}

.roller-window-content { padding: 8px 0; }

.roller-error-box {
    color: var(--danger);
    padding: 8px;
    font-size: 0.6rem;
}

.roller-empty-state {
    text-align: center;
    padding: 20px;
    color: var(--text-3);
    font-size: 0.6rem;
}
.roller-empty-icon { font-size: 1.5rem; margin-bottom: 8px; }
.roller-empty-msg { font-size: 0.55rem; }

.roller-stat-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}
.roller-stat-row-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}
.roller-stat-row-label { color: var(--text-2); font-size: 0.45rem; }
.roller-stat-row-value { color: var(--text-0); font-size: 0.8rem; }

.roller-scroll-list {
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
}
.roller-scroll-list::-webkit-scrollbar { width: 6px; }
.roller-scroll-list::-webkit-scrollbar-track { background: transparent; }
.roller-scroll-list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }

.roller-colored-box {
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    font-size: 0.55rem;
    font-family: 'Press Start 2P', cursive;
}