/* Painel Spray — visual alinhado ao restante da UI moderna */
.spray-tools{
  width:196px!important;gap:10px!important;padding:14px 12px 12px!important;
  border:1px solid #ffffff14!important;border-radius:18px!important;
  background:linear-gradient(165deg,#121413f5,#0a0b0cfa)!important;
  box-shadow:0 18px 48px #00000080,inset 0 1px #ffffff0c!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:#f3f1ea!important;font-size:12px!important
}
.spray-tools[hidden]{display:none!important}

.spray-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:2px}
.spray-head b{
  display:flex;align-items:center;gap:8px;font-size:14px!important;font-weight:800!important;letter-spacing:.04em
}
.spray-head b:before{
  content:"";width:28px;height:28px;border-radius:9px;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ecd680' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='8' width='8' height='13' rx='2'/%3E%3Cpath d='M9 8V5.5h4V8M11 3.5h1.5M17.5 6l2-1M17.5 9h2.5M17.5 12l2 1'/%3E%3C/svg%3E") center/16px no-repeat,#ecd68012;
  box-shadow:inset 0 0 0 1px #ecd68033
}
.spray-close{
  width:30px!important;height:30px!important;border:1px solid #ffffff14!important;border-radius:10px!important;
  background:#ffffff08!important;color:#c8cac5!important;transition:background .15s,color .15s,border-color .15s
}
.spray-close:hover{background:#ffffff14!important;color:#fff!important;border-color:#ffffff28!important}

.spray-mode{
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;padding:4px!important;
  border-radius:12px;background:#ffffff06;box-shadow:inset 0 0 0 1px #ffffff0a
}
.spray-mode button{
  min-height:38px!important;padding:8px 6px!important;border:1px solid transparent!important;border-radius:10px!important;
  background:transparent!important;color:#d5d7d3!important;font-weight:600!important;transition:background .15s,border-color .15s,color .15s
}
.spray-mode button[aria-pressed=true]{
  background:linear-gradient(160deg,#ecd680,#d4b84a)!important;color:#141413!important;border-color:#ecd68066!important;
  box-shadow:0 4px 14px #ecd68033!important;font-weight:800!important
}
.spray-mode kbd{font-size:9px;padding:1px 4px;border-radius:4px;background:#00000033;opacity:.85}

.spray-colours{
  gap:7px!important;padding:6px!important;border-radius:12px;background:#ffffff05;box-shadow:inset 0 0 0 1px #ffffff0a
}
.spray-colours button{
  border:2px solid #ffffff26!important;box-shadow:0 2px 6px #00000044;transition:transform .12s,border-color .12s,box-shadow .12s
}
.spray-colours button:hover{transform:scale(1.06)}
.spray-colours button[aria-pressed=true]{
  border-color:#fff!important;box-shadow:0 0 0 2px #0009,0 0 12px var(--c)!important;transform:scale(1.08)
}

.spray-custom-colour{
  font-size:11px!important;color:#a8aaa6!important;padding:2px 4px
}
.spray-custom-colour input{
  width:52px!important;height:34px!important;border-radius:10px!important;border:1px solid #ffffff22!important;
  background:#ffffff08!important
}

.spray-sizes{gap:6px!important}
.spray-sizes button{
  height:34px!important;border-radius:10px!important;border:1px solid #ffffff18!important;background:#ffffff08!important
}
.spray-sizes button[aria-pressed=true]{
  border-color:#ecd68099!important;background:#ecd68018!important;box-shadow:inset 0 0 0 1px #ecd68044
}
.spray-sizes button i{background:linear-gradient(180deg,#fff,#d8d9d4)!important}

.spray-numbers button{
  border-radius:10px!important;border:1px solid #ffffff18!important;background:#ffffff08!important;font-weight:600!important
}
.spray-numbers button[aria-pressed=true]{
  background:linear-gradient(160deg,#ecd680,#d4b84a)!important;color:#121413!important;border-color:#ecd68066!important
}

.spray-gauge{
  height:10px!important;border-radius:999px!important;background:#ffffff12!important;overflow:hidden;
  box-shadow:inset 0 1px 2px #0006
}
.spray-gauge i{
  border-radius:999px!important;
  background:linear-gradient(90deg,#ecd680,#6ecf5a,#4db8e8)!important
}
.spray-tools.refilling .spray-gauge i,
.spray-tools.dry .spray-gauge i{
  background:repeating-linear-gradient(45deg,#9a9a9a 0 5px,#737373 5px 10px)!important
}

.spray-info{gap:4px!important}
.spray-status{margin:0!important;min-height:1.35em!important;line-height:1.35!important;color:#b8bab5!important;font-size:11px!important}
.spray-status:not(:empty){color:#f0c4bc!important;font-weight:600!important}
.spray-tinta{margin:0!important;font-size:10.5px!important;line-height:1.3!important;color:#8f918d!important}

.spray-report{
  font-size:11px!important;padding:8px 10px!important;border-radius:10px!important;
  border:1px solid #ffffff18!important;background:#ffffff06!important;color:#b0b2ae!important;
  transition:background .15s,border-color .15s,color .15s
}
.spray-report:hover{background:#ffffff0e!important;border-color:#ffffff28!important;color:#e8e6df!important}

.spray-buy{
  border-radius:10px!important;border:1px solid #ecd68055!important;
  background:linear-gradient(160deg,#ecd68014,#ffffff05)!important;padding:8px!important
}
.spray-buy b{color:#ecd680!important}

.spray-login{gap:10px!important}
.spray-enter{
  border-radius:10px!important;background:linear-gradient(160deg,#ecd680,#d4b84a)!important;
  font-weight:800!important;box-shadow:0 6px 18px #ecd68033!important
}

.spray-button .spray-ink{
  height:4px!important;border-radius:999px!important;
  background:linear-gradient(90deg,#ecd680 var(--ink,100%),#ffffff18 var(--ink,100%))!important
}

@media (pointer:coarse),(max-width:760px){
  .spray-tools{width:min(92vw,220px)!important;top:64px!important}
  .spray-colours{grid-template-columns:repeat(6,1fr)!important}
}