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

body {
    font-family: "MS Sans Serif", Arial, sans-serif;
    font-size: 11px;
    overflow: hidden;
    user-select: none;
    cursor: default;
}

.desktop {
    width: 100vw;
    height: calc(100vh - 32px);
    background: linear-gradient(135deg, #006b6b 0%, #008080 50%, #009999 100%);
    position: relative;
    overflow: hidden;
}

/* Desktop Icons */
.desktop-icons {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 100%;
    gap: 20px;
}

.desktop-icon {
    width: 75px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 4px;
    cursor: pointer;
    border: 1px solid transparent;
}

.desktop-icon:hover {
    background-color: rgba(0, 0, 128, 0.3);
    border: 1px dotted #ffffff;
}

.desktop-icon.selected {
    background-color: rgba(0, 0, 128, 0.5);
    border: 1px dotted #ffffff;
}

/* Desktop Icons */
.desktop-icon div[class^="icon-"] {
    width: 32px;
    height: 32px;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
}

.icon-computer {
    background: linear-gradient(to bottom, #c0c0c0, #a0a0a0);
    position: relative;
}

.icon-computer::before {
    content: "💻";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-recycle {
    background: linear-gradient(to bottom, #e0e0e0, #d0d0d0);
    position: relative;
}

.icon-recycle::before {
    content: "🗑️";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-folder {
    background: linear-gradient(to bottom, #ffff80, #ffff40);
    position: relative;
}

.icon-folder::before {
    content: "📁";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-ie {
    background: linear-gradient(to bottom, #4080ff, #2060ff);
    position: relative;
}

.icon-ie::before {
    content: "🌐";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-network {
    background: linear-gradient(to bottom, #80ff80, #60ff60);
    position: relative;
}

.icon-network::before {
    content: "🌍";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-casino {
    background: linear-gradient(45deg, #ff6b6b, #ffd93d, #6bcf7f, #4ecdc4);
    background-size: 400% 400%;
    animation: casino-glow 2s ease-in-out infinite;
    position: relative;
    border-radius: 4px;
}

.icon-casino::before {
    content: "🎰";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0 0 4px rgba(255, 255, 255, 0.8);
}

.icon-twitter {
    background: linear-gradient(to bottom, #1DA1F2, #1a91da);
    position: relative;
}

.icon-twitter::before {
    content: "𝕏";
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-weight: bold;
}

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

.premium-game {
    position: relative;
}

.premium-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    background: linear-gradient(45deg, #ffd700, #ffed4e);
    border: 1px solid #ff6b00;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    box-shadow: 0 0 4px rgba(255, 107, 0, 0.5);
}

.desktop-icon span {
    color: white;
    text-align: center;
    font-size: 11px;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

/* Windows */
.window {
    position: absolute;
    min-width: 300px;
    min-height: 200px;
    background-color: #c8c8c8;
    border: 2px solid;
    border-color: #f0f0f0 #707070 #707070 #f0f0f0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
}

.window-header {
    background: linear-gradient(to right, #1a1a80, #2563eb, #3b82f6);
    color: white;
    padding: 3px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: move;
    font-size: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.window-title {
    padding-left: 4px;
    font-weight: bold;
}

.window-controls {
    display: flex;
    gap: 2px;
}

.window-button {
    width: 18px;
    height: 16px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 11px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: all 0.1s;
}

.window-button:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.window-button:active {
    border-color: #808080 #dfdfdf #dfdfdf #808080;
}

.window-content {
    padding: 0;
    background-color: white;
    border: 2px inset #dfdfdf;
    margin: 2px;
    min-height: 150px;
    display: flex;
    flex-direction: column;
}

/* Taskbar */
.taskbar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: linear-gradient(to bottom, #d4d4d4 0%, #c0c0c0 50%, #b0b0b0 100%);
    border-top: 2px solid #f0f0f0;
    display: flex;
    align-items: center;
    padding: 2px;
    box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.2);
}

.start-button {
    height: 26px;
    padding: 0 8px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: bold;
    font-size: 12px;
    transition: all 0.1s;
}

.start-button:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.start-button:active {
    border-color: #808080 #dfdfdf #dfdfdf #808080;
}

.windows-logo {
    width: 16px;
    height: 14px;
    background: linear-gradient(45deg, 
        #ff0000 0%, #ff0000 25%,
        #00ff00 25%, #00ff00 50%,
        #0000ff 50%, #0000ff 75%,
        #ffff00 75%, #ffff00 100%);
    border: 1px solid #000000;
}

.taskbar-windows {
    flex: 1;
    display: flex;
    gap: 2px;
    padding: 0 4px;
}

.taskbar-window {
    height: 26px;
    padding: 0 8px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #808080 #dfdfdf #dfdfdf #808080;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.taskbar-window.active {
    background-color: #dfdfdf;
    border-color: #808080 #dfdfdf #dfdfdf #808080;
    font-weight: bold;
}

.system-tray {
    height: 26px;
    padding: 0 8px;
    border: 2px inset #dfdfdf;
    display: flex;
    align-items: center;
    gap: 12px;
}

.clock {
    font-size: 11px;
}

.sol-price {
    font-size: 11px;
    font-weight: bold;
    color: #006600;
    background: #e6ffe6;
    padding: 2px 6px;
    border-radius: 2px;
}

/* Start Menu */
.start-menu {
    position: absolute;
    bottom: 32px;
    left: 0;
    width: 200px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #dfdfdf #808080 #808080 #dfdfdf;
    display: flex;
    box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.3);
}

.start-menu-sidebar {
    width: 28px;
    background: linear-gradient(to bottom, #1a1a80, #2563eb);
    color: white;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 8px 2px;
    font-weight: bold;
    font-size: 18px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.start-menu-content {
    flex: 1;
    padding: 2px;
}

.start-menu-item {
    padding: 8px 16px 8px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
}

.start-menu-item:hover {
    background-color: #000080;
    color: white;
}

.menu-icon {
    width: 16px;
    height: 16px;
    border: 1px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    position: relative;
}

.icon-programs {
    background: linear-gradient(to bottom, #ffff80, #ffff40);
}

.icon-programs::before {
    content: "📂";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-documents {
    background: linear-gradient(to bottom, #ffffff, #e0e0e0);
}

.icon-documents::before {
    content: "📄";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-settings {
    background: linear-gradient(to bottom, #c0c0c0, #a0a0a0);
}

.icon-settings::before {
    content: "⚙️";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-find {
    background: linear-gradient(to bottom, #80ff80, #60ff60);
}

.icon-find::before {
    content: "🔍";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-help {
    background: linear-gradient(to bottom, #4080ff, #2060ff);
}

.icon-help::before {
    content: "❓";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-run {
    background: linear-gradient(to bottom, #ff8080, #ff6060);
}

.icon-run::before {
    content: "▶️";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-shutdown {
    background: linear-gradient(to bottom, #ff4040, #ff2020);
}

.icon-shutdown::before {
    content: "🔌";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Additional Program Icons */
.icon-notepad {
    background: linear-gradient(to bottom, #ffffff, #f0f0f0);
}

.icon-notepad::before {
    content: "📝";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-calculator {
    background: linear-gradient(to bottom, #c0c0c0, #a0a0a0);
}

.icon-calculator::before {
    content: "🔢";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-minesweeper {
    background: linear-gradient(to bottom, #ff8080, #ff6060);
}

.icon-minesweeper::before {
    content: "💣";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-solitaire {
    background: linear-gradient(to bottom, #80ff80, #60ff60);
}

.icon-solitaire::before {
    content: "🃏";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-crypto {
    background: linear-gradient(to bottom, #ffff80, #ffff40);
}

.icon-crypto::before {
    content: "₿";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-meme {
    background: linear-gradient(to bottom, #ff80ff, #ff60ff);
}

.icon-meme::before {
    content: "😂";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-display {
    background: linear-gradient(to bottom, #8080ff, #6060ff);
}

.icon-display::before {
    content: "🖥️";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-control {
    background: linear-gradient(to bottom, #ff8040, #ff6020);
}

.icon-control::before {
    content: "⚙️";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.icon-system {
    background: linear-gradient(to bottom, #40ff80, #20ff60);
}

.icon-system::before {
    content: "💻";
    font-size: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Submenu Styles */
.submenu {
    position: fixed;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    z-index: 10011;
    min-width: 140px;
    left: 200px;
    bottom: 32px;
}

.submenu-item {
    padding: 4px 16px 4px 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
}

.submenu-item:hover {
    background-color: #000080;
    color: white;
}

.submenu-separator {
    height: 1px;
    background-color: #808080;
    margin: 2px 4px;
    border-bottom: 1px solid #f0f0f0;
}

/* Run Dialog Styles */
.run-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10020;
}

.run-window {
    width: 350px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
}

.run-content {
    padding: 16px;
}

.run-text {
    margin-bottom: 16px;
    font-size: 11px;
}

.run-input-section {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.run-input-section label {
    font-size: 11px;
    font-weight: bold;
}

.run-input-section input {
    flex: 1;
    padding: 2px 4px;
    border: 2px inset #d4d4d4;
    font-size: 11px;
}

.run-browse {
    padding: 2px 8px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 11px;
    cursor: pointer;
}

.run-buttons {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.run-btn {
    padding: 4px 16px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
}

.run-btn:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

/* Help Dialog Styles */
.help-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10020;
}

.help-window {
    width: 500px;
    height: 400px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
}

.help-content {
    padding: 16px;
    height: calc(100% - 24px);
    overflow-y: auto;
    background-color: white;
    border: 2px inset #c0c0c0;
    margin: 2px;
}

.help-topics h3 {
    color: #000080;
    font-size: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 4px;
}

.help-section {
    margin-bottom: 20px;
}

.help-section h4 {
    color: #000080;
    font-size: 12px;
    margin-bottom: 8px;
}

.help-section ul {
    margin-left: 20px;
    font-size: 11px;
    line-height: 1.4;
}

.help-section li {
    margin-bottom: 4px;
}

.start-menu-item .arrow {
    position: absolute;
    right: 4px;
    font-size: 8px;
}

.start-menu hr {
    border: none;
    border-top: 1px solid #808080;
    border-bottom: 1px solid #dfdfdf;
    margin: 2px 4px;
}

/* Context Menu Styles */
.context-menu {
    position: fixed;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    z-index: 10010;
    min-width: 120px;
}

.context-item {
    padding: 4px 16px 4px 8px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    position: relative;
}

.context-item:hover {
    background-color: #000080;
    color: white;
}

.context-separator {
    height: 1px;
    background-color: #808080;
    margin: 2px 4px;
    border-bottom: 1px solid #f0f0f0;
}

.context-item .arrow {
    font-size: 8px;
}

/* Display Properties Dialog */
.properties-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10015;
}

.properties-window {
    width: 400px;
    height: 500px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
}

.properties-content {
    padding: 0;
    height: calc(100% - 24px);
    display: flex;
    flex-direction: column;
}

.properties-tabs {
    display: flex;
    background-color: #d4d4d4;
    border-bottom: 1px solid #808080;
}

.tab {
    padding: 6px 16px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
    margin-right: 2px;
}

.tab.active {
    background-color: #d4d4d4;
    border-bottom-color: #d4d4d4;
}

.tab-content {
    flex: 1;
    padding: 16px;
    background-color: #d4d4d4;
}

.background-preview {
    text-align: center;
    margin-bottom: 20px;
}

.preview-monitor {
    display: inline-block;
    width: 150px;
    height: 120px;
    background: linear-gradient(to bottom, #c0c0c0, #a0a0a0);
    border: 3px solid #808080;
    border-radius: 8px;
    padding: 8px;
    position: relative;
}

.preview-screen {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #006b6b 0%, #008080 50%, #009999 100%);
    border: 2px inset #808080;
}

.background-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.background-options label {
    font-size: 11px;
    font-weight: bold;
}

.background-options select {
    padding: 2px;
    font-size: 11px;
    background-color: white;
    border: 2px inset #d4d4d4;
}

.appearance-options {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.theme-preview {
    border: 2px inset #d4d4d4;
    padding: 16px;
    background-color: #f0f0f0;
}

.preview-window {
    width: 200px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
}

.preview-titlebar {
    background: linear-gradient(to right, #1a1a80, #2563eb);
    color: white;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: bold;
}

.preview-content {
    padding: 16px;
    font-size: 11px;
    background-color: white;
    border: 2px inset #c0c0c0;
    margin: 2px;
}

.properties-buttons {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding: 8px 16px;
    background-color: #c0c0c0;
    border-top: 1px solid #808080;
}

.properties-btn {
    padding: 4px 16px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
}

.properties-btn:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.properties-btn:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
}

/* Program-specific styles */

/* Notepad */
.notepad-menu {
    display: flex;
    gap: 16px;
    padding: 4px 8px;
    background-color: #f0f0f0;
    border-bottom: 1px solid #808080;
    font-size: 11px;
}

.notepad-menu span:hover {
    background-color: #e0e0e0;
    padding: 2px 4px;
}

.notepad-text {
    width: 100%;
    height: calc(100% - 25px);
    border: none;
    padding: 8px;
    font-family: 'Courier New', monospace;
    font-size: 12px;
    resize: none;
    background-color: white;
}

/* Calculator */
.calculator {
    padding: 8px;
    background-color: #c0c0c0;
}

.calc-display {
    width: 100%;
    height: 40px;
    background-color: black;
    color: lime;
    font-family: 'Courier New', monospace;
    font-size: 18px;
    text-align: right;
    padding: 8px;
    border: 2px inset #c0c0c0;
    margin-bottom: 8px;
}

.calc-buttons {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    margin-bottom: 8px;
}

.calc-buttons button {
    height: 32px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 12px;
}

.calc-buttons button:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.calc-buttons button:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
}

.calc-buttons .operator {
    background: linear-gradient(to bottom, #ffcc80, #ff9800);
    font-weight: bold;
}

.calc-presets {
    display: flex;
    gap: 4px;
    align-items: center;
}

.calc-presets button {
    padding: 2px 6px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 1px solid #808080;
    cursor: pointer;
}

/* Minesweeper */
.minesweeper {
    padding: 8px;
    background-color: #c0c0c0;
}

.mine-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 4px 8px;
    border: 2px inset #c0c0c0;
}

.mine-counter, .mine-timer {
    background-color: black;
    color: red;
    padding: 4px 8px;
    font-family: 'Courier New', monospace;
    font-weight: bold;
    border: 1px inset #808080;
}

.mine-face {
    font-size: 20px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    padding: 4px 8px;
}

.mine-field {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1px;
    background-color: #808080;
    border: 2px inset #c0c0c0;
    padding: 2px;
}

.mine-cell {
    width: 24px;
    height: 24px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 1px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.mine-cell:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.mine-info {
    margin-top: 8px;
    font-size: 10px;
    text-align: center;
    color: #404040;
}

/* Solitaire */
.solitaire {
    padding: 8px;
    background-color: #008000;
    height: 100%;
}

.solitaire-header {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.card-deck, .card-waste {
    width: 60px;
    height: 80px;
    background-color: #006400;
    border: 2px solid white;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 20px;
}

.card-foundations {
    display: flex;
    gap: 8px;
    margin-left: auto;
}

.foundation {
    width: 60px;
    height: 80px;
    background-color: #004000;
    border: 2px dashed #666;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 24px;
}

.solitaire-tableau {
    display: flex;
    gap: 8px;
}

.tableau-col {
    width: 60px;
    min-height: 80px;
    cursor: pointer;
    font-size: 16px;
    line-height: 20px;
}

.solitaire-info {
    margin-top: 16px;
    font-size: 10px;
    text-align: center;
    color: white;
}

/* Crypto App */
.crypto-app {
    padding: 8px;
    background-color: #f0f0f0;
}

.crypto-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #808080;
}

.crypto-tabs {
    display: flex;
    gap: 2px;
    margin-bottom: 8px;
}

.crypto-tabs button {
    padding: 4px 12px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
}

.crypto-tabs button.active {
    background: linear-gradient(to bottom, #ffffff, #f0f0f0);
    border-bottom-color: #f0f0f0;
}

.crypto-list {
    border: 2px inset #c0c0c0;
    background-color: white;
    max-height: 200px;
    overflow-y: auto;
}

.crypto-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-bottom: 1px solid #e0e0e0;
    cursor: pointer;
}

.crypto-item:hover {
    background-color: #e0e0e0;
}

.crypto-item button {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
}

.crypto-details {
    margin-top: 8px;
    padding: 8px;
    background-color: #ffffcc;
    border: 1px solid #cccc00;
    font-size: 10px;
}

/* Meme Generator */
.meme-app {
    padding: 8px;
    background-color: #f0f0f0;
}

.meme-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #808080;
}

.meme-canvas {
    display: flex;
    gap: 16px;
}

.meme-preview {
    width: 200px;
    height: 200px;
    position: relative;
    background-color: white;
    border: 2px solid #808080;
    display: flex;
    align-items: center;
    justify-content: center;
}

.meme-background {
    font-size: 60px;
    opacity: 0.7;
}

.meme-text {
    position: absolute;
    font-weight: bold;
    font-family: 'Impact', Arial, sans-serif;
    color: white;
    text-shadow: 2px 2px 0 black;
    font-size: 16px;
    text-align: center;
    width: 90%;
}

.meme-text.top {
    top: 10px;
}

.meme-text.bottom {
    bottom: 10px;
}

.meme-controls {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.meme-controls label {
    font-size: 11px;
    font-weight: bold;
}

.meme-controls input, .meme-controls select {
    padding: 4px;
    border: 2px inset #c0c0c0;
    font-size: 11px;
}

.meme-controls button {
    padding: 4px 8px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
}

.meme-gallery {
    margin-top: 8px;
    font-size: 10px;
    color: #606060;
}

/* Control Panel */
.control-panel {
    padding: 16px;
    background-color: #f0f0f0;
}

.control-header {
    margin-bottom: 16px;
    border-bottom: 1px solid #808080;
    padding-bottom: 8px;
}

.control-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.control-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px;
    border: 1px solid #808080;
    background-color: white;
    cursor: pointer;
    text-align: center;
}

.control-item:hover {
    background-color: #e0e0e0;
}

.control-icon {
    font-size: 32px;
}

/* System Information */
.system-info {
    padding: 16px;
    background-color: white;
    font-size: 11px;
}

.system-info h3 {
    margin-bottom: 16px;
    border-bottom: 1px solid #808080;
    padding-bottom: 4px;
}

.info-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info-section {
    border: 1px solid #c0c0c0;
    padding: 8px;
    background-color: #f8f8f8;
}

.info-section h4 {
    margin-bottom: 8px;
    color: #000080;
}

.info-section p {
    margin: 2px 0;
    padding-left: 16px;
}

/* Wallet Verification Dialog */
.wallet-verification {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}

.verification-window {
    width: 500px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.5);
}

.verification-content {
    padding: 16px;
    background-color: #f0f0f0;
}

.verification-header {
    text-align: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #c0c0c0;
}

.casino-logo {
    font-size: 48px;
    margin-bottom: 8px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.verification-header h3 {
    color: #1a1a80;
    margin: 8px 0;
    font-size: 16px;
}

.verification-header p {
    color: #606060;
    font-size: 11px;
    margin: 0;
}

.verification-requirements {
    background-color: #ffffcc;
    border: 1px solid #cccc00;
    padding: 12px;
    margin-bottom: 16px;
    border-radius: 2px;
}

.requirement-item {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0;
    font-size: 11px;
}

.requirement-icon {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.wallet-input-section {
    margin-bottom: 16px;
}

.wallet-input-section label {
    display: block;
    font-weight: bold;
    margin-bottom: 4px;
    font-size: 11px;
    color: #1a1a80;
}

.wallet-input-section input {
    width: 100%;
    padding: 6px;
    border: 2px inset #c0c0c0;
    font-family: 'Courier New', monospace;
    font-size: 10px;
    background-color: white;
    box-sizing: border-box;
}

.input-help {
    margin-top: 4px;
}

.input-help small {
    color: #606060;
    font-size: 9px;
}

.verification-status {
    background-color: white;
    border: 2px inset #c0c0c0;
    padding: 12px;
    margin-bottom: 16px;
    text-align: center;
}

.status-icon {
    font-size: 24px;
    margin-bottom: 8px;
}

.status-text {
    font-size: 11px;
    margin-bottom: 8px;
    color: #1a1a80;
}

.progress-bar {
    width: 100%;
    height: 20px;
    background-color: #c0c0c0;
    border: 1px inset #808080;
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    background: linear-gradient(to right, #0066cc, #4da6ff);
    width: 0%;
    transition: width 0.3s ease;
}

.verification-buttons {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-bottom: 12px;
}

.verify-btn {
    padding: 6px 12px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 11px;
    min-width: 80px;
}

.verify-btn:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.verify-btn:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
}

.verify-btn.primary {
    background: linear-gradient(to bottom, #90EE90, #70DD70);
    font-weight: bold;
}

.verify-btn.secondary {
    background: linear-gradient(to bottom, #ffcc80, #ff9800);
}

.verification-footer {
    text-align: center;
    padding-top: 8px;
    border-top: 1px solid #c0c0c0;
}

.verification-footer small {
    color: #606060;
    font-size: 9px;
}

/* System Tab Styles */
.system-options {
    padding: 16px;
}

.system-section {
    margin-bottom: 20px;
    border: 1px solid #c0c0c0;
    padding: 12px;
    background-color: #f8f8f8;
}

.system-section h4 {
    margin: 0 0 12px 0;
    color: #1a1a80;
    font-size: 12px;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 4px;
}

.checkbox-group {
    margin-bottom: 8px;
}

.checkbox-group label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    cursor: pointer;
}

.checkbox-group input[type="checkbox"] {
    width: 13px;
    height: 13px;
}

.option-description {
    margin: 4px 0 0 21px;
    font-size: 9px;
    color: #666;
    font-style: italic;
}

.info-display {
    font-size: 10px;
    line-height: 1.4;
}

.info-display p {
    margin: 2px 0;
}

.info-display strong {
    color: #1a1a80;
}

/* Casino Window Styles */
.casino-window {
    background-color: #1a1a1a !important;
}

.casino-header {
    background: linear-gradient(to right, #ff6b6b, #ffd93d, #6bcf7f) !important;
}

.casino-content {
    padding: 0;
    background: linear-gradient(to bottom, #2a2a2a, #1a1a1a);
    height: calc(100% - 24px);
    overflow: hidden;
}

.slots-machine {
    height: 100%;
    display: flex;
    flex-direction: column;
    color: white;
}

.slots-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px;
    background: linear-gradient(to bottom, #3a3a3a, #2a2a2a);
    border-bottom: 2px solid #000;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.casino-logo-small {
    font-size: 32px;
    filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.5));
}

.slots-header h2 {
    margin: 0;
    font-size: 24px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
    background: linear-gradient(45deg, #ffd700, #ffed4e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.mode-indicator {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.mode-indicator.demo {
    background: linear-gradient(45deg, #ff6b6b, #ee5a24);
    box-shadow: 0 0 10px rgba(255, 107, 107, 0.5);
}

.mode-indicator.vip {
    background: linear-gradient(45deg, #ffd700, #f0b90b);
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.7);
    color: #1a1a1a;
}

.slots-display {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.balance-display {
    background: linear-gradient(135deg, #1a1a1a, #2a2a2a);
    border: 2px solid #ffd700;
    border-radius: 8px;
    padding: 8px 16px;
    display: flex;
    gap: 8px;
    align-items: center;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(255, 215, 0, 0.3);
    margin-bottom: 20px;
}

.balance-label {
    color: #888;
    font-size: 11px;
}

.balance-amount {
    color: #ffd700;
    font-weight: bold;
    font-size: 16px;
    text-shadow: 0 0 4px rgba(255, 215, 0, 0.5);
}

.balance-currency {
    color: #ff9800;
    font-size: 12px;
}

.slots-frame {
    position: relative;
    background: linear-gradient(to bottom, #0a0a0a, #1a1a1a);
    border: 4px solid;
    border-color: #606060 #202020 #202020 #606060;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 
        inset 0 4px 8px rgba(0, 0, 0, 0.8),
        0 4px 16px rgba(0, 0, 0, 0.6);
}

.slots-reels {
    display: flex;
    gap: 10px;
    position: relative;
}

.reel {
    width: 100px;
    height: 150px;
    background: linear-gradient(to bottom, #000, #111);
    border: 3px solid;
    border-color: #202020 #606060 #606060 #202020;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    box-shadow: 
        inset 0 0 20px rgba(0, 0, 0, 0.8),
        0 0 10px rgba(0, 0, 0, 0.5);
}

.reel-strip {
    position: absolute;
    top: -50px;
    width: 100%;
    transition: transform 0.1s;
}

.slot-symbol {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), transparent);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.slots-shadow-top, .slots-shadow-bottom {
    position: absolute;
    left: 20px;
    right: 20px;
    height: 30px;
    pointer-events: none;
    z-index: 10;
}

.slots-shadow-top {
    top: 20px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.9), transparent);
}

.slots-shadow-bottom {
    bottom: 20px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
}

.win-line {
    position: absolute;
    top: 50%;
    left: 10px;
    right: 10px;
    height: 2px;
    background: linear-gradient(to right, transparent, #ffd700, transparent);
    transform: translateY(-50%);
    opacity: 0.5;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
}

.win-display {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    pointer-events: none;
    z-index: 20;
}

.win-amount {
    font-size: 48px;
    font-weight: bold;
    color: #ffd700;
    text-shadow: 
        0 0 20px rgba(255, 215, 0, 0.8),
        0 0 40px rgba(255, 215, 0, 0.6),
        2px 2px 4px rgba(0, 0, 0, 0.8);
    margin-bottom: 8px;
}

.win-text {
    font-size: 24px;
    font-weight: bold;
    text-transform: uppercase;
    background: linear-gradient(45deg, #ff6b6b, #ffd93d, #6bcf7f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
}

.win-animation {
    animation: winPulse 2s ease-out;
}

@keyframes winPulse {
    0% {
        transform: translate(-50%, -50%) scale(0.5);
        opacity: 0;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
}

.slots-controls {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 20px;
    padding: 20px;
    background: linear-gradient(to bottom, #2a2a2a, #1a1a1a);
    border-top: 2px solid #333;
    min-height: 80px;
}

.bet-section {
    justify-self: start;
    display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #1a1a1a, #2a2a2a);
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid #444;
}

.spin-button {
    justify-self: center;
}

.auto-section {
    justify-self: end;
}

.bet-section label {
    color: #888;
    font-size: 12px;
}

.bet-amount {
    color: #ffd700;
    font-weight: bold;
    font-size: 16px;
    min-width: 60px;
    text-align: center;
}

.bet-btn {
    width: 24px;
    height: 24px;
    background: linear-gradient(to bottom, #3a3a3a, #2a2a2a);
    border: 1px solid #555;
    color: white;
    cursor: pointer;
    border-radius: 4px;
    font-weight: bold;
}

.bet-btn:hover:not(:disabled) {
    background: linear-gradient(to bottom, #4a4a4a, #3a3a3a);
}

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

.spin-button {
    position: relative;
    width: 120px;
    height: 50px;
    background: none;
    border: none;
    cursor: pointer;
    transform-style: preserve-3d;
    transition: transform 0.1s;
    /* Manual offset - adjust these values to fine-tune positioning */
    margin-left: -10px;  /* Positive = move right, Negative = move left */
    margin-right: 0px;   /* Additional fine-tuning if needed */
    margin-top: -55px;
}

.spin-button:hover:not(:disabled) {
    transform: translateY(-2px);
}

.spin-button:active:not(:disabled) {
    transform: translateY(2px);
}

.spin-button-top {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #ff6b6b, #ee5a24);
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 20px;
    font-weight: bold;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    box-shadow: 
        inset 0 2px 8px rgba(255, 255, 255, 0.3),
        0 4px 8px rgba(0, 0, 0, 0.4);
    border: 2px solid;
    border-color: #ff8080 #cc4040 #cc4040 #ff8080;
    z-index: 2;
}

.spin-button-side {
    position: absolute;
    width: 100%;
    height: 10px;
    background: linear-gradient(to bottom, #cc4040, #aa3030);
    bottom: -5px;
    border-radius: 0 0 30px 30px;
    z-index: 1;
}

.spin-button:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.spin-button.spinning .spin-button-top {
    animation: spinButtonPulse 0.5s infinite;
}

@keyframes spinButtonPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(0.95); }
}

.auto-section {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #888;
    font-size: 12px;
}

.auto-section input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.auto-section input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.paytable {
    background: linear-gradient(135deg, #1a1a1a, #2a2a2a);
    border-top: 2px solid #333;
    padding: 12px;
}

.paytable-title {
    text-align: center;
    color: #ffd700;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.paytable-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.paytable-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid #333;
    border-radius: 4px;
    font-size: 10px;
}

.paytable-item span:first-child {
    color: #888;
}

.paytable-item span:last-child {
    color: #ffd700;
    font-weight: bold;
}

/* Theme Classes */
.theme-blue .window-header {
    background: linear-gradient(to right, #000080, #4169e1) !important;
}

.theme-blue .taskbar {
    background: linear-gradient(to bottom, #b6c5ff, #a0b0ff) !important;
}

.theme-green .window-header {
    background: linear-gradient(to right, #008000, #32cd32) !important;
}

/* Reduced animations for performance */
.reduced-animations * {
    animation-duration: 0.1s !important;
    transition-duration: 0.1s !important;
}

.reduced-animations .casino-glow,
.reduced-animations .win-animation,
.reduced-animations .spinButtonPulse {
    animation: none !important;
}

.theme-green .taskbar {
    background: linear-gradient(to bottom, #b6ffb6, #a0ffa0) !important;
}

.theme-dark .window-header {
    background: linear-gradient(to right, #404040, #606060) !important;
    color: #ffffff !important;
}

.theme-dark .taskbar {
    background: linear-gradient(to bottom, #505050, #404040) !important;
    color: #ffffff !important;
}

.theme-dark .window {
    background-color: #808080 !important;
}

.theme-dark .window-content {
    background-color: #606060 !important;
    color: #ffffff !important;
}

/* Widgets */
.widget {
    position: absolute;
    background: linear-gradient(to bottom, #e8e8e8, #d0d0d0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
    padding: 0;
    font-size: 11px;
}

.widget-header {
    background: linear-gradient(to right, #ff6b35, #f7931a);
    color: white;
    padding: 4px 6px;
    font-weight: bold;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: move;
}

.widget-close {
    width: 14px;
    height: 14px;
    background: rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.5);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    transition: background 0.2s;
}

.widget-close:hover {
    background: rgba(255, 255, 255, 0.5);
}

.widget-content {
    padding: 8px;
    background: #f5f5f5;
}

/* Solana Price Ticker Widget */
.price-ticker {
    width: 200px;
    right: 20px;
    top: 20px;
}

.ticker-item {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    border-bottom: 1px solid #e0e0e0;
}

.ticker-item:last-child {
    border-bottom: none;
}

.ticker-symbol {
    font-weight: bold;
    color: #333;
}

.ticker-price {
    color: #006600;
    font-family: monospace;
}

.ticker-change {
    font-size: 10px;
    padding: 1px 4px;
    border-radius: 2px;
}

.ticker-change.positive {
    color: #00aa00;
    background: #e6ffe6;
}

.ticker-change.negative {
    color: #cc0000;
    background: #ffe6e6;
}

/* Portfolio Widget */
.portfolio-widget {
    width: 250px;
    right: 20px;
    top: 200px;
}

.portfolio-summary {
    background: #ffffff;
    padding: 8px;
    margin-bottom: 8px;
    border: 1px inset #dfdfdf;
}

.portfolio-total {
    font-size: 16px;
    font-weight: bold;
    color: #006600;
    margin-bottom: 4px;
}

.portfolio-change {
    font-size: 12px;
}

.portfolio-items {
    max-height: 150px;
    overflow-y: auto;
}

.portfolio-item {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #e0e0e0;
}

/* Trending Widget */
.trending-widget {
    width: 220px;
    right: 290px;
    top: 20px;
}

.trending-list {
    counter-reset: trending;
}

.trending-item {
    display: flex;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid #e0e0e0;
    counter-increment: trending;
}

.trending-item::before {
    content: counter(trending) ".";
    margin-right: 8px;
    font-weight: bold;
    color: #666;
}

.trending-info {
    flex: 1;
}

.trending-name {
    font-weight: bold;
    display: block;
}

.trending-meta {
    font-size: 10px;
    color: #666;
}

/* Scrollbar styling */
.widget ::-webkit-scrollbar {
    width: 12px;
}

.widget ::-webkit-scrollbar-track {
    background: #e0e0e0;
    border: 1px inset #c0c0c0;
}

.widget ::-webkit-scrollbar-thumb {
    background: #c0c0c0;
    border: 1px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
}

/* Window content styles */
.toolbar {
    display: flex;
    gap: 2px;
    padding: 2px;
    background-color: #d4d4d4;
    border-bottom: 1px solid #808080;
}

.toolbar-btn {
    padding: 4px 8px;
    background-color: #c0c0c0;
    border: 1px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 11px;
    cursor: pointer;
}

.toolbar-btn:hover {
    background-color: #d4d4d4;
}

.toolbar-btn:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
}

.address-bar {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    background-color: #d4d4d4;
    border-bottom: 1px solid #808080;
}

.address-label {
    font-size: 11px;
    padding: 0 4px;
}

.address-input {
    flex: 1;
    background-color: white;
    border: 2px inset #dfdfdf;
    padding: 2px 4px;
    font-size: 11px;
}

.file-explorer {
    flex: 1;
    padding: 8px;
    overflow-y: auto;
    background-color: white;
}

.file-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    cursor: pointer;
    margin-bottom: 4px;
}

.file-item:hover {
    background-color: #e1e1ff;
}

.file-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.drive-icon {
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 12px;
    font-weight: bold;
}

.status-bar {
    display: flex;
    justify-content: space-between;
    padding: 2px 4px;
    background-color: #d4d4d4;
    border-top: 1px solid #f0f0f0;
    font-size: 11px;
}

.status-right {
    text-align: right;
}

/* Internet Explorer specific styles */
.ie-toolbar {
    display: flex;
    gap: 2px;
    padding: 4px;
    background-color: #d4d4d4;
    border-bottom: 1px solid #808080;
}

.ie-btn {
    padding: 4px 12px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 11px;
    cursor: pointer;
}

.ie-btn:hover {
    background-color: #d4d4d4;
}

.ie-btn:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
}

.ie-address {
    background-color: white;
}

.go-btn {
    padding: 2px 12px;
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    font-size: 11px;
    cursor: pointer;
}

.ie-content {
    flex: 1;
    overflow-y: auto;
    background-color: white;
}

.webpage {
    padding: 20px;
    font-family: "Times New Roman", serif;
    font-size: 14px;
}

.webpage h1 {
    color: #000080;
    font-size: 24px;
    margin-bottom: 10px;
}

.webpage h2 {
    color: #000080;
    font-size: 18px;
    margin: 15px 0 10px;
}

.webpage p {
    margin: 10px 0;
}

.webpage hr {
    border: none;
    border-top: 1px solid #808080;
    margin: 15px 0;
}

.webpage ul {
    margin-left: 20px;
}

.webpage a {
    color: #0000ff;
    text-decoration: underline;
    cursor: pointer;
}

.webpage a:hover {
    color: #ff0000;
}

/* Boot Screen Styles */
.boot-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.boot-container {
    text-align: center;
    color: white;
}

.boot-logo {
    margin-bottom: 60px;
}

.windows-logo-boot {
    display: inline-flex;
    flex-wrap: wrap;
    width: 120px;
    height: 120px;
    gap: 4px;
    margin-bottom: 30px;
}

.logo-square {
    width: 58px;
    height: 58px;
    animation: logoWave 2s ease-in-out infinite;
}

.logo-square.red {
    background-color: #ff0000;
    animation-delay: 0s;
}

.logo-square.green {
    background-color: #00ff00;
    animation-delay: 0.1s;
}

.logo-square.blue {
    background-color: #0000ff;
    animation-delay: 0.2s;
}

.logo-square.yellow {
    background-color: #ffff00;
    animation-delay: 0.3s;
}

@keyframes logoWave {
    0%, 100% {
        transform: scale(1);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.1);
        opacity: 1;
    }
}

.boot-text h1 {
    font-family: Arial, sans-serif;
    font-size: 36px;
    font-weight: normal;
    margin: 0;
    letter-spacing: 1px;
}

.boot-text sup {
    font-size: 16px;
}

.boot-subtitle {
    font-family: Arial, sans-serif;
    font-size: 18px;
    color: #ffff00;
    margin-top: 10px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.boot-progress-container {
    width: 400px;
    margin: 0 auto;
}

.boot-progress-bar {
    width: 100%;
    height: 20px;
    background-color: #404040;
    border: 2px solid #808080;
    position: relative;
    overflow: hidden;
}

.boot-progress-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(to right, #0080ff, #0040ff);
    transition: width 0.5s ease;
}

.boot-status {
    margin-top: 20px;
    font-size: 14px;
    font-family: "MS Sans Serif", Arial, sans-serif;
}

.boot-footer {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
}

.boot-footer p {
    font-size: 12px;
    color: #808080;
    font-family: "MS Sans Serif", Arial, sans-serif;
}

/* Fade out animation */
.boot-screen.fade-out {
    animation: fadeOut 1s forwards;
}

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

/* Virus Alert Styles */
.virus-alert {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    animation: virusAppear 0.5s ease-out;
}

@keyframes virusAppear {
    from {
        opacity: 0;
        transform: scale(0.3);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.virus-window {
    background-color: #c0c0c0;
    border: 4px solid;
    border-color: #ff0000 #800000 #800000 #ff0000;
    box-shadow: 4px 4px 12px rgba(255, 0, 0, 0.5);
    animation: virusShake 0.2s infinite;
}

@keyframes virusShake {
    0%, 100% { transform: translate(0); }
    25% { transform: translate(-2px, -2px); }
    50% { transform: translate(2px, -2px); }
    75% { transform: translate(-2px, 2px); }
}

.virus-header {
    background: linear-gradient(to right, #ff0000, #cc0000) !important;
    color: white;
    font-weight: bold;
    animation: headerBlink 0.5s infinite;
}

@keyframes headerBlink {
    0%, 50% { background: linear-gradient(to right, #ff0000, #cc0000); }
    51%, 100% { background: linear-gradient(to right, #ffff00, #ff8800); }
}

.virus-content {
    display: flex;
    padding: 20px;
    gap: 15px;
    align-items: flex-start;
}

.virus-icon {
    font-size: 48px;
    animation: iconPulse 1s infinite;
}

@keyframes iconPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

.virus-message h3 {
    color: #ff0000;
    font-size: 16px;
    margin-bottom: 10px;
    text-shadow: 2px 2px 0px #000000;
}

.virus-message p {
    font-size: 14px;
    margin-bottom: 8px;
}

.virus-buttons {
    display: flex;
    gap: 10px;
    margin-top: 15px;
}

.virus-btn {
    padding: 6px 16px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 12px;
    animation: btnFlicker 0.3s infinite;
}

@keyframes btnFlicker {
    0%, 70% { opacity: 1; }
    71%, 100% { opacity: 0.7; }
}

.virus-btn:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

/* Corruption Effects */
.corruption-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: 9998;
}

.glitch-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(255, 0, 255, 0.1) 2px,
        rgba(255, 0, 255, 0.1) 4px
    );
    animation: glitchMove 0.1s infinite linear;
}

@keyframes glitchMove {
    0% { transform: translateY(0); }
    100% { transform: translateY(4px); }
}

.corruption-active .desktop {
    animation: screenTear 0.2s infinite;
}

@keyframes screenTear {
    0% { transform: translateX(0); filter: hue-rotate(0deg); }
    25% { transform: translateX(-2px); filter: hue-rotate(90deg); }
    50% { transform: translateX(2px); filter: hue-rotate(180deg); }
    75% { transform: translateX(-1px); filter: hue-rotate(270deg); }
    100% { transform: translateX(0); filter: hue-rotate(360deg); }
}

.corruption-active .widget {
    animation: widgetCrazy 0.3s infinite;
}

@keyframes widgetCrazy {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(2deg) scale(1.05); }
    50% { transform: rotate(-2deg) scale(0.95); }
    75% { transform: rotate(1deg) scale(1.02); }
    100% { transform: rotate(0deg) scale(1); }
}

.corruption-active .desktop-icon {
    animation: iconSpin 1s infinite linear;
}

@keyframes iconSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.corruption-active .taskbar {
    animation: taskbarGlitch 0.5s infinite;
}

@keyframes taskbarGlitch {
    0%, 90% { transform: translateY(0); background: linear-gradient(to bottom, #d4d4d4, #c0c0c0); }
    91%, 95% { transform: translateY(-5px); background: linear-gradient(to bottom, #ff00ff, #00ffff); }
    96%, 100% { transform: translateY(0); background: linear-gradient(to bottom, #d4d4d4, #c0c0c0); }
}

.corrupt-window {
    animation: windowMadness 0.1s infinite !important;
    z-index: 9999 !important;
}

@keyframes windowMadness {
    0% { transform: rotate(0deg) translate(0, 0); }
    25% { transform: rotate(1deg) translate(5px, -5px); }
    50% { transform: rotate(-1deg) translate(-5px, 5px); }
    75% { transform: rotate(0.5deg) translate(3px, -3px); }
    100% { transform: rotate(0deg) translate(0, 0); }
}

/* Simple Gate Styles */
.simple-gate {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10005;
    animation: gateAppear 1s ease-out;
}

@keyframes gateAppear {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.8);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

.gate-box {
    width: 120px;
    height: 100px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.gate-box:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
    transform: translateY(-1px);
}

.gate-box:active {
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
    transform: translateY(0);
}

.gate-icon {
    font-size: 32px;
}

.gate-text {
    font-family: "MS Sans Serif", Arial, sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #000000;
    text-align: center;
}

/* Token Popup Styles */
.token-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10006;
    animation: tokenAppear 0.8s ease-out;
}

@keyframes tokenAppear {
    from {
        opacity: 0;
        transform: scale(0.3) rotate(-10deg);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
}

.token-window {
    background-color: #c8c8c8;
    border: 3px solid;
    border-color: #f0f0f0 #707070 #707070 #f0f0f0;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5);
    width: 500px;
    max-height: 600px;
}

.token-header {
    background: linear-gradient(to right, #FFD700, #FFA500, #FFD700) !important;
    color: #8B4513;
    font-weight: bold;
    animation: tokenHeaderShine 2s ease-in-out infinite;
}

@keyframes tokenHeaderShine {
    0%, 100% { background: linear-gradient(to right, #FFD700, #FFA500, #FFD700); }
    50% { background: linear-gradient(to right, #FFA500, #FFD700, #FFA500); }
}

.token-content {
    display: flex;
    padding: 20px;
    gap: 20px;
    align-items: flex-start;
}

.token-icon {
    font-size: 60px;
    animation: crownSpin 3s ease-in-out infinite;
}

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

.token-info {
    flex: 1;
}

.token-info h2 {
    font-size: 28px;
    color: #FFD700;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    margin: 0 0 10px 0;
}

.token-description {
    font-size: 14px;
    margin-bottom: 20px;
    font-style: italic;
}

.contract-section {
    margin-bottom: 20px;
}

.contract-section label {
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
}

.contract-address {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    border: 2px inset #dfdfdf;
    padding: 8px;
    font-family: monospace;
    font-size: 11px;
    word-break: break-all;
}

.copy-btn {
    padding: 4px 8px;
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 10px;
    white-space: nowrap;
}

.copy-btn:hover {
    background: linear-gradient(to bottom, #f0f0f0, #d0d0d0);
}

.token-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 20px;
}

.stat {
    display: flex;
    justify-content: space-between;
    padding: 5px;
    background: #f0f0f0;
    border: 1px inset #dfdfdf;
}

.stat-label {
    font-weight: bold;
}

.token-buttons {
    display: flex;
    gap: 10px;
}

.token-btn {
    flex: 1;
    padding: 8px 16px;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
}

.token-btn.primary {
    background: linear-gradient(to bottom, #FFD700, #FFA500);
    color: #8B4513;
}

.token-btn.secondary {
    background: linear-gradient(to bottom, #e0e0e0, #c0c0c0);
    color: #000000;
}

.token-btn:hover {
    transform: translateY(-1px);
}

/* Token Social Links */
.token-socials {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    gap: 15px;
}

.social-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: linear-gradient(to bottom, #f0f0f0, #e0e0e0);
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    text-decoration: none;
    color: #000000;
    font-size: 11px;
    cursor: pointer;
    transition: all 0.2s;
}

.social-link:hover {
    background: linear-gradient(to bottom, #e0e0e0, #d0d0d0);
    transform: translateY(-1px);
}

.social-link.twitter {
    background: linear-gradient(to bottom, #1DA1F2, #1a91da);
    color: white;
    border-color: #1a91da #0d5a8f #0d5a8f #1a91da;
}

.social-link.twitter:hover {
    background: linear-gradient(to bottom, #1a91da, #1881c2);
}

.social-icon {
    font-size: 16px;
    font-weight: bold;
}