.builds-page{max-width:1440px;margin:auto;padding-bottom:30px}.builds-tabs{display:flex;gap:4px;border-bottom:1px solid #a9bccb;padding-top:12px}.builds-tabs button{padding:11px 22px;background:linear-gradient(#fbfdfe,#d7e6ee);border:1px solid #9db9cc;border-radius:5px 5px 0 0;color:#315b74;cursor:pointer}.builds-tabs .active{background:#fff;border-bottom-color:#fff;color:#124b76;font-weight:700}.builds-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 0}.builds-team-label{font-size:14px;color:#4b6b80;font-weight:600}.builds-list{display:grid;gap:20px}.builds-unit{display:grid;grid-template-columns:minmax(200px,250px) minmax(0,1fr);gap:16px;padding:17px;border:1px solid #b5cbd8;border-radius:8px;background:linear-gradient(#fff,#f3f8fb);box-shadow:0 2px 7px #17456313}.builds-art{display:grid;gap:9px;align-content:start}.builds-killer-image{height:270px;display:block;object-fit:contain;width:100%;border:1px solid #cbdce5;border-radius:6px;background-color:#f5f8fb;background-image:linear-gradient(45deg,#e5edf3 25%,transparent 25%),linear-gradient(-45deg,#e5edf3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5edf3 75%),linear-gradient(-45deg,transparent 75%,#e5edf3 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.builds-art h3{margin:0;font-size:19px;text-align:center;color:#27516d}.builds-map-label{font-size:12px;font-weight:600;color:#547083}.builds-map-image{width:100%;aspect-ratio:16/9;object-fit:contain;border-radius:5px;background:#e9f2f7}.builds-maps{display:grid;gap:6px}.builds-maps figure{margin:0}.builds-maps figcaption{font-size:12px;text-align:center;color:#506a7d}.builds-right{min-width:0}.builds-template-bar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}.builds-template-bar button{background:#edf5fa;color:#315974;padding:7px 12px;border:1px solid #a7c1d2;border-radius:4px;cursor:pointer;font-size:12px;max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.builds-template-bar button.active{background:#346d97;border-color:#346d97;color:white}.builds-template-bar button:not(.is-saved){border-style:dashed}.builds-unit-actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:12px}.builds-unit-actions strong{font-size:18px;color:#264f6a}.builds-unit-actions button{padding:6px 10px;border:1px solid #9ab7c9;border-radius:4px;background:#f5fafd;color:#315c78;cursor:pointer}.builds-rows{display:grid;gap:11px}.builds-row{display:grid;grid-template-columns:minmax(100px,145px) minmax(0,1fr) minmax(124px,190px);gap:12px;align-items:center;padding:12px;border-radius:5px;border:1px solid #d5e3ed;background:#fff}.builds-row-label{font-weight:600;font-size:13px;color:#466a80}.builds-diamonds{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.builds-diamond{width:67px;height:67px;border:1px solid #91abc0;transform:rotate(45deg) scale(.77);background:#eaf2f8;position:relative;border-radius:7px;display:grid;place-items:center;flex:0 0 67px;color:#6c8ba0}.builds-diamond img{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);object-fit:contain;transform:rotate(-45deg) scale(1.34)}.builds-diamond span{transform:rotate(-45deg);font-size:26px}.builds-diamond.pick{cursor:pointer}.builds-diamond.pick:hover{border-color:#2781b3;background:#d8f1ff}.builds-choice{display:grid;gap:4px}.builds-choice small{font-size:11px;color:#78909c}.builds-choice button{font-size:11px;border:1px solid #a2bdce;border-radius:3px;background:linear-gradient(#fff,#dceaf1);padding:6px 7px;color:#34617c;cursor:pointer}.builds-owner{display:flex;align-items:center;gap:6px;font-size:12px;color:#385d77}.builds-owner img{width:24px;height:24px;border-radius:3px}.builds-placeholder{padding:30px;border:1px dashed #adc6d5;border-radius:5px;text-align:center;color:#728f9e;background:#f7fbfd}.builds-overlay{position:fixed;z-index:91000;inset:0;background:#071b2bc4;display:grid;place-items:center;padding:16px}.builds-overlay[hidden]{display:none}.builds-dialog,.builds-picker-dialog{display:flex;flex-direction:column;width:min(1120px,98vw);max-height:94vh;background:#fff;border:1px solid #79a2bd;border-radius:8px;overflow:hidden;box-shadow:0 25px 65px #0008}.builds-picker-dialog{width:min(760px,97vw)}.builds-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 15px;background:linear-gradient(#eefaff,#abd2e7);border-bottom:1px solid #94b9ce;color:#295570}.builds-dialog-head button{cursor:pointer;border:1px solid #a38181;border-radius:3px;background:linear-gradient(#fff,#ecd1cb);font-size:18px;width:34px}.builds-dialog-body{padding:18px;overflow:auto;flex:1;min-height:0}.builds-fields{display:flex;gap:12px;flex-wrap:wrap}.builds-fields label{display:grid;gap:4px;min-width:190px;color:#527084;font-size:12px}.builds-fields label span{font-weight:700}.builds-fields select,.builds-fields input,#build-perk-search{height:36px;padding:5px 9px;background:white;color:#2b4d65;border:1px solid #9bb8c9;border-radius:4px;font-size:14px}.builds-title-field{flex:1}.builds-draft-note{margin:12px 0;color:#768e9e;font-size:12px}.build-preview{display:grid;gap:15px}.build-preview>.builds-unit{box-shadow:none}.builds-dialog-actions{display:flex;gap:10px;justify-content:flex-end;padding:12px 16px;border-top:1px solid #c8d9e4;background:#eef5f9}.builds-error{color:#b33333;font-size:13px}.builds-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px;margin-top:13px}.builds-perk-choice{cursor:pointer;border:1px solid #b4cedd;border-radius:5px;background:#f3f8fb;color:#365b73;min-width:0;padding:10px;display:grid;gap:8px;justify-items:center;text-align:center;font-size:12px}.builds-perk-choice:hover{background:#e4f4ff}.builds-perk-choice[disabled]{opacity:.34;cursor:not-allowed}.builds-perk-choice img{height:86px;width:86px;object-fit:contain}.builds-perk-choice span{overflow-wrap:anywhere}#builds-status:empty{display:none}@media(max-width:850px){.builds-unit{grid-template-columns:1fr}.builds-art{grid-template-columns:130px 1fr;align-items:start}.builds-art h3{grid-column:1/-1}.builds-killer-image{height:170px}.builds-row{grid-template-columns:1fr}.builds-diamonds{gap:3px}.builds-diamond{flex-basis:54px;width:54px;height:54px}.builds-choice{display:flex;align-items:center}.builds-fields label{flex:1}.builds-map-image{max-width:180px}}

/* v0.6.7 — official purple diamond background, for filled and empty perk slots */
.builds-diamond{transform:none;width:77px;height:77px;flex:0 0 77px;border:0;border-radius:0;background:transparent;box-shadow:none;isolation:isolate;padding:0;overflow:visible;display:flex;align-items:center;justify-content:center}
.builds-diamond.pick:hover,.builds-diamond.pick:focus-visible{background:transparent;filter:drop-shadow(0 0 6px #8650f3)}
.builds-diamond img.builds-perk-background{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none;pointer-events:none;z-index:-1}
.builds-diamond img.builds-perk-symbol{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none;pointer-events:none}
.builds-diamond .builds-empty-slot-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:27px;line-height:1;color:#eee3ff;text-shadow:0 1px 4px #11051a;transform:none;z-index:1;text-align:center}
.builds-perk-choice{align-content:start}
.builds-choice-icon{display:block;width:96px;height:96px;position:relative}
.builds-perk-choice .builds-choice-icon img{position:absolute;object-fit:contain;pointer-events:none}
.builds-perk-choice .builds-choice-icon .builds-choice-background{inset:0;width:100%;height:100%}
.builds-perk-choice .builds-choice-icon .builds-choice-symbol{inset:0;width:100%;height:100%;transform:none}
.builds-search-wrap{position:relative;display:flex;align-items:center;flex:1;min-width:190px;max-width:370px;margin-left:auto}
.builds-search-wrap .builds-search-icon{position:absolute;left:10px;font-size:20px;color:#6b8ba1;pointer-events:none}
#builds-search{width:100%;height:36px;padding:7px 12px 7px 34px;background:#fff;border:1px solid #a5bece;border-radius:5px;color:#264c66;font:13px 'Segoe UI',Arial,sans-serif}
#builds-search:focus{outline:2px solid #80b5d4;outline-offset:1px}
@media(max-width:640px){.builds-actions{flex-wrap:wrap}.builds-search-wrap{order:3;flex-basis:100%;max-width:none}.builds-diamonds{gap:3px}.builds-diamond{width:62px;height:62px;flex-basis:62px}}
.builds-diamond img.builds-perk-background{z-index:0}
.builds-diamond img.builds-perk-symbol{z-index:1}

/* v0.6.8 — align perk slot plus exactly to the center and use larger perk symbols like in Balance */
.builds-choice-icon{display:grid;place-items:center}

/* v0.6.9 — same full-sprite alignment as Balance, no font-metric offset in slot controls. */
.builds-diamond .builds-empty-slot-label {
  position:absolute;inset:0;display:block;padding:0;margin:0;
  font-size:0;line-height:0;transform:none;pointer-events:none;
}
.builds-diamond .builds-empty-slot-label::before,
.builds-diamond .builds-empty-slot-label::after {
  content:"";position:absolute;left:50%;top:50%;
  width:15px;height:2px;border-radius:2px;background:#f1eaff;
  transform:translate(-50%,-50%);
  box-shadow:0 1px 3px #160522a8;
}
.builds-diamond .builds-empty-slot-label::after {width:2px;height:15px}
.builds-perk-choice.builds-clear-slot {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;min-height:121px;text-align:center;
}
.builds-clear-slot .builds-clear-icon {position:relative;display:block;width:26px;height:26px;flex:none}
.builds-clear-slot .builds-clear-icon::before,
.builds-clear-slot .builds-clear-icon::after {
  content:"";position:absolute;top:50%;left:50%;
  width:19px;height:2px;border-radius:2px;background:#315b74;
  transform:translate(-50%,-50%) rotate(45deg);
}
.builds-clear-slot .builds-clear-icon::after {transform:translate(-50%,-50%) rotate(-45deg)}
.builds-clear-slot .builds-clear-label {display:block;width:100%;font-size:12px;line-height:1.3}