.kdet-layout{display:grid;grid-template-columns:260px 1fr;gap:48px;align-items:start}.kdet-left{position:relative}.kdet-left-sticky{position:sticky;top:100px}.kdet-left .info-title{font-size:1.1rem;font-weight:700;margin-bottom:24px}@media(max-width:1200px){.kdet-layout{grid-template-columns:1fr;gap:32px}.kdet-left-sticky{position:static}}.hidden{display:none!important}.kdet-center{min-width:0}.info-grid-vertical{display:flex;flex-direction:column;gap:18px}.info-grid-vertical .info-item{padding:18px 20px;background:#ffffff05;border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);transition:border-color .3s,transform .3s}.info-grid-vertical .info-item:hover{border-color:#ffd60059;transform:translate(4px)}.info-grid-vertical .info-item h4{font-size:.85rem;font-weight:700;margin-bottom:8px}.info-grid-vertical .info-item p{font-size:.75rem;font-weight:300;color:#fff6;line-height:1.6;margin:0}.info-num{font-size:.55rem;font-weight:600;color:var(--yellow);letter-spacing:2px;display:block;margin-bottom:10px}.auto-master-intro{margin-bottom:32px}.about-lead{font-size:1.1rem;font-weight:300;color:#fff9;line-height:1.8}.upload-section{margin:32px 0}.upload-zone{position:relative;border:2px dashed rgba(255,255,255,.14);border-radius:20px;padding:56px 40px;text-align:center;cursor:pointer;overflow:hidden;background:radial-gradient(circle at 50% 0%,rgba(255,214,0,.06),transparent 60%);transition:border-color .3s,background .3s,transform .3s}.upload-zone:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) 0%,rgba(255,214,0,.04),transparent 50%);opacity:0;transition:opacity .3s;pointer-events:none}.upload-zone:hover,.upload-zone.dragover{border-color:var(--yellow);transform:translateY(-2px)}.upload-zone.dragover{background:#ffd6000d}.upload-zone.dragover:before{opacity:1}.upload-orb{position:relative;width:110px;height:110px;margin:0 auto 24px}.upload-orb-ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(255,214,0,.3);animation:orbPulse 3s ease-out infinite}.upload-orb-ring.ring-2{animation-delay:1.5s}@keyframes orbPulse{0%{transform:scale(.7);opacity:1}to{transform:scale(1.35);opacity:0}}.upload-icon{position:absolute;inset:0;margin:auto;width:88px;height:88px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffd60014;border:1px solid rgba(255,214,0,.25);color:var(--yellow);transition:transform .3s,background .3s,color .3s}.upload-zone:hover .upload-icon{background:#ffd6002e;transform:scale(1.05)}.upload-text{font-size:1.15rem;font-weight:600;margin-bottom:4px;color:var(--white)}.upload-subtext{font-size:.8rem;color:#fff6;margin-bottom:20px}.upload-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 34px;background:var(--yellow);color:#111;border:none;font-family:Montserrat,sans-serif;font-size:.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;border-radius:100px;cursor:pointer;transition:transform .3s,box-shadow .3s;box-shadow:0 8px 24px #ffd60033}.upload-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px #ffd6004d}.upload-btn svg{width:16px;height:16px}.upload-formats{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:22px}.upload-formats span{padding:5px 12px;border:1px solid rgba(255,255,255,.15);border-radius:100px;font-size:.6rem;font-weight:700;letter-spacing:1px;color:#fff9}.upload-max{margin-top:14px;font-size:.7rem;color:#ffffff59}.processing-section{margin:32px 0}.processing-card{background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:60px 40px;text-align:center}.processing-spinner{width:48px;height:48px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--yellow);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 24px}@keyframes spin{to{transform:rotate(360deg)}}.processing-title{font-size:1.1rem;font-weight:600;margin-bottom:8px}.processing-subtitle{font-size:.8rem;color:#fff6;margin-bottom:24px}.processing-bar{width:220px;height:3px;background:#ffffff1a;border-radius:10px;margin:0 auto;overflow:hidden}.processing-bar-fill{height:100%;background:var(--yellow);border-radius:10px;width:0%;transition:width .5s}.result-section{margin:32px 0}.result-card{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:40px}.result-header{display:flex;align-items:center;gap:16px;margin-bottom:32px}.result-icon{color:#66bb6a;flex-shrink:0}.result-title{font-size:1.1rem;font-weight:600;margin-bottom:4px}.result-subtitle{font-size:.8rem;color:#fff6}.error-section{margin:32px 0}.error-card{background:#ffffff08;border:1px solid rgba(239,83,80,.3);border-radius:20px;padding:60px 40px;text-align:center}.error-title{font-size:1.1rem;font-weight:600;color:#ef5350;margin-bottom:8px}.error-subtitle{font-size:.8rem;color:#fff6;margin-bottom:24px}.btn-new{display:block;width:100%;padding:16px;margin-top:16px;background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:100px;color:#ffffffb3;font-family:Montserrat,sans-serif;font-size:.7rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:color .3s,border-color .3s}.btn-new:hover{color:var(--yellow);border-color:var(--yellow)}#retry-btn{width:auto;margin:0 auto;padding:14px 32px}.kdet-hero{text-align:center;padding:32px 0 20px}.kdet-big-note{font-family:Syne,sans-serif;font-size:clamp(3.5rem,10vw,6rem);font-weight:800;line-height:1;color:var(--yellow);margin-bottom:4px}.kdet-big-mode{font-size:1rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;margin-bottom:12px;transition:color .3s}.kdet-big-label{font-size:.65rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:#fff6}.kdet-confidence{display:inline-block;margin-top:16px;padding:8px 18px;border:1px solid rgba(255,255,255,.12);border-radius:100px;font-size:.7rem;letter-spacing:1px;color:#fff9}.kdet-piano{margin:32px auto;padding:24px;max-width:560px;background:#00000040;border-radius:14px;border:1px solid rgba(255,255,255,.08)}.kdet-piano-keys{position:relative;height:150px;border-radius:8px;overflow:hidden}.kdet-key{position:absolute;border:1px solid rgba(255,255,255,.15);transition:background .3s}.kdet-white{width:14.2%;height:100%;background:linear-gradient(#fafafa,#e6e6e6);border-radius:0 0 6px 6px;cursor:default}.kdet-white span{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:.7rem;font-weight:700;color:#333}.kdet-black{width:6%;height:60%;background:linear-gradient(#222,#000);border-radius:0 0 4px 4px;z-index:2;cursor:default}.kdet-key.in-scale{box-shadow:inset 0 0 0 3px var(--yellow)}.kdet-white.in-scale{background:linear-gradient(#fff8d6,#ffe88a)}.kdet-white.in-scale span{color:#6b5b00}.kdet-black.in-scale{background:linear-gradient(#4a4a4a,#1a1a1a);box-shadow:inset 0 0 0 2px var(--yellow)}.kdet-key.root{box-shadow:inset 0 0 0 4px var(--yellow)}.kdet-values{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:32px 0}.kdet-value{background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px 16px;text-align:center}.kdet-value-label{display:block;font-size:.6rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#fff6;margin-bottom:12px}.kdet-value-big{display:block;font-family:Syne,sans-serif;font-size:1.5rem;font-weight:800;color:var(--yellow)}.kdet-note{background:#ffd6000f;border:1px solid rgba(255,214,0,.15);border-radius:12px;padding:20px 24px;margin:24px 0;font-size:.85rem;color:#fff9;line-height:1.7}.kdet-cta{text-align:center;padding:36px 0 0;border-top:1px solid rgba(255,255,255,.06);margin-top:32px}.kdet-cta-text{font-size:1rem;font-weight:300;color:#ffffff80;margin-bottom:20px}.kdet-cta-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:var(--yellow)!important;color:#111!important;font-size:.75rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;border-radius:100px;transition:transform .3s,box-shadow .3s}.kdet-cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px #ffd60040}.kdet-cta-btn svg{width:16px;height:16px}@media(max-width:640px){.kdet-values{grid-template-columns:1fr}.upload-zone{padding:40px 20px}.result-card{padding:24px}.kdet-piano-keys{height:120px}.kdet-white span{font-size:.55rem}}
