/* ABDALLAT & CO. free tools (Claude, 2026-11-04): on top of /assets/site2.css */
.top.solid { background: rgba(2, 8, 23, .88); }
.card .tk { font-size: .82rem; color: var(--gold-hi); letter-spacing: .03em; }
.tool-card { background: linear-gradient(160deg, rgba(11, 37, 89, .55), rgba(6, 22, 58, .25)); border: 1px solid var(--hair); border-radius: 20px; padding: clamp(1.2rem, 3vw, 2.2rem); display: grid; gap: 1.4rem; }
.tool-form { display: grid; gap: 1rem; max-width: 760px; }
.tf { display: grid; gap: .45rem; }
.tf span { font-size: .95rem; color: var(--mist); }
.tf input, .tf textarea, .tf select { font: inherit; color: var(--white); background: rgba(2, 8, 23, .55); border: 1px solid var(--hair-2); border-radius: 12px; padding: .8rem .95rem; width: 100%; min-width: 0; }
.tf textarea { resize: vertical; min-height: 6.5rem; }
.tf select option { color: #0B1430; }
.tool-msg { color: var(--gold-pale); min-height: 1.2em; }
.tool-out { display: grid; gap: 1rem; }
.out-box { border: 1px solid var(--hair-2); border-radius: 16px; padding: 1.2rem 1.3rem; background: rgba(2, 8, 23, .45); display: grid; gap: .8rem; justify-items: start; }
.out-box h3 { margin: 0; font-size: 1.05rem; color: var(--gold-hi); }
.out-text { white-space: pre-wrap; line-height: 1.7; color: var(--white); width: 100%; overflow-wrap: anywhere; }
.btn.copy { padding: .55rem 1.1rem; font-size: .9rem; }
.tool-how { margin: 1rem 0 0; padding-inline-start: 1.2rem; display: grid; gap: .6rem; color: var(--mist); }
.cl-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1rem; }
.cl-progress { flex: 1 1 220px; height: 8px; border-radius: 99px; background: rgba(234, 198, 110, .15); overflow: hidden; }
.cl-progress i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold), var(--gold-hi)); transition: width .4s var(--ease); }
.cl { display: grid; gap: 1.4rem; }
.cl-sec h3 { margin: 0 0 .6rem; font-size: 1.15rem; color: var(--gold-hi); }
.cl-item { display: flex; gap: .8rem; align-items: flex-start; padding: .65rem 0; border-top: 1px solid var(--hair); cursor: pointer; }
.cl-item input { width: 1.2rem; height: 1.2rem; margin-top: .2rem; accent-color: #C99A35; flex: none; }
.cl-item input:checked + span { color: var(--mist); text-decoration: line-through; text-decoration-color: rgba(234, 198, 110, .6); }
@media print {
  .top, footer, .page-hero .grid-lines, .cl-bar .btn, .split, .band, .curtain { display: none !important; }
  body { background: #fff; color: #000; }
  .tool-card { border: 0; background: none; padding: 0; }
  .cl-item { color: #000; border-color: #ccc; }
  .cl-sec h3, .page-hero h1 { color: #000; }
}