:root{--ink:#0d0d0d;--paper:#e7e4dd;--acid:#d8ff37;--line:#ffffff33;--flow-a:#8ed3f4;--flow-b:#526dff;--cursor-x:70%;--cursor-y:35%}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,sans-serif}.nav{height:90px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:3;width:100%;border-bottom:1px solid var(--line)}.brand img{width:110px;height:46px}.nav nav{display:flex;gap:25px}.nav a,.footer-links a{color:inherit;text-decoration:none;font-size:10px;letter-spacing:.12em;text-transform:uppercase}.nav-cta{border-bottom:1px solid;padding:5px}.hero{height:100vh;min-height:700px;position:relative;padding:160px 9vw;display:flex;align-items:center;overflow:hidden}.hero-copy{z-index:2;width:50%}.eyebrow,.mono{font:10px monospace;letter-spacing:.1em;text-transform:uppercase;color:#aaa;margin:0 0 25px}.eyebrow span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acid);margin-right:8px}h1,h2{font-size:clamp(3.5rem,7vw,8rem);line-height:.9;letter-spacing:-.075em;font-weight:500;margin:0}em{font-family:Georgia,serif;font-weight:400}.intro{max-width:410px;line-height:1.7;color:#bbb;margin:35px 0}.button{display:inline-flex;gap:22px;padding:15px 18px;background:var(--acid);color:#111;text-decoration:none;font:10px monospace;letter-spacing:.08em;text-transform:uppercase}.text-link{color:inherit;text-decoration:none;border-bottom:1px solid;padding-bottom:6px;font:10px monospace;letter-spacing:.1em;text-transform:uppercase;margin-left:20px}.scroll-note{position:absolute;bottom:30px;font:10px monospace;color:#999}.flow-experience{position:absolute;right:0;top:0;width:58vw;height:100%;overflow:hidden;isolation:isolate;background:#151617}.flow-bg,.flow-glow,.flow-lines{position:absolute;inset:0}.flow-bg{background:radial-gradient(circle at var(--cursor-x) var(--cursor-y),var(--flow-b),transparent 28%),radial-gradient(circle at 25% 73%,var(--flow-a),transparent 43%),#111;transition:background .8s}.flow-glow{filter:blur(32px);opacity:.85;background:conic-gradient(from 125deg,var(--flow-b),var(--flow-a),#101010,var(--flow-b));animation:drift 11s ease-in-out infinite alternate}.flow-lines{opacity:.5;background:repeating-radial-gradient(ellipse 130% 35% at 38% 48%,transparent 0 6%,#ffffff55 6.3% 6.7%,transparent 7% 11%);transform:rotate(-21deg) scale(1.35);mix-blend-mode:overlay;animation:flow 9s linear infinite}.flow-experience:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d0d0d,transparent 24%,transparent 80%,#0004)}.flow-top,.colour-meta,.flow-controls,.flow-word,.flow-experience .art-label{position:absolute;z-index:2}.flow-top{top:115px;left:11%;right:8%;display:flex;justify-content:space-between;font:10px monospace;letter-spacing:.1em}.flow-word{right:0;top:19%;font-size:clamp(9rem,24vw,26rem);font-weight:700;line-height:.8;color:#ffffff22}.colour-meta{left:11%;bottom:18%}.colour-meta p,.colour-meta h3,.colour-meta span{margin:0}.colour-meta p,.colour-meta span{font:10px monospace;letter-spacing:.11em}.colour-meta h3{font:clamp(2rem,4vw,4.1rem)/.95 Georgia,serif;letter-spacing:-.07em;margin:9px 0 12px}.flow-controls{right:8%;bottom:18%;display:flex;gap:7px}.flow-controls button{width:45px;height:45px;border:1px solid #fff8;background:transparent;color:#fff;font-size:18px;cursor:pointer}.flow-controls button:hover{background:#fff;color:#111}.flow-experience .art-label{bottom:5%;left:11%;display:flex;gap:65px;font:10px/1.5 monospace;letter-spacing:.1em}@keyframes drift{to{transform:scale(1.25) rotate(30deg)}}@keyframes flow{to{background-position:0 200px}}.manifesto,.craft,.media,footer{padding:130px 9vw}.manifesto{background:var(--paper);color:var(--ink)}.manifesto-grid,.media-grid{display:grid;grid-template-columns:1.7fr .75fr;gap:7vw}.manifesto-grid p,.license-copy,.media-grid p{font-size:14px;line-height:1.8;color:#666}.manifesto .text-link,.licensing .text-link{color:var(--ink)}.stats,.process-list{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #aaa;margin-top:80px}.stats div,.process-list article{padding:25px;border-right:1px solid #aaa}.stats b{font:24px monospace}.stats span,.process-list p{font-size:11px;line-height:1.7}.future{padding:110px 5vw}.future-top{display:flex;justify-content:space-between}.future-card{height:620px;background:#c9c8c1;position:relative;overflow:hidden;color:#111}.confidential{position:absolute;top:20px;font:10px monospace;letter-spacing:.1em}.silhouette{position:absolute;inset:10% -10% 0 42%;background:radial-gradient(ellipse,#fff9,transparent 60%)}.silhouette div{margin-top:25%;width:100%;height:40%;border-radius:50% 40% 20%;background:linear-gradient(135deg,#eee,#333,#888);transform:skewX(-12deg)}.future-content{position:absolute;left:8%;top:25%}.future-content p{max-width:280px;line-height:1.7}.button-light{background:#111;color:#fff}.card-corner{position:absolute;right:25px;bottom:25px;font:10px monospace}.craft,.media{background:#101010}.craft-heading{display:flex;justify-content:space-between}.process-list{border-color:var(--line)}.process-list article{border-color:var(--line)}.process-list h3{font-size:26px;font-weight:400}.process-list p{color:#aaa}.licensing{background:var(--acid);color:#111;padding:100px 9vw;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.license-mark{font-size:20vw;font-weight:800;letter-spacing:-.15em;align-self:center}.media-grid p{color:#bbb}.media-tags span{display:inline-block;border:1px solid #777;padding:8px;margin:3px;font:9px monospace}.email{display:inline-block;margin-top:40px;color:var(--acid);font-size:clamp(1.4rem,2.5vw,2.5rem);text-decoration:none;border-bottom:1px solid}.footer-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:110px}.footer-bottom img{width:90px}.footer-bottom p,.backtop{font:9px/1.7 monospace;color:#777}.footer-links{display:flex;gap:20px}@media(max-width:750px){.nav{height:70px}.nav nav{display:none}.hero{padding:110px 7vw;align-items:flex-start}.hero-copy{width:100%}.flow-experience{top:auto;bottom:0;width:100%;height:48%;opacity:.8}.flow-top{top:18px}.flow-word{top:20%;font-size:10rem}.colour-meta{left:7%;bottom:18%}.flow-controls{right:7%;bottom:12%}.flow-experience .art-label{display:none}.manifesto,.craft,.media,footer{padding:90px 7vw}.manifesto-grid,.media-grid,.licensing{grid-template-columns:1fr}.stats,.process-list{grid-template-columns:1fr}.future{padding:70px 0}.future-top{padding:0 7vw}.future-card{height:560px}.process-list article{border-right:0;border-bottom:1px solid var(--line)}.licensing{padding:80px 7vw}.footer-bottom{display:block}.footer-links{margin-top:25px}}

/* 2026-09-15 mobile layout repair and modest small-text sizing */
.nav a,.footer-links a{font-size:11px}
.eyebrow,.mono{font-size:11px}
.button,.text-link{font-size:11px}
.scroll-note{font-size:11px}
.stats span,.process-list p{font-size:12px}
.colour-meta p,.colour-meta span,.flow-experience .art-label,.media-tags span{font-size:10px}
.flow-controls button{font-size:12px}
.footer-bottom p,.backtop{font-size:10px}

@media(max-width:750px){
  .hero{
    display:block;
    height:auto;
    min-height:0;
    padding:110px 7vw 0;
  }
  .hero-copy{
    position:relative;
    width:100%;
    padding-bottom:48px;
  }
  .hero-copy h1{
    font-size:clamp(3.25rem,14vw,4.2rem);
    line-height:.92;
  }
  .hero-copy h1 em{
    font-size:.87em;
    overflow-wrap:normal;
  }
  .intro{
    margin:28px 0;
  }
  .hero-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:16px 20px;
  }
  .hero-actions .text-link{
    margin-left:0;
  }
  .flow-experience{
    position:relative;
    top:auto;
    bottom:auto;
    width:calc(100% + 14vw);
    height:430px;
    margin-left:-7vw;
    opacity:.9;
  }
  .scroll-note{
    left:7vw;
    bottom:28px;
    z-index:3;
  }
}

/* 2026-09-15 manual colour selector */
.flow-controls{
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.colour-selectors{
  display:grid;
  gap:7px;
  width:310px;
  padding:10px;
  border:1px solid #ffffff38;
  background:#08101bd9;
  box-shadow:0 12px 28px #0005;
  backdrop-filter:blur(10px);
}
.colour-selectors label{
  display:grid;
  grid-template-columns:68px minmax(0,1fr);
  align-items:center;
  gap:8px;
  color:#dce8ff;
  font:600 10px Rajdhani,Arial,sans-serif;
  letter-spacing:.12em;
}
.colour-selectors select{
  width:100%;
  min-width:0;
  padding:7px 8px;
  border:1px solid #ffffff55;
  border-radius:0;
  background:#0a101c;
  color:#fff;
  font:500 11px Rajdhani,Arial,sans-serif;
  letter-spacing:.025em;
  cursor:pointer;
}
.colour-selectors select:focus-visible{
  outline:2px solid var(--flow-a);
  outline-offset:2px;
}

@media(max-width:750px){
  .flow-experience{
    height:560px;
  }
  .flow-controls{
    top:6%;
    right:7%;
    width:86%;
    align-items:stretch;
  }
  .flow-controls button{
    align-self:flex-end;
  }
  .colour-selectors{
    grid-template-columns:1fr 1fr;
    width:100%;
    padding:8px;
  }
  .colour-selectors label{
    display:block;
    font-size:10px;
  }
  .colour-selectors select{
    display:block;
    margin-top:4px;
    padding:7px 6px;
    font-size:10px;
  }
  .flow-experience .colour-one{
    top:60%;
  }
  .flow-experience .colour-two{
    bottom:7%;
  }
}

/* Preserved visual layer 1: Technical hero art direction */
.flow-word{display:none}.flow-top{justify-content:flex-start}
.flow-glow{opacity:.9;animation:drift-fast 6.8s ease-in-out infinite alternate}
.flow-lines{opacity:.7;animation:flow-fast 2.7s linear infinite}
@keyframes drift-fast{to{transform:scale(1.2) rotate(30deg)}}
@keyframes flow-fast{from{background-position:0 0}to{background-position:0 360px}}
body{font-family:Rajdhani,Arial,sans-serif;letter-spacing:.025em}.nav{background:linear-gradient(90deg,#080d18ee,#080d1833);clip-path:polygon(0 0,100% 0,100% 85%,96% 100%,0 100%)}h1,h2,.colour-meta h3{font-family:Rajdhani,Arial,sans-serif;font-weight:600;letter-spacing:.015em}.hero-copy h1{font-size:clamp(4.2rem,7.8vw,9rem);text-transform:uppercase}.flow-experience{background:#0a101e;clip-path:polygon(8% 0,100% 0,100% 100%,0 100%,0 15%)}.flow-experience:after,.flow-bg,.flow-glow,.flow-lines,.flow-word{display:none}.flow-top{top:112px;left:13%;right:8%;justify-content:space-between;font-family:Rajdhani,monospace;font-size:12px;color:#d9e5ff}.flow-top span:last-child{color:var(--flow-a)}#cfdCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;background:radial-gradient(circle at 54% 50%,color-mix(in srgb,var(--flow-a) 26%,transparent),transparent 37%),linear-gradient(135deg,#131d31 0%,#090e19 55%,#121b2b 100%)}.tech-grid{position:absolute;inset:0;opacity:.35;background:repeating-linear-gradient(135deg,transparent 0 7px,#ffffff10 7.5px 8.5px),linear-gradient(90deg,#0d183000, #0d1830aa);z-index:1}.corner-accent{position:absolute;right:-60px;top:-20px;width:280px;height:50px;background:var(--flow-a);transform:rotate(-45deg);box-shadow:0 0 0 13px #fff,0 0 0 27px var(--flow-b);z-index:2}.colour-meta{left:13%;bottom:17%;z-index:3;padding-left:19px;border-left:3px solid var(--flow-a);text-transform:uppercase}.colour-meta p,.colour-meta span,.art-label{font-family:Rajdhani,monospace;font-weight:600}.colour-meta h3{font-size:clamp(2.8rem,4.5vw,5rem);line-height:.78;margin:13px 0 16px}.flow-controls{z-index:3}.flow-controls button{border-radius:0;border-color:var(--flow-a);font-family:Rajdhani;font-size:22px}.flow-controls button:hover{background:var(--flow-a)}.flow-experience .art-label{z-index:3;left:13%;bottom:5%;font-size:11px;color:#dce8ff}.manifesto,.craft,.media,footer{font-family:Rajdhani,Arial,sans-serif}.button{font-family:Rajdhani,sans-serif;font-size:12px;font-weight:700;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}

/* Preserved visual layer 2: Ambient colour field */
.flow-experience{background:#0b1020;clip-path:none}.ambient-field{position:absolute;inset:-20%;z-index:0;background:radial-gradient(circle at 25% 35%,var(--flow-a),transparent 27%),radial-gradient(circle at 72% 65%,var(--flow-b),transparent 31%),radial-gradient(circle at 63% 19%,color-mix(in srgb,var(--flow-a) 45%,var(--flow-b)),transparent 23%),#0a0f1e;filter:blur(22px) saturate(135%);animation:ambient-drift 14s ease-in-out infinite alternate}.tech-grid{opacity:.2;background:linear-gradient(125deg,#071226bb,transparent 50%),repeating-linear-gradient(135deg,transparent 0 9px,#ffffff0c 9px 10px)}.corner-accent{opacity:.6}.flow-top,.colour-meta,.flow-controls,.flow-experience .art-label{z-index:3}.colour-meta{border-left-color:var(--flow-a);text-shadow:0 2px 15px #000}.colour-meta h3{max-width:600px}.flow-controls button{border-color:#fff9;background:#09101ccc}.flow-controls button:hover{background:var(--flow-a)}@keyframes ambient-drift{0%{transform:translate3d(-3%,-2%,0) scale(1)}45%{transform:translate3d(4%,3%,0) scale(1.1)}100%{transform:translate3d(-1%,5%,0) scale(1.04)}}

/* Preserved visual layer 3: Colour metadata placement */
.colour-meta{left:auto;right:10%;top:25%;bottom:auto;width:310px;padding:11px 0 10px 16px;transform:rotate(-18deg);transform-origin:right center;border-left-width:2px;background:linear-gradient(90deg,#07101a99,transparent);text-shadow:0 2px 15px #000}.colour-meta p,.colour-meta span{font-size:9px;letter-spacing:.16em}.colour-meta h3{font-size:clamp(1.45rem,2vw,2.1rem);line-height:.9;letter-spacing:.02em;margin:8px 0 9px}.ambient-field{background-size:140% 140%;animation:ambient-shift 7s cubic-bezier(.45,0,.25,1) infinite alternate}@keyframes ambient-shift{0%{transform:translate3d(-5%,-4%,0) scale(1.05);background-position:0% 0%}45%{transform:translate3d(4%,5%,0) scale(1.2);background-position:100% 35%}100%{transform:translate3d(-2%,8%,0) scale(1.1);background-position:35% 100%}}@media(max-width:750px){.colour-meta{right:5%;top:21%;width:230px;transform:rotate(-12deg)}.colour-meta h3{font-size:1.35rem}}

/* Preserved visual layer 4: Final dual-colour layout */
.colour-meta{width:250px;transform:none;background:linear-gradient(90deg,#07101a99,transparent);text-shadow:0 2px 15px #000}.colour-one{left:9%;right:auto;top:19%;bottom:auto;border-left-color:var(--flow-a)}.colour-two{left:auto;right:9%;top:auto;bottom:13%;border-left-color:var(--flow-b);text-align:right;padding:11px 16px 10px 0;border-left:0;border-right:2px solid var(--flow-b);background:linear-gradient(270deg,#07101a99,transparent)}.colour-meta h3{font-size:clamp(1.4rem,2vw,2rem);line-height:.9;margin:7px 0}.flow-top{display:none}.flow-experience .art-label{left:9%;bottom:5%;font-size:9px}.art-label span+span{display:none}@media(max-width:750px){.colour-one{left:7%;top:14%}.colour-two{right:7%;bottom:14%}.colour-meta{width:195px}.colour-meta h3{font-size:1.25rem}}

/* Preserved visual layer 5: Random-pair control layout */
.flow-controls{top:18%;right:9%;bottom:auto}.flow-controls button{width:auto;height:auto;padding:10px 14px;border:1px solid #fff8;font:600 11px Rajdhani,Arial,sans-serif;letter-spacing:.13em}.flow-controls button span{font-size:16px;margin-left:8px;display:inline-block;transition:transform .35s}.flow-controls button:hover span{transform:rotate(180deg)}@media(max-width:750px){.flow-controls{top:8%;right:7%}.flow-controls button{padding:8px 10px;font-size:9px}}

/* 2026-09-15 maintenance and launch baseline */
.backtop{
  display:inline-flex;
  color:#777;
  text-decoration:none;
  cursor:pointer;
  padding:4px 0;
}
.backtop:hover{
  color:var(--paper);
}
a:focus-visible,
button:focus-visible,
select:focus-visible{
  outline:2px solid var(--acid);
  outline-offset:4px;
}

@media(max-width:750px){
  .backtop{
    margin-top:20px;
  }
}

@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto;
  }
  .ambient-field,
  .flow-glow,
  .flow-lines{
    animation:none!important;
  }
  .flow-controls button span{
    transition:none;
  }
}

/* 2026-09-18: self-host the first-version fonts for reliable local loading. */
@font-face{font-family:"Rajdhani";src:url("fonts/rajdhani-400.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Rajdhani";src:url("fonts/rajdhani-500.ttf") format("truetype");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"Rajdhani";src:url("fonts/rajdhani-600.ttf") format("truetype");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"Rajdhani";src:url("fonts/rajdhani-700.ttf") format("truetype");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"DM Mono";src:url("fonts/dm-mono-400.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"DM Mono";src:url("fonts/dm-mono-500.ttf") format("truetype");font-style:normal;font-weight:500;font-display:swap}

.eyebrow,.mono,.button,.text-link,.scroll-note,.flow-top,.colour-meta p,.colour-meta span,.flow-experience .art-label,.stats b,.card-corner,.media-tags span,.footer-bottom p,.backtop{
  font-family:"DM Mono",monospace;
}

/* Keep the supplied logo as an image and preserve its exact proportions. */
.brand img{
  width:auto;
  height:46px;
  display:block;
  object-fit:contain;
}
.footer-bottom img{
  width:90px;
  height:auto;
  object-fit:contain;
}
img{
  -webkit-user-drag:none;
}

/* The page is an artwork surface: visible text must not be selectable. */
html,body,body *{
  -webkit-user-select:none;
  user-select:none;
}
