:root{--tp-night:#050718;--tp-blue:#091331;--tp-purple:#a67cff;--tp-lilac:#dcb8ff;--tp-pink:#ef91d7;--tp-gold:#f5cb88;--tp-ink:#f8f2ff;--tp-muted:#aaa2bf}
.bobo-page{background:var(--tp-night);color:var(--tp-ink)}.bobo-page main{position:relative;z-index:1;overflow:hidden}.tp-container{width:min(1180px,calc(100% - 48px));margin-inline:auto}.tp-overline{font-size:.76rem;font-weight:700;letter-spacing:.2em;color:var(--tp-gold);text-transform:uppercase}.tp-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border:1px solid rgba(191,155,255,.28);border-radius:999px;color:var(--tp-ink);font-size:.9rem;font-weight:600;background:rgba(12,11,40,.42);transition:.3s}.tp-button:hover{transform:translateY(-2px);border-color:rgba(215,184,255,.65);box-shadow:0 12px 32px rgba(93,54,161,.24)}.tp-button--primary{border:0;background:linear-gradient(110deg,#efa752,#ed7fc7);color:#fff;box-shadow:0 12px 35px rgba(237,127,199,.25)}
.tp-hero{position:relative;min-height:940px;display:flex;align-items:center;background:radial-gradient(circle at 69% 35%,rgba(116,80,210,.26),transparent 28%),linear-gradient(180deg,#050718,#07102a 74%,#07102a)}.tp-stars{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.55) 1px,transparent 1.1px);background-size:58px 58px;opacity:.2;mask-image:linear-gradient(#000,transparent 94%)}.tp-hero-layout{position:relative;display:grid;grid-template-columns:minmax(430px,.9fr) minmax(600px,1.1fr);align-items:center;gap:0}.tp-hero-copy{position:relative;z-index:3;padding-top:30px}.tp-hero-copy h1{margin:20px 0 0;font-size:clamp(4rem,5.5vw,6.2rem);line-height:1.06;letter-spacing:-.065em;color:var(--tp-gold);font-weight:800;white-space:nowrap}.tp-hero-copy h1 span{display:block}.tp-subtitle{margin-top:28px;color:#ddd3f1;font-weight:600;letter-spacing:.06em}.tp-body{max-width:510px;margin-top:22px;color:var(--tp-muted);font-size:1.04rem;line-height:1.9}.tp-actions{display:flex;gap:12px;margin-top:30px}.tp-product-stage{position:relative;min-height:680px;display:grid;place-items:center}.tp-product-stage img{position:relative;z-index:2;width:780px;max-width:none;mask-image:radial-gradient(ellipse 72% 66% at 50% 50%,#000 62%,transparent 100%);filter:drop-shadow(0 30px 50px rgba(0,0,0,.45))}.tp-clock-ring{position:absolute;z-index:1;width:590px;height:590px;border:1px solid rgba(203,160,255,.28);border-radius:50%;box-shadow:0 0 100px rgba(129,80,221,.17),inset 0 0 80px rgba(245,203,136,.06)}.tp-clock-ring:before,.tp-clock-ring:after{content:"";position:absolute;inset:12%;border:1px solid rgba(245,203,136,.2);border-radius:50%}.tp-clock-ring:after{inset:30%;box-shadow:0 0 50px rgba(218,160,255,.2)}.tp-incoming{position:absolute;z-index:4;right:2%;top:27%;padding:15px 19px;border:1px solid rgba(213,175,255,.3);border-radius:17px;background:rgba(9,7,31,.8);backdrop-filter:blur(14px)}.tp-incoming small,.tp-incoming strong{display:block}.tp-incoming small{color:var(--tp-pink);font-size:.72rem}.tp-incoming strong{margin-top:4px}
.tp-station{position:relative;padding:120px 0 70px;background:radial-gradient(circle at 50% 42%,rgba(109,71,200,.2),transparent 40%),linear-gradient(180deg,#07102a,#070a20)}.tp-station:before,.tp-flow:before,.tp-versions:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.45) 1px,transparent 1.1px);background-size:62px 62px;opacity:.12;pointer-events:none}.tp-section-title{position:relative;z-index:2;text-align:center;max-width:900px;margin:0 auto 30px}.tp-section-title h2{margin-top:10px;font-size:clamp(3.6rem,7vw,6.5rem);line-height:1.05;letter-spacing:-.055em;background:linear-gradient(90deg,#efdbff,#ad80f7);-webkit-background-clip:text;background-clip:text;color:transparent}.tp-section-title>p:last-child{margin-top:16px;color:#ddd4ef;font-size:1.15rem}.tp-world{position:relative;z-index:2;max-width:980px;margin:auto}.tp-world>img{display:block;width:100%;filter:drop-shadow(0 35px 80px rgba(0,0,0,.35))}.tp-world-label{position:absolute;min-width:150px;padding:10px 14px;border:1px solid rgba(221,174,255,.55);border-radius:15px;background:rgba(32,17,75,.86);color:#fff;text-align:center;backdrop-filter:blur(10px);cursor:pointer;transition:.3s}.tp-world-label:hover,.tp-world-label.is-active{transform:translateY(-4px);background:rgba(99,58,157,.9);box-shadow:0 0 30px rgba(213,149,255,.3)}.tp-world-label strong,.tp-world-label small{display:block}.tp-world-label small{margin-top:3px;color:#c9bcdb;font-size:.68rem}.tp-world-label--parent{left:4%;top:24%}.tp-world-label--lover{right:4%;top:24%}.tp-world-label--friend{left:4%;top:69%}.tp-world-label--family{right:4%;top:69%}
.tp-flow{position:relative;padding:100px 0 120px;background:linear-gradient(180deg,#070a20,#080b25)}.tp-section-title--compact h2{font-size:clamp(2.6rem,5vw,4.5rem)}.tp-flow-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;align-items:center;gap:12px;margin-top:45px}.tp-flow-grid article{min-height:335px;padding:28px;border:1px solid rgba(184,138,248,.35);border-radius:25px;background:linear-gradient(150deg,rgba(75,47,134,.46),rgba(14,12,46,.8));box-shadow:0 24px 60px rgba(0,0,0,.18)}.tp-flow-grid article>span{color:var(--tp-gold);font-size:1.8rem;font-weight:700}.tp-flow-grid h3{font-size:1.25rem;margin-top:22px}.tp-flow-grid p{margin-top:8px;color:var(--tp-muted);line-height:1.7}.tp-flow-grid>b{text-align:center;color:#c89cff;font-size:2.5rem;font-weight:400}.tp-flow-art{position:relative;height:125px;margin:15px 0;background:radial-gradient(circle at 48% 60%,rgba(191,133,255,.22),transparent 55%)}.tp-flow-art i{position:absolute;bottom:18px;width:70px;height:55px;border-radius:48% 48% 42% 42%;background:linear-gradient(145deg,#c594ff,#7c55ca);box-shadow:0 15px 28px rgba(0,0,0,.2)}.tp-flow-art i:first-child{left:28%}.tp-flow-art i:last-child{right:28%;background:linear-gradient(145deg,#f3a9d9,#ba69bc)}.tp-flow-art--message:after{content:"···";position:absolute;left:50%;top:10px;transform:translateX(-50%);padding:9px 25px;border-radius:14px;background:#d7a9ff;color:#4f2b77;font-weight:700}.tp-flow-art--clock:before{content:"07:30";position:absolute;left:50%;top:15px;transform:translateX(-50%);width:84px;height:84px;display:grid;place-items:center;border:7px solid #9d72df;border-radius:50%;background:#09091d;color:#fff;font-weight:700}
.tp-versions{position:relative;padding:100px 0 130px;background:linear-gradient(180deg,#080b25,#07091f)}.tp-version-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:40px}.tp-version{overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:28px;background:#100d2a;box-shadow:0 28px 70px rgba(0,0,0,.25)}.tp-version--gold{border-color:rgba(244,193,103,.6);background:linear-gradient(160deg,#3b2710,#110c0c)}.tp-version--violet{border-color:rgba(216,142,255,.58);background:linear-gradient(160deg,#251643,#100d29)}.tp-version-crop{position:relative;height:460px;overflow:hidden}.tp-version-crop img{position:absolute;top:-2%;width:200%;max-width:none;height:110%;object-fit:cover}.tp-version--gold img{left:0}.tp-version--violet img{right:0}.tp-version-copy{padding:25px 30px 30px}.tp-version-copy p{color:var(--tp-gold);font-size:.7rem;letter-spacing:.18em}.tp-version-copy h3{margin:5px 0;font-size:2.2rem}.tp-version-copy span{color:var(--tp-muted)}
.tp-compose{padding:130px 0;background:radial-gradient(circle at 72% 48%,rgba(117,73,210,.18),transparent 34%),#07091f}.tp-compose-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:70px;align-items:start}.tp-compose-intro h2,.tp-final h2{margin-top:15px;font-size:clamp(2.6rem,4.8vw,4.7rem);line-height:1.1;letter-spacing:-.05em}.tp-compose-intro>p:nth-of-type(2){margin-top:22px;color:var(--tp-muted);line-height:1.8}.tp-local{display:inline-block;margin-top:24px;padding:9px 13px;border:1px solid rgba(245,203,136,.25);border-radius:999px;color:#cfc6da;font-size:.76rem}.tp-form-shell{padding:38px;border:1px solid rgba(183,137,245,.3);border-radius:28px;background:linear-gradient(145deg,rgba(35,23,79,.72),rgba(9,8,31,.82));box-shadow:0 28px 80px rgba(0,0,0,.25)}.tp-form-shell fieldset{border:0}.tp-form-shell legend,.tp-field>span{display:block;margin-bottom:11px;font-weight:600}.tp-choice{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.tp-choice input{position:absolute;opacity:0}.tp-choice span{display:block;padding:12px;text-align:center;border:1px solid rgba(255,255,255,.12);border-radius:12px;color:var(--tp-muted);cursor:pointer}.tp-choice input:checked+span{border-color:#b987fb;background:rgba(159,102,226,.2);color:#fff}.tp-field{position:relative;display:block;margin-top:24px}.tp-field textarea,.tp-field select,.tp-field input{width:100%;padding:14px 16px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:#09091f;color:#fff;outline:0}.tp-field textarea:focus,.tp-field select:focus,.tp-field input:focus{border-color:#b987fb;box-shadow:0 0 0 3px rgba(185,135,251,.1)}.tp-field textarea{resize:vertical}.tp-field>small{position:absolute;right:11px;bottom:8px;color:#756e88}.tp-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tp-submit{width:100%;margin-top:26px}.tp-result{margin-top:28px;padding:24px;border:1px solid rgba(236,139,215,.25);border-radius:18px;background:linear-gradient(145deg,rgba(114,73,180,.22),rgba(236,139,215,.06))}.tp-result>div{display:flex;justify-content:space-between;color:var(--tp-pink);font-size:.76rem}.tp-result>p{margin-top:14px;line-height:1.8}.tp-result>button{display:flex;align-items:center;gap:10px;margin-top:18px;border:0;background:none;color:#fff;cursor:pointer}.bobo-play-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--tp-gold);border-radius:50%;color:var(--tp-gold);font-size:.68rem}.tp-result.is-new{box-shadow:0 0 35px rgba(225,135,218,.17)}
.tp-final{text-align:center;padding:150px 0;background:radial-gradient(circle at 50% 50%,rgba(121,76,211,.2),transparent 35%),#06081b}.tp-final h2{max-width:880px;margin-inline:auto}.tp-final>div>p:nth-of-type(2){margin:20px 0 28px;color:var(--tp-muted)}
@media(max-width:1050px){.tp-hero-layout{grid-template-columns:1fr}.tp-hero{padding:140px 0 50px}.tp-hero-copy{text-align:center}.tp-hero-copy h1{white-space:normal}.tp-body{margin-inline:auto}.tp-actions{justify-content:center}.tp-product-stage{min-height:620px}.tp-compose-layout{grid-template-columns:1fr}.tp-version-crop{height:380px}}
@media(max-width:700px){.tp-container{width:min(100% - 30px,1180px)}.tp-hero{min-height:auto}.tp-hero-copy h1{font-size:clamp(3rem,14vw,4.5rem)}.tp-product-stage{min-height:430px}.tp-product-stage img{width:520px}.tp-clock-ring{width:350px;height:350px}.tp-incoming{right:0;top:15%}.tp-station,.tp-flow,.tp-versions,.tp-compose{padding:80px 0}.tp-section-title h2{font-size:clamp(3rem,14vw,4.6rem)}.tp-world{margin-inline:-10px}.tp-world-label{min-width:82px;padding:7px 9px}.tp-world-label small{display:none}.tp-world-label--parent,.tp-world-label--friend{left:1%}.tp-world-label--lover,.tp-world-label--family{right:1%}.tp-flow-grid{display:block}.tp-flow-grid article{min-height:0;margin-bottom:16px}.tp-flow-grid>b{display:block;transform:rotate(90deg);height:36px}.tp-version-grid{grid-template-columns:1fr}.tp-version-crop{height:330px}.tp-form-shell{padding:24px 18px}.tp-choice{grid-template-columns:1fr 1fr}.tp-form-row{grid-template-columns:1fr}.tp-actions{flex-direction:column;align-items:stretch}.tp-button{width:100%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}
.tp-product-stage img{mask-image:radial-gradient(ellipse 63% 58% at 50% 54%,#000 55%,transparent 96%)}
.tp-flow-art{overflow:hidden;border-radius:18px;background:radial-gradient(circle at 48% 60%,rgba(191,133,255,.22),transparent 55%)}
.tp-flow-art img{width:100%;height:100%;object-fit:cover;object-position:center;mix-blend-mode:screen;filter:saturate(1.08)}
.tp-hero{overflow:hidden;background:radial-gradient(circle at 74% 34%,rgba(91,63,180,.27),transparent 34%),linear-gradient(180deg,#050718 0%,#080d26 73%,#07102a 100%)}
.tp-hero-layout{grid-template-columns:minmax(430px,.82fr) minmax(660px,1.18fr)}
.tp-product-stage{min-height:720px;margin-right:0;transform:translateX(-18px)}
.tp-product-stage img{width:min(820px,61vw);max-width:none;-webkit-mask-image:radial-gradient(ellipse 66% 65% at 53% 51%,#000 60%,rgba(0,0,0,.9) 74%,transparent 100%);mask-image:radial-gradient(ellipse 66% 65% at 53% 51%,#000 60%,rgba(0,0,0,.9) 74%,transparent 100%);filter:drop-shadow(0 35px 55px rgba(0,0,0,.35))}
.tp-clock-ring,.tp-incoming{display:none}
@media(max-width:1050px){.tp-hero-layout{grid-template-columns:1fr}.tp-product-stage{margin-right:0;transform:none}.tp-product-stage img{width:min(980px,120vw);mask-image:radial-gradient(ellipse 70% 70% at 50% 50%,#000 72%,transparent 100%)}}
@media(max-width:700px){.tp-product-stage{min-height:420px}.tp-product-stage img{width:620px}}

/* Reference-matched first three screens */
.tp-product-stage img{mix-blend-mode:screen}
.tp-station{padding:86px 0 76px}
.tp-section-title h2{font-size:clamp(3.25rem,5vw,4.8rem)}
.tp-world{max-width:1120px;margin:26px auto 0}
.tp-world-label--parent{left:5%;top:20%}.tp-world-label--lover{right:5%;top:20%}.tp-world-label--friend{left:4%;top:66%}.tp-world-label--family{right:4%;top:66%}
.tp-section-title--compact h2{font-size:clamp(2.6rem,4vw,3.8rem)}
.tp-product-stage:after,.tp-world:after{content:"";position:absolute;z-index:3;inset:-2px;pointer-events:none;background:linear-gradient(90deg,#050718 0,rgba(5,7,24,.92) 4%,transparent 22%),linear-gradient(180deg,#050718 0,transparent 20%,transparent 88%,#07102a 100%)}
.tp-world:after{z-index:1;background:linear-gradient(90deg,#070a20 0,transparent 8%,transparent 92%,#070a20 100%),linear-gradient(180deg,#070a20 0,transparent 8%,transparent 92%,#070a20 100%)}
.tp-world>img{position:relative;z-index:2}.tp-world-label{z-index:4}

/* Hero: two artwork layers — world background + transparent TimePal foreground */
.tp-hero{min-height:100vh;isolation:isolate;background:#050718}
.tp-hero:before{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,6,20,.8) 0%,rgba(4,6,20,.48) 30%,rgba(4,6,20,.06) 51%,transparent 68%),linear-gradient(180deg,rgba(5,7,24,.12) 65%,#07102a 100%)}
.tp-hero-background{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;user-select:none;pointer-events:none}
.tp-stars{z-index:1;opacity:.08}
.tp-hero-layout{z-index:2;width:min(1280px,calc(100% - 72px));grid-template-columns:minmax(430px,.78fr) minmax(660px,1.22fr);min-height:inherit}
.tp-hero-copy{z-index:4;padding-top:54px;text-shadow:0 3px 28px rgba(2,4,16,.72)}
.tp-hero-copy h1{font-size:clamp(4.1rem,5.35vw,6rem)}
.tp-product-stage{align-self:stretch;min-height:inherit;transform:none;pointer-events:none}
.tp-product-stage img{position:absolute;z-index:3;top:calc(clamp(230px,36%,320px) + 70px);right:-328px;bottom:auto;width:min(690px,52vw);max-width:none;-webkit-mask-image:none;mask-image:none;mix-blend-mode:normal;filter:drop-shadow(0 32px 48px rgba(0,0,0,.5))}
.tp-product-stage:after{display:none}
@media(max-width:1050px){.tp-hero{padding:128px 0 30px}.tp-hero-layout{width:min(100% - 36px,900px);grid-template-columns:1fr;min-height:auto}.tp-hero-copy{padding-top:0}.tp-product-stage{min-height:510px}.tp-product-stage img{top:auto;right:50%;bottom:-18px;width:min(850px,104vw);transform:translateX(50%)}.tp-hero:before{background:linear-gradient(180deg,rgba(4,6,20,.54) 0%,rgba(4,6,20,.3) 46%,rgba(5,7,24,.04) 72%,#07102a 100%)}}
@media(max-width:700px){.tp-hero{padding-top:118px}.tp-hero-layout{width:min(100% - 30px,620px)}.tp-product-stage{min-height:285px}.tp-product-stage img{width:480px;bottom:0}.tp-hero-copy h1{font-size:clamp(2.85rem,13.5vw,4.2rem)}.tp-subtitle{margin-top:20px}.tp-body{margin-top:16px;font-size:.94rem}.tp-actions{margin-top:22px}}

/* Keep the hero artwork below the fixed site navigation. */
.tp-hero{margin-top:80px;min-height:calc(100vh - 80px)}
@media(max-width:768px){.tp-hero{margin-top:56px;min-height:calc(100vh - 56px)}}
@media(max-width:700px){.tp-hero{padding-top:62px}}

/* Preserve the complete 1672 × 941 hero artwork on desktop. */
@media(min-width:769px){.tp-hero{height:auto;min-height:0;aspect-ratio:1672/941}.tp-hero-layout{height:100%;min-height:0}.tp-hero-background{object-fit:contain;object-position:center top}}
@media(max-width:768px){.tp-hero-background{object-position:center top}}
@media(min-width:769px){.tp-hero-copy{transform:translateY(-140px)}}

/* Match the typography rhythm of the homepage hero copy. */
.tp-hero-copy{max-width:780px}
.tp-hero-copy h1{color:#f3dfbd;font-family:var(--font-serif);font-size:clamp(3.8rem,6.2vw,6rem);font-weight:500;letter-spacing:.015em;line-height:1.02;text-shadow:0 0 34px rgba(240,160,80,.18)}
.tp-hero-copy .tp-overline{color:rgba(234,217,191,.76);font-family:var(--font-serif);font-size:.86rem;font-weight:600;letter-spacing:.16em}
.tp-hero-copy .tp-subtitle{margin-top:26px;color:rgba(234,217,191,.82);font-family:var(--font-serif);font-size:clamp(1.16rem,1.55vw,1.42rem);font-weight:500;letter-spacing:.045em;line-height:1.45}
.tp-hero-copy .tp-body{max-width:530px;margin-top:18px;color:rgba(239,236,228,.68);font-size:1rem;line-height:1.8}
.tp-hero-copy .tp-actions{gap:1.15rem;margin-top:30px}
.tp-hero-copy .tp-button{min-width:190px;min-height:0;padding:13px 30px;border-radius:var(--radius-full);font-family:var(--font-serif);font-size:1.02rem;font-weight:600;letter-spacing:.015em}
.tp-hero-copy .tp-button--primary{background:linear-gradient(180deg,#fff1d5,#f3cf9b);color:#16100d;box-shadow:0 0 34px rgba(244,206,151,.4)}
.tp-hero-copy .tp-button:not(.tp-button--primary){background:rgba(3,4,12,.18);border-color:rgba(244,224,190,.62);color:#ead9bf}
@media(max-width:700px){.tp-hero-copy h1{font-size:clamp(3rem,12vw,4.4rem)}.tp-hero-copy .tp-subtitle{font-size:1.15rem;letter-spacing:.03em}.tp-hero-copy .tp-actions{max-width:320px;margin-inline:auto}.tp-hero-copy .tp-button{width:100%}}

/* Exact homepage “Origin of AiinCity” text-block treatment. */
.tp-hero-copy h1{margin-top:0;margin-bottom:clamp(1.6rem,3vw,2.4rem);font-family:var(--font-serif);font-size:clamp(2.8rem,5.8vw,5.25rem);font-weight:600;letter-spacing:.02em;line-height:1.08;color:#f3dfbd;text-shadow:0 0 28px rgba(240,160,80,.12)}
.tp-hero-copy .tp-overline{display:inline-flex;align-items:center;gap:8px;margin-bottom:1rem;color:rgba(244,206,151,.88);font-family:var(--font-sans);font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.tp-hero-copy .tp-overline:before{content:"";width:6px;height:6px;border-radius:50%;background:rgba(150,170,230,.9);box-shadow:0 0 10px rgba(130,150,220,.5)}
.tp-hero-copy .tp-subtitle,.tp-hero-copy .tp-body{max-width:540px;color:rgba(234,217,191,.76);font-family:'Cormorant Garamond',var(--font-serif);font-size:clamp(1.14rem,1.48vw,1.34rem);font-weight:400;line-height:1.72;letter-spacing:.025em}
.tp-hero-copy .tp-subtitle{margin-top:0}.tp-hero-copy .tp-body{margin-top:1.2rem}
@media(max-width:700px){.tp-hero-copy h1{font-size:clamp(2.4rem,12vw,3.6rem)}.tp-hero-copy .tp-subtitle,.tp-hero-copy .tp-body{font-size:1.08rem;line-height:1.68;letter-spacing:.02em}}

/* Screen 2: single composed relationship-world artwork + HTML controls. */
.tp-station{padding:0;scroll-margin-top:80px;background:#07102a}
.tp-station:before{display:none}
.tp-station .tp-section-title{position:absolute;z-index:5;top:-22px;left:50%;width:min(900px,calc(100% - 40px));margin:0;transform:translateX(-50%);text-shadow:0 3px 24px rgba(2,4,18,.92)}
.tp-station .tp-section-title h2{font-family:var(--font-serif);font-size:clamp(3.2rem,5.4vw,5rem);font-weight:600;letter-spacing:.02em;line-height:1.08;background:none;color:#d9b8ff;-webkit-text-fill-color:currentColor;text-shadow:0 0 30px rgba(173,128,247,.24)}
.tp-world{width:100vw;max-width:none;margin:0 0 0 calc(50% - 50vw);padding-top:0;background:#081330}
.tp-world>img{width:100%;filter:none}
.tp-world:after{display:none}.tp-world:before{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;background:linear-gradient(180deg,#07102a 0%,rgba(7,16,42,.52) 5%,transparent 15%),linear-gradient(0deg,#070a20 0%,rgba(7,10,32,.62) 5%,transparent 17%)}
.tp-world-label{z-index:4;min-width:132px;padding:9px 13px;border-color:rgba(226,190,255,.64);background:linear-gradient(180deg,rgba(91,49,144,.94),rgba(48,25,95,.92));box-shadow:0 8px 25px rgba(5,4,20,.28),inset 0 0 18px rgba(220,168,255,.08);transform:translate(-50%,calc(-50% + 140px))}
.tp-world-label:hover,.tp-world-label.is-active{transform:translate(-50%,calc(-50% + 136px))}
.tp-world-label--parent{left:21.5%;top:28%}.tp-world-label--lover{left:80%;right:auto;top:28%}.tp-world-label--friend{left:21.5%;top:69%}.tp-world-label--family{left:80%;right:auto;top:69%}
.tp-world-label--friend,.tp-world-label--family{transform:translate(-50%,calc(-50% + 210px))}
.tp-world-label--friend:hover,.tp-world-label--friend.is-active,.tp-world-label--family:hover,.tp-world-label--family.is-active{transform:translate(-50%,calc(-50% + 206px))}
.tp-world-label--friend{transform:translate(-50%,calc(-50% + 175px))}
.tp-world-label--friend:hover,.tp-world-label--friend.is-active{transform:translate(-50%,calc(-50% + 171px))}
@media(max-width:700px){.tp-station{padding:0;scroll-margin-top:56px}.tp-station .tp-section-title{top:-26px}.tp-station .tp-section-title h2{font-size:clamp(2.7rem,13vw,4rem)}.tp-world{width:150vw;margin-left:calc(50% - 75vw);padding-top:0}.tp-world-label{min-width:76px;padding:6px 8px;font-size:.82rem}.tp-world-label--parent{left:21.5%;top:28%}.tp-world-label--lover{left:80%;right:auto;top:28%}.tp-world-label--friend{left:21.5%;top:69%}.tp-world-label--family{left:80%;right:auto;top:69%}}

/* Crop only the bottom 10% of the desktop hero; preserve artwork and product coordinates. */
@media(min-width:769px){
  .tp-hero{aspect-ratio:1672/846.9}
  .tp-hero-background,.tp-hero-layout{height:111.111%}
  .tp-hero-layout{align-self:flex-start}
}

/* Screen 3: APP input -> IP understanding -> TimePal expression. */
.tp-flow .tp-section-title{max-width:1100px}
.tp-flow .tp-section-title>p:last-child{margin-top:14px}
.tp-flow-grid article{min-height:470px;display:flex;flex-direction:column}
.tp-flow-grid h3{margin-top:18px}
.tp-flow-grid article>p{min-height:54px}
.tp-flow-grid .tp-flow-art{height:150px;flex:none}
.tp-flow-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:18px}
.tp-flow-tags i,.tp-flow-summary span i{font-style:normal;font-size:.72rem;color:#e6d5fb;padding:7px 10px;border:1px solid rgba(194,145,255,.32);border-radius:999px;background:rgba(122,76,185,.14)}
.tp-flow-compare{display:grid;grid-template-columns:auto 1fr;gap:7px 10px;margin-top:auto;padding:14px;border:1px solid rgba(229,151,225,.22);border-radius:15px;background:rgba(8,8,31,.5)}
.tp-flow-compare small{color:var(--tp-gold);font-size:.66rem;letter-spacing:.08em}
.tp-flow-compare em,.tp-flow-compare strong{font-style:normal;font-size:.74rem;line-height:1.5;color:#bdb3cb}
.tp-flow-compare strong{color:#f1d8f4;font-weight:500}
.tp-flow-summary{position:relative;z-index:2;margin-top:26px;padding:22px 28px;border:1px solid rgba(195,143,255,.38);border-radius:20px;background:linear-gradient(120deg,rgba(51,29,101,.62),rgba(18,14,54,.82));text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.tp-flow-summary>strong{display:block;color:#f3e6ff;font-family:var(--font-serif);font-size:clamp(1.15rem,1.8vw,1.45rem);font-weight:600}
.tp-flow-summary>span{display:flex;justify-content:center;gap:12px;margin-top:15px}
@media(max-width:700px){.tp-flow-grid article{min-height:0}.tp-flow-grid article>p{min-height:0}.tp-flow-summary{padding:20px 16px}.tp-flow-summary>span{flex-wrap:wrap}}

/* Dedicated generated artwork behind the three-step journey. */
.tp-flow{background-image:linear-gradient(180deg,#070a20 0%,rgba(7,10,32,.25) 13%,rgba(6,7,25,.2) 76%,#080b25 100%),linear-gradient(90deg,rgba(4,5,20,.18),rgba(4,5,20,.48) 28%,rgba(4,5,20,.48) 72%,rgba(4,5,20,.18)),url('../图片/产品/TimePal/bobo-flow-background-v1.png');background-size:cover;background-position:center;background-repeat:no-repeat}

/* Refined luminous process cards. */
.tp-flow-grid{gap:16px;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr) 38px minmax(0,1fr)}
.tp-flow-grid article{--flow-accent:198,155,255;position:relative;isolation:isolate;overflow:hidden;min-height:500px;padding:20px 20px 22px;border:1px solid rgba(var(--flow-accent),.48);border-radius:28px;background:linear-gradient(155deg,rgba(50,31,96,.74),rgba(9,9,32,.9) 68%);box-shadow:0 26px 70px rgba(0,0,0,.34),0 0 35px rgba(var(--flow-accent),.09),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(18px);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.tp-flow-grid article:hover{transform:translateY(-8px);border-color:rgba(var(--flow-accent),.78);box-shadow:0 34px 85px rgba(0,0,0,.4),0 0 48px rgba(var(--flow-accent),.17),inset 0 1px 0 rgba(255,255,255,.16)}
.tp-flow-grid article:before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 0%,rgba(var(--flow-accent),.24),transparent 36%),linear-gradient(180deg,rgba(255,255,255,.045),transparent 28%)}
.tp-flow-grid article:after{content:"";position:absolute;z-index:3;left:22%;right:22%;top:-1px;height:2px;background:linear-gradient(90deg,transparent,rgba(var(--flow-accent),.95),transparent);box-shadow:0 0 18px rgba(var(--flow-accent),.75)}
.tp-flow-card--app{--flow-accent:245,190,112!important}.tp-flow-card--ip{--flow-accent:214,128,255!important}.tp-flow-card--timepal{--flow-accent:151,143,255!important}
.tp-flow-grid article>span{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;min-width:64px;height:34px;padding:0 14px;border:1px solid rgba(var(--flow-accent),.62);border-radius:999px;background:rgba(var(--flow-accent),.11);color:rgb(var(--flow-accent));font-family:var(--font-sans);font-size:.82rem;font-weight:800;letter-spacing:.12em;box-shadow:inset 0 0 16px rgba(var(--flow-accent),.08),0 0 18px rgba(var(--flow-accent),.1)}
.tp-flow-grid .tp-flow-art{height:172px;margin:16px 0 18px;border:1px solid rgba(var(--flow-accent),.3);border-radius:19px;background:#090a25;box-shadow:inset 0 0 30px rgba(6,4,24,.3),0 14px 30px rgba(0,0,0,.2)}
.tp-flow-grid .tp-flow-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 58%,rgba(6,6,25,.5)),linear-gradient(120deg,rgba(255,255,255,.08),transparent 30%)}
.tp-flow-grid .tp-flow-art img{transform:scale(1.025);transition:transform .55s ease,filter .55s ease;mix-blend-mode:normal;filter:saturate(.92) brightness(.82)}
.tp-flow-grid article:hover .tp-flow-art img{transform:scale(1.07);filter:saturate(1.08) brightness(.92)}
.tp-flow-grid h3{margin:0;color:#f7edff;font-family:var(--font-serif);font-size:1.52rem;font-weight:600;letter-spacing:.02em}
.tp-flow-grid article>p{min-height:58px;margin-top:8px;color:rgba(231,222,243,.68);font-size:.9rem;line-height:1.65}
.tp-flow-grid>b{position:relative;z-index:3;display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(207,157,255,.46);border-radius:50%;background:rgba(39,22,76,.78);color:#e3b9ff;font-size:1.8rem;line-height:1;box-shadow:0 0 24px rgba(184,123,255,.25),inset 0 0 15px rgba(199,145,255,.12)}
.tp-flow-grid>b:before,.tp-flow-grid>b:after{content:"";position:absolute;top:50%;width:16px;height:1px;background:linear-gradient(90deg,transparent,rgba(213,165,255,.72))}.tp-flow-grid>b:before{right:100%}.tp-flow-grid>b:after{left:100%;transform:rotate(180deg)}
.tp-flow-tags{gap:6px;padding-top:16px}.tp-flow-tags i{flex:1;min-width:max-content;text-align:center;border-color:rgba(var(--flow-accent),.3);background:rgba(var(--flow-accent),.09);color:rgba(242,231,255,.84)}
.tp-flow-compare{border-color:rgba(var(--flow-accent),.3);background:linear-gradient(145deg,rgba(15,12,43,.82),rgba(var(--flow-accent),.07));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
@media(max-width:700px){.tp-flow-grid article{min-height:0;padding:18px;border-radius:23px}.tp-flow-grid .tp-flow-art{height:165px}.tp-flow-grid>b{margin:12px auto}}

/* One continuous journey stage instead of three boxed feature cards. */
.tp-flow-grid{position:relative;isolation:isolate;gap:0;grid-template-columns:minmax(0,1fr) 52px minmax(0,1.06fr) 52px minmax(0,1fr);padding:28px 24px 30px;border:1px solid rgba(190,148,244,.24);border-radius:38px;background:linear-gradient(145deg,rgba(19,14,55,.58),rgba(5,7,28,.76));box-shadow:0 36px 90px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(16px)}
.tp-flow-grid:before{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at 50% 42%,rgba(152,86,230,.17),transparent 30%),linear-gradient(90deg,rgba(245,190,112,.055),transparent 28%,transparent 72%,rgba(151,143,255,.065))}
.tp-flow-grid article,.tp-flow-grid article:hover{min-height:390px;padding:8px 14px 4px;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;transform:none}
.tp-flow-grid article:before,.tp-flow-grid article:after{display:none}
.tp-flow-grid article>span{align-self:center;height:32px;min-width:0;padding:0 14px;border-color:rgba(var(--flow-accent),.4);background:rgba(7,8,29,.58);font-size:.7rem;letter-spacing:.08em;box-shadow:0 0 24px rgba(var(--flow-accent),.11)}
.tp-flow-grid .tp-flow-art{width:100%;height:190px;margin:18px 0 20px;border:0;border-radius:22px;background:transparent;box-shadow:none}
.tp-flow-grid .tp-flow-art:after{background:linear-gradient(180deg,transparent 54%,rgba(7,8,30,.72) 100%),radial-gradient(ellipse at center,transparent 46%,rgba(7,8,30,.24) 100%)}
.tp-flow-grid .tp-flow-art img,.tp-flow-grid article:hover .tp-flow-art img{transform:scale(1.03);filter:saturate(.9) brightness(.82)}
.tp-flow-grid h3{max-width:280px;margin:0 auto;color:#f4e7ff;font-size:clamp(1.28rem,1.8vw,1.62rem);line-height:1.25;text-align:center}
.tp-flow-grid article>p{min-height:0;max-width:285px;margin:11px auto 0;color:rgba(231,222,243,.68);font-size:.88rem;line-height:1.72;text-align:center}
.tp-flow-grid>b{align-self:center;width:34px;height:34px;border-color:rgba(203,158,255,.28);background:rgba(12,11,43,.5);font-size:1.45rem;box-shadow:0 0 30px rgba(184,123,255,.16)}
.tp-flow-grid>b:before,.tp-flow-grid>b:after{width:26px;opacity:.56}
.tp-flow-summary{width:min(860px,calc(100% - 60px));margin:-1px auto 0;padding:19px 28px;border-top:0;border-radius:0 0 24px 24px;background:linear-gradient(90deg,rgba(25,16,65,.82),rgba(63,33,98,.86),rgba(25,16,65,.82));box-shadow:0 22px 50px rgba(0,0,0,.22)}
.tp-flow-summary>strong{font-size:clamp(1rem,1.55vw,1.24rem);letter-spacing:.015em}
@media(max-width:700px){.tp-flow-grid{display:block;padding:22px 14px;border-radius:28px}.tp-flow-grid article,.tp-flow-grid article:hover{min-height:0;padding:8px 4px 28px}.tp-flow-grid .tp-flow-art{height:190px}.tp-flow-grid>b{margin:0 auto 24px;transform:rotate(90deg)}.tp-flow-summary{width:calc(100% - 30px);padding:17px 15px}}

/* Explanatory detail layer: clear enough to understand the whole mechanism at a glance. */
.tp-flow-grid{align-items:stretch}
.tp-flow-grid article,.tp-flow-grid article:hover{min-height:0}
.tp-flow-grid .tp-flow-art{height:176px}
.tp-flow-detail-list{display:grid;gap:8px;margin-top:18px;padding-top:0}
.tp-flow-detail-list>div{position:relative;padding:10px 11px 10px 40px;border:1px solid rgba(var(--flow-accent),.2);border-radius:13px;background:linear-gradient(110deg,rgba(var(--flow-accent),.1),rgba(6,7,28,.42))}
.tp-flow-detail-list>div:before{content:"";position:absolute;left:15px;top:15px;width:10px;height:10px;border:2px solid rgba(var(--flow-accent),.86);border-radius:50%;box-shadow:0 0 12px rgba(var(--flow-accent),.42)}
.tp-flow-detail-list b,.tp-flow-detail-list small{display:block}.tp-flow-detail-list b{color:#f3e8ff;font-size:.78rem;font-weight:600}.tp-flow-detail-list small{margin-top:3px;color:rgba(220,210,235,.58);font-size:.68rem;line-height:1.45}
.tp-flow-transform{display:grid;grid-template-columns:1fr;gap:7px;margin-top:18px;padding-top:0}
.tp-flow-transform>div{padding:11px 12px;border:1px solid rgba(var(--flow-accent),.22);border-radius:13px;background:rgba(7,7,29,.5)}
.tp-flow-transform>div:last-child{background:linear-gradient(120deg,rgba(var(--flow-accent),.14),rgba(7,7,29,.5));box-shadow:inset 0 0 20px rgba(var(--flow-accent),.06)}
.tp-flow-transform small{display:block;margin-bottom:4px;color:rgb(var(--flow-accent));font-size:.64rem;font-weight:700;letter-spacing:.1em}.tp-flow-transform p{margin:0;color:rgba(239,229,246,.72);font-size:.72rem;line-height:1.52}.tp-flow-transform i{height:12px;color:rgba(var(--flow-accent),.75);font-size:.9rem;font-style:normal;line-height:12px;text-align:center;transform:rotate(90deg)}
@media(max-width:700px){.tp-flow-grid article,.tp-flow-grid article:hover{min-height:0}.tp-flow-detail-list,.tp-flow-transform{margin-top:18px}.tp-flow-grid .tp-flow-art{height:190px}}