.decoder-page{background:#f4f0e6}.decoder-hero{padding-bottom:34px}.decoder-shell{padding:clamp(18px,3vw,30px);border:1px solid #d8cfbc;border-radius:22px;background:#fffdf7;box-shadow:var(--shadow)}.decoder-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.decoder-heading h2{margin:3px 0 0;font-size:clamp(21px,3vw,30px)}.decoder-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch;margin-top:22px}.decoder-panel{display:grid;gap:8px;padding:16px;border:1px solid #e0d8c9;border-radius:14px;background:#fff}.decoder-panel>label,.decoder-result-heading{font-size:11px;font-weight:900;color:#4c5d55}.decoder-panel select,.decoder-panel textarea{width:100%;border:1px solid #bfc8c1;border-radius:8px;background:#fffdf8;color:#203028;font:500 14px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace}.decoder-panel select{padding:9px 10px;font-family:inherit}.decoder-panel textarea{min-height:230px;padding:11px;resize:vertical}.decoder-result{background:#f7fbf7}.decoder-result-heading{display:flex;justify-content:space-between;gap:10px}.decoder-result-heading small{font-weight:700;color:#64746b}.decoder-actions,.decoder-output-actions{display:flex;align-items:center;gap:8px;margin-top:3px}.decoder-output-actions .status{margin:0}.decoder-guide{display:grid;grid-template-columns:.75fr 1.25fr;gap:50px;margin:62px 0}.decoder-guide h2{margin:0;font:900 clamp(27px,4vw,42px)/1.25 serif}.decoder-guide-grid{display:grid;gap:12px}.decoder-guide article{padding:18px;border-top:1px solid #cfc6b5;background:#fbf8f0}.decoder-guide article b{color:#1a5042;font-size:13px}.decoder-guide article p{margin:8px 0 0;color:#526159;font-size:13px;line-height:1.8}@media(max-width:760px){.decoder-grid{grid-template-columns:1fr}.decoder-grid .flow-arrow{display:none}.decoder-guide{grid-template-columns:1fr;gap:22px;margin:42px 0}.decoder-panel textarea{min-height:180px}}@media(max-width:520px){.decoder-heading{align-items:stretch;flex-direction:column}.decoder-heading .text-button{align-self:flex-start}.decoder-actions,.decoder-output-actions{align-items:stretch;flex-direction:column}.decoder-actions button,.decoder-output-actions button{width:100%}}