/* Shaco Life Extended — base (owner: fe-core) */

*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    height: 100%;
}

body {
    margin: 0;
    min-height: 100%;
    font-family: var(--font);
    font-size: var(--fs-md);
    line-height: var(--lh);
    color: var(--text);
    background: var(--bg);
    font-feature-settings: 'ss01' on, 'cv11' on;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow: hidden;
    overscroll-behavior: none;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    line-height: 1.25;
    color: var(--text);
}
h1 { font-size: var(--fs-2xl); letter-spacing: var(--tracking-tighter); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
a.link, .prose a { color: var(--accent); text-underline-offset: 3px; }
a.link:hover, .prose a:hover { text-decoration: underline; }
b, strong { font-weight: 600; color: var(--text); }
small { font-size: var(--fs-xs); }
hr { border: 0; height: 1px; background: var(--border); margin: var(--s-4) 0; }
code, kbd, pre, samp { font-family: var(--font-mono); font-size: .92em; }

button, input, select, textarea {
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
}
button {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}
button:disabled { cursor: not-allowed; }
input, textarea { -webkit-user-select: text; user-select: text; }
[hidden] { display: none !important; }

::selection { background: var(--accent-soft-2); color: var(--text); }

/* Focus */
:focus { outline: none; }
:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
    border-radius: var(--r-xs);
}

/* Scrollbars */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: var(--border-strong);
    border-radius: 999px;
    border: 3px solid transparent;
    background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--text-4); }
::-webkit-scrollbar-corner { background: transparent; }

/* Icons */
.i {
    display: inline-block;
    flex-shrink: 0;
    vertical-align: middle;
    stroke-width: 1.75;
}
.i-fill { fill: currentColor; stroke: none; }

/* Wallpaper layer */
.wallpaper {
    position: fixed;
    inset: 0;
    z-index: var(--z-wall);
    background-color: var(--bg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    pointer-events: none;
    transition: opacity 600ms var(--ease);
}
.wallpaper::after {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--wall-overlay);
}
.wallpaper.is-loading { opacity: 0; }

/* Utilities */
.sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.mono { font-family: var(--font-mono); }
.tnum { font-variant-numeric: tabular-nums; }
.muted, .text-2 { color: var(--text-2); }
.text-3 { color: var(--text-3); }
.text-accent { color: var(--accent); }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }
.text-sm { font-size: var(--fs-sm); }
.text-xs { font-size: var(--fs-xs); }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.flex { display: flex; }
.flex-col { display: flex; flex-direction: column; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.grow { flex: 1 1 auto; min-width: 0; }
.gap-1 { gap: var(--s-1); }
.gap-2 { gap: var(--s-2); }
.gap-3 { gap: var(--s-3); }
.gap-4 { gap: var(--s-4); }
.stack > * + * { margin-top: var(--s-3); }
.stack-lg > * + * { margin-top: var(--s-6); }

/* Reduced motion */
:root[data-motion="reduce"] *,
:root[data-motion="reduce"] *::before,
:root[data-motion="reduce"] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes rise-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes shimmer { from { background-position: 150% 0; } to { background-position: -50% 0; } }
@keyframes pulse-soft { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

.dot-sep { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: var(--text-3); opacity: .6; flex-shrink: 0; }