:root{--nbc-primary:var(--main-primary);--nbc-primary-rgb:99, 102, 241;--nbc-secondary:var(--main-secondary);--nbc-text:#1f2937;--nbc-text-muted:#64748b;--nbc-text-light:#94a3b8;--nbc-bg:#fff;--nbc-bg-secondary:#f8fafc;--nbc-bg-hover:#f1f5f9;--nbc-border:#e2e8f0;--nbc-border-focus:var(--nbc-primary);--nbc-shadow:0 1px 3px #0000001a;--nbc-shadow-lg:0 4px 12px #0000001a;--nbc-radius:var(--main-radius);--nbc-radius-lg:var(--main-radius-lg);--nbc-bin-color:#ef4444;--nbc-oct-color:#f59e0b;--nbc-dec-color:#10b981;--nbc-hex-color:#6366f1}._nbc-container{max-width:640px;margin:0 auto}@media (max-width:768px){._nbc-container{padding-left:1rem;padding-right:1rem}}._nbc-card{background:var(--nbc-bg);border-radius:var(--nbc-radius-lg);padding:var(--main-space-5);box-shadow:var(--nbc-shadow);border-style:solid;border-width:1px;border-color:var(--nbc-border);margin-bottom:var(--main-space-4)}._nbc-input-section{gap:var(--main-space-4);flex-direction:column;display:flex}._nbc-label{font-size:var(--main-text-sm);color:var(--nbc-text-muted);margin-bottom:var(--main-space-2);font-weight:500;display:block}._nbc-base-selector{margin-bottom:var(--main-space-2)}._nbc-base-tabs{gap:var(--main-space-2);background:var(--nbc-bg-secondary);padding:var(--main-space-1);border-radius:var(--nbc-radius);display:flex}._nbc-base-tab{padding:var(--main-space-2) var(--main-space-3);color:var(--nbc-text-muted);font-size:var(--main-text-sm);cursor:pointer;border-radius:calc(var(--nbc-radius) - 2px);background:0 0;border:none;flex:1;font-weight:600;transition:all .15s}._nbc-base-tab:hover{color:var(--nbc-text);background:var(--nbc-bg-hover)}._nbc-base-tab._nbc-base-active{background:var(--nbc-bg);color:var(--nbc-primary);box-shadow:var(--nbc-shadow)}._nbc-base-tab[data-base=bin]._nbc-base-active{color:var(--nbc-bin-color)}._nbc-base-tab[data-base=oct]._nbc-base-active{color:var(--nbc-oct-color)}._nbc-base-tab[data-base=dec]._nbc-base-active{color:var(--nbc-dec-color)}._nbc-base-tab[data-base=hex]._nbc-base-active{color:var(--nbc-hex-color)}._nbc-input-group{gap:var(--main-space-2);flex-direction:column;display:flex}._nbc-input-wrap{background:var(--nbc-bg);border-style:solid;border-width:2px;border-color:var(--nbc-border);border-radius:var(--nbc-radius);padding:0 var(--main-space-3);align-items:center;transition:border-color .15s,box-shadow .15s;display:flex}._nbc-input-wrap:focus-within{border-color:var(--nbc-border-focus);box-shadow:0 0 0 3px rgba(var(--nbc-primary-rgb), .1)}._nbc-input-prefix{font-family:var(--main-font-mono);font-size:var(--main-text-sm);color:var(--nbc-text-muted);margin-right:var(--main-space-1);-webkit-user-select:none;user-select:none}._nbc-input{padding:var(--main-space-3) 0;font-family:var(--main-font-mono);font-size:var(--main-text-lg);color:var(--nbc-text);background:0 0;border:none;outline:none;flex:1;min-width:0;font-weight:500}._nbc-input::placeholder{color:var(--nbc-text-light)}._nbc-clear-btn{background:var(--nbc-bg-secondary);width:28px;height:28px;color:var(--nbc-text-muted);border-radius:var(--nbc-radius);cursor:pointer;opacity:0;border:none;justify-content:center;align-items:center;transition:opacity .15s,background .15s;display:flex}._nbc-input-wrap:hover ._nbc-clear-btn,._nbc-input:not(:placeholder-shown)~._nbc-clear-btn{opacity:1}._nbc-clear-btn:hover{background:var(--nbc-bg-hover);color:var(--nbc-text)}._nbc-input-hint{font-size:var(--main-text-xs);color:var(--nbc-text-muted)}._nbc-input-hint code{font-family:var(--main-font-mono);background:var(--nbc-bg-secondary);font-size:inherit;border-radius:4px;padding:.125rem .375rem}._nbc-examples{background:var(--nbc-bg);border-radius:var(--nbc-radius-lg);padding:var(--main-space-4);box-shadow:var(--nbc-shadow);border-style:solid;border-width:1px;border-color:var(--nbc-border);margin-top:var(--main-space-4)}._nbc-examples-header{align-items:center;gap:var(--main-space-2);font-size:var(--main-text-sm);color:var(--nbc-text-muted);margin-bottom:var(--main-space-3);font-weight:500;display:flex}._nbc-examples-header svg{color:var(--nbc-primary)}._nbc-examples-list{gap:var(--main-space-2);flex-wrap:wrap;display:flex}._nbc-example-btn{padding:var(--main-space-1) var(--main-space-3);background:var(--nbc-bg-secondary);color:var(--nbc-text);font-size:var(--main-text-sm);font-family:var(--main-font-mono);border-radius:var(--nbc-radius);cursor:pointer;border:none;transition:background .15s}._nbc-example-btn:hover{background:var(--nbc-bg-hover)}@media (max-width:480px){._nbc-base-tab{padding:var(--main-space-2);font-size:var(--main-text-xs)}._nbc-input{font-size:var(--main-text-base)}}._nbc-results{gap:var(--main-space-2);margin-bottom:var(--main-space-3);flex-direction:column;display:flex}._nbc-row{align-items:center;gap:var(--main-space-3);background:var(--nbc-bg);border-radius:var(--nbc-radius);padding:var(--main-space-3) var(--main-space-4);border-style:solid;border-width:1px;border-color:var(--nbc-border);grid-template-columns:100px 1fr auto;transition:border-color .15s,box-shadow .15s;display:grid}._nbc-row:hover{border-color:rgba(var(--nbc-primary-rgb), .3)}._nbc-row.source{border-color:var(--nbc-primary);box-shadow:0 0 0 3px rgba(var(--nbc-primary-rgb), .1)}._nbc-row.error{border-color:var(--main-error)}._nbc-row-header{flex-direction:column;gap:2px;display:flex}._nbc-row-symbol{font-size:var(--main-text-sm);color:var(--nbc-text);font-weight:700}._nbc-row-name{font-size:var(--main-text-xs);color:var(--nbc-text-muted)}._nbc-row[data-base=bin] ._nbc-row-symbol{color:var(--nbc-bin-color)}._nbc-row[data-base=oct] ._nbc-row-symbol{color:var(--nbc-oct-color)}._nbc-row[data-base=dec] ._nbc-row-symbol{color:var(--nbc-dec-color)}._nbc-row[data-base=hex] ._nbc-row-symbol{color:var(--nbc-hex-color)}._nbc-row-main{align-items:center;gap:var(--main-space-1);min-width:0;display:flex;overflow:hidden}._nbc-row-prefix{font-family:var(--main-font-mono);font-size:var(--main-text-sm);color:var(--nbc-text-muted);flex-shrink:0}._nbc-row-value{font-family:var(--main-font-mono);font-size:var(--main-text-lg);color:var(--nbc-text);word-break:break-all;font-weight:600;line-height:1.4}._nbc-row.source ._nbc-row-value{color:var(--nbc-primary)}._nbc-row.error ._nbc-row-value{color:var(--main-error);font-size:var(--main-text-sm);font-weight:400}._nbc-row-copy{background:var(--nbc-bg-secondary);width:36px;height:36px;color:var(--nbc-text-muted);border-radius:var(--nbc-radius);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex}._nbc-row-copy:hover{background:var(--nbc-bg-hover);color:var(--nbc-text)}._nbc-row-copy.copied{background:var(--main-success);color:#fff}._nbc-copy-all-wrap{margin-bottom:var(--main-space-4);justify-content:center;display:flex}._nbc-copy-all{align-items:center;gap:var(--main-space-2);padding:var(--main-space-2) var(--main-space-4);background:var(--nbc-bg);color:var(--nbc-text);font-size:var(--main-text-sm);border-radius:var(--nbc-radius);cursor:pointer;box-shadow:var(--nbc-shadow);border:1px solid;border-color:var(--nbc-border);font-weight:500;transition:background .15s,box-shadow .15s;display:flex}._nbc-copy-all:hover{background:var(--nbc-bg-hover)}._nbc-copy-all.copied{background:var(--main-success);color:#fff;border-color:var(--main-success)}@media (max-width:480px){._nbc-row{padding:var(--main-space-2) var(--main-space-3);gap:var(--main-space-2);grid-template-columns:70px 1fr auto}._nbc-row-value{font-size:var(--main-text-base)}._nbc-row-copy{width:32px;height:32px}}._nbc-reference{margin-top:var(--main-space-4)}._nbc-reference-toggle{align-items:center;gap:var(--main-space-2);width:100%;padding:var(--main-space-3) var(--main-space-4);background:var(--nbc-bg);color:var(--nbc-text);font-size:var(--main-text-sm);border-radius:var(--nbc-radius-lg);cursor:pointer;box-shadow:var(--nbc-shadow);border:1px solid;border-color:var(--nbc-border);font-weight:500;transition:background .15s;display:flex}._nbc-reference-toggle:hover{background:var(--nbc-bg-hover)}._nbc-reference-toggle svg:first-child{color:var(--nbc-primary)}._nbc-toggle-icon{margin-left:auto;transition:transform .2s}._nbc-reference-toggle.active ._nbc-toggle-icon{transform:rotate(180deg)}._nbc-reference-panel{background:var(--nbc-bg);border-radius:0 0 var(--nbc-radius-lg) var(--nbc-radius-lg);padding:var(--main-space-4);border-style:solid;border-width:1px;border-color:var(--nbc-border);border-top:none;margin-top:-1px}._nbc-reference-panel.hidden{display:none}._nbc-ref-table{gap:var(--main-space-2);margin-bottom:var(--main-space-4);flex-direction:column;display:flex}._nbc-ref-header-row{gap:var(--main-space-3);padding:var(--main-space-2) 0;font-size:var(--main-text-xs);color:var(--nbc-text-muted);text-transform:uppercase;letter-spacing:.5px;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--nbc-border);grid-template-columns:80px 140px 60px 1fr;font-weight:600;display:grid}._nbc-ref-row{gap:var(--main-space-3);padding:var(--main-space-2) 0;font-size:var(--main-text-sm);color:var(--nbc-text);border-bottom-style:dashed;border-bottom-width:1px;border-bottom-color:var(--nbc-border);grid-template-columns:80px 140px 60px 1fr;display:grid}._nbc-ref-row:last-child{border-bottom:none}._nbc-ref-symbol{font-weight:600}._nbc-ref-digits code,._nbc-ref-prefix code{font-family:var(--main-font-mono);background:var(--nbc-bg-secondary);font-size:var(--main-text-xs);border-radius:4px;padding:.125rem .375rem}._nbc-ref-usage{color:var(--nbc-text-muted)}._nbc-ref-conversion{background:var(--nbc-bg-secondary);border-radius:var(--nbc-radius);padding:var(--main-space-3)}._nbc-ref-conversion-title{font-size:var(--main-text-sm);color:var(--nbc-text);margin-bottom:var(--main-space-3);text-align:center;font-weight:600}._nbc-ref-conversion-table{background:var(--nbc-border);border-radius:var(--nbc-radius);grid-template-columns:repeat(4,1fr);gap:1px;display:grid;overflow:hidden}._nbc-ref-conv-header{display:contents}._nbc-ref-conv-header span{background:var(--nbc-bg-hover);padding:var(--main-space-2);font-size:var(--main-text-xs);color:var(--nbc-text);text-align:center;font-weight:700}._nbc-ref-conv-row{display:contents}._nbc-ref-conv-row span{background:var(--nbc-bg);padding:var(--main-space-1) var(--main-space-2);font-family:var(--main-font-mono);font-size:var(--main-text-xs);color:var(--nbc-text);text-align:center}._nbc-ref-conv-row:nth-child(odd) span{background:var(--nbc-bg-secondary)}@media (max-width:640px){._nbc-ref-header-row,._nbc-ref-row{gap:var(--main-space-2);font-size:var(--main-text-xs);grid-template-columns:70px 100px 50px 1fr}}@media (max-width:480px){._nbc-ref-header-row,._nbc-ref-row{grid-template-columns:1fr 1fr}._nbc-ref-header-row span:nth-child(3),._nbc-ref-header-row span:nth-child(4),._nbc-ref-row span:nth-child(3),._nbc-ref-row span:nth-child(4){display:none}}._nbc-sub-container{max-width:520px;margin:0 auto}._nbc-sub-card{background:var(--nbc-bg);border-radius:var(--nbc-radius-lg);padding:var(--main-space-6);box-shadow:var(--nbc-shadow);border-style:solid;border-width:1px;border-color:var(--nbc-border);margin-bottom:var(--main-space-5)}._nbc-sub-field{gap:var(--main-space-2);flex-direction:column;transition:opacity .15s;display:flex}._nbc-sub-field.active ._nbc-sub-input-wrap{border-color:var(--nbc-border-focus);box-shadow:0 0 0 3px rgba(var(--nbc-primary-rgb), .1)}._nbc-sub-header{justify-content:space-between;align-items:center;gap:var(--main-space-2);display:flex}._nbc-sub-label{align-items:center;gap:var(--main-space-2);font-size:var(--main-text-sm);color:var(--nbc-text);font-weight:500;display:flex}._nbc-sub-label-badge{background:var(--nbc-bg-secondary);color:var(--nbc-primary);font-size:var(--main-text-xs);border-radius:var(--nbc-radius);padding:.125rem .5rem;font-weight:700;display:inline-flex}._nbc-sub-input-wrap{background:var(--nbc-bg);border-style:solid;border-width:2px;border-color:var(--nbc-border);border-radius:var(--nbc-radius);padding:0 var(--main-space-3);align-items:center;transition:border-color .15s,box-shadow .15s;display:flex}._nbc-sub-input-wrap:focus-within{border-color:var(--nbc-border-focus);box-shadow:0 0 0 3px rgba(var(--nbc-primary-rgb), .1)}._nbc-sub-prefix{font-family:var(--main-font-mono);font-size:var(--main-text-sm);color:var(--nbc-text-muted);margin-right:var(--main-space-1);-webkit-user-select:none;user-select:none}._nbc-sub-input{padding:var(--main-space-3) 0;font-family:var(--main-font-mono);font-size:var(--main-text-lg);color:var(--nbc-text);background:0 0;border:none;outline:none;flex:1;min-width:0;font-weight:600}._nbc-sub-input::placeholder{color:var(--nbc-text-light);font-weight:400}._nbc-sub-hint{font-size:var(--main-text-xs);color:var(--nbc-text-muted)}._nbc-sub-hint code{font-family:var(--main-font-mono);font-size:var(--main-text-xs);color:var(--nbc-text-light);letter-spacing:.5px}._nbc-sub-swap-row{padding:var(--main-space-2) 0;justify-content:center;display:flex}._nbc-sub-swap{background:var(--nbc-bg-secondary);width:40px;height:40px;color:var(--nbc-text-muted);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;transition:background .15s,color .15s,transform .3s;display:flex}._nbc-sub-swap:hover{background:var(--nbc-primary);color:#fff}._nbc-sub-swap.swapping{transform:rotate(180deg)}._nbc-sub-copy{background:var(--nbc-bg-secondary);width:36px;height:36px;color:var(--nbc-text-muted);border-radius:var(--nbc-radius);cursor:pointer;margin-left:var(--main-space-2);border:none;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex}._nbc-sub-copy:hover{background:var(--nbc-bg-hover);color:var(--nbc-text)}._nbc-sub-copy.copied{background:var(--main-success);color:#fff}._nbc-sub-reference{background:var(--nbc-bg);border-radius:var(--nbc-radius-lg);padding:var(--main-space-5);box-shadow:var(--nbc-shadow);border-style:solid;border-width:1px;border-color:var(--nbc-border);margin-bottom:var(--main-space-5)}._nbc-sub-ref-title{font-size:var(--main-text-sm);color:var(--nbc-text);margin:0 0 var(--main-space-3) 0;text-align:center;font-weight:600}._nbc-sub-ref-grid{gap:var(--main-space-4);grid-template-columns:repeat(2,1fr);display:grid}._nbc-sub-ref-col{gap:var(--main-space-2);flex-direction:column;display:flex}._nbc-sub-ref-item{align-items:center;gap:var(--main-space-2);font-family:var(--main-font-mono);font-size:var(--main-text-sm);color:var(--nbc-text);padding:var(--main-space-2);background:var(--nbc-bg-secondary);border-radius:var(--nbc-radius);display:flex}._nbc-sub-ref-item span:first-child{text-align:right;flex:1;font-weight:500}._nbc-sub-ref-eq{color:var(--nbc-text-muted)}._nbc-sub-ref-item span:last-child{color:var(--nbc-primary);flex:1;font-weight:600}._nbc-sub-info{gap:var(--main-space-3);flex-direction:column;display:flex}._nbc-sub-info-card{gap:var(--main-space-4);background:var(--nbc-bg);border-radius:var(--nbc-radius-lg);padding:var(--main-space-4);box-shadow:var(--nbc-shadow);border-style:solid;border-width:1px;border-color:var(--nbc-border);display:flex}._nbc-sub-info-icon{background:rgba(var(--nbc-primary-rgb), .1);width:48px;height:48px;color:var(--nbc-primary);border-radius:var(--nbc-radius);flex-shrink:0;justify-content:center;align-items:flex-start;padding-top:12px;display:flex}._nbc-sub-info-content{flex:1;min-width:0}._nbc-sub-info-title{font-size:var(--main-text-sm);color:var(--nbc-text);margin:0 0 var(--main-space-1) 0;font-weight:600}._nbc-sub-info-text{font-size:var(--main-text-sm);color:var(--nbc-text-muted);margin:0;line-height:1.5}@media (max-width:480px){._nbc-sub-container{padding-left:1rem;padding-right:1rem}._nbc-sub-card{padding:var(--main-space-4)}._nbc-sub-header{align-items:flex-start;gap:var(--main-space-1);flex-direction:column}._nbc-sub-hint{width:100%}._nbc-sub-input{font-size:var(--main-text-base)}._nbc-sub-ref-grid{grid-template-columns:1fr}._nbc-sub-info-card{text-align:center;flex-direction:column;align-items:center}}