body.is-dn-page{font-family:var(--hp-font);color:var(--hp-color-text);background-color:var(--hp-color-bg-soft)}body.is-dn-page .hclass-main{min-height:0}.dn-bg-mesh{inset:-10%;background:radial-gradient(circle at 12% 18%,rgba(59,130,246,.1),transparent 40%),radial-gradient(circle at 88% 12%,rgba(99,102,241,.08),transparent 42%),radial-gradient(circle at 50% 95%,rgba(99,102,241,.05),transparent 45%);filter:blur(22px)}.dn-bg-grid,.dn-bg-mesh{position:fixed;pointer-events:none;z-index:0}.dn-bg-grid{inset:0;background-image:linear-gradient(rgba(15,23,42,.035) 1px,transparent 0),linear-gradient(90deg,rgba(15,23,42,.035) 1px,transparent 0);background-size:32px 32px;-webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 90%);mask-image:radial-gradient(ellipse 80% 60% at 50% 30%,#000 30%,transparent 90%)}body.is-dn-page .hclass-main>:not(.dn-bg-mesh):not(.dn-bg-grid){position:relative;z-index:1}.dn-container{max-width:var(--hp-container);margin:0 auto;padding:0 var(--hp-space-6)}@media (max-width:720px){.dn-container{padding:0 var(--hp-space-5)}}.dn-section{position:relative;padding:clamp(56px,8vw,96px) 0;overflow:hidden}.dn-section-inner{position:relative;z-index:1}.dn-section-tint{position:absolute;inset:0;pointer-events:none;z-index:0}.dn-tint-blue{background:linear-gradient(180deg,rgba(59,130,246,.05),transparent 60%)}.dn-tint-violet{background:linear-gradient(180deg,rgba(99,102,241,.04),transparent 60%)}.dn-grid-7-5{grid-template-columns:7fr 5fr}.dn-grid-5-7,.dn-grid-7-5{display:grid;gap:clamp(28px,4vw,56px);align-items:center}.dn-grid-5-7{grid-template-columns:5fr 7fr}.dn-grid-6-6{display:grid;grid-template-columns:6fr 6fr;gap:clamp(24px,3.5vw,40px);align-items:stretch}@media (max-width:960px){.dn-grid-5-7,.dn-grid-6-6,.dn-grid-7-5{grid-template-columns:1fr}.dn-grid-5-7>:first-child{order:2}}.dn-section-head{text-align:center;max-width:720px;margin:0 auto var(--hp-space-12)}.dn-section-head .dn-feat-num{display:inline-block}.dn-h1{font-size:var(--hp-fs-h1);font-weight:700;line-height:1.12;letter-spacing:-.02em;color:var(--hp-color-text);margin:var(--hp-space-5) 0 var(--hp-space-4)}.dn-h1-em{display:inline-block;color:var(--hp-color-primary)}.dn-h2{font-size:var(--hp-fs-h2);font-weight:700;line-height:1.18;letter-spacing:-.02em;color:var(--hp-color-text);margin:var(--hp-space-4) 0 var(--hp-space-3)}.dn-lead{font-size:var(--hp-fs-16);max-width:560px;margin:0 0 var(--hp-space-6)}.dn-lead,.dn-sub{color:var(--hp-color-text-soft);line-height:1.6}.dn-sub{font-size:var(--hp-fs-15);margin:var(--hp-space-3) 0 var(--hp-space-6)}.dn-grad-text{background:var(--hp-grad-primary);-webkit-background-clip:text;background-clip:text}.dn-grad-text,.dn-grad-text-light{-webkit-text-fill-color:transparent}.dn-grad-text-light{background:linear-gradient(90deg,#fff,#fde6f1);-webkit-background-clip:text;background-clip:text}.dn-feat-num{font-family:JetBrains Mono,ui-monospace,monospace;background:rgba(37,99,235,.08);color:var(--hp-color-primary);padding:5px 12px;letter-spacing:.08em}.dn-badge,.dn-feat-num{font-size:var(--hp-fs-12);font-weight:700;border-radius:var(--hp-radius-pill);text-transform:uppercase}.dn-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);letter-spacing:.04em}.dn-badge-light{background:rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(6px)}.dn-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--hp-color-primary);box-shadow:0 0 0 0 rgba(37,99,235,.4);animation:dn-pulse-dot 1.8s var(--hp-ease) infinite}.dn-badge-light .dn-badge-dot{background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.5)}@keyframes dn-pulse-dot{0%{box-shadow:0 0 0 0 rgba(37,99,235,.4)}70%{box-shadow:0 0 0 8px rgba(37,99,235,0)}to{box-shadow:0 0 0 0 rgba(37,99,235,0)}}.dn-btn-primary{position:relative;display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:var(--hp-radius-sm);background:var(--hp-grad-primary);color:#fff;font-weight:700;font-size:var(--hp-fs-14);box-shadow:var(--hp-shadow-cta);transition:transform var(--hp-dur) var(--hp-ease),box-shadow var(--hp-dur) var(--hp-ease);overflow:hidden;text-decoration:none}.dn-btn-primary:hover{transform:translateY(-2px);box-shadow:var(--hp-shadow-cta-hover);color:#fff}.dn-btn-primary .hi{font-size:16px}.dn-btn-shine{position:absolute;top:0;left:-50%;width:50%;height:100%;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:skewX(-20deg);animation:dn-shine 4.5s var(--hp-ease) infinite}@keyframes dn-shine{0%{left:-50%}70%{left:130%}to{left:130%}}.dn-btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:var(--hp-radius-sm);background:var(--hp-color-bg);color:var(--hp-color-text);border:1px solid var(--hp-color-border);font-weight:700;font-size:var(--hp-fs-14);text-decoration:none;transition:border-color var(--hp-dur) var(--hp-ease),transform var(--hp-dur) var(--hp-ease)}.dn-btn-ghost:hover{border-color:var(--hp-color-primary);color:var(--hp-color-primary);transform:translateY(-1px)}.dn-btn-ghost-light{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;backdrop-filter:blur(6px)}.dn-btn-ghost-light:hover{background:rgba(255,255,255,.2);color:#fff;border-color:#fff}.dn-btn-lg{padding:14px 26px;font-size:var(--hp-fs-15)}.dn-btn-sm{padding:8px 14px;font-size:var(--hp-fs-13)}.dn-cta-row{display:flex;gap:var(--hp-space-3);flex-wrap:wrap;align-items:center;margin-top:var(--hp-space-2)}.dn-cta-row-center{justify-content:center}.dn-reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--hp-ease),transform .7s var(--hp-ease)}.dn-reveal.in{opacity:1;transform:translateY(0)}kbd{display:inline-flex;align-items:center;padding:2px 7px;border-radius:6px;background:var(--hp-color-bg);border:solid var(--hp-color-border);border-width:1px 1px 2px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;font-weight:700;color:var(--hp-color-text-soft);line-height:1.4}.dn-hero{position:relative;padding:clamp(56px,8vw,110px) 0 clamp(48px,6vw,80px);overflow:hidden}.dn-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}@media (max-width:980px){.dn-hero-grid{grid-template-columns:1fr}}.dn-hero-left{z-index:2}.dn-hero-left,.dn-hero-right{position:relative}.dn-stats{margin-top:var(--hp-space-8);display:flex;gap:clamp(22px,3.4vw,48px)}.dn-stat-num{font-family:JetBrains Mono,ui-monospace,monospace;font-size:clamp(24px,2.8vw,32px);font-weight:700;color:var(--hp-color-text);letter-spacing:-.02em}.dn-stat-lbl{font-size:var(--hp-fs-13);color:var(--hp-color-text-muted);margin-top:2px}.dn-demo{position:relative;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);padding:var(--hp-space-6);box-shadow:var(--hp-shadow-card);overflow:hidden;min-height:320px}.dn-demo-head{display:flex;align-items:center;gap:var(--hp-space-3);font-size:var(--hp-fs-13);font-weight:700;color:var(--hp-color-text-soft);margin-bottom:var(--hp-space-4)}.dn-demo-pulse{width:8px;height:8px;border-radius:50%;background:var(--hp-color-success);box-shadow:0 0 0 0 rgba(34,197,94,.5);animation:dn-pulse-dot 1.6s var(--hp-ease) infinite}.dn-demo-title{flex:1 1 auto}.dn-demo-tag{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;padding:3px 8px;border-radius:var(--hp-radius-pill);background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);letter-spacing:.04em}.dn-demo-wave{display:flex;align-items:center;gap:var(--hp-space-3);background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);padding:10px var(--hp-space-3);margin-bottom:var(--hp-space-4)}.dn-demo-play{width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:var(--hp-grad-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--hp-shadow-cta)}.dn-demo-play .hi{font-size:14px;transform:translateX(1px)}.dn-demo-bars{flex:1 1 auto;display:flex;align-items:center;gap:3px;height:28px}.dn-demo-bars span{flex:1 1 0;background:var(--hp-grad-primary);border-radius:2px;height:30%;min-height:4px;animation:dn-wave 1.4s var(--hp-ease) infinite;animation-delay:calc(var(--i) * 60ms);transform-origin:50% 50%}@keyframes dn-wave{0%,to{height:18%;opacity:.55}30%{height:80%;opacity:1}60%{height:40%;opacity:.8}}.dn-demo-time{font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-12);color:var(--hp-color-text-muted);flex:0 0 auto}.dn-demo-target{font-size:var(--hp-fs-14);color:var(--hp-color-text-soft);background:var(--hp-color-bg-soft);border-left:3px solid var(--hp-color-primary);border-radius:0 var(--hp-radius-sm) var(--hp-radius-sm) 0;padding:10px var(--hp-space-4);margin-bottom:var(--hp-space-4)}.dn-demo-target-label{display:block;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;color:var(--hp-color-primary);letter-spacing:.12em;margin-bottom:4px;font-weight:700}.dn-demo-typed{font-size:var(--hp-fs-16);font-weight:600;line-height:2.2;margin-bottom:var(--hp-space-4);min-height:4em}.dn-demo-foot{display:flex;align-items:center;gap:var(--hp-space-4);flex-wrap:wrap;font-size:var(--hp-fs-12);color:var(--hp-color-text-muted);border-top:1px dashed var(--hp-color-border-soft);padding-top:var(--hp-space-3)}.dn-demo-legend{display:flex;gap:var(--hp-space-3);flex-wrap:wrap}.dn-demo-keys,.dn-demo-legend span{display:inline-flex;align-items:center;gap:5px}.dn-demo-keys{flex-wrap:wrap;margin-left:auto}.dn-demo-keys span{color:var(--hp-color-border)}.dn-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.dn-dot-ok{background:var(--hp-color-success)}.dn-dot-amb{background:var(--hp-color-warn)}.dn-dot-bad{background:var(--hp-color-danger)}.dn-w{display:inline-block;padding:3px 9px;margin:0 3px 4px 0;border-radius:7px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-13);font-weight:700;line-height:1.5;position:relative;transition:transform var(--hp-dur) var(--hp-ease)}.dn-w-ok{background:var(--hp-green-100);color:var(--hp-green-700)}.dn-w-amb{background:var(--hp-amber-100);color:var(--hp-amber-800)}.dn-w-bad{background:var(--hp-red-100);color:var(--hp-red-700);text-decoration:line-through;text-decoration-color:rgba(220,38,38,.4)}.dn-w[data-tip]:hover:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);padding:5px 10px;background:var(--hp-color-text);color:#fff;border-radius:var(--hp-radius-sm);font-size:11px;font-weight:600;font-family:var(--hp-font);white-space:nowrap;pointer-events:none;box-shadow:var(--hp-shadow-lg);z-index:5}.dn-w-typing{display:inline-block;padding:3px 9px;border-radius:7px;background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-13);font-weight:700;border:1.5px dashed var(--hp-color-primary)}.dn-w-typed{letter-spacing:.02em}.dn-caret{display:inline-block;width:1.5px;height:1.05em;background:var(--hp-color-primary);vertical-align:middle;margin-left:1px;animation:dn-caret 1s steps(2) infinite}@keyframes dn-caret{50%{opacity:0}}.dn-blob{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;z-index:0}.dn-blob-1{width:200px;height:200px;background:rgba(59,130,246,.18);top:-30px;right:-40px;animation:dn-blob 10s var(--hp-ease) infinite}.dn-blob-2{width:160px;height:160px;background:rgba(99,102,241,.1);bottom:-30px;left:-20px;animation:dn-blob 12s var(--hp-ease) infinite reverse}@keyframes dn-blob{0%,to{transform:translate(0) scale(1)}50%{transform:translate(20px,-10px) scale(1.1)}}.dn-modes-3d{position:relative;max-width:880px;margin:0 auto;perspective:1400px}.dn-modes-aura{position:absolute;inset:-10% -8%;z-index:0;background:radial-gradient(ellipse 60% 50% at 30% 35%,rgba(99,102,241,.18),transparent 60%),radial-gradient(ellipse 60% 50% at 70% 65%,rgba(236,72,153,.15),transparent 60%);filter:blur(14px);pointer-events:none}.dn-modes-chip{position:absolute;top:-22px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--hp-radius-pill);background:var(--hp-color-bg);border:1px solid var(--hp-color-border);box-shadow:var(--hp-shadow);font-size:var(--hp-fs-13);font-weight:700;color:var(--hp-color-text);z-index:4;white-space:nowrap;transition:all var(--hp-dur) var(--hp-ease)}.dn-modes-chip-ico{width:18px;height:18px;border-radius:50%;background:var(--hp-grad-primary);display:inline-block;flex:0 0 18px}.dn-modes-card{position:relative;z-index:1;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-2xl);padding:var(--hp-space-10) var(--hp-space-8) var(--hp-space-8);box-shadow:var(--hp-shadow-card);min-height:320px;transition:min-height var(--hp-dur-slow) var(--hp-ease);overflow:hidden;transform-style:preserve-3d}.dn-modes-card-shine{inset:0;background:radial-gradient(ellipse 80% 50% at 50% 0,rgba(59,130,246,.06),transparent 70%)}.dn-mode-slide,.dn-modes-card-shine{position:absolute;pointer-events:none}.dn-mode-slide{inset:var(--hp-space-10) var(--hp-space-8) var(--hp-space-8);opacity:0;transform:translateY(20px) rotateX(-2deg);transition:opacity var(--hp-dur-slow) var(--hp-ease),transform var(--hp-dur-slow) var(--hp-ease)}.dn-mode-slide.is-active{opacity:1;transform:translateY(0) rotateX(0);pointer-events:auto;position:relative;inset:auto}.dn-mode-tag{display:inline-block;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--hp-color-primary);background:var(--hp-color-primary-soft);padding:4px 10px;border-radius:var(--hp-radius-pill)}.dn-mode-title{font-size:var(--hp-fs-18);font-weight:700;margin:var(--hp-space-3) 0 var(--hp-space-5);line-height:1.45;color:var(--hp-color-text)}.dn-mode-body{flex-direction:column}.dn-listen-row,.dn-mode-body{display:flex;gap:var(--hp-space-3)}.dn-listen-row{align-items:center;background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);padding:8px var(--hp-space-3)}.dn-listen-wave{flex:1 1 auto;display:flex;align-items:center;gap:3px;height:24px}.dn-listen-wave span{flex:1 1 0;background:var(--hp-grad-primary);border-radius:2px;min-height:4px;animation:dn-wave 1.4s var(--hp-ease) infinite;animation-delay:calc(var(--i) * 80ms)}.dn-listen-time{font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-12);color:var(--hp-color-text-muted)}.dn-listen-line{display:flex;gap:var(--hp-space-3);align-items:flex-start;padding:8px 0}.dn-listen-text{flex:1 1 auto;min-width:0}.dn-listen-en{color:var(--hp-color-text);font-weight:600}.dn-listen-en em{font-style:normal;color:var(--hp-color-primary);border-bottom:2px solid var(--hp-color-primary-soft)}.dn-listen-vi{color:var(--hp-color-text-soft);font-size:var(--hp-fs-14)}.dn-listen-vi em{font-style:normal;color:var(--hp-color-accent)}.dn-listen-lbl{flex:0 0 auto;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:700;background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border);color:var(--hp-color-text-muted);padding:2px 7px;border-radius:6px;height:22px;display:inline-flex;align-items:center}.dn-dict-input{border:1.5px solid var(--hp-color-border);border-radius:var(--hp-radius);min-height:80px;line-height:2.2}.dn-dict-input,.dn-fill-sentence{background:var(--hp-color-bg-soft);padding:var(--hp-space-4)}.dn-fill-sentence{font-size:var(--hp-fs-16);line-height:2.1;color:var(--hp-color-text);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius)}.dn-fill-blank{display:inline-flex;align-items:center;min-width:80px;padding:3px 10px;border-radius:7px;background:var(--hp-color-bg);border:1.5px dashed var(--hp-color-border);font-family:JetBrains Mono,ui-monospace,monospace;font-weight:700;color:var(--hp-color-text-muted);font-size:var(--hp-fs-14)}.dn-fill-blank.is-filled{background:var(--hp-green-100);color:var(--hp-green-700);border:1.5px solid var(--hp-green-100)}.dn-fill-blank.is-typing{background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);border-color:var(--hp-color-primary);border-style:dashed}.dn-check-sentence{font-size:var(--hp-fs-16);line-height:2.1;color:var(--hp-color-text);background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);padding:var(--hp-space-4)}.dn-chk{display:inline-block;background:var(--hp-color-text);color:var(--hp-color-text);padding:2px 8px;border-radius:5px;font-weight:600;min-width:50px;cursor:pointer;transition:all var(--hp-dur) var(--hp-ease);-webkit-user-select:none;-moz-user-select:none;user-select:none}.dn-chk.dn-chk-open{background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);letter-spacing:.01em}.dn-check-foot{display:flex;align-items:center;gap:var(--hp-space-4);flex-wrap:wrap}.dn-check-progress{font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-12);color:var(--hp-color-text-muted)}.dn-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--hp-radius-pill);background:var(--hp-color-bg);border:1px solid var(--hp-color-border);font-size:var(--hp-fs-12);font-weight:600;color:var(--hp-color-text-soft);cursor:pointer;transition:all var(--hp-dur) var(--hp-ease)}.dn-pill .hi{font-size:12px}.dn-pill-blue,.dn-pill-pink,.dn-pill-violet{background:var(--hp-blue-50);color:var(--hp-blue-700);border-color:var(--hp-blue-100)}.dn-modes-dots{display:flex;justify-content:center;gap:8px;margin-top:var(--hp-space-6)}.dn-modes-dot{width:28px;height:6px;border-radius:3px;background:var(--hp-color-border);cursor:pointer;transition:all var(--hp-dur) var(--hp-ease)}.dn-modes-dot:hover{background:var(--hp-color-border-soft)}.dn-modes-dot.is-active{background:var(--hp-grad-primary);width:44px}.dn-pill-list{list-style:none;padding:0;margin:var(--hp-space-6) 0 0;display:flex;flex-direction:column;gap:var(--hp-space-3)}.dn-pill-item{display:flex;gap:var(--hp-space-4);align-items:flex-start;padding:var(--hp-space-4);background:var(--hp-color-bg);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);transition:border-color var(--hp-dur) var(--hp-ease),transform var(--hp-dur) var(--hp-ease)}.dn-pill-item:hover{border-color:var(--hp-color-primary);transform:translateX(4px)}.dn-pill-ico{flex:0 0 auto;width:38px;height:38px;border-radius:var(--hp-radius-sm);display:inline-flex;align-items:center;justify-content:center}.dn-pill-ico,.dn-pill-ico .hi{font-size:16px}.dn-pill-item h4{margin:0 0 4px;font-size:var(--hp-fs-15);font-weight:700;color:var(--hp-color-text)}.dn-pill-item p{margin:0;font-size:var(--hp-fs-14);color:var(--hp-color-text-soft);line-height:1.5}.dn-ico-blue{background:var(--hp-blue-50);color:var(--hp-blue-700)}.dn-ico-indigo{background:rgba(99,102,241,.1);color:var(--hp-indigo-600)}.dn-ico-violet{background:rgba(139,92,246,.1);color:var(--hp-violet-600)}.dn-ico-pink{background:var(--hp-pink-50);color:var(--hp-pink-600)}.dn-ico-green{background:var(--hp-green-100);color:var(--hp-green-700)}.dn-ico-amber{background:var(--hp-amber-50);color:var(--hp-amber-600)}.dn-ico-red{background:var(--hp-red-50);color:var(--hp-red-700)}.dn-grade-card{position:relative;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);padding:var(--hp-space-6);box-shadow:var(--hp-shadow-card);overflow:hidden}.dn-grade-head{display:flex;align-items:center;justify-content:space-between;gap:var(--hp-space-3);font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);margin-bottom:var(--hp-space-4);font-weight:600}.dn-grade-head .hi{color:var(--hp-color-primary);margin-right:4px}.dn-grade-pct{font-family:JetBrains Mono,ui-monospace,monospace;background:var(--hp-color-success-soft);color:var(--hp-green-700);padding:4px 12px;border-radius:var(--hp-radius-pill);font-size:var(--hp-fs-12)}.dn-grade-pct b{font-size:var(--hp-fs-15)}.dn-grade-target,.dn-grade-typed{background:var(--hp-color-bg-soft);border-radius:var(--hp-radius);padding:var(--hp-space-3) var(--hp-space-4);font-size:var(--hp-fs-14);color:var(--hp-color-text);margin-bottom:var(--hp-space-3);line-height:1.7}.dn-grade-target{border-left:3px solid var(--hp-color-primary)}.dn-grade-typed{border-left:3px solid var(--hp-color-warn)}.dn-grade-tag{display:block;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;letter-spacing:.12em;font-weight:700;color:var(--hp-color-text-muted);margin-bottom:4px;text-transform:uppercase}.dn-grade-tokens{display:flex;flex-wrap:wrap;gap:2px;line-height:2.1}.dn-grade-fix{border-top:1px dashed var(--hp-color-border);padding-top:var(--hp-space-3);margin-top:var(--hp-space-2);display:flex;flex-direction:column;gap:8px}.dn-grade-fix-row{display:flex;align-items:center;gap:var(--hp-space-3);font-size:var(--hp-fs-13);flex-wrap:wrap}.dn-grade-fix-from{background:var(--hp-red-100);color:var(--hp-red-700);text-decoration:line-through;text-decoration-color:rgba(220,38,38,.4)}.dn-grade-fix-from,.dn-grade-fix-to{font-family:JetBrains Mono,ui-monospace,monospace;padding:2px 9px;border-radius:6px;font-weight:700}.dn-grade-fix-to{background:var(--hp-green-100);color:var(--hp-green-700)}.dn-grade-fix-rule{font-size:var(--hp-fs-12);color:var(--hp-color-text-muted);font-style:italic}.dn-grade-fix-row .hi{color:var(--hp-color-text-muted);font-size:12px}.dn-grade-meter{margin-top:var(--hp-space-4);height:6px;background:var(--hp-color-bg-soft);border-radius:var(--hp-radius-pill);overflow:hidden}.dn-grade-meter-fill{display:block;width:78%;height:100%;background:var(--hp-grad-primary);border-radius:inherit;animation:dn-meter 2.4s var(--hp-ease) infinite alternate}@keyframes dn-meter{0%{width:60%}to{width:88%}}.dn-engine-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(28px,4vw,44px);align-items:stretch}@media (max-width:980px){.dn-engine-grid{grid-template-columns:1fr}}.dn-engine-stage{background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);padding:var(--hp-space-6);box-shadow:var(--hp-shadow-card)}.dn-engine-stage-head{display:flex;align-items:center;justify-content:space-between;gap:var(--hp-space-3);font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);margin-bottom:var(--hp-space-5);font-weight:600}.dn-engine-stage-head .hi{color:var(--hp-color-primary);margin-right:4px}.dn-engine-pill{font-family:JetBrains Mono,ui-monospace,monospace;background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);padding:3px 10px;border-radius:var(--hp-radius-pill);font-size:11px;letter-spacing:.04em}.dn-engine-timeline{margin-bottom:var(--hp-space-5)}.dn-engine-track{position:relative;height:38px;background:var(--hp-color-bg-soft);border-radius:var(--hp-radius-sm);margin-bottom:var(--hp-space-2);overflow:hidden}.dn-engine-seg{position:absolute;top:6px;bottom:6px;left:calc(var(--from) * 1%);width:calc((var(--to) - var(--from)) * 1%);background:var(--hp-blue-100);border-radius:4px;border-right:2px solid #fff;transition:background var(--hp-dur) var(--hp-ease)}.dn-engine-seg.is-current{background:var(--hp-grad-primary);box-shadow:0 4px 12px -2px rgba(37,99,235,.4)}.dn-engine-cursor{position:absolute;top:-4px;bottom:-4px;left:28%;width:2px;background:var(--hp-color-accent);box-shadow:0 0 0 3px rgba(236,72,153,.18);border-radius:2px;animation:dn-cursor 4s var(--hp-ease) infinite}@keyframes dn-cursor{0%{left:18%}50%{left:32%}to{left:18%}}.dn-engine-axis{display:flex;justify-content:space-between;font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;color:var(--hp-color-text-muted)}.dn-engine-transport{display:flex;gap:var(--hp-space-3);padding:var(--hp-space-4) 0;border-top:1px dashed var(--hp-color-border);border-bottom:1px dashed var(--hp-color-border);margin-bottom:var(--hp-space-4)}.dn-engine-tbtn,.dn-engine-transport{justify-content:center;align-items:center}.dn-engine-tbtn{width:42px;height:42px;border-radius:50%;background:var(--hp-color-bg-soft);color:var(--hp-color-text-soft);display:inline-flex;border:1px solid var(--hp-color-border);transition:all var(--hp-dur) var(--hp-ease);position:relative}.dn-engine-tbtn:hover{background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);border-color:var(--hp-color-primary)}.dn-engine-tbtn .hi{font-size:14px}.dn-engine-tbtn-replay{width:auto;border-radius:var(--hp-radius-pill);padding:0 14px;gap:5px;font-size:var(--hp-fs-12);font-weight:700}.dn-engine-tbtn-replay span{font-family:JetBrains Mono,ui-monospace,monospace}.dn-engine-tbtn-play{width:56px;height:56px;background:var(--hp-grad-primary);color:#fff;border:0;box-shadow:var(--hp-shadow-cta)}.dn-engine-tbtn-play:hover{background:var(--hp-grad-primary);color:#fff;transform:scale(1.05)}.dn-engine-tbtn-play .hi{font-size:18px;transform:translateX(1px)}.dn-engine-speeds{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.dn-engine-speeds-lbl{font-size:var(--hp-fs-13);font-weight:700;color:var(--hp-color-text-muted);margin-right:var(--hp-space-2)}.dn-engine-spd{padding:6px 12px;border-radius:var(--hp-radius-sm);background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border);color:var(--hp-color-text-soft);font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-12);font-weight:700;transition:all var(--hp-dur) var(--hp-ease)}.dn-engine-spd:hover{border-color:var(--hp-color-primary);color:var(--hp-color-primary)}.dn-engine-spd.is-on{background:var(--hp-grad-primary);color:#fff;border-color:transparent;box-shadow:var(--hp-shadow-cta)}.dn-engine-side{flex-direction:column}.dn-engine-feat,.dn-engine-side{display:flex;gap:var(--hp-space-3)}.dn-engine-feat{padding:var(--hp-space-4);background:var(--hp-color-bg);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);transition:border-color var(--hp-dur) var(--hp-ease),transform var(--hp-dur) var(--hp-ease)}.dn-engine-feat:hover{border-color:var(--hp-color-primary);transform:translateY(-2px);box-shadow:var(--hp-shadow)}.dn-engine-feat-ico{flex:0 0 auto;width:36px;height:36px;border-radius:var(--hp-radius-sm);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:14px}.dn-engine-feat-ico .hi{font-size:14px}.dn-engine-feat h4{margin:0 0 4px;font-size:var(--hp-fs-14);font-weight:700;color:var(--hp-color-text)}.dn-engine-feat p{margin:0;font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);line-height:1.5}.dn-engine-feat kbd{font-size:10px;padding:1px 5px}.dn-lib-stage{position:relative;width:100%;max-width:380px;height:360px;margin:0 auto;perspective:1200px}.dn-lib-card{position:absolute;left:0;right:0;width:100%;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);padding:var(--hp-space-5);box-shadow:var(--hp-shadow-card);transition:transform var(--hp-dur-slow) var(--hp-ease),opacity var(--hp-dur-slow) var(--hp-ease);transform-origin:center bottom;will-change:transform,opacity}.dn-lib-back{transform:translateY(-30px) translateX(-20px) rotate(-6deg) scale(.92);opacity:.58}.dn-lib-mid{transform:translateY(-15px) translateX(20px) rotate(4deg) scale(.96);opacity:.82}.dn-lib-front{transform:translateY(8px) rotate(-1deg);opacity:1;z-index:3;box-shadow:var(--hp-shadow-card),0 0 0 6px rgba(255,255,255,.6)}.dn-lib-card.dn-no-trans{transition:none!important}.dn-lib-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--hp-space-3)}.dn-lib-tag{font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.08em;padding:4px 10px;border-radius:var(--hp-radius-pill)}.dn-tag-blue{color:var(--hp-blue-700)}.dn-tag-blue,.dn-tag-pink{background:var(--hp-blue-50)}.dn-tag-pink,.dn-tag-violet{color:var(--hp-indigo-600)}.dn-tag-violet{background:rgba(99,102,241,.1)}.dn-lib-code{font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;color:var(--hp-color-text-muted);letter-spacing:.04em}.dn-lib-title{font-size:var(--hp-fs-18);font-weight:700;letter-spacing:-.01em;color:var(--hp-color-text);line-height:1.3}.dn-lib-title,.dn-lib-words{margin-bottom:var(--hp-space-3)}.dn-lib-words{display:flex;flex-wrap:wrap;gap:6px}.dn-lib-words span{font-family:JetBrains Mono,ui-monospace,monospace;font-size:var(--hp-fs-12);font-weight:600;background:var(--hp-color-bg-soft);color:var(--hp-color-text-soft);padding:3px 9px;border-radius:6px}.dn-lib-progress{margin-bottom:var(--hp-space-3)}.dn-lib-progress-row{display:flex;justify-content:space-between;font-size:var(--hp-fs-12);color:var(--hp-color-text-soft);margin-bottom:4px}.dn-lib-progress-row b{color:var(--hp-color-text)}.dn-lib-bar{height:6px;background:var(--hp-color-bg-soft);border-radius:var(--hp-radius-pill);overflow:hidden}.dn-lib-bar-fill{display:block;width:58%;height:100%;background:var(--hp-grad-primary);border-radius:inherit}.dn-lib-meta{display:flex;gap:var(--hp-space-3);flex-wrap:wrap;font-size:var(--hp-fs-12);color:var(--hp-color-text-muted);border-top:1px dashed var(--hp-color-border-soft);padding-top:var(--hp-space-3)}.dn-lib-meta span{display:inline-flex;align-items:center;gap:5px}.dn-lib-resume{margin-left:auto;color:var(--hp-color-primary)!important;font-weight:700}.dn-lib-dots{position:absolute;bottom:-28px;left:50%;transform:translateX(-50%);display:flex;gap:6px}.dn-lib-dot{width:6px;height:6px;border-radius:50%;background:var(--hp-color-border);transition:all var(--hp-dur) var(--hp-ease)}.dn-lib-dot.active{background:var(--hp-grad-primary);width:22px;border-radius:3px}.dn-lib-card.dn-lib-out{transform:translateY(-80px) rotate(-15deg) scale(.7);opacity:0}.dn-cat-tree{list-style:none;padding:0;margin:var(--hp-space-6) 0;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius);box-shadow:var(--hp-shadow);overflow:hidden}.dn-cat-row{display:flex;align-items:center;gap:var(--hp-space-3);padding:11px var(--hp-space-4);border-bottom:1px solid var(--hp-color-border-soft);transition:background var(--hp-dur) var(--hp-ease);cursor:pointer}.dn-cat-row:last-child{border-bottom:0}.dn-cat-row:hover{background:var(--hp-color-bg-soft)}.dn-cat-l1{font-weight:700;color:var(--hp-color-text)}.dn-cat-l2{padding-left:clamp(28px,5vw,48px);font-size:var(--hp-fs-14);color:var(--hp-color-text-soft);background:var(--hp-color-bg-soft)}.dn-cat-ico{font-size:14px;color:var(--hp-color-primary)}.dn-cat-bul{width:6px;height:6px;border-radius:50%;background:var(--hp-color-primary);display:inline-block;flex:0 0 6px}.dn-cat-name{flex:1 1 auto}.dn-cat-count{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;color:var(--hp-color-text-muted);background:var(--hp-color-bg);border:1px solid var(--hp-color-border-soft);padding:2px 8px;border-radius:var(--hp-radius-pill)}.dn-cat-l2 .dn-cat-count{background:#fff}.dn-cat-foot{margin-top:var(--hp-space-4)}.dn-feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--hp-space-4)}@media (max-width:980px){.dn-feat-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.dn-feat-grid{grid-template-columns:1fr}}.dn-feat{position:relative;padding:var(--hp-space-5);background:var(--hp-color-bg);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);transition:all var(--hp-dur-slow) var(--hp-ease);overflow:hidden}.dn-feat:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--hp-grad-primary);opacity:0;transition:opacity var(--hp-dur) var(--hp-ease)}.dn-feat:hover{border-color:var(--hp-color-primary);transform:translateY(-4px);box-shadow:var(--hp-shadow-lg)}.dn-feat:hover:before{opacity:1}.dn-feat-ico{width:42px;height:42px;border-radius:var(--hp-radius-sm);display:inline-flex;align-items:center;justify-content:center;margin-bottom:var(--hp-space-3);background:var(--hp-blue-50);color:var(--hp-blue-700);transition:background var(--hp-dur) var(--hp-ease),color var(--hp-dur) var(--hp-ease)}.dn-feat-ico,.dn-feat-ico .hi{font-size:16px}.dn-feat:hover .dn-feat-ico{background:var(--hp-grad-primary);color:#fff}.dn-feat h3{margin:0 0 6px;font-size:var(--hp-fs-15);font-weight:700;color:var(--hp-color-text)}.dn-feat p{margin:0;font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);line-height:1.5}.dn-feat-pulse{position:absolute;top:var(--hp-space-4);right:var(--hp-space-4);width:7px;height:7px;border-radius:50%;background:var(--hp-color-primary);opacity:.4;animation:dn-pulse-dot 2s var(--hp-ease) infinite}.dn-stats-card{background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);padding:var(--hp-space-6);box-shadow:var(--hp-shadow-card)}.dn-stats-head{display:flex;justify-content:space-between;align-items:center;gap:var(--hp-space-3);font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);margin-bottom:var(--hp-space-5);font-weight:600}.dn-stats-head .hi{color:var(--hp-color-primary);margin-right:4px}.dn-stats-pill{display:inline-flex;align-items:center;gap:5px;background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);padding:4px 12px;border-radius:var(--hp-radius-pill);font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;font-weight:700;border:1px solid var(--hp-blue-100)}.dn-stats-pill .hi{color:var(--hp-color-primary);margin:0}.dn-stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--hp-space-3);margin-bottom:var(--hp-space-5)}.dn-stats-cell{background:var(--hp-color-bg-soft);border-radius:var(--hp-radius);padding:var(--hp-space-4);text-align:center}.dn-stats-num{font-family:JetBrains Mono,ui-monospace,monospace;font-size:clamp(22px,2.6vw,28px);font-weight:700;color:var(--hp-color-text);line-height:1.2}.dn-stats-lbl{font-size:var(--hp-fs-12);color:var(--hp-color-text-muted);margin-top:2px}.dn-stats-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;height:120px;align-items:end;margin-bottom:var(--hp-space-4)}.dn-stats-day{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}.dn-stats-bar{display:block;width:100%;max-width:28px;height:calc(var(--h) * 100%);background:linear-gradient(180deg,var(--hp-blue-300) 0,var(--hp-blue-600) 100%);border-radius:5px 5px 2px 2px;min-height:8px;transition:height var(--hp-dur-slow) var(--hp-ease)}.dn-stats-day b{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;color:var(--hp-color-text-muted);font-weight:700}.dn-stats-day.is-today .dn-stats-bar{background:linear-gradient(180deg,var(--hp-blue-700) 0,var(--hp-indigo-600) 100%);box-shadow:0 0 0 2px var(--hp-color-bg),0 0 0 3px var(--hp-color-primary)}.dn-stats-day.is-today b{color:var(--hp-color-primary)}.dn-stats-foot{display:inline-flex;align-items:center;gap:8px;background:var(--hp-color-bg-soft);padding:10px var(--hp-space-4);border-radius:var(--hp-radius);font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);border:1px dashed var(--hp-color-border)}.dn-stats-foot .hi{color:var(--hp-color-primary)}.dn-stats-foot b{color:var(--hp-color-text);font-family:JetBrains Mono,ui-monospace,monospace}.dn-faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:1100px;margin:0 auto}@media (max-width:720px){.dn-faq-grid{grid-template-columns:1fr}}.dn-cta-section{padding:clamp(40px,6vw,80px) 0 clamp(60px,8vw,100px)}.dn-cta-card{position:relative;background:var(--hp-grad-primary-dark);border-radius:var(--hp-radius-2xl);padding:clamp(32px,5vw,64px) clamp(24px,4vw,56px);text-align:center;overflow:hidden;color:#fff;box-shadow:var(--hp-shadow-lg)}.dn-cta-blob{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none}.dn-cta-blob-1{width:280px;height:280px;background:rgba(99,102,241,.3);top:-80px;right:-50px;animation:dn-blob 14s var(--hp-ease) infinite}.dn-cta-blob-2{width:240px;height:240px;background:rgba(236,72,153,.18);bottom:-80px;left:-50px;animation:dn-blob 16s var(--hp-ease) infinite reverse}.dn-cta-content{position:relative;z-index:1}.dn-cta-title{color:#fff;margin:var(--hp-space-3) 0 var(--hp-space-3);font-size:clamp(28px,3.6vw,42px)}.dn-cta-sub{color:rgba(255,255,255,.85);font-size:var(--hp-fs-16);max-width:600px;margin:0 auto var(--hp-space-6)}@media (max-width:720px){.dn-stats{gap:var(--hp-space-5)}.dn-modes-card{padding:var(--hp-space-8) var(--hp-space-5) var(--hp-space-5)}.dn-modes-chip{font-size:var(--hp-fs-12);padding:6px 12px}.dn-engine-stage,.dn-grade-card,.dn-stats-card{padding:var(--hp-space-5)}.dn-mode-title{font-size:var(--hp-fs-15)}.dn-check-sentence,.dn-fill-sentence{font-size:var(--hp-fs-14)}.dn-engine-transport{gap:var(--hp-space-2)}}@media (prefers-reduced-motion:reduce){.dn-badge-dot,.dn-blob,.dn-btn-shine,.dn-caret,.dn-cta-blob,.dn-demo-bars span,.dn-demo-pulse,.dn-engine-cursor,.dn-feat-pulse,.dn-grade-meter-fill,.dn-listen-wave span{animation:none!important}.dn-reveal{transition:none;opacity:1;transform:none}}.dn-hero-slim{padding:clamp(32px,4.5vw,56px) 0 clamp(24px,3vw,40px)}.dn-hero-center{max-width:760px;margin:0 auto;text-align:center;position:relative;z-index:2}.dn-hero-center .dn-h1{margin-inline:auto;font-size:clamp(28px,4vw,40px);margin-top:var(--hp-space-3);margin-bottom:var(--hp-space-3)}.dn-hero-center .dn-lead-center{max-width:620px;margin-left:auto;margin-right:auto;margin-bottom:var(--hp-space-5)}.dn-hero-notice{display:inline-flex;align-items:center;gap:8px;margin:var(--hp-space-4) auto 0;padding:7px 14px;border-radius:var(--hp-radius-pill);background:var(--hp-color-warn-soft);color:var(--hp-color-text);font-size:var(--hp-fs-13);font-weight:500;border:1px dashed var(--hp-color-warn);max-width:100%}.dn-hero-notice .hi{font-size:14px;color:var(--hp-color-warn);flex:0 0 auto}.dn-hero-notice b{color:var(--hp-color-warn);font-weight:700}.dn-stats-center{justify-content:center;margin-top:var(--hp-space-5);gap:clamp(18px,2.6vw,36px)}.dn-stats-center .dn-stat{text-align:center}.dn-hero-slim .dn-stat-num{font-size:clamp(20px,2.2vw,26px)}.dn-hero-slim .dn-stat-lbl{font-size:var(--hp-fs-12)}.dn-alb-filters{display:flex;flex-wrap:wrap;gap:var(--hp-space-2);justify-content:center;margin:calc(var(--hp-space-8) * -1) 0 var(--hp-space-8)}.dn-alb-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--hp-radius-pill);background:var(--hp-color-bg);border:1px solid var(--hp-color-border);color:var(--hp-color-text-soft);font-size:var(--hp-fs-13);font-weight:600;cursor:pointer;transition:var(--hp-trans-fast)}.dn-alb-chip:hover{border-color:var(--hp-color-primary);color:var(--hp-color-primary);background:var(--hp-color-primary-soft)}.dn-alb-chip .hi{font-size:14px}.dn-alb-chip-n{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;padding:1px 7px;border-radius:var(--hp-radius-pill);background:var(--hp-color-bg-soft);color:var(--hp-color-text-muted)}.dn-alb-chip.is-on{background:var(--hp-grad-primary);border-color:transparent;color:#fff;box-shadow:var(--hp-shadow-cta)}.dn-alb-chip.is-on .dn-alb-chip-n{background:rgba(255,255,255,.22);color:#fff}.dn-alb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,22px)}@media (max-width:1180px){.dn-alb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:880px){.dn-alb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:540px){.dn-alb-grid{grid-template-columns:1fr}}.dn-alb-card{position:relative;display:flex;flex-direction:column;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-lg);overflow:hidden;text-decoration:none;color:inherit;transition:transform .35s var(--hp-ease),box-shadow .35s var(--hp-ease),border-color .25s var(--hp-ease);will-change:transform}.dn-alb-card:hover{transform:translateY(-4px);border-color:transparent;box-shadow:var(--hp-shadow-card-hover,0 18px 40px -18px rgba(15,23,42,.25))}.dn-alb-art{position:relative;height:156px;background:var(--hp-color-bg-soft);overflow:hidden}.dn-alb-img{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block;transition:transform .65s var(--hp-ease),filter .35s var(--hp-ease);filter:saturate(.9) brightness(.96)}.dn-alb-card:hover .dn-alb-img{transform:scale(1.08);filter:saturate(1.05) brightness(1)}.dn-alb-art:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.35),rgba(15,23,42,0) 40%,rgba(15,23,42,.14));pointer-events:none;z-index:1;transition:background .3s var(--hp-ease)}.dn-alb-card:hover .dn-alb-art:before{background:linear-gradient(180deg,rgba(15,23,42,.48),rgba(15,23,42,.12) 50%,rgba(37,99,235,.28))}.dn-alb-art:after{content:"";position:absolute;bottom:12px;left:12px;z-index:2;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.95);box-shadow:0 8px 20px -6px rgba(15,23,42,.35),0 0 0 4px rgba(255,255,255,.18);opacity:0;transform:translateY(8px) scale(.85);transition:opacity .28s var(--hp-ease),transform .35s var(--hp-ease);pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232563eb'><path d='M8 5v14l11-7z'/></svg>");background-size:18px 18px;background-repeat:no-repeat;background-position:52% 50%}.dn-alb-card:hover .dn-alb-art:after{opacity:1;transform:translateY(0) scale(1)}.dn-alb-art-tag{position:absolute;top:10px;right:10px;z-index:2;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.06em;padding:4px 9px;border-radius:var(--hp-radius-pill);background:rgba(15,23,42,.55);color:#fff;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.22);transition:background .25s var(--hp-ease)}.dn-alb-card:hover .dn-alb-art-tag{background:rgba(37,99,235,.9);border-color:rgba(255,255,255,.35)}.dn-alb-body{padding:var(--hp-space-4) var(--hp-space-4) var(--hp-space-5);display:flex;flex-direction:column;gap:10px;flex:1 1 auto}.dn-alb-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.dn-alb-tag{display:inline-flex;align-items:center;font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 9px;border-radius:var(--hp-radius-pill);text-transform:uppercase}.dn-alb-tag.dn-tag-blue{background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark)}.dn-alb-tag.dn-tag-pink{background:rgba(236,72,153,.12);color:#be185d}.dn-alb-tag.dn-tag-amber{background:rgba(245,158,11,.14);color:#b45309}.dn-alb-tag.dn-tag-teal{background:rgba(20,184,166,.14);color:#0f766e}.dn-alb-tag.dn-tag-indigo{background:rgba(79,70,229,.12);color:#4338ca}.dn-alb-band{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;font-weight:700;color:var(--hp-color-text-muted)}.dn-alb-title{margin:2px 0;font-size:var(--hp-fs-16);font-weight:700;line-height:1.35;color:var(--hp-color-text);letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.dn-alb-meta{display:flex;flex-wrap:wrap;gap:12px;font-size:var(--hp-fs-13);color:var(--hp-color-text-muted);margin-top:auto}.dn-alb-meta span{display:inline-flex;align-items:center;gap:5px}.dn-alb-meta .hi{font-size:12px;color:var(--hp-color-primary)}.dn-alb-progress{margin-top:4px}.dn-alb-progress-row{display:flex;justify-content:space-between;font-size:var(--hp-fs-13);color:var(--hp-color-text-soft);margin-bottom:6px}.dn-alb-progress-row b{color:var(--hp-color-text);font-family:JetBrains Mono,ui-monospace,monospace}.dn-alb-bar{height:6px;border-radius:var(--hp-radius-pill);background:var(--hp-color-bg-soft);overflow:hidden}.dn-alb-bar-fill{display:block;height:100%;width:var(--p,0);background:var(--hp-grad-primary);border-radius:inherit;transition:width .6s var(--hp-ease)}.dn-player{max-width:860px;margin:0 auto;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius-xl);box-shadow:var(--hp-shadow-card);padding:var(--hp-space-5);position:relative;overflow:hidden}.dn-player-head{display:flex;align-items:center;gap:var(--hp-space-4);padding-bottom:var(--hp-space-4);border-bottom:1px solid var(--hp-color-border-soft);margin-bottom:var(--hp-space-4);flex-wrap:wrap}.dn-player-meta{display:flex;flex-direction:column;gap:6px;flex:1 1 240px;min-width:0}.dn-player-tag{align-self:flex-start;font-family:JetBrains Mono,ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:.06em;padding:3px 8px;border-radius:var(--hp-radius-pill);background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark);text-transform:uppercase}.dn-player-name{font-size:var(--hp-fs-14);color:var(--hp-color-text-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dn-player-name b{color:var(--hp-color-text);font-weight:700}.dn-player-audio{display:flex;align-items:center;gap:var(--hp-space-3);background:var(--hp-color-bg-soft);border:1px solid var(--hp-color-border-soft);border-radius:var(--hp-radius);padding:6px var(--hp-space-3) 6px 6px;flex:0 1 320px;min-width:0}.dn-player-play{width:32px;height:32px;flex:0 0 32px;border-radius:50%;background:var(--hp-grad-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 10px -4px rgba(37,99,235,.45)}.dn-player-play .hi{font-size:12px;transform:translateX(1px)}.dn-player-bars{flex:1 1 auto;display:flex;align-items:center;gap:2px;height:22px;min-width:0}.dn-player-bars span{flex:1 1 0;background:var(--hp-grad-primary);border-radius:1.5px;height:30%;min-height:3px;animation:dn-wave 1.4s var(--hp-ease) infinite;animation-delay:calc(var(--i) * 50ms)}.dn-player-time{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;color:var(--hp-color-text-muted);white-space:nowrap}.dn-player-time i{font-style:normal;opacity:.5;margin:0 2px}.dn-modes-card-title{font-size:11px;font-weight:700;color:var(--hp-color-text-muted);letter-spacing:.08em;text-transform:uppercase;margin:0 4px 10px}.dn-modes-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:var(--hp-space-5)}.dn-mode-tab{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px 12px;border-radius:14px;cursor:pointer;transition:background .18s var(--hp-ease),border-color .18s var(--hp-ease);border:1px solid transparent;background:transparent;font-family:inherit}.dn-mode-tab .dn-mode-ico,.dn-mode-tab:hover{background:var(--hp-color-bg-soft)}.dn-mode-tab .dn-mode-ico{width:38px;height:38px;border-radius:50%;color:var(--hp-color-text-muted);display:grid;place-items:center;transition:background .18s var(--hp-ease),color .18s var(--hp-ease),box-shadow .18s var(--hp-ease)}.dn-mode-tab .dn-mode-ico svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;display:block}.dn-mode-tab .dn-mode-lbl{font-size:var(--hp-fs-13);font-weight:500;color:var(--hp-color-text-muted)}.dn-mode-tab.is-active{background:var(--hp-color-bg);border-color:var(--hp-color-border)}.dn-mode-tab.is-active .dn-mode-lbl{font-weight:600}.dn-mode-tab[data-mode=chinghe].is-active{background:linear-gradient(180deg,#eff4ff,#fff);border-color:#dbe5ff}.dn-mode-tab[data-mode=chinghe].is-active .dn-mode-ico{background:linear-gradient(180deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 6px 14px -6px rgba(37,99,235,.5)}.dn-mode-tab[data-mode=chinghe].is-active .dn-mode-lbl{color:#2563eb}.dn-mode-tab[data-mode=nghecham].is-active{background:linear-gradient(180deg,#f5f3ff,#fff);border-color:#e2dcff}.dn-mode-tab[data-mode=nghecham].is-active .dn-mode-ico{background:linear-gradient(180deg,#a78bfa,#8b5cf6);color:#fff;box-shadow:0 6px 14px -6px rgba(139,92,246,.5)}.dn-mode-tab[data-mode=nghecham].is-active .dn-mode-lbl{color:#8b5cf6}.dn-mode-tab[data-mode=nghedien].is-active{background:linear-gradient(180deg,#ecfdf5,#fff);border-color:#bbf7d0}.dn-mode-tab[data-mode=nghedien].is-active .dn-mode-ico{background:linear-gradient(180deg,#34d399,#10b981);color:#fff;box-shadow:0 6px 14px -6px rgba(16,185,129,.5)}.dn-mode-tab[data-mode=nghedien].is-active .dn-mode-lbl{color:#10b981}.dn-mode-tab[data-mode=nghechep].is-active{background:linear-gradient(180deg,#fff7ed,#fff);border-color:#fed7aa}.dn-mode-tab[data-mode=nghechep].is-active .dn-mode-ico{background:linear-gradient(180deg,#fbbf24,#f59e0b);color:#fff;box-shadow:0 6px 14px -6px rgba(245,158,11,.5)}.dn-mode-tab[data-mode=nghechep].is-active .dn-mode-lbl{color:#c2410c}@media (max-width:540px){.dn-modes-bar{grid-template-columns:repeat(2,1fr)}}.dn-player-stage{position:relative;transition:min-height .35s var(--hp-ease)}.dn-player-stage .dn-mode-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s var(--hp-ease),transform .35s var(--hp-ease);padding:4px}.dn-player-stage .dn-mode-slide.is-active{position:relative;opacity:1;visibility:visible;transform:none}.dn-player-stage .dn-mode-body{display:flex;flex-direction:column;gap:var(--hp-space-3)}.dn-touch-demo{position:relative;background:var(--hp-color-bg);border:1px solid var(--hp-color-border);border-radius:var(--hp-radius);padding:var(--hp-space-5)}.dn-touch-actions{display:flex;justify-content:flex-end;margin-bottom:var(--hp-space-3)}.dn-touch-all,.dn-touch-meaning,.dn-touch-word{font:inherit;cursor:pointer;transition:var(--hp-trans-fast)}.dn-touch-all{border:1px solid #fed7aa;background:#fffbeb;color:#92400e;border-radius:var(--hp-radius-pill);padding:8px 14px;font-weight:700}.dn-touch-line{display:flex;align-items:center;flex-wrap:wrap;gap:10px 8px;font-size:var(--hp-fs-16);line-height:1.9;color:var(--hp-color-text)}.dn-touch-speaker{font-weight:700;color:var(--hp-color-text);margin-right:2px}.dn-touch-word{min-width:58px;border:1.5px dashed var(--hp-color-border);background:var(--hp-color-bg);color:var(--hp-color-text-muted);border-radius:8px;padding:2px 12px;font-family:JetBrains Mono,ui-monospace,monospace;font-weight:700;line-height:1.6}.dn-touch-word.is-open{border-style:solid;border-color:#dbe5ff;background:var(--hp-color-primary-soft);color:var(--hp-color-primary-dark)}.dn-touch-meaning{margin-top:var(--hp-space-4);width:100%;text-align:left;border:0;border-radius:var(--hp-radius);padding:var(--hp-space-3) var(--hp-space-4);background:linear-gradient(90deg,rgba(148,163,184,.18),rgba(148,163,184,.04));color:var(--hp-color-text-muted);filter:blur(.4px)}@media (max-width:720px){.dn-player{padding:var(--hp-space-4)}.dn-player-head{gap:var(--hp-space-3)}.dn-player-audio{flex:1 1 100%}}