/* Интерактивная модель «Чек уходит в ОФД» (страница ОФД + Касса, /ru/ofd-rekassa).
   Самостоятельный виджет: все стили внутри #frd-root. */
#frd-root,#frd-root *{box-sizing:border-box;}
#frd-root{--frd-tiffany:#15baaa;--frd-tiffany-dark:#10a294;--frd-tiffany-ink:#0b7e73;--frd-stroke:#dfdfdf;--frd-bg2:#f2f3f1;--frd-accent:#ecf9f8;--frd-success:#12b500;--frd-text:rgba(0,0,0,.87);--frd-text2:rgba(0,0,0,.54);--frd-text3:rgba(0,0,0,.32);--frd-gradient:linear-gradient(285deg,#41c9b9 22.4%,#43bed7 83.44%);--frd-ease-out-quad:cubic-bezier(.25,.46,.45,.94);--frd-ease-out-quint:cubic-bezier(.23,1,.32,1);--frd-ease-in-out-quad:cubic-bezier(.455,.03,.515,.955);--frd-ease-in-out-cubic:cubic-bezier(.645,.045,.355,1);position:relative;overflow:hidden;background:#fff;border:1px solid var(--frd-stroke);border-radius:24px;box-shadow:0 32px 64px -24px rgba(0,56,55,.25);font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--frd-text);}
#frd-root .frd-topbar{display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(223,223,223,.7);background:rgba(255,255,255,.7);padding:12px 24px;}
#frd-root .frd-dots{display:flex;gap:6px;}
#frd-root .frd-dots i{width:10px;height:10px;border-radius:999px;background:rgba(0,0,0,.1);display:block;}
#frd-root .frd-badge{margin-left:8px;background:#d9f6ee;color:var(--frd-tiffany-ink);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;line-height:1;}
#frd-root .frd-counter{margin-left:auto;font-size:12px;font-weight:500;color:var(--frd-text2);font-variant-numeric:tabular-nums;}
#frd-root .frd-conveyor{display:flex;align-items:flex-start;gap:8px;padding:24px 28px 0;}
#frd-root .frd-node-col{display:flex;flex-direction:column;align-items:center;gap:8px;width:104px;flex-shrink:0;}
#frd-root .frd-node{display:grid;place-items:center;width:56px;height:56px;border-radius:16px;border:1px solid var(--frd-stroke);color:var(--frd-text2);background:#fff;transition:border-color .3s,background-color .3s,color .3s,box-shadow .3s;position:relative;}
#frd-root .frd-node.is-active{border-color:var(--frd-tiffany);background:var(--frd-accent);color:var(--frd-tiffany-ink);box-shadow:0 0 0 5px rgba(21,186,170,.12);}
#frd-root .frd-node svg{width:24px;height:24px;}
#frd-root .frd-node-label{color:var(--frd-text2);font-size:11px;font-weight:500;text-align:center;line-height:1.2;}
#frd-root .frd-rail{position:relative;flex:1;min-width:16px;height:24px;margin-top:28px;overflow:hidden;}
#frd-root .frd-track{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);border-top:2px dashed var(--frd-stroke);}
#frd-root .frd-fill{position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%) scaleX(0);transform-origin:left;background:#8addd5;transition:transform .8s var(--frd-ease-in-out-cubic);}
#frd-root .frd-packet{position:absolute;inset:0;transform:translateX(-100%);opacity:0;transition:transform .8s var(--frd-ease-in-out-cubic),opacity .8s var(--frd-ease-in-out-cubic);}
#frd-root .frd-packet span{position:absolute;top:50%;right:0;transform:translateY(-50%);width:10px;height:10px;border-radius:999px;background:var(--frd-tiffany);}
#frd-root .frd-shield-wrap{position:relative;display:grid;place-items:center;width:24px;height:24px;}
#frd-root .frd-shield-wrap svg{width:24px;height:24px;}
#frd-root .frd-shield-check{position:absolute;inset:0;opacity:0;}
#frd-root #frd-shield-check-path{transition:stroke-dashoffset .4s var(--frd-ease-out-quad);}
#frd-root .frd-stamp-badge{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:999px;background:var(--frd-success);color:#fff;display:grid;place-items:center;transform:scale(0);transition:transform .35s cubic-bezier(.34,1.56,.64,1);}
#frd-root .frd-stamp-badge svg{width:12px;height:12px;}
#frd-root .frd-stamp-badge.is-visible{transform:scale(1);}
#frd-root #frd-icon-kgd{transition:transform .5s var(--frd-ease-out-quad);}
@keyframes frd-buzz{
    0%{transform:translate(0,0) rotate(0)}
    20%{transform:translate(-1px,0) rotate(-4deg)}
    40%{transform:translate(1px,0) rotate(4deg)}
    60%{transform:translate(-1px,0) rotate(-3deg)}
    80%{transform:translate(1px,0) rotate(3deg)}
    100%{transform:translate(0,0) rotate(0)}
}
#frd-root .frd-buzz-target.is-buzzing{animation:frd-buzz .4s linear infinite;}
#frd-root .frd-body{display:grid;grid-template-columns:1fr;gap:20px;padding:20px 24px 28px;}
@media(min-width:640px){
    #frd-root .frd-body{grid-template-columns:236px minmax(0,1fr);gap:24px;}
}
#frd-root .frd-printer-col{position:relative;max-width:236px;margin:0 auto;}
@media(min-width:640px){
    #frd-root .frd-printer-col{margin:0;}
}
#frd-root .frd-printer-body{position:relative;z-index:20;margin:0 -10px;border-radius:16px;background:linear-gradient(to bottom,#0b4b49,#003837);padding:10px 0 6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 2px 4px -1px rgba(0,40,39,.3),0 14px 26px -10px rgba(0,40,39,.4);}
#frd-root .frd-printer-row{display:flex;align-items:center;gap:8px;padding:0 14px;}
#frd-root .frd-printer-row svg{width:16px;height:16px;color:rgba(255,255,255,.75);flex-shrink:0;}
#frd-root .frd-led{width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.25);flex-shrink:0;transition:background-color .3s;}
#frd-root .frd-led.is-running{background:var(--frd-tiffany);animation:frd-blink 1.2s var(--frd-ease-in-out-quad) infinite;}
@keyframes frd-blink{
    0%,100%{opacity:1}
    50%{opacity:.3}
}
#frd-root .frd-receipt-no{margin-left:auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;letter-spacing:.05em;color:rgba(255,255,255,.4);font-variant-numeric:tabular-nums;}
#frd-root .frd-slot{margin:10px 8px 0;height:6px;border-radius:999px;background:rgba(0,0,0,.8);box-shadow:inset 0 1px 2px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.07);}
#frd-root .frd-paper-clip{position:relative;z-index:30;margin:-8px -12px -20px;padding:0 14px 20px;overflow:hidden;}
#frd-root .frd-slot-shadow{pointer-events:none;position:absolute;top:0;left:12px;right:12px;z-index:10;height:16px;background:linear-gradient(to bottom,rgba(0,0,0,.35),rgba(0,0,0,.08) 40%,transparent);}
#frd-root .frd-paper-min-h{min-height:430px;}
#frd-root .frd-receipt{transform:translateY(-100%);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px;line-height:1.4;}
#frd-root .frd-receipt[hidden]{display:none;}
#frd-root .frd-tape{border-left:1px solid rgba(223,223,223,.8);border-right:1px solid rgba(223,223,223,.8);background:#fff;padding:14px 12px 8px;box-shadow:0 10px 24px -10px rgba(0,0,0,.3);}
#frd-root .frd-seller-name{margin:0;text-align:center;font-size:12px;font-weight:700;letter-spacing:.02em;}
#frd-root .frd-tape-sub{margin:2px 0 0;text-align:center;font-size:8.5px;color:var(--frd-text2);}
#frd-root .frd-hr{margin:6px 0;border-top:1px dashed var(--frd-stroke);}
#frd-root .frd-tape-title{margin:0;text-align:center;font-size:11px;font-weight:700;letter-spacing:.02em;}
#frd-root .frd-tape-kind{margin:0;font-size:10px;font-weight:600;}
#frd-root .frd-fields{margin:4px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 8px;font-size:8.5px;line-height:1.6;color:var(--frd-text2);}
#frd-root .frd-fields div{display:flex;justify-content:space-between;gap:4px;}
#frd-root .frd-fields dt,#frd-root .frd-fields dd{margin:0;font-weight:400;}
#frd-root .frd-fields dd{font-variant-numeric:tabular-nums;}
#frd-root .frd-fp-row{opacity:.4;transition:opacity .3s var(--frd-ease-out-quad);}
#frd-root .frd-fp-row.is-signed{opacity:1;}
#frd-root .frd-items{margin-top:6px;}
#frd-root .frd-items>div{margin-bottom:6px;}
#frd-root .frd-item-name{display:flex;justify-content:space-between;gap:8px;margin:0;text-transform:uppercase;}
#frd-root .frd-item-gtin{flex-shrink:0;font-size:8px;color:var(--frd-text3);}
#frd-root .frd-item-sub{display:flex;justify-content:space-between;gap:8px;margin:0;color:var(--frd-text2);}
#frd-root .frd-item-sub b{font-weight:400;color:var(--frd-text);}
#frd-root .frd-vat-row{display:flex;justify-content:space-between;gap:8px;margin:0;font-size:9.5px;color:var(--frd-text2);}
#frd-root .frd-total-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:4px;font-size:11px;font-weight:700;}
#frd-root .frd-total-row span:last-child{font-size:13px;font-variant-numeric:tabular-nums;}
#frd-root .frd-pay-row{display:flex;justify-content:space-between;gap:8px;margin:2px 0 0;font-size:9.5px;color:var(--frd-text2);}
#frd-root .frd-ofd-block{opacity:.3;transition:opacity .3s var(--frd-ease-out-quad);}
#frd-root .frd-ofd-block.is-signed{opacity:1;}
#frd-root .frd-ofd-row{display:flex;align-items:center;gap:8px;padding-bottom:4px;}
#frd-root .frd-ofd-text{min-width:0;flex:1;}
#frd-root .frd-ofd-title{margin:0;font-size:10px;font-weight:600;}
#frd-root .frd-ofd-verify{margin:0;font-size:8.5px;line-height:1.3;color:var(--frd-text2);}
#frd-root .frd-ofd-site{margin:0;font-size:9.5px;font-weight:600;color:var(--frd-tiffany-ink);}
#frd-root .frd-qr{width:56px;height:56px;flex-shrink:0;}
#frd-root .frd-qr rect{opacity:0;transition:opacity .26s var(--frd-ease-out-quad);}
#frd-root .frd-footer{margin:0;text-align:center;font-size:9px;color:var(--frd-text3);}
#frd-root .frd-zigzag{display:block;width:100%;height:9px;margin-top:-1px;}
#frd-root .frd-status-col{display:flex;min-width:0;flex-direction:column;}
#frd-root .frd-status-line{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;}
#frd-root .frd-status-icon{width:18px;height:18px;flex-shrink:0;display:grid;place-items:center;}
#frd-root .frd-status-icon svg{width:18px;height:18px;}
#frd-root .frd-status-icon.frd-spin svg{animation:frd-spin 1s linear infinite;}
@keyframes frd-spin{
    to{transform:rotate(360deg);}
}
#frd-root .frd-journal{list-style:none;margin:12px 0 0;padding:8px;min-height:110px;overflow:hidden;border:1px solid rgba(223,223,223,.8);border-radius:12px;background:rgba(242,243,241,.7);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px;line-height:1.4;}
#frd-root .frd-journal li{display:flex;align-items:stretch;gap:6px;opacity:0;transform:translateY(4px);transition:opacity .3s var(--frd-ease-out-quad),transform .3s var(--frd-ease-out-quad);}
#frd-root .frd-journal li.is-in{opacity:1;transform:translateY(0);}
#frd-root .frd-journal li.is-ok{color:var(--frd-tiffany-ink);}
#frd-root .frd-journal li:not(.is-ok){color:var(--frd-text2);}
#frd-root .frd-journal time{flex-shrink:0;padding:3px 0;color:var(--frd-text3);font-variant-numeric:tabular-nums;}
#frd-root .frd-journal .frd-journal-text{min-width:0;padding:3px 0 3px 6px;border-left:1px solid rgba(223,223,223,.7);word-break:break-word;}
#frd-root .frd-cta{margin-top:auto;padding-top:16px;display:flex;flex-direction:column;}
#frd-root .frd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 24px;border:none;border-radius:12px;background-image:var(--frd-gradient);color:#fff;font-size:15px;font-weight:500;cursor:pointer;box-shadow:0 10px 24px -10px rgba(21,186,170,.7);transition:box-shadow .3s var(--frd-ease-out-quint),filter .3s var(--frd-ease-out-quint),transform .3s var(--frd-ease-out-quint),opacity .3s;}
#frd-root .frd-btn svg{width:18px;height:18px;flex-shrink:0;}
#frd-root .frd-btn:hover:not(:disabled){box-shadow:0 16px 32px -10px rgba(21,186,170,.8);filter:brightness(1.06);transform:translateY(-2px);}
#frd-root .frd-btn:active:not(:disabled){transform:scale(.98);}
#frd-root .frd-btn:disabled{cursor:not-allowed;opacity:.55;box-shadow:none;}
#frd-root .frd-hint{margin:10px 0 0;text-align:center;font-size:11px;line-height:1.3;color:var(--frd-text3);}
@media(max-width:639px){
    #frd-root .frd-conveyor{padding:20px 16px 0;gap:4px;}
    #frd-root .frd-node-col{width:64px;}
    #frd-root .frd-node{width:48px;height:48px;border-radius:14px;}
    #frd-root .frd-node svg{width:20px;height:20px;}
    #frd-root .frd-shield-wrap,#frd-root .frd-shield-wrap svg{width:20px;height:20px;}
    #frd-root .frd-body{padding:16px 16px 20px;}
}
@media(prefers-reduced-motion:reduce){
    #frd-root *{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}