@import url('https://rsms.me/inter/inter.css');
:root {
    --tblr-font-sans-serif: 'Inter Var', -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif;
    /*font-size: 15px;*/
}
body {
    font-feature-settings: "cv03", "cv04", "cv11";
    background: rgba(255, 168, 69, 0.02);

}

[data-theme="dark"] .sun-and-moon>.sun-beams {
    opacity: 0
}

[data-theme="dark"] .sun-and-moon>.moon>circle {
    transform: translate(-7px)
}

[data-theme="dark"] .laptop {
    opacity: 0;
    display: none;
}
[data-theme="light"] .laptop {
    opacity: 0;
    display: none;
}
[data-theme="system"] .laptop {
    opacity: 1
}

[data-theme="system"] .sun-and-moon {
    opacity: 0;
    display: none;
}
.theme-toggle {
    background: none;
    border: none;
    padding: 0;
    border-radius: 50%;
    outline-offset: 5px
}

[data-theme="dark"] .theme-toggle {
    --icon-fill: hsl(210 10% 70%);
    --icon-fill-hover: hsl(210 15% 90%)
}

html {
    block-size: 100%;
    color-scheme: light
}

html[data-theme="dark"] {
    color-scheme: dark
}
@media (prefers-color-scheme:dark) {
    html[data-theme="system"]  {
        color-scheme: dark;
    }
    .theme-toggle[data-theme="system"]  {
        color: hsl(210 10% 70%);
    }
}