/* ============================================================
   CANIPUS · CINEMA · the look every page shares (26 Sep 2026)

   One file, loaded after a page's own styles. Nothing here changes what a
   page does; it changes how it feels: a sky that breathes behind the page,
   film grain over glass, a hero that moves like a shot and not a photo,
   numbers that count up, rows that arrive one after another, and the
   arrival: the lamp coming on when a doctor signs in.

   The rules
   · Phone first. Every size on the site is read from type.css.
   · The colours are the Canipus colours: navy ground, teal light, amber
     for what needs a hand. Nothing new is added, only depth and motion.
   · Motion is quiet and short. prefers-reduced-motion turns it all off.
   · Everything runs on the GPU (transform, opacity, filter on fixed
     layers) so a five year old phone keeps 60 frames.
   ============================================================ */

:root{
  --cn-serif:'Instrument Serif', Georgia, 'Times New Roman', serif;
  --cn-ease: cubic-bezier(.2,.7,.2,1);
  --cn-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- THE SKY: two slow lights behind everything, and grain ---------- */
body.cinema{ background:#0B1830; }
.cn-sky{ position:fixed; inset:-10%; z-index:0; pointer-events:none; overflow:hidden;
  background:radial-gradient(120% 80% at 50% -10%, #17305A 0%, #0F1F3D 45%, #0A1428 100%); }
.cn-sky i{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; will-change:transform; }
.cn-sky .a{ width:64vmax; height:64vmax; left:-18vmax; top:-24vmax;
  background:radial-gradient(circle, rgba(64,201,190,.42) 0%, rgba(64,201,190,0) 62%); animation:cnDriftA 28s ease-in-out infinite alternate; }
.cn-sky .b{ width:76vmax; height:76vmax; right:-30vmax; bottom:-30vmax;
  background:radial-gradient(circle, rgba(72,104,214,.38) 0%, rgba(72,104,214,0) 62%); animation:cnDriftB 36s ease-in-out infinite alternate; }
.cn-sky .c{ width:40vmax; height:40vmax; left:30vw; top:35vh;
  background:radial-gradient(circle, rgba(143,230,222,.14) 0%, rgba(143,230,222,0) 60%); animation:cnDriftC 44s ease-in-out infinite alternate; }
.cn-grain{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.055; background-image:var(--cn-grain); background-size:220px 220px; mix-blend-mode:overlay; }
@keyframes cnDriftA{ from{ transform:translate3d(0,0,0) scale(1); } to{ transform:translate3d(9vw,7vh,0) scale(1.12); } }
@keyframes cnDriftB{ from{ transform:translate3d(0,0,0) scale(1.05); } to{ transform:translate3d(-8vw,-9vh,0) scale(.94); } }
@keyframes cnDriftC{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-14vw,10vh,0); } }
body.cinema > .wrap{ position:relative; z-index:1; }
body.cinema > .cn-arrive{ z-index:9999; }

/* ---------- THE SIGN IN: the lamp behind the card ---------- */
.cn-film{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.cn-film video, .cn-film img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.6s ease; transform:scale(1.04); }
.cn-film.on video, .cn-film.on img{ opacity:.85; }
.cn-film::after{ content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,14,28,.28) 0%, rgba(6,14,28,.5) 42%, rgba(11,24,48,.94) 78%, #0B1830 100%); }
body.cinema.cn-gate .cn-sky{ opacity:.55; }
body.cinema.cn-gate .brand{ position:relative; z-index:1; }
body.cinema.cn-gate .card.panel{ position:relative; z-index:1;
  background:linear-gradient(180deg, rgba(22,41,75,.62), rgba(14,27,51,.7));
  -webkit-backdrop-filter:blur(18px) saturate(1.2); backdrop-filter:blur(18px) saturate(1.2);
  border:1px solid rgba(153,189,208,.2); box-shadow:0 40px 80px -30px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.14); }
body.cinema.cn-gate .card.panel h1{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-title); letter-spacing:-.005em; line-height:1.06; }
body.cinema.cn-gate .cn-line{ position:relative; z-index:1; margin:34px 0 0; font-family:var(--cn-serif); font-weight:400; font-size:clamp(1.9rem, 8.4vw, 2.6rem); line-height:1.06; color:#F8FEFF; letter-spacing:-.01em; text-wrap:balance; }
body.cinema.cn-gate .cn-line em{ font-style:italic; color:var(--teal2); }
body.cinema.cn-gate .cn-line + .card{ margin-top:22px; }
body.cinema.cn-gate .cn-sub{ position:relative; z-index:1; margin:10px 0 0; font-size:var(--t-small); color:var(--structure); }
@media (min-width:920px){
  body.cinema.cn-gate .wrap{ max-width:none; min-height:100vh; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,460px); gap:0 8vw; align-items:center; padding:40px 7vw; }
  body.cinema.cn-gate .brand{ grid-column:1 / -1; align-self:start; }
  body.cinema.cn-gate .wrap{ grid-template-rows:auto 1fr auto auto 1fr auto; }
  body.cinema.cn-gate .cn-line{ grid-column:1; grid-row:3; align-self:end; font-size:clamp(2.6rem, 4.6vw, 4.2rem); margin:0; }
  body.cinema.cn-gate .cn-sub{ grid-column:1; grid-row:4; align-self:start; font-size:var(--t-lead); max-width:44ch; margin-top:16px; }
  body.cinema.cn-gate .card.panel{ grid-column:2; grid-row:2 / span 3; align-self:center; margin-top:0; padding:30px 28px; }
  body.cinema.cn-gate .wrap > .card.panel:not(.on){ display:none; }
  body.cinema.cn-gate .wrap > footer{ grid-column:1 / -1; grid-row:6; }
  body.cinema.cn-home .pt-top{ display:none; }
  body.cinema.cn-gate .cn-film::after{ background:linear-gradient(90deg, rgba(6,14,28,.72) 0%, rgba(6,14,28,.45) 50%, rgba(11,24,48,.9) 100%); }
}

/* ---------- THE ARRIVAL: the lamp comes on, the name, then Home ---------- */
.cn-arrive{ position:fixed; inset:0; z-index:9999; background:#050C18; overflow:hidden; display:grid; place-items:center; }
.cn-arrive video, .cn-arrive img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cn-arrive .veil{ position:absolute; inset:0; background:radial-gradient(ellipse 70% 55% at 50% 42%, rgba(5,12,24,.05) 0%, rgba(5,12,24,.62) 70%, rgba(5,12,24,.9) 100%); }
.cn-arrive .mark{ position:relative; text-align:center; padding:0 24px; }
.cn-arrive .mark svg{ width:64px; height:64px; overflow:visible; }
.cn-arrive .mark svg path{ stroke-dasharray:232; stroke-dashoffset:232; animation:cnDraw 1.5s .25s var(--cn-ease) forwards; }
.cn-arrive .mark svg circle{ opacity:0; animation:cnPop .5s 1.4s var(--cn-ease) forwards; }
.cn-arrive .word{ display:block; margin-top:16px; font-family:var(--mono); font-size:var(--t-label); letter-spacing:.34em; color:#F8FEFF; opacity:0; animation:cnUp .9s 1.1s var(--cn-ease) forwards; }
.cn-arrive .hi{ display:block; margin:26px auto 0; max-width:12ch; font-family:var(--cn-serif); font-weight:400; font-size:clamp(2.1rem, 9vw, 3.6rem); line-height:1.05; letter-spacing:-.01em; color:#F8FEFF; opacity:0; transform:translateY(14px); text-wrap:balance; }
.cn-arrive .hi em{ font-style:italic; color:var(--teal2); }
.cn-arrive.greet .hi{ animation:cnUp 1s var(--cn-ease) forwards; }
.cn-arrive.out{ animation:cnGone .95s ease forwards; pointer-events:none; }
@keyframes cnDraw{ to{ stroke-dashoffset:0; } }
@keyframes cnPop{ from{ opacity:0; transform:scale(.3); transform-origin:78px 50px; } to{ opacity:1; transform:scale(1); } }
@keyframes cnUp{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:translateY(0); } }
@keyframes cnGone{ to{ opacity:0; transform:scale(1.04); } }

/* ---------- ENTRANCES: things arrive one after another ---------- */
.cn-in > *{ animation:cnRise .7s var(--cn-ease) both; }
.cn-in > *:nth-child(1){ animation-delay:.02s; } .cn-in > *:nth-child(2){ animation-delay:.09s; }
.cn-in > *:nth-child(3){ animation-delay:.16s; } .cn-in > *:nth-child(4){ animation-delay:.23s; }
.cn-in > *:nth-child(5){ animation-delay:.30s; } .cn-in > *:nth-child(6){ animation-delay:.37s; }
.cn-in > *:nth-child(n+7){ animation-delay:.44s; }
@keyframes cnRise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }

/* ---------- HOME ---------- */
body.cinema .cn-greet{ margin:6px 2px 14px; }
body.cinema .cn-greet .ey{ display:block; font-family:var(--mono); font-size:var(--t-label); letter-spacing:var(--ls3); color:var(--teal); text-transform:uppercase; }
body.cinema .cn-greet h2{ margin:6px 0 0; font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h1); line-height:1.06; letter-spacing:-.01em; color:#F8FEFF; text-wrap:balance; }
body.cinema .cn-greet h2 em{ font-style:italic; color:var(--teal2); }

body.cinema .m-hero{ aspect-ratio:4/5; border-radius:26px; background:#06111F;
  box-shadow:0 44px 80px -34px rgba(0,0,0,.9), 0 0 0 1px rgba(143,230,222,.12), inset 0 1px 0 rgba(255,255,255,.1); }
body.cinema .m-hero .im{ transform:scale(1.03); animation:cnKen 26s ease-in-out infinite alternate; will-change:transform; }
body.cinema .m-hero .sh{ background:
  radial-gradient(70% 45% at 0% 0%, rgba(64,201,190,.22), rgba(64,201,190,0) 70%),
  linear-gradient(180deg, rgba(5,12,24,0) 30%, rgba(5,12,24,.5) 58%, rgba(5,12,24,.96) 100%); }
body.cinema .m-hero::after{ content:''; position:absolute; inset:0; background-image:var(--cn-grain); background-size:220px 220px; opacity:.14; mix-blend-mode:overlay; pointer-events:none; }
body.cinema .m-hero .tx{ left:20px; right:20px; bottom:20px; z-index:1; }
body.cinema .m-hero .ey{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:var(--ls3); text-transform:uppercase; color:var(--teal2); }
body.cinema .m-hero b{ margin:8px 0 6px; font-family:var(--cn-serif); font-weight:400; font-size:clamp(1.65rem, 7.2vw, 2.25rem); line-height:1.08; letter-spacing:-.012em; -webkit-line-clamp:3; }
body.cinema .m-hero .co{ font-size:var(--t-small); color:rgba(232,242,252,.8); margin-bottom:14px; }
body.cinema .m-hero .go{ position:relative; padding:11px 18px 11px 15px; box-shadow:0 10px 30px -10px rgba(0,0,0,.8); }
body.cinema .m-hero .go::before{ content:''; position:absolute; inset:-1px; border-radius:inherit; box-shadow:0 0 0 0 rgba(143,230,222,.6); animation:cnPulse 2.8s ease-out infinite; }
@keyframes cnKen{ from{ transform:scale(1.03) translate3d(0,0,0); } to{ transform:scale(1.13) translate3d(-1.6%,-1.2%,0); } }
@keyframes cnPulse{ 0%{ box-shadow:0 0 0 0 rgba(143,230,222,.55); } 70%{ box-shadow:0 0 0 14px rgba(143,230,222,0); } 100%{ box-shadow:0 0 0 14px rgba(143,230,222,0); } }

body.cinema .m-tiles{ gap:12px; margin-top:14px; }
body.cinema .m-tile{ position:relative; min-height:134px; border-radius:22px; overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.085), rgba(255,255,255,.02)), linear-gradient(165deg, rgba(26,47,84,.72), rgba(13,26,49,.86));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(153,189,208,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 24px 44px -26px rgba(0,0,0,.85);
  transition:transform .35s var(--cn-ease), box-shadow .35s var(--cn-ease), border-color .35s; }
body.cinema .m-tile::before{ content:''; position:absolute; inset:0; background:radial-gradient(80% 60% at 0% 0%, rgba(143,230,222,.16), rgba(143,230,222,0) 70%); opacity:.9; pointer-events:none; }
body.cinema .m-tile:active{ transform:scale(.97); }
@media (hover:hover){ body.cinema .m-tile:hover{ transform:translateY(-3px); border-color:rgba(143,230,222,.36); box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 30px 50px -26px rgba(0,0,0,.9), 0 0 24px -6px rgba(64,201,190,.35); } }
body.cinema .m-tile .ib{ width:38px; height:38px; border-radius:12px; background:rgba(64,201,190,.14); box-shadow:inset 0 0 0 1px rgba(143,230,222,.18); }
body.cinema .m-tile .n{ font-size:2.4rem; font-weight:500; letter-spacing:-.02em; }
body.cinema .m-tile .n.w{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2b); letter-spacing:-.01em; }
body.cinema .m-tile .k{ color:var(--structure); }
body.cinema .m-tile.hot{ border-color:rgba(64,201,190,.45); background:linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.02)), linear-gradient(160deg, rgba(25,76,86,.78), rgba(13,30,52,.88)); }
body.cinema .m-tile.hot::after{ content:''; position:absolute; top:16px; right:16px; width:8px; height:8px; border-radius:50%; background:var(--teal2); box-shadow:0 0 0 0 rgba(143,230,222,.6); animation:cnPulse 2.2s ease-out infinite; }

body.cinema .m-att .m-sec{ margin-top:26px; }
body.cinema .m-att .m-sec h3, body.cinema .m-sec h3{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:-.01em; color:#F8FEFF; }
body.cinema .m-list{ border-radius:22px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.62), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(153,189,208,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 24px 44px -28px rgba(0,0,0,.85); }
body.cinema .m-row{ transition:background .25s; }
@media (hover:hover){ body.cinema .m-row:hover{ background:rgba(143,230,222,.05); } }

/* the count that counts up */
.cn-count{ font-variant-numeric:tabular-nums; }

@media (max-width:919px){
  body.cinema .cn-side, body.cinema .cn-greet{ display:none; }
  /* the phone's own head becomes the greeting: the day in mono, the name in serif */
  body.cinema .pt-top .pt-eye{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:var(--ls3); text-transform:uppercase; color:var(--teal); margin-bottom:6px; }
  body.cinema .pt-top h1.cn-serif{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(2rem, 9vw, 2.6rem); letter-spacing:-.01em; }
}

/* ---------- TABLET: the hero and the four numbers side by side ---------- */
@media (min-width:600px) and (max-width:919px){
  body.cinema .m-home{ grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:16px 18px; }
  body.cinema .m-home > .m-hero, body.cinema .m-home > .m-hero-empty{ grid-column:1; grid-row:1; aspect-ratio:auto; min-height:340px; }
  body.cinema .m-home > .m-tiles{ grid-column:2; grid-row:1; }
  body.cinema .m-home > .m-att{ grid-column:1 / -1; grid-row:2; }
  body.cinema .cn-greet h2{ font-size:var(--t-title); }
}

/* ---------- LAPTOP: the same Home, wider, beside the grouped sidebar ---------- */
@media (min-width:920px){
  body.cinema #desk > .hm-greet, body.cinema #desk > .hm-tiles, body.cinema #desk > .hm-two > .hm-left{ display:none; }
  body.cinema #desk > .hm-two{ display:block; }
  body.cinema .m-home{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:18px 22px; align-items:stretch; margin-bottom:8px; }
  body.cinema .m-home > .cn-greet{ grid-column:1 / -1; margin:4px 2px 4px; }
  body.cinema .cn-greet h2{ font-size:clamp(2.2rem, 3.2vw, 3rem); }
  body.cinema .m-home > .m-hero, body.cinema .m-home > .m-hero-empty{ grid-column:1; aspect-ratio:auto; min-height:440px; }
  body.cinema .m-hero b{ font-size:clamp(2rem, 2.8vw, 2.7rem); }
  body.cinema .m-home > .m-tiles{ grid-column:2; grid-template-columns:1fr 1fr; margin-top:0; }
  body.cinema .m-home > .m-tiles .m-tile{ min-height:0; }
  body.cinema .m-home > .m-att{ grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:0 22px; align-items:start; }
  body.cinema .m-att > .m-sec{ grid-column:1 / -1; }
  body.cinema .m-att > .m-list{ grid-column:1; }
  body.cinema .m-att > .cn-side{ grid-column:2; display:flex; flex-direction:column; gap:16px; }
  body.cinema .m-att > .cn-side .pt-card{ margin:0; border-radius:22px;
    background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.62), rgba(13,26,49,.8));
    border:1px solid rgba(153,189,208,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 24px 44px -28px rgba(0,0,0,.85); }
  body.cinema .m-att > .cn-side .pt-card h3{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h3); }
  body.cinema .sidenav{ background:linear-gradient(180deg, rgba(10,22,42,.7), rgba(10,22,42,.4)); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
  body.cinema .hm-block .pt-sec h3{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); }
}
@media (min-width:1280px){
  body.cinema .m-home{ grid-template-columns:minmax(0,8fr) minmax(0,4fr); }
  body.cinema .m-home > .m-hero{ min-height:500px; }
}

/* ---------- OFF: motion off for anyone who asked their phone for less ---------- */
@media (prefers-reduced-motion: reduce){
  .cn-sky i, .m-hero .im, .m-hero .go::before, .m-tile.hot::after, .cn-in > *, .cn-arrive *{ animation:none !important; }
  .cn-in > *{ opacity:1; transform:none; }
  .cn-arrive .mark svg path{ stroke-dashoffset:0; } .cn-arrive .mark svg circle, .cn-arrive .word{ opacity:1; }
  .cn-arrive.greet .hi{ opacity:1; transform:none; }
  .cn-arrive.out{ opacity:0; transition:opacity .4s; }
}

/* ============================================================
   CHECK IT (check.html) · the registers, made cinematic
   ============================================================ */
body.cinema.cn-check .page{ position:relative; z-index:1; }
body.cinema .cn-band{ position:absolute; left:0; right:0; top:0; height:min(62vh, 560px); z-index:0; pointer-events:none; overflow:hidden; }
body.cinema .cn-band img{ width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.06); transition:opacity 1.6s ease; animation:cnKen 30s ease-in-out infinite alternate; }
body.cinema .cn-band.on img{ opacity:.58; }
body.cinema .cn-band img{ object-position:60% 45%; }
body.cinema.cn-compare .cn-band{ height:min(46vh, 420px); } body.cinema.cn-compare .cn-band.on img{ opacity:.4; object-position:50% 40%; }
body.cinema .cn-band::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(11,24,48,.3) 0%, rgba(11,24,48,.42) 40%, rgba(11,24,48,.82) 75%, #0B1830 100%); }
body.cinema .cn-band + .page, body.cinema .page{ position:relative; z-index:1; }

body.cinema.cn-check .hd h1{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(2.1rem, 9.4vw, 2.9rem); line-height:1.04; letter-spacing:-.012em; }
body.cinema.cn-check .hd h1 em{ font-style:italic; color:var(--teal2); }
body.cinema.cn-check .hd p{ color:var(--body); }
body.cinema.cn-check .cbar{ border-radius:22px; padding:12px 12px 12px 18px;
  background:linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.02)), rgba(7,20,38,.62);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(64,201,190,.34), 0 30px 60px -30px rgba(0,0,0,.9);
  transition:box-shadow .35s var(--cn-ease); }
body.cinema.cn-check .cbar:focus-within{ box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1.5px rgba(143,230,222,.75), 0 0 0 6px rgba(64,201,190,.12), 0 30px 60px -30px rgba(0,0,0,.9); }
body.cinema.cn-check .cbar .go{ box-shadow:0 0 22px -4px rgba(64,201,190,.7); }
body.cinema.cn-check .hint{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:14px; letter-spacing:var(--ls2); }
body.cinema.cn-check .hint b{ position:relative; padding-left:14px; }
body.cinema.cn-check .hint b::before{ content:''; position:absolute; left:0; top:.42em; width:8px; height:8px; border-radius:50%; background:currentColor; box-shadow:0 0 10px currentColor; }
body.cinema.cn-check .hint b:nth-of-type(1){ color:var(--teal2); } body.cinema.cn-check .hint b:nth-of-type(2){ color:var(--amber); } body.cinema.cn-check .hint b:nth-of-type(3){ color:#FF8A7A; }
body.cinema.cn-check .toreg, body.cinema.cn-check .cand, body.cinema.cn-check .wait, body.cinema.cn-check .dv, body.cinema.cn-check .ln, body.cinema.cn-check .mean, body.cinema.cn-check .rc, body.cinema.cn-check .mine .list > *{
  border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.6), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(153,189,208,.14), 0 24px 44px -28px rgba(0,0,0,.85);
  transition:transform .3s var(--cn-ease), box-shadow .3s var(--cn-ease); }
@media (hover:hover){ body.cinema.cn-check .toreg:hover, body.cinema.cn-check .cand:hover, body.cinema.cn-check .dv:hover{ transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1px rgba(143,230,222,.3), 0 30px 50px -26px rgba(0,0,0,.9); } }
body.cinema.cn-check .dv.picked{ box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1.5px rgba(143,230,222,.7), 0 0 30px -8px rgba(64,201,190,.45), 0 24px 44px -28px rgba(0,0,0,.85); }
body.cinema.cn-check .fh h2, body.cinema.cn-check .named h2{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(1.8rem, 7.6vw, 2.5rem); line-height:1.06; letter-spacing:-.012em; }
body.cinema.cn-check .sides{ position:relative; border-radius:100px; padding:5px; background:rgba(7,20,38,.6); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); box-shadow:inset 0 0 0 1px rgba(153,189,208,.16), inset 0 1px 0 rgba(255,255,255,.08); }
body.cinema.cn-check .sides button{ border-radius:100px; transition:color .25s, background .35s var(--cn-ease), box-shadow .35s; }
body.cinema.cn-check .sides button[aria-pressed="true"]{ background:linear-gradient(160deg, rgba(64,201,190,.28), rgba(64,201,190,.12)); box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 0 22px -6px rgba(64,201,190,.6); color:#F8FEFF; }
body.cinema.cn-check .sides button b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:0; }
body.cinema.cn-check .wait{ text-align:center; padding:34px 20px 28px; }
body.cinema.cn-check .wait .k{ display:block; }
body.cinema.cn-check .wait::before{ content:''; display:block; width:54px; height:54px; margin:0 auto 16px; border-radius:50%;
  background:conic-gradient(from 0deg, rgba(64,201,190,0), rgba(143,230,222,.9)); -webkit-mask:radial-gradient(circle, transparent 58%, #000 60%); mask:radial-gradient(circle, transparent 58%, #000 60%);
  animation:cnSpin 1.4s linear infinite; }
body.cinema.cn-check .wait .steps{ text-align:left; display:inline-block; }
body.cinema.cn-check .wait .steps .on i{ box-shadow:0 0 12px var(--teal); }
@keyframes cnSpin{ to{ transform:rotate(360deg); } }
body.cinema.cn-check .words{ gap:6px; }
body.cinema.cn-check .words > div{ border-radius:14px; padding:10px 4px 9px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), rgba(7,20,38,.6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1), inset 0 0 0 1px rgba(153,189,208,.14); }
body.cinema.cn-check .words > div b{ font-family:var(--cn-serif); font-size:var(--t-lead2); letter-spacing:0; text-shadow:0 0 14px currentColor; }
body.cinema.cn-check .ln .top .w{ font-family:var(--cn-serif); font-size:var(--t-lead2); letter-spacing:0; }
body.cinema.cn-check .tray{ background:rgba(10,20,40,.8); -webkit-backdrop-filter:blur(24px) saturate(1.3); backdrop-filter:blur(24px) saturate(1.3); box-shadow:0 -1px 0 rgba(153,189,208,.14), 0 -20px 50px -20px rgba(0,0,0,.6); }
@media (min-width:920px){
  body.cinema.cn-check .page{ max-width:760px; }
  body.cinema.cn-check .hd h1{ font-size:clamp(2.6rem, 4vw, 3.6rem); }
  body.cinema.cn-check .words{ gap:8px; }
}

/* ============================================================
   COMPARE (compare.html) · two sides, side by side
   ============================================================ */
body.cinema.cn-compare .hd h1{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(1.9rem, 8vw, 2.6rem); line-height:1.05; letter-spacing:-.012em; }
body.cinema.cn-compare .hd h1 em{ font-style:italic; color:var(--teal2); }
body.cinema.cn-compare .fromcard, body.cinema.cn-compare .pk, body.cinema.cn-compare .read, body.cinema.cn-compare .rw, body.cinema.cn-compare .note, body.cinema.cn-compare .empty{
  border-radius:18px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.6), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(153,189,208,.14), 0 22px 40px -28px rgba(0,0,0,.85);
  transition:transform .3s var(--cn-ease), box-shadow .3s var(--cn-ease); }
body.cinema.cn-compare .fromcard{ box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(64,201,190,.45), 0 0 30px -10px rgba(64,201,190,.4), 0 22px 40px -28px rgba(0,0,0,.85); }
body.cinema.cn-compare .pk{ border-radius:16px 16px 0 0; }
body.cinema.cn-compare .pk.on.can{ box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1.5px rgba(143,230,222,.7), 0 0 26px -8px rgba(64,201,190,.5); }
body.cinema.cn-compare .pk.on.reg{ box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1.5px var(--regln), 0 0 26px -8px rgba(120,150,255,.45); }
@media (hover:hover){ body.cinema.cn-compare .pk:hover{ transform:translateY(-1px); } }
body.cinema.cn-compare .tabs{ border-radius:100px; padding:5px; background:rgba(7,20,38,.6); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); box-shadow:inset 0 0 0 1px rgba(153,189,208,.16), inset 0 1px 0 rgba(255,255,255,.08); }
body.cinema.cn-compare .tab{ border-radius:100px; transition:background .35s var(--cn-ease), color .25s; }
body.cinema.cn-compare .tab[aria-pressed="true"], body.cinema.cn-compare .tab.on{ background:linear-gradient(160deg, rgba(64,201,190,.28), rgba(64,201,190,.12)); box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 0 22px -6px rgba(64,201,190,.6); color:#F8FEFF; }
body.cinema.cn-compare .tab b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-lead2); letter-spacing:0; }
body.cinema.cn-compare .filter{ border-radius:100px; background:rgba(7,20,38,.6); box-shadow:inset 0 0 0 1px rgba(153,189,208,.18), inset 0 1px 0 rgba(255,255,255,.06); }
body.cinema.cn-compare .read{ padding:22px 20px; background:linear-gradient(160deg, rgba(64,201,190,.14), rgba(64,201,190,.03)), linear-gradient(165deg, rgba(26,47,84,.6), rgba(13,26,49,.8)); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(64,201,190,.32), 0 0 40px -14px rgba(64,201,190,.45); }
body.cinema.cn-compare .read p, body.cinema.cn-compare .read > b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h3); line-height:1.25; color:#F8FEFF; letter-spacing:-.005em; }
body.cinema.cn-compare .rw.lit{ box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(64,201,190,.5), 0 0 30px -10px rgba(64,201,190,.45), 0 22px 40px -28px rgba(0,0,0,.85); }
body.cinema.cn-compare .gh b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h3); letter-spacing:0; text-transform:none; }
body.cinema.cn-compare .face .im, body.cinema.cn-compare .face .av{ border-radius:18px; box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(153,189,208,.16), 0 20px 40px -24px rgba(0,0,0,.85); }
body.cinema.cn-compare .pill{ -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
body.cinema.cn-compare .pill[aria-pressed="true"], body.cinema.cn-compare .pill.on{ box-shadow:0 0 20px -6px rgba(64,201,190,.6); }
body.cinema.cn-compare .tray{ background:rgba(10,20,40,.8); -webkit-backdrop-filter:blur(24px) saturate(1.3); backdrop-filter:blur(24px) saturate(1.3); box-shadow:0 -1px 0 rgba(153,189,208,.14), 0 -20px 50px -20px rgba(0,0,0,.6); }
@media (min-width:920px){ body.cinema.cn-compare .hd h1{ font-size:clamp(2.4rem, 3.6vw, 3.4rem); } }

/* ============================================================
   THE ROOMS ON THE DOCTOR'S PAGE · Films, Messages, You, Insights
   ============================================================ */
/* the phone's room title: every room in serif, not only Home */
@media (max-width:919px){
  body.cinema .pt-top h1{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(2rem, 9vw, 2.6rem); letter-spacing:-.01em; }
}
/* the glass every list on these rooms sits on */
body.cinema .m-card, body.cinema #counter .ct-card, body.cinema #wire .wl, body.cinema .an-kpi, body.cinema .an-ch, body.cinema .pt-card{
  border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.62), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(153,189,208,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 24px 44px -28px rgba(0,0,0,.85); }
body.cinema #counter .ct-card{ border-radius:18px; transition:transform .3s var(--cn-ease), box-shadow .3s var(--cn-ease); }
body.cinema #counter .ct-card.lit{ border-color:rgba(64,201,190,.45); box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 0 26px -8px rgba(64,201,190,.45), 0 24px 44px -28px rgba(0,0,0,.85); }
@media (hover:hover){ body.cinema #counter .ct-card:hover{ transform:translateY(-2px); } }
body.cinema #counter .ct-av{ border-radius:13px; box-shadow:inset 0 0 0 1px rgba(153,189,208,.18); }
body.cinema #counter .ct-card .t b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-lead2); letter-spacing:-.005em; }
body.cinema #counter .ct-sec, body.cinema #counter .ct-head b{ color:var(--teal); }
body.cinema #counter .ct-req{ border-radius:18px; background:linear-gradient(160deg, rgba(64,201,190,.12), rgba(64,201,190,.02)), rgba(7,20,38,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.1), inset 0 0 0 1px rgba(64,201,190,.3); }

/* the films board: the tiles as glass, the cover as a shot */
body.cinema .bt{ border-radius:20px; background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), rgba(7,28,51,.6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(153,189,208,.14), 0 24px 44px -28px rgba(0,0,0,.85);
  transition:transform .35s var(--cn-ease), box-shadow .35s var(--cn-ease); }
@media (hover:hover){ body.cinema .bt-post:hover{ transform:translateY(-3px); box-shadow:inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1px rgba(143,230,222,.3), 0 30px 50px -26px rgba(0,0,0,.9); } body.cinema .bt-post:hover .cv img{ transform:scale(1.03); } }
body.cinema .bt-post .cv img{ transition:transform 1.2s var(--cn-ease); }
body.cinema .bt-post .cv .pl{ box-shadow:0 0 0 0 rgba(143,230,222,.55); animation:cnPulse 2.8s ease-out infinite; }
body.cinema .bt-post .nmx{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); line-height:1.12; letter-spacing:-.01em; }
body.cinema .bt-end h2, body.cinema .rp-end h2{ font-family:var(--cn-serif); font-weight:400; }
body.cinema .rp-seg{ box-shadow:inset 0 0 0 1px rgba(153,189,208,.16), inset 0 1px 0 rgba(255,255,255,.08); }
body.cinema .rp-seg button[aria-pressed="true"], body.cinema .rp-seg .on{ box-shadow:0 0 22px -6px rgba(64,201,190,.6); }
body.cinema .rp-askbar{ box-shadow:inset 0 0 0 1px rgba(64,201,190,.3), inset 0 1px 0 rgba(255,255,255,.08); }
/* the reel itself keeps its own dark: only the panel and the words share the serif */
body.cinema .rp-plain .rp-nm, body.cinema .rp .rp-nm{ font-family:var(--cn-serif); font-weight:400; letter-spacing:-.005em; }

/* You */
body.cinema .m-me .av{ box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 0 0 1px rgba(64,201,190,.4), 0 0 30px -8px rgba(64,201,190,.5); }
body.cinema .m-me b{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h3); letter-spacing:-.005em; }
body.cinema .m-sec h3{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:-.01em; color:#F8FEFF; }

/* Insights: the numbers in serif, the cards as glass, the plots with a little glow */
body.cinema .an-h2, body.cinema .an-ch h3{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:-.01em; color:#F8FEFF; }
body.cinema .an-h2 i{ font-family:var(--mono); font-size:var(--t-label); letter-spacing:var(--ls3); color:var(--teal); vertical-align:middle; margin-right:8px; }
body.cinema .an-kpi .n, body.cinema .an-val{ font-family:var(--cn-serif) !important; font-weight:400; font-size:2.6rem; letter-spacing:-.02em; }
body.cinema .an-kpi{ padding:18px 18px 16px; }
body.cinema .an-pill[aria-pressed="true"], body.cinema .an-pill.on{ box-shadow:0 0 22px -6px rgba(64,201,190,.6); }
body.cinema .an-plot svg path[stroke], body.cinema .an-mini svg path[stroke]{ filter:drop-shadow(0 0 6px rgba(64,201,190,.35)); }
body.cinema .an-tbl th{ font-family:var(--mono); letter-spacing:var(--ls); text-transform:uppercase; font-size:var(--t-label); color:var(--muted); }

/* ============================================================
   ENQUIRE VIA CANIPUS (enquire.html) and the record page (item.html)
   ============================================================ */
body.cinema.cn-enquire .card, body.cinema.cn-enquire .co, body.cinema.cn-enquire .writing, body.cinema.cn-enquire .note, body.cinema.cn-enquire .tab{
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.62), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(153,189,208,.14), 0 24px 44px -28px rgba(0,0,0,.85); }
body.cinema.cn-enquire .card{ border-radius:22px; padding:22px 18px; }
body.cinema.cn-enquire .co{ border-radius:18px; }
body.cinema.cn-enquire .co .cls small{ font-size:9px; letter-spacing:.04em; }
body.cinema.cn-enquire .hd h1{ font-size:clamp(2.1rem, 9.2vw, 2.9rem); line-height:1.04; }
body.cinema.cn-enquire .card > h2, body.cinema.cn-enquire .card h2{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:-.01em; }
body.cinema.cn-enquire .chip{ -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); transition:background .25s, box-shadow .25s, transform .2s var(--cn-ease); }
body.cinema.cn-enquire .chip:active{ transform:scale(.96); }
body.cinema.cn-enquire .chip[aria-pressed="true"]{ background:linear-gradient(160deg, rgba(64,201,190,.28), rgba(64,201,190,.12)); box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1.5px var(--teal), 0 0 22px -6px rgba(64,201,190,.55); }
body.cinema.cn-enquire .tab[aria-selected="true"]{ box-shadow:inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1.5px var(--teal), 0 0 22px -6px rgba(64,201,190,.5); }
body.cinema.cn-enquire .go{ box-shadow:0 14px 34px -12px rgba(64,201,190,.7), inset 0 1px 0 rgba(255,255,255,.35); transition:transform .2s var(--cn-ease), box-shadow .3s; }
body.cinema.cn-enquire .go:not(:disabled):active{ transform:scale(.985); }
body.cinema.cn-enquire .writing{ border-radius:22px; padding:36px 22px 30px; }
body.cinema.cn-enquire .writing .ico, body.cinema.cn-enquire .writing > span:first-child{ box-shadow:0 0 0 0 rgba(143,230,222,.5); animation:cnPulse 2.2s ease-out infinite; }
body.cinema.cn-enquire .writing h2, body.cinema.cn-enquire .writing b{ font-family:var(--cn-serif); font-weight:400; }
body.cinema.cn-enquire .done-h .seal{ box-shadow:inset 0 0 0 1.5px var(--teal), 0 0 40px -8px rgba(64,201,190,.7); animation:cnPulse 2.6s ease-out infinite; }
body.cinema.cn-enquire .done-h h1{ font-size:clamp(2.1rem, 9vw, 2.9rem); }
body.cinema.cn-enquire .sendbar{ background:rgba(10,20,40,.8); -webkit-backdrop-filter:blur(24px) saturate(1.3); backdrop-filter:blur(24px) saturate(1.3); box-shadow:0 -1px 0 rgba(153,189,208,.14), 0 -20px 50px -20px rgba(0,0,0,.6); }
body.cinema.cn-enquire .pv{ border-radius:20px; overflow:hidden; box-shadow:0 40px 80px -34px rgba(0,0,0,.95), 0 0 0 1px rgba(153,189,208,.16); }
@media (min-width:920px){ body.cinema.cn-enquire .hd h1{ font-size:clamp(2.6rem, 3.8vw, 3.6rem); } }

body.cinema.cn-item .banner .sign h1{ font-family:var(--cn-serif); font-weight:400; font-size:clamp(2rem, 8.6vw, 2.7rem); letter-spacing:-.012em; }
body.cinema.cn-item .card, body.cinema.cn-item .cocard, body.cinema.cn-item .post, body.cinema.cn-item .rec, body.cinema.cn-item .broch{
  border-radius:18px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)), linear-gradient(165deg, rgba(26,47,84,.62), rgba(13,26,49,.8));
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px rgba(153,189,208,.14), 0 22px 40px -28px rgba(0,0,0,.85); }
body.cinema.cn-item .sec h2, body.cinema.cn-item .lsec h2{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2); letter-spacing:-.01em; }
body.cinema.cn-item .acts .ask{ box-shadow:0 14px 34px -12px rgba(64,201,190,.75), inset 0 1px 0 rgba(255,255,255,.35); }
@media (min-width:920px){ body.cinema.cn-item .banner .sign h1{ font-size:clamp(2.4rem, 3.4vw, 3.4rem); } }
@media (min-width:920px){
  body.cinema .pt-top h1{ font-family:var(--cn-serif); font-weight:400; font-size:var(--t-h2b); letter-spacing:-.01em; }
}