.bit-button.active,.step-nav-btn.active{background:linear-gradient(135deg,#06b6d4,#3b82f6);color:#fff}.example-card,.glass{border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}.example-card .binary,.example-card .result{margin-bottom:.5rem;font-family:'JetBrains Mono',monospace}.bit-button,.example-card .binary,.example-card .result,.example-card.symbol .symbol-char,.ref-card{font-family:'JetBrains Mono',monospace}.glass{background:rgba(255,255,255,.05)}.glass-hover{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}.glow-text{background:linear-gradient(45deg,#00f5ff,#8a2be2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.step-number{background:linear-gradient(135deg,#00f5ff,#8a2be2);color:#fff;font-weight:700;border-radius:50%;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;margin-right:8px}.bit-button,.example-card,.ref-card{background:rgba(255,255,255,.05)}.bit-button,.step-nav-btn{color:#9ca3af}.category-content,.step-content{opacity:1;transition:opacity .3s}.category-content.hidden,.step-content.hidden{display:none}.bit-button{width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:8px;font-weight:700;cursor:pointer;transition:.2s}.bit-button.active{border-color:transparent}.bit-button:hover{background:rgba(255,255,255,.1)}.tab-button.active{background:linear-gradient(135deg,#06b6d4,#3b82f6)!important;color:#fff!important;border-color:transparent!important;transform:translateY(-1px)}.example-card:hover,.ref-card:hover{background:rgba(255,255,255,.1);border-color:rgba(6,182,212,.3)}.example-card{border-radius:12px;padding:1rem;cursor:pointer;transition:.3s}.example-card:hover{transform:translateY(-2px)}.example-card .result{font-size:1.1rem;font-weight:600;color:#06b6d4}.example-card .binary{font-size:.75rem;color:#9ca3af;word-break:break-all}.example-card .action{font-size:.75rem;color:#6b7280}.example-card.large{padding:1.5rem;text-align:center}.example-card.large .result{font-size:1.5rem;margin-bottom:.75rem}.example-card.large .binary{font-size:.875rem;margin-bottom:.75rem}.example-card.sentence{padding:1.5rem}.example-card.sentence .binary{font-size:.7rem;line-height:1.4;word-break:break-all}.example-card.symbol{text-align:center;padding:1.25rem 1rem}.example-card.symbol .symbol-char{font-size:2rem;color:#06b6d4;font-weight:700;margin-bottom:.5rem}.example-card.symbol .label{font-size:.7rem;color:#6b7280;margin-top:.25rem}.ref-card{border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.75rem .5rem;text-align:center;font-size:.8rem;color:#d1d5db;transition:.2s}.ref-card:hover{color:#06b6d4}