@font-face{font-family:Cinzel;src:url('fonts/cinzel.woff') format('woff');font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:Manrope;src:url('fonts/manrope.woff') format('woff');font-style:normal;font-weight:200 800;font-display:swap}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#080709}body{font-family:Manrope,Arial,sans-serif;color:#eee8de}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #fff4d6;outline-offset:5px}button{color:inherit}button:disabled{cursor:default}
.creative{--accent:#df493e;--silver:#d5d2c8;--progress:0;--reveal:0;position:relative;width:970px;height:600px;overflow:hidden;isolation:isolate;background:#0c080b;user-select:none;border:1px solid #332026;container-type:inline-size}
.world{position:absolute;inset:0;background:radial-gradient(ellipse at 85% 48%,#4a1726 0,transparent 65%),radial-gradient(ellipse at 15% 100%,#211018 0,transparent 55%),#0b080b}
.portrait-wrap{position:absolute;right:-35px;top:-38px;width:620px;height:655px;mask-image:linear-gradient(90deg,transparent,#000 20%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 20%)}
.portrait{width:100%;height:100%;object-fit:cover;object-position:50% 36%;position:absolute;inset:0;filter:saturate(.58) brightness(.74);transform:scale(1.025) translate3d(var(--px,0px),var(--py,0px),0);transition:opacity .75s ease,filter 1.35s ease,transform 1.6s ease}
.portrait-amari{opacity:0}.creative[data-character=amari] .portrait-zelie{opacity:0}.creative[data-character=amari] .portrait-amari{opacity:1}
.shade{position:absolute;inset:0;background:linear-gradient(90deg,#0b080b 0%,rgba(11,8,11,.96) 22%,rgba(11,8,11,.65) 43%,transparent 65%),linear-gradient(0deg,#0b080b 0%,rgba(11,8,11,.65) 7%,transparent 33%,transparent 88%,rgba(11,8,11,.3) 100%)}
.texture{position:absolute;inset:0;opacity:.11;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.5' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}
.horizon{position:absolute;width:660px;height:660px;right:-140px;top:-60px;border:1px solid #c26c5b20;border-radius:50%;transform:rotate(-20deg)}
.horizon::before,.horizon::after{content:'';position:absolute;border:1px solid #c26c5b15;border-radius:50%;inset:19px}.horizon::after{inset:38px;border-style:dashed;border-color:#e19d7630;animation:orbit 100s linear infinite}
.light{position:absolute;right:50px;top:100px;width:500px;height:500px;background:radial-gradient(ellipse,#a11a3d4d,transparent 65%);opacity:calc(.1 + var(--reveal)*.8);mix-blend-mode:screen;transition:opacity .3s}
.embers{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.topline{position:absolute;left:40px;top:32px;display:flex;align-items:center;gap:13px;z-index:5;color:#c1b3ad;font-size:8px;font-weight:600;letter-spacing:2.4px}
.topline::before{content:'';height:1px;width:30px;background:#b55c56}.controls{position:absolute;right:21px;top:20px;display:flex;gap:7px;z-index:10}
.icon-btn{width:29px;height:29px;border:1px solid #e1c8bf45;background:#120b10a6;border-radius:50%;display:grid;place-items:center;cursor:pointer;opacity:.8;transition:opacity .2s,border-color .2s}.icon-btn:hover{opacity:1;border-color:#ecb6a2}.icon-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.sound-slash{display:block}.icon-btn[aria-pressed=true] .sound-slash{display:none}
.title-block{position:absolute;left:40px;top:89px;width:416px;z-index:5;text-decoration:none}.title{margin:0;font-family:Cinzel,Georgia,serif;font-weight:600;text-align:left;line-height:.99;text-shadow:0 3px 20px #0006}
.title span{display:block;width:max-content;max-width:100%;background:linear-gradient(170deg,#eee9dc 3%,#b6b4b0 26%,#fbf4e4 43%,#9d9998 57%,#e7dfce 75%,#878787 97%);color:transparent;background-clip:text;-webkit-background-clip:text;filter:drop-shadow(0 2px 0 #000)}
.title .title-a{font-size:39px;letter-spacing:5.2px;margin-bottom:7px}.title .title-b{font-size:57px;letter-spacing:1.5px}.title .title-c{font-size:59px;letter-spacing:1.5px;margin-top:3px}
.title-rule{width:317px;height:12px;display:flex;align-items:center;gap:11px;margin:14px 0 0;color:#a63e39}.title-rule::before,.title-rule::after{content:'';height:1px;background:linear-gradient(90deg,transparent,#a55c51);flex:1}.title-rule::after{transform:rotate(180deg)}.title-rule i{width:5px;height:5px;transform:rotate(45deg);border:1px solid #d88d7a}.english-title{margin:9px 0 0;width:317px;text-align:center;font-size:7.3px;letter-spacing:2.7px;color:#998f88}
.story-block{position:absolute;left:41px;top:333px;z-index:5;max-width:400px}.story{margin:0;font-family:Cinzel,Georgia,serif;font-size:24px;font-weight:400;line-height:1.28;color:#ece1d4}.story em{font-style:normal;color:#e5796c}.story-awake{display:none}.story-sub{font-size:10px;line-height:1.6;color:#bcb0a8;max-width:300px;letter-spacing:.15px;margin:10px 0 0;display:none}
.ritual{position:absolute;left:40px;top:415px;height:81px;display:flex;align-items:center;gap:20px;z-index:8;transition:opacity .5s,transform .5s}.seal{position:relative;width:78px;height:78px;flex:none;border:0;border-radius:50%;background:none;cursor:pointer;padding:0;touch-action:none;-webkit-user-select:none;user-select:none}
.seal-orbit{position:absolute;inset:-5px;border:1px solid #bc7e6c42;border-radius:50%;animation:breathe 3s ease-in-out infinite}.seal-orbit::before,.seal-orbit::after{content:'';position:absolute;top:calc(50% - 2px);left:-2px;width:4px;height:4px;background:#c58c76;transform:rotate(45deg)}.seal-orbit::after{left:auto;right:-2px}
.seal-face{position:absolute;inset:3px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#55413a 0,#2a211f 37%,#100e10 82%);border:1px solid #a97e655e;box-shadow:inset 0 0 0 4px #121011,inset 0 0 0 5px #bc907239,0 5px 24px #0008;transition:box-shadow .3s}
.seal-face svg{width:42px;height:42px;fill:none;stroke:#d1a38a;stroke-width:1;filter:drop-shadow(0 1px 2px #000);transition:filter .3s;overflow:visible}.seal-crack{stroke:#edbca4;opacity:0;stroke-dasharray:80;stroke-dashoffset:calc(80 - var(--progress)*80);transition:opacity .2s}
.seal-progress{position:absolute;inset:-3px;width:84px;height:84px;transform:rotate(-90deg);fill:none;stroke:#f3be95;stroke-width:1.5;stroke-dasharray:258;stroke-dashoffset:calc(258 - var(--progress)*258);filter:drop-shadow(0 0 4px #ef6b4a);pointer-events:none}
.ritual-copy{pointer-events:none}.ritual-title{display:block;font-size:11px;letter-spacing:2.8px;font-weight:700;color:#e3c5b2}.ritual-instruction{display:block;font-size:9px;color:#a89a92;margin-top:9px;letter-spacing:.3px}.ritual-progress{width:144px;margin-top:12px;height:1px;background:#99857635;overflow:hidden}.ritual-progress i{display:block;width:calc(var(--progress)*100%);height:100%;background:#f0ac89;box-shadow:0 0 12px #ec7854}
.creative[data-state=holding] .seal-face{box-shadow:inset 0 0 0 4px #121011,inset 0 0 0 5px #c9a27a8a,0 0 35px #c64c2545}.creative[data-state=holding] .seal-crack{opacity:1}.creative[data-state=holding] .seal-face svg{filter:drop-shadow(0 0 6px #e36d3c)}
.characters{position:absolute;left:40px;top:431px;display:flex;gap:9px;z-index:8;visibility:hidden;opacity:0;transform:translateY(12px);transition:opacity .5s .35s,transform .5s .35s}.character{background:#170e12bc;border:1px solid #63504c;cursor:pointer;min-width:119px;height:44px;display:flex;gap:10px;align-items:center;padding:0 14px;text-align:left;transition:border-color .2s,background .2s}
.character span{font-family:Cinzel,Georgia,serif;font-size:12px;letter-spacing:1.4px}.character small{font-size:7px;letter-spacing:1px;color:#968c86;display:block;margin-top:2px}.character-mark{width:5px;height:5px;border:1px solid #baa594;transform:rotate(45deg)}.character[aria-pressed=true]{border-color:#d29a82;background:#38201c8c}.character[aria-pressed=true] .character-mark{background:#dd9e7e;box-shadow:0 0 12px #f3a2798c}
.actions{position:absolute;left:40px;bottom:43px;display:flex;align-items:center;gap:23px;z-index:9}.trailer-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:190px;height:39px;color:#eee2d2;border:1px solid #bda48e80;background:linear-gradient(110deg,#7c433b30,#cbaa7930);font-size:9px;font-weight:700;letter-spacing:1.7px;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;transition:border-color .3s,background .3s}.trailer-btn::after{content:'';position:absolute;top:-25px;left:-80px;width:45px;height:110px;background:linear-gradient(90deg,transparent,#fff3,transparent);transform:rotate(30deg);transition:left .7s}.trailer-btn:hover::after{left:240px}.trailer-btn:hover{border-color:#f4c8a7;background:#50302799}.trailer-btn svg{width:10px;height:12px;fill:none;stroke:currentColor;stroke-width:1.3}.release{font-size:9px;font-weight:600;letter-spacing:2px;line-height:1.8;color:#d2bca9}.release b{font-size:15px;letter-spacing:4px;font-weight:400;display:block;color:#e7d2bc}
.legal{position:absolute;bottom:13px;left:40px;font-size:6px;letter-spacing:.25px;color:#837770;z-index:5}.imax{position:absolute;bottom:40px;right:27px;text-align:right;z-index:5}.imax span{display:block;font-size:6px;letter-spacing:1.5px;color:#b2a8a0}.imax b{font-family:Arial,sans-serif;font-weight:900;font-size:24px;letter-spacing:-1.5px;color:#d5cec5;line-height:1.2}
.portrait-caption{position:absolute;right:27px;bottom:100px;text-align:right;z-index:5;transition:opacity .6s}.portrait-caption strong{display:block;font-family:Cinzel,Georgia,serif;font-weight:400;font-size:12px;letter-spacing:4px}.portrait-caption span{display:block;font-size:6.5px;letter-spacing:2.5px;color:#b0a098;margin-top:7px}.portrait-caption::before{content:'';width:35px;height:1px;background:#c5816b;display:block;margin:0 0 12px auto}
.awakening-line{position:absolute;right:260px;top:-40px;width:2px;height:140%;background:linear-gradient(0deg,transparent,#ffac82,#ffe8c3,#ffac82,transparent);box-shadow:0 0 40px 15px #e452413a;transform:rotate(22deg) scaleY(0);opacity:0;z-index:4;pointer-events:none}.flash{position:absolute;inset:0;background:radial-gradient(circle at 28% 75%,#fff5d7,#f2b18a5e 20%,transparent 65%);opacity:0;z-index:9;pointer-events:none}.awake .awakening-line{animation:tear 1.2s ease-out both}.awake .flash{animation:flash 1.2s ease-out both}
.awake .portrait{filter:saturate(1.1) brightness(1.03)}.awake .story-locked{display:none}.awake .story-awake,.awake .story-sub{display:block}.awake .ritual{opacity:0;transform:translateY(-10px);pointer-events:none;visibility:hidden;transition:opacity .35s,transform .35s,visibility 0s .35s}.awake .characters{visibility:visible;opacity:1;transform:translateY(0)}.awake .portrait-caption{opacity:.9}.awake .light{opacity:.7}
.is-still .seal-orbit,.is-still .horizon::after{animation-play-state:paused}.creative[data-failed=true] .world::after{content:'KANDAN VE KEMİKTEN ÇOCUKLAR';position:absolute;right:30px;top:45%;max-width:260px;font:24px Cinzel,serif;color:#574740}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Billboard: composed for the exact 970 × 250 canvas. */
.creative[data-format=billboard]{height:250px}.creative[data-format=billboard] .portrait-wrap{right:-7px;top:-42px;width:435px;height:443px;mask-image:linear-gradient(90deg,transparent,#000 24%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 24%)}
.creative[data-format=billboard] .shade{background:linear-gradient(90deg,#0b080b 0%,rgba(11,8,11,.97) 26%,rgba(11,8,11,.8) 51%,transparent 73%),linear-gradient(0deg,#0b080bba,transparent 35%)}
.creative[data-format=billboard] .topline{left:25px;top:17px;font-size:6.4px;letter-spacing:1.8px;gap:9px}.creative[data-format=billboard] .topline::before{width:17px}.creative[data-format=billboard] .title-block{left:24px;top:43px;width:280px}.creative[data-format=billboard] .title .title-a{font-size:25px;letter-spacing:4.2px;margin-bottom:4px}.creative[data-format=billboard] .title .title-b{font-size:36px;letter-spacing:1.1px}.creative[data-format=billboard] .title .title-c{font-size:37px;letter-spacing:1.3px;margin-top:2px}
.creative[data-format=billboard] .title-rule{width:229px;margin-top:7px;height:7px}.creative[data-format=billboard] .english-title{font-size:5px;width:229px;letter-spacing:1.8px;margin-top:5px}.creative[data-format=billboard] .story-block{left:325px;top:41px;max-width:220px}.creative[data-format=billboard] .story{font-size:21px;line-height:1.32}.creative[data-format=billboard] .story-sub{font-size:8px;line-height:1.5;max-width:200px;margin-top:8px}
.creative[data-format=billboard] .ritual{left:325px;top:137px;gap:16px;height:68px}.creative[data-format=billboard] .seal{width:64px;height:64px}.creative[data-format=billboard] .seal-progress{width:70px;height:70px}.creative[data-format=billboard] .seal-face svg{width:35px;height:35px}.creative[data-format=billboard] .ritual-title{font-size:8px;letter-spacing:1.9px}.creative[data-format=billboard] .ritual-instruction{font-size:7px;letter-spacing:.05px;max-width:113px;line-height:1.7;margin-top:6px}.creative[data-format=billboard] .ritual-progress{width:102px;margin-top:7px}
.creative[data-format=billboard] .characters{left:325px;top:161px;gap:6px}.creative[data-format=billboard] .character{height:36px;min-width:94px;padding:0 9px;gap:8px}.creative[data-format=billboard] .character span{font-size:9px}.creative[data-format=billboard] .character small{font-size:6px}.creative[data-format=billboard] .actions{left:25px;bottom:30px;gap:15px}.creative[data-format=billboard] .trailer-btn{width:162px;height:30px;font-size:7px;letter-spacing:1.2px;gap:9px}.creative[data-format=billboard] .release{font-size:5.5px;letter-spacing:.9px}.creative[data-format=billboard] .release b{font-size:10px;letter-spacing:2px}.creative[data-format=billboard] .legal{left:25px;bottom:11px;font-size:5px}.creative[data-format=billboard] .imax{bottom:12px;right:21px}.creative[data-format=billboard] .imax span{font-size:4.5px}.creative[data-format=billboard] .imax b{font-size:17px}.creative[data-format=billboard] .portrait-caption{display:none}.creative[data-format=billboard] .controls{top:10px;right:12px;gap:5px}.creative[data-format=billboard] .icon-btn{width:24px;height:24px}.creative[data-format=billboard] .icon-btn svg{width:11px;height:11px}.creative[data-format=billboard] .horizon{right:-70px;top:-150px;width:550px;height:550px}
/* Halfpage: a separate vertical art direction, not a scaled desktop banner. */
.creative[data-format=halfpage]{width:300px;height:600px}.creative[data-format=halfpage] .portrait-wrap{right:-7px;top:-12px;width:314px;height:324px;mask-image:linear-gradient(0deg,transparent,#000 23%);-webkit-mask-image:linear-gradient(0deg,transparent,#000 23%)}.creative[data-format=halfpage] .portrait{object-position:50% 25%;filter:saturate(.7) brightness(.85)}.creative[data-format=halfpage].awake .portrait{filter:saturate(1.08) brightness(1.08)}
.creative[data-format=halfpage] .shade{background:linear-gradient(0deg,#0b080b 0%,#0b080b 43%,#0b080b9c 53%,transparent 72%),linear-gradient(180deg,#0b080b55,transparent 18%)}.creative[data-format=halfpage] .world{background:radial-gradient(ellipse at 90% 20%,#4a1726,transparent 65%),#0b080b}.creative[data-format=halfpage] .topline{top:18px;left:18px;font-size:6px;letter-spacing:1.4px;gap:7px}.creative[data-format=halfpage] .topline::before{width:12px}.creative[data-format=halfpage] .topline span{max-width:160px;line-height:1.6}.creative[data-format=halfpage] .controls{right:11px;top:14px;gap:5px}.creative[data-format=halfpage] .icon-btn{width:24px;height:24px}.creative[data-format=halfpage] .icon-btn svg{width:11px;height:11px}
.creative[data-format=halfpage] .title-block{left:20px;top:258px;width:260px}.creative[data-format=halfpage] .title{text-align:center}.creative[data-format=halfpage] .title span{margin-left:auto;margin-right:auto}.creative[data-format=halfpage] .title .title-a{font-size:23px;letter-spacing:4px;margin-bottom:4px}.creative[data-format=halfpage] .title .title-b{font-size:33px;letter-spacing:1.2px}.creative[data-format=halfpage] .title .title-c{font-size:35px;letter-spacing:1.3px;margin-top:3px}.creative[data-format=halfpage] .title-rule{width:230px;margin:9px auto 0;height:6px}.creative[data-format=halfpage] .english-title{width:260px;font-size:5.2px;letter-spacing:1.7px;margin-top:5px}
.creative[data-format=halfpage] .story-block{left:18px;top:391px;width:264px;max-width:264px;text-align:center}.creative[data-format=halfpage] .story{font-size:15px;line-height:1.3}.creative[data-format=halfpage] .story br{display:none}.creative[data-format=halfpage] .story-sub{font-size:8px;margin:8px auto 0;max-width:238px;line-height:1.5}
.creative[data-format=halfpage] .ritual{left:20px;top:415px;width:260px;height:80px;gap:14px;justify-content:center}.creative[data-format=halfpage] .seal{width:59px;height:59px}.creative[data-format=halfpage] .seal-progress{width:65px;height:65px}.creative[data-format=halfpage] .seal-face svg{width:33px;height:33px}.creative[data-format=halfpage] .ritual-title{font-size:9px;letter-spacing:2px}.creative[data-format=halfpage] .ritual-instruction{font-size:7px;max-width:133px;line-height:1.7;margin-top:7px;letter-spacing:.05px}.creative[data-format=halfpage] .ritual-progress{width:115px;margin-top:8px}
.creative[data-format=halfpage] .characters{left:30px;top:447px;gap:8px}.creative[data-format=halfpage] .character{min-width:116px;height:38px;padding:0 12px;gap:9px}.creative[data-format=halfpage] .character span{font-size:10px}.creative[data-format=halfpage] .character small{font-size:6px}.creative[data-format=halfpage] .actions{left:25px;bottom:38px;width:250px;display:block}.creative[data-format=halfpage] .trailer-btn{width:250px;height:36px;font-size:8px;letter-spacing:1.5px}.creative[data-format=halfpage] .release{margin-top:12px;text-align:center;font-size:7px;letter-spacing:2px;line-height:1}.creative[data-format=halfpage] .release b{display:inline;font-size:7px;letter-spacing:1px;margin-right:4px}.creative[data-format=halfpage] .legal{left:0;bottom:9px;width:100%;text-align:center;font-size:4.6px;letter-spacing:.1px}.creative[data-format=halfpage] .imax{right:0;bottom:21px;width:100%;text-align:center}.creative[data-format=halfpage] .imax span{display:none}.creative[data-format=halfpage] .imax b{font-size:12px;letter-spacing:-.8px}.creative[data-format=halfpage] .portrait-caption{display:none}.creative[data-format=halfpage] .horizon{width:400px;height:400px;top:-80px;right:-50px}.creative[data-format=halfpage] .light{right:-200px;top:-50px}.creative[data-format=halfpage] .awakening-line{right:90px}
@keyframes orbit{to{transform:rotate(360deg)}}@keyframes breathe{0%,100%{opacity:.45;transform:scale(.98)}50%{opacity:1;transform:scale(1.055)}}@keyframes flash{0%{opacity:0}12%{opacity:.78}100%{opacity:0}}@keyframes tear{0%{transform:rotate(22deg) scaleY(0);opacity:0}18%{opacity:1}44%{transform:rotate(22deg) scaleY(1);opacity:1}100%{transform:rotate(22deg) scaleY(1);opacity:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.portrait{transform:none!important}}