:root{font-family:Arial,Helvetica,sans-serif;color:#f3efdf;background:#202923;font-synthesis:none;font-weight:400;--desk: #202923;--panel: #28332b;--inset: #19221c;--paper: #f3efdf;--ink: #273128;--muted: #bdc3b2;--brass: #d4b474;--bright: #edcf93;--rule: #495347;--paper-rule: #d6d5c3;color-scheme:dark;font-size:15px}*{box-sizing:border-box}body{margin:0;min-width:375px}button,input,select,textarea{font:inherit}button{cursor:pointer}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{color:inherit}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--brass);outline-offset:4px}::selection{background:var(--brass);color:var(--inset)}input,textarea{caret-color:#94713b}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2{font-family:Georgia,Times New Roman,serif;font-weight:400}h1{font-size:clamp(40px,4.5vw,62px);letter-spacing:-.035em;line-height:1.12;text-wrap:balance}h2{letter-spacing:-.025em}button{border:0;background:none}svg{vertical-align:middle;flex-shrink:0}abbr{text-decoration:none}button{touch-action:manipulation}button,select{min-height:44px}::-webkit-scrollbar{width:7px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#727c66;border-radius:6px}.app-shell{max-width:1320px;margin:auto;padding:0 48px}.site-header{height:106px;display:flex;align-items:center;gap:30px}.brand{display:inline-flex;align-items:center;font-family:Georgia,Times New Roman,serif;font-size:40px;font-weight:700;letter-spacing:-.05em;white-space:nowrap}.brand-period{color:var(--brass)}.brand-mark{display:flex;align-items:center;gap:7px;margin-right:15px}.brand-mark i{width:11px;height:11px;border-radius:50%;background:var(--brass)}.brand-mark b{width:29px;height:11px;border-radius:8px;background:var(--brass)}.brand-tagline{font-size:12px;color:var(--muted);padding-top:9px;letter-spacing:.015em}.header-actions{margin-left:auto;display:flex;align-items:center;gap:24px}.sound-button{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--brass)}.sound-button:hover,.about-button:hover{color:var(--bright)}.about-button{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}.main-nav{display:flex;gap:38px;height:58px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);align-items:stretch}.nav-tab{padding:0 0 1px;position:relative;display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted);white-space:nowrap}.nav-tab:hover{color:var(--paper)}.nav-tab.selected{color:var(--brass)}.nav-tab.selected:after{position:absolute;content:"";height:2px;bottom:-1px;left:0;right:0;background:var(--brass)}.nav-dot{width:5px;height:5px;border-radius:50%;background:var(--brass)}.nav-note{margin-left:auto;align-self:center;font-size:9px;letter-spacing:.15em;color:#a3ad99}.page-intro{padding:38px 0 33px;display:flex;align-items:center;justify-content:space-between;gap:20px}.page-intro p{color:var(--muted);font-size:14px;margin-top:14px;line-height:1.6}.intro-note{display:flex;gap:12px;align-items:flex-start;font-size:11px;line-height:1.7;color:var(--muted);padding:10px 3px 0 24px}.intro-note strong{font-weight:400;color:var(--paper)}.connection-dot{height:6px;width:6px;border-radius:50%;background:#bdc69c;margin-top:6px;box-shadow:0 1px 5px #111a12}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:24px;align-items:start}.paper{background:var(--paper);color:var(--ink);color-scheme:light}.station{min-width:0}.transcript{padding:18px 24px 15px;border-radius:10px 10px 0 0;position:relative;min-height:164px}.transcript:after{content:"";height:5px;position:absolute;bottom:-4px;left:0;right:0;background:radial-gradient(circle at 5px 5px,transparent 3px,var(--paper) 3.5px) 0 0/10px 5px;z-index:2}.transcript-top{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#626857;font-size:9px;letter-spacing:.13em;min-height:28px}.transcript-actions{display:flex;gap:4px;align-items:center}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;min-height:34px;border-radius:4px;color:#59624e}.icon-button:hover{background:#e5e3d2}.small-button{min-height:30px;padding:3px 10px;border:1px solid #c9cbb9;border-radius:4px;font-size:10px;color:#4b5546}.small-button:hover{background:#e1dfcd}.decoded{font-family:Courier New,ui-monospace,monospace;font-weight:600;letter-spacing:.045em;font-size:clamp(24px,2.4vw,34px);line-height:1.5;min-height:57px;max-height:148px;overflow:auto;overflow-wrap:anywhere;padding:7px 0 6px;white-space:pre-wrap}.sample{color:#7b806d}.ink-cursor{display:inline-block;width:2px;height:29px;margin:0 0 -3px 4px;background:#a28956}.transcript-bottom{display:flex;justify-content:space-between;align-items:center;gap:14px;border-top:1px solid var(--paper-rule);padding-top:11px;font-size:9px;color:#646958;min-height:28px}#live-code{font-family:ui-monospace,Courier New,monospace;letter-spacing:.1em;font-size:14px;font-weight:700;color:#636c57}#decode-state{text-align:right}.key-machine{position:relative;background:var(--panel);border:1px solid #5d664e;border-top:0;border-radius:0 0 10px 10px;padding:26px 26px 0;overflow:hidden}.machine-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;color:var(--muted);letter-spacing:.1em}.machine-top>span{display:flex;align-items:center;gap:8px}.signal-lamp{display:inline-block;width:7px;height:7px;border-radius:50%;background:#82906a;box-shadow:0 1px 3px #0c1a0f}.signal-lamp.is-sounding{background:var(--bright);box-shadow:0 2px 9px #d4b47460}.adaptive-badge{color:#d0b77e;font-size:8px}.key-zone{height:249px;display:flex;align-items:center;justify-content:center;position:relative;gap:36px}.key-line{width:70px;height:1px;background:#5a644c;position:relative}.key-line:before{content:"";position:absolute;width:5px;height:5px;border:1px solid #748061;border-radius:50%;left:-5px;top:-3px}.key-line.right:before{left:auto;right:-5px}.key-surround{flex-shrink:0;border-radius:50%;padding:9px;background:#1d271f;box-shadow:0 5px 14px #101b1680;border:1px solid #4c5743}.morse-key{position:relative;display:flex;align-items:center;justify-content:center;width:190px;height:190px;border-radius:50%;background:linear-gradient(135deg,#e0c28a,#bb975b 28%,#92723f 55%,#d1b277 81%,#b28b50);box-shadow:inset 0 1px 1px #ffedbf,0 5px 6px #0e1a1290;padding:12px;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .1s ease-out,box-shadow .1s ease-out}.morse-key:hover{background:linear-gradient(135deg,#ecd098,#c6a36a 35%,#af8c52 65%,#e0c28a)}.morse-key.held{transform:translateY(4px);box-shadow:inset 0 1px 2px #f0d599,0 1px 3px #0e1a1290}.morse-key:focus-visible{outline-offset:9px}.key-face{height:100%;width:100%;border:1px solid #121c15;border-radius:50%;background:radial-gradient(ellipse at 38% 25%,#384334,#252f26 75%);box-shadow:inset 0 3px 7px #0c170e99;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.key-mark{display:flex;align-items:center;gap:13px;margin-top:11px;color:var(--brass)}.key-mark i{height:13px;width:13px;border-radius:50%;background:currentColor}.key-mark b{height:13px;width:41px;border-radius:8px;background:currentColor}.key-label{font-size:9px;letter-spacing:.17em;color:#ddc387}.key-caption{text-align:center;font-family:Georgia,Times New Roman,serif;font-size:18px;color:#e3dfc7;margin-bottom:26px}.key-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #4a5543;padding:15px 0;color:#b5bda6;font-size:8px;letter-spacing:.08em}.key-bottom>span:first-child{display:flex;align-items:center;gap:6px}kbd{font-family:Arial,Helvetica,sans-serif;font-size:9px;letter-spacing:.07em;padding:4px 7px;border:1px solid #657057;border-bottom-width:2px;border-radius:4px;color:#dddcca}.key-bottom #adaptive-speed{letter-spacing:0;font-size:10px;white-space:nowrap}.station-note{display:flex;gap:12px;justify-content:space-between;align-items:center;font-size:10px;color:#b8c0aa;padding:8px 1px}.station-note>span{display:flex;align-items:center;gap:7px;line-height:1.5}.text-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0;min-height:36px;font-size:11px;color:#4a553f;font-weight:600}.text-button:hover{text-decoration:underline;text-underline-offset:4px}.text-button.light{color:var(--brass);white-space:nowrap;font-size:10px}.guide{padding:27px 27px 22px;border-radius:10px;min-height:557px}.guide h2{font-size:26px;line-height:1.18;max-width:250px}.guide>p{font-size:12px;line-height:1.8;color:#626854;margin-top:12px}.timing-legend{display:flex;gap:28px;margin:25px 0 19px}.timing-legend>div{display:grid;grid-template-columns:43px auto;column-gap:6px;row-gap:4px;align-items:center;font-size:12px}.timing-legend strong{font-size:13px;font-weight:500}.timing-legend>div>span:last-child{grid-column:2;font-size:10px;color:#676d5b}.signal-shape{display:block;background:#8d7545;height:8px;border-radius:5px;justify-self:center}.signal-shape.dot{width:8px}.signal-shape.dash{width:32px}.pause-guide{font-size:10px;color:#606751;display:grid;gap:10px;border-bottom:1px solid var(--paper-rule);padding-bottom:22px}.pause-guide>span{display:flex;align-items:center;gap:8px}.pause-guide i{height:6px;width:17px;border-left:1px solid #959b83;border-right:1px solid #959b83;background:#e0e1cf}.pause-guide>span:nth-child(2) i{width:30px}.pause-guide b{margin-left:auto;font-weight:400;white-space:nowrap}.speed-control{padding:22px 0 18px;border-bottom:1px solid var(--paper-rule)}.label-line{display:flex;align-items:baseline;justify-content:space-between;font-size:11px;gap:10px}.label-line>span{font-size:9px;color:#646958}.label-line strong{font-family:Georgia,Times New Roman,serif;font-size:23px;color:#34402c;font-weight:400;margin-right:3px}input[type=range]{appearance:none;width:100%;height:20px;padding:0;margin:12px 0 2px;cursor:pointer;background:transparent;accent-color:#8d7545;touch-action:pan-y}input[type=range]::-webkit-slider-runnable-track{height:3px;background:#c7c9b4;border-radius:3px}input[type=range]::-webkit-slider-thumb{appearance:none;width:15px;height:15px;border-radius:50%;background:#8b7346;border:3px solid #f2eddd;box-shadow:0 1px 4px #66674480;margin-top:-6px}input[type=range]::-moz-range-track{height:3px;background:#c7c9b4}input[type=range]::-moz-range-thumb{width:10px;height:10px;border:3px solid #f2eddd;background:#8b7346;border-radius:50%}.range-ends{display:flex;justify-content:space-between;font-size:8px;color:#686e5b}.audio-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 0;border-bottom:1px solid var(--paper-rule);font-size:10px}.audio-controls select{background:transparent;border:0;color:#59634c;font-size:10px;padding:0 17px 0 0;min-height:30px;cursor:pointer;max-width:142px}.audio-fallback{font-size:11px!important;background:#e4dfc8;padding:10px;border-radius:5px}.tip{padding-top:21px}.small-symbol{font-family:ui-monospace,Courier New,monospace;font-size:16px;letter-spacing:.08em;color:#796336}.tip h3{font-family:Georgia,Times New Roman,serif;font-weight:400;font-size:18px;margin:12px 0 8px}.tip p{font-size:11px;line-height:1.8;color:#626854;margin-bottom:8px}.tip p strong{font-weight:600}.reference{margin:31px 0 36px}.reference-heading{display:flex;align-items:center;gap:20px;margin-bottom:16px}.reference-heading h2{font-size:25px;color:#e7e3cf}.reference-heading>span{font-size:11px;color:var(--muted);margin-top:4px}.reference-heading>button{margin-left:auto}.alphabet{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}.letter-tile{display:flex;justify-content:space-between;align-items:center;gap:8px;border:1px solid #4b5746;border-radius:6px;padding:15px 16px;min-height:60px}.letter-tile:hover{background:#303c2e;border-color:#918563}.letter-tile>span{font-family:Georgia,Times New Roman,serif;font-size:23px;color:#f3efdf}.letter-tile>b{font-family:ui-monospace,Courier New,monospace;letter-spacing:.035em;font-size:17px;color:var(--brass);font-weight:500;white-space:nowrap}.alphabet.expanded{grid-template-columns:repeat(9,minmax(0,1fr))}.alphabet.expanded .letter-tile{padding:12px}.alphabet.expanded .letter-tile>b{font-size:14px}.site-footer{border-top:1px solid var(--rule);padding:24px 0 26px;display:flex;align-items:center;gap:12px;color:#adb7a1;font-size:10px}.footer-mark{font-family:Georgia,Times New Roman,serif;font-size:21px;color:var(--brass);margin-right:1px;line-height:1}.site-footer>span:nth-child(3){margin-left:auto;font-size:8px;letter-spacing:.1em}.site-footer button{display:flex;align-items:center;gap:7px;color:var(--brass);font-size:10px;margin-left:16px;min-height:24px}.toast{position:fixed;bottom:24px;left:50%;max-width:calc(100% - 32px);transform:translate(-50%,12px);padding:15px 22px;background:var(--paper);color:var(--ink);box-shadow:0 8px 30px #0b170f66;border-radius:8px;font-size:12px;line-height:1.5;opacity:0;pointer-events:none;transition:opacity .2s ease-out,transform .2s ease-out;z-index:20}.toast.visible{opacity:1;transform:translate(-50%)}dialog{border:0;border-radius:14px;background:var(--paper);color:var(--ink);color-scheme:light;max-width:500px;width:calc(100% - 36px);padding:42px;box-shadow:0 16px 80px #0d180f88}dialog::backdrop{background:#101b14b8}dialog h2{font-size:33px;line-height:1.2;margin-bottom:22px}dialog p,dialog li{font-size:13px;line-height:1.8;margin-bottom:14px}dialog ol{padding-left:20px;margin:20px 0}dialog .primary-button{margin-top:12px}dialog kbd{color:var(--ink)}.dialog-mark{display:block;color:#796336;font-size:32px;font-family:Georgia,Times New Roman,serif;margin-bottom:20px}.dialog-close{position:absolute;top:12px;right:12px}.primary-button,.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:11px 18px;border-radius:5px;font-size:12px;font-weight:500}.primary-button{background:#344431;color:#fffced}.primary-button:hover{background:#45563c}.outline-button{border:1px solid #b9bea6;color:#47553c}.outline-button:hover{background:#e6e6d5}.full{width:100%;margin-top:12px}.result{font-size:11px;line-height:1.75;color:#5c674f;margin-top:17px;min-height:38px}.target-strip{display:flex;align-items:center;gap:16px;padding:16px 22px;background:#354331;border:1px solid #5c694d;border-radius:8px;margin-bottom:16px;flex-wrap:wrap}.target-strip>span:first-child{font-size:9px;color:var(--muted);letter-spacing:.12em}.target-strip>strong{font-family:Courier New,monospace;font-size:21px;letter-spacing:.15em;color:var(--bright);overflow-wrap:anywhere}.target-strip>span:last-child{margin-left:auto;font-family:ui-monospace,monospace;font-size:14px;color:var(--brass);letter-spacing:.1em;overflow-wrap:anywhere}.lesson-progress{display:flex;justify-content:space-between;font-size:10px;margin:24px 0 10px}.lesson-progress strong{font-weight:400}progress{display:block;width:100%;height:4px;appearance:none;border:0;background:#d4d6bf}progress::-webkit-progress-bar{background:#d4d6bf;border-radius:3px}progress::-webkit-progress-value{background:#796336;border-radius:3px}progress::-moz-progress-bar{background:#796336}.learned-letters{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;max-height:200px;overflow:auto}.learned-letters button{font-family:Georgia,Times New Roman,serif;font-size:25px;border:1px solid #bec4ad;min-width:70px;padding:10px;border-radius:5px}.learned-letters button:hover{background:#e4e5d2}.learned-letters small{display:block;font-family:ui-monospace,monospace;font-size:13px;color:#796336;margin-top:4px}.guide .lesson-instruction{margin-top:18px;font-size:11px}.lesson-guide .speed-control{margin-top:6px;border-top:1px solid var(--paper-rule);border-bottom:0}.word-target{display:flex;align-items:center;flex-direction:column;gap:14px;text-align:center;border-top:1px solid var(--paper-rule);border-bottom:1px solid var(--paper-rule);padding:23px 0;margin-top:22px}.word-target>span:first-child{font-size:9px;letter-spacing:.1em}.word-target>strong{font-size:30px;letter-spacing:.08em;font-family:Georgia,Times New Roman,serif;font-weight:400}.word-target>span:last-child{font-family:ui-monospace,monospace;color:#796336;font-size:14px;overflow-wrap:anywhere;max-width:100%}.practice-tabs{display:inline-flex;background:#18221b;border:1px solid #4b5746;border-radius:7px;padding:4px;margin-bottom:24px;gap:4px}.practice-tabs button{font-size:12px;padding:0 22px;min-height:38px;color:var(--muted);border-radius:4px}.practice-tabs button.selected{background:#d1b277;color:#202923}.player-panel,.listening-panel{border-radius:10px;padding:30px;min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.panel-heading h2{font-size:28px}.small-stamp{font-size:9px;letter-spacing:.12em;color:#667057;white-space:nowrap}.player-panel>label,#guess-form>label{display:block;font-size:12px;margin-bottom:10px}.player-panel textarea{display:block;resize:vertical;background:#fcfaef;border:1px solid #bfc4ab;border-radius:6px;padding:16px;color:#33412e;width:100%;min-height:125px;max-height:300px;font-family:Georgia,Times New Roman,serif;font-size:25px;line-height:1.5}.message-meta{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#626a54;margin-top:10px}.morse-output{display:flex;flex-wrap:wrap;gap:12px 5px;padding:22px 0;min-height:122px;border-bottom:1px solid var(--paper-rule);margin-bottom:22px;max-height:300px;overflow:auto}.morse-char{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:8px;min-width:38px;border-radius:4px;padding:7px 6px}.morse-char b{font-family:ui-monospace,Courier New,monospace;font-size:18px;font-weight:600;color:#796336}.morse-char small{font-size:9px;color:#626d55}.morse-char.word-space{min-width:30px}.morse-char.word-space b{color:#9c9e86}.morse-char.word-space small{font-size:7px}.morse-char.current-char{background:#ddd0a7}.empty-code{font-size:13px;color:#667057;align-self:center}.player-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.play-lamp{width:13px;height:13px;background:#9ba689;border-radius:50%;display:inline-block;border:3px solid #e2e4d1;box-shadow:0 1px 4px #7a806350;flex-shrink:0}.play-lamp.is-sounding{background:#936f2d;border-color:#ddc481;box-shadow:0 2px 9px #a7854240}.player-actions>.play-lamp{margin-left:auto}.sample-messages{border-top:1px solid var(--paper-rule);margin-top:24px;padding-top:16px;display:flex;gap:9px;align-items:center;flex-wrap:wrap}.sample-messages>span{font-size:8px;letter-spacing:.12em;margin-right:4px}.sample-messages>button{min-height:32px;background:#e6e6d4;color:#5a654b;padding:5px 10px;border-radius:4px;font-size:10px}.sample-messages>button:hover{background:#d8dbc1}.listening-panel>p{font-size:13px;line-height:1.8;color:#646c57;max-width:50ch}.listening-stage{min-height:238px;border:1px solid #d0d3bd;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px;margin:23px 0}.listening-stage>.play-lamp{width:20px;height:20px;border-width:4px}.mystery-word{font-family:Georgia,Times New Roman,serif;font-size:35px;letter-spacing:.15em;color:#4c5b40}.listening-stage #play-state{font-size:11px;color:#626a54}.input-row{display:flex;gap:10px}.input-row>input{min-width:0;flex:1;width:100%;border:1px solid #bfc4ab;background:#fcfaef;border-radius:5px;padding:12px;color:var(--ink);text-transform:uppercase;font-size:14px}.input-row>input::placeholder{font-size:12px;text-transform:none;color:#646a54}.listen-actions{display:flex;justify-content:space-between;gap:16px;margin-top:13px}@media(min-width:1500px){.app-shell{max-width:1400px;padding:0 64px}.workspace{grid-template-columns:minmax(0,1fr) 340px}.key-zone{height:270px}.morse-key{width:206px;height:206px}.guide{min-height:578px}}@media(max-width:1100px){.app-shell{padding:0 32px}.workspace{grid-template-columns:minmax(0,1fr) 295px;gap:20px}.site-header{gap:22px}.brand-tagline{font-size:10px}.main-nav{gap:30px}.guide{padding:24px}.key-zone{gap:22px}.key-line{width:35px}.letter-tile{padding:14px 11px}.letter-tile>b{font-size:14px}.alphabet.expanded{grid-template-columns:repeat(6,minmax(0,1fr))}.key-bottom{letter-spacing:0;font-size:7px}.station-note{font-size:9px}.intro-note{font-size:10px;padding-left:0}.nav-note{font-size:8px}.reference-heading h2{font-size:24px}}@media(max-width:800px){.app-shell{padding:0 24px}.site-header{height:88px}.brand{font-size:35px}.brand-tagline{display:none}.main-nav{gap:26px}.nav-note{display:none}.page-intro{padding:32px 0 27px}.intro-note{display:none}.workspace{grid-template-columns:minmax(0,1fr) 265px;gap:16px}.guide{padding:23px 20px}.guide h2{font-size:24px}.key-machine{padding:24px 18px 0}.adaptive-badge{font-size:7px;letter-spacing:.01em}.machine-top{font-size:8px;letter-spacing:.04em}.key-zone{height:256px;gap:0}.key-line{display:none}.morse-key{width:177px;height:177px}.key-caption{font-size:16px}.key-bottom{flex-direction:column;gap:12px;padding:14px 0}.station-note{align-items:flex-start}.station-note>span{max-width:190px}.transcript{padding:15px 19px}.transcript-bottom{gap:8px;align-items:flex-start}.transcript-bottom #decode-state{font-size:8px;max-width:115px;line-height:1.5}.transcript-bottom #live-code{font-size:12px}.decoded{font-size:24px;min-height:60px}.timing-legend{gap:16px}.alphabet{gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}.letter-tile{padding:12px 16px}.letter-tile>b{font-size:18px}.reference-heading{gap:14px}.reference-heading>span{font-size:9px}.site-footer>span:nth-child(3){display:none}.site-footer>button{margin-left:auto}.player-panel,.listening-panel{padding:24px}.panel-heading{flex-wrap:wrap;gap:8px}.panel-heading h2{font-size:26px}.player-actions{gap:8px}.player-actions>.play-lamp{display:none}.player-actions>button{padding:10px 12px}.sample-messages>span{width:100%}.input-row{flex-wrap:wrap}.input-row>input{flex-basis:100%}.listening-workspace .guide{min-height:0}}@media(max-width:650px){.app-shell{padding:0 20px}.site-header{height:82px;gap:12px}.brand{font-size:34px}.brand-mark{gap:5px;margin-right:10px}.brand-mark i{width:9px;height:9px}.brand-mark b{width:23px;height:9px}.header-actions{gap:13px}.sound-button{gap:6px;font-size:10px;padding:0}.sound-button svg{width:16px}.about-button{font-size:10px;gap:6px;padding:0}.about-button svg{display:none}.main-nav{gap:16px;overflow-x:auto;scrollbar-width:none;height:56px}.main-nav::-webkit-scrollbar{display:none}.nav-tab{font-size:11px;flex-shrink:0}.nav-dot{width:4px;height:4px}.page-intro{padding:30px 0 25px}.page-intro h1{font-size:42px;max-width:360px;line-height:1.1}.page-intro p{font-size:12px;line-height:1.8;max-width:340px;margin-top:13px}.workspace{grid-template-columns:1fr;gap:20px}.transcript{padding:12px 19px 15px;min-height:153px}.transcript-top{font-size:8px}.transcript-actions{gap:6px}.transcript-actions .icon-button{width:34px;min-height:40px}.transcript-actions .small-button{min-height:36px}.decoded{font-size:26px;min-height:54px;max-height:130px;padding-top:3px}.transcript-bottom{align-items:center}.transcript-bottom #decode-state{font-size:8px;max-width:160px}.transcript-bottom #live-code{font-size:13px}.key-machine{padding:24px 22px 0}.machine-top{font-size:8px;letter-spacing:.06em}.adaptive-badge{font-size:7px}.key-zone{height:251px}.morse-key{width:194px;height:194px}.key-caption{font-size:18px;margin-bottom:25px}.key-bottom{flex-direction:row;padding:17px 0;gap:8px;font-size:7px}.key-bottom>span:first-child{gap:5px}.key-bottom #adaptive-speed{font-size:9px}.key-bottom kbd{font-size:8px;padding:3px 5px}.station-note{font-size:9px;padding:8px 0 0;align-items:center}.station-note>span{max-width:225px}.station-note>.text-button{font-size:9px}.guide{min-height:0;padding:26px}.guide h2{font-size:28px;max-width:none}.guide>p{font-size:12px}.guide>p br{display:none}.timing-legend{gap:45px;margin:25px 0 20px}.timing-legend>div{grid-template-columns:48px auto}.pause-guide{font-size:11px;gap:13px}.speed-control{padding-top:21px}.label-line{font-size:12px}.range-ends{font-size:9px}.audio-controls{font-size:11px;padding:9px 0}.audio-controls select{font-size:11px;min-height:40px;max-width:160px}.tip{padding-top:19px}.tip h3{font-size:21px;margin-top:12px}.tip p{font-size:12px}.tip .text-button{font-size:12px;min-height:44px}.reference{margin:29px 0 28px}.reference-heading{flex-wrap:wrap;gap:0 12px;margin-bottom:12px}.reference-heading h2{font-size:25px;flex:1}.reference-heading>span{display:none}.reference-heading>.text-button{font-size:10px}.alphabet{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.letter-tile{flex-direction:column;gap:6px;padding:12px 6px}.letter-tile>span{font-size:25px}.letter-tile>b{font-size:16px}.alphabet.expanded{grid-template-columns:repeat(4,minmax(0,1fr))}.alphabet.expanded .letter-tile{padding:12px 5px}.alphabet.expanded .letter-tile>b{font-size:14px}.site-footer{flex-wrap:wrap;gap:8px;padding:21px 0;font-size:9px}.site-footer>button{font-size:9px}.footer-mark{font-size:19px}.target-strip{padding:15px 18px;gap:12px}.target-strip>span:last-child{flex-basis:100%;margin:0;font-size:13px}.target-strip>strong{font-size:23px}.lesson-guide .speed-control{margin-top:16px}.practice-tabs{margin-bottom:20px}.practice-tabs button{font-size:11px;min-height:40px}.player-panel,.listening-panel{padding:24px}.panel-heading h2{font-size:29px}.panel-heading{margin-bottom:24px}.small-stamp{font-size:8px}.player-panel textarea{font-size:25px}.message-meta{font-size:8px}.player-actions>button{font-size:11px;padding:12px 14px}.player-actions>.play-lamp{display:block}.sample-messages{gap:8px}.sample-messages>button{min-height:40px}.sample-messages>span{font-size:9px}.player-workspace .guide{min-height:0}.input-row{flex-wrap:nowrap}.input-row>input{flex-basis:auto}.listening-panel>p{font-size:12px}.result{font-size:12px}.lesson-progress{font-size:11px}dialog{padding:36px 28px}dialog h2{font-size:31px}dialog p{font-size:12px}.toast{width:max-content;font-size:12px;bottom:16px}.outline-button,.primary-button{min-height:46px}input[type=range]{height:30px;margin-top:9px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.morse-key.held{transform:none;filter:brightness(1.12)}}.paper button:focus-visible,.paper input:focus-visible,.paper select:focus-visible,.paper textarea:focus-visible,dialog button:focus-visible{outline-color:#796336}@media(pointer:coarse){button,.transcript-actions .icon-button,.transcript-actions .small-button{min-height:44px}.icon-button,.transcript-actions .icon-button{width:44px}}
