/* Otomatik yedek detay sayfası — sahne: saat 23:00 → telefon yedek ilerlemesi → Excel dosyası e-postaya uçar — .oy-* */
.oy{position:relative;display:grid;grid-template-columns:auto 230px minmax(0,1fr);gap:18px;align-items:center;max-width:580px;margin:0 auto;padding:8px 0 12px}
.oy-clock{display:flex;flex-direction:column;align-items:center;gap:6px;color:#fff;min-width:90px}
.oy-time{display:inline-flex;align-items:center;font-size:38px;font-weight:800;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums;background:#0b1f15;border:1.5px solid rgba(255,255,255,.1);border-radius:16px;padding:12px 14px;box-shadow:0 18px 40px -20px rgba(0,0,0,.8)}
.oy-time i{font-style:normal;margin:0 2px;color:#34d399;animation:oyBlink 1s steps(1) infinite;transform:translateY(-3px)}
.oy-time b{display:inline-block;color:#fff}
.oy-time b.flip{animation:oyFlip .5s cubic-bezier(.3,.9,.3,1)}
.oy-clock small{font-size:11.5px;font-weight:700;color:rgba(214,235,224,.7);text-align:center}
.oy-clock small::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#34d399;margin-right:6px;vertical-align:1px}
.oy-phone{position:relative;justify-self:center}
.oy-prog{display:flex;flex-direction:column;gap:6px}
.oy-prog .fph-h{margin-bottom:0}
.oy-track{height:8px;border-radius:4px;background:#e4eae6;overflow:hidden}
.oy-track i{display:block;height:100%;width:0;background:#1f7a57;border-radius:4px}
.oy-counts{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:9px;color:#5b6b62;font-weight:600}
.oy-counts b{color:#0e2a20;font-variant-numeric:tabular-nums}
.oy-file{position:absolute;left:50%;top:262px;transform:translate(-50%,0) scale(.6);opacity:0;display:flex;align-items:center;gap:7px;background:#fff;color:#0e2a20;border-radius:12px;padding:7px 10px;font-size:11px;font-weight:800;white-space:nowrap;box-shadow:0 14px 30px rgba(0,0,0,.4);z-index:4;transition:opacity .3s,transform .35s cubic-bezier(.3,1.5,.4,1)}
.oy-file i{width:26px;height:26px;border-radius:7px;background:#15803d;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-style:normal;flex:none}
.oy-file.on{opacity:1;transform:translate(-50%,0) scale(1)}
.oy-file.fly{animation:oyFly 1.25s cubic-bezier(.5,0,.3,1) forwards}
.oy-mail{background:#fff;color:#0e2a20;border-radius:20px;padding:14px;min-width:0;box-shadow:0 24px 50px -26px rgba(0,0,0,.7);display:flex;flex-direction:column;gap:8px}
.oy-mail-h{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:800;color:#1f7a57;padding-bottom:8px;border-bottom:1px solid #e4eae6}
.oy-msg{display:flex;align-items:center;gap:9px;padding:7px 0}
.oy-msg i{width:30px;height:30px;border-radius:50%;background:#0e2a20;color:#6ee7b7;font-style:normal;font-weight:800;font-size:12px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.oy-msg>div{flex:1;min-width:0}
.oy-msg b{display:block;font-size:12.5px;font-weight:800}
.oy-msg small{display:block;font-size:10.5px;color:#5b6b62;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oy-att{display:inline-flex;align-items:center;gap:4px;font-size:9.5px;font-weight:800;color:#15803d;background:#e6f8ec;border-radius:7px;padding:4px 7px;flex:none}
.oy-msg-new{opacity:0;transform:translateY(-8px);transition:opacity .4s,transform .4s;background:#f5faf7;margin:0 -6px;padding:7px 6px;border-radius:12px}
.oy-msg-new.on{opacity:1;transform:none}
.oy-msg-old{opacity:.55}
.oy-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:4px}
.oy-week span{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:9px;font-weight:700;color:#5b6b62}
.oy-week span i{width:18px;height:18px;border-radius:50%;background:#e4eae6;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-style:normal;transition:background .35s,transform .35s}
.oy-week span.ok i{background:#15803d}
.oy-week span.today{color:#1f7a57}
.oy-week span.today.ok i{animation:oyPop .45s cubic-bezier(.3,1.6,.4,1)}
.oy-mail>small{font-size:10.5px;color:#5b6b62;font-weight:600}
@keyframes oyBlink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes oyFlip{0%{transform:translateY(-14px);opacity:0}100%{transform:none;opacity:1}}
@keyframes oyPop{0%{transform:scale(.4)}100%{transform:scale(1)}}
@keyframes oyFly{0%{transform:translate(-50%,0) scale(1);opacity:1}70%{opacity:1}100%{transform:translate(calc(-50% + var(--dx,0px)),var(--dy,0px)) scale(.45);opacity:0}}
@media (max-width:960px){
 .oy{grid-template-columns:minmax(0,1fr);gap:16px;max-width:100%;justify-items:center}
 .oy-clock{flex-direction:row;gap:12px}
 .oy-time{font-size:30px;padding:10px 12px}
 .oy-mail{width:100%;max-width:360px}
}
@media (prefers-reduced-motion:reduce){
 .oy-time i{animation:none}
 .oy-time b.flip,.oy-week span.today.ok i{animation:none}
 .oy-file,.oy-msg-new,.oy-week span i{transition:none}
}