.meeco-project { --meeco-red:#ea1d5d; background:#000; color:#fff; font-family:Arial,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif; }
.meeco-project figure,.meeco-project h2,.meeco-project p { margin:0; }
.meeco-project img { display:block; width:100%; height:auto; }
.meeco-project button,.meeco-project a,.meeco-project input { font:inherit; color:inherit; }
.meeco-project a { text-decoration:none; }
.meeco-project button { cursor:pointer; }
.meeco-project :is(button,a,input):focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.meeco-wrap { width:min(90%,1440px); margin-inline:auto; }
.meeco-manual { width:min(90%,1360px); }
.meeco-cover { width:100%; }
.meeco-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.8fr); align-items:start; gap:clamp(36px,5vw,96px); padding-block:120px 130px; }
.meeco-intro-lead { display:contents; }
.meeco-silver-motion { display:block; position:relative; width:min(100%,4.7em); aspect-ratio:462/273; margin-top:-.18em; font-size:clamp(32px,3.5vw,68px); }
/* Compensate for the GIF's transparent padding without clipping any animation frame. */
.meeco-silver-motion img { position:absolute; width:108.2251%; max-width:none; left:-4.7619%; top:-41.7582%; }
.meeco-project h2 { font-size:clamp(32px,3.5vw,68px); line-height:1.16; font-weight:500; letter-spacing:-.045em; }
.meeco-copy { max-width:660px; font-size:18px; line-height:1.9; }
.meeco-copy p+p { margin-top:22px; }
.meeco-heading { display:flex; align-items:baseline; justify-content:space-between; gap:24px; }
.meeco-heading>a { font-size:14px; white-space:nowrap; border-bottom:1px solid #ffffff65; padding-bottom:4px; }
.meeco-chapters { display:flex; flex-wrap:wrap; gap:24px; padding-block:38px 24px; }
.meeco-chapters button { background:none; padding:0 0 8px; border:0; border-bottom:1px solid transparent; font-size:14px; opacity:.55; }
.meeco-chapters button[aria-pressed="true"] { opacity:1; border-color:currentColor; }
.meeco-manual-page { display:block; width:100%; padding:0; border:0; background:#fff; aspect-ratio:16/9; }
.meeco-manual-page img { height:100%; object-fit:contain; }
.meeco-reader-controls { display:flex; align-items:center; gap:22px; padding-block:24px 0; }
.meeco-arrow { display:grid; place-items:center; width:44px; height:44px; flex:none; padding:0; border:1px solid #ffffff65; border-radius:50%; background:transparent; font-size:22px!important; line-height:1; }
.meeco-arrow:disabled { opacity:.2; cursor:default; }
.meeco-reader-controls input { flex:1; min-width:0; accent-color:#fff; height:24px; cursor:pointer; }
.meeco-reader-controls output { font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.meeco-manual-overview { overflow:hidden; display:grid; gap:28px; padding-block:100px 0; }
.meeco-tape { --tape-duration:48s; overflow:hidden; }
.meeco-tape-track { display:flex; width:max-content; animation:meeco-drift var(--tape-duration) linear infinite; }
.meeco-tape-group { display:flex; gap:24px; padding-right:24px; flex:none; }
.meeco-tape.is-reversed .meeco-tape-track { animation-direction:reverse; }
.meeco-tape:not(.is-click-resumed):hover .meeco-tape-track,.meeco-tape:has(:focus-visible) .meeco-tape-track,.meeco-tape.is-offscreen .meeco-tape-track { animation-play-state:paused; }
.meeco-vi-tile { display:block; width:clamp(300px,29vw,560px); padding:0; border:0; background:#fff; flex:none; }
.meeco-language { padding-block:150px 100px; }
.meeco-language-copy { display:grid; grid-template-columns:1.1fr 1fr; gap:8vw; margin-bottom:65px; }
.meeco-logo-stage { width:min(100%,960px); margin-inline:auto; }
.meeco-motion { display:block; width:100%; object-fit:contain; }
.meeco-logo-motion { aspect-ratio:16/9; background:#fff; }
/* Reserve the vertical rise of the 130%-wide rotated wall before clipping its sides. */
.meeco-application-wall { overflow:hidden; height:auto; padding-block:calc(13vw + 40px); }
.meeco-diagonal { width:130%; margin-left:-15%; transform:rotate(-11deg); transform-origin:center; display:grid; gap:24px; }
.meeco-diagonal .meeco-tape { --tape-duration:55s; }
.meeco-diagonal .meeco-tape:nth-child(2) { --tape-duration:62s; }
.meeco-application { width:clamp(280px,27vw,490px); flex:none; aspect-ratio:4/3; border:0; padding:0; background:#eee; overflow:hidden; }
.meeco-application img { height:100%; object-fit:contain; }
.meeco-digital { display:grid; grid-template-columns:1.7fr 1fr; gap:70px; align-items:center; padding-block:80px 160px; }
.meeco-social,.meeco-phone { display:block; border:0; padding:0; background:transparent; }
.meeco-phones { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center; }
.meeco-lightbox { position:fixed; inset:0; width:100vw; height:100dvh; max-width:none; max-height:none; box-sizing:border-box; padding:70px 60px 80px; border:0; margin:0; background:#000; color:#fff; overflow:hidden; }
.meeco-lightbox::backdrop { background:#000; }
.meeco-lightbox-close { position:absolute; right:24px; top:20px; font-size:30px!important; z-index:2; }
.meeco-lightbox-stage { height:100%; display:flex; align-items:center; justify-content:center; }
.meeco-lightbox-stage img { width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; }
.meeco-lightbox-nav { position:absolute; bottom:22px; left:24px; right:24px; display:flex; align-items:center; justify-content:space-between; }
.meeco-lightbox-nav output { font-size:12px; font-variant-numeric:tabular-nums; opacity:.6; }
@keyframes meeco-drift { to { transform:translateX(-50%); } }
@media (max-width:700px) {
  .meeco-manual-overview { padding-top:65px; gap:18px; }
  .meeco-tape-group { gap:18px; padding-right:18px; }
  .meeco-vi-tile { width:270px; }
  .meeco-language { padding-block:85px 50px; }
  .meeco-language-copy { grid-template-columns:1fr; gap:30px; margin-bottom:40px; }
  .meeco-application { width:270px; }
  .meeco-digital { grid-template-columns:1fr; gap:40px; padding-block:50px 85px; }
  .meeco-phones { width:min(80%,380px); justify-self:center; gap:24px; }
  .meeco-lightbox { padding:80px 18px; }
}
@media (prefers-reduced-motion:reduce) {
  .meeco-tape { overflow-x:auto; }
  .meeco-tape-track { animation:none; }
  .meeco-tape-group[aria-hidden] { display:none; }
  .meeco-application-wall { height:auto; padding-block:50px; }
  .meeco-diagonal { width:100%; margin:0; transform:none; }
}
@media (max-width:700px) { .meeco-intro { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px 24px; padding-block:70px 80px; } .meeco-intro>.meeco-copy { grid-column:1/-1; } .meeco-intro h2,.meeco-silver-motion { font-size:clamp(26px,8vw,32px); } .meeco-copy { font-size:16px; } .meeco-heading { align-items:flex-start; } .meeco-heading>a { font-size:12px; } .meeco-chapters { gap:18px; padding-block:30px 18px; } .meeco-reader-controls { gap:12px; } .meeco-arrow { width:38px; height:38px; } }