.dt-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:24px;align-items:stretch}
.dt-hero__copy,.dt-hero__panel,.dt-game-card,.dt-side .notice-card{border:1px solid rgba(255,210,120,.22);background:linear-gradient(135deg,rgba(20,16,10,.96),rgba(8,10,18,.9));box-shadow:0 0 28px rgba(255,180,40,.08);border-radius:24px;padding:24px}
.dt-hero h1{font-size:clamp(2.1rem,6vw,5.4rem);margin:.25rem 0}
.dt-rules-mini{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.dt-rules-mini span{border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:8px 12px;background:rgba(255,255,255,.04)}
.dt-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.dt-game-top{display:flex;justify-content:space-between;gap:16px;align-items:start}
.dt-scorebox{min-width:130px;text-align:center;border:1px solid rgba(255,210,120,.32);border-radius:18px;padding:14px;background:rgba(255,190,80,.06)}
.dt-scorebox span,.dt-stats span,.dt-result-grid span{display:block;color:var(--muted,#9fb1c7);font-size:.82rem}
.dt-scorebox strong{font-size:2.2rem}
.dt-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0}
.dt-stats div,.dt-result-grid div{border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:10px;background:rgba(255,255,255,.035)}
.dt-stage{display:flex;justify-content:center;margin:18px 0 12px;overflow:hidden;padding:10px}

/* v0.9.1: Dikey parkur. Başlangıç altta, finiş üstte. */
.dt-path{position:relative;width:min(100%,420px);height:620px;touch-action:none;user-select:none;border:1px solid rgba(255,255,255,.12);border-radius:26px;background:linear-gradient(180deg,rgba(20,16,8,.94),rgba(12,18,32,.96)),repeating-linear-gradient(180deg,rgba(255,255,255,.08) 0 2px,transparent 2px 54px);box-shadow:inset 0 0 44px rgba(0,0,0,.46),0 0 22px rgba(255,200,100,.08);overflow:hidden}
.dt-path::before{content:'';position:absolute;left:50%;top:7%;bottom:5%;width:14px;transform:translateX(-50%);border-radius:999px;background:rgba(0,0,0,.86);border:1px solid rgba(255,255,255,.06);box-shadow:inset 0 0 6px rgba(255,255,255,.02),0 0 6px rgba(0,0,0,.38)}
.dt-path::after{content:'BAŞLA';position:absolute;left:50%;bottom:0;transform:translateX(-50%);font-size:.78rem;font-weight:900;letter-spacing:.08em;color:rgba(255,255,255,.55)}
.dt-path.is-forwarding{box-shadow:inset 0 0 44px rgba(0,0,0,.46),0 0 30px rgba(120,255,190,.14)}
.dt-zone{position:absolute;left:0;right:0;background:linear-gradient(90deg,rgba(255,205,80,.07),rgba(255,205,80,.22),rgba(255,90,40,.08));border-top:1px solid rgba(255,220,120,.28);border-bottom:1px solid rgba(255,220,120,.28)}
.dt-zone--one{top:18%;height:18%}
.dt-zone--two{top:43%;height:18%}
.dt-zone--three{top:68%;height:18%}
.dt-finish{position:absolute;left:50%;top:14px;right:auto;transform:translateX(-50%);font-size:.82rem;font-weight:900;letter-spacing:.08em;color:rgba(255,255,255,.75);z-index:3}
.dt-finish::after{content:'';position:absolute;left:50%;top:26px;width:96px;height:3px;transform:translateX(-50%);border-radius:999px;background:rgba(255,230,130,.7);box-shadow:0 0 16px rgba(255,220,120,.25)}

/* v0.9.1: Blok yerine stilize yarışmacı figürü. */
.dt-player{--dt-lean:0deg;--dt-x:50%;--dt-y:88%;position:absolute;left:var(--dt-x);top:var(--dt-y);width:52px;height:82px;transform:translate(-50%,-50%) rotate(var(--dt-lean));transform-origin:50% 78%;display:block;transition:filter .12s ease;filter:drop-shadow(0 0 6px rgba(255,255,255,.08))}
.dt-player span{position:absolute;display:block}
.dt-head{left:50%;top:0;width:18px;height:18px;transform:translateX(-50%);border-radius:50%;background:linear-gradient(145deg,rgba(255,255,255,1),rgba(190,198,208,.96));box-shadow:0 0 6px rgba(255,255,255,.10)}
.dt-body{left:50%;top:20px;width:22px;height:34px;transform:translateX(-50%);border-radius:12px 12px 9px 9px;background:linear-gradient(145deg,rgba(248,249,250,.98),rgba(128,138,150,.96));box-shadow:inset 0 0 6px rgba(255,255,255,.18),0 0 6px rgba(255,255,255,.05)}
.dt-arm{top:27px;width:7px;height:28px;border-radius:999px;background:rgba(232,236,241,.98);transform-origin:50% 4px}
.dt-arm--left{left:9px;transform:rotate(22deg);animation:dtWalkArmLeft .62s ease-in-out infinite}
.dt-arm--right{right:9px;transform:rotate(-22deg);animation:dtWalkArmRight .62s ease-in-out infinite}
.dt-leg{top:52px;width:8px;height:31px;border-radius:999px;background:rgba(148,156,168,.98);transform-origin:50% 3px}
.dt-leg--left{left:20px;transform:rotate(13deg);animation:dtWalkLegLeft .62s ease-in-out infinite}
.dt-leg--right{right:20px;transform:rotate(-13deg);animation:dtWalkLegRight .62s ease-in-out infinite}
.dt-player::after{content:'';display:none !important;width:0;height:0;background:none;box-shadow:none}
.dt-player.is-danger{filter:drop-shadow(0 0 18px rgba(255,60,60,.82));animation:dtShake .13s linear infinite}
.dt-player.is-fallen{filter:grayscale(.45);transform:translate(-50%,-50%) rotate(72deg)}
@keyframes dtShake{0%,100%{margin-left:0}50%{margin-left:4px}}

.dt-balance{margin:14px 0}
.dt-balance__track{position:relative;height:34px;border-radius:999px;background:linear-gradient(90deg,rgba(255,60,60,.3),rgba(255,255,255,.05),rgba(255,60,60,.3));border:1px solid rgba(255,255,255,.14);overflow:hidden;box-shadow:inset 0 0 18px rgba(0,0,0,.45)}
.dt-balance__safe{position:absolute;top:4px;bottom:4px;left:50%;width:13%;transform:translateX(-50%);border-radius:999px;background:rgba(80,255,170,.42);box-shadow:0 0 22px rgba(90,255,180,.2);transition:width .18s ease}
.dt-balance__needle{position:absolute;top:2px;bottom:2px;left:50%;width:5px;margin-left:-2.5px;border-radius:999px;background:#fff;box-shadow:0 0 18px rgba(255,255,255,.75);transition:background .1s ease}
.dt-balance__needle.is-danger{background:#ff6464;box-shadow:0 0 18px rgba(255,70,70,.75)}
.dt-balance__labels{display:flex;justify-content:space-between;align-items:center;font-size:.86rem;color:var(--muted,#9fb1c7);margin-top:7px}
.dt-balance__labels strong{color:#fff}
.dt-message{min-height:42px;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:12px 14px;background:rgba(255,255,255,.035);margin:12px 0;color:#fff3d7}
.dt-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.dt-touch-tip{margin-top:12px;text-align:center;color:#fff3d7;font-size:.9rem;border:1px solid rgba(120,255,190,.18);background:rgba(40,140,100,.09);border-radius:14px;padding:10px 12px}
.dt-mobile-pad{display:grid;grid-template-columns:repeat(3,minmax(90px,150px));gap:10px;justify-content:center;margin-top:14px}
.dt-mobile-pad button{min-height:58px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;font-weight:900;font-size:1.05rem;touch-action:none}
.dt-mobile-pad button.is-held{background:rgba(255,215,120,.22);box-shadow:0 0 18px rgba(255,210,120,.2)}
.dt-mobile-pad [data-dt-forward]{background:rgba(80,255,170,.16);border-color:rgba(120,255,190,.34);font-size:1rem}
.dt-keyboard-hint{font-size:.9rem;color:var(--muted,#9fb1c7);text-align:center;margin-top:10px}
.dt-result{margin-top:18px;border:1px solid rgba(120,255,190,.25);border-radius:18px;padding:16px;background:rgba(20,120,80,.12)}
.dt-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.dt-side{display:grid;gap:16px}
.dt-board-table h3{margin:0 0 12px}
.dt-board-table{padding:16px}
.dt-board-table .rule-table{font-size:.92rem}
@media (max-width:980px){.dt-hero,.dt-layout{grid-template-columns:1fr}.dt-side{grid-template-columns:1fr 1fr}.dt-path{height:560px;width:min(100%,390px)}}
@media (max-width:680px){.dt-hero__copy,.dt-hero__panel,.dt-game-card{padding:18px;border-radius:20px}.dt-game-top{display:block}.dt-scorebox{margin-top:12px}.dt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.dt-side{grid-template-columns:1fr}.dt-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dt-controls .btn{width:100%;justify-content:center}.dt-mobile-pad{grid-template-columns:1fr 1fr 1fr}.dt-path{height:520px;width:min(100%,330px)}.dt-player{width:48px;height:70px}}
@media (max-width:420px){.dt-path{height:480px;width:min(100%,300px)}}

@keyframes dtWalkLegLeft{0%,100%{transform:rotate(15deg)}50%{transform:rotate(-12deg)}}
@keyframes dtWalkLegRight{0%,100%{transform:rotate(-15deg)}50%{transform:rotate(12deg)}}
@keyframes dtWalkArmLeft{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(22deg)}}
@keyframes dtWalkArmRight{0%,100%{transform:rotate(12deg)}50%{transform:rotate(-22deg)}}

.dt-path.is-forwarding::before{background:rgba(0,0,0,.96);box-shadow:0 0 8px rgba(255,255,255,.05),inset 0 0 6px rgba(255,255,255,.03)}

.dt-mobile-pad [data-dt-forward].is-held{background:rgba(255,92,92,.26);border-color:rgba(255,210,90,.55);box-shadow:0 0 22px rgba(255,170,70,.28)}
.dt-balance__safe{transition:width .08s ease}

.dt-path.is-forwarding .dt-player{filter:drop-shadow(0 0 8px rgba(255,255,255,.14))}