:root {
    --primary-color: #111;
    --secondary-color: #fafafa;
    --border-color: rgba(0, 0, 0, 0.1);
    --highlight-color: rgba(0, 0, 0, 0.05);
}

.dark {
    --primary-color: #fafafa;
    --secondary-color: #111;
    --border-color: rgba(255, 255, 255, 0.1);
    --highlight-color: rgba(255, 255, 255, 0.05);
}

.font-geist-mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* Icons */
[class^="icon-"], [class*=" icon-"] {
    width: 1.25em;
    height: 1.25em;
    stroke-width: 2;
    display: inline-block;
    vertical-align: middle;
}

.icon-sun {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='4'/><path d='M12 2v2'/><path d='M12 20v2'/><path d='m4.93 4.93 1.41 1.41'/><path d='m17.66 17.66 1.41 1.41'/><path d='M2 12h2'/><path d='M20 12h2'/><path d='m6.34 17.66-1.41 1.41'/><path d='m19.07 4.93-1.41 1.41'/></svg>");
    background-repeat: no-repeat;
}

.icon-moon {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z'/></svg>");
    background-repeat: no-repeat;
}

.icon-refresh-cw {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8'/><path d='M21 3v5h-5'/><path d='M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16'/><path d='M3 21v-5h5'/></svg>");
    background-repeat: no-repeat;
}

/* Gann Square */
.gann-container {
    max-height: 600px;
    overflow: auto;
}

.gann-cell {
    position: absolute;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    transition: all 0.2s ease;
    overflow: hidden;
    user-select: none;
}

.gann-cell:hover {
    background-color: var(--highlight-color);
    z-index: 10;
}

.gann-cell-center {
    background-color: rgba(59, 130, 246, 0.1);
    font-weight: bold;
    z-index: 5;
}

.gann-cell-current {
    background-color: rgba(16, 185, 129, 0.1);
    font-weight: bold;
    z-index: 5;
}

.gann-cell-horizontal {
    background-color: rgba(59, 130, 246, 0.05);
}

.gann-cell-vertical {
    background-color: rgba(59, 130, 246, 0.05);
}

.gann-cell-diagonal-1 {
    background-color: rgba(249, 115, 22, 0.05);
}

.gann-cell-diagonal-2 {
    background-color: rgba(249, 115, 22, 0.05);
}

/* Loading animation */
.loading {
    display: inline-block;
    width: 1em;
    height: 1em;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border-top-color: currentColor;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}