@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500;1,600&family=DM+Sans:wght@400;500;700&display=swap');:root{--black:#000;--white:#fff;--green:#39ff14;--magenta:#ff3d7f;--grey:#777;--line:rgba(255,255,255,.18);--display:'Cormorant Garamond',Georgia,serif;--body:'DM Sans',Arial,sans-serif;--app-1:#00f5d4;--app-2:#ffe600;--app-3:#ff6b00;--app-4:#ff304f;--app-5:#9d4edd;--app-6:#00a8ff;--app-7:#ff2bd6;--app-8:#b6ff00}*{box-sizing:border-box}html,body{margin:0;background:#000;color:#fff;font-family:var(--body)}body{min-height:100vh}a{color:inherit}.mw-header{height:72px;display:grid;grid-template-columns:180px 1fr 180px;align-items:center;padding:0 clamp(22px,4vw,72px);border-bottom:1px solid #262626;position:relative;z-index:50;background:#000}.mw-logo{text-decoration:none;display:flex;align-items:end;gap:5px;line-height:.8}.mw-logo span{font:italic 38px var(--display)}.mw-logo b{font-size:10px;color:var(--world,var(--green));letter-spacing:.04em}.mw-header nav{display:flex;justify-content:center;gap:32px}.mw-header nav a,.space-link{font-size:9px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}.mw-header nav a:hover,.space-link:hover{color:var(--green)}.space-link{text-align:right}.door-scene{height:calc(100svh - 72px);position:relative;overflow:hidden}.door-scene>img{width:100%;height:100%;object-fit:cover}.scene-copy{position:absolute;left:3.5%;top:12%;width:min(430px,34vw);text-shadow:0 3px 18px #000}.scene-copy small{font-size:9px;letter-spacing:.24em}.scene-copy h1{font:italic clamp(58px,7vw,118px)/.78 var(--display);letter-spacing:-.06em;margin:22px 0}.door-hotspots{position:absolute;inset:0}.door{position:absolute;top:36%;height:40%;width:16%;text-decoration:none;filter:drop-shadow(0 0 0 transparent);transition:.35s}.door.challenge{left:22%}.door.experience{left:43%}.door.record{left:64%}.door span{position:absolute;left:50%;bottom:4%;transform:translate(-50%,15px);opacity:0;background:#000;border:1px solid #fff;padding:13px 17px;white-space:nowrap;font-size:9px;letter-spacing:.14em;text-transform:uppercase;transition:.3s}.door:hover,.door:focus-visible{filter:drop-shadow(0 0 20px #fff)}.door:hover span,.door:focus-visible span{opacity:1;transform:translate(-50%,0)}.experience-scene{background:#050505;min-height:calc(100svh - 72px);padding:38px clamp(22px,4vw,72px) 70px;overflow:hidden}.experience-scene>header{display:grid;grid-template-columns:1fr auto;align-items:end;border-bottom:1px solid var(--line);padding-bottom:30px}.experience-scene small,.app-canvas small,.control-centre small{font-size:8px;letter-spacing:.2em}.experience-scene h1{font:italic clamp(50px,6vw,94px)/.82 var(--display);margin:15px 0 0}.experience-scene h1 em{color:var(--green)}.experience-scene header p{font-size:11px}.world-path{position:relative;min-height:650px;background:radial-gradient(circle at center,rgba(57,255,20,.08),transparent 25%)}.world-path::before{content:'';position:absolute;inset:10% 8%;border:1px dashed rgba(57,255,20,.45);border-radius:50%;animation:orbit 35s linear infinite}.space-orb{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:170px;aspect-ratio:1;border-radius:50%;background:var(--magenta);display:grid;place-content:center;text-align:center;text-decoration:none;box-shadow:0 0 50px rgba(255,61,127,.35),0 0 0 16px #050505,0 0 0 17px var(--green)}.space-orb span{font-size:8px;letter-spacing:.18em}.space-orb b{font:italic 35px var(--display)}.world-node{--angle:calc(var(--i)*45deg);position:absolute;left:calc(50% + 40%*cos(var(--angle)));top:calc(50% + 39%*sin(var(--angle)));transform:translate(-50%,-50%);width:190px;padding:15px;border-bottom:2px solid var(--node);text-decoration:none;background:#050505;animation:world-in .65s calc(var(--i)*.08s) both}.world-node small,.world-node span{display:block;font-size:8px;line-height:1.4}.world-node b{display:block;font:italic 25px var(--display);color:var(--node);margin:7px 0}.world-node:hover{box-shadow:0 15px 35px rgba(0,0,0,.4);transform:translate(-50%,-57%)}.app-world{min-height:calc(100svh - 72px);display:grid;grid-template-columns:270px 1fr;background:#050505;color:#fff}.app-world>aside{border-right:1px solid var(--world);padding:38px 25px;background:linear-gradient(180deg,color-mix(in srgb,var(--world) 12%,#000),#000 42%)}.app-world>aside>a{font-size:8px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}.app-world>aside h1{font:italic 48px/.85 var(--display);margin:70px 0 18px}.app-world>aside h1 em{display:block;color:var(--world)}.app-world>aside p{font-size:11px;color:#bbb;line-height:1.6}.app-world>aside nav{display:grid;margin-top:45px;border-top:1px solid var(--line)}.app-world>aside button{border:0;border-bottom:1px solid var(--line);background:transparent;color:#aaa;padding:15px 0;text-align:left;font:8px var(--body);text-transform:uppercase;letter-spacing:.12em;cursor:pointer}.app-world>aside button.active{color:var(--world)}.app-canvas{padding:45px clamp(28px,5vw,85px) 80px;background-image:radial-gradient(circle at 88% 8%,color-mix(in srgb,var(--world) 16%,transparent),transparent 27%),linear-gradient(120deg,transparent 70%,rgba(255,255,255,.025) 70%)}.app-canvas>header{display:grid;grid-template-columns:1fr auto;align-items:end;border-bottom:1px solid var(--line);padding-bottom:35px}.app-canvas h2{font:italic clamp(48px,6vw,90px)/.85 var(--display);max-width:920px;margin:15px 0}.reward{width:130px;aspect-ratio:1;border-radius:50%;border:1px solid var(--world);display:grid;place-content:center;text-align:center}.reward b{font:italic 36px var(--display);color:var(--world)}.reward span{font-size:7px;text-transform:uppercase;letter-spacing:.12em}.capability{display:none;padding:45px 0;animation:rise .35s both}.capability.active{display:block}.capability h3{font:italic clamp(38px,4vw,64px) var(--display);color:var(--world);margin:12px 0}.capability p{max-width:620px;color:#bbb;line-height:1.6}.begin-action,.save-action{border:1px solid var(--world);background:var(--world);color:#000;padding:15px 20px;text-transform:uppercase;letter-spacing:.13em;font:700 8px var(--body);cursor:pointer}.action-stage{margin-top:25px;max-width:720px;padding:24px;border:1px solid var(--world);background:rgba(0,0,0,.7)}.action-stage label{display:grid;gap:12px;font:italic 22px var(--display)}.action-stage textarea{min-height:130px;background:#000;color:#fff;border:0;border-bottom:1px solid var(--world);padding:15px;font:16px var(--body);resize:vertical}.save-action{margin-top:18px}.control-centre{min-height:calc(100svh - 72px);padding:45px clamp(25px,5vw,85px) 80px;background:radial-gradient(circle at 78% 12%,rgba(255,61,127,.32),transparent 33%),linear-gradient(135deg,#000 42%,#16000a);position:relative}.control-centre::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(57,255,20,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(57,255,20,.05) 1px,transparent 1px);background-size:60px 60px;pointer-events:none}.control-centre>header{position:relative;display:grid;grid-template-columns:1fr auto;align-items:end;border-bottom:1px solid var(--magenta);padding-bottom:35px}.control-centre h1{font:italic clamp(58px,7vw,110px)/.8 var(--display);margin:15px 0;color:var(--magenta)}.level{width:145px;aspect-ratio:1;border-radius:50%;border:1px solid var(--green);display:grid;place-content:center;text-align:center}.level b{font:italic 30px var(--display)}.continue{position:relative;padding:35px;border-bottom:1px solid var(--line)}.continue h2{font:italic 38px var(--display);margin:12px 0}.continue a{color:var(--green);font-size:9px;text-transform:uppercase;letter-spacing:.14em}.control-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:35px}.control-grid article{background:#070707;padding:25px;min-height:150px;display:flex;flex-direction:column;justify-content:space-between}.control-grid article:hover{background:color-mix(in srgb,var(--magenta) 15%,#070707)}.control-grid b{font:italic 28px var(--display);color:var(--magenta)}.mw-footer{height:105px;border-top:1px solid #222;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 clamp(22px,4vw,72px);font-size:9px}.mw-footer span{text-align:center;color:#888}.mw-footer a{text-align:right;color:var(--green);text-decoration:none}.bot-launch{position:fixed;right:20px;bottom:18px;z-index:70;background:#000;color:#fff;border:1px solid var(--green);padding:14px 17px;font-size:8px;letter-spacing:.13em;text-transform:uppercase}.magic-bot{position:fixed;z-index:69;right:18px;bottom:18px;width:min(370px,calc(100vw - 36px));padding:35px 25px 75px;background:#000;border:1px solid var(--green);transform:translateY(20px);opacity:0;visibility:hidden;transition:.3s}.magic-bot[aria-hidden=false]{transform:none;opacity:1;visibility:visible}.magic-bot>button{position:absolute;right:12px;top:8px;background:none;color:#fff;border:0;font-size:25px}.magic-bot h2{font:italic 36px var(--display)}.magic-bot a{display:block;padding:13px 0;border-top:1px solid #333;font-size:9px;text-transform:uppercase;text-decoration:none}.not-found{min-height:70vh;padding:10vw}.not-found h1{font:italic 70px var(--display)}@keyframes world-in{from{opacity:0;transform:translate(-50%,-30%)}to{opacity:1}}@keyframes rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@keyframes orbit{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:900px){.mw-header{grid-template-columns:120px 1fr}.mw-header nav{display:none}.door-scene{height:auto;aspect-ratio:16/10}.scene-copy{width:42vw}.scene-copy h1{font-size:55px}.experience-scene>header{grid-template-columns:1fr}.world-path{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:30px}.world-path::before{display:none}.space-orb,.world-node{position:relative;inset:auto;transform:none;left:auto;top:auto;width:auto}.space-orb{width:150px;grid-column:1/-1;margin:auto}.world-node:hover{transform:translateY(-5px)}.app-world{grid-template-columns:1fr}.app-world>aside{border-right:0;border-bottom:1px solid var(--world)}.app-world>aside h1{margin-top:35px}.app-world>aside nav{grid-template-columns:repeat(2,1fr)}.control-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.mw-header{height:60px}.mw-logo span{font-size:30px}.door-scene{height:calc(100svh - 60px);aspect-ratio:auto}.scene-copy{width:55vw;top:7%}.scene-copy h1{font-size:42px}.door{width:28%;top:34%}.door.challenge{left:8%}.door.experience{left:36%}.door.record{left:64%}.door span{font-size:7px;padding:9px}.world-path,.control-grid{grid-template-columns:1fr}.app-canvas>header,.control-centre>header{grid-template-columns:1fr}.reward,.level{margin-top:20px}.app-canvas{padding-inline:20px}.control-centre{padding-inline:20px}.mw-footer{height:auto;grid-template-columns:1fr;gap:10px;padding-block:25px;text-align:center}.mw-footer span,.mw-footer a{text-align:center}}

.scene-copy p{max-width:360px;font-size:12px;line-height:1.6;color:#ddd}.program-scene{min-height:calc(100svh - 72px);background:#eee;color:#000}.program-hero{padding:clamp(55px,8vw,120px) clamp(22px,6vw,100px);border-bottom:1px solid #000;background:#eee}.program-hero small,.open-call small{font-size:9px;letter-spacing:.24em}.program-hero h1{font:italic clamp(58px,8vw,126px)/.8 var(--display);letter-spacing:-.055em;max-width:1100px;margin:22px 0}.program-hero p{max-width:720px;font-size:15px;line-height:1.7}.program-hero>a{display:inline-block;margin-top:24px;padding:14px 18px;background:#000;color:#fff;text-decoration:none;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.program-steps,.impact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#000}.program-steps article,.impact-grid article{background:#fff;padding:clamp(25px,4vw,60px);min-height:230px}.program-steps small,.impact-grid small{font-size:9px;letter-spacing:.18em;color:#777}.program-steps h2,.impact-grid h2{font:italic clamp(32px,4vw,55px) var(--display);margin:25px 0 12px}.program-steps p,.impact-grid p,.open-call p{font-size:12px;line-height:1.65}.record-scene .program-hero{background:#000;color:#fff}.record-scene .program-hero>a{background:#fff;color:#000}.open-call{padding:clamp(40px,6vw,90px);background:#000;color:#fff}.open-call h2{font:italic clamp(35px,5vw,70px)/.95 var(--display);max-width:1100px}.open-call p{max-width:650px;color:#aaa}@media(max-width:760px){.program-scene{min-height:calc(100svh - 60px)}.program-hero h1{font-size:56px}.program-steps,.impact-grid{grid-template-columns:1fr}.program-steps article,.impact-grid article{min-height:0}.scene-copy p{display:none}}

/* Canonical preview refinement */
.mw-logo{height:52px;align-items:center}.mw-logo img{width:120px;height:48px;object-fit:contain;object-position:left center}.mw-logo b{margin-left:4px}.scene-copy{top:10%;width:min(330px,27vw)}.scene-copy h1{font-size:clamp(42px,4.8vw,78px);line-height:.82;margin:16px 0}.scene-copy p{max-width:270px;font-size:11px}.about-scene{min-height:calc(100svh - 72px);display:grid;grid-template-columns:1.05fr .95fr;background:#eee;color:#000}.about-scene>section{padding:clamp(55px,8vw,125px) clamp(28px,6vw,100px)}.about-scene small{font-size:9px;letter-spacing:.24em}.about-scene h1{font:italic clamp(55px,7vw,105px)/.82 var(--display);letter-spacing:-.05em;margin:22px 0}.about-scene>section p{max-width:650px;font-size:15px;line-height:1.7}.about-scene>aside{display:grid;background:#000;color:#fff}.about-scene article{padding:clamp(28px,4vw,55px);border-bottom:1px solid #333}.about-scene article b{color:var(--green);font:20px var(--display)}.about-scene article h2{font:italic 34px var(--display);margin:9px 0}.about-scene article p{font-size:11px;color:#aaa;line-height:1.6}@media(max-width:900px){.about-scene{grid-template-columns:1fr}.scene-copy{width:34vw}}@media(max-width:600px){.mw-logo{height:44px}.mw-logo img{width:98px;height:40px}.scene-copy{width:44vw}.scene-copy h1{font-size:38px}.about-scene{min-height:calc(100svh - 60px)}.about-scene h1{font-size:52px}}

/* WebCust geometry contract: values originate in canonical design tokens */
.mw-header{overflow:var(--header-overflow);contain:layout paint}
.mw-logo{width:var(--header-logo-width);height:var(--header-logo-height);max-width:var(--header-logo-width);max-height:var(--header-logo-height);overflow:hidden;display:flex;flex:0 0 var(--header-logo-width)}
.mw-logo img{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:left center}
.scene-copy{top:var(--hero-copy-top);width:var(--hero-copy-width);max-width:var(--hero-copy-width)}
.scene-copy h1{font-size:var(--hero-title-size);max-width:100%}
@media(max-width:600px){.mw-logo{width:var(--header-logo-width-mobile);max-width:var(--header-logo-width-mobile);flex-basis:var(--header-logo-width-mobile)}.scene-copy h1{font-size:var(--hero-title-size-mobile)}}

/* ===================================================================
   MONOCHROME OVERRIDE — 2026-07-17
   The Magic24x7 mockup is pure black-and-white pen-and-ink. The build had
   drifted to a rainbow: neon-green + magenta tokens, eight per-app hues, and
   per-page inline --world colours injected by the content layer. This block is
   appended LAST so it wins the cascade, and uses !important only where an inline
   custom property would otherwise override it. Nothing structural changes —
   only colour. Remove this block to restore the previous palette.
   =================================================================== */
:root{
  --green:#ffffff; --magenta:#ffffff;
  --app-1:#ffffff; --app-2:#ffffff; --app-3:#ffffff; --app-4:#ffffff;
  --app-5:#ffffff; --app-6:#ffffff; --app-7:#ffffff; --app-8:#ffffff;
}
/* elements coloured by an inline --world (set per page to a rainbow hue) */
.mw-logo b{color:#fff !important}
.mw-header nav a{color:#fff !important}
.mw-header nav a:hover,.space-link:hover,.mw-footer a,.continue a{color:#bdbdbd !important}
.experience-scene h1 em{color:#fff !important}
.app-world>aside{border-right:1px solid #2a2a2a !important;
  background:linear-gradient(180deg,rgba(255,255,255,.05),#000 42%) !important}
.app-world>aside h1 em,.app-world>aside button.active,
.capability h3,.reward b,.control-centre h1,.control-grid b,.level b{color:#fff !important}
.reward,.level,.action-stage,.begin-action,.save-action{border-color:#fff !important}
.begin-action,.save-action{background:#fff !important;color:#000 !important}
.app-world>aside nav button{color:#8a8a8a !important}
.app-canvas{background-image:none !important;background:#050505 !important}
/* hardcoded green / magenta glows -> neutral light */
.world-path{background:radial-gradient(circle at center,rgba(255,255,255,.05),transparent 25%) !important}
.world-path::before{border-color:rgba(255,255,255,.22) !important}
.space-orb{background:transparent !important;
  box-shadow:0 0 42px rgba(255,255,255,.12),0 0 0 16px #050505,0 0 0 17px #fff !important}
.control-centre{background:#000 !important}
.control-centre::before{background-image:
  linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) !important}
.control-centre>header{border-bottom-color:#fff !important}
.control-grid article:hover{background:#111 !important}
.magic-bot,.bot-launch{border-color:#fff !important}