.limit-box{
display:flex;
align-items:center;
gap:10px;
margin-bottom:10px;
justify-content: space-between;
}

.limit-box input{
width:100px;
padding:5px;
}

.stats{
margin-bottom:10px;
display:flex;
flex-wrap:wrap;
gap:15px;
font-size:14px;
}

.text-box textarea{
width:100%;
height:250px;
padding:45px 15px 15px 15px;
border-radius:15px;
border:2px solid #ddd;
font-size:15px;
resize:vertical;
}
.limit-presets .preset{
width:auto;
height:36px;
margin: 5px;
align-items:center;
justify-content:center;
font-size:13px;
border-radius:8px;
}
.actions{
margin-top:10px;
display:flex;
gap:10px;
justify-content: flex-end;
}

.bottom-stats{
margin-top:10px;
display:flex;
gap:20px;
font-size:14px;
color:#555;
justify-content: flex-end;
}
.text-box{
position:relative;
}

.copy-btn{
margin:0 10px 0 0;
position:absolute;
top:10px;
right:10px;
border:none;
background:#eee;
padding:5px 8px;
cursor:pointer;
border-radius:6px;
}


/* =================================================
   アクションボタン（共通 3Dツヤ）
================================================= */
.actions .btn{
  margin-bottom: 15px;
  margin-right: 10px;
  position: relative;
  min-height: 46px;
  padding: 12px 18px;
  border-radius: 18px;
  font-weight: 800;
  letter-spacing: .02em;
  color: #fff;
  cursor: pointer;
  overflow: hidden;

  border: 1px solid rgba(0,0,0,0.15);
  box-shadow:
    0 10px 18px rgba(0,0,0,0.18),
    0 2px 0 rgba(0,0,0,0.25);

  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

/* 光のベール */
.actions .btn::after{
  content:"";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 20%,
    rgba(255,255,255,0.20),
    rgba(255,255,255,0) 55%
  );
  pointer-events: none;
}

.actions .btn:hover:not(:disabled){
  transform: translateY(-2px);
  box-shadow:
    0 14px 26px rgba(0,0,0,0.22),
    0 2px 0 rgba(0,0,0,0.22);
}

.actions .btn:active:not(:disabled){
  transform: translateY(1px);
  box-shadow:
    0 6px 12px rgba(0,0,0,0.18),
    0 1px 0 rgba(0,0,0,0.20);
}

.actions .btn:disabled{
  opacity: .45;
  cursor: not-allowed;
  filter: grayscale(.2);
}
/* =================================================
   アクションボタン（色分け）
================================================= */
/* 貼り付け */
#pasteBtn{
  background: linear-gradient(to bottom, #45a7ff, #1e6fd6);
  border-color: rgba(30,111,214,0.55);
}

/* クリア */
#clearBtn{
  background: linear-gradient(to bottom, #ff5c93, #d61e5d);
  border-color: rgba(214,30,93,0.55);
}
.limit-note2::before{
content:"👈 ";
}
.limit-bar{
height:8px;
background:#eee;
border-radius:10px;
margin:10px 0;
overflow:hidden;
}

#limitBar{
height:100%;
width:0%;
background:linear-gradient(to right,#45a7ff,#ff5c93);
transition:width .2s;
}
/* =========================
   Mobile tuning
========================= */
@media (max-width: 800px){

.actions{
flex-direction: column;
align-items: stretch;
}

.actions .btn{
width:100%;
}
.limit-note2::before{
content:"";
}
.limit-presets{
flex-direction: column;
}

.limit-presets .preset{
width:100%;
}
.limit-box{
flex-direction:column;
}

.limit-box input{
width:120px;
}

.limit-note .limit-note2{
display:block;
margin-top:5px;

}

}