:root{font-family:Arial,Helvetica,sans-serif;color:#fff;background:#0b426c;color-scheme:light;--ink:#1c2632;--blue:#1583bc;--yellow:#ffda4a}*{box-sizing:border-box}body{margin:0;background:linear-gradient(#0b426c,#052f4f)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:4px solid #ffda4a;outline-offset:5px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}.theater{max-width:1600px;min-height:100svh;margin:auto;padding:20px 32px 10px;display:flex;flex-direction:column}.marquee{display:flex;justify-content:space-between;align-items:center;padding:0 4px 17px;gap:15px}.show-logo{font-family:Impact,'Arial Black',sans-serif;font-size:30px;line-height:1;letter-spacing:.015em;color:#7bceef;text-shadow:2px 2px 0 #071f34;-webkit-text-stroke:.5px #071f34;transform:rotate(-2deg)}.show-logo b{font-weight:inherit;color:#fff}.show-logo small{display:block;font-family:Arial,sans-serif;font-size:9px;font-weight:800;letter-spacing:.25em;color:#ffda4a;text-shadow:none;-webkit-text-stroke:0;margin-top:7px}.dedication{font-size:13px;color:#cce4f0}.screen{position:relative;isolation:isolate;min-height:650px;height:calc(100svh - 160px);max-height:1000px;overflow:hidden;border:4px solid #172b38;border-radius:14px;background:#bbd4b6;color:var(--ink);box-shadow:0 7px 0 #041c2c,0 17px 45px #0004}.living-room{position:absolute;inset:-2%;z-index:-3;background:url('griffin-room.png') center 52%/cover no-repeat;animation:room-pan 18s ease-in-out infinite alternate;transition:background-position 1.3s}.room-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#20344318,transparent 50%),linear-gradient(0deg,#0c192c48,transparent 26%)}.scene-mark{position:absolute;left:28px;top:25px;padding:7px 10px;background:#fff9;border-radius:4px;font-size:10px;font-weight:800;letter-spacing:.13em;z-index:2}.frame-corner{display:none}.story{position:absolute;z-index:5;left:6%;top:16%;width:49%;padding:32px 35px 31px;background:#fffef8;border:3px solid var(--ink);border-radius:26px;box-shadow:6px 7px 0 #172b3828;transform:rotate(-1deg)}.story::after{content:"";position:absolute;right:-17px;top:62%;width:27px;height:27px;background:#fffef8;border-right:3px solid var(--ink);border-top:3px solid var(--ink);transform:rotate(45deg)}.speaker{position:absolute;left:26px;top:-17px;max-width:85%;padding:7px 14px;background:var(--yellow);border:2px solid var(--ink);border-radius:7px;font-size:12px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;box-shadow:2px 3px 0 #172b3820}.scene{width:100%;animation:scene-enter .45s cubic-bezier(.2,.9,.25,1.2) both}.kicker{font-size:10px;font-weight:800;letter-spacing:.13em;line-height:1.5;margin:3px 0 17px;color:#65727c}h1,h2{font-family:'Arial Black',Arial,Helvetica,sans-serif;font-weight:900;line-height:1.02;letter-spacing:-.055em;margin:0;text-wrap:balance}h1{font-size:clamp(64px,6.7vw,105px);line-height:.95}h2{font-size:clamp(48px,5.3vw,81px)}h2.long{font-size:clamp(36px,3.7vw,58px);line-height:1.12}em{font-style:normal;color:#087bac}h1 em{color:#087bac;text-shadow:3px 3px 0 #c1e6f5}.intro{font-size:17px;line-height:1.5;margin:18px 0;color:#4a5661}.watch{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;margin-top:4px;padding:12px 22px;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);border-radius:9px;font-size:14px;font-weight:800;box-shadow:3px 4px 0 var(--ink);transition:transform .18s,box-shadow .18s}.watch:hover{transform:translate(-1px,-2px);box-shadow:4px 6px 0 var(--ink)}.watch:active{transform:translate(2px,2px);box-shadow:1px 2px 0 var(--ink)}.running-time{font-size:11px;color:#65727c;margin:17px 0 0}.cast{position:absolute;inset:0;z-index:3;pointer-events:none}.actor{position:absolute;bottom:4%;right:-1%;width:45%;aspect-ratio:1;transform-origin:50% 100%}.avatar,.sprite{width:100%;height:100%}.avatar{animation:idle 3.5s ease-in-out infinite;transform-origin:50% 90%}.sprite{background-image:url('griffin-cast.png');background-size:200% 200%;background-repeat:no-repeat;filter:drop-shadow(4px 6px 0 #172b3820)}.peter .sprite{background-position:0 0;background-size:200% 187.164%}.lois .sprite{background-position:100% 0;background-size:200% 187.164%}.brian .sprite{background-position:0 100%;background-size:200% 218.467%}.stewie .sprite{background-position:100% 100%;background-size:200% 218.467%}.actor.active{animation:entrance .75s cubic-bezier(.17,.9,.3,1.15) both}.actor.brian{width:34%;right:4%;bottom:4%}.actor.stewie{width:30%;right:6%;bottom:6%}.theater[data-scene="0"] .story{width:43%;top:16%}.theater[data-scene="0"] .actor.peter,.theater[data-scene="7"] .actor.peter{width:35%;right:16%;bottom:9%}.theater[data-scene="0"] .actor.lois,.theater[data-scene="7"] .actor.lois{width:31%;right:-4%;bottom:14%}.theater[data-scene="0"] .actor.brian,.theater[data-scene="7"] .actor.brian{width:24%;right:12%;bottom:0}.theater[data-scene="0"] .actor.stewie,.theater[data-scene="7"] .actor.stewie{width:21%;right:0;bottom:0}.theater[data-scene="0"] .actor.lois .avatar,.theater[data-scene="7"] .actor.lois .avatar{animation-delay:-.9s}.theater[data-scene="0"] .actor.brian .avatar,.theater[data-scene="7"] .actor.brian .avatar{animation-delay:-1.8s}.theater[data-scene="0"] .actor.stewie .avatar,.theater[data-scene="7"] .actor.stewie .avatar{animation-delay:-2.7s}.theater[data-scene="2"] .story{transform:rotate(1deg)}.theater[data-scene="2"] .actor.active{animation:slide-in .8s cubic-bezier(.2,.9,.3,1.2) both}.theater[data-scene="3"] .actor .avatar{animation:lean 2.4s ease-in-out infinite}.theater[data-scene="3"] .living-room{background-position:55% 52%}.theater[data-scene="4"] .story{width:41%;transform:rotate(-4deg);top:22%;text-align:center}.theater[data-scene="4"] .actor.active{animation:stewie-jump 1.1s cubic-bezier(.17,.9,.3,1.2) both}.theater[data-scene="4"] .actor.stewie{width:37%;right:5%;bottom:5%}.hello h2{font-size:clamp(120px,14vw,220px);color:#1583bc;line-height:1.2;text-shadow:5px 5px 0 #b9e6f5}.hello-star{position:absolute;right:0;top:-12px;font-size:45px;color:#d79b04;animation:spin 8s linear infinite}.theater[data-scene="5"] .actor .avatar{animation:celebrate 1.5s ease-in-out infinite}.theater[data-scene="5"] em{color:#247b48}.theater[data-scene="6"] .story{width:57%;top:20%}.theater[data-scene="6"] h2{font-size:clamp(44px,5vw,77px)}.theater[data-scene="6"] .actor.brian{right:-1%}.theater[data-scene="6"] em{color:#a15328}.theater[data-scene="7"] .story{width:49%;top:19%}.theater[data-scene="7"] .actor.active{animation:entrance .75s cubic-bezier(.17,.9,.3,1.15) both}.smile{display:inline-block;color:#1383b9;white-space:nowrap;transform:rotate(10deg)}.replay{margin-top:25px}.sparkles span{position:absolute;z-index:4;color:#ffda4a;text-shadow:1px 2px 0 #1c2632;font-size:35px;animation:sparkle 3s ease-in-out infinite}.sparkles span:nth-child(1){right:7%;top:18%}.sparkles span:nth-child(2){right:39%;top:17%;animation-delay:-1s}.sparkles span:nth-child(3){right:4%;bottom:37%;animation-delay:-2s;font-size:25px}.sparkles span:nth-child(4){display:none}.bottom-caption,.scene-number{position:absolute;bottom:20px;z-index:6;font-size:10px;font-weight:800;letter-spacing:.12em;color:#fff;text-shadow:1px 1px 3px #0008}.bottom-caption{left:28px}.scene-number{right:28px}.transport{min-height:67px;display:flex;justify-content:center;align-items:center;gap:40px;padding:15px 5px 0}.end-credit{font-size:12px;color:#bddeed;letter-spacing:.03em}.playback{display:flex;align-items:center;gap:13px}.playback button{height:37px;width:37px;border:1px solid #cee7f466;border-radius:50%;background:#ffffff08;color:#fff;font-size:20px}.playback button:hover:not(:disabled){background:#ffffff22}#pause{font-size:14px}.timeline{width:135px;text-align:center}#count{font-size:10px;letter-spacing:.2em;color:#d9ecf5}.tracks{display:flex;gap:5px;margin-top:8px}.tracks i{height:3px;border-radius:2px;flex:1;background:#ffffff26}.tracks i.done{background:#ffda4a}.tracks i.current{animation:progress-glow 1.3s ease-in-out infinite}.word{display:inline-block;animation:word-pop .5s cubic-bezier(.16,1.4,.25,1) both;animation-delay:var(--delay,0ms)}.scene-wipe{position:absolute;z-index:8;inset:-60%;border-radius:50%;background:#93d8f4;pointer-events:none;transform:translate(-100%,100%) scale(.1);opacity:0}.scene-wipe.play{animation:iris .8s cubic-bezier(.7,0,.2,1)}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:7}.confetti i{position:absolute;top:-15%;left:var(--left);width:9px;height:15px;border-radius:2px;background:var(--color);opacity:0}.confetti.celebrate i{animation:confetti-fall var(--duration) var(--wait) cubic-bezier(.2,.6,.5,1) both}.paused .screen *,.paused .screen *::before,.paused .screen *::after{animation-play-state:paused!important}.paused .scene,.paused .word,.paused .actor{animation:none!important;opacity:1!important;transform:none!important}.no-script{padding:30px;line-height:2;text-align:center}@keyframes room-pan{from{transform:scale(1) translateX(0)}to{transform:scale(1.055) translateX(-.7%)}}@keyframes idle{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}@keyframes entrance{0%{transform:translateX(80%) scale(.85);opacity:0}65%{transform:translateX(-5%) scale(1.03);opacity:1}100%{transform:none;opacity:1}}@keyframes slide-in{0%{transform:translateX(90%) rotate(12deg);opacity:0}70%{transform:translateX(-4%) rotate(-3deg);opacity:1}100%{transform:none;opacity:1}}@keyframes stewie-jump{0%{transform:translateY(90%) scale(.7);opacity:0}40%{transform:translateY(-20%) scale(1.1);opacity:1}65%{transform:translateY(3%) scale(.95)}100%{transform:none;opacity:1}}@keyframes lean{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg) translateY(-5px)}}@keyframes celebrate{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-14px) rotate(3deg)}}@keyframes scene-enter{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:none}}@keyframes word-pop{from{opacity:0;transform:translateY(23px) rotate(5deg) scale(.8)}to{opacity:1;transform:none}}@keyframes sparkle{0%,100%{transform:scale(.8) rotate(-10deg);opacity:.5}50%{transform:scale(1.15) rotate(20deg);opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes iris{0%{opacity:1;transform:translate(-90%,80%) scale(.1)}45%,52%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:1;transform:translate(90%,-80%) scale(.1)}}@keyframes confetti-fall{0%{opacity:0;transform:translateY(0) rotate(0)}8%,90%{opacity:1}100%{opacity:0;transform:translate(var(--drift),1000px) rotate(650deg)}}@keyframes progress-glow{50%{opacity:.4}}@media(min-width:1400px){.actor{max-width:640px}.actor.brian{max-width:490px}.actor.stewie{max-width:440px}}@media(max-width:1000px){.theater{padding:18px 20px 10px}.screen{min-height:640px}.story{left:5%;width:53%;padding:29px 26px}.theater[data-scene="0"] .story{width:49%}h1{font-size:75px}h2{font-size:59px}h2.long{font-size:41px}.intro{font-size:15px}.kicker{font-size:9px}.theater[data-scene="6"] h2{font-size:53px}.actor{width:47%;right:-4%;bottom:9%}.actor.brian{width:36%;right:1%;bottom:9%}.actor.stewie{bottom:10%}.theater[data-scene="0"] .actor.peter,.theater[data-scene="7"] .actor.peter{right:13%;width:36%;bottom:15%}.theater[data-scene="0"] .actor.lois,.theater[data-scene="7"] .actor.lois{right:-7%;width:34%;bottom:17%}.theater[data-scene="0"] .actor.brian,.theater[data-scene="7"] .actor.brian{right:10%;width:26%;bottom:2%}.theater[data-scene="0"] .actor.stewie,.theater[data-scene="7"] .actor.stewie{width:23%;bottom:3%}.theater[data-scene="7"] .story{width:53%}}@media(max-width:760px){.theater{padding:14px 11px 9px}.marquee{padding:0 3px 14px}.show-logo{font-size:24px}.show-logo small{font-size:7px}.dedication{font-size:11px;max-width:120px;text-align:right;line-height:1.4}.screen{height:calc(100svh - 158px);min-height:690px;max-height:900px;border-width:3px;border-radius:10px}.living-room{background-position:56% 60%}.scene-mark{left:14px;top:14px;font-size:8px;background:#ffffffe6;padding:6px 8px}.story,.theater[data-scene="0"] .story,.theater[data-scene="4"] .story,.theater[data-scene="6"] .story,.theater[data-scene="7"] .story{left:6%;top:12%;width:88%;padding:28px 21px 24px;border-radius:20px;text-align:center;transform:rotate(-1deg)}.story::after{top:auto;right:23%;bottom:-16px;transform:rotate(135deg);width:25px;height:25px}.speaker{left:18px;font-size:10px;top:-16px;padding:6px 12px}.kicker{font-size:8px;letter-spacing:.1em;margin:2px 0 13px;line-height:1.45}h1{font-size:69px;line-height:.96}h1 br{display:none}h1 em{display:block}h2{font-size:46px;line-height:1.04}h2.long{font-size:32px;line-height:1.14}.intro{font-size:14px;margin:12px 0}.watch{min-height:43px;font-size:12px;padding:10px 17px}.running-time{font-size:9px;margin-top:14px}.actor,.actor.brian,.actor.stewie{width:270px;right:calc(50% - 135px);bottom:5%}.actor.brian{width:225px;right:calc(50% - 112.5px)}.actor.stewie{width:205px;right:calc(50% - 102.5px)}.theater[data-scene="4"] .actor.stewie{width:255px;right:calc(50% - 127.5px);bottom:4%}.theater[data-scene="0"] .actor.peter,.theater[data-scene="7"] .actor.peter{width:215px;right:calc(50% - 20px);bottom:7%}.theater[data-scene="0"] .actor.lois,.theater[data-scene="7"] .actor.lois{width:185px;right:calc(50% - 180px);bottom:10%}.theater[data-scene="0"] .actor.brian,.theater[data-scene="7"] .actor.brian{width:145px;right:calc(50% - 64px);bottom:1%}.theater[data-scene="0"] .actor.stewie,.theater[data-scene="7"] .actor.stewie{width:120px;right:calc(50% - 150px);bottom:2%}.theater[data-scene="6"] h2{font-size:39px}.theater[data-scene="6"] .actor.brian{right:calc(50% - 112.5px)}.hello h2{font-size:143px;line-height:1.1}.hello-star{right:-5px;top:-10px;font-size:28px}.replay{margin-top:20px}.sparkles span:nth-child(1){top:auto;right:12%;bottom:31%;font-size:28px}.sparkles span:nth-child(2){top:auto;right:auto;left:12%;bottom:29%;font-size:21px}.sparkles span:nth-child(3){display:none}.bottom-caption,.scene-number{font-size:8px;bottom:13px}.bottom-caption{left:13px}.scene-number{right:13px}.transport{gap:10px;flex-direction:column;padding-top:14px;min-height:71px}.end-credit{font-size:10px}.playback{gap:11px}.playback button{width:33px;height:33px}.timeline{width:125px}}@media(max-width:365px){h1{font-size:60px}h2{font-size:40px}h2.long{font-size:28px}.theater[data-scene="6"] h2{font-size:34px}.story,.theater[data-scene="0"] .story{padding-left:16px;padding-right:16px}.theater[data-scene="0"] .actor.peter,.theater[data-scene="7"] .actor.peter{width:190px;right:calc(50% - 23px)}.theater[data-scene="0"] .actor.lois,.theater[data-scene="7"] .actor.lois{width:165px;right:calc(50% - 155px)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.word,.actor{opacity:1!important;transform:none!important}.scene-wipe,.confetti{display:none}}