/* Shared campaign artwork and motion. PDFdee retains its original 184/414px slots;
   website 2 owns its independent dimensions in web2/ads.css. */
/* Each campaign has its own visual story; dimensions and readable copy stay stable. */
.partner-banner .partner-presentation{position:absolute;right:3%;bottom:18px;width:30%;height:100px;color:#fff;font-family:'Anuphan',sans-serif;font-style:normal;pointer-events:none}
.partner-banner .partner-presentation small{font-size:11px;line-height:1.4;color:inherit}
.partner-banner .partner-presentation b,.partner-banner .partner-presentation i,.partner-banner .partner-presentation em{font-style:normal}
.partner-banner .notice-card{position:absolute;inset:12px 0 auto auto;width:min(100%,240px);display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid #efcf9377;border-left:4px solid #efd19a;border-radius:9px;background:#102d29ed;box-shadow:0 8px 20px #0004;animation:notice-arrive 9s ease-in-out infinite;animation-delay:calc(var(--step)*-3s)}
.partner-banner .notice-card>b{font-size:26px;color:#efd19a;font-weight:500}
.partner-banner .notice-card>span{flex:1;font-size:13px}
.partner-banner .notice-card i{display:block;height:2px;margin-top:6px;width:90%;background:#ffffff45}
.partner-banner .notice-card i:last-child{width:58%}
.partner-banner .notice-card em{color:#efd19a}
.partner-banner .story-workflow{display:flex;align-items:center;justify-content:space-between;gap:6px}
.partner-banner .workflow-track{position:absolute;top:40%;left:10%;right:10%;height:3px;background:linear-gradient(90deg,#a0e7c855,#a0e7c8,#a0e7c855);transform-origin:left;animation:workflow-connect 6s ease-in-out infinite}
.partner-banner .workflow-node{z-index:1;display:grid;justify-items:center;gap:6px;width:31%;animation:workflow-step 6s ease-in-out infinite;animation-delay:calc(var(--step)*-2s)}
.partner-banner .workflow-node b{display:grid;place-items:center;width:44px;height:44px;font-size:26px;border:1px solid #a0e7c8aa;border-radius:12px;background:#063b31;box-shadow:0 4px 18px #0004;color:#c6ffee}
.partner-banner .workflow-node small{background:#042c25e8;padding:3px 6px;border-radius:5px;text-align:center}
.partner-banner .story-tarot{perspective:650px}
.partner-banner .tarot-halo{position:absolute;left:15%;right:15%;top:0;bottom:0;border:1px solid #eccb8788;border-radius:50%;box-shadow:0 0 28px #ca8cfa44;animation:tarot-aura 7s ease-in-out infinite}
.partner-banner .tarot-card{position:absolute;left:calc(50% - 32px);top:2px;width:64px;height:92px;padding:7px 3px;display:flex;flex-direction:column;align-items:center;justify-content:space-around;transform-origin:50% 110%;border:1px solid #edcf8c;border-radius:7px;background:linear-gradient(135deg,#442653,#160e29);box-shadow:0 4px 18px #0008;color:#f8df9f;animation:tarot-reveal 7s ease-in-out infinite;animation-delay:calc(var(--step)*-.35s)}
.partner-banner .tarot-card b{font-size:29px;line-height:1}
.partner-banner .tarot-card small{font-size:9px;text-align:center}
.partner-banner .story-bot{padding:8px 12px;border:1px solid #66cfff66;background:#061b36df;border-radius:8px;box-shadow:0 0 24px #0088ff22}
.partner-banner .bot-circuit{display:block;width:100%;height:62px;overflow:visible}
.partner-banner .bot-grid{stroke:#5bbcff22;stroke-width:1}
.partner-banner .bot-route{stroke:#68d9ff;stroke-width:3;stroke-dasharray:1;animation:bot-program 6s ease-in-out infinite}
.partner-banner .bot-pulse{fill:#ffb572;animation:bot-arrival 6s ease-in-out infinite}
.partner-banner .bot-stages{display:flex;justify-content:space-between;gap:4px}
.partner-banner .bot-stages small{animation:bot-stage 6s steps(1) infinite;animation-delay:calc(var(--step)*-2s)}
.partner-banner .story-rooms{display:flex;align-items:center;gap:12px;justify-content:flex-end}
.partner-banner .room-building{width:92px;height:90px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:13px;border:1px solid #d6f5e58c;border-top:5px solid #eed6a6;border-radius:5px;background:#072c32eb;transform:skewY(-5deg)}
.partner-banner .room-building i{border:1px solid #9fdcce77;border-radius:2px;background:#13433f;animation:room-light 8s ease-in-out infinite;animation-delay:calc(var(--step)*-.85s)}
.partner-banner .room-key{position:absolute;right:18px;top:-8px;color:#ffdb95;font-size:44px;line-height:1;transform-origin:50% 10%;animation:room-key 5s ease-in-out infinite;text-shadow:0 4px 16px #000}
.partner-banner .room-captions{display:grid;gap:4px;width:42%;padding-top:20px}
.partner-banner .room-captions small{padding:3px 7px;border-radius:4px;background:#082f36eb;color:#d8fff1}
@keyframes notice-arrive{0%,29%{opacity:1;transform:translateY(0) rotate(0)}33%,95%{opacity:0;transform:translateY(-28px) rotate(-3deg)}96%{opacity:0;transform:translateY(30px) rotate(3deg)}100%{opacity:1;transform:translateY(0) rotate(0)}}
@keyframes workflow-connect{0%,10%{transform:scaleX(.05);opacity:.3}75%,100%{transform:scaleX(1);opacity:1}}
@keyframes workflow-step{0%,30%{transform:translateY(-8px);filter:brightness(1.4)}40%,100%{transform:translateY(0);filter:brightness(1)}}
@keyframes tarot-reveal{0%,100%{transform:translateX(calc((var(--step) - 1)*25px)) rotate(var(--angle)) rotateY(0)}35%{transform:translateX(0) rotate(0) rotateY(80deg)}65%,85%{transform:translateX(calc((var(--step) - 1)*33px)) translateY(-5px) rotate(var(--angle)) rotateY(0)}}
@keyframes tarot-aura{0%,100%{transform:scale(.85);opacity:.35}65%{transform:scale(1.1);opacity:1}}
@keyframes bot-program{0%,8%{stroke-dashoffset:1}78%,100%{stroke-dashoffset:0}}
@keyframes bot-arrival{0%,76%{opacity:.15;r:3}82%,94%{opacity:1;r:7}100%{opacity:.3;r:3}}
@keyframes bot-stage{0%,32%{color:#ffcc9d}33%,100%{color:#b7ddf5}}
@keyframes room-light{0%,100%{background:#13433f;box-shadow:none}35%,70%{background:#ffe0a4;box-shadow:0 0 12px #ffca7388}}
@keyframes room-key{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}
@keyframes jobs-pan{0%,100%{transform:scale(1.05) translateX(-1%)}50%{transform:scale(1.05) translateX(1%)}}
@keyframes shop-focus{0%,100%{transform:scale(1.02)}60%{transform:scale(1.09)}}
@keyframes fortune-breathe{0%,100%{transform:scale(1.03);filter:brightness(.94)}50%{transform:scale(1.07);filter:brightness(1.1)}}
@keyframes bot-camera{0%,100%{transform:scale(1.03) translateY(0)}50%{transform:scale(1.07) translateY(-1%)}}
@keyframes resort-pan{0%,100%{transform:scale(1.09) translateX(1.5%)}50%{transform:scale(1.09) translateX(-1.5%)}}
.partner-banner.partner-banner[data-campaign=jobs] .partner-image{animation:jobs-pan 12s ease-in-out infinite}
.partner-banner.partner-banner[data-campaign=krobapps] .partner-image{animation:shop-focus 9s ease-in-out infinite}
.partner-banner.partner-banner[data-campaign=fortune] .partner-image{animation:fortune-breathe 10s ease-in-out infinite}
.partner-banner.partner-banner[data-campaign=ea2you] .partner-image{animation:bot-camera 8s ease-in-out infinite}
.partner-banner.partner-banner[data-campaign=roomlino] .partner-image{animation:resort-pan 14s ease-in-out infinite}
#ads .partner-banner .partner-presentation{bottom:24px;height:116px}
@media(max-width:720px){.partner-banner .partner-presentation{top:18px;bottom:auto;left:14px;right:auto;width:140px;height:100px}.partner-banner .partner-presentation small{font-size:9px}.partner-banner .notice-card{padding:8px;gap:6px}.partner-banner .notice-card>b{font-size:20px}.partner-banner .notice-card>span{font-size:11px}.partner-banner .workflow-node b{width:34px;height:34px;font-size:22px}.partner-banner .story-bot{width:170px}.partner-banner .bot-stages small{font-size:9px}.partner-banner .story-rooms{width:170px}}
@media(min-width:601px) and (max-width:720px){#ads .partner-banner .partner-presentation{top:auto;bottom:24px;left:auto;right:3%;width:30%}}
@media(max-width:600px){#ads .partner-banner .partner-presentation{top:18px;bottom:auto;height:100px}}
.partner-banner.partner-banner--sidebar .partner-presentation{top:8px;bottom:auto;left:14px;right:auto;width:140px;height:90px}
@media(prefers-reduced-motion:reduce){.partner-banner .notice-card:not(:first-child){display:none}.partner-banner .tarot-card{transform:translateX(calc((var(--step) - 1)*25px)) rotate(var(--angle))}.partner-banner .bot-route{stroke-dashoffset:0}}
.partner-banner.partner-banner{--accent:#edd09c;--shade:10,24,25;box-sizing:border-box;display:block;position:relative;width:100%;height:184px;min-height:184px;max-height:none;min-width:0;margin:0;padding:0;overflow:hidden;isolation:isolate;border:1px solid #ffffff35;border-radius:16px;background:#071727;color:white;text-decoration:none;text-align:left;font-family:'Anuphan',sans-serif;box-shadow:0 10px 30px #0002;line-height:1.5;letter-spacing:normal}
.partner-banner.partner-banner *, .partner-banner.partner-banner *:before,.partner-banner.partner-banner *:after{box-sizing:border-box}
.partner-banner.partner-banner:before{display:none}
.partner-banner.partner-banner h3.partner-brand{display:flex;align-items:center;gap:10px;max-width:100%;min-width:0}
.partner-banner.partner-banner .partner-logo{display:block;position:static;flex:none;width:36px;height:36px;max-width:100%;object-fit:contain;object-position:center;padding:0;margin:0;border:0;border-radius:0;background:none;animation:none;transform:none;mask-image:none}
.partner-banner .partner-brand-name{min-width:0;overflow-wrap:anywhere}
.partner-banner .partner-brand-name--accessible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.partner-banner.partner-banner[data-campaign=roomlino] .partner-logo{width:180px;height:42px;padding:3px 6px;border-radius:6px;background:#fffdf5}
.partner-banner.partner-banner[data-campaign=ea2you] .partner-logo{width:120px;height:46px;object-fit:cover;border-radius:6px;background:#fffaf2}
#ads .partner-banner .partner-logo{width:44px;height:44px}
#ads .partner-banner[data-campaign=roomlino] .partner-logo{width:210px;height:48px}
#ads .partner-banner[data-campaign=ea2you] .partner-logo{width:146px;height:56px}
@media(max-width:600px){#ads .partner-banner .partner-logo{width:36px;height:36px}#ads .partner-banner[data-campaign=roomlino] .partner-logo{width:180px;height:42px}#ads .partner-banner[data-campaign=ea2you] .partner-logo{width:120px;height:46px}}
.partner-banner.partner-banner:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(var(--shade),.92),rgba(var(--shade),.72) 34%,rgba(var(--shade),.14) 62%,transparent 78%)}
.partner-banner.partner-banner .partner-scene{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:hidden;padding:0;min-height:0;z-index:0;background:none}
.partner-banner.partner-banner .partner-image{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center 48%;padding:0;margin:0;border:0;border-radius:0;mask-image:none;opacity:1;animation:partner-camera 6s ease-in-out infinite;transform-origin:78% 48%;transition:none}
.partner-banner.partner-banner .partner-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:64%;max-width:740px;height:100%;padding:12px 26px;inset:auto;text-align:left;text-shadow:0 2px 12px #0009;gap:0;min-width:0}
.partner-banner.partner-banner .partner-label{display:block;color:#e2e8ee;font-size:9px;line-height:1.4;letter-spacing:.12em;margin:0}
.partner-banner.partner-banner h3{display:block;font:700 clamp(23px,2.4vw,31px)/1.3 'Chakra Petch','Anuphan',sans-serif;letter-spacing:-.5px;margin:2px 0 3px;color:#fff;overflow-wrap:anywhere}
.partner-banner.partner-banner .partner-detail{font-size:15px;font-weight:600;line-height:1.45;margin:0;color:#fff;max-width:100%;overflow-wrap:anywhere}
.partner-banner.partner-banner .partner-extra{font-size:12px;line-height:1.5;margin:2px 0 8px;color:#e2e8f2;max-width:100%;overflow-wrap:anywhere}
.partner-banner.partner-banner .partner-cta{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:36px;padding:6px 16px;border:1px solid #ffffff40;border-radius:7px;background:var(--accent);color:#102522;font-size:13px;font-weight:700;line-height:1.5;text-shadow:none;box-shadow:0 4px 18px #0003;white-space:normal;max-width:100%}
.partner-banner.partner-banner .partner-effects{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.partner-banner .partner-shine{position:absolute;inset:-40%;background:linear-gradient(110deg,transparent 43%,#fff7 49%,transparent 56%);animation:partner-shine 4.5s linear infinite;mix-blend-mode:screen}
.partner-banner .partner-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 60%,#ffdaa14d,transparent 33%);animation:partner-glow 3s ease-in-out infinite;mix-blend-mode:screen}
.partner-banner .partner-sparks{position:absolute;width:5px;height:5px;top:25%;right:12%;border-radius:50%;background:var(--accent);box-shadow:-48px 55px var(--accent),68px 22px var(--accent),-110px 112px var(--accent),-155px 20px var(--accent);animation:partner-sparks 3.8s ease-in-out infinite}
.partner-banner .partner-floats{position:absolute;right:4%;top:15%;width:33%;height:76%}
.partner-banner .partner-floats i{position:absolute;right:calc(var(--i)*20%);top:calc(var(--i)*29%);padding:5px 11px;border:1px solid #ffffff70;border-radius:8px;background:#061a32c9;backdrop-filter:blur(6px);box-shadow:0 0 18px #fff2;color:#fff;font:600 11px/1.4 'Anuphan',sans-serif;animation:partner-float 3s ease-in-out infinite;animation-delay:calc(var(--i)*-.8s);white-space:nowrap}
.partner-banner.partner-banner[data-campaign=jobs]{--accent:#efd19a;--shade:13,30,27}
.partner-banner.partner-banner[data-campaign=krobapps]{--accent:#a0e7c8;--shade:4,29,24}
.partner-banner.partner-banner[data-campaign=krobapps] .partner-glow{background:radial-gradient(ellipse at 68% 60%,#68ffcb70,transparent 35%)}
.partner-banner.partner-banner[data-campaign=fortune]{--accent:#ebc47d;--shade:26,9,33}
.partner-banner.partner-banner[data-campaign=fortune] .partner-image{object-position:center 66%}
.partner-banner.partner-banner[data-campaign=fortune] .partner-glow{inset:-20%;background:radial-gradient(ellipse at 68% 48%,#df9bff69,transparent 40%);animation:partner-mist 5s ease-in-out infinite}
.partner-banner.partner-banner[data-campaign=ea2you]{--accent:#ffb572;--shade:4,18,41}
.partner-banner.partner-banner[data-campaign=ea2you] .partner-shine{background:linear-gradient(90deg,transparent 47%,#49d4ffbb 50%,transparent 51%);animation-duration:3.4s}
.partner-banner.partner-banner[data-campaign=roomlino]{--accent:#a2e5d4;--shade:3,30,36}
.partner-banner.partner-banner[data-campaign=roomlino] .partner-glow{top:45%;background:repeating-radial-gradient(ellipse at 65% 90%,transparent 0 12px,#8ef8dd55 18px,transparent 26px);animation:partner-water 3.5s ease-in-out infinite}
.partner-banner:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.partner-motion-toggle{position:absolute;right:10px;top:10px;z-index:10;min-width:34px;min-height:34px;padding:4px;border:1px solid #ffffff55;border-radius:50%;background:#061527bb;color:#fff;cursor:pointer}
[data-partner-slot]{container-type:inline-size}
#ads.partner-ad-section{position:relative}
#ads.partner-ad-section #adSlots{display:grid;gap:16px;grid-auto-rows:auto}
.partner-ad-section .ad-controls{position:static;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px;color:#adbeda;font-size:12px}
.partner-ad-section .ad-controls>span{flex:1;min-width:200px}
.partner-ad-section .ad-controls button{padding:8px 12px;min-height:44px;font-size:12px}
.partner-banner.ad-rotator-slide:not(.is-active) *{animation-play-state:paused!important}
/* PDFdee's slides must overlap inside their existing slot, never enter page flow. */
.hero-ad-stage > .partner-banner.ad-rotator-slide{position:absolute;inset:0}
.hero-ad-rotator[data-partner-slot] .hero-ad-stage{overflow:hidden;border-radius:16px}
.hero-ad-rotator[data-partner-slot] .hero-ad-meta{bottom:7px}
@media(max-width:720px){
 .hero-ad-stage > .partner-banner.ad-rotator-slide .partner-copy{padding-bottom:38px}
}
[data-partner-paused=true] .partner-banner *,[data-motion-paused=true] .partner-banner *,[data-page-hidden=true] .partner-banner *,[data-partner-page-hidden=true] .partner-banner *{animation-play-state:paused!important}
@keyframes partner-camera{0%,100%{transform:scale(1.02) translateX(0)}50%{transform:scale(1.12) translateX(-1.5%)}}
@keyframes partner-shine{0%{transform:translateX(-55%);opacity:0}25%,65%{opacity:.65}100%{transform:translateX(55%);opacity:0}}
@keyframes partner-glow{0%,100%{opacity:.2}50%{opacity:.75}}
@keyframes partner-sparks{0%,100%{transform:translate(0,12px);opacity:.25}50%{transform:translate(-12px,-18px);opacity:1}}
@keyframes partner-float{0%,100%{transform:translateY(6px) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes partner-mist{0%,100%{transform:translate(-4%,4%);opacity:.35}50%{transform:translate(5%,-5%) scale(1.15);opacity:.7}}
@keyframes partner-water{0%,100%{transform:translateX(-3%) scaleY(.8);opacity:.25}50%{transform:translateX(3%) scaleY(1.25);opacity:.6}}
@media(max-width:1000px) and (min-width:721px){.partner-banner.partner-banner .partner-copy{width:68%;padding:10px 20px}.partner-banner.partner-banner h3{font-size:25px}.partner-banner.partner-banner .partner-detail{font-size:14px}.partner-banner.partner-banner .partner-extra{font-size:11px}}
@media(max-width:720px){
 .partner-banner.partner-banner{height:414px;min-height:414px;border-radius:16px}
 .partner-banner.partner-banner .partner-image{object-position:78% center;transform-origin:78% 30%}
 .partner-banner.partner-banner[data-campaign=fortune] .partner-image{object-position:78% center}
 .partner-banner.partner-banner .partner-copy{position:absolute;bottom:0;width:100%;max-width:none;height:auto;padding:18px 20px;justify-content:flex-end}
 .partner-banner.partner-banner:after{background:linear-gradient(0deg,rgba(var(--shade),.99),rgba(var(--shade),.85) 39%,rgba(var(--shade),.2) 65%,transparent 85%)}
 .partner-banner.partner-banner h3{font-size:clamp(25px,6.6vw,32px);margin:4px 0 6px}
 .partner-banner.partner-banner .partner-detail{font-size:15px;line-height:1.5}
 .partner-banner.partner-banner .partner-extra{font-size:13px;line-height:1.6;margin:3px 0 12px}
 .partner-banner.partner-banner .partner-cta{min-height:44px;font-size:14px}
 .partner-banner .partner-floats{top:6%;right:5%;width:56%;height:35%}
 .partner-banner .partner-floats i{font-size:10px}
 .partner-ad-section .ad-controls>span{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){.partner-banner.partner-banner *{animation:none!important;transition:none!important}}
.partner-banner.partner-banner--sidebar{height:auto;min-height:310px;padding-top:100px}
.partner-banner.partner-banner--sidebar .partner-copy{position:relative;inset:auto;width:100%;max-width:none;height:auto;padding:14px}
.partner-banner.partner-banner--sidebar h3{font-size:25px}
.partner-banner.partner-banner--sidebar .partner-detail{font-size:14px}
.partner-banner.partner-banner--sidebar .partner-extra{font-size:12px;margin-bottom:10px}
.partner-banner.partner-banner--sidebar .partner-cta{min-height:44px}
.partner-banner.partner-banner--sidebar:after{background:linear-gradient(0deg,rgba(var(--shade),.98),rgba(var(--shade),.82) 60%,transparent)}
.partner-banner.partner-banner--sidebar .partner-image{object-position:78% center}
@media(min-width:721px){
 .partner-banner.partner-banner[data-campaign=jobs] .partner-image,.partner-banner.partner-banner[data-campaign=krobapps] .partner-image{object-position:center 8%;transform-origin:78% 20%}
 .partner-banner.partner-banner[data-campaign=ea2you] .partner-image{object-position:center 23%;transform-origin:78% 25%}
 .partner-banner .partner-floats{top:auto;bottom:12px;right:2%;width:39%;height:28px;display:flex;justify-content:flex-end;gap:8px}
 .partner-banner .partner-floats i{position:relative;top:auto;right:auto;align-self:center}
}
