@font-face{font-family:"Noto Sans HK";src:url("/assets/noto-sans-hk-site.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:"Noto Sans TC";src:url("/assets/noto-sans-tc-site.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Inter;src:url("/assets/inter-site.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
:root{--ink:#101b32;--muted:#5b6577;--blue:#109df2;--blue2:#126fe9;--yellow:#ffe026;--cream:#fff9ee;--border:#e5edf5;--shadow:0 15px 48px rgba(24,50,85,.11);--radius:25px;--font-tc:"Noto Sans TC","Noto Sans CJK TC","PingFang TC","Microsoft JhengHei UI","Microsoft JhengHei","Heiti TC",sans-serif;--font-hk:"Noto Sans HK","Noto Sans CJK HK","PingFang HK","Microsoft JhengHei UI","Microsoft JhengHei","Heiti TC",sans-serif;--font-en:Inter,"Helvetica Neue",Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}html[data-region="tw"][lang^="zh"] body{font-family:var(--font-tc)}html[data-region="hk"][lang^="zh"] body,html[data-region="mo"][lang^="zh"] body{font-family:var(--font-hk)}html[lang="en"] body{font-family:var(--font-en)}body{margin:0;color:var(--ink);background:#fff;font-size:16px;line-height:1.6;font-family:var(--font-hk);-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}svg{display:block}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #ea9b00;outline-offset:3px}.container{width:min(1280px,calc(100% - 72px));margin-inline:auto}.skip-link{position:fixed;top:-100px;left:16px;z-index:120;background:#fff;padding:8px 14px;border-radius:8px}.skip-link:focus{top:10px}.site-header{height:80px;position:relative;background:rgba(255,255,255,.97);z-index:40;box-shadow:0 1px 10px rgba(10,51,92,.07)}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:18px}.logo-link{display:block;flex:none;width:158px}.logo-link img{width:100%;height:auto;max-height:70px;object-fit:contain}.desktop-nav{display:flex;align-items:center;gap:26px;white-space:nowrap;margin-inline:auto}.nav-item{font-size:14px;font-weight:700;padding:27px 1px 22px;position:relative}.nav-item:after{content:"";position:absolute;height:3px;border-radius:3px;left:0;right:0;bottom:18px;background:var(--blue);transform:scaleX(0);transition:transform .2s}.nav-item.active{color:var(--blue2)}.nav-item.active:after,.nav-item:hover:after{transform:scaleX(1)}.header-actions{display:flex;align-items:center;gap:14px}.region-group{border:1px solid #e9edf1;border-radius:99px;padding:4px;display:flex;gap:2px;box-shadow:0 3px 12px rgba(0,0,0,.025)}.region-button{border:0;border-radius:99px;background:transparent;display:flex;align-items:center;gap:5px;padding:5px 7px;font-size:12px;font-weight:700;color:#303748}.region-button:hover,.region-button.selected{background:#eff8ff}.r-dot{display:grid;place-items:center;font-size:13px;font-weight:800;border-radius:50%;color:white;width:22px;height:22px}.r-dot.hk{background:#ed2942}.r-dot.tw{background:#ee4453}.r-dot.mo{background:#168a61}.lang-wrap{position:relative}.lang-toggle{border:1px solid #e8ebf1;border-radius:50px;padding:9px 13px;background:#fff;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700;white-space:nowrap}.caret{border:solid #293249;border-width:0 1.5px 1.5px 0;padding:3px;transform:rotate(45deg) translateY(-2px)}.lang-pop{position:absolute;top:46px;right:0;background:white;box-shadow:var(--shadow);border:1px solid var(--border);border-radius:12px;padding:6px;min-width:118px;z-index:100}.lang-pop[hidden]{display:none}.lang-pop button{border:0;background:transparent;width:100%;padding:9px;text-align:left;border-radius:7px;white-space:nowrap;font-size:13px}.lang-pop button:hover,.lang-pop button.selected{background:#eff7ff}.mobile-toggle{display:none;flex:none;width:43px;height:43px;border-radius:12px;border:1px solid var(--border);background:#fff;padding:11px;align-content:center;gap:5px}.mobile-toggle i{display:block;background:#1c3b5c;width:100%;height:2px;border-radius:2px}.mobile-panel[hidden]{display:none}.mobile-panel{position:absolute;top:80px;left:0;right:0;background:#fff;box-shadow:0 16px 25px rgba(0,0,0,.09);padding:16px 26px 24px}.mobile-links{display:grid;gap:2px}.mobile-links a{padding:12px 9px;font-weight:700;border-bottom:1px solid #f0f2f4}.mobile-links a.active{color:var(--blue2)}.mobile-selects{margin-top:16px;display:grid;gap:14px}.mobile-region-group,.mobile-langs{display:flex;gap:7px}.mobile-region-group button,.mobile-langs button{border:1px solid var(--border);border-radius:14px;background:#fff;padding:9px 13px;font-weight:700;font-size:13px}.mobile-region-group button.selected,.mobile-langs button.selected{background:#e6f6ff;border-color:#8bd2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;border:0;border-radius:50px;padding:15px 24px;font-size:15px;line-height:1.2;font-weight:900;box-shadow:0 7px 16px rgba(0,0,0,.07);transition:transform .2s,box-shadow .2s;white-space:nowrap}.btn:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,0,0,.14)}.btn-yellow{background:var(--yellow);color:#142035}.btn-blue{background:var(--blue2);color:#fff}.btn-white{background:white;color:var(--blue2)}.btn-line{border:1px solid #94cffa;background:#fff;color:#1179d5;box-shadow:none}.btn-small{padding:11px 18px;font-size:13px}.home-hero{min-height:514px;position:relative;background:linear-gradient(105deg,#37a9f3 3%,#7fccff 60%,#d9f4ff);isolation:isolate;overflow:hidden}.home-hero::after{content:"";position:absolute;inset:auto 0 0;height:31%;background:linear-gradient(0deg,rgba(222,244,255,.22),transparent);pointer-events:none}.hero-photo{position:absolute;left:0;top:0;bottom:0;width:58%;background-image:url('assets/hero-characters.png');background-size:cover;background-position:50% 52%;-webkit-mask-image:linear-gradient(90deg,black 0%,black 78%,transparent 100%);mask-image:linear-gradient(90deg,black 0%,black 78%,transparent 100%)}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:55% 45%;min-height:514px;align-items:center}.hero-copy{grid-column:2;padding:40px 0 45px 10px;position:relative}.hero-copy h1{font-size:clamp(46px,5.25vw,78px);font-weight:950;letter-spacing:-.06em;line-height:1.18;margin:0 0 19px;color:#0a1232;text-shadow:0 2px #ffffff85}.hero-copy h1 span{display:block}.hero-line2{position:relative;width:max-content;max-width:100%}.hero-line2:after{content:"";position:absolute;left:5%;bottom:-6px;background:var(--yellow);height:8px;width:90%;border-radius:80% 30% 60% 30%;transform:rotate(-2deg)}.hero-copy p{font-size:16px;color:#23394e;font-weight:600;margin:24px 0 28px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap}.hero-copy .btn{font-size:15px;padding:17px 22px}.hero-dec{position:absolute;font-weight:900;font-size:44px;color:#ffe132;right:-35px;top:26px;transform:rotate(22deg)}.hero-tail{position:absolute;bottom:0;left:0;right:0;z-index:2;height:18px;background:white;border-radius:52% 52% 0 0/40px 40px 0 0}.home-main{padding:26px 0 0}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.feature-card{position:relative;min-height:264px;overflow:hidden;border-radius:23px;padding:25px;isolation:isolate;display:block;transition:transform .22s,box-shadow .22s}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.feature-card h2{font-size:clamp(25px,2.5vw,31px);font-weight:900;letter-spacing:-.04em;margin:0 0 6px;line-height:1.25;position:relative;z-index:2}.feature-card p{margin:0;position:relative;z-index:2;font-size:14px;font-weight:600;max-width:180px}.feature-card .circle-arrow{position:absolute;bottom:22px;left:24px;width:39px;height:39px;border-radius:50%;background:white;display:grid;place-items:center;box-shadow:0 3px 8px #0001;z-index:3;color:#186ee2}.feature-card img{position:absolute;right:-20%;bottom:0;width:88%;height:94%;object-fit:contain;object-position:bottom right;z-index:1;filter:drop-shadow(0 4px 6px #0001)}.feature-card.licensing{background:linear-gradient(120deg,#d9f1ff 0%,#84cfff 100%)}.feature-card.shop{background:linear-gradient(110deg,#fff2b1,#ffe09a)}.feature-card.shop img{width:122%;max-width:none;object-fit:cover;right:-42%;height:100%}.feature-card.about{background:linear-gradient(125deg,#ffe0d9,#f7b4c1)}.feature-card.about img{width:94%;right:-31%;bottom:-13%}.home-explore{margin-top:38px;border-top:1px solid #edf1f5;padding:24px 0 36px;display:grid;grid-template-columns:1.1fr .9fr;gap:36px}.peek-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}.peek-heading h2{font-size:23px;letter-spacing:-.04em;margin:0;font-weight:900}.more-link{font-size:13px;font-weight:800;color:#087ad7;white-space:nowrap}.face-row{display:flex;gap:12px;justify-content:space-between}.face-link{min-width:0;flex:1;display:grid;justify-items:center;gap:5px;font-size:13px;font-weight:800}.face-circle{border-radius:50%;background:#fff5c1;display:grid;place-items:center;overflow:hidden;width:min(100%,107px);aspect-ratio:1}.face-link:nth-child(2) .face-circle{background:#ffd8dc}.face-link:nth-child(3) .face-circle{background:#ffe7f1}.face-link:nth-child(4) .face-circle{background:#d7f3d5}.face-link:nth-child(5) .face-circle{background:#e7dffd}.face-circle img{width:91%;height:105%;object-fit:contain;object-position:bottom;transition:transform .25s}.face-link:hover .face-circle img{transform:scale(1.08)}.video-peek{display:flex;gap:11px}.video-teaser{border:0;padding:0;background:transparent;position:relative;overflow:hidden;border-radius:13px;width:60%;aspect-ratio:16/9}.video-teaser:last-child{width:40%}.video-teaser img{width:100%;height:100%;object-fit:cover}.play-round{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#0b203db3;color:#fff;border-radius:50%;width:43px;height:43px;display:grid;place-items:center;font-size:16px;padding-left:3px}.video-teaser .muted-overlay{position:absolute;bottom:7px;right:8px;background:#102337bc;color:white;border-radius:6px;padding:2px 7px;font-size:11px}.page-banner{background:#eaf7ff;padding:55px 0 58px;position:relative;overflow:hidden}.page-banner.licensing-theme{background:linear-gradient(100deg,#e0f3ff,#bce5ff)}.page-banner.shop-theme{background:linear-gradient(100deg,#fff7ce,#ffe6a6)}.page-banner.about-theme{background:linear-gradient(100deg,#ffe7e2,#fff3eb)}.page-banner h1{font-weight:900;font-size:clamp(35px,5vw,61px);margin:0 0 13px;letter-spacing:-.04em;line-height:1.22}.page-banner p{max-width:610px;margin:0;color:#40516b;font-size:16px}.page-banner .container{position:relative;z-index:2}.page-banner .banner-art{position:absolute;right:6%;top:-14%;width:min(41%,520px);height:140%;object-fit:contain;opacity:.98}.page-section{padding:56px 0 72px}.section-h{font-size:clamp(25px,3.5vw,36px);font-weight:900;letter-spacing:-.04em;margin:0 0 15px}.lead{color:var(--muted);font-size:16px;max-width:760px;margin:0 0 25px}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category{padding:25px 20px;background:#fff;border:1px solid var(--border);border-radius:18px;min-height:154px}.category .emoji{font-size:27px}.category h3{margin:10px 0 8px;font-size:18px}.category p{font-size:14px;color:#667284;margin:0}.category.shop-cat{background:#fffaf0}.simple-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0 10px}.step{border-top:3px solid var(--yellow);padding:18px 0}.step span{font-size:13px;font-weight:900;color:#099bda}.step h3{font-size:20px;margin:4px 0 8px}.step p{color:#6a7789;font-size:14px;margin:0}.callout{background:linear-gradient(115deg,#168ff0,#0c6fdc);padding:32px 35px;border-radius:25px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:35px}.callout h2{font-size:24px;margin:0 0 6px}.callout p{margin:0;opacity:.9;font-size:14px}.about-split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:46px}.about-split img{width:100%;border-radius:28px}.about-split p{font-size:17px;line-height:1.92;color:#4b5769}.about-split strong{color:var(--ink)}.note{font-size:13px;color:#627084}.shop-hero-image{width:100%;max-height:345px;object-fit:cover;border-radius:24px;margin:18px 0}.product-categories{margin-top:26px}.coming-banner{display:flex;align-items:center;gap:9px;padding:16px 18px;border-radius:15px;background:#fff7da;border:1px solid #ffe69a;width:max-content;max-width:100%;font-weight:800}.characters-page-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.character-tile{border:1px solid var(--border);border-radius:20px;background:#fff;overflow:hidden;min-width:0;cursor:pointer;text-align:left;padding:0}.character-tile:hover{box-shadow:var(--shadow)}.character-tile .photo{display:grid;place-items:end center;height:215px;background:#fff4c9;overflow:hidden}.character-tile:nth-child(2) .photo{background:#ffd9dc}.character-tile:nth-child(3) .photo{background:#fbe3e9}.character-tile:nth-child(4) .photo{background:#dff4db}.character-tile:nth-child(5) .photo{background:#e9e6fc}.character-tile .photo img{height:98%;width:94%;object-fit:contain;object-position:bottom}.character-tile .tile-text{padding:17px}.character-tile h3{font-size:21px;margin:0 0 8px}.character-tile p{font-size:13px;color:#626c7c;margin:0}.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:19px}.video-card{border:1px solid var(--border);border-radius:18px;background:white;overflow:hidden;text-align:left;padding:0}.video-card img{aspect-ratio:16/10;object-fit:cover;width:100%}.video-thumb{position:relative}.video-card .meta{padding:13px}.video-card h3{margin:0 0 5px;font-size:15px}.video-card p{margin:0;font-size:12px;color:var(--muted)}.badge{position:absolute;right:8px;top:8px;background:#ffffffec;color:#23344b;border-radius:50px;padding:2px 9px;font-size:11px;font-weight:800}.contact-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px}.contact-help{padding:25px;background:#eaf6ff;border-radius:22px}.contact-help h2{margin-top:0}.contact-help p{color:var(--muted)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px;margin-bottom:15px;font-size:13px;font-weight:800}.field input,.field textarea,.field select{border:1px solid #d6e0eb;border-radius:11px;outline:0;padding:13px;font-size:15px;background:#fff;color:var(--ink);width:100%;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--blue)}.form-info{padding:12px 15px;background:#fffbeb;border-radius:11px;font-size:13px;color:#7a642d;margin:0 0 17px}.form-feedback{font-weight:700;color:#1664a1;font-size:14px}.site-footer{background:#0f9ef4;color:#fff;margin-top:0;padding:24px 0 16px}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:30px}.footer-brand img{width:136px;filter:drop-shadow(0 1px 0 #fff1)}.footer-top nav{display:flex;gap:21px;flex-wrap:wrap}.footer-top nav a{font-size:13px;font-weight:700}.footer-top nav a:hover{text-decoration:underline}.footer-region{font-size:13px;white-space:nowrap;display:flex;align-items:center;gap:7px}.footer-dot{width:10px;height:10px;background:#fff;border-radius:50%}.footer-bottom{display:flex;gap:18px;align-items:center;justify-content:space-between;font-size:11px;opacity:.85;margin-top:20px;border-top:1px solid #ffffff40;padding-top:11px}.modal{max-width:min(760px,calc(100% - 30px));width:100%;border:0;border-radius:25px;box-shadow:0 25px 80px #16344a8a;padding:28px;background:#fff}.modal::backdrop{background:#07162cc7}.modal-close{position:absolute;z-index:2;right:16px;top:12px;width:38px;height:38px;border-radius:50%;border:1px solid #e7e7e7;background:#fff;font-size:25px}.modal-content{display:grid;grid-template-columns:240px 1fr;gap:20px;align-items:center}.modal-content img{height:260px;width:100%;object-fit:contain;background:#f8f4ec;border-radius:17px}.modal-content h2{font-size:30px;margin:0 0 13px}.modal-content p{color:#506174;margin:0}@media(min-width:1500px){.home-hero,.hero-grid{min-height:580px}.hero-photo{width:55%}}@media(max-width:1190px){.container{width:min(1160px,calc(100% - 48px))}.site-header{height:74px}.logo-link{width:132px}.desktop-nav{gap:15px}.nav-item{font-size:13px;padding-inline:0}.header-actions{gap:8px}.region-button{padding:4px}.region-button .r-label{display:none}.lang-toggle{padding:8px;font-size:11px}.hero-photo{width:62%}.hero-grid{grid-template-columns:52% 48%}}@media(max-width:980px){.desktop-nav,.header-actions{display:none}.mobile-toggle{display:grid}.site-header{height:73px}.mobile-panel{top:73px}.home-hero,.hero-grid{min-height:480px}.hero-photo{width:59%}.hero-copy h1{font-size:clamp(40px,5vw,64px)}.hero-actions .btn{font-size:13px;padding:14px}.feature-card{min-height:230px;padding:19px}.feature-card h2{font-size:24px}.home-explore{grid-template-columns:1fr;gap:24px}.video-peek{max-width:640px}.characters-page-grid{grid-template-columns:repeat(3,1fr)}.category-grid,.video-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.container{width:calc(100% - 34px)}.site-header{height:65px}.logo-link{width:115px}.mobile-panel{top:65px}.home-hero{min-height:650px;background:linear-gradient(#86ccfb,#c6ebff)}.hero-photo{width:100%;height:360px;top:0;bottom:auto;background-size:cover;background-position:50% 45%;mask-image:linear-gradient(180deg,black 0%,black 80%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,black 0%,black 80%,transparent 100%)}.hero-grid{display:flex;min-height:650px;align-items:end;justify-content:center}.hero-copy{text-align:center;width:100%;padding:0 0 45px;align-self:end}.hero-copy h1{font-size:clamp(39px,10.2vw,55px);line-height:1.17;margin-bottom:8px}.hero-line2{margin-inline:auto}.hero-copy p{font-size:13px;margin:20px 0 18px}.hero-actions{justify-content:center;gap:9px}.hero-actions .btn{font-size:12px;padding:13px 14px;white-space:normal}.hero-dec{display:none}.hero-tail{height:12px}.home-main{padding-top:17px}.feature-grid{grid-template-columns:1fr;gap:13px}.feature-card{min-height:180px;padding:22px}.feature-card h2{font-size:25px}.feature-card img{height:110%;width:60%;right:-8%}.feature-card.shop img{width:78%;right:-20%;height:100%}.feature-card.about img{width:72%;right:-16%;bottom:-28%}.feature-card .circle-arrow{bottom:19px;left:20px;width:34px;height:34px}.home-explore{margin-top:24px;padding-top:19px;gap:28px}.peek-heading h2{font-size:20px}.face-row{gap:6px}.face-link{font-size:11px}.video-peek{gap:8px}.video-teaser{width:56%}.video-teaser:last-child{width:44%}.play-round{width:36px;height:36px;font-size:14px}.page-banner{padding:39px 0 36px;min-height:200px}.page-banner h1{font-size:38px}.page-banner p{font-size:14px;max-width:75%}.page-banner .banner-art{right:-10%;width:61%;opacity:.67}.page-section{padding:34px 0 50px}.section-h{font-size:26px}.about-split{grid-template-columns:1fr;gap:22px}.about-split p{font-size:15px}.simple-steps,.category-grid{grid-template-columns:1fr}.simple-steps{gap:5px}.category{min-height:auto}.callout{flex-direction:column;align-items:start;padding:23px}.characters-page-grid{grid-template-columns:repeat(2,1fr);gap:12px}.character-tile .photo{height:160px}.character-tile .tile-text{padding:12px}.character-tile h3{font-size:18px}.video-grid{grid-template-columns:1fr 1fr;gap:11px}.video-card .meta{padding:10px}.video-card h3{font-size:13px}.contact-wrap{grid-template-columns:1fr;gap:17px}.field-grid{grid-template-columns:1fr;gap:0}.footer-top{flex-direction:column;align-items:start;gap:14px}.footer-top nav{gap:11px 17px}.footer-bottom{flex-wrap:wrap;gap:7px}.modal{padding:16px 15px}.modal-content{grid-template-columns:1fr;text-align:center}.modal-content img{height:180px}.modal-content h2{font-size:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
/* V1.3 visual polish: seamless artwork cards and expressive character crops */
.feature-card img{top:0;right:0;bottom:auto;width:100%;height:100%;object-fit:cover;object-position:68% center;filter:none;-webkit-mask-image:linear-gradient(90deg,transparent 2%,transparent 31%,#000 85%);mask-image:linear-gradient(90deg,transparent 2%,transparent 31%,#000 85%)}
.feature-card.licensing img{width:100%;height:100%;object-fit:cover;right:0;object-position:60% 50%}
.feature-card.shop img{width:100%;height:100%;right:0;object-fit:cover;object-position:58% 51%}
.feature-card.about img{width:100%;height:100%;right:0;bottom:auto;object-fit:cover;object-position:44% 58%}
.face-circle img{width:95%;height:155%;object-fit:contain;object-position:center center;transform:translateY(-13%)}
.face-link:hover .face-circle img{transform:translateY(-13%) scale(1.08)}
@media(max-width:680px){.feature-card img,.feature-card.licensing img,.feature-card.shop img,.feature-card.about img{width:100%;height:100%;right:0;bottom:auto;object-fit:cover;object-position:center center}}

/* 繁體字形強制約束：表單、彈出視窗、選單、按鈕都遵循頁面地區字型。 */
html[lang^="zh"] :is(input,textarea,select,option,button,dialog){font-family:inherit}
html[lang^="zh"]{font-kerning:normal;text-rendering:optimizeLegibility}
/* V1.3.3 character fidelity: natural aspect ratios, no enlargement/cropping of silhouettes. */
.face-circle{padding:6px;overflow:visible;}
.face-circle img,.face-link:hover .face-circle img{
  width:auto!important;height:auto!important;max-width:90%!important;max-height:90%!important;
  object-fit:contain!important;object-position:center center!important;
  transform:none!important;aspect-ratio:auto!important;filter:none!important;
}

.character-tile .photo img{
  width:auto!important;height:auto!important;max-width:91%!important;max-height:94%!important;
  object-fit:contain!important;object-position:center bottom!important;aspect-ratio:auto!important;
}
.modal-content img{
  width:100%;height:260px;object-fit:contain!important;aspect-ratio:auto!important;padding:14px;
}
.page-banner .banner-art{object-fit:contain!important;object-position:bottom right;}
/* Show original-pixel artwork without stretching or stretching-like interactive transforms. */
.feature-card img{object-fit:cover;transform:none!important;}
@media(max-width:680px){.modal-content img{height:210px}}

/* V1.3.4: User-supplied HD Red & Yellow artwork, never stretched or AI-redrawn. */
.home-hero{background:linear-gradient(112deg,#38b3f8 0%,#99ddff 70%,#ddf5ff 100%)}
.hero-photo{background-image:url('assets/hero-characters.png');background-size:contain;background-repeat:no-repeat;background-position:center bottom;-webkit-mask-image:none;mask-image:none;left:0;top:0;bottom:0;width:55%}
.feature-card img{object-fit:contain;object-position:right center;filter:none}
.feature-card.licensing img{width:72%;height:100%;right:0;top:0;object-fit:contain;object-position:right bottom;-webkit-mask-image:none;mask-image:none}
.feature-card.shop img,.feature-card.about img{width:82%;height:100%;right:0;top:0;object-fit:contain;object-position:right center;-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 38%);mask-image:linear-gradient(90deg,transparent 0%,black 38%)}
.feature-card.shop,.feature-card.about{isolation:isolate}
.face-circle{overflow:hidden!important}
.face-circle img,.face-link:hover .face-circle img{width:auto!important;height:auto!important;max-width:90%!important;max-height:95%!important;object-fit:contain!important;transform:none!important}
.character-tile .photo img{object-fit:contain;object-position:center bottom;width:auto;max-width:92%;height:auto;max-height:94%}
.video-teaser img,.video-card img{object-fit:contain;background:#fff}
.shop-hero-image{object-fit:contain!important;max-height:440px;background:#fff;border:1px solid #edf2f7}
.about-split img{object-fit:contain;background:white;max-height:540px}
@media(max-width:980px){.hero-photo{width:56%;background-size:contain;background-position:center bottom}}
@media(max-width:680px){.home-hero{background:linear-gradient(#75cbfc,#cbecff);min-height:660px}.hero-photo{width:100%;height:357px;top:0;bottom:auto;background-size:contain;background-position:center bottom;-webkit-mask-image:none;mask-image:none}.hero-grid{min-height:660px}.feature-card.licensing img{width:64%;height:105%;right:-5%;object-fit:contain}.feature-card.shop img,.feature-card.about img{width:71%;height:100%;right:-8%;object-fit:contain}.character-tile .photo img{max-width:96%;max-height:96%}}

/* FINAL fidelity policy: show untouched original white-background artwork.
   Automatic background removal would mistakenly erase character eyes. */
.home-hero{background:linear-gradient(90deg,#fff 0%,#fff 50%,#bde9ff 100%)}
.hero-photo{background-image:url('assets/provided-scene-1.jpg')!important;left:0;width:58%;top:0;bottom:0;background-size:contain;background-repeat:no-repeat;background-position:left center;-webkit-mask-image:linear-gradient(90deg,black 0%,black 82%,transparent 100%);mask-image:linear-gradient(90deg,black 0%,black 82%,transparent 100%)}
.feature-card.licensing{background:linear-gradient(100deg,#d9f1ff,#eef9ff)}
.feature-card.licensing img{width:67%;height:100%;right:0;top:0;object-fit:contain;object-position:right center;-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 43%);mask-image:linear-gradient(90deg,transparent 0%,black 43%)}
.feature-card.shop{background:linear-gradient(100deg,#fff0aa,#fff8df)}
.feature-card.about{background:linear-gradient(100deg,#ffe9e3,#fff5f4)}
.face-link:nth-child(1) .face-circle,.face-link:nth-child(2) .face-circle{background:white;border:1px solid #e8ecf0}
.face-circle img{max-width:100%!important;max-height:95%!important;object-fit:contain!important}
.character-tile:nth-child(1) .photo,.character-tile:nth-child(2) .photo{background:white}
@media(max-width:680px){.home-hero{background:linear-gradient(180deg,#fff 0%,#fff 47%,#d0efff 72%,#d0efff 100%)}.hero-photo{width:100%;height:350px;background-image:url('assets/provided-scene-1.jpg')!important;background-size:contain;background-position:center top;-webkit-mask-image:linear-gradient(180deg,black 0%,black 84%,transparent 100%);mask-image:linear-gradient(180deg,black 0%,black 84%,transparent 100%)}}

/* V1.3.5 — clear offline draft actions and accessible video preview */
.enquiry-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.enquiry-actions .btn{flex:0 1 auto}

.video-card .video-thumb{display:block;position:relative}
.video-card .play-round{color:white}
@media(max-width:680px){.enquiry-actions{display:grid;grid-template-columns:1fr}.enquiry-actions .btn{width:100%}}

/* Protect complete character silhouettes in small merchandising teasers */
@media(max-width:680px){.feature-card.shop img{right:0!important;width:65%!important;height:100%!important;object-fit:contain!important;object-position:right center!important}}

.photo-pending{display:grid;place-items:center;width:100%;height:100%;padding:18px;color:var(--muted);font-size:13px;font-weight:700;text-align:center;line-height:1.5;background:linear-gradient(135deg,#f8faff,#edf5ff)}.character-tile:disabled{cursor:default;opacity:1}.character-tile:disabled:hover{box-shadow:none}

/* Homepage visual direction: sky, confident two-tone headline, clear CTAs and broad cards. */
.site-header{background:linear-gradient(105deg,#75cfff,#b7e8ff);box-shadow:none}
.nav-item{color:#072d62}
.nav-item.active{color:#075dd0}
.region-group{background:#ffffffa8;border-color:#ffffffb8;box-shadow:none}
.lang-toggle{background:#ffffffd9;border-color:#ffffff}
.home-hero{min-height:500px;background:
  radial-gradient(ellipse at 19% 46%,#fff 0 4%,#ffffffd9 9%,transparent 20%),
  radial-gradient(ellipse at 57% 21%,#fff 0 2.5%,#ffffffc9 7%,transparent 16%),
  linear-gradient(180deg,#55b9f7 0%,#b6e6ff 75%,#edfaff 100%)}
.home-hero::before{content:"";position:absolute;z-index:0;left:0;right:0;bottom:0;height:31%;opacity:.36;background-repeat:no-repeat;background-image:
  linear-gradient(to top,#55a9db 0 100%,transparent 100%),
  linear-gradient(to top,#348fc9 0 100%,transparent 100%),
  linear-gradient(to top,#69b6df 0 100%,transparent 100%),
  linear-gradient(to top,#3f9bd2 0 100%,transparent 100%),
  linear-gradient(to top,#65b6e2 0 100%,transparent 100%),
  linear-gradient(to top,#358dc5 0 100%,transparent 100%),
  linear-gradient(to top,#70bee6 0 100%,transparent 100%);
  background-size:8% 64%,10% 88%,9% 55%,12% 100%,8% 70%,11% 83%,10% 60%;
  background-position:42% 100%,54% 100%,65% 100%,76% 100%,86% 100%,95% 100%,100% 100%;pointer-events:none}
.home-hero::after{height:26%;background:linear-gradient(0deg,#effaffaa,transparent)}
.hero-photo{width:58%;background-image:url('assets/provided-scene-1.jpg')!important;background-size:contain;background-position:left bottom;background-repeat:no-repeat;-webkit-mask-image:none;mask-image:none}
.hero-grid{min-height:500px;grid-template-columns:58% 42%}
.hero-copy{padding:34px 0 48px 10px}
.hero-copy h1{color:#07387e;font-size:clamp(45px,5.4vw,76px);line-height:1.14;letter-spacing:-.045em;text-shadow:0 2px 0 #ffffffb8}
.hero-line2{color:#f58300}
.hero-line2:after{height:7px;bottom:-9px}
.hero-copy p{color:#102d67;font-size:clamp(15px,1.5vw,19px);font-weight:750}
.hero-copy .btn{padding:17px 23px;font-size:16px}
.hero-dec{right:1%;top:4%;color:#ffdb00}
.hero-tail{height:22px;background:#fff;border-radius:50% 50% 0 0/22px 22px 0 0}
.home-main{padding-top:20px}
.feature-grid{gap:14px}
.feature-card{min-height:235px;border-radius:26px;padding:26px}
.feature-card h2{color:#07387e}
.feature-card.licensing{background:linear-gradient(120deg,#78cbff,#e1f5ff)}
.feature-card.shop{background:linear-gradient(110deg,#fff0c6,#ffdfa0)}
.feature-card.about{background:linear-gradient(120deg,#a3dcff,#e6f6ff)}
.feature-card .circle-arrow{left:auto;right:20px;bottom:20px;width:42px;height:42px;color:#072d62;font-size:21px}
.home-explore{margin-top:28px;border:0;border-radius:32px 32px 0 0;padding:30px 34px 36px;background:linear-gradient(180deg,#eefaff,#ccecff)}
.site-footer{position:relative;overflow:hidden;background:linear-gradient(180deg,#73c8f6,#1689d2);color:#082a58}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:24px;background:white;border-radius:0 0 50% 50%/0 0 24px 24px}
.site-footer::after{content:"";position:absolute;left:0;right:0;bottom:0;height:58%;opacity:.25;background:linear-gradient(to top,#075ca1 0 100%,transparent 100%) 4% 100%/11% 72% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 19% 100%/8% 100% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 31% 100%/12% 77% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 48% 100%/9% 94% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 64% 100%/12% 70% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 81% 100%/10% 98% no-repeat,linear-gradient(to top,#075ca1 0 100%,transparent 100%) 96% 100%/12% 78% no-repeat;pointer-events:none}
.site-footer .container{position:relative;z-index:1}
@media(max-width:980px){.hero-copy h1{font-size:clamp(42px,6vw,62px)}.hero-copy .btn{font-size:14px;padding:15px 18px}.desktop-nav{gap:15px}}
@media(max-width:680px){
  .site-header{background:#8bd3ff}
  .home-hero{min-height:690px;background:radial-gradient(ellipse at 50% 22%,#fff 0 3%,#ffffffcf 9%,transparent 23%),linear-gradient(180deg,#69c3fa 0%,#c8edff 70%,#effaff 100%)}
  .home-hero::before{height:25%;background-position:0 100%,20% 100%,40% 100%,60% 100%,80% 100%,100% 100%,100% 100%;background-size:19% 58%,18% 78%,20% 49%,18% 88%,20% 62%,18% 74%,14% 54%}
  .hero-photo{top:0;bottom:auto;left:3%;width:94%;height:365px;background-position:center bottom;background-size:contain}
  .hero-grid{min-height:690px;display:flex;align-items:flex-end;padding-bottom:46px}
  .hero-copy{width:100%;padding:0;text-align:center}
  .hero-copy h1{font-size:clamp(38px,10vw,56px);line-height:1.15;margin-bottom:14px}
  .hero-line2{margin-inline:auto}
  .hero-copy p{margin:21px 0 20px}
  .hero-actions{justify-content:center;gap:9px}
  .hero-copy .btn{font-size:13px;padding:15px 16px;gap:7px}
  .hero-dec{right:5%;top:-24px;font-size:33px}
  .feature-grid{grid-template-columns:1fr;gap:12px}
  .feature-card{min-height:188px;padding:22px}
  .feature-card h2{font-size:25px}
  .feature-card p{font-size:13px;max-width:45%}
  .feature-card.licensing img{width:59%;height:100%;right:0;object-position:right bottom}
  .feature-card.shop img,.feature-card.about img{width:61%;height:100%;right:0;object-position:right bottom}
  .home-explore{padding:25px 17px 30px}
}

/* Match the approved homepage composition: broad character stage, compact sections. */
@media(min-width:981px){
  body.is-home .home-hero,
  body.is-home .hero-grid{min-height:410px}
  body.is-home .hero-photo{width:64%;}
  body.is-home .hero-copy{padding-top:22px;padding-bottom:26px}
  body.is-home .hero-copy:before{inset:-12px -28px;background:radial-gradient(ellipse at center,rgba(255,255,255,.74) 0%,rgba(255,255,255,.45) 50%,transparent 78%)}
  body.is-home .hero-brand-mark{width:min(280px,24vw);margin:0 0 2px}
  body.is-home .hero-copy h1{font-size:clamp(48px,4.25vw,66px);line-height:1.05;margin-bottom:12px;font-weight:950;color:#10143a}
  body.is-home .hero-copy p{font-size:17px;margin:17px 0 20px}
  body.is-home .hero-copy .btn{padding:15px 23px;font-size:15px}
  body.is-home .hero-photo:before{left:8px;top:-20px;width:min(39vw,530px)}
  body.is-home .hero-photo:after{left:clamp(285px,23vw,370px);top:14px;width:min(43vw,570px);clip-path:inset(0 0 0 49%)}
  body.is-home .home-character-section{padding:14px 0 22px;margin-top:-12px}
  body.is-home .home-section-heading{margin-bottom:7px}
  body.is-home .home-kicker{display:block;color:#586779;font-size:14px;font-weight:600;margin:2px 0 0}
  body.is-home .home-character-grid{max-width:1160px;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1.1vw,16px)}
  body.is-home .home-character-card{display:flex;min-width:0;min-height:0;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:0 5px 8px}
  body.is-home .home-character-art{width:min(100%,190px);height:clamp(112px,12vw,150px);max-width:190px;margin:0 auto 1px;border-radius:50%}
  body.is-home .home-character-card strong{align-self:center;font-size:clamp(14px,1.35vw,18px);line-height:1.25}
  body.is-home .home-character-card>span:last-child{align-self:center;max-width:190px;font-size:clamp(11px,.98vw,13px);line-height:1.45}
}
@media(max-width:980px){
  body.is-home .hero-copy h1{font-weight:950;letter-spacing:-.04em}
  body.is-home .home-character-grid{max-width:760px}
}

/* Reference-led homepage composition: pair artwork left, headline/CTAs right, cards before the skyline footer. */
.home-hero{min-height:510px;background:linear-gradient(180deg,#56baf7 0%,#9cddff 70%,#eaf8ff 100%)}
.home-hero::before{content:"";position:absolute;z-index:0;left:0;right:0;bottom:0;height:33%;opacity:.62;background:url('assets/cityline.svg') center bottom/auto 100% repeat-x;pointer-events:none}
.home-hero::after{height:19%;background:linear-gradient(0deg,#d9f2ffb8,transparent)}
.hero-photo{z-index:1;left:0;top:0;bottom:0;width:63%;background-image:url('assets/provided-scene-1.jpg')!important;background-size:contain;background-position:left bottom;background-repeat:no-repeat;-webkit-mask-image:none;mask-image:none}
.hero-grid{z-index:2;min-height:510px;grid-template-columns:69% 31%;align-items:center}
.hero-copy{grid-column:2;padding:28px 0 46px 0;max-width:100%}
.hero-copy h1{font-size:clamp(46px,5.2vw,78px);line-height:1.14;margin:0 0 16px;color:#0b3880;letter-spacing:-.04em}
.hero-copy h1 .hero-line2{color:#f58000!important}
.hero-line2:after{left:7%;width:85%;height:7px;bottom:-10px}
.hero-copy p{font-size:clamp(15px,1.35vw,19px);line-height:1.45;color:#092f72;font-weight:800;margin:24px 0 24px}
.hero-actions{gap:12px;flex-wrap:nowrap}
.hero-copy .btn{padding:17px 20px;font-size:15px;gap:9px}
.hero-dec{right:5%;top:1%;font-size:42px}
.home-main{padding:18px 0 0}
.home-main>.container{width:min(1470px,calc(100% - 60px))}
.feature-grid{gap:14px}
.feature-card{min-height:238px;border-radius:26px;padding:0;background:#fff;box-shadow:0 5px 16px #154c7510}
.feature-card::before{content:"";position:absolute;inset:0 0 0 auto;width:45%;z-index:0;background:linear-gradient(135deg,#d9f1ff,#b5e4ff)}
.feature-card.licensing::before{background:linear-gradient(135deg,#d9f1ff,#83cefb)}
.feature-card.shop::before{background:linear-gradient(135deg,#fff3cf,#ffe0a3)}
.feature-card.about::before{background:linear-gradient(135deg,#d7efff,#9cdcff)}
.feature-card img{left:0;right:auto;top:0;bottom:0;width:58%;height:100%;object-fit:contain!important;object-position:left center;z-index:1;-webkit-mask-image:none;mask-image:none}
.feature-card h2,.feature-card p{position:absolute;left:61%;right:20px;width:auto;max-width:none;text-align:left}
.feature-card h2{top:29%;margin:0;font-size:clamp(22px,2vw,30px);line-height:1.25}
.feature-card p{top:48%;font-size:12.5px}
.feature-card.licensing img,.feature-card.shop img,.feature-card.about img{left:0!important;right:auto!important;width:58%!important;height:100%!important;object-fit:contain!important;object-position:left center!important}
.feature-card .circle-arrow{right:19px;left:auto;bottom:18px}
.home-explore{display:none}
.site-footer{min-height:238px;background:linear-gradient(180deg,#e8f8ff 0%,#a8ddf7 58%,#62b7e8 100%);color:#092f72}
.site-footer::before{height:23px;background:#fff;border-radius:0 0 50% 50%/0 0 23px 23px}
.site-footer::after{height:65%;opacity:.8;background:url('assets/cityline.svg') center bottom/auto 100% repeat-x}
.footer-promo{position:relative;z-index:2;text-align:center;padding:31px 16px 8px;color:#092f72;font-size:clamp(26px,3vw,42px);line-height:1.2;font-weight:950;letter-spacing:.04em}
.footer-top,.footer-bottom{position:relative;z-index:2}
@media(max-width:980px){
 .home-hero,.hero-grid{min-height:480px}
 .hero-photo{width:59%}
 .hero-grid{grid-template-columns:59% 41%}
 .hero-copy h1{font-size:clamp(40px,5.8vw,58px)}
 .hero-copy .btn{font-size:13px;padding:15px 14px}
 .home-main>.container{width:calc(100% - 36px)}
 .feature-card{min-height:210px}
}
@media(max-width:680px){
 .home-hero{min-height:690px;background:linear-gradient(180deg,#62c0f8 0%,#a8e0ff 52%,#e7f7ff 100%)}
 .home-hero::before{height:24%;opacity:.56;background-size:auto 100%}
 .hero-photo{left:0;top:0;bottom:auto;width:100%;height:365px;background-position:center top;background-size:contain}
 .hero-grid{min-height:690px;display:flex;align-items:flex-end;padding-bottom:49px}
 .hero-copy{width:100%;max-width:none;padding:0;text-align:center}
 .hero-copy h1{font-size:clamp(39px,10vw,56px);line-height:1.12;margin-bottom:12px}
 .hero-line2{margin-inline:auto}
 .hero-copy p{font-size:15px;margin:21px 0 19px}
 .hero-actions{justify-content:center;gap:9px;flex-wrap:wrap}
 .hero-copy .btn{font-size:13px;padding:14px 14px;gap:7px}
 .hero-dec{right:8%;top:-17px;font-size:32px}
 .home-main{padding-top:14px}
 .home-main>.container{width:calc(100% - 30px)}
 .feature-grid{grid-template-columns:1fr;gap:11px}
 .feature-card{min-height:174px;border-radius:23px}
 .feature-card::before{width:46%}
 .feature-card.licensing img,.feature-card.shop img,.feature-card.about img{width:54%!important;height:100%!important;object-position:left center!important}
 .feature-card h2,.feature-card p{left:58%;right:16px}
 .feature-card h2{top:30%;font-size:24px}
 .feature-card p{top:51%;font-size:13px}
 .feature-card .circle-arrow{right:14px;bottom:12px;width:36px;height:36px}
 .site-footer{min-height:230px}
 .footer-promo{padding-top:36px;font-size:29px}
}

/* Generated landscape plate contains only sky, clouds and the Hong Kong skyline. */
@media(min-width:681px){
 .home-hero{background-color:#78cafa;background-image:url('assets/hk-skyline-bg-v2.webp');background-size:cover;background-position:center 58%;background-repeat:no-repeat}
 .home-hero::before{display:none}
 .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.63),rgba(65,161,215,.23)),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,cover;background-position:center,center 78%;background-repeat:no-repeat}
 .site-footer::after{display:none}
}

/* Switch the scenic plate with the selected local market. */
html[data-region="tw"] .home-hero{background-image:url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] .home-hero{background-image:url('assets/macau-skyline-bg.webp')}
html[data-region="tw"] .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.63),rgba(65,161,215,.23)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.63),rgba(65,161,215,.23)),url('assets/macau-skyline-bg.webp')}
@media(max-width:680px){
 html[data-region="hk"] .home-hero,html[data-region="tw"] .home-hero,html[data-region="mo"] .home-hero{background-image:linear-gradient(180deg,rgba(215,242,255,.05) 42%,rgba(225,245,255,.78) 70%,rgba(225,245,255,.55)),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,auto 100%;background-position:center,right bottom}
 html[data-region="tw"] .home-hero{background-image:linear-gradient(180deg,rgba(215,242,255,.05) 42%,rgba(225,245,255,.78) 70%,rgba(225,245,255,.55)),url('assets/taipei-skyline-bg.webp')}
 html[data-region="mo"] .home-hero{background-image:linear-gradient(180deg,rgba(215,242,255,.05) 42%,rgba(225,245,255,.78) 70%,rgba(225,245,255,.55)),url('assets/macau-skyline-bg.webp')}
 html[data-region="hk"] .site-footer,html[data-region="tw"] .site-footer,html[data-region="mo"] .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.56),rgba(65,161,215,.2)),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,auto 100%;background-position:center,right bottom}
 html[data-region="tw"] .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.56),rgba(65,161,215,.2)),url('assets/taipei-skyline-bg.webp')}
 html[data-region="mo"] .site-footer{background-image:linear-gradient(180deg,rgba(220,245,255,.56),rgba(65,161,215,.2)),url('assets/macau-skyline-bg.webp')}
 .site-footer::after{display:none}
}

/* Reference composition refresh: let the sky continue behind the header,
   keep supplied character artwork intact, and give the city its own locale. */
body.is-home .site-header{position:absolute;inset:0 0 auto;height:82px;background:linear-gradient(180deg,rgba(100,195,248,.34),rgba(100,195,248,0));box-shadow:none}
body.is-home .nav-wrap{width:min(1440px,calc(100% - 72px))}
body.is-home .desktop-nav{gap:clamp(13px,2vw,30px)}
body.is-home .nav-item{color:#071b37}
body.is-home .nav-item.active{color:#086fe3}
body.is-home .home-hero{min-height:590px;padding-top:0;background-color:#83cfff;background-image:linear-gradient(90deg,#fff 0%,#fff 34%,rgba(255,255,255,.92) 43%,rgba(255,255,255,.36) 57%,rgba(255,255,255,0) 72%),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,cover;background-position:center,center 61%;background-repeat:no-repeat}
body.is-home .hero-photo{left:0;top:55px;bottom:0;width:62%;background-image:url('assets/provided-scene-4.jpg')!important;background-size:auto 94%;background-position:left bottom;background-repeat:no-repeat;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 76%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 76%,transparent 100%)}
body.is-home .hero-grid{min-height:590px;padding-top:70px;grid-template-columns:64% 36%;align-items:center}
body.is-home .hero-copy{grid-column:2;padding:32px 0 40px 0;max-width:100%}
body.is-home .hero-copy h1{font-size:clamp(48px,5.25vw,80px);line-height:1.16;letter-spacing:-.045em}
body.is-home .hero-copy p{font-size:clamp(15px,1.35vw,19px);margin:25px 0 24px}
body.is-home .hero-actions{gap:12px;flex-wrap:wrap}
body.is-home .hero-copy .btn{padding:17px 22px;font-size:clamp(13px,1.1vw,16px)}
body.is-home .hero-dec{right:2%;top:2%;font-size:44px}
body.is-home .hero-tail{height:24px}
body.is-home .home-main{padding-top:19px}
body.is-home .home-main>.container{width:min(1470px,calc(100% - 60px))}
body.is-home .feature-grid{gap:14px}
body.is-home .feature-card{min-height:236px;border-radius:27px}
body.is-home .feature-card.licensing{background:linear-gradient(110deg,#7ccfff,#e3f5ff)}
body.is-home .feature-card.shop{background:linear-gradient(110deg,#fff0ca,#ffe2a8)}
body.is-home .feature-card.about{background:linear-gradient(110deg,#81ceff,#e1f4ff)}
body.is-home .feature-card::before{display:none}
body.is-home .feature-card img{width:58%;height:100%;object-fit:contain!important;object-position:left center;mask-image:linear-gradient(90deg,#000 0%,#000 76%,transparent 100%)}
body.is-home .feature-card h2{font-size:clamp(21px,2vw,30px)}
body.is-home .site-footer{min-height:245px;background-image:linear-gradient(180deg,rgba(229,247,255,.38),rgba(84,174,224,.18)),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,cover;background-position:center,center 80%;}
html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(90deg,#fff 0%,#fff 34%,rgba(255,255,255,.92) 43%,rgba(255,255,255,.36) 57%,rgba(255,255,255,0) 72%),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(90deg,#fff 0%,#fff 34%,rgba(255,255,255,.92) 43%,rgba(255,255,255,.36) 57%,rgba(255,255,255,0) 72%),url('assets/macau-skyline-bg.webp')}
html[data-region="tw"] body.is-home .site-footer{background-image:linear-gradient(180deg,rgba(229,247,255,.38),rgba(84,174,224,.18)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .site-footer{background-image:linear-gradient(180deg,rgba(229,247,255,.38),rgba(84,174,224,.18)),url('assets/macau-skyline-bg.webp')}
@media(max-width:980px) and (min-width:681px){body.is-home .hero-grid{grid-template-columns:58% 42%}body.is-home .hero-photo{width:60%}body.is-home .desktop-nav{gap:12px}body.is-home .nav-wrap{width:calc(100% - 36px)}}
@media(max-width:680px){
 body.is-home .site-header{height:66px;background:linear-gradient(180deg,rgba(105,193,244,.5),rgba(105,193,244,.08))}
 body.is-home .nav-wrap{width:calc(100% - 30px)}
 body.is-home .mobile-panel{top:66px}
 body.is-home .home-hero{min-height:760px;padding-top:0;background-image:linear-gradient(180deg,rgba(224,246,255,.02) 30%,rgba(255,255,255,.48) 55%,rgba(226,246,255,.4) 100%),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,auto 58%;background-position:center,right bottom;background-repeat:no-repeat}
 body.is-home .hero-photo{left:0;top:66px;bottom:auto;width:100%;height:340px;background-size:auto 100%;background-position:center top;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%)}
 body.is-home .hero-grid{min-height:760px;padding-top:405px;padding-bottom:44px;display:flex;align-items:flex-end}
 body.is-home .hero-copy{text-align:center;padding:0}
 body.is-home .hero-copy h1{font-size:clamp(39px,10vw,55px);margin-bottom:13px}
 body.is-home .hero-copy p{margin:18px 0 18px}
 body.is-home .hero-actions{justify-content:center}
 body.is-home .hero-copy .btn{font-size:13px;padding:14px 14px}
 body.is-home .hero-dec{right:4%;top:-20px;font-size:34px}
 body.is-home .home-main>.container{width:calc(100% - 30px)}
 body.is-home .feature-grid{grid-template-columns:1fr;gap:11px}
 body.is-home .feature-card{min-height:176px;border-radius:23px}
 body.is-home .feature-card img{width:56%;object-position:left center}
 body.is-home .feature-card h2,body.is-home .feature-card p{left:59%;right:15px}
 body.is-home .feature-card h2{top:27%;font-size:24px}
 body.is-home .feature-card p{top:48%;font-size:13px}
 body.is-home .site-footer{min-height:260px;background-size:100% 100%,auto 72%;background-position:center,right bottom}
}

/* Approved homepage mockup: use only its image regions as art. Navigation,
   headline, actions and card copy remain live HTML and respond to locale. */
body.is-home .nav-wrap{width:min(1400px,calc(100% - 160px))}
body.is-home .home-hero{min-height:578px;background-image:linear-gradient(90deg,rgba(120,203,252,.22),rgba(144,217,255,.08)),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,cover;background-position:center,center 59%}
body.is-home .hero-photo{top:79px;bottom:auto;width:64%;height:492px;background-image:url('assets/provided-scene-4.jpg')!important;background-size:auto 100%;background-position:left bottom;background-repeat:no-repeat;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 85%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 85%,transparent 100%)}
body.is-home .hero-grid{width:min(1440px,calc(100% - 110px));min-height:578px;padding-top:72px;grid-template-columns:65% 35%}
body.is-home .hero-copy{padding:28px 0 38px 0}
body.is-home .hero-copy h1{font-size:clamp(48px,5.15vw,79px)}
body.is-home .home-main{padding:7px 0 22px}
body.is-home .feature-card{min-height:252px}
body.is-home .feature-card.licensing{background:linear-gradient(90deg,#b1dfff,#e3f4ff)}
body.is-home .feature-card.shop{background:linear-gradient(90deg,#ffe9bd,#fff1d4)}
body.is-home .feature-card.about{background:linear-gradient(90deg,#a8dcff,#dff2ff)}
body.is-home .feature-card img{display:block}
body.is-home .feature-card::after{display:none}
body.is-home .feature-card.licensing::after{background-position:-30px -584px}
body.is-home .feature-card.shop::after{background-position:-532px -605px}
body.is-home .feature-card.about::after{background-position:-1020px -605px}
body.is-home .feature-card h2,body.is-home .feature-card p,body.is-home .feature-card .circle-arrow{z-index:2}
body.is-home .footer-promo{max-width:350px;margin:auto;padding-top:32px;line-height:1.16;transform:rotate(-7deg)}
body.is-home .footer-promo::after{content:"";display:block;width:80%;height:6px;margin:4px auto 0;border-radius:50%;background:#ffd400;transform:rotate(-3deg)}
html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(120,203,252,.22),rgba(144,217,255,.08)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(120,203,252,.22),rgba(144,217,255,.08)),url('assets/macau-skyline-bg.webp')}
@media(max-width:980px) and (min-width:681px){
 body.is-home .nav-wrap{width:calc(100% - 36px)}
 body.is-home .hero-grid{width:calc(100% - 50px);grid-template-columns:60% 40%}
 body.is-home .hero-photo{width:62%;top:80px}
 body.is-home .hero-copy h1{font-size:clamp(43px,5.5vw,60px)}
 body.is-home .feature-card::after{width:55%}
}
@media(max-width:680px){
 body.is-home .nav-wrap{width:calc(100% - 30px)}
 body.is-home .home-hero{min-height:700px;background-image:linear-gradient(180deg,rgba(112,202,250,.02) 45%,rgba(231,248,255,.64) 100%),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,auto 68%;background-position:center,right bottom}
 body.is-home .hero-photo{top:66px;left:0;width:100%;height:345px;background-size:max(760px,150vw) auto;background-position:left -42px;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 85%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 85%,transparent 100%)}
 body.is-home .hero-grid{width:calc(100% - 30px);min-height:700px;padding:394px 0 40px;display:flex;align-items:flex-end}
 body.is-home .hero-copy h1{font-size:clamp(39px,10vw,55px)}
 body.is-home .home-main{padding:10px 0 18px}
 body.is-home .feature-card{min-height:176px}
 body.is-home .feature-card::after{width:58%;background-size:1229px auto}
 body.is-home .feature-card.licensing::after{background-position:-24px -467px}
 body.is-home .feature-card.shop::after{background-position:-426px -484px}
 body.is-home .feature-card.about::after{background-position:-816px -484px}
 body.is-home .footer-promo{max-width:270px;font-size:28px}
 html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,202,250,.02) 45%,rgba(231,248,255,.64) 100%),url('assets/taipei-skyline-bg.webp')}
 html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,202,250,.02) 45%,rgba(231,248,255,.64) 100%),url('assets/macau-skyline-bg.webp')}
}

/* Final viewport corrections after visual inspection. */
body.is-home .site-header{background:linear-gradient(180deg,#8ad3ff 0%,#68bff4 100%)}
body.is-home .desktop-nav{margin-left:100px;margin-right:auto}
body.is-home .hero-photo{width:68%;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%)}
body.is-home .hero-grid{grid-template-columns:67% 33%;align-items:start}
body.is-home .hero-copy{padding-top:36px}
@media(max-width:980px) and (min-width:681px){body.is-home .desktop-nav{margin-left:20px}body.is-home .hero-grid{grid-template-columns:60% 40%;align-items:center}}
@media(max-width:680px){
 body.is-home .site-header{background:linear-gradient(180deg,#9cdbff,#79cafa)}
 body.is-home .hero-photo{top:66px;width:100%;height:300px;background-size:820px auto;background-position:left -43px;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%)}
 body.is-home .hero-grid{grid-template-columns:none;align-items:flex-end}
 body.is-home .hero-copy{padding-top:0}
 body.is-home .feature-card::after{width:54%;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 67%,transparent 85%);mask-image:linear-gradient(90deg,#000 0%,#000 67%,transparent 85%)}
}

body.is-home .hero-photo{-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 90%,transparent 96%);mask-image:linear-gradient(90deg,#000 0%,#000 90%,transparent 96%)}
body.is-home .hero-copy h1{font-size:clamp(50px,5vw,76px);letter-spacing:-.075em}
body.is-home .hero-copy .btn{min-width:218px;font-size:16px}
body.is-home .feature-card.about h2,body.is-home .feature-card.about p{left:68%}
@media(max-width:980px) and (min-width:681px){body.is-home .hero-copy .btn{min-width:0;font-size:13px}}
@media(max-width:680px){body.is-home .hero-photo{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%)}body.is-home .hero-copy h1{font-size:clamp(39px,10vw,55px)}body.is-home .hero-copy .btn{min-width:0;font-size:13px}body.is-home .feature-card.about h2,body.is-home .feature-card.about p{left:59%}}

body.is-home .site-footer{min-height:370px}
body.is-home .footer-promo{width:max-content;max-width:100%;font-size:40px;white-space:pre-line;padding-top:42px}
body.is-home .footer-top{margin-top:75px}
@media(max-width:680px){body.is-home .site-footer{min-height:410px}body.is-home .footer-promo{font-size:28px;padding-top:32px}body.is-home .footer-top{margin-top:46px}}

/* Tablet layout uses a separate crop of the approved art so raster card copy
   from the mockup never appears inside the live hero. */
@media(min-width:681px) and (max-width:980px){
 body.is-home .home-hero{min-height:calc(78px + 54vw + 330px);background-image:linear-gradient(180deg,rgba(112,202,250,.02) 42%,rgba(231,248,255,.62) 100%),url('assets/hk-skyline-bg-v2.webp');background-size:100% 100%,auto 78%;background-position:center,right bottom}
 html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,202,250,.02) 42%,rgba(231,248,255,.62) 100%),url('assets/taipei-skyline-bg.webp')}
 html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,202,250,.02) 42%,rgba(231,248,255,.62) 100%),url('assets/macau-skyline-bg.webp')}
 body.is-home .hero-photo{top:78px;left:0;width:100%;height:54vw;background-size:160vw auto;background-position:left -8.3vw;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 80%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 80%,transparent 100%)}
 body.is-home .hero-grid{width:calc(100% - 56px);min-height:calc(78px + 54vw + 330px);padding:calc(78px + 54vw) 0 42px;display:flex;align-items:flex-end}
 body.is-home .hero-copy{width:100%;text-align:center;padding:0}
 body.is-home .hero-copy h1{font-size:clamp(54px,7vw,68px)}
 body.is-home .hero-line2{margin-inline:auto}
 body.is-home .hero-actions{justify-content:center}
 body.is-home .hero-copy .btn{min-width:205px;font-size:15px}
 body.is-home .hero-dec{right:12%;top:-18px}
 body.is-home .feature-grid{grid-template-columns:1fr;gap:14px}
 body.is-home .feature-card{min-height:230px}
 body.is-home .feature-card::after{width:47%;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 68%,transparent 82%);mask-image:linear-gradient(90deg,#000 0%,#000 68%,transparent 82%)}
 body.is-home .feature-card h2,body.is-home .feature-card p,body.is-home .feature-card.about h2,body.is-home .feature-card.about p{left:52%;right:28px}
 body.is-home .feature-card h2{font-size:30px}
 body.is-home .feature-card p{font-size:15px}
}

@media(min-width:981px){
 body.is-home .hero-grid{width:min(1470px,calc(100% - 60px));grid-template-columns:65% 35%}
 body.is-home .hero-copy h1{margin-left:30px}
 body.is-home .hero-copy p{margin-left:22px;margin-top:55px}
 body.is-home .hero-actions{gap:18px}
 body.is-home .hero-copy .btn{min-width:242px;padding:20px;font-size:17px}
}

/* Fade out the mockup's baked-in headline before the mobile art reaches it. */
@media(max-width:680px){body.is-home .hero-photo{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%),linear-gradient(90deg,#000 0%,#000 85%,transparent 94%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 0%,#000 78%,transparent 100%),linear-gradient(90deg,#000 0%,#000 85%,transparent 94%);mask-composite:intersect}}

/* Prefer local Traditional Chinese system fonts; Noto preserves region-specific
   forms when a suitable system font is unavailable. */
:root{--font-hk:"Noto Sans HK","Noto Sans CJK HK","PingFang HK","蘋方-港","Microsoft JhengHei UI","Microsoft JhengHei",sans-serif;--font-tc:"Noto Sans TC","Noto Sans CJK TC","PingFang TC","蘋方-繁","Microsoft JhengHei UI","Microsoft JhengHei",sans-serif}

/* Every live text element follows the current language and region font,
   including browser-native controls and content added after navigation. */
body *{font-family:inherit}

/* Keep the supplied LARVA wordmark intact. The larger live-text plate is a
   regional identifier, sized as one deliberate lockup with the wordmark. */
.site-header,body.is-home .site-header{height:110px}
.site-header .logo-link{flex:none;width:190px;height:103px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-decoration:none}
.site-header .logo-link img{display:block;flex:none;width:160px;height:auto;max-height:71px;margin:0;object-fit:contain}
.brand-region-badge[hidden]{display:none!important}
.brand-region-badge{position:relative;z-index:1;width:188px;height:32px;margin-top:0;padding:0 10px;border:2px solid #a91d14;border-radius:999px;background:#e93628;color:#fff;box-shadow:0 3px 0 rgba(35,35,35,.19);display:flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;line-height:1;letter-spacing:.01em}
.brand-region-symbol{font-size:18px;line-height:1}
.brand-region-symbol svg{display:block;width:20px;height:20px}
.brand-region-badge strong{font-size:17px;font-weight:900}
.brand-region-place{font-size:12px;font-weight:800;border-left:1px solid currentColor;padding-left:7px}
.brand-region-place[hidden]{display:none}
html[data-region="tw"] .brand-region-badge{background:#ffd032;border-color:#ad6f00;color:#3a2604}
html[data-region="mo"] .brand-region-badge{background:#067d59;border-color:#005236;color:#fff}
body.is-home .desktop-nav{margin-left:55px}
@media(max-width:1190px){.site-header,body.is-home .site-header{height:94px}.site-header .logo-link{width:163px;height:89px}.site-header .logo-link img{width:138px;max-height:61px}.brand-region-badge{width:161px;height:28px;gap:5px;padding-inline:7px}.brand-region-symbol{font-size:15px}.brand-region-badge strong{font-size:14px}.brand-region-place{font-size:11px;padding-left:5px}body.is-home .desktop-nav{margin-left:12px}}
@media(max-width:980px){.site-header,body.is-home .site-header{height:94px}.mobile-panel{top:94px}}
@media(max-width:680px){.site-header,body.is-home .site-header{height:88px}.site-header .logo-link{width:158px;height:84px}.site-header .logo-link img{width:126px;max-height:56px}.brand-region-badge{width:156px;height:28px;gap:5px;padding-inline:7px}.brand-region-symbol{font-size:15px}.brand-region-badge strong{font-size:14px}.brand-region-place{font-size:11px;padding-left:5px}.mobile-panel{top:88px}}
/* The home header floats above the artwork, as in the approved composition. */
body.is-home .site-header{height:82px}
body.is-home .logo-link{align-self:flex-start}
@media(max-width:980px){body.is-home .site-header{height:74px}body.is-home .mobile-panel{top:74px}}
@media(max-width:680px){body.is-home .site-header{height:66px}body.is-home .logo-link{position:relative;z-index:2}body.is-home .mobile-panel{top:66px;padding-top:38px}.mobile-links .nav-item:after{bottom:0}}

/* Keep the approved characters prominent without revealing the reference
   artwork's baked-in card text beside the live card copy. */
body.is-home .feature-card::after{-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 83%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 83%,transparent 100%)}
@media(max-width:680px){body.is-home .feature-card::after{width:60%;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 74%,transparent 94%);mask-image:linear-gradient(90deg,#000 0%,#000 74%,transparent 94%)}}
@media(max-width:380px){body.is-home .hero-photo{background-size:650px auto;background-position:left -38px;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 55%,transparent 72%),linear-gradient(90deg,#000 0%,#000 88%,transparent 96%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 0%,#000 55%,transparent 72%),linear-gradient(90deg,#000 0%,#000 88%,transparent 96%);mask-composite:intersect}}
@media(min-width:981px){
 body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,199,249,.88) 0%,rgba(151,216,251,.63) 30%,rgba(234,247,255,.06) 72%),url('assets/hk-skyline-bg-v2.webp')}
 html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,199,249,.88) 0%,rgba(151,216,251,.63) 30%,rgba(234,247,255,.06) 72%),url('assets/taipei-skyline-bg.webp')}
 html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(112,199,249,.88) 0%,rgba(151,216,251,.63) 30%,rgba(234,247,255,.06) 72%),url('assets/macau-skyline-bg.webp')}
}

/* The approved composition contains printed copy. These hard bounds expose
   only character art; all readable copy remains the locale-aware HTML layer. */
body.is-home .feature-card::after{width:min(59%,250px);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 82%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 82%,transparent 100%)}
@media(max-width:680px){
 body.is-home .hero-photo{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 67%,transparent 86%),linear-gradient(90deg,#000 0%,#000 85%,transparent 94%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 0%,#000 67%,transparent 86%),linear-gradient(90deg,#000 0%,#000 85%,transparent 94%);mask-composite:intersect}
 body.is-home .feature-card::after{width:min(60%,210px);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 75%,transparent 100%);mask-image:linear-gradient(90deg,#000 0%,#000 75%,transparent 100%)}
}
@media(min-width:520px) and (max-width:680px){body.is-home .hero-photo{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 67%,transparent 86%),linear-gradient(90deg,#000 0%,#000 69%,transparent 79%);mask-image:linear-gradient(180deg,#000 0%,#000 67%,transparent 86%),linear-gradient(90deg,#000 0%,#000 69%,transparent 79%)}}
@media(max-width:380px){body.is-home .hero-photo{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 55%,transparent 72%),linear-gradient(90deg,#000 0%,#000 88%,transparent 96%);mask-image:linear-gradient(180deg,#000 0%,#000 55%,transparent 72%),linear-gradient(90deg,#000 0%,#000 88%,transparent 96%)}}

/* Text-free supplied character art. Keep the reference screenshot out of live
   layers: its printed type and skyline otherwise repeat behind real content. */
body.is-home .hero-photo{
  left:0;top:82px;bottom:auto;width:60%;height:490px;
  background-image:url('assets/provided-scene-4.jpg')!important;
  background-size:auto 100%;background-position:left bottom;background-repeat:no-repeat;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 62%,transparent 82%);
  mask-image:linear-gradient(90deg,#000 0%,#000 62%,transparent 82%);
}
body.is-home .feature-card::after{display:none!important;content:none!important}
body.is-home .feature-card img{display:block!important}
@media(max-width:980px) and (min-width:681px){
  body.is-home .hero-photo{top:78px;width:100%;height:54vw;max-height:520px;background-size:auto 100%;background-position:8% top;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 76%,transparent 100%),linear-gradient(90deg,#000 0%,#000 67%,transparent 84%);mask-image:linear-gradient(180deg,#000 0%,#000 76%,transparent 100%),linear-gradient(90deg,#000 0%,#000 67%,transparent 84%)}
}
@media(max-width:680px){
  body.is-home .hero-photo{top:76px;left:0;width:100%;height:330px;background-size:auto 330px;background-position:center top;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 5%,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 5%,#000 78%,transparent 100%)}
  body.is-home .hero-grid{padding-top:400px}
}

/* A soft light field matches the supplied artwork's white background without
   clipping or recolouring either official character. */
@media(min-width:981px){
  body.is-home .home-hero{background-image:linear-gradient(90deg,#fff 0%,#fff 35%,rgba(255,255,255,.74) 47%,rgba(255,255,255,0) 68%),url('assets/hk-skyline-bg-v2.webp')}
  html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(90deg,#fff 0%,#fff 35%,rgba(255,255,255,.74) 47%,rgba(255,255,255,0) 68%),url('assets/taipei-skyline-bg.webp')}
  html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(90deg,#fff 0%,#fff 35%,rgba(255,255,255,.74) 47%,rgba(255,255,255,0) 68%),url('assets/macau-skyline-bg.webp')}
}
@media(max-width:680px){
  body.is-home .home-hero{background-image:linear-gradient(180deg,#fff 0%,#fff 36%,rgba(255,255,255,.5) 53%,rgba(255,255,255,0) 76%),url('assets/hk-skyline-bg-v2.webp')}
  html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(180deg,#fff 0%,#fff 36%,rgba(255,255,255,.5) 53%,rgba(255,255,255,0) 76%),url('assets/taipei-skyline-bg.webp')}
  html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(180deg,#fff 0%,#fff 36%,rgba(255,255,255,.5) 53%,rgba(255,255,255,0) 76%),url('assets/macau-skyline-bg.webp')}
}

/* Reserve the regional city photograph for the hero. The footer has its own
   simple skyline so the same photo never appears twice on one screen. */
body.is-home .site-footer,html[data-region="tw"] body.is-home .site-footer,html[data-region="mo"] body.is-home .site-footer{background:#c8eaff linear-gradient(180deg,#e7f7ff 0%,#b7e2fb 55%,#71bae7 100%)}
body.is-home .site-footer::after{content:"";display:block;height:43%;opacity:.46;background:url('assets/cityline.svg') center bottom/auto 100% repeat-x;pointer-events:none}

/* The inner-page banner photos are close-up crops with hard white edges. The
   pages already show the supplied characters at their natural ratio below. */
.page-banner .banner-art{display:none!important}
.page-banner::after{content:"";position:absolute;right:-7%;top:-95%;width:min(43vw,580px);aspect-ratio:1;border:2px solid rgba(255,255,255,.55);border-radius:50%;box-shadow:0 0 0 45px rgba(255,255,255,.11),0 0 0 100px rgba(255,255,255,.08);pointer-events:none}
@media(max-width:680px){.page-banner::after{right:-32%;top:-80%;width:75vw;opacity:.65}}

/* Approved homepage composition: sky and local city behind intact supplied
   pixels. The SVG is only a display mask around Yellow and Red. */
body.is-home .home-hero{
  background-color:#79c8fb;
  background-image:linear-gradient(90deg,rgba(98,188,248,.23),rgba(164,221,255,.12)),url('assets/hk-skyline-bg-v2.webp');
  background-size:100% 100%,cover;background-position:center,center 59%;
}
html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(98,188,248,.23),rgba(164,221,255,.12)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(98,188,248,.23),rgba(164,221,255,.12)),url('assets/macau-skyline-bg.webp')}
body.is-home .hero-photo{
  left:clamp(0px,1.5vw,24px);top:24px;bottom:auto;width:600px;height:565px;
  background-image:url('assets/provided-scene-4.jpg')!important;
  background-size:100% 100%;background-position:center;background-repeat:no-repeat;
  -webkit-mask-image:url('assets/hero-silhouette.svg?v=2');mask-image:url('assets/hero-silhouette.svg?v=2');
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-composite:source-over;mask-composite:add;
}
body.is-home .home-hero::after{height:13%;background:linear-gradient(0deg,rgba(232,247,255,.36),transparent)}
@media(min-width:681px) and (max-width:980px){
  body.is-home .home-hero{background-size:100% 100%,cover;background-position:center,center 62%}
  body.is-home .hero-photo{left:3%;top:78px;width:min(68vw,560px);height:auto;aspect-ratio:1147/1080;background-size:100% 100%}
}
@media(max-width:680px){
  body.is-home .home-hero{background-size:100% 100%,auto 100%;background-position:center,right bottom}
  body.is-home .hero-photo{left:50%;top:68px;transform:translateX(-50%);width:min(94vw,390px);height:auto;aspect-ratio:1147/1080;background-size:100% 100%}
  body.is-home .hero-grid{padding-top:390px}
}

/* Regional lockup: the original LARVA artwork stays unchanged. Each region
   adds its own city image and native-name plate around it. */
.site-header .logo-link{position:relative;isolation:isolate}
.site-header .logo-link::before{content:"";position:absolute;z-index:0;left:0;top:4px;width:100%;height:70px;background:url('assets/hk-skyline-bg-v2.webp') center 70%/cover no-repeat;opacity:.55;-webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 55%,#000 38%,transparent 100%);mask-image:radial-gradient(ellipse 75% 65% at 50% 55%,#000 38%,transparent 100%)}
html[data-region="tw"] .site-header .logo-link::before{background-image:url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] .site-header .logo-link::before{background-image:url('assets/macau-skyline-bg.webp')}
.site-header .logo-link>img{position:relative;z-index:1;filter:drop-shadow(0 2px 0 rgba(255,255,255,.75))}
.site-header .brand-region-badge{z-index:2;box-shadow:0 3px 0 rgba(18,48,77,.22),0 6px 14px rgba(12,82,124,.17)}
@media(max-width:680px){.site-header .logo-link::before{height:54px;top:1px}}
.site-header .logo-link::before{display:none}

/* Separate local waterfront artwork echoes the reference footer without
   repeating the exact city photograph used in the hero. */
body.is-home .site-footer,
html[data-region="tw"] body.is-home .site-footer,
html[data-region="mo"] body.is-home .site-footer{
  background-color:#ccecff;
  background-image:linear-gradient(180deg,rgba(238,249,255,.92),rgba(235,249,255,.64) 34%,rgba(219,242,254,.18) 70%),url('assets/hk-footer-city-v1.webp');
  background-size:100% 100%,cover;background-position:center,center bottom;background-repeat:no-repeat;
}
html[data-region="tw"] body.is-home .site-footer{background-image:linear-gradient(180deg,rgba(238,249,255,.92),rgba(235,249,255,.64) 34%,rgba(219,242,254,.18) 70%),url('assets/tw-footer-city-v1.webp')}
html[data-region="mo"] body.is-home .site-footer{background-image:linear-gradient(180deg,rgba(238,249,255,.92),rgba(235,249,255,.64) 34%,rgba(219,242,254,.18) 70%),url('assets/mo-footer-city-v1.webp')}
body.is-home .site-footer::after{display:none}
body.is-home .footer-top,body.is-home .footer-bottom{text-shadow:0 1px 3px rgba(255,255,255,.95)}
@media(max-width:680px){body.is-home .site-footer,html[data-region="tw"] body.is-home .site-footer,html[data-region="mo"] body.is-home .site-footer{background-size:100% 100%,auto 100%;background-position:center,center bottom}}
@media(min-width:681px){body.is-home .footer-top{padding:9px 18px;border-radius:18px;background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
.footer-brand{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none}
.footer-brand img{width:136px;height:auto;max-height:64px;object-fit:contain}
.footer-brand .brand-region-badge{width:168px;height:27px;margin-top:-2px;gap:5px;padding-inline:8px}
.footer-brand .brand-region-symbol{font-size:15px}
.footer-brand .brand-region-symbol svg{width:17px;height:17px}

/* The supplied character photographs have white canvases. Mask only the
   canvas, keeping every visible character pixel at its original ratio. */
body.is-home .feature-card img{
  left:0;right:auto;top:auto;bottom:0;
  width:auto!important;max-width:none;height:100%!important;
  object-fit:contain!important;object-position:left bottom;
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
body.is-home .feature-card.licensing img{
  -webkit-mask-image:url('assets/hero-silhouette.svg?v=2');
  mask-image:url('assets/hero-silhouette.svg?v=2');
}
body.is-home .feature-card.shop img{
  height:89%!important;
  -webkit-mask-image:url('assets/scene-1-silhouette.svg');
  mask-image:url('assets/scene-1-silhouette.svg');
}
body.is-home .feature-card.about img{
  height:89%!important;
  -webkit-mask-image:url('assets/scene-3-silhouette.svg');
  mask-image:url('assets/scene-3-silhouette.svg');
}

/* Lower the local skyline so it supports the headline instead of cutting
   through it. A blue wash also replaces the empty white half of the photo. */
body.is-home .home-hero{
  background-color:#70c5f8;
  background-image:linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/hk-skyline-bg-v2.webp');
  background-size:100% 100%,100% 100%,cover;
  background-position:center,center,center 59%;
}
html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/macau-skyline-bg.webp')}
@media(min-width:981px){
  body.is-home .hero-photo{left:clamp(90px,8vw,135px);top:76px;width:545px;height:auto;aspect-ratio:1147/1080}
}
@media(max-width:680px){
  body.is-home .home-hero{background-size:100% 100%,100% 100%,auto 100%;background-position:center,center,right bottom}
  body.is-home .feature-card.licensing img{height:100%!important}
  body.is-home .feature-card.shop img,body.is-home .feature-card.about img{height:94%!important}
  body.is-home .feature-card p{text-wrap:balance}
  body.is-home .site-footer,html[data-region="tw"] body.is-home .site-footer,html[data-region="mo"] body.is-home .site-footer{
    min-height:0;
    background-size:100% 100%,auto 330px;
    background-position:center,center top;
  }
  body.is-home .footer-top{
    margin-top:175px;
    padding:20px 17px 12px;
    border-radius:22px 22px 0 0;
    background:rgba(255,255,255,.96);
  }
  body.is-home .footer-top nav{font-size:13px}
  body.is-home .footer-bottom{margin-top:0;padding:8px 17px 20px;border-radius:0 0 22px 22px;background:rgba(255,255,255,.96)}
}
.footer-brand .brand-region-badge strong{font-size:14px}
.footer-brand .brand-region-place{font-size:10px;padding-left:5px}
@media(max-width:680px){.footer-brand{align-items:flex-start}.footer-brand .brand-region-badge{width:160px}}

/* Give Yellow and Red their own positions while showing the same untouched
   source image through separate outlines. This fills the centre of the hero. */
@media(min-width:1200px){
  body.is-home .hero-grid{grid-template-columns:60% 40%}
  body.is-home .hero-photo{
    left:0;top:0;bottom:0;width:100%;height:100%;aspect-ratio:auto;
    background:none!important;
    -webkit-mask-image:none;mask-image:none;
    transform:none;
    pointer-events:none;
  }
  body.is-home .hero-photo::before,body.is-home .hero-photo::after{
    content:"";position:absolute;display:block;
    background:url('assets/provided-scene-4.jpg') center/100% 100% no-repeat;
    -webkit-mask-size:100% 100%;mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  }
  body.is-home .hero-photo::before{
    left:clamp(65px,7vw,110px);top:96px;width:550px;aspect-ratio:1147/1080;
    -webkit-mask-image:url('assets/hero-yellow-silhouette.svg');
    mask-image:url('assets/hero-yellow-silhouette.svg');
  }
  body.is-home .hero-photo::after{
    left:clamp(325px,24.7vw,375px);top:-45px;width:840px;aspect-ratio:1350/1080;
    background-image:url('assets/provided-scene-1.jpg');
    -webkit-mask-image:url('assets/scene-1-alpha-mask.png');
    mask-image:url('assets/scene-1-alpha-mask.png');
    clip-path:inset(0 50% 0 0);
  }
}

/* The skyline belongs under the copy; the upper right stays clear sky. */
body.is-home .home-hero{
  background-image:radial-gradient(ellipse 38% 53% at 80% 27%,rgba(115,194,248,.96),rgba(113,193,248,.74) 57%,transparent 100%),linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/hk-skyline-bg-v2.webp');
  background-size:100% 100%,100% 100%,100% 100%,cover;
  background-position:center,center,center,center 59%;
}
html[data-region="tw"] body.is-home .home-hero{background-image:radial-gradient(ellipse 38% 53% at 80% 27%,rgba(115,194,248,.96),rgba(113,193,248,.74) 57%,transparent 100%),linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:radial-gradient(ellipse 38% 53% at 80% 27%,rgba(115,194,248,.96),rgba(113,193,248,.74) 57%,transparent 100%),linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),url('assets/macau-skyline-bg.webp')}
@media(max-width:680px){body.is-home .home-hero{background-size:100% 100%,100% 100%,100% 100%,auto 100%;background-position:center,center,center,right bottom}}
@media(max-width:680px){
  html[data-region="hk"] body.is-home .home-hero{--mobile-city:url('assets/hk-skyline-bg-v2.webp')}
  html[data-region="tw"] body.is-home .home-hero{--mobile-city:url('assets/taipei-skyline-bg.webp')}
  html[data-region="mo"] body.is-home .home-hero{--mobile-city:url('assets/macau-skyline-bg.webp')}
  html[data-region] body.is-home .home-hero{
    background-image:linear-gradient(180deg,transparent 40%,rgba(113,194,249,.70) 55%,rgba(113,194,249,.96) 69%,rgba(113,194,249,.88) 85%,transparent 100%),radial-gradient(ellipse 38% 53% at 80% 27%,rgba(115,194,248,.96),rgba(113,193,248,.74) 57%,transparent 100%),linear-gradient(180deg,rgba(100,192,250,.98) 0%,rgba(105,196,251,.94) 50%,rgba(104,192,249,.12) 94%),linear-gradient(90deg,rgba(51,176,250,.55),rgba(97,196,254,.18) 48%,rgba(88,187,251,.06)),var(--mobile-city);
    background-size:100% 100%,100% 100%,100% 100%,100% 100%,auto 100%;
    background-position:center,center,center,center,right bottom;
  }
}

/* Keep Red's supplied smiling pose at every viewport. The monochrome mask
   contains opacity only; all visible character pixels come from the JPGs. */
@media(max-width:1199px){
  body.is-home .hero-photo{
    left:0;top:0;bottom:auto;width:100%;height:100%;aspect-ratio:auto;
    background:none!important;-webkit-mask-image:none;mask-image:none;
    transform:none;pointer-events:none;
  }
  body.is-home .hero-photo::before,body.is-home .hero-photo::after{
    content:"";position:absolute;display:block;
    background-position:center;background-size:100% 100%;background-repeat:no-repeat;
    -webkit-mask-size:100% 100%;mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  }
  body.is-home .hero-photo::before{
    background-image:url('assets/provided-scene-4.jpg');
    -webkit-mask-image:url('assets/hero-yellow-silhouette.svg');
    mask-image:url('assets/hero-yellow-silhouette.svg');
    aspect-ratio:1147/1080;
  }
  body.is-home .hero-photo::after{
    background-image:url('assets/provided-scene-1.jpg');
    -webkit-mask-image:url('assets/scene-1-alpha-mask.png');
    mask-image:url('assets/scene-1-alpha-mask.png');
    clip-path:inset(0 50% 0 0);aspect-ratio:1350/1080;
  }
}
@media(min-width:981px) and (max-width:1199px){
  body.is-home .hero-photo::before{left:clamp(70px,8vw,95px);top:76px;width:545px}
  body.is-home .hero-photo::after{left:clamp(300px,32vw,350px);top:10px;width:720px}
}
@media(min-width:681px) and (max-width:980px){
  body.is-home .hero-photo::before{left:clamp(30px,6vw,70px);top:78px;width:min(58vw,455px)}
  body.is-home .hero-photo::after{left:clamp(245px,32vw,300px);top:0;width:min(85vw,650px)}
}
@media(max-width:680px){
  body.is-home .hero-photo{height:410px}
  body.is-home .hero-photo::before{left:50%;top:68px;width:min(94vw,390px);transform:translateX(-50%)}
  body.is-home .hero-photo::after{left:calc(50% + 10px);top:116px;width:min(95vw,390px)}
}

/* Soft cloud forms and low horizon haze add depth without covering characters. */
body.is-home .home-hero::before{
  content:"";display:block;position:absolute;inset:0;height:auto;z-index:0;opacity:1;background-repeat:no-repeat;background-position:center;background-size:100% 100%;pointer-events:none;
  background-image:url('assets/hero-clouds.svg?v=2');
}
body.is-home .hero-photo{z-index:1}
body.is-home .hero-grid{z-index:2}
@media(max-width:680px){
  body.is-home .home-hero::before{
    display:none;
  }
}

/* Relax Chinese display typography: keep the regional font stacks, but avoid
   extra-heavy weights and compressed tracking that make the page feel rigid. */
html[lang^="zh"] body :is(h1,h2,h3){
  font-weight:700;
  letter-spacing:.01em;
  line-height:1.3;
}
html[lang^="zh"] body .btn{font-weight:650;letter-spacing:.01em}
html[lang^="zh"] body.is-home .hero-copy h1{
  font-weight:800;
  letter-spacing:.02em;
  line-height:1.22;
}
html[lang^="zh"] body.is-home .hero-copy p{
  font-weight:500;
  letter-spacing:.01em;
}
html[lang^="zh"] body.is-home .hero-copy .btn{
  font-weight:650;
  letter-spacing:.015em;
}
html[lang^="zh"] body.is-home .feature-card h2,
html[lang^="zh"] body.is-home .peek-heading h2{
  font-weight:700;
  letter-spacing:.015em;
}
html[lang^="zh"] body.is-home .feature-card p,
html[lang^="zh"] body.is-home .nav-item{
  font-weight:600;
  letter-spacing:.01em;
}

/* Keep the three homepage cards on one shared visual grid. */
@media(min-width:681px){
  body.is-home .feature-card.shop img,
  body.is-home .feature-card.about img{height:100%!important;max-width:58%!important}
  body.is-home .feature-card h2,
  body.is-home .feature-card p,
  body.is-home .feature-card.about h2,
  body.is-home .feature-card.about p{left:61%;right:20px}
}

/* Homepage sections follow the richer editorial rhythm in the new reference. */
body.is-home .home-character-section{padding:42px 0 50px;background:#fff}
body.is-home .home-section-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:20px}
body.is-home .home-kicker{display:block;color:#1475d2;font-size:13px;font-weight:700;letter-spacing:.04em;margin-bottom:3px}
body.is-home .home-section-heading h2,body.is-home .home-about-copy h2,body.is-home .home-shop-inner h2{font-size:clamp(27px,3vw,36px);line-height:1.2;margin:0;font-weight:850;letter-spacing:-.025em;color:#101b32}
body.is-home .home-more{display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border:1px solid #9dcdf4;border-radius:30px;color:#087bd5;font-size:13px;font-weight:750;white-space:nowrap}
body.is-home .home-more:hover{background:#edf8ff}
body.is-home .home-character-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:980px;margin:0 auto}
body.is-home .home-character-card{display:grid;grid-template-columns:minmax(150px,44%) 1fr;grid-template-rows:auto 1fr;align-items:center;column-gap:20px;min-height:225px;padding:16px 22px 16px 12px;border-radius:25px;background:linear-gradient(130deg,#fff5bc,#fffdf4);overflow:hidden}
body.is-home .home-character-card:nth-child(2){background:linear-gradient(130deg,#ffe0e3,#fff7f8)}
body.is-home .home-character-art{grid-row:span 2;display:block;align-self:stretch;min-width:0;aspect-ratio:1;position:relative;border-radius:50%;background:#ffec83;overflow:hidden}
body.is-home .home-character-art.red{background:#ffcbd1}
body.is-home .home-character-art:before{content:"";position:absolute;top:0;height:100%;background-repeat:no-repeat;background-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}
body.is-home .home-character-art.yellow:before{left:-3%;width:106.2%;background-image:url('assets/provided-scene-4.jpg');-webkit-mask-image:url('assets/hero-yellow-silhouette.svg');mask-image:url('assets/hero-yellow-silhouette.svg')}
body.is-home .home-character-art.red:before{left:0;width:125%;background-image:url('assets/provided-scene-1.jpg');-webkit-mask-image:url('assets/scene-1-alpha-mask.png');mask-image:url('assets/scene-1-alpha-mask.png');clip-path:inset(0 50% 0 0)}
body.is-home .home-character-card strong{align-self:end;font-size:24px;font-weight:800}
body.is-home .home-character-card>span:last-child{align-self:start;color:#5c6674;font-size:14px;line-height:1.65}
body.is-home .home-poster-section{padding:35px 0 40px;background:#eaf7ff;border-radius:30px}
body.is-home .home-section-intro{margin:-8px 0 18px;color:#596879;font-size:15px;max-width:780px}
body.is-home .home-video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
body.is-home .home-video-card{min-width:0;border:0;padding:0;background:transparent;text-align:left;color:inherit}
body.is-home .home-video-thumb{display:block;position:relative;overflow:hidden;border-radius:14px;aspect-ratio:16/9;background:#dcecf7}
body.is-home .home-video-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
body.is-home .home-video-card:hover .home-video-thumb img{transform:scale(1.035)}
body.is-home .home-video-thumb .play-round{z-index:1}
body.is-home .home-video-badge{position:absolute;right:8px;bottom:8px;padding:3px 8px;border-radius:20px;background:#102337bd;color:#fff;font-size:11px;font-weight:700}
body.is-home .home-video-title{display:block;padding:9px 2px 0;font-size:14px;font-weight:750}
body.is-home .home-about-section{padding:54px 0}
body.is-home .home-about-inner{display:grid;grid-template-columns:.78fr 1.22fr;gap:42px;align-items:center}
body.is-home .home-about-copy p{max-width:490px;color:#596879;font-size:15px;line-height:1.85;margin:16px 0 20px}
body.is-home .home-about-inner>img{width:100%;height:330px;object-fit:cover;border-radius:24px}
body.is-home .home-shop-section{position:relative;isolation:isolate;overflow:hidden;margin:0 auto 28px;width:min(1440px,calc(100% - 40px));padding:34px 0;border-radius:27px;background:linear-gradient(105deg,#ffe876 0%,#ffdf47 56%,#ffd530 100%)}
body.is-home .home-shop-section:after{content:"";position:absolute;z-index:-1;width:360px;height:360px;border-radius:50%;right:8%;top:-205px;border:35px solid #fff5b766;box-shadow:0 0 0 35px #fff5b733,0 0 0 70px #fff5b722}
body.is-home .home-shop-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:190px}
body.is-home .home-shop-label{display:inline-block;padding:5px 12px;border-radius:30px;background:#fff9dc;color:#705600;font-size:12px;font-weight:800}
body.is-home .home-shop-inner h2{margin:10px 0 3px;font-size:clamp(30px,4vw,44px);color:#171b26}
body.is-home .home-shop-inner p{margin:0 0 18px;color:#303746;font-size:18px;font-weight:650}
body.is-home .home-shop-inner .btn{box-shadow:0 5px 16px #8d6a1524}
body.is-home .home-shop-art{display:flex;align-items:center;gap:32px;padding:12px 35px;color:#fff9db;font-size:58px;text-shadow:0 2px #db9b00}
body.is-home .home-shop-art span:last-child{font-size:78px;transform:rotate(-15deg)}
body.is-home .site-footer{background:#079dea!important;background-image:none!important}
body.is-home .footer-top{margin-top:0!important;padding:14px 0 12px!important;border-radius:0!important;background:transparent!important}
body.is-home .footer-bottom{margin-top:0!important;padding:10px 0 0!important;border-radius:0!important;background:transparent!important}
/* Reference direction: a clean white masthead before the blue city hero. */
body.is-home .site-header{position:relative;inset:auto;height:86px;background:#fff;box-shadow:0 1px 10px rgba(10,51,92,.08)}
body.is-home .site-header .logo-link{width:168px;height:82px}
body.is-home .site-header .logo-link img{width:136px;max-height:56px}
body.is-home .site-header .brand-region-badge{width:166px;height:25px;margin-top:0;font-size:12px}
body.is-home .site-header .brand-region-badge strong{font-size:13px}
body.is-home .site-header .brand-region-place{font-size:10px}
body.is-home .site-header .logo-link:before{display:none}
body.is-home .home-hero{min-height:578px}
body.is-home .hero-grid{min-height:578px;padding-top:0}
@media(min-width:1200px){
  body.is-home .hero-photo:before{top:0}
  body.is-home .hero-photo:after{top:-130px}
}
@media(max-width:980px){
  body.is-home .site-header{height:82px}
  body.is-home .site-header .logo-link{width:160px;height:78px}
  body.is-home .site-header .logo-link img{width:128px;max-height:52px}
  body.is-home .site-header .brand-region-badge{width:158px;height:24px}
  body.is-home .hero-grid{min-height:578px;padding-top:0}
  body.is-home .home-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  body.is-home .home-about-inner{grid-template-columns:1fr 1.1fr;gap:24px}
}
@media(max-width:680px){
  body.is-home .site-header{height:82px}
  body.is-home .site-header .logo-link{width:150px;height:78px}
  body.is-home .site-header .logo-link img{width:120px;max-height:51px}
  body.is-home .site-header .brand-region-badge{width:148px;height:24px}
  body.is-home .mobile-panel{top:82px}
  body.is-home .home-character-section{padding:29px 0 34px}
  body.is-home .home-section-heading{align-items:center;margin-bottom:15px}
  body.is-home .home-section-heading h2,body.is-home .home-about-copy h2{font-size:27px}
  body.is-home .home-more{padding:8px 12px;font-size:12px}
  body.is-home .home-character-grid{grid-template-columns:1fr;gap:12px}
  body.is-home .home-character-card{grid-template-columns:42% 1fr;min-height:160px;padding:10px 14px 10px 9px;column-gap:15px;border-radius:20px}
  body.is-home .home-character-card strong{font-size:21px}
  body.is-home .home-character-card>span:last-child{font-size:13px}
  body.is-home .home-poster-section{padding:28px 0 30px;border-radius:22px}
  body.is-home .home-section-intro{font-size:13px;line-height:1.6}
  body.is-home .home-video-grid{gap:14px 10px}
  body.is-home .home-video-thumb{border-radius:11px}
  body.is-home .home-video-title{font-size:12px;padding-top:7px}
  body.is-home .home-video-badge{right:5px;bottom:5px;font-size:9px;padding:2px 6px}
  body.is-home .home-about-section{padding:36px 0}
  body.is-home .home-about-inner{grid-template-columns:1fr;gap:17px}
  body.is-home .home-about-copy p{font-size:14px;margin:11px 0 15px}
  body.is-home .home-about-inner>img{height:220px}
  body.is-home .home-shop-section{width:calc(100% - 24px);padding:25px 0;border-radius:22px}
  body.is-home .home-shop-inner{min-height:0}
  body.is-home .home-shop-inner h2{font-size:30px}
  body.is-home .home-shop-inner p{font-size:16px}
  body.is-home .home-shop-art{gap:7px;padding:0;font-size:35px}
  body.is-home .home-shop-art span:last-child{font-size:44px}
}

/* Homepage composition reset: match the supplied full-page reference more
   closely, without using its unapproved character or merchandise artwork. */
body.is-home .site-header{height:66px;box-shadow:0 2px 12px rgba(20,55,83,.08)}
body.is-home .site-header .nav-wrap{gap:12px}
body.is-home .site-header .logo-link{width:152px;height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center}
body.is-home .site-header .logo-link img{width:112px;max-height:45px}
body.is-home .site-header .brand-region-badge{width:146px;height:22px;margin-top:-1px;font-size:11px;line-height:1}
body.is-home .site-header .brand-region-symbol{font-size:12px}
body.is-home .site-header .brand-region-badge strong{font-size:11px}
body.is-home .site-header .brand-region-place{font-size:9px}
body.is-home .desktop-nav{gap:clamp(12px,1.8vw,26px)}
body.is-home .nav-item{padding:19px 1px 17px;font-size:13px}
body.is-home .nav-item:after{bottom:11px;background:#ffd51f}
body.is-home .home-hero{min-height:440px;overflow:hidden;background-size:cover;background-position:center 58%;}
body.is-home .home-hero::after{height:23%;background:linear-gradient(0deg,rgba(238,249,255,.3),transparent)}
html[data-region="hk"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(100,192,250,.12),rgba(127,208,255,.12)),url('assets/hk-skyline-bg-v2.webp')}
html[data-region="tw"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(100,192,250,.12),rgba(127,208,255,.12)),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-hero{background-image:linear-gradient(90deg,rgba(100,192,250,.12),rgba(127,208,255,.12)),url('assets/macau-skyline-bg.webp')}
body.is-home .hero-grid{min-height:440px;display:grid;grid-template-columns:50% 50%;align-items:center;padding-top:0}
body.is-home .hero-photo{left:0;top:0;bottom:0;width:57%;height:auto;background-image:url('assets/hero-characters.png')!important;background-repeat:no-repeat!important;background-size:auto 128%!important;background-position:left 48%!important;-webkit-mask-image:none!important;mask-image:none!important;mix-blend-mode:multiply;z-index:1}
body.is-home .hero-photo::before,body.is-home .hero-photo::after{display:none!important}
body.is-home .hero-copy{grid-column:2;padding:23px 0 28px 16px;align-self:center;z-index:3;text-align:center}
body.is-home .hero-brand-mark{display:block;width:clamp(170px,21vw,260px);height:auto;margin:0 auto 4px}
body.is-home .hero-copy h1{font-size:clamp(40px,4.2vw,64px);font-weight:900;line-height:1.04;letter-spacing:-.035em;margin:0 auto 10px;color:#111626;text-shadow:none}
body.is-home .hero-copy h1 span{display:inline}
body.is-home .hero-copy h1 span+span{margin-left:.18em}
body.is-home .hero-line2{color:#111626}
body.is-home .hero-line2:after{height:6px;bottom:-7px;left:2%;width:96%;background:#ffd625}
body.is-home .hero-copy p{margin:19px 0 17px;font-size:14px;color:#14233a}
body.is-home .hero-actions{justify-content:center;gap:12px}
body.is-home .hero-copy .btn{padding:14px 18px;font-size:14px;min-height:49px}
body.is-home .hero-copy .btn-blue{background:#087cf0}
body.is-home .hero-tail{height:22px}
body.is-home .home-character-section{padding:18px 0 26px;margin-top:-8px;position:relative;z-index:4;background:#fff;border-radius:46% 48% 0 0 / 18px 18px 0 0}
body.is-home .home-section-heading{align-items:center;margin-bottom:12px}
body.is-home .home-kicker{display:none}
body.is-home .home-section-heading h2,body.is-home .home-about-copy h2,body.is-home .home-shop-inner h2{font-size:clamp(25px,2.5vw,34px);font-weight:850;letter-spacing:0}
body.is-home .home-more{padding:7px 14px}
body.is-home .home-character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:none;margin:0}
body.is-home .home-character-card{display:grid;grid-template-columns:42% 1fr;grid-template-rows:auto 1fr;min-height:148px;column-gap:15px;padding:8px 15px 8px 8px;border-radius:22px;background:#fff3bb}
body.is-home .home-character-card:nth-child(2){background:#ffe1e5}
body.is-home .home-character-art{grid-row:span 2;width:100%;height:132px;aspect-ratio:1;border-radius:50%;align-self:center}
body.is-home .home-character-card strong{align-self:end;font-size:20px;font-weight:850}
body.is-home .home-character-card>span:last-child{align-self:start;font-size:13px;line-height:1.5}
body.is-home .home-poster-section{padding:24px 0 30px;background:#e8f6ff;border-radius:27px}
body.is-home .home-poster-section .home-section-heading{margin-bottom:9px}
body.is-home .home-section-intro{display:none}
body.is-home .home-video-grid{gap:13px}
body.is-home .home-video-thumb{border-radius:9px}
body.is-home .home-video-badge{font-size:9px;padding:3px 6px}
body.is-home .home-video-title{font-size:13px;padding-top:6px}
body.is-home .home-about-section{padding:0;margin-top:2px;background:#fff}
body.is-home .home-about-inner{grid-template-columns:.76fr 1.24fr;gap:24px;min-height:310px}
body.is-home .home-about-copy p{font-size:14px;line-height:1.65;margin:12px 0 15px}
body.is-home .home-about-inner>img{height:310px;border-radius:0 0 0 45%;object-position:center 52%}
body.is-home .home-shop-section{margin-bottom:0;width:calc(100% - 14px);padding:20px 0;border-radius:24px 24px 0 0;min-height:175px;background:linear-gradient(100deg,#ffe66a 0%,#ffdc3c 52%,#ffe975 100%)}
body.is-home .home-shop-inner{min-height:145px}
body.is-home .home-shop-inner h2{font-size:clamp(28px,3.2vw,42px);margin:4px 0 0}
body.is-home .home-shop-inner p{font-size:16px;margin:0 0 10px}
body.is-home .home-shop-art{min-width:43%;height:165px;position:relative;justify-content:flex-end;overflow:hidden;color:transparent;text-shadow:none;padding:0;background-image:url('assets/hero-characters.png');background-repeat:no-repeat;background-position:center 43%;background-size:auto 210%;mix-blend-mode:multiply}
body.is-home .home-shop-art span{display:none}
body.is-home .site-footer{background:#079dea!important;background-image:none!important}
body.is-home .hero-photo{background-size:auto 112%!important;background-position:left 28%!important}
body.is-home .home-hero{background-position:center 78%!important}
body.is-home .hero-copy{isolation:isolate}
body.is-home .hero-copy:before{content:"";position:absolute;inset:-42px -35px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(255,255,255,.66) 0%,rgba(255,255,255,.4) 48%,transparent 76%)}
@media(min-width:1200px){
  body.is-home .hero-photo{background:none!important;mix-blend-mode:normal}
  body.is-home .hero-photo:before,body.is-home .hero-photo:after{content:"";position:absolute;display:block!important;background-repeat:no-repeat;background-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;mix-blend-mode:multiply}
  body.is-home .hero-photo:before{left:12px;top:8px;width:min(34vw,460px);height:auto;aspect-ratio:1147/1080;background-image:url('assets/provided-scene-4.jpg');-webkit-mask-image:url('assets/hero-yellow-silhouette.svg');mask-image:url('assets/hero-yellow-silhouette.svg')}
  body.is-home .hero-photo:after{left:clamp(270px,22vw,350px);top:35px;width:min(37vw,500px);height:auto;aspect-ratio:1350/1080;background-image:url('assets/provided-scene-1.jpg');-webkit-mask-image:url('assets/scene-1-alpha-mask.png');mask-image:url('assets/scene-1-alpha-mask.png');clip-path:inset(0 50% 0 0)}
}
body.is-home .home-character-grid{max-width:880px;margin-inline:auto;gap:28px}
body.is-home .home-character-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;min-height:0;padding:0 8px;background:transparent!important;border-radius:0;overflow:visible}
body.is-home .home-character-art{flex:none;width:min(100%,205px);height:138px;margin:0 auto 3px;border-radius:50%;align-self:center}
body.is-home .home-character-card strong{align-self:center;font-size:18px}
body.is-home .home-character-card>span:last-child{align-self:center;max-width:230px;font-size:13px}
body.is-home .home-about-section{position:relative;isolation:isolate;overflow:hidden}
body.is-home .home-about-section:before{content:"";position:absolute;inset:0;z-index:-2;background-image:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 34%,rgba(255,255,255,.72) 57%,rgba(255,255,255,.14) 100%),url('assets/hk-skyline-bg-v2.webp');background-position:center,center 63%;background-size:cover}
html[data-region="tw"] body.is-home .home-about-section:before{background-image:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 34%,rgba(255,255,255,.72) 57%,rgba(255,255,255,.14) 100%),url('assets/taipei-skyline-bg.webp')}
html[data-region="mo"] body.is-home .home-about-section:before{background-image:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 34%,rgba(255,255,255,.72) 57%,rgba(255,255,255,.14) 100%),url('assets/macau-skyline-bg.webp')}
body.is-home .home-about-inner>img{mix-blend-mode:multiply}
body.is-home .home-shop-art{background-size:auto 128%;background-position:center 28%}
body.is-home .site-footer{position:relative;min-height:320px;padding-bottom:28px;background-color:#079dea!important;background-image:linear-gradient(180deg,#079dea 0%,rgba(7,157,234,.78) 35%,rgba(7,157,234,.08) 100%),url('assets/hk-footer-city-v1.webp')!important;background-repeat:no-repeat!important;background-size:cover!important;background-position:center bottom!important}
html[data-region="tw"] body.is-home .site-footer{background-image:linear-gradient(180deg,#079dea 0%,rgba(7,157,234,.78) 35%,rgba(7,157,234,.08) 100%),url('assets/tw-footer-city-v1.webp')!important}
html[data-region="mo"] body.is-home .site-footer{background-image:linear-gradient(180deg,#079dea 0%,rgba(7,157,234,.78) 35%,rgba(7,157,234,.08) 100%),url('assets/mo-footer-city-v1.webp')!important}
body.is-home .footer-promo{position:relative;z-index:1;padding-top:30px;color:#101c56;text-align:center;font-size:34px;font-weight:850;line-height:1.25}
body.is-home .footer-top,body.is-home .footer-bottom{position:relative;z-index:1}
@media(max-width:980px){
  body.is-home .site-header{height:66px}
  body.is-home .site-header .logo-link{width:142px;height:64px}
  body.is-home .site-header .logo-link img{width:106px;max-height:42px}
  body.is-home .site-header .brand-region-badge{width:134px;height:20px}
  body.is-home .home-hero,body.is-home .hero-grid{min-height:410px}
  body.is-home .hero-photo{width:56%;background-size:auto 116%!important;background-position:left 52%!important}
  body.is-home .home-video-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
  body.is-home .home-about-inner{grid-template-columns:.8fr 1.2fr;gap:18px}
}
@media(max-width:680px){
  body.is-home .site-header{height:62px}
  body.is-home .site-header .nav-wrap{gap:8px}
  body.is-home .site-header .logo-link{width:120px;height:60px}
  body.is-home .site-header .logo-link img{width:92px;max-height:37px}
  body.is-home .site-header .brand-region-badge{width:114px;height:18px;font-size:9px}
  body.is-home .site-header .brand-region-badge strong{font-size:9px}
  body.is-home .site-header .brand-region-place{font-size:8px}
  body.is-home .mobile-panel{top:62px}
  body.is-home .home-hero{min-height:625px;background-size:auto 48%,auto 48%;background-position:center bottom,center bottom}
  body.is-home .hero-grid{display:block;min-height:625px;padding:0 18px}
  body.is-home .hero-photo{width:100%;height:330px;bottom:auto;background-size:auto 104%!important;background-position:center top!important;mix-blend-mode:multiply}
  body.is-home .hero-copy{position:absolute;left:18px;right:18px;bottom:23px;padding:0;text-align:center}
  body.is-home .hero-brand-mark{width:142px;margin-bottom:2px}
  body.is-home .hero-copy h1{font-size:36px;line-height:1.08;margin-bottom:8px}
  body.is-home .hero-copy p{font-size:12px;margin:12px 0}
  body.is-home .hero-actions{gap:8px}
  body.is-home .hero-copy .btn{padding:12px 13px;font-size:12px;min-height:42px;gap:6px}
  body.is-home .hero-tail{height:8px}
  body.is-home .home-character-section{padding:16px 0 20px;border-radius:30px 30px 0 0}
  body.is-home .home-character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body.is-home .home-character-card{grid-template-columns:1fr;grid-template-rows:105px auto auto;justify-items:center;text-align:center;min-height:0;padding:8px;border-radius:18px}
  body.is-home .home-character-art{grid-row:auto;width:100px;height:100px}
  body.is-home .home-character-card strong{font-size:16px}
  body.is-home .home-character-card>span:last-child{font-size:11px;line-height:1.4}
  body.is-home .home-poster-section{padding:22px 0 24px;border-radius:20px}
  body.is-home .home-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 9px}
  body.is-home .home-video-title{font-size:11px}
  body.is-home .home-video-badge{font-size:8px;right:4px;bottom:4px}
  body.is-home .home-about-inner{grid-template-columns:1fr;gap:12px;padding-block:24px}
  body.is-home .home-about-inner>img{height:195px;border-radius:18px;object-fit:cover}
  body.is-home .home-shop-section{width:100%;border-radius:18px 18px 0 0;padding:19px 0}
  body.is-home .home-shop-inner{min-height:132px;gap:4px}
  body.is-home .home-shop-inner h2{font-size:26px}
  body.is-home .home-shop-inner p{font-size:14px}
  body.is-home .home-shop-art{min-width:42%;height:126px;background-size:auto 205%;background-position:center 42%}
  body.is-home .home-character-grid{max-width:100%;gap:14px}
  body.is-home .home-character-art{width:min(100%,145px);height:112px}
  body.is-home .home-character-card strong{font-size:16px}
  body.is-home .home-character-card>span:last-child{font-size:11px}
  body.is-home .home-about-section:before{background-position:center,center 60%}
  body.is-home .home-shop-art{background-size:auto 126%;background-position:center 27%}
  body.is-home .site-footer{min-height:280px;background-position:center bottom!important}
  body.is-home .footer-promo{padding-top:24px;font-size:27px}
}

/* Final reference alignment overrides */
@media(min-width:1200px){
  body.is-home .home-hero,body.is-home .hero-grid{min-height:410px}
  body.is-home .hero-photo{width:64%}
  body.is-home .hero-photo:before{left:8px;top:-20px;width:min(39vw,530px)}
  body.is-home .hero-photo:after{left:clamp(285px,23vw,370px);top:14px;width:min(43vw,570px);clip-path:inset(0 0 0 49%)}
  body.is-home .hero-copy{padding-top:22px;padding-bottom:26px}
  body.is-home .hero-copy:before{inset:-12px -28px;background:radial-gradient(ellipse at center,rgba(255,255,255,.74) 0%,rgba(255,255,255,.45) 50%,transparent 78%)}
  body.is-home .hero-brand-mark{width:min(280px,24vw);margin:0 0 2px}
  body.is-home .hero-copy h1{font-size:clamp(48px,4.25vw,66px);line-height:1.05;margin-bottom:12px;font-weight:950;color:#10143a}
  body.is-home .hero-copy p{font-size:17px;margin:17px 0 20px}
  body.is-home .hero-copy .btn{padding:15px 23px;font-size:15px}
  body.is-home .home-character-section{padding:14px 0 22px;margin-top:-12px}
  body.is-home .home-section-heading{margin-bottom:7px}
  body.is-home .home-kicker{display:block;color:#586779;font-size:14px;font-weight:600;margin:2px 0 0}
  body.is-home .home-character-grid{max-width:1160px;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1.1vw,16px)}
  body.is-home .home-character-card{display:flex;min-width:0;min-height:0;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:0 5px 8px}
  body.is-home .home-character-art{width:min(100%,190px);height:clamp(112px,12vw,150px);max-width:190px;margin:0 auto 1px;border-radius:50%}
  body.is-home .home-character-card strong{align-self:center;font-size:clamp(14px,1.35vw,18px);line-height:1.25}
  body.is-home .home-character-card>span:last-child{align-self:center;max-width:190px;font-size:clamp(11px,.98vw,13px);line-height:1.45}
}
@media(min-width:1200px){body.is-home .hero-photo:after{left:clamp(260px,21vw,330px);width:min(40vw,520px);clip-path:inset(0 50% 0 0)}}
@media(min-width:1200px){
  body.is-home .hero-photo{background-image:url('assets/provided-red-yellow-4.jpg')!important;background-repeat:no-repeat!important;background-position:left bottom!important;background-size:auto 116%!important;mix-blend-mode:multiply}
  body.is-home .hero-photo:before,body.is-home .hero-photo:after{display:none!important;content:none!important}
}
/* Use the same unmodified official pair artwork for both character masks. */
body.is-home .hero-photo{background-image:none!important;background-color:transparent!important;mix-blend-mode:normal!important}
body.is-home .hero-photo:before,body.is-home .hero-photo:after{content:"";position:absolute;display:block!important;background-repeat:no-repeat;background-size:100% 100%;mix-blend-mode:normal!important;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;clip-path:none}
body.is-home .hero-photo:before{background-image:url('assets/provided-red-yellow-4.jpg')!important;-webkit-mask-image:url('assets/hero-yellow-silhouette.svg')!important;mask-image:url('assets/hero-yellow-silhouette.svg')!important}
body.is-home .hero-photo:after{background-image:url('assets/provided-red-yellow-4.jpg')!important;-webkit-mask-image:url('assets/hero-red-silhouette.svg')!important;mask-image:url('assets/hero-red-silhouette.svg')!important}
@media(min-width:1200px){body.is-home .hero-photo:before{left:8px;top:-15px;width:min(39vw,530px);aspect-ratio:1147/1080}body.is-home .hero-photo:after{left:clamp(260px,21vw,330px);top:7px;width:min(40vw,520px);aspect-ratio:1147/1080}}
@media(max-width:1199px){body.is-home .hero-photo:before{left:-2%;top:0;width:67%;height:100%}body.is-home .hero-photo:after{left:32%;top:18px;width:68%;height:95%}}
body.is-home .hero-photo:before,body.is-home .hero-photo:after{content:""!important;display:block!important}
@media(min-width:1200px){body.is-home .hero-photo:after{top:-78px}}
/* Match the reference's stronger Yellow/Red scale while preserving Red's source ratio. */
@media(min-width:1200px){body.is-home .hero-photo:after{transform:scale(1.3);transform-origin:50% 100%}}
@media(max-width:1199px){body.is-home .hero-photo:before{left:-1%;top:0;width:65%;height:auto;aspect-ratio:1147/1080}body.is-home .hero-photo:after{left:31%;top:95px;width:64%;height:auto;aspect-ratio:1147/1080}}
@media(min-width:681px){body.is-home .home-about-inner>img{height:310px;object-fit:contain;object-position:right center}}

/* The five supplied character portraits belong in both character introductions. */
body.is-home .home-character-art{position:relative;overflow:hidden;background:#fff4bc}
body.is-home .home-character-art.red{background:#ffe1e5}
body.is-home .home-character-art.pink{background:#ffe8ed}
body.is-home .home-character-art.dung{background:#e6f4df}
body.is-home .home-character-art.rhino{background:#e8e4ff}
body.is-home .home-character-art:before{display:none!important;content:none!important}
body.is-home .home-character-art img{display:block;position:relative;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center bottom}

/* Keep the newer five character portraits exclusive to character-introduction sections. */
body.is-home .home-shop-art{position:relative;display:block;flex:0 1 50%;min-width:43%;height:210px;padding:0;background-image:url('/assets/hero-characters.png')!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;mix-blend-mode:normal!important;overflow:visible;color:transparent;text-shadow:none}
body.is-home .home-shop-art .merch-concept-label{position:absolute;right:0;bottom:0;padding:4px 9px;border-radius:20px;background:#fff9dc;color:#735c0d;font-size:11px;font-weight:750;white-space:nowrap}
@media(max-width:680px){body.is-home .home-shop-art{flex:0 0 43%;min-width:43%;height:132px;background-size:contain!important;background-position:center!important}body.is-home .home-shop-art .merch-concept-label{right:0;bottom:0;font-size:8px;padding:3px 6px}}
