:root {
    --buncho-bg: #f7efe4;
    --buncho-bg-2: #efe4d4;
    --buncho-surface: rgba(255, 250, 242, 0.9);
    --buncho-surface-strong: #fffaf0;
    --buncho-ink: #15212b;
    --buncho-muted: #6c6a66;
    --buncho-border: #cfbba7;
    --buncho-primary: #0f2a3d;
    --buncho-primary-soft: #24506f;
    --buncho-accent: #c25b2b;
    --buncho-accent-soft: #f08c4a;
    --buncho-shadow: 0 24px 70px rgba(15, 42, 61, 0.12);
}

body.buncho-theme {
    background:
        radial-gradient(circle at top left, rgba(194, 91, 43, 0.12), transparent 32%),
        radial-gradient(circle at 90% 10%, rgba(15, 42, 61, 0.12), transparent 24%),
        linear-gradient(180deg, var(--buncho-bg) 0%, var(--buncho-bg-2) 100%);
    color: var(--buncho-ink);
}

body.buncho-theme header,
body.buncho-theme nav,
body.buncho-theme footer {
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

body.buncho-theme .shadow-soft,
body.buncho-theme .shadow-2xl {
    box-shadow: var(--buncho-shadow) !important;
}

body.buncho-theme .material-symbols-outlined {
    vertical-align: middle;
}

body.buncho-theme button,
body.buncho-theme input,
body.buncho-theme select,
body.buncho-theme textarea {
    font: inherit;
}

body.buncho-resedit #app-header,
body.buncho-queue header,
body.buncho-pict header,
body.buncho-bin header,
body.buncho-dsk header {
    border-bottom: 1px solid rgba(207, 187, 167, 0.75);
    background: rgba(255, 250, 242, 0.82);
}

body.buncho-resedit #app-main,
body.buncho-queue main,
body.buncho-pict main,
body.buncho-bin main,
body.buncho-dsk main {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

body.buncho-resedit #landing-view section,
body.buncho-resedit #resources-view aside,
body.buncho-resedit #resource-list-pane,
body.buncho-resedit #resource-detail-pane,
body.buncho-resedit #resource-modal > div,
body.buncho-queue main > div > section,
body.buncho-pict main > section > div,
body.buncho-bin main > div > section,
body.buncho-dsk main > div > section {
    border: 1px solid rgba(207, 187, 167, 0.82) !important;
    background: rgba(255, 250, 242, 0.9) !important;
    border-radius: 28px !important;
    box-shadow: var(--buncho-shadow) !important;
}

body.buncho-resedit #resource-modal {
    background: rgba(15, 42, 61, 0.62);
}

body.buncho-resedit #mobile-nav {
    background: rgba(255, 250, 242, 0.9);
    border-top: 1px solid rgba(207, 187, 167, 0.7);
}

body.buncho-queue #drop-zone,
body.buncho-pict #drop-zone,
body.buncho-bin #dropzone,
body.buncho-dsk #dropzone {
    border-color: rgba(207, 187, 167, 0.88) !important;
    background: rgba(255, 250, 242, 0.92) !important;
}

body.buncho-bin button.bg-primary,
body.buncho-dsk button.bg-primary,
body.buncho-queue button.bg-primary,
body.buncho-pict button.bg-primary,
body.buncho-resedit button.bg-primary {
    background: var(--buncho-primary) !important;
    color: #fff !important;
}

body.buncho-bin button.bg-accent,
body.buncho-dsk button.bg-accent,
body.buncho-queue button.bg-accent,
body.buncho-pict button.bg-accent {
    background: var(--buncho-accent) !important;
    color: #fff !important;
}

body.buncho-theme .mono,
body.buncho-theme .font-mono {
    font-variant-ligatures: none;
}

@media (max-width: 768px) {
    body.buncho-theme header,
    body.buncho-theme nav {
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }
}