/*
 * NIGHT TRAIN — HOLOGRAPHX HARDWARE skin (v1)
 * Keeps NIGHT TRAIN's warm champagne identity; knobs, wheels and their
 * rings are already hardware-grade and stay untouched. Visual only.
 * Remove the <link> and body class "hx-hw" to undo.
 */

body.hx-hw {
    --hx-acc: #f2c078;
    --hx-acc-rgb: 242, 192, 120;
    --hx-chassis:
        radial-gradient(120% 60% at 50% -10%, rgba(255,232,196,.08), transparent 60%),
        linear-gradient(180deg, #1a1714, #0d0c0b 40%, #080707);
}
body.hx-hw.hx-hw.night-train-2d { background: var(--hx-chassis) !important; }

body.hx-hw.hx-hw .nt-header {
    background: var(--hx-bar-bg) !important;
    border: 0 !important;
    box-shadow: var(--hx-bar-shadow) !important;
}
body.hx-hw.hx-hw .nt-title {
    font-style: normal !important;
    letter-spacing: .28em !important;
    color: #f4efe6 !important;
    text-shadow: 0 1px 0 #000, 0 0 16px rgba(242,192,120,.18) !important;
}

/* Sections: recessed wells with an amber status LED */
body.hx-hw.hx-hw :is(.nt-deck-section, .nt-note-card, .nt-sequencer, .nt-control-strip) {
    background: var(--hx-well-bg) !important;
    border: 0 !important;
    box-shadow: var(--hx-well-shadow) !important;
}
body.hx-hw.hx-hw .nt-deck-section__title {
    font-family: var(--hx-font) !important;
    letter-spacing: .22em !important;
    color: #e9e2d6 !important;
}
body.hx-hw.hx-hw .nt-deck-section__led {
    background: var(--hx-acc) !important;
    box-shadow: 0 0 8px var(--hx-acc) !important;
}

/* Note readouts: warm LCD */
body.hx-hw.hx-hw :is(.nt-note-value, .nt-wheel__value) {
    font-family: var(--hx-font) !important;
    color: var(--hx-acc) !important;
    text-shadow: 0 0 10px var(--hx-acc-glow) !important;
    background: var(--hx-lcd-lines), var(--hx-lcd-bg) !important;
    border-radius: 6px;
    box-shadow: var(--hx-lcd-shadow) !important;
}

/* Keys */
body.hx-hw.hx-hw :is(.nt-note-stepper, .nt-sequencer__rate, .nt-sequencer__pattern-btn, .nt-action-btn, .nt-toggle-btn, .nt-mini-btn, .nt-sequencer-step__mode) {
    font-family: var(--hx-font) !important;
    color: #e3ddd2 !important;
    background: var(--hx-key-bg) !important;
    border: 0 !important;
    box-shadow: var(--hx-key-shadow) !important;
    text-shadow: none !important;
}
body.hx-hw.hx-hw :is(.nt-sequencer__rate, .nt-sequencer__pattern-btn, .nt-action-btn, .nt-toggle-btn, .nt-mini-btn):is(.is-active, [aria-pressed="true"]) {
    color: #1a1206 !important;
    background: var(--hx-key-on-bg) !important;
    box-shadow: var(--hx-key-on-shadow) !important;
}
body.hx-hw.hx-hw .nt-select {
    font-family: var(--hx-font) !important;
    color: var(--hx-ink) !important;
    background-color: #0d0c0b !important;
    border: 0 !important;
    box-shadow: inset 0 2px 5px #000, inset 0 0 0 1px #24211d !important;
}

/* Sequencer steps: LED keys */
body.hx-hw.hx-hw .nt-sequencer-step {
    border: 0 !important;
    background: linear-gradient(180deg, #232120, #151413) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 0 1px #070707, 0 2px 0 #000 !important;
}
body.hx-hw.hx-hw .nt-sequencer-step[data-active="true"] {
    background: linear-gradient(180deg, #3a2e1c, #1f1a12) !important;
    box-shadow: inset 0 0 0 1px rgba(242,192,120,.55), 0 0 16px rgba(242,192,120,.28), 0 2px 0 #000 !important;
}

/* Keyboard: ivory and ebony */
body.hx-hw.hx-hw .nt-key--white {
    background: linear-gradient(180deg, #d9d4ca 0, #fbf8f1 10%, #f2eee5 86%, #d4cfc4 100%) !important;
    box-shadow: inset 0 -7px 0 #c9c3b7, inset -1px 0 0 #bdb7aa, 0 3px 4px rgba(0,0,0,.6) !important;
    border: 0 !important;
}
body.hx-hw.hx-hw .nt-key--black {
    background: linear-gradient(180deg, #000 0, #2a2826 70%, #141312 100%) !important;
    box-shadow: inset 0 -6px 0 #050505, inset 1px 0 0 #3a3835, 0 3px 6px rgba(0,0,0,.75) !important;
    border: 0 !important;
}
body.hx-hw.hx-hw .nt-key.is-active.nt-key--white {
    background: linear-gradient(180deg, #e8d3ad, #f6e7c8) !important;
    box-shadow: inset 0 0 0 2px var(--hx-acc), 0 0 18px var(--hx-acc-glow) !important;
}
body.hx-hw.hx-hw .nt-key.is-active.nt-key--black {
    box-shadow: inset 0 0 0 2px var(--hx-acc), 0 0 16px var(--hx-acc-glow) !important;
}