diff --git a/assets/dice/alien/alien-dice-r1.png b/assets/dice/alien/alien-dice-r1.png new file mode 100644 index 0000000..b43e4bb Binary files /dev/null and b/assets/dice/alien/alien-dice-r1.png differ diff --git a/slazero2.mjs b/slazero2.mjs index 3dd6740..bb9be73 100644 --- a/slazero2.mjs +++ b/slazero2.mjs @@ -91,7 +91,7 @@ class YZEDiceDialog extends Dialog {
-
+
${baseDice}d6
@@ -4352,58 +4352,61 @@ Hooks.once("diceSoNiceReady", (dice3d) => { // ── Colorsets ─────────────────────────────────────────────────────────────── dice3d.addColorset({ name: "ze-normal", - description: "ZE Normal Dice — Yellow (Alien)", + description: "SLA Zero Two — Operative Dice (hazard yellow)", category: "SLA Zero Two", foreground: ["#e3e300"], background: ["#e3e300"], outline: "#000000", + edge: "#8a8a00", texture: "none", - material: "plastic", + material: "metal", + font: "SLA Borg UI", visibility: "visible" }); dice3d.addColorset({ name: "ze-stress", - description: "ZE Stress Dice — Black (Alien)", + description: "SLA Zero Two — Stress Dice (black chrome)", category: "SLA Zero Two", foreground: ["#ffffff"], background: ["#111111"], - outline: "#333333", + outline: "#cc1111", + edge: "#330000", texture: "none", - material: "plastic", + material: "metal", + font: "SLA Borg UI", visibility: "visible" }); // ── Two systems — one per die type so presets don't overwrite each other ──── - dice3d.addSystem({ id: "slazero2", name: "SLA Zero Two — Normal Dice" }, "preferred"); + dice3d.addSystem({ id: "slazero2", name: "SLA Zero Two — Operative Dice" }, "preferred"); dice3d.addSystem({ id: "ze-stress-dice", name: "SLA Zero Two — Stress Dice" }); - // ── Normal d6: Alien yellow dice (system: slazero2) ────────────────────── - // Face 1 = skull (bane), 2-5 = blank, 6 = alien success symbol + // ── Operative d6 (hazard yellow): numbered 1–5, hazard diamond on the 6 ──── + // Face 1 keeps the facehugger mark — on a push, 1s are what you pick up again. dice3d.addDicePreset({ type: "d6", labels: [ "systems/slazero2/assets/dice/alien/alien-dice-y1.png", - "systems/slazero2/assets/dice/alien/alien-dice-y0.png", - "systems/slazero2/assets/dice/alien/alien-dice-y0.png", - "systems/slazero2/assets/dice/alien/alien-dice-y0.png", - "systems/slazero2/assets/dice/alien/alien-dice-y0.png", + "systems/slazero2/assets/dice/alien/y2.png", + "systems/slazero2/assets/dice/alien/y3.png", + "systems/slazero2/assets/dice/alien/y4.png", + "systems/slazero2/assets/dice/alien/y5.png", "systems/slazero2/assets/dice/alien/alien-dice-y6.png", ], colorset: "ze-normal", system: "slazero2", }); - // ── Stress d6: Alien black dice (system: ze-stress-dice) ──────────────────── - // Face 1-5 = blank, 6 = success symbol + // ── Stress d6 (black chrome): BLOOD-RED BANE on the 1, numbered 2–5, success 6 ─ dice3d.addDicePreset({ type: "d6", labels: [ - "systems/slazero2/assets/dice/alien/alien-dice-b0.png", - "systems/slazero2/assets/dice/alien/alien-dice-b0.png", - "systems/slazero2/assets/dice/alien/alien-dice-b0.png", - "systems/slazero2/assets/dice/alien/alien-dice-b0.png", - "systems/slazero2/assets/dice/alien/alien-dice-b0.png", + "systems/slazero2/assets/dice/alien/alien-dice-r1.png", + "systems/slazero2/assets/dice/alien/b2.png", + "systems/slazero2/assets/dice/alien/b3.png", + "systems/slazero2/assets/dice/alien/b4.png", + "systems/slazero2/assets/dice/alien/b5.png", "systems/slazero2/assets/dice/alien/alien-dice-b6.png", ], colorset: "ze-stress", @@ -8954,8 +8957,8 @@ Hooks.on('renderActorDirectory', (app, html) => { // ── SLA GM Tool buttons ───────────────────────────────────────────────── const gmToolDefs = [ - { cls: 'sla-dir-status-btn', icon: 'fas fa-clipboard-list', label: 'PC Status', color: '#00d4ff', fn: () => SLAGMStatusWindow.open() }, - { cls: 'sla-dir-credit-btn', icon: 'fas fa-credit-card', label: 'Credits', color: '#00d4ff', fn: () => SLACreditDistributionTool.open() }, + { cls: 'sla-dir-status-btn', icon: 'fas fa-clipboard-list', label: 'PC Status', color: '#e3e300', fn: () => SLAGMStatusWindow.open() }, + { cls: 'sla-dir-credit-btn', icon: 'fas fa-credit-card', label: 'Credits', color: '#e3e300', fn: () => SLACreditDistributionTool.open() }, { cls: 'sla-dir-ledger-btn', icon: 'fas fa-book-open', label: 'Ledger', color: '#aa88ff', fn: () => SLAShiftLedger.open() }, { cls: 'sla-dir-threat-btn', icon: 'fas fa-skull', label: 'Threats', color: '#ff4444', fn: () => SLANPCThreatBoard.open() }, { cls: 'sla-dir-bpn-btn', icon: 'fas fa-clipboard-check', label: 'BPN', color: '#ffcc00', fn: () => SLABPNTracker.open() }, diff --git a/styles/slazero2.css b/styles/slazero2.css index 9602513..90120c0 100644 --- a/styles/slazero2.css +++ b/styles/slazero2.css @@ -882,10 +882,10 @@ .slazero2 .skill-roll { width: 22px; height: 22px; - background: rgba(0, 212, 255, 0.2); - border: 2px solid #00d4ff; + background: rgba(227, 227, 0, 0.2); + border: 2px solid #e3e300; border-radius: 3px; - color: #00d4ff; + color: #e3e300; font-size: 14px; cursor: pointer; transition: all 0.2s; @@ -897,10 +897,10 @@ } .slazero2 .skill-roll:hover { - background: #00d4ff; + background: #e3e300; color: #000; transform: scale(1.15); - box-shadow: 0 0 10px rgba(0, 212, 255, 0.5); + box-shadow: 0 0 10px rgba(227, 227, 0, 0.5); } .slazero2 .skill-roll:active { @@ -1317,10 +1317,10 @@ } .yze-die.yze-success { - background: rgba(0, 212, 255, 0.3); - border-color: #00d4ff; - color: #00d4ff; - box-shadow: 0 0 10px rgba(0, 212, 255, 0.5); + background: rgba(227, 227, 0, 0.3); + border-color: #e3e300; + color: #e3e300; + box-shadow: 0 0 10px rgba(227, 227, 0, 0.5); font-size: 22px; } @@ -1391,16 +1391,16 @@ } .yze-roll-result .yze-summary strong { - color: #00d4ff; + color: #e3e300; font-size: 20px; - text-shadow: 0 0 6px rgba(0, 212, 255, 0.6); - border-bottom: 1px solid rgba(0, 212, 255, 0.5); + text-shadow: 0 0 6px rgba(227, 227, 0, 0.6); + border-bottom: 1px solid rgba(227, 227, 0, 0.5); padding-bottom: 1px; } .yze-roll-result .yze-summary .yze-success-label { color: #bfefff; - border-bottom: 1px solid rgba(0, 212, 255, 0.35); + border-bottom: 1px solid rgba(227, 227, 0, 0.35); padding-bottom: 1px; } @@ -1980,9 +1980,9 @@ } .slazero2 .weapon-type-badge.ranged { - color: #00d4ff; - background: rgba(0, 212, 255, 0.15); - border: 1px solid rgba(0, 212, 255, 0.3); + color: #e3e300; + background: rgba(227, 227, 0, 0.15); + border: 1px solid rgba(227, 227, 0, 0.3); } .slazero2 .weapon-type-badge.melee { @@ -2025,10 +2025,10 @@ .slazero2 .weapon-roll-btn { height: auto; min-width: 80px; - background: rgba(0, 212, 255, 0.18); - border: 2px solid #00d4ff; + background: rgba(227, 227, 0, 0.18); + border: 2px solid #e3e300; border-radius: 5px; - color: #00d4ff; + color: #e3e300; font-size: 11px; font-weight: bold; letter-spacing: 0.5px; @@ -2052,9 +2052,9 @@ } .slazero2 .weapon-roll-btn:hover { - background: #00d4ff; + background: #e3e300; color: #000; - box-shadow: 0 0 14px rgba(0, 212, 255, 0.55); + box-shadow: 0 0 14px rgba(227, 227, 0, 0.55); } .slazero2 .weapon-roll-btn:active { @@ -2477,7 +2477,7 @@ } .yze-initiative-successes .init-suc { - color: #00d4ff; + color: #e3e300; font-size: 14px; } @@ -3320,7 +3320,7 @@ border-radius: 4px; padding: 5px; } -.points-banner strong { color: #00d4ff; font-size: 16px; } +.points-banner strong { color: #e3e300; font-size: 16px; } /* Race Grid */ .race-grid { @@ -3345,7 +3345,7 @@ .race-card.selected { border-color: #ff6600; background: rgba(255,102,0,0.18); box-shadow: 0 0 8px rgba(255,102,0,0.3); } .rc-icon { font-size: 20px; text-align: center; } .rc-name { font-weight: bold; color: #fff; font-size: 12px; text-align: center; } -.rc-stats { font-size: 10px; color: #00d4ff; text-align: center; font-family: monospace; } +.rc-stats { font-size: 10px; color: #e3e300; text-align: center; font-family: monospace; } .rc-flavor { font-size: 10px; color: #999; line-height: 1.35; } .rc-ebb { font-size: 10px; color: #cc88ff; font-weight: bold; margin-top: 2px; } @@ -3390,7 +3390,7 @@ } .attr-label { width: 130px; color: #ccc; } .attr-base { width: 55px; font-size: 11px; color: #666; } -.attr-val { width: 24px; text-align: center; font-size: 16px; font-weight: bold; color: #00d4ff; } +.attr-val { width: 24px; text-align: center; font-size: 16px; font-weight: bold; color: #e3e300; } .attr-cap { font-size: 11px; color: #555; } .attr-btn { width: 24px; height: 24px; @@ -3405,7 +3405,7 @@ } .attr-btn:hover { background: rgba(255,102,0,0.3); } .derived-preview { text-align: center; font-size: 12px; color: #999; padding: 6px 0; } -.derived-preview strong { color: #00d4ff; } +.derived-preview strong { color: #e3e300; } /* Skill table */ .skill-gen-table { display: flex; flex-direction: column; gap: 4px; flex: 1; overflow-y: auto; } @@ -3429,7 +3429,7 @@ } .sg-label { width: 100px; color: #ccc; font-size: 12px; } .sg-training { width: 70px; font-size: 10px; color: #88ddaa; } -.sg-val { width: 20px; text-align: center; font-weight: bold; color: #00d4ff; font-size: 14px; } +.sg-val { width: 20px; text-align: center; font-weight: bold; color: #e3e300; font-size: 14px; } .sg-cap { font-size: 10px; color: #555; } .sg-btn { width: 20px; height: 20px; @@ -3918,13 +3918,13 @@ /* ── Mk1 finances + armor name ───────────────────────────── */ .slazero2 .armor-name-display { font-size: 12px; margin-bottom: 3px; } -.slazero2 .equipped-armor-name { color: #00d4ff; font-weight: bold; text-transform: uppercase; letter-spacing: 0.5px; } +.slazero2 .equipped-armor-name { color: #e3e300; font-weight: bold; text-transform: uppercase; letter-spacing: 0.5px; } .slazero2 .equipped-armor-name.none { color: #555; font-style: italic; text-transform: none; } .slazero2 .finances-section { padding: 12px; } .slazero2 .finances-credits-hero { display: flex; align-items: center; gap: 16px; background: rgba(0,0,0,0.3); border: 2px solid rgba(255,102,0,0.3); border-radius: 6px; padding: 12px 18px; margin-bottom: 14px; } .slazero2 .fin-credit-label { font-size: 11px; color: #888; text-transform: uppercase; letter-spacing: 1px; } -.slazero2 .fin-credit-value { font-size: 28px; font-weight: bold; color: #00d4ff; } -.slazero2 .fin-credit-value input { background: transparent; border: none; color: #00d4ff; font-size: 26px; font-weight: bold; width: 100px; } +.slazero2 .fin-credit-value { font-size: 28px; font-weight: bold; color: #e3e300; } +.slazero2 .fin-credit-value input { background: transparent; border: none; color: #e3e300; font-size: 26px; font-weight: bold; width: 100px; } .slazero2 .fin-debt-badge { background: rgba(220,40,40,0.2); border: 1px solid #cc2222; border-radius: 4px; padding: 3px 8px; color: #ff4444; font-size: 12px; font-weight: bold; margin-left: auto; } /* ── Showing Off hero panel ─────────────────────────────── */ .slazero2 .finances-showing-off-hero { @@ -4266,7 +4266,7 @@ body > .ze-pause-root .ze-sat-inner { } .slazero2 .morph-form-btn:hover { border-color: #888; color: #fff; } .slazero2 .morph-form-btn.morph-active { - border-color: #00d4ff; color: #00d4ff; background: rgba(0,180,255,0.12); + border-color: #e3e300; color: #e3e300; background: rgba(0,180,255,0.12); box-shadow: 0 0 10px rgba(0,200,255,0.25); } .slazero2 .instability-warning { font-size: 11px; color: #ff8800; margin-left: 8px; } @@ -4299,7 +4299,7 @@ body > .ze-pause-root .ze-sat-inner { } .slazero2 .morph-shift-btn:hover { background: rgba(0,180,255,0.25); } .slazero2 .morph-shift-btn.morph-shift-active { - background: rgba(0,212,255,0.2); border-color: #00d4ff; color: #00d4ff; + background: rgba(227,227,0,0.2); border-color: #e3e300; color: #e3e300; box-shadow: 0 0 8px rgba(0,200,255,0.3); } @@ -4775,10 +4775,10 @@ body > .ze-pause-root .ze-sat-inner { font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; - color: #00d4ff; + color: #e3e300; margin: 0 0 8px 0; padding-bottom: 5px; - border-bottom: 1px solid rgba(0, 212, 255, 0.25); + border-bottom: 1px solid rgba(227, 227, 0, 0.25); } /* ── Table ───────────────────────────────────────────────── */ @@ -4814,7 +4814,7 @@ body > .ze-pause-root .ze-sat-inner { } .credit-tool-window .ctw-row:hover { - background: rgba(0, 212, 255, 0.04); + background: rgba(227, 227, 0, 0.04); } .credit-tool-window .ctw-row:last-child { @@ -4872,7 +4872,7 @@ body > .ze-pause-root .ze-sat-inner { background: #0d1117; border: 1px solid #2a3a4a; border-radius: 3px; - color: #00d4ff; + color: #e3e300; font-family: "Courier New", "Consolas", monospace; font-size: 11px; font-weight: 700; @@ -4883,8 +4883,8 @@ body > .ze-pause-root .ze-sat-inner { .credit-tool-window .ctw-credits-input:focus { outline: none; - border-color: #00d4ff; - box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.2); + border-color: #e3e300; + box-shadow: 0 0 0 2px rgba(227, 227, 0, 0.2); } /* Remove browser spin buttons */ @@ -4942,15 +4942,15 @@ body > .ze-pause-root .ze-sat-inner { } .credit-tool-window .ctw-btn-save { - background: rgba(0, 212, 255, 0.1); - border-color: rgba(0, 212, 255, 0.4); - color: #00d4ff; + background: rgba(227, 227, 0, 0.1); + border-color: rgba(227, 227, 0, 0.4); + color: #e3e300; } .credit-tool-window .ctw-btn-save:hover { - background: rgba(0, 212, 255, 0.22); - border-color: #00d4ff; - box-shadow: 0 0 6px rgba(0, 212, 255, 0.3); + background: rgba(227, 227, 0, 0.22); + border-color: #e3e300; + box-shadow: 0 0 6px rgba(227, 227, 0, 0.3); } .credit-tool-window .ctw-btn-pay-all { @@ -4983,7 +4983,7 @@ body > .ze-pause-root .ze-sat-inner { /* ── Bulk panel ──────────────────────────────────────────── */ .credit-tool-window .ctw-bulk-panel { - background: rgba(0, 212, 255, 0.02); + background: rgba(227, 227, 0, 0.02); } .credit-tool-window .ctw-bulk-controls { @@ -5077,7 +5077,7 @@ body > .ze-pause-root .ze-sat-inner { .shift-ledger-window .slw-positive { color: #44cc66; } .shift-ledger-window .slw-negative { color: #cc2222; } .shift-ledger-window .slw-debt { color: #ff6b35; } -.shift-ledger-window .slw-credits { color: #00d4ff; } +.shift-ledger-window .slw-credits { color: #e3e300; } .shift-ledger-window .slw-neutral { color: #888; } .shift-ledger-window .slw-mono { font-family: 'Courier New', Courier, monospace; } @@ -5087,7 +5087,7 @@ body > .ze-pause-root .ze-sat-inner { flex-wrap: wrap; gap: 0; background: linear-gradient(135deg, #16213e 0%, #1a1a2e 100%); - border-bottom: 2px solid #00d4ff44; + border-bottom: 2px solid #e3e30044; padding: 10px 14px; } @@ -5138,7 +5138,7 @@ body > .ze-pause-root .ze-sat-inner { .shift-ledger-window .slw-pc-card { background: #12122a; border: 1px solid #2a2a4a; - border-left: 3px solid #00d4ff55; + border-left: 3px solid #e3e30055; border-radius: 4px; margin-bottom: 8px; overflow: hidden; @@ -5146,7 +5146,7 @@ body > .ze-pause-root .ze-sat-inner { } .shift-ledger-window .slw-pc-card:hover { - border-left-color: #00d4ff; + border-left-color: #e3e300; } /* PC card header */ @@ -5184,7 +5184,7 @@ body > .ze-pause-root .ze-sat-inner { font-family: 'Courier New', Courier, monospace; font-size: 1.15em; font-weight: bold; - color: #00d4ff; + color: #e3e300; white-space: nowrap; } @@ -5307,13 +5307,13 @@ body > .ze-pause-root .ze-sat-inner { /* Process all */ .shift-ledger-window .slw-btn--all { background: linear-gradient(135deg, #1a2a3a 0%, #162030 100%); - color: #00d4ff; - border: 1px solid #00d4ff55; + color: #e3e300; + border: 1px solid #e3e30055; } .shift-ledger-window .slw-btn--all:hover { background: linear-gradient(135deg, #1e3040 0%, #1a2838 100%); - border-color: #00d4ffaa; + border-color: #e3e300aa; } /* Export to chat */ @@ -5343,7 +5343,7 @@ body > .ze-pause-root .ze-sat-inner { } .shift-ledger-window .window-content::-webkit-scrollbar-thumb:hover { - background: #00d4ff44; + background: #e3e30044; } /* ── ☠ NPC THREAT BOARD ──────────────────────────────────────────────────── */ @@ -6209,7 +6209,7 @@ body > .ze-pause-root .ze-sat-inner { justify-content: space-between; padding: 8px 12px; background: #13132b; - border-bottom: 1px solid #00d4ff33; + border-bottom: 1px solid #e3e30033; flex-shrink: 0; gap: 8px; } @@ -6231,8 +6231,8 @@ body > .ze-pause-root .ze-sat-inner { .condition-applicator-window .cap-selected-name { font-size: 0.95rem; font-weight: 700; - color: #00d4ff; - text-shadow: 0 0 8px #00d4ff88; + color: #e3e300; + text-shadow: 0 0 8px #e3e30088; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; @@ -6265,15 +6265,15 @@ body > .ze-pause-root .ze-sat-inner { .condition-applicator-window .cap-btn:hover { background: #22224a; - border-color: #00d4ff55; + border-color: #e3e30055; color: #c8d0e0; } .condition-applicator-window .cap-btn--toggle.cap-btn--active { background: #0a2a3a; - border-color: #00d4ff; - color: #00d4ff; - box-shadow: 0 0 6px #00d4ff44; + border-color: #e3e300; + color: #e3e300; + box-shadow: 0 0 6px #e3e30044; } .condition-applicator-window .cap-btn--danger { @@ -6391,10 +6391,10 @@ body > .ze-pause-root .ze-sat-inner { width: 14px; height: 14px; border-radius: 50%; - background: #00d4ff22; - border: 1px solid #00d4ff66; + background: #e3e30022; + border: 1px solid #e3e30066; font-size: 0.45rem; - color: #00d4ff; + color: #e3e300; } .condition-applicator-window .cap-no-pcs { @@ -6461,14 +6461,14 @@ body > .ze-pause-root .ze-sat-inner { .condition-applicator-window .cap-cond-tile--active { background: #062030; - border: 1px solid #00d4ff; - box-shadow: 0 0 8px #00d4ff44, inset 0 0 12px #00d4ff18; + border: 1px solid #e3e300; + box-shadow: 0 0 8px #e3e30044, inset 0 0 12px #e3e30018; } .condition-applicator-window .cap-cond-tile--active .cap-cond-icon, .condition-applicator-window .cap-cond-tile--active .cap-cond-label { - color: #00d4ff; - text-shadow: 0 0 6px #00d4ff88; + color: #e3e300; + text-shadow: 0 0 6px #e3e30088; } .condition-applicator-window .cap-cond-icon { @@ -6557,8 +6557,8 @@ body > .ze-pause-root .ze-sat-inner { padding: 2px 7px; border-radius: 10px; background: #062030; - border: 1px solid #00d4ff55; - color: #00d4ff; + border: 1px solid #e3e30055; + color: #e3e300; font-size: 0.65rem; font-weight: 600; text-transform: uppercase; @@ -6574,6 +6574,217 @@ body > .ze-pause-root .ze-sat-inner { .condition-applicator-window .cap-status-mode { font-size: 0.7rem; - color: #00d4ff88; + color: #e3e30088; font-style: italic; } + +/* ═══════════════════════════════════════════════════════════════════════════ + SLA ZERO TWO — V2 IDENTITY LAYER + Hazard yellow · black chrome · blood red. One language for sheets, + dialogs, and chat. Appended last so it wins the cascade. + ═══════════════════════════════════════════════════════════════════════════ */ + +:root { + --sz2-yellow: #e3e300; + --sz2-yellow-dim: #9a9a00; + --sz2-red: #cc1111; + --sz2-red-bright: #ff2d2d; + --sz2-black: #0a0a0a; + --sz2-panel: #141414; + --sz2-panel-2: #1d1d1d; + --sz2-steel: #2e2e2e; + --sz2-bone: #e8e4d8; + --sz2-text: #d8d8d0; + --sz2-text-dim: #8a8a82; + --sz2-font-title: "SLA Borg Title", "SLA Borg UI", sans-serif; + --sz2-font-ui: "SLA Borg UI", "Rajdhani", sans-serif; + --sz2-font-tech: "SLA Borg Tech", monospace; + --sz2-hazard: repeating-linear-gradient(-45deg, + var(--sz2-yellow) 0 12px, var(--sz2-black) 12px 24px); +} + +/* ── Window chrome: every system window speaks the language ─────────────── */ +.slazero2.window-app .window-header { + background: linear-gradient(180deg, #232323, #101010); + border-bottom: 2px solid var(--sz2-yellow); + font-family: var(--sz2-font-ui); + letter-spacing: 1px; + text-transform: uppercase; +} +.slazero2.window-app .window-header .window-title { color: var(--sz2-yellow); } + +.slazero2 .window-content { + background: + linear-gradient(rgba(10,10,10,0.92), rgba(10,10,10,0.92)), + url("/systems/slazero2/assets/textures/character-sheet-background.webp") center/cover; + color: var(--sz2-text); +} + +/* ── Hazard stripe: section headers on sheets ────────────────────────────── */ +.slazero2 .sheet-header::after { + content: ""; + display: block; + height: 5px; + background: var(--sz2-hazard); + opacity: 0.85; +} + +/* ── Tabs ─────────────────────────────────────────────────────────────────── */ +.slazero2 .sheet-tabs { + background: var(--sz2-black); + border-bottom: 1px solid var(--sz2-steel); +} +.slazero2 .sheet-tabs .item { + font-family: var(--sz2-font-ui); + text-transform: uppercase; + letter-spacing: 2px; + color: var(--sz2-text-dim); + border: none; + border-bottom: 3px solid transparent; + transition: color .15s, border-color .15s; +} +.slazero2 .sheet-tabs .item:hover { color: var(--sz2-bone); } +.slazero2 .sheet-tabs .item.active { + color: var(--sz2-yellow); + border-bottom-color: var(--sz2-yellow); + text-shadow: 0 0 10px rgba(227, 227, 0, 0.35); +} + +/* ── Buttons ─────────────────────────────────────────────────────────────── */ +.slazero2 button, +.slazero2 .dialog button { + background: linear-gradient(180deg, var(--sz2-panel-2), var(--sz2-black)); + border: 1px solid var(--sz2-steel); + border-radius: 3px; + color: var(--sz2-text); + font-family: var(--sz2-font-ui); + text-transform: uppercase; + letter-spacing: 1px; + transition: border-color .15s, color .15s, box-shadow .15s; +} +.slazero2 button:hover, +.slazero2 .dialog button:hover { + border-color: var(--sz2-yellow); + color: var(--sz2-yellow); + box-shadow: 0 0 8px rgba(227, 227, 0, 0.25); +} + +/* ── Inputs ──────────────────────────────────────────────────────────────── */ +.slazero2 input[type="text"], +.slazero2 input[type="number"], +.slazero2 select, +.slazero2 textarea { + background: rgba(0, 0, 0, 0.55); + border: 1px solid var(--sz2-steel); + border-radius: 3px; + color: var(--sz2-bone); + font-family: var(--sz2-font-tech); +} +.slazero2 input:focus, +.slazero2 select:focus, +.slazero2 textarea:focus { + border-color: var(--sz2-yellow); + box-shadow: 0 0 6px rgba(227, 227, 0, 0.3); + outline: none; +} + +/* ── Chat cards: dark glass + yellow rail ────────────────────────────────── */ +.yze-roll-result, +.yze-initiative-card, +.panic-result, +.critical-injury { + background: + linear-gradient(rgba(12,12,12,0.94), rgba(12,12,12,0.94)), + url("/systems/slazero2/assets/textures/chat-card-background.webp") center/cover; + border: 1px solid var(--sz2-steel); + border-left: 4px solid var(--sz2-yellow); + border-radius: 6px; + box-shadow: 0 3px 12px rgba(0, 0, 0, 0.55); + color: var(--sz2-text); + font-family: var(--sz2-font-ui); +} +.panic-result { border-left-color: var(--sz2-red-bright); } +.critical-injury { border-left-color: var(--sz2-red); } +.yze-initiative-card .yze-initiative-title { + font-family: var(--sz2-font-title); + color: var(--sz2-yellow); + letter-spacing: 2px; + text-transform: uppercase; +} + +/* ── Inline chat dice: match the 3D dice exactly ─────────────────────────── */ +.yze-die { + background: var(--sz2-yellow); + border: 2px solid #000; + color: #000; + border-radius: 4px; + font-family: var(--sz2-font-ui); +} +.yze-die.yze-success { + background: var(--sz2-yellow); + border-color: #000; + color: #000; + box-shadow: 0 0 12px rgba(227, 227, 0, 0.8); + outline: 2px solid var(--sz2-yellow); +} +.yze-die.yze-stress { + background: #0b0b0b; + border-color: #444; + color: #ddd; + box-shadow: none; +} +.yze-die.yze-stress.yze-success { + border-color: var(--sz2-yellow); + color: var(--sz2-yellow); + box-shadow: 0 0 12px rgba(227, 227, 0, 0.6); +} +.yze-die.yze-stress.yze-bane { + background: var(--sz2-red); + border-color: #000; + color: #fff; + box-shadow: 0 0 12px rgba(204, 17, 17, 0.8); + animation: sz2-bane-pulse 1.6s ease-in-out infinite; +} +@keyframes sz2-bane-pulse { + 0%, 100% { box-shadow: 0 0 6px rgba(204, 17, 17, 0.5); } + 50% { box-shadow: 0 0 16px rgba(255, 45, 45, 0.9); } +} + +/* ── Push button: the temptation should look like one ────────────────────── */ +.yze-push-button { + background: linear-gradient(180deg, #3a0505, #180000); + border: 1px solid var(--sz2-red); + color: #ff8866; + font-family: var(--sz2-font-ui); + text-transform: uppercase; + letter-spacing: 2px; + border-radius: 4px; + transition: all .15s; +} +.yze-push-button:hover { + background: linear-gradient(180deg, #5a0808, #2a0000); + border-color: var(--sz2-red-bright); + color: #fff; + box-shadow: 0 0 12px rgba(255, 45, 45, 0.5); +} + +/* ── Roll dialog ─────────────────────────────────────────────────────────── */ +.zero-engine.dialog .window-content, +.slazero2.dialog .window-content { + background: linear-gradient(180deg, #161616, #0c0c0c); +} +.yze-roll-dialog label { + font-family: var(--sz2-font-ui); + text-transform: uppercase; + letter-spacing: 1px; + color: var(--sz2-text-dim); +} + +/* ── Scrollbars inside system windows ────────────────────────────────────── */ +.slazero2 ::-webkit-scrollbar { width: 8px; } +.slazero2 ::-webkit-scrollbar-track { background: var(--sz2-black); } +.slazero2 ::-webkit-scrollbar-thumb { + background: var(--sz2-steel); + border-radius: 4px; +} +.slazero2 ::-webkit-scrollbar-thumb:hover { background: var(--sz2-yellow-dim); }