/* Accounting-only, illustrative approval sequence. No real notification or transaction. */
.office-stage .iv-approval-story{position:absolute;left:5.5vw;bottom:138px;width:330px;height:450px;z-index:2;pointer-events:none;color:#e9ecf4}
.iv-approval-story[hidden]{display:none!important}
.iv-approval-story button,.iv-approval-story .iv-phone-scroll{pointer-events:auto}
.iv-approval-tools{position:absolute;top:-36px;left:20px;right:0;display:flex;align-items:center;justify-content:space-between;font:9px var(--mono);color:#e9dfff}
.iv-approval-tools button{background:#0b1d2bd9;border:1px solid #d6b5ff65;border-radius:50%;width:30px;height:30px;font-size:19px;color:#fff}
.iv-handset-wrap{position:absolute;inset:0;animation:iv-phone-arrive .7s ease-out both;transform-origin:50% 100%}
.iv-phone-hand{position:absolute;left:0;top:0;width:330px;height:450px;filter:drop-shadow(0 8px 9px #0005)}
.iv-phone{position:absolute;left:22px;top:0;width:240px;height:420px;border:7px solid #8472b4;border-radius:36px;background:#111423;box-shadow:inset 0 0 0 2px #b1a1d5,5px 9px 0 #423550,0 18px 40px #0007;overflow:hidden;transform:rotate(-4deg);isolation:isolate}
.iv-phone:before{content:"";position:absolute;top:8px;left:calc(50% - 36px);width:72px;height:18px;background:#08090f;border-radius:15px;z-index:5}
.iv-phone-screen{height:100%;padding:41px 12px 12px;background:radial-gradient(ellipse at 80% 5%,#7562a66b,transparent 75%),#191b2c;display:flex;flex-direction:column;gap:12px}
.iv-phone-status{display:flex;justify-content:space-between;font:9px var(--sans);color:#c8c2df;padding-inline:3px}
.iv-phone-time{text-align:center;font:46px/1 var(--sans);font-weight:500;letter-spacing:-.05em;margin:6px 0 0}.iv-phone-day{text-align:center;font-size:10px;color:#c8c2df}
.iv-phone-notice{display:block;border:1px solid #b5a3df44;border-radius:15px;background:#ddd6f11a;color:#fff;text-align:left;padding:13px 12px;line-height:1.6;margin-top:5px;width:100%;cursor:pointer}
.iv-phone-notice>span{display:block;font:9px var(--mono);color:#aef0d4;letter-spacing:.03em;margin-bottom:8px}.iv-phone-notice strong{font-size:12px;font-weight:500}.iv-phone-notice small{display:block;font-size:10px;color:#bfb5d9;margin-top:11px}.iv-phone-notice:hover{background:#ddd6f12b}
.iv-phone-demo{margin-top:auto;color:#b8b2ca;font:8px/1.6 var(--mono);text-align:center}
.iv-phone-thumb{position:absolute;left:0;top:0;width:330px;height:450px;pointer-events:none;z-index:3}
.iv-phone-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a7a1b6 #efedf2;min-height:0;flex:1;background:#f7f6f2;color:#10212d;border-radius:11px;padding:15px 12px;touch-action:pan-y;line-height:1.5}
.iv-phone-scroll:focus-visible{outline:2px solid #10c7c4;outline-offset:2px}
.iv-phone-invoice-title{font-size:17px;font-weight:600;margin:3px 0 10px}.iv-phone-tag{font:8px var(--mono);color:#65747c;letter-spacing:.03em}.iv-phone-supplier{font-size:11px;margin-top:8px}.iv-phone-meta{font-size:10px;line-height:1.8;margin-top:10px;color:#62707b}
.iv-phone-lines{margin-top:15px;border-top:1px solid #15232d28}.iv-phone-line{padding:12px 0;border-bottom:1px solid #15232d20;font-size:10px}.iv-phone-line strong{display:block;font-size:11px;font-weight:600;margin-bottom:5px}.iv-phone-line>div{display:flex;justify-content:space-between;color:#61717a}.iv-phone-total{display:flex;justify-content:space-between;align-items:center;margin:18px 0 9px;font-size:10px}.iv-phone-total strong{font-size:16px}.iv-phone-tax-note{font-size:9px;color:#68737c;line-height:1.6;margin-bottom:15px}.iv-phone-approve{width:100%;display:block;background:#175f56;border-radius:7px;color:#fff;font-size:11px;font-weight:600;padding:12px 8px}.iv-phone-approve:hover{background:#104a43}.iv-phone-approve:disabled{opacity:.6;cursor:default}.iv-phone-approved{text-align:center;padding:20px 4px;color:#d9fae7}.iv-phone-approved .iv-approved-check{display:flex;align-items:center;justify-content:center;margin:12px auto 19px;width:56px;height:56px;border:1px solid #8bd3b3;border-radius:50%;font-size:28px}.iv-phone-approved h3{font:26px var(--serif);margin-bottom:12px}.iv-phone-approved p{font-size:11px;line-height:1.8;color:#c0d1d0}.iv-phone-replay{width:100%;margin-top:23px;padding:11px;background:none;border:1px solid #a7bac266;border-radius:7px;color:#e4eeee;font-size:10px}
.iv-approval-caption{position:absolute;bottom:-4px;left:20px;color:#e7dfef;font:9px/1.6 var(--mono);text-shadow:0 1px 5px #000}
.iv-approval-launch{position:absolute;left:5.5vw;bottom:121px;background:#251c36e8;border:1px solid #d6b5ff80;border-radius:3px;font-size:10px;padding:8px 12px;color:#eee5ff;z-index:2}.iv-approval-launch[hidden]{display:none!important}
.office-stage.iv-phone-present .work-status,.office-stage.iv-phone-present .scene-copy{visibility:hidden;pointer-events:none}
.office-stage.iv-phone-leaving .work-status{animation:iv-work-recede .45s ease-in both;pointer-events:none}
@keyframes iv-phone-arrive{from{opacity:0;transform:translateY(55px) rotate(5deg)}to{opacity:1;transform:none}}
@keyframes iv-work-recede{to{opacity:0;transform:translateY(15px) scale(.97)}}
body.motion-paused .iv-handset-wrap,body.motion-paused .iv-phone-leaving .work-status{animation-play-state:paused}
@media(min-width:1700px){.office-stage .iv-approval-story{left:8vw;bottom:155px;transform:scale(1.12);transform-origin:left bottom}}
@media(max-height:760px) and (min-width:701px){.office-stage .iv-approval-story{height:450px;transform:scale(.8);transform-origin:left bottom;bottom:120px}.iv-approval-launch{bottom:109px}}
@media(max-width:700px){.office-stage .iv-approval-story{left:calc(50% - 155px);bottom:135px;width:330px;transform:scale(.84);transform-origin:left bottom}.iv-approval-launch{left:6vw;bottom:111px;font-size:9px}.iv-approval-caption{font-size:9px}.iv-approval-tools{font-size:10px}}
@media(max-width:700px) and (max-height:760px){.office-stage .iv-approval-story{bottom:132px;transform:scale(.72);left:calc(50% - 135px)}.iv-approval-launch{bottom:107px}}
@media(prefers-reduced-motion:reduce){.iv-handset-wrap,.office-stage.iv-phone-leaving .work-status{animation:none!important}}
/* An explicitly opened phone stays visible when motion is paused. */
body.motion-paused .iv-handset-wrap{animation:none;opacity:1;transform:none}
.iv-phone-thumb{left:26px}