*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-color:#1e1e2e;--surface-color:#313244;--border-color:#45475a;--text-primary:#cdd6f4;--text-secondary:#a6adc8;--accent-color:#89b4fa;--accent-surface:rgba(137,180,250,.15);--error-color:#f38ba8;--success-color:#a6e3a1;--font-sans:system-ui,-apple-system,sans-serif;--font-mono:"JetBrains Mono","Fira Code",Consolas,"Courier New",monospace;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html{height:100%}body{min-height:100%;font-family:var(--font-sans);background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;line-height:1.4}.container{flex-direction:column;gap:.75rem;max-width:1200px;min-height:100vh;margin:0 auto;padding:1rem 1.25rem;display:flex}header{border-bottom:1px solid var(--border-color);flex-shrink:0;align-items:baseline;gap:1rem;padding-bottom:.5rem;display:flex}h1{white-space:nowrap;font-size:1.125rem;font-weight:600}.subtitle{color:var(--text-secondary);font-size:.75rem}.control-group{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:6px;flex-shrink:0;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;display:flex}.input-wrapper{flex-direction:column;gap:.25rem;display:flex}.input-wrapper:last-child{flex:0 0 130px}.input-wrapper:first-child{flex:1}label{color:var(--text-secondary);font-size:.75rem;font-weight:600}select{background-color:var(--bg-color);color:var(--text-primary);border:1px solid var(--border-color);font-family:var(--font-mono);border-radius:4px;outline:none;width:100%;padding:.375rem .5rem;font-size:.875rem;transition:border-color .2s}input[type=text]{background-color:var(--bg-color);color:var(--text-primary);border:1px solid var(--border-color);font-family:var(--font-mono);border-radius:4px;outline:none;width:100%;padding:.375rem .5rem;font-size:.875rem;transition:border-color .2s}input[type=number]{background-color:var(--bg-color);color:var(--text-primary);border:1px solid var(--border-color);font-family:var(--font-mono);border-radius:4px;outline:none;width:100%;padding:.375rem .5rem;font-size:.875rem;transition:border-color .2s}select:focus{border-color:var(--accent-color)}input[type=text]:focus{border-color:var(--accent-color)}input[type=text].error{border-color:var(--error-color)}.error-message{color:var(--error-color);min-height:1.125rem;font-size:.75rem}.hex-grid-row{flex-shrink:0;grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.output-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:6px;overflow:hidden}.output-header{border-bottom:1px solid var(--border-color);background-color:rgba(255,255,255,.02);justify-content:space-between;align-items:center;padding:.375rem .75rem;display:flex}.output-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;font-size:.6875rem;font-weight:600}.output-content{font-family:var(--font-mono);word-break:break-all;padding:.5rem .75rem;font-size:.8125rem}.hex-grid{grid-template-columns:repeat(8,1fr);gap:.375rem;display:grid}.hex-cell{background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:3px;flex-direction:column;align-items:center;gap:.25rem;padding:.375rem .25rem;display:flex}.hex-cell.inactive{opacity:.25}.hex-cell-label{color:var(--text-secondary);font-size:.5rem;font-family:var(--font-mono);white-space:nowrap}.hex-cell-value{font-size:.75rem;font-weight:700;font-family:var(--font-mono);color:var(--accent-color)}.memory-grid{flex-shrink:0;grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.memory-grid .output-card{flex-direction:column;min-height:0;display:flex}.memory-grid .output-content{flex:1;min-height:0;padding:0}.bit-field-container{flex-direction:column;gap:.375rem;padding:.5rem .625rem;display:flex}.bit-field-row{gap:.375rem;display:flex}.byte-group{flex-direction:column;flex:1;gap:.25rem;min-width:0;display:flex}.byte-label{color:var(--text-secondary);text-align:center;font-size:.5625rem;font-family:var(--font-mono);white-space:nowrap}.bits-container{border:1px solid var(--border-color);border-radius:3px;display:flex;overflow:hidden}.bit-cell{background-color:var(--bg-color);border-right:1px solid var(--border-color);flex-direction:column;flex:1;align-items:center;min-width:0;display:flex}.bit-cell:last-child{border-right:none}.bit-cell.bit-1{background-color:var(--accent-surface)}.bit-index{color:var(--text-secondary);border-bottom:1px solid var(--border-color);text-align:center;width:100%;font-size:.5rem;font-family:var(--font-mono);padding:1px 0}.bit-value{font-size:.75rem;font-weight:700;font-family:var(--font-mono);padding:2px 0}.bit-cell.bit-1 .bit-value{color:var(--accent-color)}.byte-group.inactive{opacity:.25;pointer-events:none}.byte-group.inactive .byte-label{color:var(--border-color)}.byte-group.inactive .bit-cell{background-color:transparent}.byte-group.inactive .bit-value{color:var(--text-secondary)}@media (width<=640px){header{flex-direction:column;align-items:flex-start;gap:.25rem}h1{white-space:normal;font-size:1rem}.subtitle{font-size:.6875rem}.control-group{flex-direction:column;align-items:stretch}.input-wrapper:last-child{flex:none;width:100%}.hex-grid-row,.memory-grid{grid-template-columns:1fr}.rtos-controls .input-wrapper,.rtos-controls .input-wrapper:first-child{flex:100%}}input[type=text]:focus-visible{outline:2px solid var(--accent-color);outline-offset:1px}select:focus-visible{outline:2px solid var(--accent-color);outline-offset:1px}.section-divider{border:none;border-top:1px solid var(--border-color);margin:.5rem 0 0}.section-header{align-items:baseline;gap:1rem;margin-bottom:.25rem;padding-bottom:.25rem;display:flex}.section-header h2{white-space:nowrap;font-size:1rem;font-weight:600}.tool-section{flex-direction:column;gap:.75rem;display:flex}.rtos-controls{flex-wrap:wrap}.rtos-controls .input-wrapper{flex:0 0 140px}.rtos-controls .input-wrapper:first-child{flex:180px}.rtos-controls .input-wrapper-submit{flex:none;align-items:flex-end;display:flex}.generate-btn{background-color:var(--accent-color);color:var(--bg-color);font-family:var(--font-sans);cursor:pointer;border:none;border-radius:4px;padding:.375rem 1rem;font-size:.875rem;font-weight:600;transition:opacity .2s}.generate-btn:hover{opacity:.85}.generate-btn:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}.rtos-output-card{margin-top:0}.code-output{background-color:var(--bg-color);border:1px solid var(--border-color);font-family:var(--font-mono);color:var(--text-primary);white-space:pre;tab-size:4;border-radius:4px;margin:0;padding:.75rem 1rem;font-size:.8125rem;line-height:1.5;overflow-x:auto}.code-output code{font-family:inherit;font-size:inherit}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.placeholder-text{text-align:center;color:var(--text-secondary)}.placeholder-error{text-align:center;color:var(--error-color)}