@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=DM+Sans:wght@300;400;500;600&display=swap');
.dke-wrap{--navy:#0B1F3A;--teal:#0E7C6B;--teal2:#12A08A;--teal-light:#E6F5F2;--gold:#C9A84C;--gold-light:#FBF4E0;--red:#C0392B;--red-light:#FCEBEB;--green:#1a7a4a;--green-light:#E8F5EE;--cream:#F7F4EF;--white:#fff;--gray:#6B7280;--border:#E2EBE8;font-family:'DM Sans',sans-serif;max-width:720px;margin:2rem auto;background:var(--white);border-radius:20px;box-shadow:0 8px 40px rgba(11,31,58,.1);overflow:hidden;border:1.5px solid var(--border);}
.dke-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;gap:16px;color:var(--gray)}
.dke-spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--teal);border-radius:50%;animation:dkeSpin .8s linear infinite}
@keyframes dkeSpin{to{transform:rotate(360deg)}}
.dke-header{padding:2.2rem 2.2rem 1.4rem;background:linear-gradient(135deg,var(--cream),#fff);border-bottom:1.5px solid var(--border)}
.dke-tag{font-size:10.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--teal);margin-bottom:10px;display:flex;align-items:center;gap:7px}
.dke-tag::before{content:'';width:18px;height:2px;background:var(--teal)}
.dke-title{font-family:'Playfair Display',serif;font-size:clamp(1.2rem,3vw,1.6rem);font-weight:700;color:var(--navy);margin:0 0 8px;line-height:1.25}
.dke-desc{font-size:.9rem;color:var(--gray);line-height:1.65;margin:0}
.dke-progress{height:4px;background:rgba(14,124,107,.1)}
.dke-progress-fill{height:100%;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .5s}
.dke-step{text-align:right;font-size:.72rem;font-weight:600;color:var(--teal);padding:.6rem 1.8rem .1rem;letter-spacing:.04em;text-transform:uppercase}
.dke-qarea{padding:1.6rem 2.2rem 1rem;min-height:280px}
.dke-q-tag{display:inline-block;background:rgba(14,124,107,.1);color:var(--teal);font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.2rem .7rem;border-radius:20px;margin-bottom:.8rem}
.dke-q-text{font-family:'Playfair Display',serif;font-size:clamp(1rem,2.5vw,1.18rem);color:var(--navy);line-height:1.5;margin:0 0 1.4rem}
.dke-options{display:flex;flex-direction:column;gap:.6rem}
.dke-option{display:flex;align-items:center;gap:.85rem;background:var(--white);border:2px solid rgba(11,31,58,.1);border-radius:11px;padding:.85rem 1rem;cursor:pointer;font-family:'DM Sans',sans-serif;font-size:.93rem;color:#333;text-align:left;width:100%;transition:all .2s}
.dke-option:hover{border-color:var(--teal);background:rgba(14,124,107,.04);transform:translateX(3px)}
.dke-option.selected{border-color:var(--teal);background:rgba(14,124,107,.08);color:var(--navy);font-weight:500}
.dke-option.selected .dke-dot{background:var(--teal);border-color:var(--teal)}
.dke-dot{flex-shrink:0;width:19px;height:19px;border-radius:50%;border:2px solid rgba(11,31,58,.18);background:var(--white);transition:all .2s}
.dke-nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 2.2rem 1.8rem;gap:1rem}
.dke-back{background:transparent;border:1.5px solid rgba(11,31,58,.14);border-radius:50px;padding:.65rem 1.4rem;font-family:'DM Sans',sans-serif;font-size:.88rem;color:#666;cursor:pointer;transition:all .2s}
.dke-next{background:var(--navy);color:#fff;border:none;border-radius:50px;padding:.7rem 1.9rem;font-family:'DM Sans',sans-serif;font-size:.93rem;font-weight:600;cursor:pointer;transition:all .2s;margin-left:auto}
.dke-next:disabled{opacity:.35;cursor:not-allowed}
.dke-next:not(:disabled):hover{background:#17304f;transform:translateY(-2px)}
/* Result */
.dke-result-hdr{padding:2rem 2.2rem 1.5rem;text-align:center}
.dke-result-hdr.green{background:linear-gradient(135deg,var(--green-light),#fff);border-bottom:3px solid var(--green)}
.dke-result-hdr.warn{background:linear-gradient(135deg,var(--gold-light),#fff);border-bottom:3px solid var(--gold)}
.dke-result-hdr.alert{background:linear-gradient(135deg,var(--red-light),#fff);border-bottom:3px solid var(--red)}
.dke-result-hdr.teal{background:linear-gradient(135deg,var(--teal-light),#fff);border-bottom:3px solid var(--teal)}
.dke-badge{display:inline-flex;align-items:center;gap:.5rem;border-radius:30px;padding:.3rem .9rem;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;margin-bottom:.9rem}
.dke-result-hdr.green .dke-badge{background:rgba(26,122,74,.12);color:var(--green)}
.dke-result-hdr.warn  .dke-badge{background:rgba(201,168,76,.15);color:#7a5c00}
.dke-result-hdr.alert .dke-badge{background:rgba(192,57,43,.12);color:var(--red)}
.dke-result-hdr.teal  .dke-badge{background:rgba(14,124,107,.12);color:var(--teal)}
.dke-result-title{font-family:'Playfair Display',serif;font-size:clamp(1.2rem,3vw,1.65rem);color:var(--navy);margin:0 0 .4rem}
.dke-result-sub{font-size:.87rem;color:var(--gray);margin:0}
.dke-body{padding:1.8rem 2.2rem 1.4rem}
.dke-card{background:var(--cream);border-radius:13px;padding:1.3rem 1.5rem;margin-bottom:1.1rem}
.dke-card h4{font-family:'Playfair Display',serif;font-size:.97rem;color:var(--navy);margin:0 0 .6rem}
.dke-card p{font-size:.88rem;color:#444;line-height:1.7;margin:0}
.dke-list{list-style:none;padding:0;margin:.5rem 0 0;display:flex;flex-direction:column;gap:.35rem}
.dke-list li{font-size:.86rem;color:#444;padding-left:1.3rem;position:relative}
.dke-list li::before{content:'✓';position:absolute;left:0;color:var(--teal);font-weight:700}
.dke-urgency{border-radius:11px;padding:.95rem 1.1rem;margin-bottom:1.1rem}
.dke-urgency.green{background:var(--green-light);border:1px solid rgba(26,122,74,.2)}
.dke-urgency.warn{background:var(--gold-light);border:1px solid rgba(201,168,76,.3)}
.dke-urgency.alert{background:var(--red-light);border:1px solid rgba(192,57,43,.25)}
.dke-urgency p{font-size:.86rem;margin:0;line-height:1.6;color:#333}
.dke-urgency strong{display:block;margin-bottom:.2rem}
.dke-cta{background:var(--navy);border-radius:13px;padding:1.3rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.dke-cta p{color:rgba(255,255,255,.82);font-size:.86rem;margin:0;line-height:1.5}
.dke-cta strong{color:#fff;display:block;margin-bottom:.2rem}
.dke-cta-btn{background:var(--gold);color:var(--navy);border:none;border-radius:50px;padding:.65rem 1.4rem;font-family:'DM Sans',sans-serif;font-size:.88rem;font-weight:700;cursor:pointer;white-space:nowrap;text-decoration:none;display:inline-block;transition:all .2s}
.dke-cta-btn:hover{background:#d4a930;transform:translateY(-2px);color:var(--navy);text-decoration:none}
/* Skor göstergesi (Omurga Skoru için) */
.dke-score-ring-wrap{display:flex;flex-direction:column;align-items:center;margin:1.2rem 0}
.dke-score-ring{width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;border:8px solid var(--border);position:relative;margin-bottom:.5rem}
.dke-score-num{font-size:2rem;font-weight:700;color:var(--navy);line-height:1}
.dke-score-den{font-size:.75rem;color:var(--gray);font-weight:500}
.dke-score-label{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.dke-score-bars{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:1rem 0}
.dke-sbar{background:var(--white);border:1.5px solid var(--border);border-radius:10px;padding:.6rem .8rem}
.dke-sbar-label{font-size:.7rem;font-weight:600;color:var(--gray2);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.dke-sbar-track{height:6px;background:var(--border);border-radius:3px;overflow:hidden}
.dke-sbar-fill{height:100%;border-radius:3px;transition:width .8s ease}
.dke-sbar-val{font-size:.72rem;color:var(--gray);margin-top:3px}
.dke-restart{display:block;text-align:center;margin:.5rem 0 1rem;background:none;border:none;font-family:'DM Sans',sans-serif;font-size:.8rem;color:#999;cursor:pointer;text-decoration:underline}
.dke-disclaimer{margin:1rem 0 0;padding:.8rem 1rem;background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.2);border-radius:9px;font-size:.76rem;color:#5a4500;line-height:1.6}
@keyframes dkeFadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.dke-screen{animation:dkeFadeIn .35s ease}
@media(max-width:540px){
    .dke-wrap{margin:1rem;border-radius:14px}
    .dke-header,.dke-qarea,.dke-nav,.dke-body{padding-left:1.2rem;padding-right:1.2rem}
    .dke-result-hdr{padding:1.5rem 1.2rem 1.2rem}
    .dke-score-bars{grid-template-columns:1fr}
}