:root{color:#172136;font-synthesis:none;text-rendering:optimizelegibility;--navy:#18233c;--purple:#5f3dc4;--purple-soft:#eee9ff;--teal:#087f8c;--teal-soft:#e2f6f7;--orange:#e36c09;--orange-soft:#fff0e2;--line:#d9e0ea;--muted:#5c687d;--white:#fff;background:#eef2f7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}.app-shell{max-width:1500px;margin:0 auto;padding:28px}.hero{color:#fff;background:linear-gradient(135deg,#17223b 0%,#3a2a77 58%,#087f8c 140%);border-radius:28px;justify-content:space-between;align-items:flex-start;gap:28px;padding:34px 38px;display:flex;box-shadow:0 18px 55px #1721362e}.eyebrow,.section-kicker{text-transform:uppercase;letter-spacing:.09em;margin:0 0 8px;font-size:.78rem;font-weight:800}.hero .eyebrow{color:#cfc4ff}h1{letter-spacing:-.045em;margin:0;font-size:clamp(2.2rem,4vw,4.35rem);line-height:1.02}.hero-copy{color:#e7eaf3;max-width:960px;margin:18px 0 0;font-size:clamp(1rem,1.6vw,1.35rem);line-height:1.55}.fullscreen-button{color:#fff;flex:none;background:#ffffff1a!important;border-color:#fff6!important}.tab-bar{z-index:10;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#eef2f7f0;grid-template-columns:repeat(5,1fr);gap:10px;padding:18px 0;display:grid;position:sticky;top:0}.tab{border:1px solid var(--line);color:var(--muted);background:#fff;border-radius:14px;padding:14px 12px;font-weight:750;transition:all .2s}.tab:hover{border-color:#b8c3d3;transform:translateY(-1px)}.tab.active{color:#fff;border-color:var(--purple);background:var(--purple);box-shadow:0 8px 24px #5f3dc43d}.panel-stack{gap:18px;display:grid}.demo-panel,.concept-strip{border:1px solid var(--line);background:#fff;border-radius:24px;box-shadow:0 8px 26px #21304d12}.demo-panel{padding:28px}.panel-heading{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px;display:flex}.panel-heading.compact{margin-bottom:18px}.section-kicker{color:var(--purple)}h2{letter-spacing:-.035em;margin:0;font-size:clamp(1.7rem,2.6vw,2.75rem);line-height:1.12}h3{margin:0 0 8px;font-size:1.4rem}.concept-strip{grid-template-columns:repeat(3,1fr);display:grid;overflow:hidden}.concept-strip article{border-right:1px solid var(--line);align-items:center;gap:16px;padding:22px 26px;display:flex}.concept-strip article:last-child{border-right:0}.concept-number{background:var(--purple-soft);width:54px;height:54px;color:var(--purple);border-radius:16px;place-items:center;font-size:1.45rem;font-weight:900;display:grid}.concept-strip strong{font-size:1.18rem}.concept-strip p{color:var(--muted);margin:4px 0 0}.preset-row,.button-row{flex-wrap:wrap;gap:9px;display:flex}.button-row.left{justify-content:flex-start;margin:20px 0}.chip{border:1px solid var(--line);color:#33405a;background:#f8fafc;border-radius:999px;padding:9px 14px;font-weight:800}.chip.selected,.chip:hover{background:var(--purple-soft);color:var(--purple);border-color:#bfaeff}.primary-button,.secondary-button,.ghost-button{border:1px solid #0000;border-radius:12px;padding:11px 17px;font-weight:800}.primary-button{background:var(--purple);color:#fff;box-shadow:0 7px 18px #5f3dc438}.secondary-button{border-color:var(--line);color:var(--navy);background:#fff}.ghost-button{color:var(--muted);background:0 0}.value-control{border:1px solid var(--line);background:#f8fafc;border-radius:18px;margin-bottom:18px;padding:18px}.value-control label,.text-input-label{margin-bottom:10px;font-weight:800;display:block}.input-line{grid-template-columns:130px 1fr;align-items:center;gap:18px;display:grid}.input-line input[type=number]{border:2px solid #c7d0df;border-radius:12px;width:100%;padding:10px 12px;font-size:1.5rem;font-weight:850}input[type=range]{width:100%;accent-color:var(--purple)}.representation-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.representation-card{border:1px solid var(--line);border-radius:18px;flex-direction:column;min-height:180px;padding:20px;display:flex}.representation-card p{color:var(--muted);margin:0;font-weight:800}.representation-card>strong{overflow-wrap:anywhere;margin:auto 0 10px;font-size:clamp(2rem,4vw,4.2rem);line-height:1.15}.representation-card>span{color:var(--muted);line-height:1.45}.mono{letter-spacing:.035em;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace}.teaching-callout{background:var(--teal-soft);color:#075c66;border-radius:18px;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;margin-top:18px;padding:18px;display:flex}.teaching-callout>strong{text-align:center;width:100%;font-size:1.08rem}.teaching-callout span{font-size:clamp(1.4rem,3vw,2.6rem);font-weight:900}.teaching-callout small{text-align:center;text-transform:uppercase;letter-spacing:.06em;font-size:.7rem;font-weight:750;display:block}.bit-place-grid{grid-template-columns:repeat(8,1fr);gap:10px;display:grid}.bit-place{border:2px solid var(--line);text-align:center;background:#f8fafc;border-radius:16px;min-width:0;padding:12px 8px;transition:all .22s}.bit-place .place-label{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:.66rem;display:block}.bit-place strong{margin:5px 0 9px;font-size:1.25rem;display:block}.bit-value{border:1px solid var(--line);background:#fff;border-radius:12px;place-items:center;width:46px;height:46px;margin:0 auto;font:900 1.65rem/1 SFMono-Regular,Consolas,monospace;display:grid}.bit-place.current{border-color:var(--orange);background:var(--orange-soft);transform:translateY(-4px);box-shadow:0 10px 22px #e36c0926}.bit-place.done{opacity:.78}.bit-place.one .bit-value{color:#fff;background:var(--purple);border-color:var(--purple)}.bit-place.future .bit-value{color:#a4afbf}.explanation-box{border-left:6px solid var(--purple);background:var(--purple-soft);border-radius:0 16px 16px 0;min-height:124px;margin-top:18px;padding:18px 20px}.explanation-box p{margin:6px 0;font-size:1.05rem;line-height:1.55}.step-title{color:var(--purple);text-transform:uppercase;letter-spacing:.06em;font-weight:900;font-size:.82rem!important}.equation{color:#3d4961}.hex-breakdown{border-top:1px solid var(--line);grid-template-columns:.8fr 1.8fr;align-items:center;gap:24px;margin-top:24px;padding-top:24px;display:grid}.hex-breakdown p{color:var(--muted);line-height:1.5}.nibble-flow{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.nibble-flow>div{border:1px solid var(--line);text-align:center;background:#f8fafc;border-radius:14px;padding:12px 14px}.nibble-flow span{font-size:1.3rem;font-weight:850}.nibble-flow small{color:var(--muted);margin-top:4px;font-size:.7rem;display:block}.nibble-flow .hex-result{background:var(--teal-soft);border-color:#9bd4d9}.text-input{border:2px solid #c7d0df;border-radius:14px;width:100%;padding:14px 16px;font-size:1.65rem;font-weight:750}.byte-table{border:1px solid var(--line);border-radius:16px;overflow:hidden}.byte-row{border-bottom:1px solid var(--line);grid-template-columns:.55fr 1fr 1fr 2fr;align-items:center;gap:12px;padding:13px 16px;font-size:1.05rem;transition:all .2s;display:grid}.byte-row:last-child{border-bottom:0}.byte-header{background:var(--navy);color:#fff;font-weight:850}.active-byte{background:var(--orange-soft);box-shadow:inset 5px 0 0 var(--orange);transform:scale(1.006)}.past-byte{color:#647086;background:#f3f7fb}.encoding-output-grid{grid-template-columns:1fr 1fr;gap:14px;margin-top:16px;display:grid}.encoding-output-grid article{border:1px solid var(--line);background:#f8fafc;border-radius:16px;padding:17px}.encoding-output-grid p{color:var(--muted);margin:0 0 8px;font-weight:800}.encoding-output-grid strong{overflow-wrap:anywhere;line-height:1.55}.pixel-layout{grid-template-columns:.75fr 1.6fr;align-items:stretch;gap:22px;display:grid}.pixel-preview{color:#fff;text-shadow:0 2px 8px #00000073;border-radius:22px;flex-direction:column;justify-content:flex-end;min-height:330px;padding:24px;display:flex;box-shadow:inset 0 0 0 1px #0000001f}.pixel-preview span{font-weight:800}.pixel-preview strong{font-size:clamp(2rem,4vw,3.8rem)}.channel-controls{gap:12px;display:grid}.channel-card{border:2px solid var(--line);border-radius:17px;padding:18px;transition:all .2s}.channel-card.channel-active{border-color:var(--orange);background:var(--orange-soft);transform:translate(5px)}.channel-heading,.channel-values{justify-content:space-between;gap:12px;display:flex}.channel-heading span{font-size:1.35rem;font-weight:900}.channel-card input{margin:16px 0}.channel-values{color:var(--muted);font-weight:750}.wave-card{border:1px solid var(--line);background:#f8fafc;border-radius:20px;padding:12px}.wave-card svg{width:100%;height:min(34vh,350px)}.axis{stroke:#c6cfdd;stroke-width:2px}.wave{fill:none;stroke:var(--purple);stroke-width:6px;stroke-linecap:round}.sample line{stroke:#cfd6e1;stroke-width:2px;stroke-dasharray:4 5}.sample circle{fill:#fff;stroke:#aab5c5;stroke-width:4px;transition:all .2s}.sample.sampled circle{fill:var(--teal);stroke:var(--teal)}.sample.active-sample circle{fill:var(--orange);stroke:#ffba7c;r:12}.sample.active-sample line{stroke:var(--orange);stroke-width:4px}.sample-readout{background:var(--navy);color:#fff;border-radius:17px;grid-template-columns:repeat(4,1fr);gap:12px;padding:17px;display:grid}.sample-readout>div{border-right:1px solid #ffffff29;padding-right:12px}.sample-readout>div:last-child{border-right:0}.sample-readout span{color:#bbc5d7;font-size:.8rem;font-weight:750;display:block}.sample-readout strong{margin-top:4px;font-size:1.2rem;display:block}.sample-readout p{color:#dce3ee;grid-column:1/-1;margin:0}.summary-hero{text-align:center}.summary-hero h2{max-width:1150px;margin:0 auto}.summary-flow{flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;margin:28px auto;display:flex}.summary-flow div{border:1px solid var(--line);background:#f8fafc;border-radius:18px;min-width:190px;padding:18px 26px}.summary-flow span{color:var(--muted);font-weight:800;display:block}.summary-flow strong{margin-top:5px;font-size:2rem;display:block}.meaning-cards{text-align:left;grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.meaning-cards article{border:1px solid var(--line);border-radius:18px;padding:20px}.meaning-cards span{color:var(--muted);font-weight:800}.meaning-cards strong{margin:10px 0;font-size:3rem;display:block}.meaning-cards p{color:var(--muted);line-height:1.5}.mini-colour{border-radius:15px;width:80px;height:80px;margin:12px 0}.large-message{background:var(--teal-soft);color:#075c66;border-radius:16px;margin:24px 0 0;padding:18px;font-size:1.25rem}.quiz-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.quiz-card{text-align:left;border:2px solid var(--line);min-height:220px;color:var(--navy);background:#f8fafc;border-radius:18px;padding:20px}.quiz-card:hover{background:var(--purple-soft);border-color:#bfaeff}.quiz-card span{color:var(--purple);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;font-weight:900}.quiz-card strong{margin:16px 0;font-size:1.25rem;line-height:1.35;display:block}.quiz-card p{color:var(--muted);line-height:1.45}.return-row{justify-content:center;gap:10px;margin-top:20px;display:flex}footer{color:var(--muted);text-align:center;margin:20px 0 4px;font-size:.93rem}@media (width<=1050px){.tab-bar{grid-template-columns:repeat(3,1fr)}.representation-grid,.meaning-cards,.hex-breakdown,.pixel-layout{grid-template-columns:1fr}.nibble-flow{justify-content:flex-start}.pixel-preview{min-height:250px}}@media (width<=760px){.app-shell{padding:14px}.hero{border-radius:20px;flex-direction:column;padding:26px 22px}.fullscreen-button{display:none}.tab-bar{grid-template-columns:1fr 1fr;position:static}.demo-panel{border-radius:18px;padding:20px}.concept-strip{grid-template-columns:1fr}.concept-strip article{border-right:0;border-bottom:1px solid var(--line)}.concept-strip article:last-child{border-bottom:0}.panel-heading{flex-direction:column}.input-line{grid-template-columns:1fr}.bit-place-grid{grid-template-columns:repeat(4,1fr)}.byte-row{grid-template-columns:.5fr .8fr .9fr 1.8fr;gap:6px;padding:11px 9px;font-size:.83rem}.encoding-output-grid,.quiz-grid{grid-template-columns:1fr}.sample-readout{grid-template-columns:1fr 1fr}.sample-readout>div{border-right:0}.channel-values{flex-direction:column}}.lead-copy{color:var(--muted);max-width:1150px;font-size:1.08rem;line-height:1.65}.lesson-introduction{background:linear-gradient(145deg,#fff 0%,#f5f2ff 100%)}.guided-section{scroll-margin-top:110px;transition:all .25s}.active-guided-section{border:3px solid #8d72e8;box-shadow:0 18px 45px #5f3dc424}.step-badge-row{grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0;display:grid}.step-badge-row.five-steps{grid-template-columns:repeat(5,1fr)}.step-badge{border:1px solid var(--line);color:var(--muted);background:#fff;border-radius:15px;align-items:center;gap:11px;padding:13px;display:flex}.step-badge span{width:34px;height:34px;color:var(--navy);background:#e9edf4;border-radius:50%;flex:none;place-items:center;font-weight:900;display:grid}.step-badge strong{line-height:1.25}.step-badge.active{border-color:var(--purple);background:var(--purple-soft);color:var(--purple);transform:translateY(-2px)}.step-badge.active span{background:var(--purple);color:#fff}.rule-callout,.warning-callout,.worked-example,.plain-explanation{border-radius:17px;margin:18px 0;padding:18px 20px}.rule-callout{background:var(--teal-soft);border-left:6px solid var(--teal)}.warning-callout{background:#fff6df;border-left:6px solid #d49a00}.worked-example{background:var(--purple-soft);border-left:6px solid var(--purple)}.plain-explanation{border:1px solid var(--line);background:#f7f9fc;margin:0}.rule-callout>strong,.warning-callout>strong,.worked-example>strong,.plain-explanation>strong{font-size:1.12rem}.rule-callout p,.warning-callout p,.worked-example p,.plain-explanation p{color:#344158;margin:8px 0 0;line-height:1.6}.final-rule-callout{margin-top:18px}.small-note{color:var(--muted);margin:10px 0 18px;line-height:1.5}.reference-block{border:1px solid var(--line);background:#fbfcfe;border-radius:18px;margin-top:18px;padding:18px}.reference-block h3{margin:0 0 5px}.reference-block p{color:var(--muted);margin:0 0 14px}.reference-two-column{grid-template-columns:.8fr 1.7fr;gap:14px;display:grid}.character-code-grid{grid-template-columns:repeat(13,1fr);gap:7px;display:grid}.character-code{min-width:0;color:var(--navy);background:#fff;border:1px solid #cbd4e1;border-radius:11px;padding:8px 4px}.character-code strong{font-size:1.3rem;display:block}.character-code span{color:var(--muted);margin-top:3px;font-size:.76rem;font-weight:800;display:block}.character-code:hover,.selected-character{border-color:var(--purple);background:var(--purple-soft);transform:translateY(-1px)}.compact-character-grid{grid-template-columns:repeat(5,1fr)}.lowercase-grid{grid-template-columns:repeat(13,1fr)}.lookup-result{background:var(--navy);color:#fff;border-radius:18px;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:10px 16px;margin:18px 0;padding:18px;display:grid}.lookup-result span{color:#bcc7da;text-transform:uppercase;letter-spacing:.045em;font-size:.8rem;font-weight:800}.lookup-result strong{font-size:1.07rem}.full-reference{border:1px solid var(--line);background:#fff;border-radius:15px;margin-top:18px}.full-reference summary{cursor:pointer;padding:15px 17px;font-weight:850}.ascii-table-wrap,.audio-table-wrap{border-top:1px solid var(--line);max-height:430px;overflow:auto}.ascii-table,.audio-table{border-collapse:collapse;width:100%}.ascii-table th,.ascii-table td,.audio-table th,.audio-table td{border-bottom:1px solid var(--line);text-align:left;padding:10px 13px}.ascii-table th,.audio-table th{background:var(--navy);color:#fff;z-index:1;position:sticky;top:0}.ascii-table tbody tr,.audio-table tbody tr{cursor:pointer}.ascii-table tbody tr:hover,.audio-table tbody tr:hover{background:var(--purple-soft)}.selected-ascii-row,.active-audio-row{box-shadow:inset 5px 0 0 var(--orange);background:var(--orange-soft)!important}.place-table{border:1px solid var(--line);background:#fff;border-radius:17px;margin-top:18px;overflow:hidden}.place-row{border-bottom:1px solid var(--line);grid-template-columns:minmax(170px,1.5fr) repeat(8,minmax(56px,1fr));align-items:stretch;display:grid}.place-row:last-of-type{border-bottom:0}.place-row>span{background:#f6f8fb;align-items:center;padding:13px;font-weight:850;display:flex}.place-row>strong{text-align:center;border-left:1px solid var(--line);padding:13px 6px;font-family:SFMono-Regular,Consolas,monospace;font-size:1.05rem}.place-heading-row>strong{background:var(--navy);color:#fff}.selected-bit{color:#fff;background:var(--purple)!important}.contribution-row>strong{color:var(--muted)}.place-equation{background:var(--teal-soft);margin:0;padding:14px 16px;line-height:1.55}.compact-place-table .place-row>span,.compact-place-table .place-row>strong{padding-top:9px;padding-bottom:9px}.nibble-reference{grid-template-columns:repeat(8,1fr);gap:8px;margin:18px 0;display:grid}.nibble-reference-cell{border:1px solid var(--line);text-align:center;background:#fff;border-radius:12px;padding:9px}.nibble-reference-cell span,.nibble-reference-cell strong,.nibble-reference-cell small{display:block}.nibble-reference-cell strong{margin:3px 0;font-size:1.25rem}.nibble-reference-cell small{color:var(--muted)}.selected-nibble{border-color:var(--orange);background:var(--orange-soft);box-shadow:0 6px 15px #e36c091f}.nibble-conversion-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px;display:grid}.nibble-conversion-card{background:#ffffffbd;border:1px solid #c9bdf5;border-radius:16px;padding:15px}.nibble-conversion-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.nibble-conversion-head>strong{color:var(--navy);font-size:1.04rem}.nibble-conversion-head>span{color:var(--purple);font-weight:900}.nibble-math-table{border:1px solid var(--line);background:#fff;border-radius:14px;overflow:hidden}.nibble-math-row{border-bottom:1px solid var(--line);grid-template-columns:minmax(112px,1.15fr) repeat(4,minmax(54px,1fr));align-items:stretch;display:grid}.nibble-math-row:last-child{border-bottom:0}.nibble-math-row>span{background:#f6f8fb;align-items:center;padding:10px;font-weight:850;display:flex}.nibble-math-row>strong{text-align:center;border-left:1px solid var(--line);padding:10px 6px;font-size:.92rem}.nibble-math-heading>strong{background:var(--navy);color:#fff}.nibble-result-row>strong{background:var(--teal-soft);color:#075c66}.extended-byte-header,.extended-byte-row{grid-template-columns:1.1fr .55fr 1fr 1fr 2fr}.extended-byte-header{background:var(--navy);color:#fff;font-weight:850}.image-grid-layout{grid-template-columns:1.2fr 1fr;align-items:stretch;gap:22px;display:grid}.toy-image-grid{background:#1f2b43;border:10px solid #1f2b43;border-radius:19px;grid-template-columns:repeat(5,1fr);gap:4px;min-height:360px;display:grid}.toy-pixel{color:#fff;text-transform:uppercase;text-align:center;place-items:center;min-height:75px;font-size:.7rem;font-weight:900;display:grid}.selected-toy-pixel{outline-offset:-8px;box-shadow:inset 0 0 0 10px var(--orange);z-index:1;outline:6px solid #fff}.pixel-preview small{margin-top:8px;font-size:1.25rem;display:block}.rgb-scale-guide{border:1px solid var(--line);background:#f7f9fc;border-radius:16px;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-bottom:18px;padding:14px 18px;display:grid}.rgb-scale-guide>div:not(.scale-line){flex-direction:column;display:flex}.rgb-scale-guide span{color:var(--muted);font-size:.82rem}.scale-line{background:linear-gradient(90deg,#000 0%,#fff 100%);border:1px solid #afb9c9;border-radius:99px;height:10px}.channel-conversion-stack{gap:16px;display:grid}.channel-conversion{border:1px solid var(--line);background:#fbfcfe;border-radius:18px;padding:16px}.conversion-heading{flex-wrap:wrap;align-items:center;gap:11px;margin-bottom:8px;display:flex}.conversion-heading>strong{min-width:80px;font-size:1.15rem}.conversion-heading>span{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 11px;font-weight:800}.pixel-byte-sequence{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.pixel-byte-sequence article{border:1px solid var(--line);text-align:center;border-radius:17px;padding:18px}.pixel-byte-sequence span,.pixel-byte-sequence small{color:var(--muted);font-weight:800;display:block}.pixel-byte-sequence strong{margin:10px 0;font-size:clamp(1rem,2vw,1.5rem);display:block}.size-preset-row{grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0;display:grid}.size-preset{border:2px solid var(--line);text-align:left;color:var(--navy);background:#fff;border-radius:15px;padding:15px}.size-preset strong,.size-preset span{display:block}.size-preset span{color:var(--muted);margin-top:4px}.selected-size{border-color:var(--purple);background:var(--purple-soft)}.size-calculation{flex-wrap:wrap;align-items:stretch;gap:12px;display:flex}.size-calculation>div{border:1px solid var(--line);background:#f8fafc;border-radius:16px;flex:220px;padding:18px}.size-calculation>b{align-self:center;font-size:1.6rem}.size-calculation span,.size-calculation small{color:var(--muted);display:block}.size-calculation strong{margin:8px 0;font-size:1.15rem;display:block}.audio-process-flow,.sample-conversion-flow{align-items:stretch;gap:10px;margin-top:20px;display:flex}.audio-process-flow>div,.sample-conversion-flow article{border:1px solid var(--line);background:#fff;border-radius:16px;flex:1;padding:15px}.audio-process-flow>b,.sample-conversion-flow>b{color:var(--purple);align-self:center;font-size:1.5rem}.audio-process-flow span{background:var(--purple);color:#fff;border-radius:50%;place-items:center;width:30px;height:30px;margin-bottom:8px;font-weight:900;display:grid}.audio-process-flow strong,.audio-process-flow small,.sample-conversion-flow span,.sample-conversion-flow strong{display:block}.audio-process-flow small,.sample-conversion-flow span{color:var(--muted);margin-top:4px}.sample-conversion-flow article>strong{margin:9px 0;font-size:clamp(1.3rem,2.5vw,2.1rem)}.sample-conversion-flow p{color:var(--muted);margin:0;line-height:1.4}.audio-scale-explanation{background:var(--teal-soft);color:#075c66;border-radius:15px;flex-wrap:wrap;gap:10px 22px;margin-bottom:13px;padding:13px 16px;display:flex}.audio-scale-explanation strong{width:100%}.detailed-wave-card svg{height:min(43vh,440px);overflow:visible}.guide-line{stroke:#dce2eb;stroke-width:2px;stroke-dasharray:6 6}.axis-label{fill:#5c687d;font:800 14px Inter,sans-serif}.sample{cursor:pointer}.sample-value-label{fill:var(--navy);paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;font:900 13px SFMono-Regular,Consolas,monospace}.sample-number-label{fill:#5c687d;font:800 12px Inter,sans-serif}.active-sample .sample-value-label{fill:var(--orange);font-size:16px}.audio-table-wrap{border:1px solid var(--line);border-radius:16px;max-height:480px}.audio-table td:nth-child(3),.audio-table td:nth-child(4),.audio-table td:nth-child(5){font-weight:750}@media (width<=1100px){.step-badge-row,.step-badge-row.five-steps{grid-template-columns:repeat(2,1fr)}.reference-two-column,.image-grid-layout,.nibble-conversion-grid{grid-template-columns:1fr}.character-code-grid,.lowercase-grid{grid-template-columns:repeat(10,1fr)}.sample-conversion-flow,.audio-process-flow{flex-wrap:wrap}.sample-conversion-flow article,.audio-process-flow>div{flex:40%}.sample-conversion-flow>b,.audio-process-flow>b{display:none}}@media (width<=760px){.step-badge-row,.step-badge-row.five-steps{grid-template-columns:1fr}.character-code-grid,.lowercase-grid{grid-template-columns:repeat(5,1fr)}.lookup-result{grid-template-columns:1fr}.lookup-result span{margin-top:8px}.place-table{overflow-x:auto}.place-row{min-width:720px}.nibble-reference{grid-template-columns:repeat(4,1fr)}.nibble-math-table{overflow-x:auto}.nibble-math-row{min-width:430px}.extended-byte-header,.extended-byte-row{grid-template-columns:1fr .5fr .8fr .8fr 1.6fr;min-width:650px}.byte-table{overflow-x:auto}.pixel-byte-sequence,.size-preset-row{grid-template-columns:1fr}.toy-image-grid{min-height:280px}.toy-pixel{min-height:52px}.sample-conversion-flow article,.audio-process-flow>div{flex-basis:100%}.audio-table{min-width:650px}}