:root,
html[data-theme="snow"] {
    --t-bg: #15426b;
    --t-bg-image: linear-gradient(180deg, #0b2742 0%, #174a75 55%, #2b6c9c 100%);
    --t-panel-rgb: 9, 34, 64;
    --t-accent: #9fd3ff;
    --t-accent-rgb: 159, 211, 255;
    --t-text: #e6f4ff;
    --t-glow-rgb: 200, 235, 255;
    --t-scroll: #4a86b5;
    --t-btn: #2f6f9f;
    --t-gate: #2a6496;
    --t-gate-dark: #1b4a73;
    --t-gate-soft: #e6f2fb;
    --t-gate-hover: #f2f8fd;
}

html[data-theme="rain"] {
    --t-bg: #1d2a38;
    --t-bg-image: linear-gradient(180deg, #121b26 0%, #22344a 55%, #2f4860 100%);
    --t-panel-rgb: 16, 27, 40;
    --t-accent: #6fb3dc;
    --t-accent-rgb: 111, 179, 220;
    --t-text: #a8d8f5;
    --t-glow-rgb: 150, 210, 250;
    --t-scroll: #3d6e8f;
    --t-btn: #2d6a92;
    --t-gate: #1f5f8b;
    --t-gate-dark: #154766;
    --t-gate-soft: #e3f0f8;
    --t-gate-hover: #f0f6fb;
}

html[data-theme="sakura"] {
    --t-bg: #4a2440;
    --t-bg-image: linear-gradient(180deg, #2b1430 0%, #5a2a4c 55%, #8a4466 100%);
    --t-panel-rgb: 52, 18, 44;
    --t-accent: #f4a6bf;
    --t-accent-rgb: 244, 166, 191;
    --t-text: #ffc9d8;
    --t-glow-rgb: 255, 190, 210;
    --t-scroll: #a8507a;
    --t-btn: #a8436f;
    --t-gate: #b03a6c;
    --t-gate-dark: #84264f;
    --t-gate-soft: #fbe7ef;
    --t-gate-hover: #fdf2f6;
}

html[data-theme="stars"] {
    --t-bg: #120a2a;
    --t-bg-image: radial-gradient(ellipse at 50% 120%, #3b1a6b 0%, #1e0f45 45%, #0a0620 100%);
    --t-panel-rgb: 26, 13, 58;
    --t-accent: #b892ff;
    --t-accent-rgb: 184, 146, 255;
    --t-text: #dcc6ff;
    --t-glow-rgb: 200, 170, 255;
    --t-scroll: #6a45b0;
    --t-btn: #5b37a6;
    --t-gate: #6a35b8;
    --t-gate-dark: #4c2289;
    --t-gate-soft: #efe7fc;
    --t-gate-hover: #f6f1fd;
}

body {
    background-image: var(--t-bg-image);
}

.header-box a {
    color: var(--t-accent);
}

#weather-canvas {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: -1;
}

#weather-fx {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: 40;
}

.read-cay {
    display: block;
    margin: -6px 0 10px;
    font-family: 'Courier New', monospace;
    font-size: 15px;
    color: var(--t-accent);
    opacity: 0.85;
    letter-spacing: 0.02em;
}

.card-div,
.daily-textbox,
.daily-textbox-project,
.daily-textbox-makale {
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

    .card-div:hover,
    .daily-textbox:hover,
    .daily-textbox-project:hover,
    .daily-textbox-makale:hover {
        box-shadow: 0 0 18px rgba(var(--t-glow-rgb), 0.18);
    }

html[data-theme="rain"] .card-div,
html[data-theme="rain"] .daily-textbox {
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

html[data-theme="sakura"] .card-div,
html[data-theme="sakura"] .daily-textbox {
    border-radius: 26px 12px 26px 12px;
}

html[data-theme="stars"] .card-div,
html[data-theme="stars"] .daily-textbox {
    box-shadow: 0 0 12px rgba(var(--t-glow-rgb), 0.08);
}

.theme-toggle {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 50;
    width: 46px;
    height: 46px;
    padding: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid var(--t-accent);
    background-color: rgba(var(--t-panel-rgb), 0.85);
    color: var(--t-accent);
    cursor: pointer;
    box-shadow: 0 0 0 rgba(var(--t-glow-rgb), 0);
    transition: box-shadow 0.3s ease, transform 0.4s ease, background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

    .theme-toggle:hover {
        box-shadow: 0 0 16px rgba(var(--t-glow-rgb), 0.45);
        transform: rotate(18deg);
    }

    .theme-toggle:focus-visible {
        outline: 2px solid var(--t-accent);
        outline-offset: 3px;
    }

    .theme-toggle svg {
        display: none;
        width: 22px;
        height: 22px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.7;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

html[data-theme="snow"] .theme-toggle .ti-snow,
html[data-theme="rain"] .theme-toggle .ti-rain,
html[data-theme="sakura"] .theme-toggle .ti-sakura,
html[data-theme="stars"] .theme-toggle .ti-stars {
    display: block;
}

@media (max-width: 500px) {
    .theme-toggle {
        right: 12px;
        bottom: 12px;
        width: 40px;
        height: 40px;
    }
}

#kurabiye-pencere {
    background: rgba(var(--t-panel-rgb), 0.97) !important;
    border-color: rgba(var(--t-accent-rgb), 0.35) !important;
}

html[data-theme="snow"] #anaekran {
    cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cpath d=%22M3 2 L3 19.5 L7.6 15.2 L10.9 22.4 L13.6 21.2 L10.4 14.2 L16.6 14.2 Z%22 fill=%22%23e6f4ff%22 stroke=%22%230b2742%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%239fd3ff%22 stroke-width=%221.5%22 stroke-linecap=%22round%22%3E%3Cpath d=%22M24 19v10M19.7 21.5l8.6 5M19.7 26.5l8.6-5%22/%3E%3C/g%3E%3C/svg%3E") 3 2, auto;
}

html[data-theme="rain"] #anaekran {
    cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cpath d=%22M3 2 L3 19.5 L7.6 15.2 L10.9 22.4 L13.6 21.2 L10.4 14.2 L16.6 14.2 Z%22 fill=%22%23d6ecfa%22 stroke=%22%23121b26%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M24 18.5c-2.4 3.4-3.6 5.3-3.6 6.9a3.6 3.6 0 0 0 7.2 0c0-1.6-1.2-3.5-3.6-6.9z%22 fill=%22%236fb3dc%22 stroke=%22%23121b26%22 stroke-width=%221%22/%3E%3C/svg%3E") 3 2, auto;
}

html[data-theme="sakura"] #anaekran {
    cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cpath d=%22M3 2 L3 19.5 L7.6 15.2 L10.9 22.4 L13.6 21.2 L10.4 14.2 L16.6 14.2 Z%22 fill=%22%23ffe3ec%22 stroke=%22%232b1430%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3Cg fill=%22%23f4a6bf%22 stroke=%22%232b1430%22 stroke-width=%22.8%22%3E%3Cellipse cx=%2224%22 cy=%2220.6%22 rx=%221.9%22 ry=%222.9%22 transform=%22rotate%280 24 24%29%22/%3E%3Cellipse cx=%2224%22 cy=%2220.6%22 rx=%221.9%22 ry=%222.9%22 transform=%22rotate%2872 24 24%29%22/%3E%3Cellipse cx=%2224%22 cy=%2220.6%22 rx=%221.9%22 ry=%222.9%22 transform=%22rotate%28144 24 24%29%22/%3E%3Cellipse cx=%2224%22 cy=%2220.6%22 rx=%221.9%22 ry=%222.9%22 transform=%22rotate%28216 24 24%29%22/%3E%3Cellipse cx=%2224%22 cy=%2220.6%22 rx=%221.9%22 ry=%222.9%22 transform=%22rotate%28288 24 24%29%22/%3E%3C/g%3E%3Ccircle cx=%2224%22 cy=%2224%22 r=%221.1%22 fill=%22%23ffe08a%22/%3E%3C/svg%3E") 3 2, auto;
}

html[data-theme="stars"] #anaekran {
    cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cpath d=%22M3 2 L3 19.5 L7.6 15.2 L10.9 22.4 L13.6 21.2 L10.4 14.2 L16.6 14.2 Z%22 fill=%22%23efe5ff%22 stroke=%22%230a0620%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M24 17.5l1.6 4.9 4.9 1.6-4.9 1.6-1.6 4.9-1.6-4.9-4.9-1.6 4.9-1.6z%22 fill=%22%23e0c3ff%22 stroke=%22%230a0620%22 stroke-width=%22.8%22/%3E%3C/svg%3E") 3 2, auto;
}

#anaekran :is(a, button, summary, label[for], [onclick], .card-div, .theme-toggle) {
    cursor: pointer;
}

#anaekran :is(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]), textarea, [contenteditable="true"]) {
    cursor: text;
}