/* Number Base Converter — page-specific styles */
.base-pills{display:flex;gap:.55rem;flex-wrap:wrap;margin-bottom:1rem}
.base-pill{border:2px solid var(--border);background:var(--surface-2);border-radius:999px;padding:.42rem .75rem;font-size:.75rem;font-weight:800;color:var(--ink)}
.base-pill strong{color:var(--coral)}
.base-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.base-control{background:var(--surface-2);border:2px solid var(--border);border-radius:14px;padding:.8rem}
.base-control label{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-bottom:.4rem}
.base-control select,.base-control input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-family:var(--font-mono);font-weight:700}
.base-number{font-family:var(--font-mono);font-size:1.45rem;font-weight:800}
.base-action-row{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.base-result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}
.base-result-card{background:var(--surface-2);border:2px solid var(--border);border-radius:15px;padding:.85rem;position:relative}
.base-result-card .label{font-size:.7rem;font-weight:800;color:var(--ink-soft);text-transform:uppercase}
.base-result-card .name{font-size:.72rem;color:var(--ink-soft);margin-top:.15rem}
.base-result-card code{display:block;font-family:var(--font-mono);font-size:1.05rem;font-weight:800;color:var(--ink);word-break:break-all;margin:.5rem 0}
.base-copy{border:1px solid var(--border);background:transparent;color:var(--ink);border-radius:9px;padding:.25rem .55rem;font-size:.7rem}
.base-convert-line{font-family:var(--font-mono);font-weight:800;font-size:1rem;background:var(--ink);color:var(--sun);border-radius:14px;padding:1rem;word-break:break-all}
.base-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-top:.8rem}
.base-meta .item{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:.65rem}
.base-meta small{display:block;color:var(--ink-soft);font-size:.68rem}.base-meta b{font-family:var(--font-mono)}
.base-steps{margin-top:1rem}
.base-step{border:1px solid var(--border);border-radius:14px;margin-bottom:.7rem;overflow:hidden}
.base-step-head{display:flex;align-items:center;gap:.7rem;padding:.75rem .9rem;background:var(--surface-2)}
.base-step-no{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:#fff;font-weight:900}
.base-step-body{padding:.9rem}
.base-division{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:.78rem}
.base-division th,.base-division td{border-bottom:1px solid var(--border);padding:.45rem;text-align:right}
.base-division th{text-align:center;color:var(--ink-soft);font-family:var(--font-body)}
.base-final{display:flex;align-items:center;gap:.7rem;padding:.85rem;background:rgba(47,179,126,.1);border:1px solid var(--mint);border-radius:12px;margin-top:.75rem}
.base-bit-controls{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1rem}
.base-bit-btn{border:2px solid var(--border);background:var(--surface-2);color:var(--ink);border-radius:10px;padding:.45rem .7rem;font-weight:800;font-size:.75rem}
.base-bit-btn.active{border-color:var(--coral);background:rgba(255,90,69,.08)}
.bit-row{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.bit-cell{width:52px;border:2px solid var(--border);border-radius:10px;padding:.45rem .2rem;text-align:center;background:var(--surface-2)}
.bit-cell .bit{font-family:var(--font-mono);font-size:1rem;font-weight:900}
.bit-cell .pos{display:block;color:var(--ink-soft);font-size:.62rem;margin-top:.15rem}
.bit-cell.active{border-color:var(--coral);background:rgba(255,90,69,.1)}
.bit-legend{display:flex;justify-content:center;gap:1rem;font-size:.75rem;color:var(--ink-soft);margin-top:.8rem}
.history-row{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:center;border-bottom:1px solid var(--border);padding:.7rem 0}
.history-row code{font-family:var(--font-mono);font-size:.8rem;word-break:break-all}
.quick-ref{width:100%;border-collapse:collapse}
.quick-ref th,.quick-ref td{padding:.55rem;border-bottom:1px solid var(--border);font-family:var(--font-mono);text-align:center}
.quick-ref th{font-family:var(--font-body);color:var(--ink-soft)}
@media(max-width:900px){.base-result-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.base-input-grid,.base-meta{grid-template-columns:1fr}.base-result-grid{grid-template-columns:1fr}.history-row{grid-template-columns:1fr}.base-number{font-size:1.15rem}.bit-cell{width:42px}}