/* StoryByte365 HD Cinematic Master · enhanced-image site treatment */
:root{--hd-ice:#90e9ff;--hd-lilac:#cfabff;--hd-rose:#ff8bcf;--hd-gold:#f3c780;--hd-border:rgba(142,192,250,.32);--hd-glass:rgba(7,18,42,.78)}
body.hd-page{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:#030814}
.hd-page :where(h1,h2,h3){text-wrap:balance}
.hd-page :where(p){text-wrap:pretty}
.hd-page .topbar{background:rgba(3,9,23,.9);border-bottom:1px solid rgba(122,174,250,.26);box-shadow:0 14px 50px rgba(0,2,13,.38);backdrop-filter:blur(25px) saturate(1.42)}
.hd-page .button{box-shadow:0 10px 26px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.16);letter-spacing:.01em}
.hd-page .button-primary{box-shadow:0 13px 42px rgba(116,70,235,.38),inset 0 1px 0 rgba(255,255,255,.28)}
.hd-page .button:hover{transform:translateY(-3px);box-shadow:0 17px 48px rgba(68,110,226,.27),inset 0 1px 0 rgba(255,255,255,.35)}
.hd-page .nav-links a{transition:color .2s}
.hd-page :where(.bottom-cta,.form-surface,.start-side,.auth-form-panel,.auth-story,.editor-card,.feature-hero-art,.show-hero-visual,.price-card,.story-show-card){box-shadow:0 30px 70px rgba(0,2,13,.67),inset 0 1px 0 rgba(210,234,255,.12)}
.hd-page :where(.form-surface,.auth-form-panel,.auth-story,.editor-card,.start-side,.price-card){border-color:var(--hd-border)}
.hd-page .site-footer{background:linear-gradient(180deg,#060c1c,#02050e);border-top:1px solid rgba(114,167,235,.26)}
.hd-page .site-footer :where(a,p){color:#b8cbe6}
.hd-page .site-footer a:hover{color:#fff}
.hd-page img{image-rendering:auto}
/* Pixel-rich and depth-rich home: all layered panels use independent 2x artwork. */
.hd-page[data-page="index"] .cinematic-hero{background-image:radial-gradient(circle at 74% 48%,rgba(108,56,209,.28),transparent 52%),linear-gradient(180deg,#060b1d,#020613)}
.hd-page[data-page="index"] .cinematic-hero:before{background-image:url('cinema-atmosphere-hd.webp')}
.hd-page[data-page="index"] .portal-art{background-image:url('cinema-hero-hd.webp')}
.hd-page[data-page="index"] .cinema-finale{background-image:linear-gradient(90deg,#030715ee,#030715d6 54%,#050a1c8a),url('cinema-city-hd.webp')}
.hd-page[data-page="index"] .cinema-portal{box-shadow:0 48px 93px rgba(0,0,0,.86),0 0 50px rgba(69,156,255,.31),0 0 105px rgba(178,67,245,.29)}
.hd-page[data-page="index"] .cinematic-poster-grid .cinematic-story-card{box-shadow:0 32px 70px #000c,0 0 36px #5378fc19}
.hd-page .hd-concept-tag{position:absolute;z-index:2;right:20px;top:22px;font-size:9px;letter-spacing:.13em;font-weight:850;color:#e7efff;border:1px solid #e0eaff75;border-radius:999px;padding:7px 11px;background:#061122c9;backdrop-filter:blur(11px)}
.hd-page[data-page="index"] .cinematic-copy>p{color:#e1e9fb;font-size:19px}
/* High-definition inner heroes: unique page-specific 2560x1440 atmospheric composites, crisp HTML typography */
.hd-page:not([data-page="index"]) .inner-hero{position:relative;isolation:isolate;overflow:hidden;padding:103px 0 105px;min-height:490px;background-color:#060d20;background-position:right center;background-size:cover;border-bottom:1px solid rgba(128,175,251,.33)}
.hd-page:not([data-page="index"]) .inner-hero:after{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(2,7,20,.91),rgba(3,7,19,.70) 40%,rgba(4,8,20,.1) 90%),linear-gradient(0deg,rgba(3,8,22,.8),transparent 40%)}
.hd-page[data-page="how-it-works"] .inner-hero{background-image:url('stage-how-it-works-hd.webp')}
.hd-page[data-page="features"] .inner-hero{background-image:url('stage-features-hd.webp')}
.hd-page[data-page="showcase-ai-x-network"] .inner-hero{background-image:url('stage-showcase-hd.webp')}
.hd-page[data-page="pricing"] .inner-hero{background-image:url('stage-pricing-hd.webp')}
.hd-page[data-page="get-started"] .inner-hero{background-image:url('stage-get-started-hd.webp')}
.hd-page :where(.inner-hero h1,.auth-form-panel h1){text-shadow:0 7px 28px rgba(0,0,0,.46)}
.hd-page .inner-hero .kicker{color:#a4e6fb}
.hd-page .inner-hero p{color:#dfebfb}
.hd-page .inner-hero-grid{position:relative;z-index:1;grid-template-columns:1.02fr .98fr;gap:75px}
.hd-page .inner-hero .editor-card{transform:perspective(1200px) rotateY(-9deg) rotateZ(2deg);background:linear-gradient(140deg,rgba(16,31,67,.88),rgba(5,11,30,.96));backdrop-filter:blur(18px);border-color:#9bd8ff91;box-shadow:0 38px 70px rgba(0,0,0,.75),0 0 55px rgba(55,151,242,.2),inset 0 1px 0 #ffffff2c}
.hd-page .hd-editor-image{height:155px;position:relative;overflow:hidden;background:#142139}
.hd-page .hd-editor-image::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#061022c9,transparent 60%)}
.hd-page .hd-editor-image img{height:100%;width:100%;object-fit:cover;object-position:center 40%}
.hd-page .hd-editor-tag{position:absolute;z-index:1;left:18px;bottom:13px;font-size:10px;letter-spacing:.14em;color:#c3eefe;font-weight:900}
.hd-page .editor-inner{padding:26px 27px 28px}
.hd-page .editor-inner h3{font-size:24px;line-height:1.28}
.hd-page .editor-head{background:linear-gradient(100deg,#132e55,#192549);color:#e1f0ff}
/* Crisp image frames on Features and Showcase */
.hd-page .hd-art-frame{position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(140deg,#1e3169,#120d2d);border:1px solid #9cbbfc91;transform:perspective(1300px) rotateY(-7deg) rotateZ(1.5deg);box-shadow:0 36px 85px #000b,0 0 70px #3d7bf535,0 0 36px #a667fa31}
.hd-page .hd-art-frame:before{content:'';position:absolute;z-index:2;inset:9px;border:1px solid rgba(223,238,255,.3);border-radius:17px;pointer-events:none}
.hd-page .hd-art-frame img{width:100%;height:325px;object-fit:cover;object-position:center;filter:saturate(1.11) contrast(1.07)}
.hd-page .hd-stage-corner{position:absolute;z-index:5;top:24px;right:24px;color:#e6eefd;font-size:9px;letter-spacing:.12em;font-weight:800;background:#07142cad;border:1px solid #a2d1ff88;padding:8px 10px;border-radius:100px}
.hd-page .overlay-caption,.hd-page .show-hero-label{z-index:4;backdrop-filter:blur(15px);border:1px solid rgba(185,221,255,.5);box-shadow:0 14px 36px #0007}
/* Cinematic depth for storytelling content grids */
.hd-page :where(.feature-row,.journey-step,.story-show-card,.community-row){transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.hd-page :where(.feature-row,.journey-step,.story-show-card,.community-row):hover{transform:translateY(-4px);border-color:rgba(142,217,255,.65);box-shadow:0 22px 52px rgba(0,0,0,.35)}
.hd-page .feature-row{background:linear-gradient(127deg,rgba(21,39,70,.89),rgba(9,20,39,.8));box-shadow:inset 0 1px 0 #e2f1ff10}
.hd-page .story-show-card{overflow:hidden;border-color:#9caaff70;background:linear-gradient(130deg,#132844,#071328)}
.hd-page .show-art img{width:100%;height:100%;object-fit:cover}
.hd-page .motion-frame{box-shadow:0 30px 84px #000b,0 0 47px #4875ff36;border:1px solid #89cfff80}
.hd-page .community-row{background:linear-gradient(115deg,#0c1e3b,#11162f)}
/* Dramatic Pricing: rich photographic frames without adding misleading entitlements */
.hd-page .pricing-hero{min-height:495px;padding:74px 0 82px}
.hd-page .pricing-hero .shell{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:18px}
.hd-page .pricing-intro{position:relative;z-index:4;max-width:700px}
.hd-page .pricing-intro h1{font-size:clamp(48px,4.4vw,75px)}
.hd-page .pricing-intro>p{max-width:610px}
.hd-page .hd-pricing-scene{height:350px;position:relative;z-index:2;perspective:1000px}
.hd-page .hd-pricing-frame{position:absolute;width:230px;height:310px;border-radius:20px;padding:5px;background:linear-gradient(135deg,#60d6ff,#ac6afe,#ff8acf);box-shadow:0 33px 72px #000c,0 0 45px #8756f245;overflow:hidden;transform-style:preserve-3d;transition:transform .4s}
.hd-page .hd-pricing-frame img{width:100%;height:100%;object-fit:cover;border-radius:15px}
.hd-page .hd-pricing-frame-1{top:14px;left:12px;transform:rotateY(16deg) rotateZ(-10deg) translateZ(5px);border-color:#58dfff}
.hd-page .hd-pricing-frame-2{top:0;left:170px;transform:rotateY(-4deg) translateZ(75px);z-index:2}
.hd-page .hd-pricing-frame-3{top:24px;left:335px;transform:rotateY(-18deg) rotateZ(8deg) translateZ(15px);z-index:1}
.hd-page .pricing-hero-note{border:1px solid #8ebefa73;background:#081b34b0;backdrop-filter:blur(10px)}
.hd-page .price-card{position:relative;overflow:visible;border-radius:22px;background:linear-gradient(156deg,#142950,#060c20 72%);box-shadow:0 30px 65px #000a,inset 0 1px 0 #ffffff22}
.hd-page .price-card:before{content:'';position:absolute;z-index:0;top:0;left:0;right:0;height:145px;background-position:center 45%;background-size:cover;opacity:.20;border-radius:21px 21px 0 0;mask-image:linear-gradient(black,transparent)}
.hd-page .price-card.creator:before{background-image:url('cinema-book-hd.webp')}
.hd-page .price-card.pro:before{background-image:url('cinema-drama-hd.webp')}
.hd-page .price-card.studio:before{background-image:url('cinema-brand-hd.webp')}
.hd-page .price-card.agency:before{background-image:url('cinema-hero-hd.webp')}
.hd-page .price-card>*{position:relative;z-index:1}
.hd-page .price-card.pro{border-color:#cf84ff;box-shadow:0 30px 76px #000b,0 0 36px rgba(179,70,241,.32)}
.hd-page .price-card.agency{border-color:#c5a46c90}
.hd-page .price-features li{font-size:14px;line-height:1.6}
.hd-page .integration-limit{border-color:#7aa7d077;background:#0b2645b8}
.hd-page .section-faq{background:radial-gradient(ellipse at 90% 15%,#491d7650,transparent 46%),linear-gradient(180deg,#071427,#050a19)}
.hd-page .faq-accordion details{background:#0d1e3a83;padding:19px 21px;margin-bottom:10px;border:1px solid #7b9ec750;border-radius:13px;box-shadow:inset 0 1px 0 #b0d6fa17}
.hd-page .faq-accordion details[open]{border-color:#9cbbf781;background:#112545}
.hd-page .faq-accordion details p{margin-top:13px}
/* Create + account pages: cinematic studio visual and form legibility. */
.hd-page[data-page="get-started"] .start-layout{grid-template-columns:1.08fr .75fr;gap:36px}
.hd-page :where(.form-surface,.auth-form-panel,.start-side){background:radial-gradient(ellipse at 90% 0,#2e306336,transparent 50%),linear-gradient(155deg,#142846,#081329 70%);border-color:#86bafa66}
.hd-page .form-group :where(input,select,textarea),.hd-page .auth-form :where(input,select){font-size:16px;min-height:50px;color:#fff;border-color:#7796c5a3;background:#081931}
.hd-page .form-group textarea{min-height:155px}
.hd-page .auth-section{position:relative;isolation:isolate;min-height:760px;padding:92px 0 115px;background:#05091b}
.hd-page .auth-section:before{content:'';position:absolute;z-index:-1;inset:0;background-position:center;background-size:cover;opacity:.8}
.hd-page[data-page="register"] .auth-section:before{background-image:url('stage-register-hd.webp')}
.hd-page[data-page="login"] .auth-section:before{background-image:url('stage-login-hd.webp')}
.hd-page .auth-grid{grid-template-columns:1.04fr .96fr;gap:35px}
.hd-page .auth-form-panel{box-shadow:0 36px 95px #000b,inset 0 1px 0 #b7edff25}
.hd-page .auth-story{background:linear-gradient(160deg,#132951cf,#080e23ed);box-shadow:0 36px 95px #0009,inset 0 1px 0 #a8c5ff2a}
.hd-page .auth-photo{position:relative;height:285px;margin-bottom:27px;border:1px solid #7ebdff73;border-radius:17px;box-shadow:0 22px 57px #0009;overflow:hidden}
.hd-page .auth-photo img{width:100%;height:100%;object-fit:cover;object-position:center 40%;filter:saturate(1.08) contrast(1.04)}
.hd-page .auth-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#09132cba,transparent 54%)}
.hd-page .hd-auth-photo-label{position:absolute;z-index:1;bottom:17px;left:20px;font-size:10px;letter-spacing:.17em;font-weight:900;color:#d7eafb}
.hd-page :where(.form-privacy-banner,.form-result){font-size:13px;line-height:1.5}
/* Retina-ready UI does not compromise mobile density */
@media(min-width:1600px){.hd-page .shell{width:min(1400px,calc(100% - 110px))}.hd-page .cinematic-hero-grid{width:min(1490px,calc(100% - 110px))}.hd-page .cinema-portal{width:480px;height:570px;left:95px}.hd-page .price-cards{gap:22px}}
@media(max-width:1200px){.hd-page .hd-pricing-frame{width:195px;height:275px}.hd-page .hd-pricing-frame-2{left:125px}.hd-page .hd-pricing-frame-3{left:240px}.hd-page .pricing-intro h1{font-size:58px}.hd-page .inner-hero-grid{gap:40px}}
@media(max-width:940px){.hd-page .inner-hero-grid{gap:20px}.hd-page .inner-hero{padding:72px 0}.hd-page .pricing-hero .shell{gap:0}.hd-page .hd-pricing-scene{transform:scale(.75);transform-origin:center left}.hd-page .auth-grid{gap:20px}}
@media(max-width:700px){
 .hd-page:not([data-page="index"]) .inner-hero{min-height:0;padding:65px 0;background-position:70% center}
 .hd-page:not([data-page="index"]) .inner-hero:after{background:linear-gradient(90deg,rgba(2,7,20,.94),rgba(3,7,19,.80) 65%,rgba(4,8,20,.35)),linear-gradient(0deg,rgba(3,8,22,.72),transparent)}
 .hd-page .inner-hero-grid{grid-template-columns:1fr;gap:37px}
 .hd-page .inner-hero .editor-card,.hd-page .hd-art-frame{transform:none}
 .hd-page .hd-art-frame img{height:245px}
 .hd-page .hd-stage-corner{font-size:8px;right:15px;top:15px}
 .hd-page .pricing-hero .shell{display:block}
 .hd-page .hd-pricing-scene{height:260px;width:100%;transform:scale(.63);transform-origin:top left;margin:35px 0 -100px}
 .hd-page .price-card:before{height:110px}
 .hd-page .faq-accordion details{padding:16px}
 .hd-page[data-page="get-started"] .start-layout{grid-template-columns:1fr;gap:20px}
 .hd-page .auth-section{min-height:0;padding:50px 0 80px}
 .hd-page .auth-grid{grid-template-columns:1fr;gap:22px}
 .hd-page .auth-photo{height:240px}
 .hd-page .cinematic-copy>p{font-size:16px}
 .hd-page .hd-concept-tag{font-size:8px;right:12px;top:12px}
}
@media(max-width:400px){.hd-page .hd-pricing-scene{transform:scale(.54);margin-bottom:-133px}.hd-page .price-card{padding:24px 20px}}
@media(prefers-reduced-motion:reduce){.hd-page *,.hd-page *:before,.hd-page *:after{animation-duration:0.01ms!important;transition-duration:0.01ms!important}}
/* Very narrow phones: preserve all three navigation controls without horizontal scrolling. */
@media(max-width:375px){.hd-page .nav-inner{gap:7px}.hd-page .brand{gap:3px}.hd-page .logo-symbol{width:26px;height:26px}.hd-page .brand-text b{font-size:16px}.hd-page .nav-actions .button{font-size:9px;padding:7px 7px;min-height:36px}.hd-page .menu-toggle{width:39px;min-width:39px;padding:7px}.hd-page .nav-actions{margin-left:auto}}