phobiney-story{display:block;position:relative;height:calc(var(--chapters,6)*var(--chapter-height,120)*1vh);background:var(--st-bg,#fff);color:#17191b;font-family:Arial,Helvetica,sans-serif;isolation:isolate}phobiney-story *{box-sizing:border-box}.st-stage{position:sticky;top:var(--st-offset,0px);height:calc(100svh - var(--st-offset,0px));max-width:1600px;margin:auto;overflow:hidden;min-height:540px}.st-top{position:absolute;top:28px;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between;z-index:5;font-size:14px}.st-brand{font-size:18px;letter-spacing:.08em;font-weight:800}.st-top small{color:#767b7c;margin-left:12px;letter-spacing:0;font-weight:400}.st-viewport{position:absolute;top:65px;right:0;bottom:85px;left:30%}.st-viewport canvas{width:100%;height:100%;display:block;opacity:0;transition:opacity .45s}.st-cover{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;background:var(--st-bg,#fff);z-index:2;transition:opacity .45s;pointer-events:none}phobiney-story[data-state=ready] canvas{opacity:1}phobiney-story[data-state=ready] .st-cover{opacity:0}.st-copy{position:absolute;left:5%;top:50%;width:30%;max-width:400px;transform:translateY(-42%);opacity:0;pointer-events:none;transition:opacity .32s,translate .4s;translate:0 16px;z-index:3}.st-copy.is-active{opacity:1;translate:0 0;pointer-events:auto}.st-copy[data-position=right]{left:auto;right:5%;background:color-mix(in srgb,var(--st-bg,#fff) 90%,transparent);padding:20px;border-radius:12px}.st-copy[data-align=center]{text-align:center}.st-copy[data-align=right]{text-align:right}.st-copy h2{font-size:clamp(36px,4.5vw,66px);font-weight:600;letter-spacing:-.055em;line-height:1.02;margin:0 0 26px}.st-copy p{font-size:17px;line-height:1.55;color:#62686c;max-width:31ch}.st-tag{display:inline-block;color:var(--st-accent,#c52b35);font-size:13px;margin-bottom:20px}.st-part{display:block;margin-top:28px;font-size:12px;color:#797e81}.st-bottom{position:absolute;bottom:23px;left:4%;right:4%;z-index:4}.st-progress{height:2px;background:#e8eaeb;margin-bottom:20px}.st-progress span{display:block;height:100%;background:var(--st-accent,#c52b35);transform-origin:left;transform:scaleX(0)}.st-nav{display:flex;justify-content:space-between;gap:10px}.st-nav button{border:0;background:none;padding:7px 0;font:inherit;font-size:12px;color:#85898b;cursor:pointer}.st-nav button[aria-current=step]{color:#15191b}.st-nav button span{margin-right:8px;font-variant-numeric:tabular-nums}.st-nav button[aria-current=step] span{color:var(--st-accent,#c52b35)}.st-meta{display:flex;gap:12px;align-items:center;color:#6d7376;font-size:12px}.st-meta strong{font-weight:400;color:#1e2224}.st-demo,.st-concept{position:absolute;bottom:12px;left:10%;right:10%;text-align:center;font-size:11px;line-height:1.4;color:#787d80;z-index:3}.st-concept{color:#575e61}.st-demo[hidden],.st-concept[hidden]{display:none}.st-status{position:absolute;bottom:40px;left:0;right:0;text-align:center;font-size:12px;color:#646a6d;z-index:3}.st-pause{background:none;border:0;color:#6d7376;font:inherit;font-size:11px;cursor:pointer}.st-nav button:focus-visible,.st-pause:focus-visible{outline:2px solid var(--st-accent,#c52b35);outline-offset:6px}.st-after{padding:70px 24px;text-align:center;font:14px Arial;color:#777;background:#fff}@media(max-width:749px){.st-stage{min-height:600px}.st-top{top:20px;left:6%;right:6%}.st-top small{display:none}.st-brand{font-size:15px}.st-meta{font-size:11px;gap:5px}.st-viewport{top:200px;right:0;bottom:105px;left:0}.st-copy,.st-copy[data-position=right]{left:7%;right:7%;top:82px;width:auto;max-width:none;transform:none;padding:0;background:none;text-align:left}.st-copy h2{font-size:34px;letter-spacing:-.045em;margin:0 0 10px;max-width:85%}.st-copy p{font-size:14px;line-height:1.45;margin:0;max-width:44ch}.st-tag,.st-part{display:none}.st-nav{overflow:auto;gap:20px;padding:0 0 6px}.st-nav button{white-space:nowrap;font-size:11px}.st-nav button span{margin-right:4px}.st-bottom{bottom:14px}.st-progress{margin-bottom:10px}.st-demo,.st-concept{bottom:0;font-size:10px}.st-pause{font-size:10px}}@media(prefers-reduced-motion:reduce){phobiney-story *{transition:none!important;scroll-behavior:auto!important}}.st-ai-process{position:absolute;bottom:14%;left:8%;right:8%;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;pointer-events:none}.st-ai-process[hidden]{display:none}.st-ai-process span{padding:9px 14px;background:#f0f5f4;border:1px solid #b6c8c4;border-radius:24px;color:#47625c;font-size:12px;transition:background .2s}.st-ai-process span.active{background:#173f38;color:#fff;border-color:#173f38}.st-ai-process small{flex-basis:100%;text-align:center;color:#566961;font-size:10px}.st-annotations{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:2}.st-annotations path{stroke:#a83b42;stroke-width:1;fill:none}.st-annotations circle{fill:#a83b42}.st-annotations text{font:12px Arial;fill:#343d40;paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}@media(max-width:749px){.st-annotations text{font-size:10px}}.st-stage{background:radial-gradient(ellipse at 72% 46%,#eef1f0 0%,#fafbfa 35%,var(--st-bg,#fff) 68%)}.st-atmosphere{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:-1}.st-big-type{position:absolute;top:12%;left:4%;right:0;font-size:clamp(100px,14vw,224px);font-weight:800;letter-spacing:-.08em;line-height:.9;color:#e5e9e7;opacity:.46;white-space:nowrap;transform:translate(calc(var(--phase,0)*-4px))}.st-axis{position:absolute;right:3%;top:45%;writing-mode:vertical-rl;font:9px Arial;letter-spacing:.18em;color:#939d99}.st-orbit{position:absolute;width:62vw;height:62vw;max-width:920px;max-height:920px;border:1px solid #dce3df;border-radius:50%;left:36%;top:8%;opacity:.35;transform:rotate(calc(var(--phase,0)*21deg))}.st-orbit:before,.st-orbit:after{content:"";position:absolute;top:9%;right:9%;bottom:9%;left:9%;border:1px dashed #cbd5cf;border-radius:50%}.st-orbit:after{top:23%;right:23%;bottom:23%;left:23%;border-style:solid}.st-top{padding-bottom:18px;border-bottom:1px solid #dfe4e1}.st-brand{font-size:16px;letter-spacing:.11em}.st-meta{font-variant-numeric:tabular-nums}.st-copy h2{font-size:clamp(40px,4.8vw,74px);font-weight:500;letter-spacing:-.065em;line-height:.98}.st-copy p{font-size:15px;line-height:1.65;max-width:29ch}.st-tag{letter-spacing:.13em;text-transform:uppercase;font-size:10px;font-weight:600}.st-part{border-top:1px solid #d4dcd7;padding-top:17px;max-width:28ch;line-height:1.5}.st-copy{transition:none}.st-nav button{position:relative;font-size:11px}.st-nav button span{font-size:10px}.st-progress{height:1px}.st-bottom{border-top:1px solid #e3e7e4;padding-top:15px}.st-progress{margin-top:-16px}.st-concept{background:#ffffffdb;padding:6px 10px;border-radius:3px;color:#4f625a;font-size:10px}.st-ai-process span{border-radius:3px;letter-spacing:.04em}.st-ai-process span.active{background:#a32935;border-color:#a32935}.st-annotations text{font:11px Arial;letter-spacing:.035em;stroke-width:4px}.st-annotations path{stroke-width:.9}@media(max-width:749px){.st-big-type{top:25%;font-size:20vw}.st-orbit{top:35%;left:8%;width:90vw;height:90vw}.st-copy h2{font-size:34px;max-width:none}.st-copy p{font-size:13px;line-height:1.45;max-width:42ch}.st-axis{display:none}.st-top{padding-bottom:12px}.st-ai-process{bottom:13%;left:2%;right:2%;gap:4px}.st-ai-process span{font-size:9px;padding:5px}.st-ai-process small{font-size:8px}}.st-annotations text{font:600 16px Arial;letter-spacing:.01em;stroke-width:6px}.st-copy p{font-size:18px}.st-part{font-size:14px}.st-annotations path{stroke-width:1.25}@media(max-width:749px){.st-annotations text{font-size:12px;stroke-width:4px}.st-copy p{font-size:14px}.st-part{font-size:12px}}.st-bottom{left:4%;right:4%;bottom:18px;padding:15px 18px 10px;border:1px solid #d5dfdc;border-radius:10px;background:linear-gradient(120deg,#fffe,#eef4f1ed);box-shadow:0 8px 30px #142c2410;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.st-progress{position:absolute;left:18px;right:18px;top:12px;margin:0;height:2px;background:repeating-linear-gradient(90deg,#cedbd5 0 22px,transparent 22px 27px)}.st-progress span{background:linear-gradient(90deg,#748c83,var(--st-accent,#c52b35));box-shadow:0 0 8px #c52b3538}.st-nav{padding:13px 0 0;gap:12px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x proximity}.st-nav::-webkit-scrollbar{display:none}.st-nav button{flex:1 0 auto;min-width:65px;padding:8px 8px 7px;text-align:left;border-radius:4px;color:#60736a;font-size:10px;letter-spacing:.025em;scroll-snap-align:center;transition:background .18s,color .18s}.st-nav button span{display:block;position:relative;margin:0 0 5px;padding-left:12px;font:600 10px ui-monospace,Consolas,monospace;letter-spacing:.12em;color:#8b9b94}.st-nav button span:before{content:"";position:absolute;left:0;top:2px;width:5px;height:5px;border:1px solid #a1b5aa;transform:rotate(45deg)}.st-nav button[aria-current=step]{background:#17342d;color:#f3fff9;box-shadow:inset 0 0 0 1px #52766a}.st-nav button[aria-current=step] span{color:#95ead1}.st-nav button[aria-current=step] span:before{background:#8be9c9;border-color:#8be9c9;box-shadow:0 0 8px #60dab2}.st-nav button:hover{background:#dce8e1;color:#18382d}.st-nav button[aria-current=step]:hover{background:#244b40;color:#fff}@media(max-width:749px){.st-bottom{left:4%;right:4%;bottom:12px;padding:13px 12px 7px;border-radius:8px}.st-progress{left:12px;right:12px;top:10px}.st-nav{gap:5px;padding-top:10px}.st-nav button{min-width:84px;font-size:10px;padding:6px 8px}.st-nav button span{font-size:10px;margin-bottom:4px}.st-viewport{bottom:120px}}.st-bottom>.st-pause{display:block;margin:4px 0 0 auto;font-size:10px;padding:3px 5px}.st-viewport{top:20px}.st-big-type{top:7%}@media(max-width:749px){.st-copy,.st-copy[data-position=right]{top:24px}.st-viewport{top:160px;bottom:135px}}phobiney-story .st-viewport>canvas{opacity:1;transition:none;z-index:0}phobiney-story .st-cover{opacity:1;visibility:visible;transition:none;background:var(--st-bg,#fff);z-index:2}phobiney-story[data-state=ready] .st-cover{opacity:0;visibility:hidden}phobiney-story:not([data-state=ready]) .st-annotations,phobiney-story:not([data-state=ready]) .st-ai-process{visibility:hidden}
/*# sourceMappingURL=/cdn/shop/t/30/assets/phobiney-story.css.map */