/* Интерактивный конструктор пустотных кораблей */
.ship-builder-page { box-sizing: border-box; width: auto; max-width: none; }
.builder-heading { margin-bottom: 1.25rem; }
.builder-heading h1 { margin: .2rem 0 .45rem; }
.builder-heading > p:last-child { max-width: 86ch; text-align: justify; text-justify: inter-word; }
.builder-kicker { margin: 0; color: var(--link-color); font-size: .78rem; font-weight: bold; letter-spacing: .14em; text-transform: uppercase; }

.builder-page-nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .55rem; margin: 0 0 1.5rem; }
.builder-page-nav a { display: grid; place-items: center; min-height: 2.8rem; padding: .45rem .6rem; border: 1px solid var(--border-color); text-align: center; text-decoration: none; }
.builder-page-nav a:hover, .builder-page-nav a:focus-visible, .builder-page-nav .is-current { background: var(--link-color); color: var(--bg-color); }

.builder-project, .builder-summary, .builder-catalog, .builder-loadout, .builder-notes { box-sizing: border-box; padding: 1rem; border: 1px solid var(--border-color); background: var(--table-row-alt); }
.builder-project, .builder-summary { margin-bottom: 1rem; }
.builder-project h2, .builder-summary h2, .builder-catalog h2, .builder-loadout h2, .builder-notes h2 { margin: 0 0 .85rem; font-size: 1.2rem; }
.builder-project-grid { display: grid; grid-template-columns: minmax(12rem, 1.2fr) minmax(11rem, 1fr) minmax(14rem, 1.4fr) minmax(10rem, .8fr) minmax(12rem, 1fr); gap: .7rem; }
.builder-project-grid label, .builder-filter-grid label, .builder-adjustment-grid label { display: grid; gap: .3rem; min-width: 0; color: var(--link-color); font-size: .88rem; font-weight: bold; }
.builder-project input, .builder-project select, .builder-catalog input, .builder-catalog select, .builder-adjustments input, .builder-mount-select { box-sizing: border-box; width: 100%; min-height: 2.5rem; padding: .42rem .55rem; border: 1px solid var(--border-color); border-radius: 0; background: var(--bg-color); color: var(--text-color); font: inherit; }
.builder-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: .8rem; }
.builder-actions button, .builder-add, .builder-remove { min-height: 2.35rem; padding: .4rem .75rem; border: 1px solid var(--border-color); border-radius: 0; background: var(--bg-color); color: var(--link-color); font: inherit; cursor: pointer; }
.builder-actions button:hover, .builder-actions button:focus-visible, .builder-add:hover, .builder-add:focus-visible, .builder-remove:hover, .builder-remove:focus-visible { background: var(--link-color); color: var(--bg-color); }
.builder-actions button:disabled, .builder-add:disabled { opacity: .45; cursor: not-allowed; }
.builder-status { min-height: 1.3em; margin: .65rem 0 0; color: var(--link-color); }

.builder-hull-profile { margin-bottom: .8rem; }
.builder-hull-profile p { margin: .35rem 0; }
.builder-hull-stats { display: flex; flex-wrap: wrap; gap: .35rem .9rem; margin: 0; padding: 0; list-style: none; }
.builder-hull-stats strong { color: var(--link-color); }
.builder-resource-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; }
.builder-resource-grid article { min-width: 0; padding: .75rem; border: 1px solid var(--border-color); background: var(--bg-color); }
.builder-resource-grid span, .builder-resource-grid small { display: block; }
.builder-resource-grid strong { display: block; margin: .18rem 0; color: var(--link-color); font-size: 1.35rem; }
.builder-resource-grid small { min-height: 2.4em; }
.builder-resource-grid article.is-danger strong { color: var(--warning-color, #e44); }
.builder-adjustments { margin-top: .8rem; border: 1px solid var(--border-color); background: var(--bg-color); }
.builder-adjustments > summary { padding: .55rem .7rem; color: var(--link-color); cursor: pointer; }
.builder-adjustment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; padding: 0 .7rem .7rem; }
.builder-warnings { margin-top: .8rem; }
.builder-warnings ul { margin: 0; padding-left: 1.4rem; }
.builder-warnings li { margin: .3rem 0; }
.builder-warnings .builder-valid { margin: 0; color: var(--link-color); }

.builder-workspace { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(22rem, .75fr); gap: 1rem; align-items: start; }
.builder-catalog, .builder-loadout { min-width: 0; }
.builder-loadout { position: sticky; top: .7rem; }
.builder-filter-grid { display: flex; flex-wrap: wrap; gap: .65rem; align-items: end; }
.builder-filter-grid label { flex: 1 1 11rem; }
.builder-filter-grid .builder-search { flex-basis: 17rem; }
.builder-filter-grid .builder-compatible { display: flex; flex: 0 1 auto; flex-direction: row; gap: .45rem; align-items: center; min-height: 2.5rem; }
.builder-compatible input { width: auto; min-height: 0; accent-color: var(--link-color); }
.builder-catalog-count { margin: .75rem 0 .45rem; }
.builder-catalog-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.builder-node-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .45rem .7rem; padding: .7rem; border: 1px solid var(--border-color); background: var(--bg-color); }
.builder-node-card.is-incompatible { opacity: .62; }
.builder-node-card h3 { margin: 0; font-size: 1rem; }
.builder-node-card h3 a { text-decoration: none; }
.builder-node-meta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .2rem .65rem; margin: 0; font-size: .82rem; }
.builder-node-meta strong { color: var(--link-color); }
.builder-node-hull { grid-column: 1 / -1; margin: 0; font-size: .78rem; opacity: .82; }
.builder-card-actions, .builder-selected-actions { grid-column: 2; grid-row: 1; display: flex; flex-wrap: wrap; justify-content: end; gap: .35rem; align-items: start; }
.builder-add { min-height: 2rem; padding: .25rem .6rem; }
.builder-info { display: grid; place-items: center; min-height: 2rem; padding: .25rem .55rem; border: 1px solid var(--border-color); border-radius: 0; background: var(--bg-color); color: var(--link-color); font: inherit; font-weight: bold; cursor: help; }
.builder-info:hover, .builder-info:focus-visible { background: var(--link-color); color: var(--bg-color); }
.builder-tooltip { position: absolute; z-index: 20; top: 2.55rem; display: none; box-sizing: border-box; width: min(34rem, calc(100vw - 4rem)); max-height: 22rem; overflow-y: auto; padding: .75rem .85rem; border: 1px solid var(--border-color); background: var(--spoiler-content-bg, var(--bg-color)); color: var(--text-color); box-shadow: 0 .45rem 1rem rgb(0 0 0 / .35); font-size: .82rem; line-height: 1.45; text-align: left; }
.builder-card-actions .builder-tooltip { left: .7rem; }
.builder-selected-actions .builder-tooltip { right: .55rem; }
.builder-info:hover + .builder-tooltip, .builder-info:focus-visible + .builder-tooltip, .builder-tooltip:hover { display: block; }
.builder-tooltip p { margin: 0 0 .55rem; text-align: justify; text-justify: inter-word; }
.builder-tooltip p:last-child { margin-bottom: 0; }

.builder-required { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; margin-bottom: .8rem; }
.builder-required span { padding: .32rem .45rem; border: 1px solid var(--border-color); font-size: .78rem; }
.builder-required .is-complete { color: var(--link-color); }
.builder-selected { display: grid; gap: .55rem; }
.builder-selected-group h3 { margin: .75rem 0 .4rem; font-size: 1rem; }
.builder-selected-item { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .55rem; padding: .55rem; border: 1px solid var(--border-color); background: var(--bg-color); }
.builder-selected-item p { margin: 0; }
.builder-selected-name { font-weight: bold; }
.builder-selected-meta { font-size: .78rem; opacity: .85; }
.builder-mount-select { grid-column: 1 / -1; min-height: 2.2rem; font-size: .85rem; }
.builder-remove { min-height: 2rem; padding: .25rem .55rem; }
.builder-empty { margin: .6rem 0 0; }
.builder-notes { margin-top: 1rem; }
.builder-notes p { max-width: 110ch; text-align: justify; text-justify: inter-word; }
.builder-error { padding: 1rem; border: 1px solid var(--border-color); color: var(--link-color); }

@media (max-width: 1100px) {
    .builder-page-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .builder-project-grid, .builder-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .builder-workspace { grid-template-columns: 1fr; }
    .builder-loadout { position: static; }
}

@media (max-width: 680px) {
    .builder-page-nav, .builder-project-grid, .builder-resource-grid, .builder-adjustment-grid, .builder-catalog-list, .builder-required { grid-template-columns: 1fr; }
    .builder-project, .builder-summary, .builder-catalog, .builder-loadout, .builder-notes { padding: .75rem; }
    .builder-actions button { flex: 1 1 8rem; }
}
