/* Wang Ting Creative Universe — mobile-first editorial adaptation.
   Desktop artwork and motion remain unchanged. */
@media (max-width:1024px), (max-aspect-ratio:4/5){
 :root{--m-navy:#061d39;--m-ink:#06182e;--m-gold:#ecc28b;--m-soft:#f4dcc0;--m-line:rgba(235,193,139,.29)}
 html{scroll-snap-type:none;scroll-padding-top:72px;scroll-behavior:smooth}
 body{overflow-x:hidden; background:var(--m-navy);color:var(--m-soft)}
 main{overflow:hidden}
 .page{height:auto!important;min-height:0!important;display:block!important;overflow:visible!important;scroll-snap-align:none!important;scroll-margin-top:60px;background:#061d39!important}
 .page:nth-child(even){background:#092448!important}
 .art-frame{display:none!important}
 .mobile-copy,.mobile-home-copy{display:block!important;position:relative;width:100%;max-width:720px;margin:0 auto;box-sizing:border-box;overflow:visible}
 .mobile-header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;height:62px;padding:0 21px;padding-left:max(21px,env(safe-area-inset-left));padding-right:max(21px,env(safe-area-inset-right));background:rgba(4,18,35,.93);border-bottom:1px solid var(--m-line);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
 .mobile-header>a{font:700 12px Georgia,serif;letter-spacing:.25em;color:#f4d19f;white-space:nowrap}
 .mobile-header>button{font:26px/1 Arial,sans-serif;width:46px;height:46px;border:0;background:transparent;color:#f4d19f;display:grid;place-items:center;cursor:pointer}
 .mobile-header nav{top:62px;left:0;right:0;display:none;position:absolute;z-index:101;flex-direction:column;gap:0;padding:12px 24px 22px;background:#071b33;box-shadow:0 18px 25px rgba(0,0,0,.4);border-bottom:1px solid var(--m-line)}
 .mobile-header nav.open{display:flex}
 .mobile-header nav a{display:flex;align-items:center;font:700 15px/1.3 Georgia,serif;letter-spacing:.18em;padding:18px 8px;border-bottom:1px solid rgba(241,202,145,.16)}
 .mobile-copy.mobile-rebuilt{padding:62px max(22px,env(safe-area-inset-left)) 82px max(22px,env(safe-area-inset-right));max-width:760px}
 .m-overline{margin:0!important;display:flex;align-items:center;justify-content:space-between;gap:10px;font:700 10px/1.4 Georgia,serif!important;letter-spacing:.22em!important;color:#f1bc7e!important}
 .m-overline span:not(.m-star){opacity:.75}
 .m-overline .m-star{font-size:20px;line-height:0}
 .m-section-title{font:800 clamp(35px,9vw,60px)/1.25 var(--serif)!important;letter-spacing:-.035em!important;color:#ffe5ba!important;margin:18px 0 3px!important}
 .m-section-title .m-accent,.m-section-title em{font-style:normal;color:#efb86d}
 .m-section-subtitle{font:italic 12px/1.6 Georgia,serif!important;letter-spacing:.15em!important;color:#ecc698!important;margin:0!important}
 .m-section-label{font:700 10px/1.5 Georgia,serif;letter-spacing:.16em;color:#f2bd7b;text-transform:uppercase;margin-bottom:12px}

 /* Hero: editorial typography + isolated zero-gravity portrait */
 .mobile-home-copy.mobile-rebuilt{width:100%;max-width:none;min-height:calc(100svh - 62px);padding:clamp(28px,8vw,65px) 24px 18px;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;background:radial-gradient(ellipse at 50% 49%,#0e427c 0%,#092a51 45%,#04182f 88%);isolation:isolate;overflow:hidden}
 .m-hero-intro{width:100%;max-width:570px;text-align:center;position:relative;z-index:3}
 .m-hero-intro .m-overline{justify-content:center;letter-spacing:.18em!important;font-size:10px!important}
 .m-hero-name{display:flex;align-items:center;justify-content:center;gap:15px;font:600 19px/1.2 var(--serif);letter-spacing:.16em;margin:24px 0 8px;color:#f8d8ab}
 .m-hero-name span{font:italic 10px Georgia,serif;letter-spacing:.22em;opacity:.86}
 .m-hero-intro h1{margin:0 auto;font:900 clamp(36px,10.8vw,69px)/1.19 var(--serif);color:#ffe8c2;letter-spacing:-.075em;white-space:normal;max-width:650px;text-shadow:0 0 24px rgba(240,171,103,.34),0 3px 0 rgba(139,79,26,.25)}
 .m-hero-intro h1 span{display:block;line-height:1.05;font-size:.76em;letter-spacing:-.08em;margin-top:4px}
 .m-hero-en{margin:18px 0 0!important;font:italic 11px/1.4 Georgia,serif!important;letter-spacing:.25em;color:#edc89b!important}
 .m-hero-stage{position:relative;width:min(110vw,530px);height:clamp(285px,76vw,500px);min-height:0;flex:none;margin-top:3px;align-self:center;z-index:2}
 .m-hero-stage:before{content:'';position:absolute;inset:22% 4% 3%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(239,172,103,.13),transparent 69%);filter:blur(6px)}
 .m-hero-arc{position:absolute;inset:30% -13% 17%;border:2px solid rgba(248,193,115,.67);box-shadow:0 0 23px rgba(249,186,95,.25);border-radius:50%;transform:rotate(-21deg);z-index:0}
 .m-hero-astronaut{position:absolute;left:50%;bottom:-18%;transform:translateX(-50%);width:100%;max-width:540px;height:auto;object-fit:contain;z-index:2;filter:drop-shadow(0 18px 25px rgba(0,0,0,.26));animation:m-hero-bob 5.7s ease-in-out infinite alternate}
 @keyframes m-hero-bob{from{translate:0 2px}to{translate:0 -11px}}
 .m-scroll-cue{display:flex;justify-content:center;align-items:center;gap:10px;position:relative;z-index:5;font:12px/1.2 var(--sans);letter-spacing:.1em;color:#f6d7ae;border:1px solid rgba(252,205,148,.59);border-radius:30px;padding:12px 21px;background:rgba(5,31,62,.87);margin-top:auto;margin-bottom:12px}
 .m-scroll-cue>span:last-child{font-size:20px}

 /* Work wall: mobile-readable two-column orbit cards instead of microscopic desktop orbit */
 .mobile-work{padding-top:67px!important}
 .m-small-star{display:inline-block;margin-left:10px;color:#f6c67b;font-size:30px;vertical-align:middle}
 .m-work-stage{position:relative;height:clamp(210px,57vw,350px);margin:17px -14px 0;display:flex;align-items:center;justify-content:center;overflow:hidden;isolation:isolate}
 .m-work-ring{position:absolute;width:103%;height:55%;border:2px solid rgba(241,183,90,.65);border-radius:50%;top:33%;left:-1.5%;transform:rotate(-14deg);filter:drop-shadow(0 0 7px #caa86a)}
 .m-work-stage:before{content:'';position:absolute;top:50%;left:50%;width:80%;height:83%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(14,52,92,.62),transparent 74%)}
 .m-work-stage img{position:relative;z-index:2;width:95%;height:110%;object-fit:contain;filter:drop-shadow(0 6px 22px rgba(0,0,0,.35));animation:m-hero-bob 5.8s ease-in-out infinite alternate}
 .m-work-description{text-align:center;color:#f5deb9!important;font:15px/1.65 var(--serif)!important;margin:9px 0 22px!important}
 .m-work-description span{font-size:13px;color:#d7ae84}
 .m-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .m-project-card{display:flex;min-width:0;flex-direction:column;align-items:flex-start;position:relative;overflow:hidden;border:1px solid rgba(242,191,124,.42);border-radius:16px;padding:12px 11px 17px;background:linear-gradient(145deg,rgba(20,55,93,.76),rgba(3,19,39,.92));box-shadow:inset 0 0 25px rgba(245,189,104,.055);min-height:254px}
 .m-project-card:active{transform:scale(.985)}
 .m-card-meta{display:flex;width:100%;justify-content:space-between;align-items:center;font:10px Georgia,serif;letter-spacing:.08em;color:#caa273}
 .m-card-meta span:last-child{font-size:16px}
 .m-planet-img{width:100%;height:132px;display:grid;place-items:center;flex:none;pointer-events:none}
 .m-planet-img img{display:block;width:min(126px,100%);height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 0 12px rgba(250,196,109,.22))}
 .m-project-card strong{display:block;color:#ffe3b4;font:700 15px/1.32 var(--serif);margin-top:5px;overflow-wrap:anywhere}
 .m-card-sub{font:13px/1.45 var(--serif);color:#e5c094;margin-top:6px;min-height:37px}
 .m-card-type{font:8.5px/1.2 Georgia,serif;letter-spacing:.10em;color:#b0a0a0;margin-top:auto;padding-top:12px}

 /* Individual case studies: generous native mobile typography and playable 16:9 media */
 .m-case-page{background:transparent}
 .m-case-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#cfaa7d;font:10px/1.2 Georgia,serif;letter-spacing:.11em}
 .m-back-link{padding:8px 0;min-height:36px;display:flex;align-items:center}
 .m-case-category{margin:26px 0 9px!important;font:700 10px/1.4 Georgia,serif!important;color:#f0bd7b!important;letter-spacing:.18em!important}
 .m-case-project-name{font:700 clamp(27px,7.7vw,47px)/1.3 var(--serif)!important;color:#ffdfb1!important;margin:0 0 9px!important;letter-spacing:-.018em!important;overflow-wrap:anywhere}
 .m-case-project-en{font:italic 12px/1.45 Georgia,serif!important;letter-spacing:.08em;color:#cdb795!important;margin:0 0 25px!important}
 .m-case-media-wrap{position:relative;margin:0 -22px}
 .m-case-media{width:100%;max-width:none;height:auto;aspect-ratio:16/9;display:block;object-fit:cover;background:#061427;border:0;border-radius:0;box-shadow:none;margin:0!important}
 .m-case-media:is(video){object-fit:contain;aspect-ratio:16/9;border-top:1px solid rgba(236,186,112,.42);border-bottom:1px solid rgba(236,186,112,.42)}
 .m-case-art{object-fit:cover}
 .m-media-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 22px;font:10px Georgia,serif;letter-spacing:.11em;color:#e7bc80;background:rgba(3,15,29,.34)}
 .m-feature-insight{margin:38px 0 34px;padding:12px 0 26px;border-bottom:1px solid var(--m-line)}
 .m-feature-insight>p{font:700 10px/1.4 Georgia,serif!important;color:#dfb17e!important;letter-spacing:.15em!important;margin:0 0 13px!important}
 .m-feature-insight h3{font:800 clamp(26px,6.9vw,40px)/1.48 var(--serif)!important;letter-spacing:-.04em;color:#fff0d4!important;margin:0 0 18px!important;text-wrap:balance}
 .m-feature-insight h3 span{color:#efb971;text-shadow:0 0 18px rgba(246,180,94,.26)}
 .m-quote-en{font:italic 13px/1.64 Georgia,serif;color:#d8c4a5;padding-left:14px;border-left:2px solid rgba(240,182,100,.64)}
 .m-case-subsection{margin-bottom:30px;padding-bottom:22px;border-bottom:1px solid rgba(235,192,135,.17)}
 .m-case-subsection h4{margin:0 0 12px;font:700 22px/1.4 var(--serif);color:#fce3bd}
 .m-case-subsection>p{font:15px/1.85 var(--sans)!important;color:#ddccbb!important;margin:0!important;overflow-wrap:anywhere}
 .m-platforms{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .m-platforms>div{border:1px solid var(--m-line);padding:14px 12px;border-radius:11px;background:rgba(8,36,67,.8);min-width:0;display:flex;flex-direction:column;gap:8px}
 .m-platforms small{font:9px Georgia,serif;color:#b5a4a1;letter-spacing:.12em}
 .m-platforms b{font:700 18px var(--serif);color:#ffdbab}
 .m-platforms span{font:12px/1.5 var(--sans);color:#dfc5a6}
 .m-supporting-text{margin-top:14px!important;color:#eac99e!important;font-size:13px!important}
 .m-steps{list-style:none;margin:0;padding:0;border-top:1px solid rgba(240,188,126,.2)}
 .m-steps li{display:grid;grid-template-columns:40px 1fr;gap:10px;padding:16px 2px;border-bottom:1px solid rgba(240,188,126,.16);align-items:start}
 .m-steps li span{font:italic 18px Georgia,serif;color:#dfaf75}
 .m-steps li p{font:14px/1.72 var(--sans)!important;margin:0!important;color:#e7d2bc!important}
 .m-case-role{border-radius:16px;border:1px solid rgba(241,186,119,.47);padding:20px 14px 14px;background:radial-gradient(ellipse at 10% 50%,rgba(25,59,91,.7),rgba(5,23,43,.92));margin-top:31px;overflow:hidden}
 .m-role-grid{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;gap:8px}
 .m-role-visual{width:122px;height:120px;position:relative;margin-left:-20px;align-self:center}
 .m-role-visual img{position:absolute;left:-25px;top:-3px;width:170px;height:130px;object-fit:contain;animation:m-hero-bob 6s ease-in-out infinite alternate}
 .m-role-tags{display:flex;flex-wrap:wrap;gap:8px;align-content:center}
 .m-role-tags span{font:12px/1.3 var(--sans);border-radius:16px;padding:6px 10px;color:#f2ce9f;border:1px solid rgba(236,190,122,.38);background:rgba(5,19,38,.64);white-space:normal}
 .m-original-art{display:flex!important;justify-content:space-between;align-items:center;gap:12px;width:100%;margin:17px auto 0!important;padding:14px 17px!important;background:rgba(245,196,134,.08)!important;text-align:left;border:1px solid rgba(233,190,125,.4)!important;border-radius:10px!important;color:#f5d7ac!important;font:13px var(--sans)!important}
 .m-next-project{display:flex;align-items:center;gap:11px;border-top:1px solid var(--m-line);margin-top:36px;padding-top:21px;color:#f4d8b5}
 .m-next-project>span:first-child{font:9px/1.4 Georgia,serif;letter-spacing:.13em;color:#bda17e;max-width:98px}
 .m-next-project strong{font:700 17px/1.3 var(--serif);margin-left:auto}
 .m-next-project>span:last-child{font:22px/1 Georgia,serif}

 /* Experience timeline with astronaut cockpit image */
 .mobile-about-v2 .m-about-title{margin:14px 0 14px!important;line-height:1.38!important}
 .m-about-art{margin:30px -22px 0;overflow:hidden;position:relative;height:clamp(270px,75vw,430px);background:#04172c}
 .m-about-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:28% center}
 .m-about-art:after{content:'';position:absolute;left:0;bottom:-1px;right:0;height:35%;background:linear-gradient(transparent,#061d39)}
 .m-about-intro{font:15px/1.9 var(--sans)!important;color:#e4cdb3!important;padding:5px 0 25px;margin:18px 0!important}
 .m-timeline{padding:8px 0 0 19px;margin:6px 0 0;list-style:none;border-left:1px solid rgba(247,199,119,.4)}
 .m-timeline li{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;position:relative;padding:0 10px 21px 14px;margin:0 0 5px;border:0!important}
 .m-timeline li:before{content:'';position:absolute;width:8px;height:8px;border-radius:50%;left:-24px;top:8px;background:#efc081;box-shadow:0 0 13px rgba(253,205,112,.58)}
 .m-timeline time{font:12px Georgia,serif;color:#e4b57c}
 .m-timeline strong{font:700 19px/1.5 var(--serif);color:#f8e0bb}
 .m-timeline span{font:14px/1.5 var(--sans);color:#cbbfae}

 /* Contact: UFO drop, large touch-friendly buttons */
 .mobile-contact-v2{padding-bottom:50px!important}
 .m-contact-scene{width:calc(100% + 44px);height:clamp(315px,94vw,520px);position:relative;overflow:hidden;margin:4px -22px 4px;isolation:isolate;background:radial-gradient(ellipse at 50% 25%,rgba(13,42,68,.5),transparent 75%)}
 .m-contact-starfield{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(250,220,171,.65) .7px,transparent 1.2px);background-size:38px 46px;opacity:.24}
 .m-ufo{position:absolute;z-index:3;top:2%;left:19%;width:62%;height:auto;filter:drop-shadow(0 0 12px rgba(237,152,54,.35))}
 .m-ufo-beam{position:absolute;z-index:1;top:17%;left:14%;width:72%;height:75%;clip-path:polygon(37% 0%,63% 0%,95% 100%,5% 100%);background:radial-gradient(ellipse at 50% 0%,rgba(255,223,130,.55),rgba(112,190,99,.24) 38%,transparent 90%);filter:blur(2px)}
 .m-floating-person{position:absolute;z-index:4;left:7%;top:42%;width:86%;height:auto;filter:drop-shadow(0 10px 15px rgba(0,0,0,.3))}
 .page-contact.m-inview .m-floating-person{animation:m-contact-arrival 1.6s ease-out both, m-hero-bob 5.9s ease-in-out 1.6s infinite alternate}
 @keyframes m-contact-arrival{from{opacity:0;transform:translateY(-80px) scale(.84)}70%{opacity:1;transform:translateY(9px) scale(1)}to{opacity:1;transform:translateY(0) scale(1)}}
 .m-contact-title{font:700 32px/1.25 var(--serif);margin:15px 0 23px;color:#ffe0b7;text-align:center}
 .m-contact-title span{display:block;font:italic 11px Georgia,serif;letter-spacing:.24em;color:#dab788;margin-top:10px}
 .m-contact-methods{border-top:1px solid var(--m-line)}
 .m-contact-methods a,.m-contact-methods button{display:grid;grid-template-columns:35px 1fr;grid-template-rows:auto auto;gap:2px 10px;align-items:center;width:100%;min-height:81px;text-align:left;color:#ffe0b0;border:0;border-bottom:1px solid var(--m-line);padding:14px 5px;background:transparent;font:inherit;cursor:pointer}
 .m-contact-icon{grid-row:span 2;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--m-line);border-radius:50%;font:18px Georgia,serif;color:#e1b778}
 .m-contact-label{font:10px Georgia,serif;letter-spacing:.18em;color:#bda486}
 .m-contact-methods strong{font:italic clamp(18px,5.7vw,25px) Georgia,serif;color:#ffe4be;overflow-wrap:anywhere;min-width:0}
 .m-contact-farewell{font:9px/1.8 Georgia,serif!important;color:#b89c7d!important;text-align:center;letter-spacing:.16em!important;margin:37px 0 19px!important}
 .m-home-return{display:block;text-align:center;color:#eac595;font:13px/1.4 var(--sans);padding:13px}

 .toast{max-width:calc(100vw - 38px);text-align:center;font-size:13px;bottom:max(24px,env(safe-area-inset-bottom))}
 .art-modal{max-width:100vw;width:100vw;max-height:96svh;padding:10px;border-radius:10px;overflow:auto}
 .art-modal>img{max-width:none;width:1200px;height:auto;max-height:none;object-fit:contain}
 .art-modal>button{position:sticky;top:0;left:calc(100% - 45px);z-index:3}
}
@media (max-width:360px){
 .m-project-grid{gap:9px}.m-project-card{padding:9px 9px 13px;min-height:235px}.m-planet-img{height:116px}.m-card-sub{font-size:12px}.m-project-card strong{font-size:14px}
 .m-role-grid{grid-template-columns:86px 1fr}.m-role-visual{width:106px}.m-role-visual img{width:155px}
 .m-feature-insight h3{font-size:25px!important}
}
@media (min-width:761px) and (max-width:1024px) and (min-aspect-ratio:4/5){
 /* Landscape tablet/phone: choose the mobile reading layout rather than a tiny compressed desktop poster. */
 .mobile-header,.mobile-copy,.mobile-home-copy{display:block}
 .mobile-header{display:flex}
}
@media (prefers-reduced-motion:reduce){
 .m-hero-astronaut,.m-work-stage img,.m-role-visual img,.m-floating-person{animation:none!important;translate:none!important;transform:none!important}
 .m-hero-astronaut{transform:translateX(-50%)!important}
}

/* Mobile home — restore the original black-hole silhouette and gold accretion light,
   based on the same black-hole reference used during the desktop design process.
   Desktop, other sections, nav and content remain unchanged. */
@media (max-width:1024px), (max-aspect-ratio:4/5) {
  .page-home .mobile-home-copy.mobile-rebuilt{
    background:radial-gradient(ellipse at 58% 50%,#0e3d73 0%,#08264a 48%,#04182f 91%);
  }
  .page-home .m-hero-stage{isolation:isolate;}
  .page-home .m-hero-arc{display:none;}
  .page-home .m-hero-stage::before{
    content:"";
    position:absolute;
    top:-11%;
    left:-42%;
    width:146%;
    height:auto;
    aspect-ratio:16/9;
    inset-block-end:auto;
    background: url("assets/mobile_blackhole.webp") center / 100% 100% no-repeat;
    border-radius:0;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 91%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 91%,transparent 100%);
    filter:none;
    opacity:1;
    pointer-events:none;
    z-index:1;
  }
  .page-home .m-hero-astronaut{z-index:2;}
}


/* V10: explicit, prominent, cache-fresh mobile black-hole element.
   This layer is in the DOM rather than relying on a pseudo-element in the
   astronaut stage. Desktop and all other sections remain unchanged. */
@media (max-width:1024px), (max-aspect-ratio:4/5) {
  .page-home .mobile-home-copy.mobile-rebuilt {
    position:relative;
    isolation:isolate;
    background:radial-gradient(ellipse at 45% 46%,#103d77 0%,#072647 55%,#04182f 100%);
  }
  .page-home .m-blackhole-layer {
    display:block;
    position:absolute;
    left:-5%;
    top:24%;
    width:149%;
    height:auto;
    z-index:1;
    pointer-events:none;
    opacity:0.96;
  }
  .page-home .m-blackhole-layer img {
    display:block;
    width:100%;
    height:auto;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 84%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,black 10%,black 84%,transparent 100%);
  }
  .page-home .m-hero-stage::before,
  .page-home .m-hero-arc { display:none!important; }
  .page-home .m-hero-stage { z-index:2; isolation:auto; }
  .page-home .m-hero-intro { z-index:3; }
  .page-home .m-scroll-cue { z-index:4; }
}
@media (min-width:1025px) and (min-aspect-ratio:4/5) {
  .page-home .m-blackhole-layer {display:none;}
}

/* V11 MOBILE ART-DIRECTION PROPOSAL — original project content & original astronaut */
@media (max-width:1024px), (max-aspect-ratio:4/5) {
  :root { --m-night:#06152a; --m-deep:#071a32; --m-blue:#08244a; --m-gold:#f1c993; --m-ivory:#f9e9cb; --m-muted:#c5b8ad; }
  html { scroll-padding-top:64px; }
  body { background:#04182b; }
  main { background:#04182b; }
  .page,.page:nth-child(even){background:linear-gradient(170deg,#05162a 0%,#071d39 72%,#031324 100%)!important;}
  .mobile-header{height:60px;background:rgba(3,16,31,.92);border-bottom:1px solid rgba(235,189,123,.20);padding-inline:21px;}
  .mobile-header>a { letter-spacing:.26em;font-size:12px;color:#eec89b;text-shadow:0 0 14px rgba(235,178,87,.20);}
  .mobile-header>button{font-size:23px}
  .mobile-header nav{top:60px;background:#061a32}
  .mobile-copy.mobile-rebuilt{padding:48px 22px 72px;}
  .m-overline {font-size:10px!important; letter-spacing:.15em!important;color:#edc18a!important;}
  .m-section-title{font-weight:750!important;letter-spacing:-.055em!important;font-size:clamp(35px,9.2vw,62px)!important}
  .m-section-subtitle{font-size:12px!important;letter-spacing:.17em!important}

  /* HERO: original Black Hole / original portrait, dramatic editorial framing */
  .page-home .mobile-home-copy.mobile-rebuilt {
    padding:0 20px 28px!important;
    min-height:calc(100svh - 60px)!important;
    background:radial-gradient(ellipse at 63% 43%,#0b3870 0%,#061c3d 56%,#021323 100%)!important;
    justify-content:flex-start; overflow:hidden; isolation:isolate;
  }
  .page-home .mobile-home-copy::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.21;z-index:0;background-image:radial-gradient(1px 1px at 15% 19%,#fff 90%,transparent),radial-gradient(1px 1px at 84% 13%,#e6e2df 90%,transparent),radial-gradient(1px 1px at 80% 77%,#fff 90%,transparent),radial-gradient(1px 1px at 32% 72%,#fff 90%,transparent);background-size:100% 100%}
  .page-home .m-hero-intro{z-index:4;flex:none;text-align:left;width:100%;margin:0;padding-top:25px;}
  .page-home .m-hero-intro .m-overline{justify-content:flex-start!important;font-size:8px!important;letter-spacing:.18em!important;opacity:.75;margin:0 0 15px!important;}
  .page-home .m-hero-name{display:block;text-align:left;font-size:18px;margin:0 0 12px 0;letter-spacing:.25em;line-height:1.2}
  .page-home .m-hero-name span{margin-left:10px;font-size:8px;letter-spacing:.16em;opacity:.65}
  .page-home .m-hero-intro h1{font-size:clamp(38px,10.5vw,66px);letter-spacing:-.065em;line-height:1.11;text-align:left;margin:0;max-width:95%;text-shadow:0 2px 14px rgba(245,182,106,.20);}
  .page-home .m-hero-intro h1 span{display:inline;font-size:.60em;letter-spacing:-.065em;white-space:nowrap;margin-left:.14em;}
  .page-home .m-hero-en{font:italic 12px/1.45 Georgia,serif!important;letter-spacing:.11em!important;margin:16px 0 0!important;text-transform:none;color:#e8cba5!important;}
  .page-home .m-blackhole-layer{position:absolute!important;left:-10%!important;top:29%!important;width:153%!important;z-index:1!important;opacity:.92!important;pointer-events:none;mix-blend-mode:screen}
  .page-home .m-blackhole-layer img{width:100%;mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 87%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 87%,transparent 100%);}
  .page-home .m-hero-stage{position:relative;width:118%;height:clamp(335px,97vw,510px);margin:-10px 0 0 -13%;z-index:3;overflow:visible;flex:none;}
  .page-home .m-hero-stage::before,.page-home .m-hero-arc {display:none!important}
  .page-home .m-hero-astronaut{position:absolute;left:52%;bottom:-1%;transform:translateX(-50%);width:111%;max-width:650px;object-fit:contain;filter:drop-shadow(0 16px 32px rgba(0,0,0,.28));will-change:translate;}
  .page-home .m-scroll-cue{margin-top:auto;margin-bottom:12px;position:relative;z-index:6;width:fit-content;padding:13px 23px;background:rgba(3,16,32,.66);border-color:rgba(250,205,149,.72);box-shadow:0 0 22px rgba(4,15,30,.2);font-size:12px}
  @keyframes m-hero-bob {0%,100%{translate:0 0}50%{translate:0 -13px}}

  /* SIX ORBITING PROJECTS. Exactly one full-body astronaut in the project wall. */
  .page-projects{background:radial-gradient(circle at 50% 35%,#0e3468,#061933 80%)!important}
  .mobile-work{padding-top:55px!important}
  .mobile-work .m-overline{justify-content:center}
  .mobile-work .m-section-title{text-align:center;margin-top:13px!important;font-size:clamp(37px,9vw,62px)!important}
  .mobile-work .m-section-subtitle{text-align:center}
  .m-work-stage{height:310px;margin:12px -22px 0;overflow:hidden;}
  .m-work-ring{width:94%;height:49%;top:37%;left:3%;transform:rotate(-18deg);opacity:.68;box-shadow:0 0 19px rgba(254,182,73,.12);}
  .m-work-stage:before{height:85%;width:86%;top:53%}
  .m-work-stage>img{position:absolute;left:50%;top:13%;transform:translateX(-50%);width:77%;height:auto;max-height:286px;object-fit:contain;z-index:4;animation:none;filter:drop-shadow(0 15px 18px rgba(0,0,0,.18));}
  .m-work-stage.is-visible>img{animation:m-wall-drop 1.05s cubic-bezier(.18,.7,.2,1) both,m-mobile-wall-bob 6s ease-in-out 1.05s infinite;}
  @keyframes m-wall-drop{from{opacity:0;translate:0 -115px;scale:.89}to{opacity:1;translate:0 0;scale:1}}
  @keyframes m-mobile-wall-bob{0%,100%{translate:0 0}50%{translate:0 -9px}}
  .m-work-planets{position:absolute;left:5%;top:8%;width:90%;height:85%;z-index:3;transform-origin:50% 53%;animation:m-orbit-spin 48s linear infinite;pointer-events:none;}
  .m-work-orb{position:absolute;display:block;width:22%;aspect-ratio:1;transform:translate(-50%,-50%);}
  .m-work-orb img{width:100%;height:100%;object-fit:contain;display:block;animation:m-orbit-anti 48s linear infinite;filter:drop-shadow(0 0 8px rgba(244,187,107,.15));}
  .m-work-orb-1{left:24%;top:13%}.m-work-orb-2{left:2%;top:52%}.m-work-orb-3{left:27%;top:91%}
  .m-work-orb-4{left:76%;top:13%}.m-work-orb-5{left:98%;top:52%}.m-work-orb-6{left:73%;top:91%}
  @keyframes m-orbit-spin{to{transform:rotate(360deg)}}@keyframes m-orbit-anti{to{transform:rotate(-360deg)}}
  .m-work-description{font-size:13px!important;margin:1px 0 26px!important;opacity:.88;}
  .m-work-description span{font-size:11px}
  .m-project-grid{gap:12px;}
  .m-project-card{background:linear-gradient(155deg,rgba(18,46,80,.68),rgba(4,19,38,.97));border-radius:16px;border-color:rgba(248,190,119,.33);padding:8px 8px 14px;min-height:245px;box-shadow:0 10px 22px rgba(0,0,0,.12);}
  .m-card-meta{padding:6px 5px 0;font-size:8px}
  .m-planet-img{height:119px;width:100%;border-radius:10px;overflow:hidden;margin-top:8px;background:#091829;}
  .m-planet-img img{width:100%;height:100%;max-width:unset;aspect-ratio:auto;object-fit:cover;filter:none;}
  .m-project-card strong{font:700 14px/1.4 var(--serif);margin:13px 4px 0;}
  .m-card-sub{font-size:12px;min-height:35px;margin:4px 4px 0;}
  .m-card-type{font-size:8px;margin:0 4px;letter-spacing:.065em;padding-top:7px}

  /* ACTUAL SIX CASE PAGES. Real posters and real video, same role avatar. */
  .m-case-page{padding-top:37px!important;}
  .m-case-topline{font-size:9px;color:#dbb17d}
  .m-case-category{margin:25px 0 7px!important;font-size:9px!important}
  .m-case-project-name{font-size:clamp(30px,8vw,46px)!important;font-weight:750!important;line-height:1.28!important;letter-spacing:-.045em!important}
  .m-case-project-en{font-size:10px!important;letter-spacing:.08em;margin:6px 0 9px!important}
  .m-case-campaign-title{font:600 17px/1.5 var(--serif)!important;color:#eac38e!important;margin:0 0 21px!important;letter-spacing:.03em}
  .m-case-media-wrap{margin:0 -3px;overflow:hidden;border:1px solid rgba(235,191,117,.6);border-radius:16px;background:#061326;box-shadow:0 20px 40px rgba(0,0,0,.18)}
  .m-case-media{border-radius:0;aspect-ratio:16/9;object-fit:cover}
  .m-case-media:is(video){border:0;aspect-ratio:16/9}
  .m-media-caption{font-size:9px;padding:12px 14px;background:rgba(3,17,33,.87);color:#bf9c77}
  .m-feature-insight{border:0;margin:34px 0 27px;padding:0 0 28px;position:relative}
  .m-feature-insight::after{content:'';position:absolute;bottom:0;left:0;width:45%;height:1px;background:linear-gradient(90deg,#dbad70,transparent)}
  .m-feature-insight h3{font-size:clamp(27px,7.1vw,43px)!important;font-weight:750!important;line-height:1.45!important;}
  .m-quote-en{font-size:12px;line-height:1.7;opacity:.85}
  .m-case-subsection h4{font-size:21px!important;color:#f1d2a8!important}
  .m-case-subsection p{line-height:1.78;color:#e7d8c2!important}
  .m-case-role{position:relative;margin-top:44px;background:linear-gradient(140deg,#092546,#071a34);border-color:rgba(243,193,129,.34);overflow:hidden;padding:18px 18px 22px;}
  .m-role-grid{grid-template-columns:105px 1fr;gap:5px;align-items:center}
  .m-role-visual{height:135px;width:105px;overflow:visible;margin-left:-14px;}
  .m-role-visual img{top:8px;left:-19px;width:174px;height:140px;max-width:none;object-fit:contain;animation:none;opacity:0;filter:drop-shadow(0 7px 17px rgba(0,0,0,.19))}
  .m-case-role.is-visible .m-role-visual img{animation:m-role-land 1s cubic-bezier(.17,.73,.25,1) both,m-mobile-wall-bob 6.3s ease-in-out 1s infinite}
  @keyframes m-role-land{0%{opacity:0;transform:translateY(-110px) scale(.83)}75%{opacity:1;transform:translateY(7px) scale(1)}100%{opacity:1;transform:translateY(0) scale(1)}}
  .m-role-tags{gap:7px}
  .m-role-tags span{font-size:11px;line-height:1.45}
  .m-next-project{margin-top:30px;border-radius:15px}

  /* CAREER: original complete ten entries, original cockpit scene */
  .mobile-about-v2{padding-top:58px!important}
  .m-about-title{font-size:clamp(34px,8.8vw,56px)!important;line-height:1.44!important}
  .m-about-art{margin:24px -6px 24px;border:1px solid rgba(246,192,120,.42);border-radius:18px;overflow:hidden;background:#031626;}
  .m-about-art img{display:block;width:100%;height:250px;object-fit:cover;object-position:32% 50%;}
  .m-about-intro{font-size:14px!important;line-height:1.9!important}
  .m-timeline{margin-top:18px}
  .m-timeline li{padding-bottom:22px}

  /* CONTACT: exactly one floating astronaut from UFO light, true contact details */
  .mobile-contact-v2{padding-top:42px!important}
  .m-contact-scene{height:400px;margin-top:-4px;margin-bottom:-15px;}
  .m-ufo{width:70%;left:15%;top:0;filter:drop-shadow(0 0 15px rgba(239,177,85,.3))}
  .m-ufo-beam{top:14%;height:75%;background:radial-gradient(ellipse at 50% 0%,rgba(246,194,110,.44),rgba(108,191,131,.22) 39%,transparent 90%)}
  .m-floating-person{width:93%;left:3.5%;top:26%;z-index:4;object-fit:contain;}
  .m-contact-title{font-size:37px;margin:16px 0 23px;text-align:left}
  .m-contact-title span{text-align:left;font-size:12px}
  .m-contact-methods a,.m-contact-methods button{min-height:85px}
  .m-contact-methods strong{font-size:clamp(19px,5.8vw,26px)}
}
@media (max-width:360px){
  .page-home .m-hero-intro h1{font-size:37px}
  .page-home .m-hero-stage{height:clamp(305px,96vw,360px)}
  .m-project-card{min-height:225px}
  .m-planet-img{height:102px}
  .m-role-grid{grid-template-columns:90px 1fr}
  .m-role-visual img{width:158px;left:-23px}
}
@media(prefers-reduced-motion:reduce){
  .m-work-planets,.m-work-orb img,.m-work-stage.is-visible>img,.m-case-role.is-visible .m-role-visual img{animation:none!important;transform:none;opacity:1}
}

/* Final scene entrance behavior for the V11 mobile review. */
@media (max-width:1024px), (max-aspect-ratio:4/5) {
  .m-contact-scene .m-floating-person{opacity:0;animation:none;transform:translateY(-115px) scale(.88);}
  .m-contact-scene.is-visible .m-floating-person{animation:m-contact-v11-land 1.15s cubic-bezier(.18,.75,.24,1) both,m-contact-v11-hover 5.8s ease-in-out 1.15s infinite;}
  @keyframes m-contact-v11-land{0%{opacity:0;transform:translateY(-125px) scale(.87)}78%{opacity:1;transform:translateY(8px) scale(1)}100%{opacity:1;transform:translateY(0) scale(1)}}
  @keyframes m-contact-v11-hover{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
  .m-ufo-beam{animation:m-beam-glow 5s ease-in-out infinite;}
  @keyframes m-beam-glow{0%,100%{opacity:.68}50%{opacity:1}}
  .m-about-art img{transform:scale(1.03);transition:transform 1.6s ease-out;}
  .m-about-art.is-visible img{transform:scale(1)}
}
@media (prefers-reduced-motion:reduce){
  .m-contact-scene .m-floating-person{opacity:1!important;transform:none!important;animation:none!important}
  .m-ufo-beam{animation:none!important}
}

/* V12 selected visual direction: MOBILE ONLY.
   Clean deep-space home, no black hole, no gold hero arc.
   Six project balls continue moving around the astronaut, but the
   decorative outer orbit stroke is intentionally absent. */
@media (max-width:1024px), (max-aspect-ratio:4/5) {
  .page-home .mobile-home-copy.mobile-rebuilt {
    background: radial-gradient(ellipse at 52% 49%, #113968 0%, #0b2d57 30%, #061b38 66%, #041427 100%)!important;
  }
  .page-home .m-blackhole-layer,
  .page-home .m-hero-arc,
  .page-home .m-hero-stage::before,
  .page-projects .m-work-ring { display:none!important; }
  .page-home .m-hero-stage { isolation:auto; }
  .page-projects .m-work-stage::before {
    width:88%;height:92%;top:51%;left:50%;
    background:radial-gradient(ellipse at center,rgba(15,52,96,.34),transparent 73%);
  }
  .page-projects .m-work-planets { z-index:3; }
  .page-projects .m-work-stage>img { z-index:4; }
}