/* MiKO Writer Support v2 — clarity + responsive polish */
.miko-writer-support,
.miko-writer-support *{box-sizing:border-box!important}

.miko-writer-support{
  overflow:hidden!important;
  border:1px solid #ff6b8c!important;
  border-radius:20px!important;
  background:linear-gradient(145deg,#fff 0%,#fff8fb 58%,#fff3f7 100%)!important;
  box-shadow:0 16px 42px rgba(222,31,78,.09)!important;
}

.miko-writer-support .mws-head{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin:0 0 18px!important;
}
.miko-writer-support .mws-head>div:last-child{min-width:0!important}
.miko-writer-support .mws-head-icon{
  width:54px!important;height:54px!important;flex:0 0 54px!important;
  display:grid!important;place-items:center!important;
  border-radius:50%!important;
  background:linear-gradient(145deg,#ff2c61,#f50045)!important;
  color:#fff!important;font-size:25px!important;line-height:1!important;
  box-shadow:0 9px 22px rgba(245,0,69,.23)!important;
}
.miko-writer-support .mws-head h2{
  display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;
  margin:0!important;color:#143866!important;font-size:21px!important;line-height:1.25!important;font-weight:950!important;
}
.miko-writer-support .mws-head p{
  margin:5px 0 0!important;color:#647b97!important;font-size:12px!important;line-height:1.55!important;
}
.miko-writer-support .mws-info{
  width:22px!important;height:22px!important;display:inline-grid!important;place-items:center!important;
  padding:0!important;border:1px solid #9ab0c8!important;border-radius:50%!important;
  background:#fff!important;color:#345d88!important;font-size:12px!important;font-weight:950!important;line-height:1!important;
  box-shadow:0 3px 8px rgba(22,61,102,.06)!important;
}

/* Author */
.miko-writer-support .mws-author{
  min-width:0!important;padding:8px!important;
  border-radius:14px!important;
}
.miko-writer-support .mws-author-main{
  display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important;
}
.miko-writer-support .mws-author-main>div{min-width:0!important}
.miko-writer-support .mws-author-avatar{
  width:72px!important;height:72px!important;flex:0 0 72px!important;
  border:3px solid #fff!important;border-radius:50%!important;object-fit:cover!important;
  box-shadow:0 0 0 2px #ffb3c4,0 8px 20px rgba(25,67,110,.12)!important;
}
.miko-writer-support .mws-author-main strong{
  display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important;
  margin:0!important;color:#14365f!important;font-size:14px!important;line-height:1.35!important;font-weight:950!important;
}
.miko-writer-support .mws-author-main span{
  display:block!important;margin-top:4px!important;color:#6e84a0!important;font-size:11px!important;font-weight:750!important;
}
.miko-writer-support .mws-author blockquote{
  position:relative!important;margin:15px 0 0!important;padding:12px 12px 12px 32px!important;
  border:1px solid #f1dbe2!important;border-radius:12px!important;background:#fff!important;
  color:#526b86!important;font-size:10.5px!important;line-height:1.65!important;font-style:normal!important;
}
.miko-writer-support .mws-author blockquote:before{
  content:"“"!important;position:absolute!important;left:10px!important;top:2px!important;
  color:#ff315d!important;font:900 28px/1 Georgia,serif!important;
}

/* Point buttons */
.miko-writer-support .mws-control{min-width:0!important}
.miko-writer-support .mws-presets{
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;
}
.miko-writer-support .mws-presets button{
  position:relative!important;isolation:isolate!important;
  min-width:0!important;height:48px!important;padding:0 7px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
  border:1px solid #cfddea!important;border-radius:10px!important;
  background:#fff!important;color:#173e6d!important;
  -webkit-text-fill-color:#173e6d!important;
  font-family:inherit!important;font-size:16px!important;line-height:1!important;font-weight:950!important;
  letter-spacing:0!important;text-shadow:none!important;
  box-shadow:0 5px 13px rgba(21,66,109,.06)!important;
  opacity:1!important;visibility:visible!important;
  cursor:pointer!important;transition:.16s ease!important;
}
.miko-writer-support .mws-presets button:before{
  content:"◆"!important;display:inline-block!important;color:#ff3a68!important;
  font-size:9px!important;line-height:1!important;opacity:.9!important;
}
.miko-writer-support .mws-presets .mws-custom-toggle{
  font-size:12px!important;white-space:nowrap!important;
}
.miko-writer-support .mws-presets .mws-custom-toggle:before{content:"✦"!important;font-size:13px!important}
.miko-writer-support .mws-presets button:hover:not(:disabled){
  border-color:#ff7896!important;background:#fff8fa!important;color:#d9184d!important;
  -webkit-text-fill-color:#d9184d!important;transform:translateY(-1px)!important;
}
.miko-writer-support .mws-presets button.is-active{
  border-color:#f60047!important;
  background:linear-gradient(145deg,#ff2a61,#f50046)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  box-shadow:0 9px 20px rgba(245,0,70,.22)!important;
}
.miko-writer-support .mws-presets button.is-active:before{color:#fff!important}
.miko-writer-support .mws-presets button:disabled{
  opacity:.48!important;cursor:not-allowed!important;
  background:#f2f5f9!important;color:#6f8195!important;-webkit-text-fill-color:#6f8195!important;
}
.miko-writer-support .mws-presets button:focus-visible{
  outline:3px solid rgba(255,40,91,.18)!important;outline-offset:2px!important;
}

.miko-writer-support .mws-custom-field{
  margin-top:9px!important;padding:10px!important;border:1px solid #dce6ef!important;border-radius:10px!important;background:#fff!important;
}
.miko-writer-support .mws-custom-field label{
  display:grid!important;gap:7px!important;color:#47627f!important;font-size:11px!important;font-weight:850!important;
}
.miko-writer-support .mws-custom-field input{
  width:100%!important;height:44px!important;padding:0 12px!important;
  border:1px solid #cfddea!important;border-radius:9px!important;background:#fff!important;
  color:#123e70!important;-webkit-text-fill-color:#123e70!important;
  font-size:16px!important;font-weight:900!important;outline:none!important;
}

.miko-writer-support .mws-control textarea{
  width:100%!important;min-height:78px!important;margin:10px 0 0!important;padding:12px 13px!important;
  border:1px solid #cfddea!important;border-radius:10px!important;background:#fff!important;
  color:#1d466f!important;-webkit-text-fill-color:#1d466f!important;
  font-family:inherit!important;font-size:14px!important;line-height:1.5!important;
  resize:vertical!important;box-shadow:none!important;outline:none!important;
}
.miko-writer-support .mws-control textarea::placeholder{
  color:#72869c!important;-webkit-text-fill-color:#72869c!important;opacity:1!important;
}
.miko-writer-support .mws-message-count{
  margin-top:3px!important;text-align:right!important;color:#8093aa!important;font-size:10px!important;font-weight:750!important;
}
.miko-writer-support .mws-anonymous{
  display:flex!important;align-items:center!important;gap:9px!important;
  min-height:34px!important;margin:2px 0 8px!important;padding:4px 2px!important;
  color:#395b7d!important;font-size:11px!important;font-weight:850!important;cursor:pointer!important;
}
.miko-writer-support .mws-anonymous input{
  width:21px!important;height:21px!important;flex:0 0 21px!important;margin:0!important;
  accent-color:#ff1554!important;
}
.miko-writer-support .mws-anonymous span:before{
  content:"◉"!important;margin-right:6px!important;color:#ff2e60!important;font-size:10px!important;
}
.miko-writer-support .mws-status{
  min-height:18px!important;margin:3px 0 7px!important;color:#c9284e!important;font-size:10px!important;font-weight:800!important;
}
.miko-writer-support .mws-status.is-success{color:#078d56!important}

/* Primary tip button */
.miko-writer-support .mws-submit{
  width:100%!important;min-height:52px!important;height:auto!important;padding:10px 16px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;
  border:0!important;border-radius:11px!important;
  background:linear-gradient(90deg,#ff1d55,#f20043)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  font-family:inherit!important;font-size:15px!important;line-height:1.2!important;font-weight:900!important;
  box-shadow:0 10px 21px rgba(242,0,67,.22)!important;text-shadow:none!important;cursor:pointer!important;
}
.miko-writer-support .mws-submit>span{
  display:inline-grid!important;place-items:center!important;width:25px!important;height:25px!important;
  border-radius:8px!important;background:rgba(255,255,255,.15)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:16px!important;
}
.miko-writer-support .mws-submit b{
  color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:17px!important;font-weight:950!important;
}
.miko-writer-support .mws-submit:disabled{
  opacity:.5!important;filter:grayscale(.15)!important;cursor:not-allowed!important;
}

/* Balance */
.miko-writer-support .mws-balance{
  display:flex!important;flex-direction:column!important;justify-content:center!important;gap:10px!important;
  min-width:0!important;padding:14px!important;border:1px solid #ffc9d6!important;border-radius:14px!important;
  background:linear-gradient(150deg,#fff,#fff2f6)!important;
}
.miko-writer-support .mws-balance>div{
  display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;align-items:center!important;gap:9px!important;min-width:0!important;
}
.miko-writer-support .mws-balance .coin,
.miko-writer-support .mws-balance .clock{
  width:34px!important;height:34px!important;display:grid!important;place-items:center!important;
  border-radius:50%!important;font-size:12px!important;font-weight:950!important;
}
.miko-writer-support .mws-balance .coin{
  background:linear-gradient(145deg,#ffb73d,#ff9c16)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;
}
.miko-writer-support .mws-balance .clock{
  background:#eaf4ff!important;color:#3b6d9f!important;-webkit-text-fill-color:#3b6d9f!important;
}
.miko-writer-support .mws-balance p{
  min-width:0!important;margin:0!important;color:#60758f!important;font-size:10px!important;line-height:1.4!important;
}
.miko-writer-support .mws-balance strong{
  display:block!important;margin-top:3px!important;color:#123963!important;-webkit-text-fill-color:#123963!important;
  font-size:17px!important;line-height:1.2!important;font-weight:950!important;white-space:normal!important;
}
.miko-writer-support .mws-balance hr{
  width:100%!important;margin:2px 0!important;border:0!important;border-top:1px solid #f0d5dc!important;
}

/* Footer/supporters */
.miko-writer-support .mws-footer{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;
  margin-top:18px!important;padding-top:15px!important;border-top:1px solid #efd9e0!important;min-width:0!important;
}
.miko-writer-support .mws-recent{
  display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;
}
.miko-writer-support .mws-recent>strong{
  display:inline-flex!important;align-items:center!important;gap:6px!important;
  color:#294b6d!important;font-size:11px!important;font-weight:900!important;white-space:nowrap!important;
}
.miko-writer-support .mws-recent>strong:before{
  content:"♥"!important;width:22px!important;height:22px!important;display:grid!important;place-items:center!important;
  border-radius:50%!important;background:#ffe6ed!important;color:#ff2d5d!important;font-size:11px!important;
}
.miko-writer-support .mws-avatars{
  display:flex!important;align-items:center!important;min-width:0!important;padding-left:5px!important;
}
.miko-writer-support .mws-avatars img,
.miko-writer-support .mws-empty-avatar,
.miko-writer-support .mws-more{
  width:38px!important;height:38px!important;flex:0 0 38px!important;display:grid!important;place-items:center!important;
  margin-left:-7px!important;border:2px solid #fff!important;border-radius:50%!important;object-fit:cover!important;
  background:#edf3fa!important;color:#55708c!important;font-size:10px!important;font-weight:950!important;
  box-shadow:0 3px 9px rgba(23,62,105,.08)!important;
}
.miko-writer-support .mws-avatars>*:first-child{margin-left:0!important}
.miko-writer-support .mws-empty-avatar{background:#ffe6ed!important;color:#ff2d5d!important}
.miko-writer-support .mws-more{background:#e8f2ff!important;color:#1c69bd!important}
.miko-writer-support .mws-quote{
  position:relative!important;min-width:0!important;max-width:46%!important;
  margin:0!important;padding:8px 0 8px 30px!important;border:0!important;background:transparent!important;
  color:#536b85!important;font-size:10px!important;line-height:1.5!important;text-align:right!important;font-style:italic!important;
}
.miko-writer-support .mws-quote:before{
  content:"“"!important;position:absolute!important;left:6px!important;top:-2px!important;
  color:#ff2c5f!important;font:900 30px/1 Georgia,serif!important;
}
.miko-writer-support .mws-quote small{
  color:#71869e!important;font-size:9px!important;font-style:normal!important;
}

/* Keep floating member card from covering the support controls */
body.single-post:has(.miko-writer-support) .miko-global-profile-dock{
  display:none!important;
}

/* Tablet */
@media(max-width:980px){
  .miko-writer-support .mws-grid{
    grid-template-columns:210px minmax(0,1fr)!important;
    gap:14px!important;
  }
  .miko-writer-support .mws-balance{
    grid-column:1/-1!important;
    display:grid!important;grid-template-columns:1fr 1px 1fr!important;align-items:center!important;
  }
  .miko-writer-support .mws-balance hr{
    width:1px!important;height:42px!important;border:0!important;border-left:1px solid #efd8df!important;
  }
}

/* Phones */
@media(max-width:720px){
  .miko-writer-support{
    margin:22px 0!important;padding:14px!important;border-radius:16px!important;
  }
  .miko-writer-support .mws-head{
    align-items:flex-start!important;gap:11px!important;margin-bottom:14px!important;
  }
  .miko-writer-support .mws-head-icon{
    width:46px!important;height:46px!important;flex-basis:46px!important;font-size:21px!important;
  }
  .miko-writer-support .mws-head h2{font-size:19px!important}
  .miko-writer-support .mws-head p{font-size:11px!important;line-height:1.5!important}

  .miko-writer-support .mws-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:12px!important;
  }
  .miko-writer-support .mws-author{
    display:block!important;padding:10px!important;
    border:1px solid #f0dce2!important;background:rgba(255,255,255,.78)!important;
  }
  .miko-writer-support .mws-author blockquote{
    margin-top:11px!important;font-size:10px!important;
  }

  .miko-writer-support .mws-presets{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;
  }
  .miko-writer-support .mws-presets button{
    height:48px!important;font-size:16px!important;border-radius:10px!important;
  }
  .miko-writer-support .mws-presets .mws-custom-toggle{
    font-size:11px!important;
  }

  .miko-writer-support .mws-control textarea{
    min-height:94px!important;font-size:16px!important; /* prevent iOS input zoom */
  }
  .miko-writer-support .mws-custom-field input{font-size:16px!important}
  .miko-writer-support .mws-anonymous{
    min-height:42px!important;font-size:11px!important;
  }
  .miko-writer-support .mws-submit{
    min-height:54px!important;font-size:15px!important;border-radius:11px!important;
  }

  .miko-writer-support .mws-balance{
    grid-column:auto!important;
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;
    padding:11px!important;
  }
  .miko-writer-support .mws-balance>div{
    grid-template-columns:32px minmax(0,1fr)!important;padding:5px 9px!important;
  }
  .miko-writer-support .mws-balance>div+div{
    border-left:1px solid #efd8df!important;
  }
  .miko-writer-support .mws-balance hr{display:none!important}
  .miko-writer-support .mws-balance strong{
    font-size:15px!important;
  }

  .miko-writer-support .mws-footer{
    align-items:flex-start!important;flex-direction:column!important;gap:12px!important;
  }
  .miko-writer-support .mws-recent{
    width:100%!important;justify-content:space-between!important;
  }
  .miko-writer-support .mws-quote{
    max-width:100%!important;width:100%!important;text-align:left!important;padding-left:28px!important;
  }
}

@media(max-width:420px){
  .miko-writer-support{
    padding:12px!important;
  }
  .miko-writer-support .mws-author-avatar{
    width:64px!important;height:64px!important;flex-basis:64px!important;
  }
  .miko-writer-support .mws-author-main strong{font-size:13px!important}
  .miko-writer-support .mws-presets{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .miko-writer-support .mws-presets button{
    padding-inline:4px!important;font-size:15px!important;
  }
  .miko-writer-support .mws-presets button:before{
    font-size:7px!important;
  }
  .miko-writer-support .mws-balance{
    grid-template-columns:1fr 1fr!important;
  }
  .miko-writer-support .mws-balance>div{
    grid-template-columns:28px minmax(0,1fr)!important;padding-inline:6px!important;
  }
  .miko-writer-support .mws-balance .coin,
  .miko-writer-support .mws-balance .clock{
    width:28px!important;height:28px!important;font-size:10px!important;
  }
  .miko-writer-support .mws-balance p{font-size:8.5px!important}
  .miko-writer-support .mws-balance strong{font-size:13px!important}
}

@media(max-width:350px){
  .miko-writer-support .mws-presets{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .miko-writer-support .mws-balance{
    grid-template-columns:1fr!important;
  }
  .miko-writer-support .mws-balance>div+div{
    border-left:0!important;border-top:1px solid #efd8df!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .miko-writer-support *,
  .mws-modal-card{transition:none!important;animation:none!important}
}
