/* Adaptation of preset agent (#sc4): figure + speech rail + app window.
   Client row and delivery states follow screen-02-send-ascii.md. */
#bulk-scene{outline:none;animation:bulk-enter .35s ease both}
.bulk-stage{position:relative;height:650px;max-height:calc(100dvh - 135px);min-height:570px}
.bulk-actor{position:absolute;left:1%;bottom:230px;width:28%;text-align:center;transition:opacity .3s}
.bulk-actor>img{height:300px;max-width:100%;display:block;margin:auto}
.bulk-actor>span{display:block;font-size:14px;color:var(--muted);margin-top:8px}
.bulk-speech{position:absolute;bottom:calc(100% + 22px);left:50%;transform:translateX(-43%);width:max-content;max-width:320px;padding:14px 21px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);font:clamp(18px,2.6vw,24px)/1.35 var(--serif);transition:opacity .25s}
.bulk-speech:after{content:'';position:absolute;bottom:-8px;left:43%;width:15px;height:15px;transform:rotate(45deg);background:var(--surface);border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0 0 4px}
.bulk-mail{position:absolute;top:132px;right:1%;width:62%;min-height:262px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:width .4s,right .4s,top .4s,box-shadow .3s}
.bulk-to{display:flex;align-items:flex-start;gap:10px;padding:17px;min-height:108px;border-bottom:1px solid var(--line);font-size:13px}
.bulk-to>span{color:var(--muted);padding-top:5px}
.bulk-addresses{display:flex;align-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.bulk-chip,.bulk-address-source{font-size:11px;line-height:1.2;white-space:nowrap;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:6px 7px;color:var(--ink)}
.bulk-chip{display:inline-block}
.bulk-subject{font-size:14px;padding:16px 18px 12px}.bulk-subject strong{font-weight:600}
.bulk-body{padding:5px 18px 24px}.bulk-body i{display:block;height:5px;width:91%;background:var(--line);border-radius:3px;margin-bottom:11px}.bulk-body i:nth-child(2){width:82%}.bulk-body i:nth-child(3){width:88%}.bulk-body i:last-child{width:54%}
.bulk-clients{position:absolute;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.bulk-client{min-width:0;position:relative;margin:0;text-align:center}.bulk-client>img{height:90px;width:100%;object-fit:contain;display:block}.bulk-client figcaption{font-size:14px;margin-top:7px}.bulk-address-source{display:inline-block;max-width:100%;padding:5px 3px;margin-top:10px;font-size:10px;transition:opacity .2s}
.bulk-delivery{height:27px;font-size:21px;color:#3e8260;margin-bottom:8px}

.bulk-reader{position:absolute;top:12px;left:0;right:0;text-align:center;font:28px var(--serif);margin:0}
#bulk-scene[data-state="result"] .bulk-actor{opacity:0;pointer-events:none}
#bulk-scene[data-state="result"] .bulk-mail{width:85%;right:7.5%;top:76px}
#bulk-scene[data-state="result"] .bulk-to{background:color-mix(in srgb,var(--clay) 10%,var(--surface))}
#bulk-scene[data-state="result"] .bulk-chip{font-size:14px;background:transparent;border-color:transparent;padding:3px}
.bulk-flying{position:fixed;z-index:12;pointer-events:none;margin:0}.bulk-envelope{width:38px;height:27px;background:var(--surface);border:1.5px solid var(--muted);border-radius:4px;display:grid;place-items:center;color:var(--muted)}.bulk-envelope svg{width:100%;height:100%}
@keyframes bulk-enter{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.bulk-stage{height:630px;max-height:none;min-height:630px}.bulk-actor{left:0;width:31%;bottom:238px}.bulk-actor>img{height:225px}.bulk-speech{font-size:19px;max-width:300px;left:0;transform:none;text-align:left;bottom:calc(100% + 30px)}.bulk-speech:after{left:20%}.bulk-mail{top:180px;width:65%;right:0;min-height:225px}.bulk-to{padding:10px;min-height:135px;gap:5px}.bulk-chip{font-size:10px;padding:4px}.bulk-subject{padding:12px;font-size:12px}.bulk-body{padding:3px 12px 14px}.bulk-clients{gap:5px}.bulk-client>img{height:67px}.bulk-client figcaption{font-size:12px}.bulk-address-source{font-size:0;width:30px;height:12px;padding:0}.bulk-delivery{height:25px}.bulk-reader{font-size:25px}#bulk-scene[data-state="result"] .bulk-mail{width:100%;right:0;top:90px}#bulk-scene[data-state="result"] .bulk-chip{font-size:12px}}
@media(prefers-reduced-motion:reduce){#bulk-scene,.bulk-mail,.bulk-speech,.bulk-actor{transition:none}}

/* Fold once into one envelope, then fan out to every recipient together. */
.bulk-mail{transform-origin:center;transition:width .4s,right .4s,top .4s,box-shadow .3s,transform .65s ease,opacity .55s ease}
#bulk-scene[data-state="packing"] .bulk-mail,#bulk-scene[data-state="sending"] .bulk-mail,#bulk-scene[data-state="delivered"] .bulk-mail{transform:translateY(30px) scale(.24,.08);opacity:0;pointer-events:none}
.bulk-packet{position:absolute;width:120px;height:84px;color:var(--muted);z-index:3;opacity:0;transform:translateY(12px);transition:opacity .35s,transform .35s;pointer-events:none}.bulk-packet svg{width:100%;height:100%}.bulk-packet.visible{opacity:1;transform:none}
.bulk-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0;transition:opacity .3s}.bulk-routes.visible{opacity:1}.bulk-routes path{fill:none;stroke:var(--muted);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round;opacity:.32}
.bulk-copy{position:absolute;left:0;top:0;z-index:4;pointer-events:none}.bulk-clients{z-index:1}
@media(prefers-reduced-motion:reduce){.bulk-mail,.bulk-packet,.bulk-routes{transition:none}}

.bulk-actor>span{position:relative;z-index:1;width:max-content;margin:8px auto 0;padding:0 6px;background:var(--bg)}

/* Digital wires carry a single lit data pulse during delivery. */
.bulk-routes .bulk-wire{stroke:#6d9697;stroke-width:2.2;opacity:.3}
.bulk-routes .bulk-signal{stroke:#53aab4;stroke-width:4;opacity:1;filter:drop-shadow(0 0 3px #53aab499);stroke-linecap:round}
#bulk-scene[data-state="sending"] .bulk-copy{border-color:#5b9299;color:#43848d;box-shadow:0 0 9px #53aab433}

/* Anchor the desktop actor below a reserved speech area, not above the client row. */
@media(min-width:651px){
 #bulk-scene .bulk-actor{top:100px;bottom:auto}
 #bulk-scene .bulk-actor>img{height:clamp(170px,calc(100dvh - 520px),300px)}
 #bulk-scene .bulk-speech{top:-88px;bottom:auto}
 #bulk-scene .bulk-mail{top:110px}
}
