html, body, .table, #hw-settings-panel, .hw-picker-body {
    scrollbar-width: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.table::-webkit-scrollbar,
#hw-settings-panel::-webkit-scrollbar,
.hw-picker-body::-webkit-scrollbar {
    display: none;
}

html.no-crt .glitches,
html.no-crt .grainy {
    display: none;
}

html.no-chars .sky {
    display: none;
}

.candywrapper {
    isolation: isolate;
}

.candywrapper > .sky {
    z-index: 0;
}

.candywrapper > :not(.sky) {
    position: relative;
    z-index: 1;
}

#hw-settings-panel,
#hw-download-picker {
    box-sizing: border-box;
    color: white;
    background: #3a1208;
    border: 2px solid #1a0806;
    font-family: 'MedievalSharp', cursive;
    z-index: 9998;
}

#hw-settings-panel {
    position: fixed;
    width: min(21rem, calc(100vw - 16px));
    max-height: calc(100vh - 16px);
    overflow: auto;
    padding: 1rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
    overscroll-behavior: contain;
}

#hw-settings-panel[hidden],
#hw-download-picker[hidden] {
    display: none;
}

#hw-settings-panel h2 {
    margin: 0 0 0.75rem;
    padding: 0;
    color: inherit;
    font-size: 1.35rem;
}

.hw-switch-list {
    display: grid;
    gap: 0.65rem;
}

.hw-switch-row {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.hw-switch-row input,
#hw-download-picker input {
    accent-color: #b3400f;
}

.hw-download-section {
    border-top: 2px solid currentColor;
    margin-top: 1rem;
    padding-top: 0.8rem;
}

.hw-credits-section {
    border-top: 2px solid currentColor;
    margin-top: 1rem;
    padding-top: 0.8rem;
}

.hw-credits-section a {
    display: inline-block;
    color: inherit;
    border: 2px solid currentColor;
    padding: 0.45rem 0.7rem;
    text-decoration: none;
}

.hw-download-section button,
#hw-download-picker button {
    font: inherit;
    color: inherit;
    background: transparent;
    border: 2px solid currentColor;
    padding: 0.45rem 0.7rem;
}

.hw-download-section button:disabled,
#hw-download-picker button:disabled {
    opacity: 0.55;
}

.hw-download-status {
    margin: 0.6rem 0 0;
}

#hw-download-picker {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(0, 0, 0, 0.6);
    border: 0;
    padding: 12px;
}

.hw-picker-dialog {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: min(54rem, 100%);
    max-height: 80vh;
    color: inherit;
    background: #3a1208;
    border: 2px solid #1a0806;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}

.hw-picker-header,
.hw-picker-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding: 0.8rem;
}

.hw-picker-header h2 {
    margin: 0;
    padding: 0;
    color: inherit;
}

.hw-picker-body {
    overflow: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    padding: 0 0.8rem;
}

.hw-picker-footer {
    border-top: 1px solid currentColor;
}

.hw-picker-group {
    border-top: 1px solid currentColor;
    padding: 0.45rem 0;
}

.hw-picker-group summary {
    cursor: pointer;
    font-weight: bold;
}

.hw-picker-group-label,
.hw-picker-page {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.3rem 0;
}

.hw-picker-nested {
    margin-left: 1.1rem;
}

.hw-picker-progress {
    min-height: 1.5em;
    margin: 0;
    padding: 0 0.8rem 0.5rem;
}

.hw-picker-error {
    color: #ffb59d;
    white-space: pre-wrap;
}

html.light body {
    background: radial-gradient(circle at 50% 40%, #fbf3e0 0%, #e8d6b0 100%);
    color: #3a1208;
}

html.light #stickystuck {
    background: #e3cfa4;
    border-bottom: 5px solid #b8975a;
}

html.light #stickystuck a {
    color: #3a1208;
}

html.light h1,
html.light h2,
html.light h3,
html.light h4,
html.light h5,
html.light h6 {
    color: #b3400f;
}

html.light #site-title {
    color: #4a1e0a !important;
}

html.light a {
    color: #a02a08;
}

html.light .candywrapper [style*="color: white" i],
html.light .candywrapper [style*="color:white" i] {
    color: #3a1208 !important;
}

html.light .candywrapper h1[style*="color: white" i],
html.light .candywrapper h2[style*="color: white" i],
html.light .candywrapper h3[style*="color: white" i],
html.light .candywrapper h4[style*="color: white" i],
html.light .candywrapper h5[style*="color: white" i],
html.light .candywrapper h6[style*="color: white" i],
html.light .candywrapper h1[style*="color:white" i],
html.light .candywrapper h2[style*="color:white" i],
html.light .candywrapper h3[style*="color:white" i],
html.light .candywrapper h4[style*="color:white" i],
html.light .candywrapper h5[style*="color:white" i],
html.light .candywrapper h6[style*="color:white" i] {
    color: #b3400f !important;
}

html.light [style*="color: orangered" i],
html.light [style*="color:orangered" i] {
    color: #b3400f !important;
}

html.light [style*="rgba(0, 0, 0, 0.3)"] {
    background-color: #fbf3e0 !important;
}

html.light .candywrapper h1[style*="color: white"],
html.light .candywrapper h2[style*="color: white"],
html.light .candywrapper h3[style*="color: white"],
html.light .candywrapper h4[style*="color: white"],
html.light .candywrapper h5[style*="color: white"],
html.light .candywrapper h6[style*="color: white"] {
    color: #b3400f !important;
}

html.light .candywrapper h1[style*="color: orangered"],
html.light .candywrapper h2[style*="color: orangered"],
html.light .candywrapper h3[style*="color: orangered"],
html.light .candywrapper h4[style*="color: orangered"],
html.light .candywrapper h5[style*="color: orangered"],
html.light .candywrapper h6[style*="color: orangered"] {
    color: #b3400f !important;
}

html.light .table {
    color: #3a1208;
    background: #fbf3e0;
    border-color: #5a2a14;
    text-shadow: none;
}

html.light .table a {
    color: #a02a08;
}

html.light .continentlink {
    fill: #a83a1c;
    stroke: #5a2a14;
    stroke-width: 1px;
}

html.light .continentlink:hover {
    fill: rgb(230, 111, 0);
    transform: scale(1.08);
    filter: drop-shadow(0 0 8px rgb(230, 111, 0)) drop-shadow(0 0 20px rgb(230, 111, 0));
}
html.light .maplist a {
    color: #a02a08;
}

html.light .grainy {
    opacity: 0.04;
}

html.light .glitches::before {
    animation-name: crt-scanline-flicker-light;
}

@keyframes crt-scanline-flicker-light {
    0%,
    100% {
        opacity: 0.04;
    }
    50% {
        opacity: 0.0368;
    }
}

html.light .wind {
    background-image: url(Characters-black.png);
}

html.light #hw-settings-panel {
    color: #3a1208;
    background: #e3cfa4;
    border-color: #b8975a;
}

html.light .hw-credits-section a {
    color: #a02a08;
}

html.light #hw-download-picker {
    color: #3a1208;
    background: rgba(58, 18, 8, 0.32);
}

html.light .hw-picker-dialog {
    color: #3a1208;
    background: #e3cfa4;
    border-color: #b8975a;
}

html.light .hw-picker-error {
    color: #8f2608;
}

html.light .holdonthere {
    color: #3a1208;
    background: radial-gradient(circle at 50% 40%, #fbf3e0 0%, #e8d6b0 100%);
}

html.light .holdonthere h1 {
    color: #3a1208 !important;
}

html.light #skiploading button {
    color: #3a1208;
    background: #e3cfa4;
    border: 2px solid #b8975a;
}

@media (max-width: 480px) {
    .hw-picker-dialog {
        max-height: 80vh;
    }

    .hw-picker-footer {
        justify-content: flex-start;
    }
}

/* Reading font + title color (settings panel) */
html.hw-custom-font .table p,
html.hw-custom-font .table li {
    font-family: var(--hw-reading-font) !important;
}
html.hw-custom-titlecolor h1,
html.hw-custom-titlecolor h2,
html.hw-custom-titlecolor #site-title {
    color: var(--hw-title-color) !important;
}
.hw-font-section, .hw-titlecolor-section { margin: 10px 0; }
.hw-font-label { display: block; color: #e8c890; font-size: 0.85em; margin-bottom: 4px; }
#hw-font-select { width: 100%; background: #24100a; color: white; border: 1px solid #6b3418; padding: 6px 8px; font-family: inherit; }
.hw-titlecolor-row { display: flex; gap: 6px; }
.hw-titlecolor { width: 24px; height: 24px; border: 2px solid #000; cursor: pointer; padding: 0; }
.hw-titlecolor-active { outline: 2px solid #e8c890; outline-offset: 1px; }
.hw-dev-section { margin-top: 10px; }

/* Contrast guard: panel labels legible on the light (cream) panel */
html.light .hw-font-label { color: #3a1208; }

/* Mobile footer: inline text-indent pushed the centered line off the right edge */
.pagefooter {
    text-indent: 0 !important;
    padding: 4px 8px 6px;
    box-sizing: border-box;
    overflow-wrap: break-word;
}

/* Site search box (local Pagefind index, no external service) */
#hw-search {
    position: relative;
    z-index: 2;
    width: min(40rem, calc(100% - 32px));
    margin: 1.6em auto 0.4em;
    font-family: 'MedievalSharp', cursive;
    text-align: center;
}
#hw-search-label {
    display: block;
    color: orangered;
    font-size: 1.5em;
    margin-bottom: 6px;
}
html.light #hw-search-label { color: #b3400f; }
#hw-search-hint { margin: 0 0 8px; color: #e8c890; font-size: 0.95rem; }
html.light #hw-search-hint { color: #5a2a14; }
#hw-search-input {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 14px;
    font: inherit;
    font-size: 1.15rem;
    color: white;
    background: #24100a;
    border: 2px solid #6b3418;
    border-radius: 0;
    outline: none;
}
#hw-search-input:focus { border-color: #e07020; box-shadow: 0 0 10px rgba(224, 112, 32, 0.45); }
#hw-search-input::placeholder { color: rgba(255, 255, 255, 0.45); }
html.light #hw-search-input { color: #3a1208; background: #fbf3e0; border-color: #b8975a; }
html.light #hw-search-input:focus { border-color: #b3400f; box-shadow: 0 0 10px rgba(179, 64, 15, 0.35); }
html.light #hw-search-input::placeholder { color: rgba(58, 18, 8, 0.45); }
/* Results sit in the page flow below the input, pushing content down rather than covering it */
#hw-search-results {
    margin-top: 8px;
    max-height: 60vh;
    overflow: auto;
    text-align: left;
    background: #3a1208;
    border: 2px solid #1a0806;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
    scrollbar-width: none;
}
#hw-search-results::-webkit-scrollbar { display: none; }
html.light #hw-search-results { background: #e3cfa4; border-color: #b8975a; }
.hw-search-note { padding: 8px 14px 0; font-size: 0.9em; opacity: 0.85; color: white; }
html.light .hw-search-note { color: #3a1208; }
.hw-result {
    display: block;
    padding: 10px 14px;
    text-decoration: none;
    color: white;
    border-top: 1px solid rgba(232, 200, 144, 0.25);
}
.hw-search-note + .hw-result { border-top: 1px solid rgba(232, 200, 144, 0.25); }
.hw-result:first-child { border-top: none; }
.hw-result:hover, .hw-result.hw-active { background: rgba(224, 112, 32, 0.18); }
html.light .hw-result { color: #3a1208; border-top-color: rgba(90, 42, 20, 0.3); }
html.light .hw-result:hover, html.light .hw-result.hw-active { background: rgba(179, 64, 15, 0.14); }
.hw-result-title { display: block; font-size: 1.15em; color: #ffa04a; }
html.light .hw-result-title { color: #a12702; }
.hw-result-where { display: block; font-size: 0.85em; opacity: 0.8; margin: 2px 0; }
.hw-result-excerpt { display: block; font-size: 0.95em; line-height: 1.35; }
.hw-result-excerpt mark { background: none; color: orangered; font-weight: bold; }
html.light .hw-result-excerpt mark { color: #b3400f; }
.hw-search-empty { padding: 10px 14px; opacity: 0.85; color: white; }
html.light .hw-search-empty { color: #3a1208; }
@media (max-width: 600px) {
    #hw-search-label { font-size: 1.25em; }
    #hw-search-results { max-height: 55vh; }
}