/* NexusRoCalc: a compact workbench, with combat visible throughout the build. */
#skillsim {
    --nc-bg:#111b2b; --nc-surface:#19273b; --nc-raised:#21334b;
    --nc-ink:#e3edf8; --nc-muted:#9aaec7; --nc-line:#344860;
    --nc-teal:#54d7c1; --nc-teal-fill:#183c40; --nc-blue:#8db9ff;
    --nc-amber:#f6c66b; --nc-rose:#f29da8; --nc-purple:#c4b2ff;
    --ss-card:var(--nc-surface); --nxp-line:var(--nc-line); --nxp-fill:var(--nc-raised);
    color:var(--nc-ink); --text-dim:var(--nc-muted); --gold:var(--nc-amber); --gold-light:var(--nc-amber);
}
[data-theme="light"] #skillsim {
    --nc-bg:#f1f5fb; --nc-surface:#fff; --nc-raised:#eaf0f8;
    --nc-ink:#25364e; --nc-muted:#596d88; --nc-line:#cfdae9;
    --nc-teal:#147c71; --nc-teal-fill:#e0f4ee; --nc-blue:#3269b5;
    --nc-amber:#94621a; --nc-rose:#a8495d; --nc-purple:#7560ae;
    --ss-card:var(--nc-surface);
}
#nx-content.nc-host { overflow:visible; }
#skillsim .nxp-banner {
    position:relative; overflow:hidden; margin-bottom:12px; border:1px solid #354b66;
    border-radius:12px; background:linear-gradient(115deg,#13243b,#203d55 60%,#175750);
    box-shadow:0 6px 20px #12243818; padding:0;
}
#skillsim .nxp-banner::after {
    content:""; position:absolute; right:-25px; top:-72px; width:260px; height:260px;
    border:1px solid #6de2cd30; border-radius:50%; box-shadow:0 0 0 25px #6de2cd08,0 0 0 56px #6de2cd05; pointer-events:none;
}
#skillsim .nxp-banner-top { padding:12px 18px; background:none; border:0; }
#skillsim .nxp-banner-label { color:#81e7d2; font-size:10px; letter-spacing:.2em; }
#skillsim .nxp-banner-title { color:#f0f5fd; font-size:26px; text-shadow:none; letter-spacing:.01em; }
#skillsim .nxp-banner-sub { color:#b8ccdf; }
#skillsim .nxp-banner-sub::before,#skillsim .nxp-banner-sub::after { background:#80cfc3; }
#skillsim .nxp-panel {
    border:1px solid var(--nc-line); border-radius:10px; background:var(--nc-bg);
    box-shadow:0 4px 15px #15283b07; overflow:visible;
}
#skillsim .nxp-panel-head {
    background:linear-gradient(100deg,var(--nc-raised),var(--nc-bg)); color:var(--nc-ink);
    border-bottom:1px solid var(--nc-line); border-radius:9px 9px 0 0; font-weight:650; letter-spacing:.07em;
}
#skillsim input,#skillsim select,#skillsim button {
    background:var(--nc-surface); color:var(--nc-ink); border-color:var(--nc-line); border-radius:6px;
}
#skillsim input:focus,#skillsim select:focus { outline:2px solid var(--nc-teal); outline-offset:1px; }
#skillsim button:hover:not(:disabled) { background:var(--nc-raised); }
#skillsim button:focus-visible,#skillsim summary:focus-visible { outline:2px solid var(--nc-teal); outline-offset:2px; }
#skillsim .ss-toolbar { padding:10px 12px; }
#skillsim .ss-stat-panel { padding:0 12px 10px; }
#skillsim .ss-stat-grid label { border:1px solid var(--nc-line); border-top:3px solid var(--nc-blue); background:var(--nc-surface); padding:5px 7px; border-radius:7px; font-size:11px; font-weight:600; }
#skillsim .ss-stat-grid label:nth-child(2) { border-top-color:var(--nc-teal); }
#skillsim .ss-stat-grid label:nth-child(3) { border-top-color:var(--nc-rose); }
#skillsim .ss-stat-grid label:nth-child(4) { border-top-color:var(--nc-purple); }
#skillsim .ss-stat-grid label:nth-child(5) { border-top-color:var(--nc-amber); }
#skillsim .ss-stat-grid label:nth-child(6) { border-top-color:var(--nc-teal); }
#skillsim .ss-stat-grid input { border:0; padding:2px 0; min-height:26px; font-size:17px; font-weight:650; }
#skillsim .ss-stat-summary { color:var(--nc-muted); }
.nc-build-identity { display:flex; align-items:center; gap:8px; }
/* Preserve the native 64x108 sprite pixels in the character heading. */
#skillsim .nc-build-identity .nc-artwork-job { width:64px; height:108px; border:0; background:transparent; }
#skillsim .nc-build-identity .nc-artwork-job img { width:64px; height:108px; max-width:none; max-height:none; image-rendering:pixelated; }
#skillsim .ss-job img { image-rendering:pixelated; }
.nc-character-sprite { display:inline-flex; align-items:center; justify-content:center; width:128px; height:116px; flex:none; }
.nc-character-sprite img { width:auto; height:auto; max-width:128px; max-height:116px; image-rendering:pixelated; object-fit:contain; }
.nc-character-sprite img[hidden] { display:none; }
#skillsim .ss-point { background:var(--nc-teal-fill); color:var(--nc-teal); border-color:var(--nc-line); }
#skillsim .nc-calculator { padding:10px; border-top:1px solid var(--nc-line); gap:10px; grid-template-columns:minmax(0,1.35fr) minmax(270px,1fr); }
#skillsim .nc-equipment,#skillsim .nc-results { padding:10px; border:1px solid var(--nc-line); border-radius:8px; background:var(--nc-surface); }
#skillsim .nc-results { position:static; }
#skillsim .nc-calculator h3 { color:var(--nc-blue); font-size:12px; letter-spacing:.065em; }
#skillsim .nc-results>h3,#nc-buffs>h3 { color:var(--nc-teal); }
#skillsim .nc-slot { padding:7px 0; }
#skillsim .nc-slot>label { grid-template-columns:82px minmax(0,1fr); }
#skillsim .nc-slot>label>input[type="search"] { display:none; }
.nc-slot-name { color:var(--nc-muted); font-size:11px; font-weight:550; }
#skillsim .nc-item-settings { padding-left:88px; gap:6px; }
#skillsim .nc-item-settings label { min-width:135px; color:var(--nc-muted); }
#skillsim .nc-item-settings label:first-child { min-width:42px; flex-basis:42px; }
#skillsim .nc-slot>details { padding-left:88px; }
.nc-item-link,.nc-source { display:flex; align-items:center; gap:7px; }
.nc-item-link { color:var(--nc-blue); font-weight:600; text-decoration:none; }
#skillsim .nc-slot details p { padding:3px 0; }
#skillsim .nc-slot details summary { color:var(--nc-blue); }
#skillsim .nc-item-description { white-space:pre-line; overflow-wrap:anywhere; line-height:1.5; color:var(--nc-ink); }
#skillsim .nc-item-script-title { margin:6px 0 3px; color:var(--nc-muted); font-size:10px; font-weight:600; }
#skillsim .nc-combo-items { display:flex; align-items:center; flex-wrap:wrap; gap:4px; color:var(--nc-muted); }
#skillsim .nc-combo-items .nc-item-link { display:inline-flex; font-size:10px; }
#skillsim .nc-combo-items .nc-artwork { width:20px; height:20px; }
#skillsim .nc-slot details pre { margin:3px 0 6px; border:1px solid var(--nc-line); border-radius:6px; font-size:11px; line-height:1.5; }
#skillsim .nc-total-stats { gap:6px; }
#skillsim .nc-total-stats>div { border:1px solid var(--nc-line); border-radius:7px; background:var(--nc-bg); padding:6px 8px; }
#skillsim .nc-total-stats strong { color:var(--nc-ink); font-size:16px; }
#skillsim .nc-total-stats small { color:var(--nc-teal); }
#skillsim .nc-total-grid { column-gap:8px; }
#skillsim .nc-total-grid dt { color:var(--nc-muted); font-size:11px; }
#skillsim .nc-total-grid dd { color:var(--nc-ink); font-weight:600; }
#skillsim .nc-effect-group { border-color:var(--nc-line); }
#skillsim .nc-effect-group summary { color:var(--nc-purple); }
#skillsim .nc-wide { padding:8px 10px; border:1px solid var(--nc-line); background:var(--nc-surface); border-radius:8px; }
#skillsim .nc-wide>summary { color:var(--nc-blue); font-weight:600; }
#skillsim .nc-resistance>summary { color:var(--nc-teal); }
#skillsim .nc-skill-table th { color:var(--nc-muted); font-size:10px; text-transform:uppercase; letter-spacing:.035em; }
#skillsim .nc-skill-table tr:nth-child(even) { background:var(--nc-bg); }
#skillsim .nc-skill-table td:nth-child(3) { color:var(--nc-teal); font-weight:650; }
#skillsim .ss-tier { background:var(--nc-bg); border-color:var(--nc-line); }
#skillsim .ss-tier .ss-tier-title { color:var(--nc-blue); }
#skillsim .ss-skill { background:var(--nc-surface); border-color:var(--nc-line); }
#skillsim .ss-skill.is-learned { border-color:var(--nc-teal); background:var(--nc-teal-fill); }
#skillsim .ss-skill.is-quest { border-color:var(--nc-amber); }
/* Keep prerequisites conspicuous even when the skill is already learned. */
#skillsim .ss-skill.is-prerequisite {
    background:#3c3322; color:#f3e7cc; border-color:#c79a48;
    box-shadow:inset 0 0 0 1px #c79a4866;
    z-index:2;
}
[data-theme="light"] #skillsim .ss-skill.is-prerequisite {
    background:#fff0c9; color:#594729; border-color:#be9548;
    box-shadow:inset 0 0 0 1px #be954866;
}
#skillsim .ss-skill.is-prerequisite .ss-skill-head { opacity:1; }
#skillsim .ss-skill.is-prerequisite .ss-skill-head strong { font-weight:600; }
#skillsim .ss-tooltip { color:var(--nc-ink); border-color:var(--nc-teal); }
#skillsim .ss-jobs .ss-job.is-selected { background:var(--nc-teal-fill)!important; color:var(--nc-teal)!important; border-color:var(--nc-teal); box-shadow:0 0 0 1px var(--nc-teal); }
#skillsim .ss-actions button:nth-child(2) { background:var(--nc-teal-fill); color:var(--nc-teal); border-color:var(--nc-teal); }

/* The dock stays inside the calculator's page boundary, including the skill tree. */
.nc-combat-dock {
    position:sticky; top:8px; z-index:80; margin:0 0 12px; padding:9px 12px 0;
    color:var(--nc-ink); background:var(--nc-surface); border:1px solid var(--nc-line);
    border-top:3px solid var(--nc-teal); border-radius:10px; box-shadow:0 6px 22px #07132326;
    font-size:12px; scroll-margin-top:8px;
}
.nc-dock-heading { display:flex; align-items:center; gap:12px; min-width:0; }
#skillsim .nc-dock-heading h2 { margin:0; font-size:14px; color:var(--nc-ink); letter-spacing:0; text-transform:none; white-space:nowrap; }
#nc-dock-target { display:flex; align-items:center; gap:6px; color:var(--nc-muted); font-size:11px; min-width:0; }
#nc-dock-target>span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#nc-dock-target .nc-artwork { width:28px; height:28px; border:0; background:transparent; }
#nc-live-state { margin-left:auto; color:var(--nc-teal); font-size:10px; white-space:nowrap; }
#nc-live-state::before { content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:currentColor; margin-right:5px; box-shadow:0 0 6px currentColor; }
#nc-live-state.has-warning { color:var(--nc-amber); } #nc-live-state.has-error { color:var(--nc-rose); }
.nc-warning { padding:8px; color:var(--nc-amber); border:1px solid var(--nc-line); border-left:3px solid var(--nc-amber); background:var(--nc-bg); border-radius:6px; font-size:11px; }
#skillsim .nc-quick-controls { grid-template-columns:100px minmax(0,1.5fr) minmax(0,1fr) 54px; gap:8px; padding:5px 0 7px; }
.nc-combat-dock .nc-combat-controls label { font-size:10px; color:var(--nc-muted); }
.nc-combat-dock input,.nc-combat-dock select { min-height:30px; width:100%; font-size:12px; }
.nc-combat-quick { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.nc-combat-metric { position:relative; padding:5px 8px; background:var(--nc-bg); border:1px solid var(--nc-line); border-radius:6px; min-width:0; }
.nc-combat-metric>span { display:block; font-size:10px; color:var(--nc-muted); }
.nc-combat-metric>strong { font-size:17px; font-weight:650; font-variant-numeric:tabular-nums; color:var(--nc-teal); }
.nc-metric-received>strong { color:var(--nc-rose); } .nc-metric-cast>strong { color:var(--nc-blue); } .nc-metric-kill>strong { color:var(--nc-amber); }
.nc-delta { margin-left:6px; font-size:10px; white-space:nowrap; }.nc-delta.is-better { color:var(--nc-teal); }.nc-delta.is-worse { color:var(--nc-rose); }
.nc-combat-empty { grid-column:1/-1; margin:0; padding:5px 0; color:var(--nc-muted); }
.nc-combat-dock.is-pending .nc-combat-quick { opacity:.55; }
.nc-combat-more>summary { cursor:pointer; color:var(--nc-blue); padding:5px 0; font-size:10px; }
.nc-combat-expanded { max-height:min(56vh,500px,calc(100dvh - 240px)); overflow:auto; overscroll-behavior:contain; border-top:1px solid var(--nc-line); padding:0 3px 8px 0; }
.nc-combat-dock .nc-target-info { display:flex; align-items:center; gap:8px; padding:7px; border:1px solid var(--nc-line); background:var(--nc-bg); border-radius:7px; font-size:11px; color:var(--nc-blue); }
.nc-target-info[data-element="fire"] { color:var(--nc-rose); }.nc-target-info[data-element="earth"] { color:var(--nc-amber); }.nc-target-info[data-element="wind"] { color:var(--nc-teal); }
.nc-combat-dock .nc-combat-columns { gap:10px; }
.nc-combat-columns>section { min-width:0; padding:8px; border:1px solid var(--nc-line); border-top:3px solid var(--nc-teal); border-radius:7px; background:var(--nc-bg); }
.nc-combat-columns>section:nth-child(2) { border-top-color:var(--nc-rose); }
#skillsim .nc-combat-columns h3 { margin:0; font-size:11px; color:var(--nc-teal); letter-spacing:.06em; }
#skillsim .nc-combat-columns>section:nth-child(2) h3 { color:var(--nc-rose); }
.nc-combat-columns .nc-total-grid { grid-template-columns:minmax(0,1fr) auto; margin:5px 0; }
.nc-combat-dock [hidden] { display:none!important; }

/* Image selectors preserve the original select/change handlers and item checks. */
.nc-image-select { position:relative; display:block; min-width:0; width:100%; }
#skillsim select.nc-native-select { position:absolute!important; width:1px!important; height:1px!important; min-height:0!important; opacity:0; pointer-events:none; padding:0!important; border:0!important; }
#skillsim .nc-picker-trigger { display:flex; align-items:center; gap:6px; width:100%; min-height:34px; padding:3px 6px; font-size:11px; text-align:left; font-weight:500; }
.nc-picker-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nc-picker-chevron { margin-left:auto; color:var(--nc-muted); font-size:15px; }
.nc-artwork { flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; background:var(--nc-raised,#21334b); border:1px solid var(--nc-line,#344860); border-radius:5px; box-sizing:border-box; }
.nc-artwork img { max-width:100%; max-height:100%; object-fit:contain; image-rendering:pixelated; }
.nc-artwork-empty::before { content:"◇"; color:var(--nc-muted,#9aaec7); opacity:.65; }
.nc-artwork-monster { width:32px; height:30px; background:transparent; border:0; }
.nc-picker-popover {
    --nc-raised:#21334b; --nc-line:#344860; --nc-muted:#9aaec7;
    position:fixed; z-index:10001; box-sizing:border-box; display:flex; flex-direction:column; padding:7px;
    border:1px solid #536d8c; border-radius:9px; background:#19273b; color:#e3edf8;
    box-shadow:0 12px 32px #07132355; font:12px/1.35 Arial,sans-serif;
}
[data-theme="light"] .nc-picker-popover { --nc-raised:#eaf0f8; --nc-line:#cfdae9; --nc-muted:#596d88; background:#fff; color:#25364e; border-color:#b1c4dc; }
.nc-picker-popover>input { box-sizing:border-box; width:100%; min-height:34px; padding:6px 8px; flex:none; border:1px solid var(--nc-line); border-radius:5px; background:var(--nc-raised); color:inherit; font:inherit; }
.nc-picker-popover>input:focus { outline:2px solid #2ab7a0; outline-offset:0; }
.nc-picker-list { min-height:0; overflow:auto; margin-top:5px; overscroll-behavior:contain; }
.nc-picker-option { display:flex; align-items:center; gap:8px; width:100%; padding:5px 6px; min-height:37px; border:0; border-radius:5px; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.nc-picker-option:hover,.nc-picker-option.is-focused { background:var(--nc-raised); }
.nc-picker-option[aria-selected="true"] { background:#2ab7a022; box-shadow:inset 3px 0 #2ab7a0; }
.nc-picker-list>p { color:var(--nc-muted); padding:5px 7px; margin:0; font-size:11px; }
@media(max-width:900px) {
    #skillsim .nc-calculator { grid-template-columns:1fr; }
    .nc-dock-heading { gap:7px; }
    .nc-delta { display:block; margin:0; }
}
@media(max-width:540px) {
    .nc-combat-dock { top:4px; padding:7px 8px 0; margin-bottom:10px; }
    #skillsim .nc-dock-heading h2 { font-size:12px; }
    #nc-dock-target { max-width:130px; font-size:10px; } #nc-dock-target .nc-artwork { width:22px; height:22px; }
    #nc-live-state { font-size:9px; }
    #skillsim .nc-quick-controls { grid-template-columns:100px minmax(0,1fr) 54px; gap:4px 6px; }
    .nc-quick-controls>label:nth-child(2) { grid-column:2/4; }
    .nc-quick-controls>label:nth-child(3) { grid-column:1/3; }
    .nc-combat-quick { gap:4px; }
    .nc-combat-metric { padding:4px; } .nc-combat-metric>span { font-size:9px; } .nc-combat-metric>strong { font-size:14px; }
    .nc-delta { font-size:9px; }
    #skillsim .nc-equipment,#skillsim .nc-results { padding:8px; }
    #skillsim .nc-slot>label { grid-template-columns:68px minmax(0,1fr); gap:5px; }
    #skillsim .nc-item-settings,#skillsim .nc-slot>details { padding-left:0; }
    #skillsim .nc-item-settings label { min-width:125px; }
    .nc-combat-expanded { max-height:min(48vh,calc(100dvh - 285px)); }
    .nc-combat-columns { grid-template-columns:1fr; }
    .nc-picker-trigger { min-height:36px; }
}
@media(prefers-reduced-motion:no-preference) {
    .nc-combat-metric { transition:opacity .15s,background .15s; }
    #skillsim button { transition:border-color .15s,background .15s; }
}
/* FluxCP's shared theme uses !important for form controls and headings. */
#skillsim input,#skillsim select,#skillsim button { background-color:var(--nc-surface)!important; border-color:var(--nc-line)!important; color:var(--nc-ink)!important; }
#skillsim button:hover:not(:disabled) { background-color:var(--nc-raised)!important; color:var(--nc-ink)!important; }
#skillsim select option { background:var(--nc-surface); color:var(--nc-ink); }
#skillsim h3 { color:var(--nc-blue)!important; border-bottom:0!important; }
#skillsim .nc-results>h3,#skillsim #nc-buffs>h3,#skillsim .nc-combat-columns h3 { color:var(--nc-teal)!important; }
#skillsim .nc-combat-columns>section:nth-child(2) h3 { color:var(--nc-rose)!important; }
#skillsim .nc-dock-heading h2 { color:var(--nc-ink)!important; border:0!important; }
#skillsim .ss-actions button:nth-child(2) { background-color:var(--nc-teal-fill)!important; color:var(--nc-teal)!important; border-color:var(--nc-teal)!important; }
#skillsim .ss-jobs .ss-job.is-selected { background-color:var(--nc-teal-fill)!important; color:var(--nc-teal)!important; border-color:var(--nc-teal)!important; }
.nc-picker-popover .nc-picker-option { background:transparent!important; color:inherit!important; border:0!important; }
.nc-picker-popover .nc-picker-option:hover,.nc-picker-popover .nc-picker-option.is-focused { background:var(--nc-raised)!important; }
.nc-picker-popover .nc-picker-option[aria-selected="true"] { background:#2ab7a022!important; }
#skillsim .nc-import-notice{margin:10px 0;padding:9px 12px;border:1px solid var(--nc-teal);border-radius:7px;background:var(--nc-teal-fill);font-size:12px}
#skillsim .nc-effect-name{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;vertical-align:middle}
#skillsim .nc-effect-name img{width:20px;height:20px;object-fit:contain;flex:0 0 20px;image-rendering:pixelated}
#skillsim .nc-effect-name>span{min-width:0;overflow-wrap:anywhere}
#skillsim .nc-effect-group>summary .nc-effect-name{gap:7px;font-weight:600}
#skillsim #nc-buffs>h3 .nc-effect-name img{width:22px;height:22px;flex-basis:22px}
#skillsim .nc-effect-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;min-width:0;font-size:11px}
#skillsim .nc-effect-control>label{display:block;min-width:0;cursor:pointer;font-size:inherit}
#skillsim .nc-effect-controls{display:flex;align-items:center;gap:5px}
#skillsim .nc-effect-controls select{width:43px;min-width:0;min-height:32px;padding:3px;font-size:11px}
#skillsim .nc-effect-controls select:disabled{opacity:.45}
#skillsim .nc-switch{position:relative;display:inline-flex;align-items:center;width:52px;height:32px;flex:none}
#skillsim .nc-switch input[type="checkbox"]{position:absolute;inset:0;z-index:1;width:100%;height:100%;min-height:0;margin:0;padding:0;opacity:0;cursor:pointer}
#skillsim .nc-switch-track{position:relative;display:block;box-sizing:border-box;width:52px;height:24px;border:1px solid var(--nc-line);border-radius:12px;background:var(--nc-raised);color:var(--nc-muted);font-size:10px;font-weight:600;line-height:22px;pointer-events:none}
#skillsim .nc-switch-track::before{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--nc-muted)}
#skillsim .nc-switch-off{position:absolute;right:6px}
#skillsim .nc-switch-on{display:none;position:absolute;left:6px}
#skillsim .nc-switch input:checked+.nc-switch-track{border-color:var(--nc-teal);background:var(--nc-teal-fill);color:var(--nc-teal)}
#skillsim .nc-switch input:checked+.nc-switch-track::before{transform:translateX(28px);background:var(--nc-teal)}
#skillsim .nc-switch input:checked+.nc-switch-track .nc-switch-off{display:none}
#skillsim .nc-switch input:checked+.nc-switch-track .nc-switch-on{display:block}
#skillsim .nc-switch input:focus-visible+.nc-switch-track{outline:2px solid var(--nc-teal);outline-offset:2px}
@media(max-width:540px){#skillsim #nc-buffs .nc-effect-grid,#skillsim #nc-debuffs{grid-template-columns:1fr}}
@media(prefers-reduced-motion:no-preference){#skillsim .nc-switch-track,#skillsim .nc-switch-track::before{transition:background .15s,transform .15s}}
