.subnet-form{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.subnet-form .input-panel,.subnet-form .output-panel{min-width:0}.subnet-form .fields{grid-template-columns:1fr}.subnet-app h2{font-size:1.8rem}.subnet-app .calculate-button{margin-top:1rem}.subnet-cidr{font-family:Georgia,serif;font-size:clamp(1.6rem,3vw,2.3rem);overflow-wrap:anywhere;margin:.5rem 0}.subnet-convention{padding:.85rem 1rem;border-left:3px solid var(--accent);background:var(--paper);line-height:1.6}.subnet-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.2rem 0}.subnet-metrics>div{border-bottom:1px solid var(--line);padding-bottom:.7rem;min-width:0}.subnet-metrics dt{font-size:.78rem;margin-bottom:.4rem}.subnet-metrics dd{margin:0;font-size:1.08rem;font-weight:650;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.subnet-range{padding:1rem;border:1px solid var(--line);border-radius:8px}.subnet-range p{margin:.5rem 0 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.subnet-binary,.subnet-split{padding:1.8rem;border-top:1px solid var(--line)}.binary-grid{display:grid;gap:1rem;margin-top:1.5rem}.binary-row{display:grid;grid-template-columns:10rem 1fr;align-items:center;gap:1rem}.binary-row>strong{font-size:.85rem}.binary-octets{display:flex;flex-wrap:wrap;gap:.7rem}.binary-octet{font-family:ui-monospace,Consolas,monospace;font-size:1.05rem;display:flex;border:1px solid var(--line);border-radius:4px;overflow:hidden}.binary-octet>span{padding:.2rem .12rem}.network-bit{background:var(--surface);text-decoration:underline;text-underline-offset:4px;font-weight:bold}.host-bit{background:var(--paper);opacity:.9}.bit-network-key{text-decoration:underline;text-underline-offset:3px}.subnet-split fieldset{border:0;padding:0;margin:0;min-width:0}.subnet-split fieldset .fields{max-width:650px}.subnet-split [data-split-status]{padding:1rem;background:var(--surface);border-left:3px solid var(--accent);line-height:1.6}.subnet-pager{display:flex;gap:.65rem;align-items:end;flex-wrap:wrap;margin:1rem 0}.subnet-pager .field{width:9rem;margin:0}.subnet-pager input{width:100%;min-width:0}.subnet-pager button{min-height:44px}.subnet-table-wrap{overflow:auto;max-width:100%;border:1px solid var(--line);border-radius:8px}.subnet-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:.85rem;font-variant-numeric:tabular-nums}.subnet-table caption{text-align:left;padding:.85rem;white-space:normal;font-weight:650}.subnet-table th,.subnet-table td{padding:.85rem;text-align:left;border-top:1px solid var(--line)}.subnet-table thead{background:var(--surface)}.subnet-table tbody tr:nth-child(even){background:var(--paper)}.subnet-app button:disabled{opacity:.5;cursor:default}.subnet-app [hidden]{display:none!important}.subnet-split .result-actions{flex-wrap:wrap}.subnet-split [data-export-help]{line-height:1.6}
@media(max-width:760px){.subnet-form{grid-template-columns:1fr}.subnet-binary,.subnet-split{padding:1.2rem}.binary-row{grid-template-columns:1fr;gap:.5rem}.binary-octets{gap:.45rem}.binary-octet{font-size:.95rem}.subnet-metrics{gap:.8rem}.subnet-metrics dd{font-size:1rem}.subnet-pager{gap:.5rem}.subnet-pager .field{width:7rem}.subnet-split .fields{grid-template-columns:1fr}.subnet-app h2{font-size:1.55rem}}
.subnet-split form{display:block}
.subnet-result .subnet-cidr{font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.3}
.subnet-app button[type=button]{min-height:44px;border:1px solid var(--input-line);border-radius:6px;padding:10px 13px;background:var(--surface);color:var(--text);font-weight:600}.subnet-app button[type=button]:hover:not(:disabled){background:var(--result)}@media print{html:has([data-subnet]){color-scheme:light!important}}
.subnet-result>p.subnet-cidr{font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.3}