.subnet-tool .intro>p{max-width:760px}.subnet-workspace{border:1px solid var(--line);background:var(--surface);border-radius:16px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);display:grid;overflow:hidden}.subnet-controls,.subnet-results{min-width:0;padding:28px}.subnet-controls{border-right:1px solid var(--line)}.subnet-tool h2{margin:0 0 20px;font-size:22px}.subnet-tool h3{margin:28px 0 12px;font-size:15px}.subnet-field{margin:20px 0 10px;font-size:14px;font-weight:600;display:block}.subnet-tool input[type=text],.subnet-tool select{border:1px solid var(--line);width:100%;min-width:0;min-height:48px;font:inherit;font-family:var(--font-geist-mono), monospace;background:var(--surface-soft);color:var(--text);border-radius:8px;padding:12px;font-size:16px}.subnet-tool input[aria-invalid=true]{border-color:var(--error-text)}.subnet-tool input[type=range]{width:100%;min-height:44px;accent-color:var(--tool-accent);margin:4px 0 0}.subnet-prefix-title{justify-content:space-between;align-items:center;margin-top:28px;font-size:14px;font-weight:600;display:flex}.subnet-prefix-title output{font:600 24px var(--font-geist-mono), monospace}.subnet-range-labels{color:var(--text-muted);justify-content:space-between;font-size:12px;display:flex}.subnet-hint{color:var(--text-muted);font-size:14px;line-height:1.7}.subnet-error{color:var(--error-text);font-size:14px;line-height:1.6}.subnet-presets{flex-direction:column;gap:8px;display:flex}.subnet-tool button{font:inherit;color:var(--text);border:1px solid var(--line);background:var(--surface-soft);cursor:pointer;border-radius:8px;min-width:44px;min-height:44px}.subnet-presets button{text-align:left;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;font-size:14px;display:flex}.subnet-presets code{color:var(--text-muted)}.subnet-tool button:hover{border-color:var(--tool-accent)}:is(.subnet-tool button:focus-visible,.subnet-tool input:focus-visible,.subnet-tool select:focus-visible){outline:3px solid var(--focus);outline-offset:3px}.subnet-cidr{border:1px solid var(--line);background:var(--surface-soft);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:18px;display:flex}.subnet-cidr strong{font:600 clamp(18px, 2.4vw, 28px) var(--font-geist-mono), monospace;overflow-wrap:anywhere}.subnet-cidr button,.subnet-values button{flex-shrink:0;place-items:center;display:grid}.subnet-counts{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0;display:grid}.subnet-counts strong{font:600 clamp(18px, 2vw, 25px) var(--font-heading), sans-serif;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;display:block}.subnet-counts span{color:var(--text-muted);margin-top:6px;font-size:13px;line-height:1.5;display:block}.subnet-values{margin:0 0 20px}.subnet-values>div{border-bottom:1px solid var(--line);padding:10px 0}.subnet-values dt{color:var(--text-muted);margin-bottom:4px;font-size:13px}.subnet-values dd{justify-content:space-between;align-items:center;gap:12px;margin:0;display:flex}.subnet-values code{font-family:var(--font-geist-mono), monospace;overflow-wrap:anywhere;font-size:14px}.subnet-values button{background:0 0;border-color:#0000}.subnet-tool .subnet-copy-report{background:var(--tool-accent);width:100%;color:var(--on-tool);border-color:var(--tool-accent);justify-content:center;align-items:center;gap:8px;padding:12px;font-size:14px;font-weight:600;display:flex}.subnet-empty{text-align:center;color:var(--text-muted);background:var(--surface-soft);border-radius:12px;place-content:center;justify-items:center;min-height:260px;padding:24px;line-height:1.7;display:grid}.subnet-notice{min-height:24px;color:var(--text-muted);font-size:14px;line-height:1.7}.subnet-binary{border:1px solid var(--line);background:var(--surface);border-radius:16px;margin-bottom:24px;padding:28px}.subnet-binary h2{margin-bottom:8px}.subnet-octets{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:24px 0;display:grid}.subnet-octet{text-align:center;min-width:0}.subnet-octet>div{grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;margin-bottom:10px;display:grid}.subnet-octet span{min-width:0;font:500 14px var(--font-geist-mono), monospace;border-radius:4px;padding:8px 0}.subnet-network-bit{background:var(--tool-accent);color:var(--on-tool);border:1px solid var(--tool-accent)}.subnet-host-bit{background:repeating-linear-gradient(135deg, var(--surface-soft), var(--surface-soft) 4px, var(--line) 4px, var(--line) 5px);color:var(--text);border:1px solid var(--line)}.subnet-legend,.subnet-legend span{align-items:center;gap:8px;display:flex}.subnet-legend{flex-wrap:wrap;gap:20px;font-size:13px}.subnet-legend i{border-radius:4px;width:18px;height:18px;display:block}@media (max-width:760px){.subnet-workspace{grid-template-columns:1fr}.subnet-controls{border-right:0;border-bottom:1px solid var(--line)}.subnet-controls,.subnet-results,.subnet-binary{padding:20px}.subnet-octets{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}.subnet-octet span{font-size:12px}}@media (max-width:360px){.subnet-counts{grid-template-columns:1fr}}