/* faverly.app in Glass Rooms (Kris 2026-10-18: the Tiles metaphor "went too far" — keep the layout and colours,
   lighter softer type, rounder blocks, liquid glass). Each section sits on a soft tint of its room's colour with
   white rounded cards, capsule buttons, Outfit light for the big lowercase titles. Tiles: tiles.css (kept). */
@font-face { font-family:Outfit; font-weight:200; font-display:swap; src:url(/fonts/Outfit-ExtraLight.ttf) format("truetype"); }
@font-face { font-family:Outfit; font-weight:300; font-display:swap; src:url(/fonts/Outfit-Light.ttf) format("truetype"); }
@font-face { font-family:Outfit; font-weight:400; font-display:swap; src:url(/fonts/Outfit-Regular.ttf) format("truetype"); }
@font-face { font-family:Outfit; font-weight:500; font-display:swap; src:url(/fonts/Outfit-Medium.ttf) format("truetype"); }
@font-face { font-family:Outfit; font-weight:600; font-display:swap; src:url(/fonts/Outfit-SemiBold.ttf) format("truetype"); }
:root { --movies:#e8432f; --shows:#6a3cf0; --books:#00a07a; --music:#e8336e; --eats:#f59b00; --hotels:#1f6feb;
        --movies-deep:#c8321f; --sunny:#ffb627;
        --ground:#f7f5f3; --card:#ffffff; --ink:#1a1a1d; --soft:#5c5c62; --line:#ebe7e4; --room:var(--movies); }
/* One theme across the site (CD full review, 2026-10-27): light, like the homepage, whatever the system setting. */
:root { color-scheme:light; }
* { box-sizing:border-box; margin:0; }
html { background:var(--ground); }
body { background:var(--ground); color:var(--ink); font:18px/1.55 Outfit, "Helvetica Neue", Arial, sans-serif;
       -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a { color:inherit; }
a:focus-visible { outline:2px solid currentColor; outline-offset:3px; border-radius:4px; }
.wrap { max-width:1080px; margin:0 auto; padding:0 20px; position:relative; }
/* the top row: wordmark left, a little line right, on the page's ground */
.slab { background:transparent; color:var(--ink); position:relative; z-index:2; }
.slab .wrap { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding-top:22px; padding-bottom:10px; }
.mark { font:500 30px/1 Outfit, Arial, sans-serif; letter-spacing:-.02em; text-decoration:none; color:var(--ink); }
.slab small { font:500 14px/1 Outfit, Arial, sans-serif; color:var(--ink); }
header.slab { margin-bottom:-72px; }                       /* the first room runs up under the wordmark */
/* rooms: a soft tint of the colour, with a big circle of it half off the top-right and a smaller companion */
.room { --room:var(--movies); --companion:var(--sunny); position:relative; overflow:hidden; color:var(--ink);
        background:color-mix(in srgb, var(--room) 13%, var(--ground)); }
.room::before, .room::after { content:""; position:absolute; border-radius:50%; pointer-events:none; }
.room::before { width:min(520px, 70vw); aspect-ratio:1; right:max(-180px, -16vw); top:min(-220px, -18vw); background:var(--room); }
.room::after { width:min(130px, 18vw); aspect-ratio:1; right:min(330px, 44vw); top:min(110px, 14vw); background:var(--companion); }
.room > .wrap { position:relative; z-index:1; padding-top:112px; }
.room.movies { --room:var(--movies); --companion:var(--sunny); } .room.shows { --room:var(--shows); --companion:var(--music); }
.room.books { --room:var(--books); --companion:var(--hotels); } .room.music { --room:var(--music); --companion:var(--eats); }
.room.eats { --room:var(--eats); --companion:var(--movies); } .room.hotels { --room:var(--hotels); --companion:var(--books); }
.room.black { --room:var(--shows); --companion:var(--music); background:transparent; }
.room.black::before, .room.black::after { display:none; }
.room.black > .wrap { padding-top:12px; }
.eyebrow { font:500 14px/1 Outfit, Arial, sans-serif; color:var(--soft); }
h1, .big { font:300 clamp(52px, 12vw, 120px)/.92 Outfit, "Helvetica Neue", Arial, sans-serif; letter-spacing:-.035em;
           text-transform:lowercase; }
/* the pivot: category names running off the edge, the current one in ink */
.pivot { display:flex; gap:.4em; white-space:nowrap; font:300 clamp(38px, 8.5vw, 80px)/1 Outfit, Arial, sans-serif;
         letter-spacing:-.03em; margin-right:-60vw; }
.pivot span { opacity:.3; } .pivot span:first-child { opacity:1; }
/* buttons: capsules */
.block { display:inline-block; background:var(--movies-deep); color:#fff; text-decoration:none; padding:16px 26px;
         border-radius:999px; font:500 17px/1 Outfit, Arial, sans-serif; box-shadow:0 10px 26px rgba(200,50,31,.25); }
.block.outline { background:var(--card); color:var(--ink); box-shadow:0 2px 10px rgba(0,0,0,.06); }
/* the wall: six rounded colour blocks with room between them */
.wall { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; padding:20px; max-width:1080px; margin:0 auto; }
.wall .tile { aspect-ratio:1; display:flex; flex-direction:column; justify-content:flex-end; padding:18px; color:#fff;
              border-radius:26px; overflow:hidden; }
.wall .tile::before, .wall .tile::after { display:none; }
.wall .tile.room { background:var(--room); }
.wall .tile.room.eats { color:#1a1a1d; }
.wall .tile b { font:300 clamp(30px, 6vw, 52px)/.9 Outfit, Arial, sans-serif; letter-spacing:-.03em; }
.wall .tile span { font:500 14px/1.3 Outfit, Arial, sans-serif; margin-top:8px; }
@media (max-width:640px) { .wall { grid-template-columns:repeat(2, 1fr); padding:16px; gap:10px; } }
@media (min-width:1000px) { .wall { grid-template-columns:repeat(6, 1fr); } .wall .tile b { font-size:38px; } }
/* legal pages: white cards on the ground */
.doc { max-width:760px; margin:0 auto 64px; padding:28px 28px 36px; background:var(--card); border-radius:28px;
       position:relative; z-index:1; margin-top:-28px; box-shadow:0 2px 14px rgba(0,0,0,.05); }
@media (max-width:800px) { .doc { margin-left:16px; margin-right:16px; padding:24px 20px 30px; } }
.doc .updated { color:var(--soft); font-weight:400; font-size:15px; margin-bottom:24px; }
.doc p, .doc li { font-size:18px; }
.doc p { margin:0 0 14px; }
.doc h2 { font:500 22px/1.2 Outfit, Arial, sans-serif; margin:32px 0 10px; padding-top:18px; border-top:1px solid var(--line); }
.doc ul { padding-left:22px; } .doc li { margin:6px 0; }
.doc a { color:var(--movies-deep); }
footer.slab .wrap { display:block; font:400 15px/1.6 Outfit, Arial, sans-serif; color:var(--soft); padding-top:22px; padding-bottom:34px; }
footer.slab a { color:var(--ink); }
