.octo-dialog{border:1px solid #edbb6560;border-radius:20px;padding:0;width:min(92vw,760px);max-width:760px;max-height:92dvh;overflow:auto;background:#172e35;color:#fff9eb;text-align:center;isolation:isolate;box-shadow:0 24px 90px #0007}.octo-dialog::backdrop{background:#081820cf}.octo-close{position:absolute;z-index:4;right:14px;top:10px;width:44px;height:44px;border:0;background:#172e35d9;color:#fff9eb;font:32px/1 system-ui;border-radius:50%;cursor:pointer}.octo-sea{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1;border-radius:inherit;opacity:.45}.octo-sea svg{width:100%;height:100%;min-height:660px}.octo-sea g{transform-box:fill-box;transform-origin:center bottom;animation:octo-rise 1.6s both;animation-delay:calc(var(--arm)*55ms)}.octo-reward{padding:48px 48px 36px;background:radial-gradient(ellipse at center,#172e35ed 8%,#172e3560 75%)}.octo-reward h2{font:normal clamp(30px,6vw,49px)/1.1 Georgia,serif;margin:16px 0;color:#fff9eb}.octo-reward p{margin:14px auto;max-width:440px}.octo-eyebrow{color:#edbb65;font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:700}.octo-stamp-wrap{min-height:194px;display:grid;place-items:center}.octo-stamp{width:190px;height:190px;max-width:100%}.octo-stamp-wrap .octo-stamp{opacity:0;transform:scale(1.5) rotate(-15deg)}.octo-earned .octo-stamp-wrap .octo-stamp{animation:octo-stamp .45s both}.octo-status{font-size:14px;color:#f3d7a4;min-height:44px}.octo-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;margin-top:8px}.octo-actions .button{margin:0;background:#edbb65;color:#172e35}.octo-return{font:inherit;font-size:14px;background:transparent;color:#fff9eb;border:1px solid #fff9eb80;border-radius:4px;padding:12px 16px;cursor:pointer}.octo-dialog a:focus-visible,.octo-dialog button:focus-visible{outline:3px solid #edbb65;outline-offset:4px}.secret-stamps{display:flex;align-items:center;gap:36px;max-width:1090px;margin:30px auto;padding:35px 6%;background:#f1e6cf;border:2px dashed #a83e2760;border-radius:12px}.secret-stamps h2{font:normal clamp(28px,4vw,42px)/1.1 Georgia,serif;margin:12px 0}.secret-stamps .octo-stamp{flex-shrink:0}.secret-stamps .small{font-size:12px}.secret-stamps button{border:0;cursor:pointer;font:inherit;font-size:14px}.secret-stamps[hidden]{display:none!important}@keyframes octo-rise{from{opacity:0;translate:0 85%}to{opacity:1;translate:0 0}}@keyframes octo-stamp{0%{opacity:0;transform:scale(1.5) rotate(-15deg)}70%{opacity:1;transform:scale(.94) rotate(-8deg)}100%{opacity:1;transform:scale(1) rotate(-8deg)}}@media(max-width:560px){.octo-reward{padding:48px 20px 28px}.octo-stamp{width:160px;height:160px}.octo-stamp-wrap{min-height:170px}.secret-stamps{margin:24px 5%;padding:28px 22px;flex-direction:column;gap:10px;text-align:center}}@media(prefers-reduced-motion:reduce){.octo-sea g,.octo-earned .octo-stamp-wrap .octo-stamp{animation:none}.octo-earned .octo-stamp-wrap .octo-stamp{opacity:1;transform:none}}

/* The Octogoddess takes over the viewport before the reward appears. */
.octo-dialog{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;padding:0}
.octo-dialog::backdrop{background:#08182055}
.octo-dialog .octo-close{position:fixed;right:max(16px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));z-index:6;background:#172e35eb;border:1px solid #fff9eb80}
.octo-dialog .octo-sea{position:absolute;inset:0;border-radius:0;opacity:1;z-index:1;overflow:hidden;transition:opacity .7s}
.octo-dialog .octo-sea svg{display:block;width:100%;height:100%;min-height:0;overflow:visible}
.octo-dialog .octo-sea g{animation:none;transform-box:view-box;transform-origin:0 0}
.octo-dialog .octo-sea .octo-arm-motion{animation:octo-envelop 3.6s cubic-bezier(.22,.7,.28,1) both;animation-delay:calc(var(--arm)*70ms);transform-origin:500px 1000px}
.octo-dialog .octo-reward{position:relative;z-index:3;box-sizing:border-box;width:min(90vw,620px);max-height:calc(100dvh - 100px);overflow:auto;margin:50px auto;padding:32px 30px 26px;border:1px solid #edbb6570;border-radius:18px;background:#172e35f7;box-shadow:0 20px 90px #0007;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity .6s,transform .6s,visibility .6s}
.octo-earned .octo-reward{opacity:1;visibility:visible;transform:translateY(0)}
.octo-earned .octo-sea{opacity:.85}
.octo-dialog .octo-reward h2{font-size:clamp(29px,5vw,44px)}
.octo-dialog .octo-stamp-wrap{min-height:170px}.octo-dialog .octo-stamp{width:160px;height:160px}
@keyframes octo-envelop{0%{transform:translateY(650px) rotate(-18deg)}45%{transform:translateY(-70px) rotate(4deg)}70%{transform:translateY(-110px) rotate(-3deg)}100%{transform:translateY(0) rotate(0)}}
@media(max-width:560px){.octo-dialog .octo-reward{margin:60px auto 25px;padding:24px 18px;max-height:calc(100dvh - 90px)}.octo-dialog .octo-reward h2{font-size:30px}.octo-dialog .octo-stamp{width:140px;height:140px}.octo-dialog .octo-stamp-wrap{min-height:148px}}
@media(prefers-reduced-motion:reduce){.octo-dialog .octo-sea .octo-arm-motion{animation:none;transform:none}.octo-dialog .octo-reward,.octo-dialog .octo-sea{transition:none}.octo-earned .octo-reward{transform:none}}

/* Approved Happenings tattoo mascot appears after the tentacles, before the stamp. */
.octo-mascot{position:absolute;z-index:2;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0}
.octo-mascot img{width:min(82vw,760px);height:auto;max-height:85dvh;object-fit:contain;filter:drop-shadow(0 18px 35px #0009)}
.octo-active .octo-mascot{animation:octo-character 4.9s both}
.octo-earned .octo-mascot{display:none}
@keyframes octo-character{0%,40%{opacity:0;transform:translateY(22vh) scale(.65)}57%,84%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.octo-active .octo-mascot{animation:none;display:none}}

/* Saturated red tattooed plush arms match the approved character. */
.octo-dialog .octo-sea .octo-arm-motion{filter:drop-shadow(0 8px 12px #0007)}
.octo-earned .octo-sea{opacity:.35}
