.shipyard-page-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}

.shipyard-page-title{
  margin:0;
  font-size:42px;
  line-height:1;
  letter-spacing:.4px;
  font-weight:900;
}

.shipyard-page-sub{
  margin-top:10px;
  font-size:15px;
  color:var(--muted);
  line-height:1.5;
}

.shipyard-page-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.shipyard-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(73,102,192,.75);
  background:rgba(16,28,70,.82);
  color:var(--text);
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

.shipyard-chip b{
  color:#fff;
}

.shipyard-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.shipyard-section-title{
  margin:0;
  font-size:24px;
  font-weight:900;
  letter-spacing:.2px;
}

.shipyard-section-sub{
  margin:6px 0 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  max-width:720px;
}

.hangar-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.hangar-group-card{
  background:linear-gradient(180deg, rgba(14,21,52,.90), rgba(10,16,40,.96));
  border:1px solid rgba(44,63,125,.92);
  border-radius:16px;
  padding:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.hangar-group-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:12px;
}

.hangar-group-title{
  font-size:16px;
  font-weight:900;
  color:var(--text);
  padding-top:8px;
}

.hangar-group-meta{
  display:flex;
  align-items:stretch;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.hangar-group-stat{
  min-width:136px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(73,102,192,.58);
  background:rgba(12,20,50,.76);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  text-align:right;
}

.hangar-group-stat-label{
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  line-height:1.2;
}

.hangar-group-stat-value{
  margin-top:6px;
  font-size:22px;
  line-height:1;
  font-weight:900;
  color:var(--text);
}

.hangar-group-total{
  min-width:44px;
  height:44px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(125,211,252,.10);
  border:1px solid rgba(125,211,252,.24);
  color:var(--accent2);
  font-size:14px;
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.hangar-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.hangar-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(37,54,105,.82);
  background:rgba(12,20,50,.72);
}

.hangar-row-name{
  font-size:14px;
  font-weight:800;
  color:var(--text);
  min-width:0;
}

.hangar-row-qty{
  min-width:34px;
  text-align:center;
  font-size:15px;
  font-weight:900;
  color:var(--accent2);
}

.hangar-empty{
  padding:14px 12px;
  border-radius:12px;
  border:1px dashed rgba(73,102,192,.45);
  background:rgba(12,20,50,.38);
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.shipyard-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:16px;
}

.ship-card{
  background:linear-gradient(180deg, rgba(14,21,52,.90), rgba(10,16,40,.96));
  border:1px solid rgba(44,63,125,.92);
  border-radius:18px;
  overflow:hidden;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 10px 28px rgba(0,0,0,.18);
  transition:border-color .15s ease, box-shadow .18s ease, transform .18s ease;
}

.ship-card:hover{
  transform:translateY(-1px);
}

.ship-card-ok{
  border-color:rgba(53,255,90,.34);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(53,255,90,.08),
    0 10px 28px rgba(0,0,0,.18);
}

.ship-card-no_resources{
  border-color:rgba(255,176,32,.46);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(255,176,32,.08),
    0 10px 28px rgba(0,0,0,.18);
}

.ship-card-no_shipyard{
  border-color:rgba(255,107,129,.42);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(255,107,129,.08),
    0 10px 28px rgba(0,0,0,.18);
}

.ship-card-top{
  padding:16px 16px 14px 16px;
  border-bottom:1px solid rgba(34,48,90,.55);
  background:
    radial-gradient(circle at top right, rgba(125,211,252,.10), transparent 38%),
    linear-gradient(180deg, rgba(20,31,74,.58), rgba(11,18,44,.30));
}

.ship-card-title-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
}

.ship-card-title{
  margin:0;
  font-size:21px;
  font-weight:900;
  line-height:1.05;
  color:var(--text);
}

.ship-card-qty{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:92px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(125,211,252,.10);
  border:1px solid rgba(125,211,252,.24);
  color:var(--accent2);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}

.ship-card-meta-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
  min-height:34px;
}

.ship-status-compact{
  display:inline-flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  min-height:34px;
  padding:0;
  border:none;
  background:transparent;
}

.ship-status-compact.is-warning{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  min-height:34px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,176,32,.08);
  border:1px solid rgba(255,176,32,.28);
  box-sizing:border-box;
}

.ship-card-no_shipyard .ship-status-compact.is-warning{
  background:rgba(201,77,103,.08);
  border-color:rgba(255,107,129,.26);
}

.ship-card-state{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  white-space:nowrap;
  border:1px solid rgba(73,102,192,.75);
  background:rgba(16,28,70,.82);
  color:var(--text);
  transition:all .18s ease;
  box-sizing:border-box;
}

.ship-card-state-ok{
  border-color:rgba(53,255,90,.28);
  color:#dfffe7;
  background:rgba(31,121,63,.18);
}

.ship-card-state-no_resources{
  border-color:rgba(255,176,32,.32);
  color:#ffe7ba;
  background:rgba(255,176,32,.12);
}

.ship-card-state-no_shipyard{
  border-color:rgba(255,107,129,.30);
  color:#ffd9e2;
  background:rgba(201,77,103,.12);
}

.ship-status-compact.is-warning .ship-card-state-no_resources,
.ship-status-compact.is-warning .ship-card-state-no_shipyard{
  min-height:24px;
  padding:0;
  border:none;
  background:transparent;
  border-radius:0;
  box-shadow:none;
}

.ship-card-state-detail{
  display:none;
  min-height:24px;
  align-items:center;
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  color:var(--muted);
  white-space:nowrap;
}

.ship-card-state-detail.visible{
  display:inline-flex;
}

.ship-card-no_resources .ship-card-state-detail.visible{
  color:#ffd48c;
}

.ship-card-no_shipyard .ship-card-state-detail.visible{
  color:#ffb7c5;
}

.ship-card-desc{
  margin-top:10px;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.ship-card-body{
  padding:14px 16px 16px 16px;
}

.ship-card-header{
  display:grid;
  grid-template-columns:118px minmax(0,1fr);
  gap:12px;
  align-items:start;
  margin-bottom:14px;
}

.ship-card-thumb-shell{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  min-width:0;
}

.ship-card-thumb{
  width:118px;
  height:118px;
  border-radius:28px;
  padding:6px;
  background:linear-gradient(180deg, rgba(24,38,88,.96), rgba(10,18,46,.98));
  border:1px solid rgba(72,101,196,.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 20px rgba(0,0,0,.18);
  box-sizing:border-box;
}

.ship-card-thumb-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.06);
  background:#09122c;
}

.ship-card-thumb-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  border:1px dashed rgba(125,211,252,.28);
  background:linear-gradient(180deg, rgba(19,31,74,.55), rgba(11,19,47,.72));
  color:var(--accent2);
  font-size:30px;
  font-weight:900;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.ship-facts-panel{
  background:rgba(9,16,42,.56);
  border:1px solid rgba(34,48,90,.82);
  border-radius:16px;
  padding:10px;
  min-width:0;
}

.ship-facts-panel-head{
  margin:0 0 8px 0;
  font-size:11px;
  font-weight:900;
  color:var(--accent2);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ship-facts-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ship-fact-row{
  display:grid;
  grid-template-columns:minmax(120px,1fr) auto;
  gap:10px;
  align-items:center;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(12,20,50,.72);
  border:1px solid rgba(37,54,105,.82);
}

.ship-fact-label{
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:800;
  line-height:1.25;
}

.ship-fact-value{
  font-size:15px;
  font-weight:900;
  color:var(--text);
  text-align:right;
  white-space:nowrap;
}

.ship-cost-box{
  margin-top:2px;
  background:rgba(8,14,36,.58);
  border:1px solid rgba(34,48,90,.72);
  border-radius:14px;
  padding:12px;
}

.ship-cost-title{
  margin:0 0 8px 0;
  font-size:12px;
  color:var(--accent2);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
}

.ship-missing-box{
  margin-top:12px;
  background:rgba(58,39,8,.30);
  border:1px solid rgba(255,176,32,.30);
  border-radius:14px;
  padding:12px;
}

.ship-missing-box[hidden]{
  display:none !important;
}

.ship-missing-title{
  margin:0 0 8px 0;
  font-size:12px;
  color:#ffd48c;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
}

.ship-missing-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ship-missing-row{
  display:grid;
  grid-template-columns:minmax(80px,auto) 1fr;
  gap:10px;
  align-items:center;
}

.ship-missing-label{
  color:#ffe7ba;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

.ship-missing-value{
  color:#fff0d1;
  font-size:12px;
  font-weight:900;
}

.ship-build-form{
  margin-top:14px;
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  gap:10px;
  align-items:start;
}

.ship-build-form input[type="number"]{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}

.ship-build-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

.ship-build-actions .btn{
  width:100%;
  min-height:44px;
}

.ship-build-btn-no_resources:disabled{
  opacity:.86;
  background:linear-gradient(180deg, #8e6322, #664615);
}

.ship-build-btn-no_shipyard:disabled{
  opacity:.86;
  background:linear-gradient(180deg, #7a3447, #5b2434);
}

.shipyard-empty{
  padding:20px;
  border-radius:16px;
  border:1px solid rgba(148,50,71,.85);
  background:linear-gradient(180deg, rgba(58,20,32,.70), rgba(42,15,24,.82));
}

.shipyard-empty-title{
  margin:0 0 6px 0;
  font-size:18px;
  font-weight:900;
  color:#fff;
}

.shipyard-empty-text{
  margin:0;
  color:#ffd9e2;
  font-size:14px;
  line-height:1.5;
}

.bcost-list{
  margin-top:6px;
  display:flex;
  flex-direction:column;
  gap:4px;
  max-width:260px;
}

.bcost-row{
  display:grid;
  grid-template-columns:minmax(78px,auto) 1fr;
  gap:10px;
  align-items:center;
  padding:2px 0;
}

.bcost-label{
  color:var(--muted);
  white-space:nowrap;
}

.bcost-value{
  color:var(--text);
  font-weight:900;
  text-align:left;
  white-space:nowrap;
  transition:color .15s ease;
}

.bcost-value.is-affordable{
  color:#69f08a;
}

.bcost-value.is-missing{
  color:#ff9696;
}

@media (max-width: 900px){
  .shipyard-page-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .hangar-groups{
    grid-template-columns:1fr;
  }

  .hangar-group-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .hangar-group-meta{
    width:100%;
    justify-content:space-between;
  }
}

@media (max-width: 700px){
  .shipyard-page-title{
    font-size:34px;
  }

  .ship-card-header{
    grid-template-columns:1fr;
  }

  .ship-card-thumb-shell{
    justify-content:center;
  }

  .ship-card-thumb{
    width:132px;
    height:132px;
  }
}

@media (max-width: 640px){
  .ship-build-form{
    grid-template-columns:1fr;
  }

  .ship-fact-row{
    grid-template-columns:1fr;
    gap:4px;
  }

  .ship-fact-value{
    text-align:left;
  }

  .ship-missing-row{
    grid-template-columns:1fr;
    gap:4px;
  }

  .bcost-list{
    max-width:none;
  }

  .bcost-row{
    grid-template-columns:minmax(72px,auto) 1fr;
    gap:8px;
  }

  .ship-status-compact{
    align-items:flex-start;
  }

  .ship-status-compact.is-warning{
    flex-wrap:wrap;
    border-radius:16px;
  }

  .ship-card-state-detail{
    white-space:normal;
  }

  .hangar-group-meta{
    flex-direction:column;
    align-items:stretch;
  }

  .hangar-group-stat{
    min-width:0;
    text-align:left;
  }

  .hangar-group-total{
    align-self:flex-start;
  }
}