.structures-app{
  display:flex;
  flex-direction:column;
  gap:1.2rem;
}
.structures-hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
}
.structures-actions{
  display:flex;
  flex-wrap:wrap;
  gap:0.6rem;
  justify-content:flex-end;
}
.structures-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.structures-tools{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem;
}
.tool-btn{
  width:38px;
  height:38px;
  border-radius:10px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
  cursor:pointer;
  transition:all 0.2s ease;
}
.tool-btn[data-tooltip]{
  position:relative;
}
.tool-btn[data-tooltip]::after{
  content:attr(data-tooltip);
  position:absolute;
  bottom:120%;
  left:50%;
  transform:translateX(-50%);
  background:rgba(27, 26, 31, 0.9);
  color:#fff;
  padding:0.35rem 0.6rem;
  border-radius:8px;
  font-size:0.75rem;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity 0.2s ease;
}
.tool-btn[data-tooltip]:hover::after{
  opacity:1;
}
.tool-btn.active{
  background:var(--accent);
  color:#fff;
  border-color:transparent;
}
.structures-toolbar-right{
  display:flex;
  align-items:center;
  gap:0.8rem;
  flex-wrap:wrap;
}
.structures-select{
  display:flex;
  flex-direction:column;
  gap:0.35rem;
  font-size:0.85rem;
  color:var(--muted);
}
.structures-select select{
  padding:0.5rem 0.6rem;
  border-radius:10px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
}
.structures-main{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 340px;
  gap:1.2rem;
}
.structures-canvas{
  position:relative;
  padding:1rem;
  min-height:520px;
}
.structures-canvas-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:0.8rem;
  font-size:0.85rem;
  color:var(--muted);
  margin-bottom:0.6rem;
}
.structures-canvas-toolbar label{
  display:flex;
  align-items:center;
  gap:0.35rem;
}
.structures-canvas-toolbar input[type="text"]{
  width:64px;
  padding:0.35rem 0.45rem;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
}
#structures-canvas{
  width:100%;
  height:600px;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--panel);
  display:block;
}
.structures-summary{
  margin-top:0.8rem;
  padding:0.7rem 0.8rem;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
  font-size:0.9rem;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  min-height:2.4rem;
}
.structures-summary .summary-item{
  display:flex;
  flex-direction:column;
  gap:0.2rem;
}
.structures-summary .summary-label{
  color:var(--muted);
  font-size:0.75rem;
}
.structures-hud{
  margin-top:0.8rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.8rem;
  flex-wrap:wrap;
  font-size:0.85rem;
  color:var(--muted);
}
.structures-hud label{
  display:flex;
  align-items:center;
  gap:0.35rem;
}
.structures-range input[type="range"]{
  width:160px;
}
.structures-status{
  font-weight:600;
}
.structures-panel{
  display:flex;
  flex-direction:column;
  gap:0.9rem;
  min-height:520px;
}
.structures-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem;
}
.tab-btn{
  border:1px solid var(--border);
  background:var(--panel);
  padding:0.45rem 0.7rem;
  border-radius:999px;
  font-size:0.85rem;
  cursor:pointer;
  transition:all 0.2s ease;
}
.tab-btn.active{
  background:var(--accent-2);
  color:#fff;
  border-color:transparent;
}
.structures-panel-body{
  display:none;
  gap:0.8rem;
}
.structures-panel-body.active{
  display:flex;
  flex-direction:column;
}
.structures-case-row,
.structures-combo-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.6rem;
}
.structures-case-row label,
.structures-combo-row label{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:0.35rem;
  color:var(--muted);
  font-size:0.85rem;
}
.structures-case-row select,
.structures-combo-row select{
  padding:0.45rem 0.6rem;
  border-radius:10px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
}
.structures-presets{
  display:flex;
  flex-direction:column;
  gap:0.6rem;
}
.structures-table{
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  background:var(--panel);
}
.structures-table table{
  width:100%;
  border-collapse:collapse;
  font-size:0.85rem;
}
.structures-table th,
.structures-table td{
  padding:0.4rem 0.5rem;
  border-bottom:1px solid var(--border);
  text-align:left;
}
.structures-inline{
  display:flex;
  gap:0.6rem;
  align-items:center;
  flex-wrap:wrap;
}
.structures-inline input,
.structures-inline select{
  padding:0.4rem 0.5rem;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
}
.structures-property-group{
  border:1px solid var(--border);
  border-radius:12px;
  padding:0.8rem;
  display:flex;
  flex-direction:column;
  gap:0.6rem;
}
.structures-property-group h4{
  margin:0;
  color:var(--accent-2);
}
.structures-property-group label{
  font-size:0.85rem;
  color:var(--muted);
  display:flex;
  flex-direction:column;
  gap:0.35rem;
}
.structures-property-group input,
.structures-property-group select{
  padding:0.45rem 0.6rem;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--panel);
  color:var(--text);
}

@media (max-width: 980px){
  .structures-main{grid-template-columns:1fr}
  .structures-panel{order:2}
}
@media (max-width: 700px){
  .structures-hero{flex-direction:column}
  #structures-canvas{height:420px}
}
