.dt-layout{display:grid;grid-template-columns:minmax(0,1fr) 245px;align-items:start;gap:30px}.dt-panel{min-width:0}.dt-heading .eyebrow{color:var(--teal);font-size:.72rem}.dt-heading h2{font-size:2rem;margin:12px 0}.dt-heading>p:last-child{font-size:.95rem;color:var(--muted);line-height:1.8;max-width:65ch}.dt-player{display:grid;grid-template-columns:65px minmax(0,1fr);align-items:center;gap:22px;padding:24px;background:var(--pale);border:1px solid #c5e0e9;border-radius:16px;margin:24px 0 6px}.dt-sound{display:flex;align-items:center;gap:4px;justify-content:center;color:var(--teal)}.dt-sound>svg{width:32px;height:32px;flex:none}.dt-sound>span{width:3px;height:12px;background:var(--teal);border-radius:3px}.dt-sound>span:nth-child(3){height:28px}.dt-sound>span:last-child{height:19px}.is-speaking .dt-sound>span{animation:dt-wave .7s ease-in-out infinite alternate}.is-speaking .dt-sound>span:nth-child(3){animation-delay:.2s}.is-speaking .dt-sound>span:last-child{animation-delay:.4s}.dt-audio-buttons{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.dt-audio-buttons .button{font-size:.9rem;min-height:46px;padding:11px 16px}.dt-audio-buttons .button>svg{width:21px;height:21px}.dt-audio-buttons .button:disabled{opacity:.5;cursor:default}.dt-stop{font-size:.86rem;font-weight:800;color:var(--muted);background:transparent;min-height:44px;padding:9px}.dt-stop:disabled{opacity:.45}.dt-player [role=status]{font-size:.8rem;line-height:1.65;margin-top:13px;color:var(--muted)}.dt-adult{margin-bottom:22px}.dt-adult>.lp-hint-button{font-size:.8rem;color:var(--muted);font-weight:700}.dt-adult #dt-reader:not([hidden]){padding:20px;background:#fff8da;border:1px solid #e5d69f;border-radius:12px}.dt-adult strong{font-size:.92rem}.dt-adult p{margin:15px 0;font-size:1.18rem;line-height:1.8}.dt-adult small{font-size:.8rem;line-height:1.6;display:block}.dt-panel form>label{font-weight:900;display:block;font-size:1rem;margin-bottom:12px}.dt-panel textarea{display:block;resize:vertical;width:100%;min-height:165px;border:1.5px solid #a5bdc9;border-radius:12px;background:#fffef8;color:var(--ink);font-family:var(--font-body);font-size:1.15rem;line-height:1.95;padding:20px;box-sizing:border-box}.dt-panel textarea:focus-visible{outline:3px solid var(--teal);outline-offset:4px}.dt-panel textarea:disabled{opacity:.85;background:#f5faf7}.dt-panel #dt-writing-help{font-size:.8rem;color:var(--muted);margin:12px 0}.dt-accents{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0 0}.dt-accents>button{min-width:44px;min-height:44px;border:1px solid var(--line);border-bottom:3px solid #bed6e1;border-radius:8px;font-size:1.05rem;color:var(--ink);background:white;font-weight:800}.dt-accents>button:hover:not(:disabled){background:var(--pale)}.dt-accents>button:disabled{opacity:.45}.dt-panel form .button:disabled{background:var(--line);color:var(--muted)}.dt-correction{margin-top:28px}.dt-correction .dt-correction-label{font-size:.77rem;font-weight:800;color:var(--muted);margin:15px 0 6px}.dt-correction .dt-model{font-size:1.14rem;line-height:1.9;font-weight:800}.dt-errors{padding-left:20px;font-size:.93rem;line-height:1.9;margin:16px 0}.dt-errors strong{display:inline}.dt-rule{background:#ffffffbd;padding:16px 18px;border-radius:10px;margin:16px 0}.dt-rule>strong{font-size:.84rem}.dt-rule>p{font-size:.92rem}.dt-guide{background:var(--pale);border:1px solid #cfe3ea;border-radius:20px;padding:24px;text-align:center;position:sticky;top:105px}.dt-guide>.lp-lily{width:135px;max-width:100%;margin:0 auto 22px}.dt-guide .eyebrow{font-size:.65rem;color:var(--teal)}.dt-guide h3{font-size:1.45rem;margin:12px 0 16px}.dt-guide p:not(.eyebrow){font-size:.93rem;line-height:1.8}.dt-guide .lp-hint-button{text-align:center;margin-top:12px}.dt-guide [hidden]{display:none}.dt-guide #dt-hint{padding:15px;background:white;border-radius:12px;margin-top:10px;font-size:.85rem}.dt-result>.lp-lily{width:90px;margin:0 auto 22px}.dt-recap{padding:0;list-style:none;margin:26px 0;text-align:left;display:grid;gap:14px}.dt-recap>li{border:1px solid var(--line);background:white;padding:18px 22px;border-radius:12px}.dt-recap>li>span{font-size:.75rem;color:var(--teal);font-weight:900}.dt-recap>li>p{font-size:1.05rem;margin:8px 0 12px;line-height:1.85}.dt-recap small{font-size:.84rem;line-height:1.7;display:block}.lp-art-dictation{background:#edf8f5}.lp-demo-audio{display:flex;align-items:center;gap:7px;padding:18px 24px;background:white;border:1px solid #9ebfbb;border-radius:14px;box-shadow:0 4px 0 #cfdfd9}.lp-demo-audio>b{background:var(--yellow);border:1px solid var(--ink);border-radius:50%;width:48px;height:48px;display:grid;place-items:center;font-size:1.1rem;margin-right:10px}.lp-demo-audio>i{width:5px;height:22px;border-radius:5px;background:var(--teal)}.lp-demo-audio>i:nth-child(3){height:42px}.lp-demo-audio>i:nth-child(4){height:31px}.lp-demo-audio>i:nth-child(5){height:50px}
@keyframes dt-wave{to{transform:scaleY(.45)}}
@media(max-width:1050px){.dt-layout{grid-template-columns:minmax(0,1fr) 205px;gap:20px}.dt-player{grid-template-columns:1fr;padding:20px;gap:12px}.dt-sound{justify-content:flex-start}.dt-guide{padding:20px 16px}}
@media(max-width:820px){.dt-layout{grid-template-columns:1fr}.dt-guide{position:static;display:flex;align-items:center;gap:20px;text-align:left}.dt-guide>.lp-lily{width:85px;flex:none;margin:0}.dt-guide .lp-hint-button{text-align:left}}
@media(max-width:560px){.dt-heading h2{font-size:1.6rem}.dt-heading>p:last-child{font-size:.89rem}.dt-player{padding:17px 14px}.dt-audio-buttons{gap:9px}.dt-audio-buttons .button{font-size:.85rem;padding:11px 13px}.dt-audio-buttons .button:first-child{width:100%;justify-content:center}.dt-player [role=status]{font-size:.77rem}.dt-panel textarea{font-size:1.05rem;padding:15px;line-height:1.9;min-height:165px}.dt-accents{gap:7px}.dt-accents>button{min-width:44px;min-height:44px}.dt-guide{padding:18px 15px;gap:14px}.dt-guide>.lp-lily{width:66px}.dt-guide h3{font-size:1.25rem}.dt-guide p:not(.eyebrow){font-size:.87rem}.dt-correction .dt-model{font-size:1.05rem}.dt-rule{padding:13px}.dt-errors{font-size:.85rem}.dt-recap>li{padding:15px}.dt-panel>.lp-progress{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.dt-sound>span{animation:none!important}}