/* styles.css */
@layer reset, base, composition, glass, detail, responsive, experience, accessibility;
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  body, h1, h2, p { margin: 0; }
  button, a { -webkit-tap-highlight-color: transparent; }
  button { font: inherit; color: inherit; cursor: pointer; }
  a { color: inherit; text-decoration: none; }
  button { border: 0; }
  svg { display: block; }
}
@layer base {
  :root { color-scheme: light; --bg: #f4f6f8; --ink: #171c2b; --muted: #748196; --ease: cubic-bezier(.23,1,.32,1); }
  html { background: var(--bg); }
  body { height: 100svh; min-height: 440px; overflow: hidden; color: var(--ink); background: var(--bg); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 16px; -webkit-font-smoothing: antialiased; }
  .ambient { position: fixed; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 19% 43%, #dcedffb3, transparent 45%), radial-gradient(ellipse at 79% 23%, #ece7fb8c, transparent 38%), radial-gradient(ellipse at 84% 75%, #f5ebed70, transparent 30%); }
  .ambient::after { content: ''; position: absolute; inset: 0; opacity: .14; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238b9aab' filter='url(%23n)' opacity='.22' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
  .svg-library { position: absolute; width: 0; height: 0; overflow: hidden; }
  .arrow { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
  .header { position: absolute; z-index: 3; top: max(26px, env(safe-area-inset-top)); left: 2.6%; right: 2.6%; display: flex; justify-content: space-between; align-items: center; }
  .wordmark { font-weight: 730; font-size: clamp(22px, 2.1vw, 32px); letter-spacing: -1.3px; }
  .hello { display: flex; gap: 9px; align-items: center; padding: 13px 22px; border: 1px solid #b7c4d380; box-shadow: 0 1px 1px #fff inset, 0 5px 15px #485a7410; border-radius: 100px; background: #ffffff35; font-size: 17px; transition: background .25s, transform .25s; }
  .hello:hover { background: #ffffffa0; transform: translateY(-2px); }
  .footer { position: absolute; z-index: 2; bottom: max(29px, env(safe-area-inset-bottom)); left: 2.6%; right: 2.6%; display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 14px; }
  .footer-note, .hint { color: var(--muted); }
  .hint { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; pointer-events: none; }
  .social { display: flex; gap: 28px; align-items: center; }
  .social a { display: inline-flex; align-items: center; gap: 7px; padding: 10px 0; }
  .social a:hover { text-decoration: underline; text-underline-offset: 5px; }
  .social .arrow { width: 13px; height: 13px; }
  .motion-toggle { width: 32px; height: 32px; background: transparent; border: 1px solid #bac5d15c; border-radius: 50%; color: #738196; }
  .motion-toggle svg { width: 18px; height: 18px; margin: auto; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .resume-icon, .motion-paused .pause-icon { display: none; }
  .motion-paused .resume-icon { display: block; }
  .motion-toggle:disabled { opacity: .45; cursor: default; }
}
@layer composition {
  .scene { position: absolute; width: min(100vw, calc((100svh - 145px) * 1.7)); aspect-ratio: 1.7; left: 50%; top: 51%; transform: translate(-50%, -50%); isolation: isolate; }
  .person { position: absolute; top: 20%; left: 50%; transform: translateX(-50%); width: 46%; text-align: center; }
  .memoji { position: relative; z-index: 2; display: block; width: 54%; padding: 0; margin: 0 auto; background: transparent; transform-origin: 50% 74%; transition: transform .4s var(--ease); }
  .memoji img { display: block; width: 100%; height: auto; filter: drop-shadow(0 7px 5px #7085a01c); user-select: none; }
  .memoji:hover { transform: rotate(-5deg) translateY(-4px); }
  .head-shadow { display: block; width: 27%; height: 14px; margin: -7% auto 5.5%; border-radius: 50%; background: #5269803b; filter: blur(10px); }
  h1 { font-size: clamp(25px, 2.65vw, 41px); font-weight: 720; letter-spacing: -1.25px; line-height: 1.15; white-space: nowrap; }
  .person p { margin-top: 12px; font-size: clamp(14px, 1.35vw, 21px); color: var(--muted); letter-spacing: -.2px; }
  .bubble-position { position: absolute; width: 17.6%; aspect-ratio: 1; transform: translate(-50%, -50%); perspective: 700px; }
  .position-projects { left: 29.5%; top: 21.5%; }
  .position-games { left: 70%; top: 19.5%; }
  .position-music { left: 18%; top: 53.8%; }
  .position-apps { left: 82.5%; top: 50.2%; }
  .position-play { left: 76%; top: 84%; }
  .droplet { position: absolute; width: 2.6%; aspect-ratio: 1; border-radius: 50%; border: 1px solid #ffffffc9; background: radial-gradient(circle at 29% 20%, #fff, #fff0 23%), radial-gradient(circle at 60% 80%, #fff0 45%, #a7bbd73b 70%, #fff8 78%); box-shadow: inset 0 -2px 3px #95b6d340, inset 1px 2px 3px #fff, 0 5px 8px #586c7e18; pointer-events: none; }
  .droplet-one { left: 7.4%; top: 35%; }
  .droplet-two { right: 3%; top: 65%; }
  .waving { animation: hello-wave 1.2s var(--ease); }
  @keyframes hello-wave { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-12deg) translateY(-9px); } 50% { transform: rotate(8deg) translateY(-5px); } 75% { transform: rotate(-5deg); } }
}
@layer glass {
  .bubble { --tint: 92 157 255; --color: #5c9dff; --delay: 0s; --rx: 0deg; --ry: 0deg; position: relative; width: 100%; height: 100%; border-radius: 50%; isolation: isolate; padding: 0; color: var(--color); border: 1px solid rgb(var(--tint) / .5); background: radial-gradient(ellipse at 28% 20%, #fffffff2 0%, #ffffff70 7%, #ffffff00 22%), radial-gradient(ellipse at 66% 71%, rgb(var(--tint) / .19), transparent 68%), radial-gradient(circle at 50% 49%, #fff2 49%, rgb(var(--tint) / .13) 61%, #ffffffc7 65.8%, rgb(var(--tint) / .64) 68%, #fffffff0 69.5%, rgb(var(--tint) / .5) 70.5%); box-shadow: inset 0 3px 5px #ffffffef, inset 3px -3px 8px #ffffffd9, inset -4px 4px 10px rgb(var(--tint) / .14), 0 17px 30px -11px rgb(var(--tint) / .26), 0 2px 4px #fff7; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transform: rotateX(var(--rx)) rotateY(var(--ry)); transition: scale .5s var(--ease), box-shadow .5s var(--ease), transform .45s var(--ease); animation: float 7s ease-in-out infinite; animation-delay: var(--delay); }
  .bubble::before { content: ''; position: absolute; inset: 3px; border-radius: inherit; pointer-events: none; border: 1px solid #ffffffce; box-shadow: inset -2px -3px 4px #fff9, inset 0 2px 4px rgb(var(--tint) / .36); }
  .bubble::after { content: ''; position: absolute; top: 14%; left: 15%; width: 23%; height: 12%; border-radius: 50%; background: linear-gradient(145deg, #fff, #ffffff9c); filter: blur(1.5px); transform: rotate(-44deg); pointer-events: none; }
  .bubble-content { display: flex; height: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 13px; transform: translateY(4%); }
  .bubble-icon { width: 32%; height: 32%; overflow: visible; fill: currentColor; filter: drop-shadow(0 1px 0 #fff9); }
  .bubble-label { display: inline-flex; gap: 7px; align-items: center; font-size: clamp(15px, 1.43vw, 22px); font-weight: 480; letter-spacing: -.4px; color: #1c2531; }
  .bubble-label .arrow { width: .7em; height: .7em; stroke-width: 1.8; }
  .bubble-games { --tint: 244 169 65; --color: #f4a23f; --delay: -2.4s; }
  .bubble-music { --tint: 158 124 246; --color: #9b7cf5; --delay: -4.1s; }
  .bubble-apps { --tint: 73 202 170; --color: #49c7a7; --delay: -1.3s; }
  .bubble-play { --tint: 255 135 140; --color: #fa8586; --delay: -5.4s; }
  .bubble:hover { scale: 1.055; box-shadow: inset 0 3px 5px #fff, inset 3px -3px 8px #ffffffd9, inset -4px 4px 12px rgb(var(--tint) / .2), 0 25px 39px -13px rgb(var(--tint) / .35); }
  .bubble:active { scale: .97; transition-duration: .15s; }
  .bubble-position:has(:focus-visible) { z-index: 5; }
  @keyframes float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
}
@layer responsive {
  @media (min-aspect-ratio: 19/10) and (min-width: 700px) { .scene { top: 54%; width: min(78vw, calc((100svh - 120px) * 1.7)); } h1 { font-size: clamp(22px, 4.5svh, 38px); } .person p { font-size: clamp(13px, 2.4svh, 19px); } .bubble-label { font-size: clamp(13px, 2.5svh, 20px); } }
  @media (max-width: 900px) and (min-width: 601px) { .scene { width: 100vw; } .hint { display: none; } h1 { font-size: 26px; } .person p { font-size: 14px; } }
  @media (max-width: 600px) {
    body { min-height: 550px; }
    .header { top: max(22px, env(safe-area-inset-top)); left: 22px; right: 22px; }
    .wordmark { font-size: 23px; letter-spacing: -1px; }
    .hello { padding: 10px 15px; font-size: 13px; gap: 7px; }
    .hello .arrow { width: 12px; height: 12px; }
    .scene { width: 100%; height: calc(100svh - 154px); aspect-ratio: auto; top: 83px; left: 0; transform: none; }
    .person { top: 27%; width: 100%; }
    .memoji { width: clamp(116px, 39vw, 172px); }
    .head-shadow { width: 75px; height: 8px; margin: -24px auto 22px; filter: blur(7px); }
    h1 { font-size: clamp(22px, 6.2vw, 31px); letter-spacing: -.9px; }
    .person p { font-size: 13px; margin-top: 8px; }
    .bubble-position { width: clamp(92px, 27vw, 136px); }
    .position-projects { left: 25%; top: 13%; }
    .position-games { left: 74%; top: 12%; }
    .position-music { left: 18%; top: 69%; }
    .position-apps { left: 82%; top: 69%; }
    .position-play { left: 55%; top: 85%; }
    .bubble-content { gap: 7px; }
    .bubble-label { font-size: 13px; letter-spacing: -.2px; gap: 5px; }
    .bubble-icon { width: 31%; height: 31%; }
    .droplet { width: 16px; }
    .droplet-one { left: 9%; top: 36%; }
    .droplet-two { right: 13%; top: 87%; }
    .footer { left: 22px; right: 22px; bottom: max(18px, env(safe-area-inset-bottom)); font-size: 11px; gap: 8px; }
    .hint { display: none; }
    .social { gap: 15px; }
    .social a { gap: 4px; }
    .social .arrow { width: 10px; height: 10px; }
    .motion-toggle { width: 28px; height: 28px; }
    .detail-shell { padding: 34px 25px 27px; }
    .detail h2 { font-size: 29px; }
  }
  @media (max-width: 600px) and (max-height: 740px) {
    .person { top: 18%; }
    .memoji { width: 104px; }
    .head-shadow { margin: -18px auto 13px; }
    .bubble-position { width: 92px; }
    .person p { font-size: 11px; }
    h1 { font-size: 22px; }
    .position-music { top: 71%; }
    .position-apps { top: 71%; }
    .position-play { top: 90%; }
  }
  @media (max-height: 500px) and (min-width: 601px) {
    body { min-height: 320px; }
    .header { top: 12px; }
    .wordmark { font-size: 20px; }
    .hello { padding: 8px 14px; font-size: 12px; }
    .scene { width: calc((100svh - 85px) * 1.7); top: 52%; }
    .bubble-label { font-size: 12px; }
    .bubble-content { gap: 5px; }
    .person p { margin-top: 5px; font-size: 11px; }
    h1 { font-size: 21px; }
    .footer { bottom: 7px; font-size: 11px; }
    .hint { display: none; }
  }
}
@layer accessibility {
  :focus-visible { outline: 3px solid #365e96; outline-offset: 6px; }
  .memoji:focus-visible { border-radius: 40%; }
  .motion-paused .bubble { animation: none; transform: none; }
  .motion-paused .waving { animation: none; }
  .motion-paused .memoji:hover { transform: none; }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .no-script { position: fixed; bottom: 70px; left: 50%; transform: translateX(-50%); padding: 10px 20px; background: #fff; border-radius: 20px; font-size: 13px; width: max-content; max-width: 90vw; }
  .no-script a { text-decoration: underline; }
  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } .memoji:hover, .bubble { transform: none !important; } .bubble:hover { scale: 1; } }
  @media (prefers-contrast: more) { :root { --muted: #3c4c61; } .bubble { border: 2px solid currentColor; } .hello, .motion-toggle { border-color: #748196; } }
  @media (forced-colors: active) { .bubble, .hello, .motion-toggle { border: 2px solid ButtonText; } .bubble-icon { forced-color-adjust: none; } }
}


/* experience.css */
@layer experience {
  :root {--ease:cubic-bezier(.23,1,.32,1);}
  button {touch-action:manipulation;}
  .scene-content {position:absolute;inset:0;user-select:none;-webkit-user-select:none;}
  .detail-open .scene-content {opacity:.5;}
  .detail-open .bubble {animation-play-state:paused;}
  .memoji {cursor:pointer;transition:none;}
  .memoji:hover {transform:none;}
  .memoji canvas {display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0;filter:drop-shadow(0 7px 5px #7085a01c);pointer-events:none;}
  .memoji.is-ready canvas {opacity:1;}
  .memoji.is-ready img {opacity:0;}
  .hello-bubble {position:absolute;right:-18%;top:16%;font-size:14px;color:#566275;background:#ffffffd9;border:1px solid #fff;border-radius:24px 24px 24px 3px;padding:10px 16px;box-shadow:0 6px 20px #50607710;opacity:0;transform:translateY(6px) scale(.9);transition:opacity 180ms,transform 180ms var(--ease);pointer-events:none;}
  .greeting .hello-bubble {opacity:1;transform:none;}
  .bubble {user-select:none;background:radial-gradient(ellipse at var(--shine-x,28%) var(--shine-y,20%),#fffffff2 0%,#ffffff70 7%,#ffffff00 22%),radial-gradient(ellipse at 66% 71%,rgb(var(--tint) / .19),transparent 68%),radial-gradient(circle at 50% 49%,#fff2 49%,rgb(var(--tint) / .13) 61%,#ffffffc7 65.8%,rgb(var(--tint) / .64) 68%,#fffffff0 69.5%,rgb(var(--tint) / .5) 70.5%);transition:scale 240ms var(--ease),transform 180ms var(--ease),box-shadow 240ms var(--ease);}
  .bubble:hover {scale:1.045;}
  .bubble-peek {position:absolute;top:22%;left:23%;width:54%;height:43%;opacity:0;transform:translateY(6px) scale(.8);transition:opacity 180ms,transform 240ms var(--ease);pointer-events:none;}
  .bubble-content>.bubble-icon {transition:opacity 180ms,transform 220ms var(--ease);}
  .bubble-label {transition:transform 220ms var(--ease);}
  .peek-projects,.peek-music,.peek-play {position:absolute;inset:0;}
  .peek-projects img {position:absolute;inset:4% 5% 18%;width:90%;height:75%;object-fit:cover;border:2px solid #ffffffd9;border-radius:8px;box-shadow:0 9px 18px #30435d27;transform:rotate(8deg) translate(5%,-8%);}
  .peek-projects img+img {transform:rotate(-8deg) translate(-5%,8%);}
  .peek-music img {position:absolute;left:3%;top:0;width:70%;height:95%;object-fit:cover;border:1px solid #fff8;border-radius:4px;transform:rotate(-10deg);box-shadow:0 5px 10px #34405a25;}
  .peek-music i {position:absolute;right:0;top:2%;width:76%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(#242830 0,#111721 1px,#39404a 2px);box-shadow:0 6px 12px #24304025;}
  .peek-apps {display:block;position:absolute;inset:0 5% 5%;border:1px solid #ffffffc9;background:#f4fffbd9;border-radius:10px;box-shadow:0 8px 18px #395e4b22;transform:rotate(-5deg);padding:12% 12% 8%;}
  .peek-apps i {position:absolute;left:10%;top:3%;font-size:10px;font-style:normal;letter-spacing:1px;}
  .peek-apps b {display:block;height:12%;margin:12% 0;background:#80cbb94d;border-radius:4px;}.peek-apps b:nth-child(3){width:60%;}
  .peek-play i {position:absolute;left:0;top:22%;width:43%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 28% 20%,#fff,#b6d6ff66 55%,#fff 70%,#6c9cdb80);box-shadow:0 5px 10px #5c7d9b20;}
  .peek-play i:nth-child(2) {left:48%;top:0;width:50%;background:radial-gradient(circle at 28% 20%,#fff,#ffbfc866 55%,#fff 70%,#db7b8d80);}.peek-play i:nth-child(3){left:38%;top:55%;width:29%;background:radial-gradient(circle at 28% 20%,#fff,#c6b3f766 55%,#fff 70%,#ad8edb80);}
  @media (hover:hover) and (pointer:fine) {
    .bubble:has(.bubble-peek):hover .bubble-peek {opacity:1;transform:none;}
    .bubble:has(.bubble-peek):hover .bubble-content>.bubble-icon {opacity:0;transform:scale(.75);}
    .bubble:has(.bubble-peek):hover .bubble-label {transform:translateY(10%);}
    .bubble-games:hover .bubble-icon {transform:rotate(60deg) scale(1.08);}
  }
  .detail {--detail-color:#5c9dff;--detail-tint:92 157 255;width:min(1040px,calc(100vw - 64px));height:min(740px,calc(100svh - 112px));max-width:none;max-height:none;margin:auto;border:0;padding:0;background:transparent;color:var(--ink);overflow:visible;}
  .detail::backdrop {background:#edf2f747;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);}
  .world-surface {position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:32px;border:1px solid #fff;background:radial-gradient(ellipse at 0 0,rgb(var(--detail-tint) / .09),transparent 50%),linear-gradient(125deg,#ffffffb5,#f7f9fbc4);box-shadow:0 40px 120px #34496822,inset 0 1px 1px #fff,0 1px 2px #70829a16;}
  .world-content {position:relative;height:100%;display:flex;flex-direction:column;min-height:0;}
  .world-toolbar {display:flex;align-items:center;justify-content:space-between;height:76px;flex-shrink:0;padding:0 24px;}
  .world-back {display:flex;align-items:center;gap:8px;color:#718093;font-size:13px;background:none;padding:10px 6px;}
  .world-back>span:first-child {font-size:20px;}
  .world-category {display:flex;align-items:center;gap:8px;font-size:14px;font-weight:560;position:absolute;left:50%;transform:translateX(-50%);}
  .world-category svg {width:20px;height:20px;fill:var(--detail-color);color:var(--detail-color);}
  .close-detail {display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#e5ebf085;transition:background 160ms,scale 160ms;}
  .close-detail:hover {background:#dce4ed;}
  .close-detail:active {scale:.93;}
  .close-detail svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;}
  .world-stage {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:5px 50px 24px;scrollbar-width:thin;scrollbar-color:#bdcbd966 transparent;}
  .view-heading {text-align:center;margin:7px 0 36px;}
  .view-heading h2 {font-size:38px;letter-spacing:-1.3px;line-height:1.12;font-weight:650;outline:none;}
  .view-heading p {font-size:16px;color:#788597;margin-top:12px;}
  .world-footer {display:flex;align-items:center;justify-content:space-between;gap:12px;height:90px;flex-shrink:0;margin:0 28px;border-top:1px solid #cbd6e44d;}
  .world-hint {font-size:11px;color:#8390a1;width:160px;}
  .world-nav {display:flex;gap:15px;align-items:center;}
  .mini-bubble {width:46px;height:46px;border-radius:50%;color:var(--color,#5c9dff);border:1px solid rgb(var(--tint,92 157 255) / .3);background:radial-gradient(circle at 28% 19%,#fff 0%,#fff0 26%),radial-gradient(circle at 50% 50%,rgb(var(--tint,92 157 255) / .07) 45%,#fff8 65%,rgb(var(--tint,92 157 255) / .36) 72%);box-shadow:inset 0 1px 3px #fff,0 6px 12px #6e87a410;transition:scale 200ms var(--ease),opacity 160ms;opacity:.5;padding:13px;}
  .mini-bubble svg {width:100%;height:100%;fill:currentColor;}
  .mini-bubble:hover {opacity:1;scale:1.08;}
  .mini-bubble[aria-pressed=true] {opacity:1;scale:1.13;box-shadow:inset 0 1px 3px #fff,0 6px 14px rgb(var(--tint,92 157 255) / .18);}
  .world-exit {font-size:11px;color:#788597;background:none;display:flex;align-items:center;gap:9px;padding:10px 0;width:160px;justify-content:flex-end;}
  kbd {font:10px inherit;padding:3px 5px;border:1px solid #cbd4dfb0;border-radius:5px;color:#929cab;}
  .project-grid {display:grid;grid-template-columns:1fr 1fr;gap:26px;}
  .project-card {display:flex;flex-direction:column;justify-content:flex-start;width:100%;padding:0;background:none;text-align:left;border-radius:20px;}
  .project-image {display:block;width:100%;position:relative;aspect-ratio:1.73;overflow:hidden;border-radius:18px;border:1px solid #ffffff;box-shadow:0 12px 26px #40536a12;}
  .project-image img {display:block;width:100%;height:100%;object-fit:cover;transition:transform 250ms var(--ease);}
  .project-card:hover img {transform:scale(1.035);}
  .preview-open {position:absolute;bottom:14px;right:14px;padding:10px 13px;border-radius:20px;background:#ffffffcc;backdrop-filter:blur(12px);display:flex;gap:8px;align-items:center;font-size:11px;transform:translateY(5px);opacity:0;transition:opacity 180ms,transform 180ms var(--ease);}
  .project-card:hover .preview-open,.project-card:focus-visible .preview-open {opacity:1;transform:none;}
  .project-meta {display:block;padding:22px 3px 0;}
  .eyebrow {display:block;font-size:10px;line-height:1.4;font-weight:530;letter-spacing:1.2px;text-transform:uppercase;color:#8490a0;}
  .project-meta strong {display:block;font-size:24px;font-weight:600;letter-spacing:-.7px;margin:8px 0 9px;}
  .project-description {font-size:14px;line-height:1.5;color:#788597;display:block;max-width:320px;}
  .project-focus {padding:0 0 8px;}
  .focus-image {position:relative;touch-action:none;user-select:none;height:345px;background:#102a21;overflow:hidden;border-radius:18px;box-shadow:0 12px 30px #53667d12;}
  .focus-image img {width:100%;height:100%;object-fit:contain;display:block;}
  .focus-image[data-project-id=three-d] {background:#100c10;}
  .focus-image[data-zoomed=true] {cursor:grab;}.focus-image[data-zoomed=true]:active{cursor:grabbing;}
  .zoom-controls {position:absolute;bottom:14px;right:14px;display:flex;align-items:center;gap:1px;padding:3px;background:#fffD;backdrop-filter:blur(12px);border:1px solid #fff9;border-radius:22px;box-shadow:0 5px 15px #0001;cursor:default;}
  .zoom-controls button {height:32px;min-width:32px;border-radius:50%;background:transparent;font-size:17px;color:#34475b;}.zoom-controls button:hover{background:#fff8;}.zoom-controls button:disabled{opacity:.3;cursor:default;}.zoom-controls .zoom-value{font-size:10px;border-radius:15px;min-width:44px;font-variant-numeric:tabular-nums;}
  .zoom-hint {position:absolute;left:16px;bottom:18px;font-size:10px;color:#fff9;pointer-events:none;}
  .focus-copy {display:flex;align-items:center;justify-content:space-between;gap:30px;padding:27px 3px 0;}
  .focus-copy h2 {font-size:29px;letter-spacing:-.8px;font-weight:650;margin:5px 0 10px;outline:none;}
  .focus-copy p {max-width:540px;font-size:14px;line-height:1.6;color:#788597;}
  .primary-link,.text-link {display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;font-size:13px;}
  .primary-link {background:#273548;color:#fff;border:1px solid #273548;border-radius:24px;padding:14px 20px;box-shadow:0 4px 12px #293d5210;transition:background 160ms,transform 160ms;}
  .primary-link:hover {background:#42526a;transform:translateY(-2px);}
  .text-link {padding:12px 0;color:#637184;}
  .text-link:hover {color:#1b2b40;}
  .primary-link .arrow,.text-link .arrow {width:12px;height:12px;}
  .music-room {display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;min-height:360px;padding:10px 24px 15px;}
  .record-deck {position:relative;aspect-ratio:1.14;width:100%;max-width:345px;margin:auto;perspective:1200px;}
  .record-sleeve {position:absolute;inset:4% 14% 8% 0;transform:rotate(-4deg);border-radius:4px;box-shadow:0 22px 36px #262e3c32;cursor:grab;touch-action:pan-y;user-select:none;}
  .record-sleeve:active {cursor:grabbing;}
  .record-sleeve img {width:100%;height:100%;object-fit:cover;display:block;border-radius:4px;}
  .sleeve-shine {position:absolute;inset:0;border-radius:4px;box-shadow:inset 2px 1px 1px #ffffff6b,inset -1px -1px 2px #0003;background:linear-gradient(115deg,#ffffff20,transparent 30%);pointer-events:none;}
  .vinyl {position:absolute;width:80%;aspect-ratio:1;top:7%;right:0;transform:translateX(22%);border-radius:50%;background:repeating-radial-gradient(circle,#27292d 0,#15171c 1px,#25272c 2px,#15171a 3px);border:2px solid #171921;box-shadow:0 13px 25px #2933402a;display:grid;place-items:center;}
  .vinyl::after {content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(from -20deg,transparent,#ffffff18,transparent 35%,#ffffff13,transparent 72%);}
  .vinyl-label {width:34%;height:34%;border-radius:50%;overflow:hidden;}
  .vinyl-label img {width:100%;height:100%;object-fit:cover;}
  .record-hole {position:absolute;left:50%;top:50%;width:7px;height:7px;transform:translate(-50%,-50%);background:#e7eaf1;border-radius:50%;}
  .music-copy {padding-left:12px;}
  .music-copy h3 {font-size:32px;letter-spacing:-1px;line-height:1.1;margin:11px 0;font-weight:630;}
  .music-copy>p {font-size:14px;color:#788597;margin-bottom:22px;}
  .artist-picker {display:flex;gap:10px;margin:30px 0 13px;}
  .artist-picker button {width:58px;height:58px;padding:3px;border:1px solid transparent;border-radius:50%;background:none;opacity:.5;transition:opacity 180ms,scale 180ms;}
  .artist-picker button[aria-pressed=true] {border-color:#a593c2;opacity:1;}
  .artist-picker button:hover {opacity:1;scale:1.06;}
  .artist-picker img {width:100%;height:100%;object-fit:cover;border-radius:50%;}
  .artist-picker span {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
  .swipe-hint {font-size:11px;color:#98a2b1;}
  .app-room {display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:center;margin-top:25px;}
  .mac-preview {position:relative;height:320px;overflow:hidden;border-radius:16px;background:#dfebe8;border:6px solid #293747;box-shadow:0 20px 35px #42516624;transition:background 240ms;}
  .mac-menubar {position:relative;z-index:3;display:flex;justify-content:space-between;padding:9px 13px;font-size:9px;background:#ffffff6b;color:#37465a;}
  .room-art {position:absolute;inset:0;overflow:hidden;background:linear-gradient(125deg,#e8efe8,#cbded7);transition:opacity 240ms;}
  .room-floor {position:absolute;inset:76% 0 0;background:#bdccbc;transform:skewY(-5deg);}
  .window-light {position:absolute;width:140px;height:180px;left:12px;top:54px;background:linear-gradient(90deg,#ffffef88 49%,transparent 49%,transparent 52%,#ffffef88 52%);transform:skewY(-18deg);filter:blur(1px);}
  .lamp {position:absolute;left:70px;top:120px;height:115px;width:3px;background:#586657;}
  .lamp::before {content:'';position:absolute;bottom:0;width:37px;height:5px;left:-17px;background:#586657;border-radius:50%;}
  .lamp span {position:absolute;width:45px;height:30px;background:#9da98c;left:-21px;top:-5px;border-radius:50% 50% 4px 4px;}
  .room-table {position:absolute;width:170px;height:8px;background:#a08770;bottom:70px;right:-5px;transform:rotate(-5deg);}
  .room-table::after {content:'';position:absolute;width:5px;height:80px;right:28px;background:#917b67;}
  .plant {position:absolute;width:24px;height:27px;background:#b5977f;bottom:77px;right:50px;border-radius:1px 1px 6px 6px;}
  .plant i {position:absolute;width:18px;height:39px;background:#607d68;border-radius:70% 10% 70% 10%;bottom:20px;transform:rotate(-35deg);}
  .plant i:nth-child(2) {left:14px;transform:rotate(20deg);bottom:24px;}.plant i:nth-child(3) {left:5px;bottom:34px;transform:rotate(-8deg);}
  .app-popover {position:absolute;width:220px;top:57px;right:18px;background:#f7faf8dc;backdrop-filter:blur(16px);border:1px solid #fff9;border-radius:16px;padding:20px 16px;box-shadow:0 14px 40px #34534320;z-index:4;}
  .popover-name {display:flex;align-items:center;gap:10px;}
  .app-mark {display:grid;place-items:center;width:35px;height:35px;background:#e4eee7;border:1px solid #cad6cd;border-radius:10px;font-size:23px;font-weight:650;letter-spacing:-1px;color:#537563;}
  .popover-name strong {display:block;font-size:10px;font-weight:600;}.popover-name div>span {display:block;font-size:9px;color:#81928b;margin-top:5px;}
  .mood-control {margin:19px 0 12px;display:flex;background:#d4ddd733;border:1px solid #9ead9e30;padding:3px;border-radius:20px;}
  .mood-control button {font-size:11px;width:50%;padding:7px 0;background:none;border-radius:20px;color:#6b7e74;}
  .mood-control button[aria-pressed=true] {background:#fff;box-shadow:0 2px 6px #21352710;color:#304b3f;}
  .app-preview-label {display:block;text-align:center;font-size:9px;color:#8b9a92;}
  .mac-preview[data-mood=evening] {background:#202b39;}
  .mac-preview[data-mood=evening] .room-art {background:linear-gradient(125deg,#263445,#39414c);}.mac-preview[data-mood=evening] .room-floor{background:#252c35;}.mac-preview[data-mood=evening] .mac-menubar{background:#ffffff12;color:#ccd5df;}
  .mac-preview[data-mood=evening] .window-light {opacity:0;}
  .mac-preview[data-mood=evening] .lamp span {background:#ffce68;box-shadow:0 25px 50px 35px #ffc86c;}
  .app-copy h3 {font-size:31px;line-height:1.1;font-weight:620;letter-spacing:-1px;margin:12px 0 18px;}
  .app-copy p {font-size:14px;color:#788597;line-height:1.6;margin-bottom:24px;}
  .play-arena {height:335px;position:relative;overflow:hidden;border-radius:24px;background:radial-gradient(ellipse at center,#fff9,#e9edf327);border:1px solid #ffffffb0;box-shadow:inset 0 1px 25px #8291a807;touch-action:none;}
  .arena-guide {position:absolute;inset:0;display:grid;place-items:center;font-size:16px;letter-spacing:-.3px;color:#b7becb;pointer-events:none;}
  .play-ball {position:absolute;left:0;top:0;width:100px;height:100px;animation:none;cursor:grab;touch-action:none;transition:scale 150ms;}
  .play-ball.held {cursor:grabbing;scale:1.05;z-index:3;}
  .play-ball:nth-of-type(2) {width:76px;height:76px;}.play-ball:nth-of-type(3) {width:120px;height:120px;}.play-ball:nth-of-type(4) {width:88px;height:88px;}.play-ball:nth-of-type(5) {width:66px;height:66px;}
  .play-controls {display:flex;justify-content:space-between;align-items:center;margin-top:18px;gap:12px;}
  .play-controls p {font-size:11px;color:#8b96a6;}.play-controls>div {display:flex;gap:8px;}
  .soft-button {border:1px solid #c3cedb65;border-radius:25px;background:#ffffff6b;padding:10px 17px;font-size:11px;color:#788597;}
  .soft-button:hover {background:#fff;}.shuffle {color:#34465f;}.shuffle span {margin-left:6px;}
  .zazu-room {display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;min-height:330px;}
  .zazu-art {position:relative;height:320px;display:flex;align-items:center;justify-content:center;border-radius:24px;background:radial-gradient(ellipse at 48% 45%,#ffe4b9aa,transparent 66%);}
  .zazu-word {font-size:98px;font-weight:720;letter-spacing:-9px;position:relative;z-index:1;}.zazu-word>span {color:#e8a349;}
  .zazu-asterisk {position:absolute;width:100px;height:100px;right:40px;top:24px;color:#e9a044;transform:rotate(10deg);transition:transform 280ms var(--ease);}
  .zazu-asterisk svg {width:100%;height:100%;fill:currentColor;}
  .zazu-art:hover .zazu-asterisk {transform:rotate(70deg) scale(1.06);}
  .zazu-orbit {position:absolute;width:350px;height:210px;border:1px solid #ddad6540;border-radius:50%;transform:rotate(-30deg);}
  .zazu-copy h3 {font-size:34px;line-height:1.1;letter-spacing:-1px;font-weight:620;margin:12px 0 18px;}
  .zazu-copy p {font-size:14px;color:#788597;line-height:1.7;margin-bottom:25px;}.zazu-actions {display:flex;align-items:center;gap:22px;}
  @media (hover:none) { .bubble:hover{scale:1;} .preview-open {opacity:1;transform:none;} }
  @media (max-width:900px) { .world-stage{padding-left:30px;padding-right:30px;}.world-hint{display:none;}.world-exit{width:auto;}.music-room{gap:35px;padding-left:0;padding-right:0;}.app-room{gap:28px;}.app-popover{right:10px;width:200px;}.zazu-word{font-size:78px;}.zazu-actions{gap:12px;}.world-footer{height:80px;} }
  @media (max-width:600px) {
    .scene {top:117px;height:calc(100svh - 191px);}
    .person {top:25%;}.memoji{width:clamp(116px,37vw,155px);}.head-shadow{margin-bottom:19px;}
    .position-projects,.position-games {top:12%;}.position-music,.position-apps{top:70%;}.position-play{top:88%;}
    .droplet-two {top:86%;right:16%;}
    .detail {width:calc(100vw - 20px);height:calc(100svh - 36px);}
    .world-surface {border-radius:26px;}.world-toolbar{height:64px;padding:0 17px;}.world-back{font-size:11px;}.world-category{font-size:12px;gap:6px;}.world-category svg{width:16px;height:16px;}.close-detail{width:34px;height:34px;}
    .world-stage {padding:7px 23px 22px;}.view-heading{margin:7px 0 26px;}.view-heading h2{font-size:28px;letter-spacing:-.9px;}.view-heading p{font-size:12px;margin-top:10px;line-height:1.5;}
    .world-footer{height:83px;margin:0 20px;justify-content:center;}.world-nav{gap:13px;}.world-exit{display:none;}.mini-bubble{width:43px;height:43px;padding:12px;}
    .project-grid{grid-template-columns:1fr;gap:25px;}.project-meta{padding-top:14px;}.project-meta strong{font-size:22px;margin:6px 0;}.project-description{font-size:12px;}.eyebrow{font-size:9px;letter-spacing:.9px;}.project-image{aspect-ratio:1.85;border-radius:15px;}.preview-open{font-size:10px;padding:8px 11px;bottom:10px;right:10px;}
    .focus-image{height:auto;aspect-ratio:1.3;}.zoom-hint{display:none;}.zoom-controls{bottom:10px;right:10px;}.focus-copy{flex-direction:column;align-items:flex-start;gap:22px;padding:25px 0 0;}.focus-copy h2{font-size:27px;}.focus-copy p{font-size:13px;}
    .music-room{grid-template-columns:1fr;gap:24px;padding:0;}.record-deck{width:230px;}.music-copy{text-align:center;padding:0;}.music-copy h3{font-size:28px;}.music-copy>p{margin-bottom:17px;font-size:12px;}.artist-picker{justify-content:center;margin-top:23px;}.artist-picker button{width:49px;height:49px;}.swipe-hint{font-size:10px;}
    .app-room{grid-template-columns:1fr;gap:25px;margin-top:0;}.mac-preview{height:250px;border-width:5px;}.app-popover{width:205px;right:16px;top:48px;}.app-copy{text-align:center;}.app-copy h3{font-size:28px;margin:8px 0 12px;}.app-copy p{font-size:13px;margin-bottom:18px;}
    .play-arena{height:clamp(220px,46svh,390px);}.play-ball{width:74px;height:74px;}.play-ball:nth-of-type(2){width:58px;height:58px;}.play-ball:nth-of-type(3){width:86px;height:86px;}.play-ball:nth-of-type(4){width:65px;height:65px;}.play-ball:nth-of-type(5){width:50px;height:50px;}.arena-guide{font-size:12px;}.play-controls{flex-direction:column;gap:16px;}.play-controls p{font-size:10px;}
    .zazu-room{grid-template-columns:1fr;gap:13px;}.zazu-art{height:240px;}.zazu-word{font-size:90px;}.zazu-asterisk{width:80px;height:80px;right:30px;top:5px;}.zazu-orbit{width:280px;height:175px;}.zazu-copy{text-align:center;}.zazu-copy h3{font-size:29px;margin-bottom:12px;}.zazu-copy p{font-size:13px;margin-bottom:16px;}.zazu-actions{justify-content:center;}
  }
  @media (max-width:600px) and (max-height:740px) {
    .scene{top:111px;height:calc(100svh - 175px);}.person{top:19%;}.memoji{width:104px;}.head-shadow{margin-bottom:14px;}h1{font-size:21px;}.person p{font-size:11px;}.position-projects,.position-games{top:12%;}.position-music,.position-apps{top:70%;}.position-play{top:89%;}.bubble-position{width:85px;}.bubble-label{font-size:12px;}
    .world-stage{padding-left:18px;padding-right:18px;}.world-toolbar{height:57px;}.world-footer{height:65px;}.view-heading h2{font-size:25px;}.view-heading{margin-bottom:20px;}.record-deck{width:190px;}.app-popover{width:190px;}.play-arena{height:230px;}
  }
  @media (min-width:601px) and (max-height:750px) {
    .detail{height:calc(100svh - 40px);}.world-toolbar{height:60px;}.world-footer{height:70px;}.view-heading{margin-bottom:25px;}.view-heading h2{font-size:30px;}.world-stage{padding-bottom:20px;}.project-image{aspect-ratio:1.95;}.project-meta{padding-top:18px;}.focus-image{height:245px;}.play-arena{height:250px;}.music-room{min-height:290px;}.record-deck{max-width:270px;}.app-room{margin-top:0;}.mac-preview{height:280px;}.zazu-room{min-height:270px;}.zazu-art{height:270px;}
  }
  @media (prefers-reduced-motion:reduce) { .scene-content{transform:none!important;} }
}


/* journey.css */
@layer experience {
  /* A destination occupies the viewport. No bounded panel or blurred backdrop. */
  #main {position:absolute;inset:0;overflow:clip;}
  .detail {position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;overflow:clip;background:transparent;box-shadow:none;isolation:isolate;}
  .detail::backdrop {background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;}
  .memoji canvas {filter:none;}
  .detail-open .scene-content {opacity:1;}
  .detail-open .bubble {animation-play-state:paused;}
  .is-travelling .scene-content .bubble {backdrop-filter:none;-webkit-backdrop-filter:none;}
  .is-travelling .memoji canvas,.is-travelling .memoji img {filter:none;}
  .world-visual {position:absolute;inset:0;overflow:clip;pointer-events:none;}
  .world-surface {position:absolute;left:0;top:0;right:auto;bottom:auto;width:640px;height:640px;border-radius:50%;border:2px solid rgb(var(--detail-tint) / .4);box-shadow:inset 0 3px 4px #fff,inset 4px -3px 9px #ffffffd9,inset -5px 5px 13px rgb(var(--detail-tint) / .2);transform-origin:50% 50%;background:radial-gradient(ellipse at 28% 20%,#fff 0%,#fff9 8%,#fff0 25%),radial-gradient(ellipse at 65% 75%,rgb(var(--detail-tint) / .22),transparent 68%),radial-gradient(circle,#f2f6f9 48%,rgb(var(--detail-tint) / .16) 61%,#fff 66%,rgb(var(--detail-tint) / .7) 68%,#fffffff5 69.5%,rgb(var(--detail-tint) / .5) 70.5%);pointer-events:none;}
  .world-surface::after {content:'';position:absolute;left:14%;top:14%;width:25%;height:10%;border-radius:50%;background:linear-gradient(145deg,#fff,#ffffff40);transform:rotate(-40deg);}
  .world-atmosphere {position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 13% 30%,rgb(var(--detail-tint) / .10),transparent 50%),radial-gradient(ellipse at 85% 78%,rgb(var(--detail-tint) / .07),transparent 45%),#f3f6f9;overflow:hidden;}
  .world-atmosphere>span {position:absolute;width:70vw;aspect-ratio:1;border:1px solid rgb(var(--detail-tint) / .08);border-radius:50%;top:-50vw;left:12vw;}
  .world-atmosphere>span:nth-child(2) {width:65vw;left:-50vw;top:35%;}.world-atmosphere>span:nth-child(3){width:55vw;left:85%;top:55%;}
  .portal-glyph {position:absolute;left:0;top:0;width:80px;height:80px;pointer-events:none;color:var(--detail-color);transform-origin:center;}
  .portal-glyph:not(.portal-glyph-source) svg {width:100%;height:100%;fill:currentColor;}
  .portal-glyph-source :is(*, *::before, *::after) {animation:none!important;transition:none!important;}
  .world-content {position:relative;z-index:2;height:100%;display:flex;flex-direction:column;}
  .world-toolbar {height:106px;padding:max(18px,env(safe-area-inset-top)) 40px 0;flex:none;}
  .world-back {gap:11px;font-size:13px;font-weight:500;color:#63728a;border-radius:30px;padding:12px 17px 12px 12px;transition:background 180ms,transform 180ms;}
  .world-back>span:first-child {font-size:24px;font-weight:300;}
  .world-back:hover {background:#ffffff90;transform:translateX(-3px);}
  .world-category {gap:9px;font-size:12px;letter-spacing:.2px;color:#6f7d91;font-weight:500;}
  .world-category svg {width:17px;height:17px;}
  .world-counter {margin-left:auto;font-size:11px;letter-spacing:2px;color:#9ba6b4;font-variant-numeric:tabular-nums;}
  .close-detail {display:none;}
  .world-stage {width:min(1180px,calc(100% - 100px));margin:0 auto;padding:18px 0 30px;display:flex;flex-direction:column;justify-content:center;flex:1;min-height:0;overflow:auto;overflow-x:hidden;}
  .view-heading {margin:0 0 52px;text-align:center;flex:none;}
  .view-heading h2 {font-size:clamp(36px,4.2vw,62px);font-weight:620;letter-spacing:-2.6px;line-height:1.06;}
  .view-heading p {font-size:16px;line-height:1.5;color:#8894a6;margin-top:17px;}
  .world-footer {position:relative;display:flex;height:118px;margin:0 40px;padding:0 0 max(8px,env(safe-area-inset-bottom));border:0;flex:none;justify-content:center;}
  .world-nav {gap:21px;align-items:center;padding:11px 20px;border-radius:60px;background:#ffffff53;border:1px solid #ffffffb8;box-shadow:inset 0 1px 0 #fff,0 9px 30px #47627e06;}
  .mini-bubble {width:51px;height:51px;padding:15px;opacity:.55;}
  .mini-bubble[aria-pressed=true] {opacity:1;scale:1.17;}
  .world-hint {display:block;position:absolute;left:8px;top:45px;width:auto;font-size:11px;color:#a1aab8;}
  .world-exit {position:absolute;right:8px;width:auto;top:34px;font-size:11px;gap:10px;}
  .project-grid {gap:62px;padding:0 24px 25px;flex:none;}
  .project-card {border-radius:20px;position:relative;}
  .project-image {aspect-ratio:1.65;border-radius:22px;border:3px solid #ffffffd9;box-shadow:0 28px 50px -22px #2f48683b;}
  .project-card:first-child .project-image {rotate:-3deg;}.project-card:last-child .project-image {rotate:3deg;}
  .project-image img {transition:transform 400ms var(--ease);}
  .project-card:hover .project-image img {transform:scale(1.055);}
  .project-meta {padding:28px 5px 0;}.project-meta strong{font-size:28px;letter-spacing:-.9px;margin:10px 0;}.project-description{font-size:14px;max-width:370px;}
  .preview-open {opacity:1;transform:none;bottom:16px;right:16px;font-size:11px;background:#ffffffc4;backdrop-filter:none;}
  .project-focus {width:100%;max-width:1100px;align-self:center;}
  .focus-image {height:clamp(270px,47svh,540px);border-radius:24px;box-shadow:0 28px 65px -24px #2f48683b;}
  .focus-copy {padding-top:32px;gap:50px;}.focus-copy h2{font-size:38px;letter-spacing:-1.3px;}.focus-copy p{font-size:14px;max-width:650px;}
  .music-room {grid-template-columns:1.08fr .92fr;gap:100px;min-height:380px;max-width:1000px;width:100%;margin:0 auto;padding:0 0 20px;flex:none;}
  .record-deck {width:100%;max-width:400px;}.music-copy{padding-left:0;}.music-copy h3{font-size:43px;letter-spacing:-1.5px;margin:15px 0;}.music-copy>p{margin-bottom:28px;font-size:15px;}.artist-picker{margin-top:34px;gap:13px;}.artist-picker button{width:62px;height:62px;}
  .record-sleeve {box-shadow:0 32px 50px -14px #26384c45;}
  .app-room {gap:75px;grid-template-columns:1.25fr .75fr;align-self:center;margin-top:0;width:100%;max-width:1080px;padding:0 15px 20px;flex:none;}
  .mac-preview {height:370px;border:7px solid #293747;border-radius:19px;box-shadow:0 35px 55px -22px #42516638;}
  .app-popover {top:70px;right:30px;width:245px;padding:25px 20px;}.popover-name strong{font-size:12px;}.popover-name div>span{font-size:10px;}.mood-control{margin-top:24px;}.mood-control button{padding:9px 0;font-size:12px;}.app-preview-label{font-size:10px;}.app-copy h3{font-size:40px;letter-spacing:-1.5px;}.app-copy p{font-size:15px;}
  .room-art .lamp {left:85px;top:145px;height:125px;}.room-table{bottom:80px;}.plant{bottom:87px;}
  .play-arena {height:clamp(280px,48svh,520px);flex:none;width:100%;border:0;background:transparent;border-radius:0;box-shadow:none;overflow:hidden;}
  .arena-guide {font-size:19px;color:rgb(var(--detail-tint) / .30);letter-spacing:-.5px;}
  .play-ball {width:120px;height:120px;}.play-ball:nth-of-type(2){width:86px;height:86px;}.play-ball:nth-of-type(3){width:150px;height:150px;}.play-ball:nth-of-type(4){width:108px;height:108px;}.play-ball:nth-of-type(5){width:80px;height:80px;}
  .play-controls {margin:8px 0 0;padding:0 20px;flex:none;}.soft-button{background:#ffffff85;}
  .zazu-room {max-width:1000px;width:100%;margin:0 auto;gap:85px;grid-template-columns:1.15fr .85fr;min-height:380px;flex:none;}
  .zazu-art {height:360px;background:radial-gradient(ellipse at 48% 45%,#ffe4b955,transparent 66%);}.zazu-word{font-size:133px;letter-spacing:-12px;}.zazu-asterisk{width:115px;height:115px;right:50px;top:7px;}.zazu-copy h3{font-size:44px;letter-spacing:-1.5px;}.zazu-orbit{width:420px;height:260px;}
  @media (min-width:901px) and (max-height:800px) {
    .world-toolbar{height:78px;padding-top:8px;}.world-stage{padding-top:8px;padding-bottom:15px;width:min(1050px,calc(100% - 100px));}.world-footer{height:90px;}.world-hint{top:34px;}.world-exit{top:23px;}.view-heading{margin-bottom:30px;}.view-heading h2{font-size:43px;}.view-heading p{font-size:14px;margin-top:12px;}.project-grid{gap:50px;}.project-image{aspect-ratio:1.9;}.project-meta{padding-top:20px;}.project-meta strong{font-size:25px;}.focus-image{height:clamp(220px,42svh,380px);}.focus-copy{padding-top:23px;}.focus-copy h2{font-size:31px;}.music-room{min-height:310px;gap:80px;max-width:860px;}.record-deck{max-width:300px;}.music-copy h3{font-size:34px;}.artist-picker{margin-top:23px;}.artist-picker button{width:52px;height:52px;}.mac-preview{height:295px;}.app-room{max-width:960px;}.app-popover{top:50px;padding:20px 16px;right:20px;width:230px;}.app-copy h3{font-size:33px;}.play-arena{height:clamp(240px,43svh,380px);}.zazu-room{min-height:290px;max-width:900px;}.zazu-art{height:280px;}.zazu-word{font-size:110px;}.zazu-copy h3{font-size:36px;}
  }
  @media (max-width:900px) and (min-width:601px) {
    .world-toolbar{padding-left:25px;padding-right:25px;height:90px;}.world-stage{width:calc(100% - 70px);}.view-heading h2{font-size:42px;letter-spacing:-1.7px;}.world-footer{margin:0 25px;}.world-hint,.world-exit{display:none;}.project-grid{gap:28px;padding:0 0 20px;}.project-meta strong{font-size:23px;}.project-description{font-size:12px;}.music-room{gap:50px;}.music-copy h3{font-size:33px;}.record-deck{max-width:280px;}.app-room{gap:30px;}.app-popover{width:205px;right:12px;}.mac-preview{height:320px;}.app-copy h3{font-size:30px;}.zazu-room{gap:30px;}.zazu-word{font-size:100px;}.zazu-copy h3{font-size:35px;}.zazu-asterisk{right:12px;width:85px;height:85px;}.zazu-orbit{width:310px;}
  }
  @media (max-width:600px) {
    .detail{width:100%;height:100dvh;}.world-surface{width:640px;height:640px;border-radius:50%;}.world-toolbar{height:84px;padding:max(12px,env(safe-area-inset-top)) 19px 0;}.world-back{font-size:11px;gap:6px;padding:10px 6px;}.world-back>span:first-child{font-size:22px;}.world-category{font-size:11px;gap:6px;}.world-category svg{width:15px;height:15px;}.world-counter{font-size:9px;letter-spacing:1.3px;}
    .world-stage{width:100%;margin:0;padding:20px 28px 30px;justify-content:flex-start;}.view-heading{margin:8px 0 38px;}.view-heading h2{font-size:36px;letter-spacing:-1.5px;}.view-heading p{font-size:12px;line-height:1.6;margin-top:13px;}
    .world-footer{height:98px;margin:0;padding-bottom:max(7px,env(safe-area-inset-bottom));}.world-nav{gap:16px;padding:10px 17px;}.mini-bubble{width:44px;height:44px;padding:13px;}.world-hint,.world-exit{display:none;}
    .project-grid{grid-template-columns:1fr;gap:35px;padding:0 7px 15px;}.project-image{aspect-ratio:1.72;border-width:2px;border-radius:18px;}.project-meta{padding:22px 0 0;}.project-meta strong{font-size:25px;margin:8px 0;}.project-description{font-size:12px;line-height:1.6;}.preview-open{font-size:10px;bottom:12px;right:12px;padding:9px 13px;}.project-focus{padding:5px 0 10px;}.focus-image{height:auto;aspect-ratio:1.17;border-radius:20px;}.focus-copy{gap:26px;padding-top:28px;}.focus-copy h2{font-size:32px;letter-spacing:-1px;}.focus-copy p{font-size:13px;line-height:1.7;}
    .music-room{grid-template-columns:1fr;gap:32px;padding:0 6px 15px;min-height:0;max-width:none;}.record-deck{width:250px;max-width:100%;}.music-copy{text-align:center;}.music-copy h3{font-size:32px;margin:12px 0;}.music-copy>p{font-size:12px;margin-bottom:20px;}.artist-picker{margin:26px 0 14px;gap:12px;}.artist-picker button{width:52px;height:52px;}
    .app-room{grid-template-columns:1fr;gap:34px;padding:0;}.mac-preview{height:280px;border-width:5px;border-radius:16px;}.app-popover{top:50px;right:15px;width:210px;padding:21px 16px;}.popover-name strong{font-size:10px;}.app-copy h3{font-size:32px;}.app-copy p{font-size:13px;}.app-copy{text-align:center;}.app-copy .eyebrow{font-size:9px;}
    .play-arena{height:clamp(260px,45svh,400px);min-height:0;}.arena-guide{font-size:14px;}.play-ball{width:82px;height:82px;}.play-ball:nth-of-type(2){width:61px;height:61px;}.play-ball:nth-of-type(3){width:104px;height:104px;}.play-ball:nth-of-type(4){width:76px;height:76px;}.play-ball:nth-of-type(5){width:56px;height:56px;}.play-controls{padding:0;gap:17px;margin-top:15px;}.play-controls p{font-size:10px;}
    .zazu-room{grid-template-columns:1fr;gap:30px;min-height:0;}.zazu-art{height:250px;}.zazu-word{font-size:105px;letter-spacing:-10px;}.zazu-asterisk{right:22px;top:0;width:85px;height:85px;}.zazu-orbit{width:290px;height:200px;}.zazu-copy h3{font-size:35px;}.zazu-copy p{font-size:13px;}.zazu-actions{gap:20px;}
  }
  @media (max-width:600px) and (max-height:740px) {
    .world-toolbar{height:70px;}.world-stage{padding-top:10px;padding-left:23px;padding-right:23px;}.world-footer{height:83px;}.world-nav{gap:13px;padding:8px 15px;}.mini-bubble{width:40px;height:40px;padding:11px;}.view-heading{margin:8px 0 28px;}.view-heading h2{font-size:30px;letter-spacing:-1.2px;}.view-heading p{font-size:11px;margin-top:10px;}.music-room{gap:27px;}.record-deck{width:205px;}.music-copy h3{font-size:28px;}.artist-picker{margin-top:22px;}.play-arena{height:250px;}.play-ball{width:70px;height:70px;}.play-ball:nth-of-type(3){width:86px;height:86px;}.mac-preview{height:245px;}.app-popover{width:190px;right:12px;top:45px;}.project-grid{padding-left:3px;padding-right:3px;gap:30px;}
  }
  @media (prefers-reduced-motion:reduce) { .world-surface{box-shadow:none;} }
}


/* showcases.css */
@layer experience {
  .showcase-home {width:100%;max-width:1060px;margin:auto;}
  .showcase-heading {text-align:center;margin:5px 0 6px;}
  .showcase-heading h2 {font-size:clamp(30px,3.3vw,49px);font-weight:620;line-height:1.14;letter-spacing:-1.8px;outline:none;}
  .showcase-heading p {font-size:14px;color:#7a8798;margin-top:16px;line-height:1.6;}
  .showcase-garden {position:relative;width:min(920px,100%);height:clamp(310px,40svh,430px);margin:0 auto;}
  .showcase-node {--showcase-tint:110 160 200;position:absolute;left:50%;top:46%;width:clamp(178px,17vw,240px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;color:#344257;background:radial-gradient(ellipse at 29% 20%,#fff 0%,#ffffff4d 10%,#fff0 29%),radial-gradient(ellipse at 67% 77%,rgb(var(--showcase-tint) / .2),#fff0 65%),radial-gradient(circle at 50% 49%,#ffffff17 47%,rgb(var(--showcase-tint) / .14) 60%,#ffffffd1 66%,rgb(var(--showcase-tint) / .51) 69%,#fff 70%,rgb(var(--showcase-tint) / .31) 72%);box-shadow:inset 0 1px 2px #ffffff,0 15px 32px rgb(var(--showcase-tint) / .10);isolation:isolate;transition:scale 240ms var(--ease),box-shadow 240ms var(--ease);padding:0;}
  .showcase-count-3 .showcase-node:nth-child(1){left:19%;top:55%;}
  .showcase-count-3 .showcase-node:nth-child(2){left:50%;top:39%;}
  .showcase-count-3 .showcase-node:nth-child(3){left:81%;top:56%;}
  .showcase-count-2 .showcase-node:nth-child(1){left:30%;top:45%;}
  .showcase-count-2 .showcase-node:nth-child(2){left:70%;top:58%;}
  .showcase-node-inner {position:absolute;inset:15%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;}
  .showcase-node-art {display:grid;place-items:center;position:relative;width:62%;height:58%;margin-top:-3%;margin-bottom:12%;transition:transform 250ms var(--ease);}
  .showcase-node-art img {display:block;width:100%;height:100%;object-fit:contain;}
  .showcase-node-app .showcase-node-art {width:52%;height:53%;}
  .showcase-node-app .showcase-node-art img {border-radius:21%;}
  .showcase-node-scene .showcase-node-art {width:91%;height:52%;margin-top:-1%;}
  .showcase-node-scene .showcase-node-art img {object-fit:cover;border-radius:10px;transform:rotate(-6deg);box-shadow:0 8px 14px #43546c15;border:1px solid #ffffffc2;filter:none;}
  .showcase-node-scene:nth-child(2) .showcase-node-art img {transform:rotate(7deg);}
  .showcase-node-inner>strong {font-size:clamp(12px,1.3vw,17px);font-weight:590;line-height:1.3;white-space:nowrap;}
  .showcase-node-note {position:absolute;top:calc(100% + 25%);left:50%;translate:-50% 0;white-space:nowrap;font-size:11px;font-weight:400;color:#8693a3;}
  .showcase-node-glint {position:absolute;inset:6%;border-radius:50%;border-top:1px solid #fff9;pointer-events:none;}

  .showcase-zazu-word>span {color:#dc9f55;}
  .showcase-trace {position:absolute;left:8%;top:18%;width:12px;height:12px;border-radius:50%;border:1px solid #fff;background:radial-gradient(circle at 30% 24%,#fff,#e3ebf14d);box-shadow:0 4px 8px #9aabba15;pointer-events:none;}
  .showcase-trace-two {width:8px;height:8px;top:86%;left:82%;}
  .showcase-quiet-hint {font-size:11px;letter-spacing:.1px;color:#91a0b0;text-align:center;margin:6px 0 10px;}
  .showcase-node:focus-visible {outline:2px solid #6e94b975;outline-offset:9px;}
  .showcase-focus {width:min(1120px,100%);margin:auto;display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.35fr);gap:75px;align-items:center;padding:25px 0;}
  .showcase-copy {max-width:340px;}
  .showcase-copy h2 {font-size:clamp(34px,3.7vw,55px);font-weight:620;line-height:1.08;letter-spacing:-2.2px;outline:none;margin:18px 0 23px;}

  .showcase-copy>p {font-size:15px;color:#738296;line-height:1.8;}
  .showcase-instruction {display:block;font-size:12px;line-height:1.7;margin-top:28px;color:#8d9aaa;}
  .showcase-subtle-back {display:flex;align-items:center;gap:8px;font-size:11px;color:#76869a;background:none;padding:10px 0;margin-top:18px;border-bottom:1px solid #b5c3d543;transition:color 160ms;}
  .showcase-subtle-back:hover {color:#354d69;}
  .showcase-demo {min-width:0;position:relative;}
  .showcase-desktop {position:relative;aspect-ratio:1.35;perspective:900px;}
  .showcase-desktop-base {position:absolute;top:8%;left:0;width:100%;height:78%;object-fit:cover;border-radius:20px;border:1px solid #ffffffe3;box-shadow:0 25px 65px #42675417;transform:rotate(-2deg);}
  .showcase-desktop-objects {position:absolute;inset:0;}
  .showcase-keepsake {position:absolute;left:11%;top:26%;width:27%;aspect-ratio:1;border:6px solid #fff;border-radius:9px;background:#fff9;box-shadow:0 12px 25px #203a3b22;transform:rotate(-8deg);transition:transform 240ms var(--ease),scale 240ms var(--ease);padding:0;}
  .showcase-keepsake img {width:100%;height:100%;display:block;object-fit:cover;border-radius:3px;}
  .showcase-keepsake-two {left:59%;top:17%;width:32%;aspect-ratio:1.2;transform:rotate(8deg);}
  .showcase-keepsake-three {left:36%;top:52%;width:25%;background:#fff7ce;color:#6e6547;transform:rotate(4deg);border:0;font-size:clamp(12px,1.5vw,19px);font-weight:600;line-height:1.35;}

  .showcase-desktop-caption {position:absolute;top:calc(100% - 6px);width:100%;font-size:11px;color:#7e9389;text-align:center;line-height:1.6;}
  .showcase-perspective {position:relative;perspective:900px;aspect-ratio:1.25;touch-action:none;cursor:grab;outline:none;}
  .showcase-perspective-plane {position:absolute;inset:9% 0 13%;border-radius:23px;overflow:hidden;transform-style:preserve-3d;box-shadow:0 30px 55px #82634920;transition:transform 200ms var(--ease);border:1px solid #ffffffc9;will-change:transform;}
  .showcase-perspective-plane>img {width:100%;height:100%;object-fit:cover;display:block;}
  .showcase-perspective-shine {position:absolute;inset:0;background:linear-gradient(120deg,#ffffff35,#ffffff00 50%,#ac6c1620);pointer-events:none;}
  .showcase-perspective-cross {position:absolute;left:calc(50% - 8px);top:calc(50% - 12px);font-size:24px;font-weight:200;color:#ffffffb5;}
  .showcase-perspective-position {position:absolute;bottom:0;left:0;font-size:10px;color:#928a84;}
  .showcase-perspective-reset {position:absolute;bottom:-6px;right:0;background:#fff5;border:1px solid #fff;border-radius:50%;width:31px;height:31px;color:#8a807a;font-size:18px;}
  .showcase-perspective.is-dragging {cursor:grabbing;}.showcase-perspective.is-dragging .showcase-perspective-plane{transition:none;}
  .showcase-perspective:focus-visible .showcase-perspective-plane {outline:2px solid #9f826e75;outline-offset:6px;}
  .showcase-zazu {height:380px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;}
  .showcase-zazu-word {font-size:clamp(82px,9vw,138px);font-weight:720;line-height:1.2;letter-spacing:-11px;}
  .showcase-zazu-orbit {position:absolute;left:5%;right:5%;height:60%;border:1px solid #e7c69a55;border-radius:50%;rotate:-23deg;pointer-events:none;}
  .showcase-zazu-emblem {font-size:80px;line-height:1;color:#dba566;position:absolute;right:3%;top:2%;transition:transform 300ms var(--ease);}
  .showcase-zazu-words {display:flex;gap:10px;margin-top:28px;position:relative;}
  .showcase-zazu-words button {padding:9px 16px;border-radius:25px;border:1px solid #caa66f28;background:#ffffff48;font-size:12px;color:#9b8e7d;transition:background 160ms,color 160ms;}
  .showcase-zazu-words button[aria-pressed=true] {background:#ffffffce;color:#71604d;}
  .showcase-zazu-caption {position:absolute;bottom:10px;font-size:11px;color:#a49177;}
  .showcase-quiz {background:#132955;color:#f6f7ff;border:1px solid #ffffff80;border-radius:24px;padding:20px 23px 17px;box-shadow:0 24px 60px #223a6420;min-height:385px;overflow:hidden;}
  .showcase-quiz-top {display:flex;justify-content:space-between;align-items:center;color:#c9d4ec;font-size:12px;}
  .showcase-quiz-top>span:first-child {display:flex;align-items:center;gap:9px;font-size:15px;font-weight:620;}
  .showcase-quiz-top img {width:26px;height:26px;border-radius:7px;}
  .showcase-round-count {font-size:10px;letter-spacing:1px;opacity:.6;}
  .showcase-quiz-body {padding-top:24px;}
  .showcase-question-category {font-size:9px;text-transform:uppercase;letter-spacing:1.3px;color:#b0c0e1;}
  .showcase-question {font-size:22px;line-height:1.43;font-weight:550;letter-spacing:-.4px;margin:12px 0 25px;min-height:62px;}
  .showcase-answers {display:grid;grid-template-columns:1fr 1fr;gap:9px;}
  .showcase-answer {display:flex;align-items:center;gap:9px;position:relative;padding:13px 10px;border:1px solid #b6c9f033;border-radius:12px;background:#f9fcff0b;color:#e6ecf7;text-align:left;min-height:52px;transition:background 180ms,border-color 180ms,opacity 180ms,scale 140ms;}
  .showcase-answer>span {display:grid;place-items:center;width:20px;height:20px;font-size:9px;border:1px solid #a3b9df4d;border-radius:50%;color:#a8badb;flex-shrink:0;}
  .showcase-answer>strong {font-size:11px;font-weight:500;line-height:1.35;}
  .showcase-answer>i {margin-left:auto;font-size:14px;font-style:normal;font-weight:600;}
  .showcase-answer:disabled {cursor:default;}
  .showcase-answer[data-result=correct] {background:#b7e4bd20;border-color:#afe5b98c;color:#e4ffe9;}
  .showcase-answer[data-result=correct]>span {border-color:#afe5b950;color:#d8f6dc;}
  .showcase-answer[data-result=wrong] {background:#e59d9d12;border-color:#e59d9d70;color:#f1c6c6;}
  .showcase-answer[data-result=quiet] {opacity:.35;}
  .showcase-answer-reveal {display:flex;align-items:center;gap:20px;justify-content:space-between;margin-top:17px;}
  .showcase-answer-reveal:empty {display:none;}
  .showcase-answer-reveal strong {font-size:12px;font-weight:590;color:#f9d882;}
  .showcase-answer-reveal p {font-size:10px;line-height:1.65;color:#b2c2df;margin-top:5px;max-width:310px;}
  .showcase-game-next {display:flex;align-items:center;gap:12px;background:#ffda70;color:#3a3a48;font-size:11px;font-weight:550;padding:11px 15px;border-radius:20px;white-space:nowrap;flex-shrink:0;}
  .showcase-game-next>span {font-size:14px;}
  .showcase-quiz-footer {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:22px;font-size:9px;line-height:1.5;color:#90a5cd;}
  .showcase-game-keys {white-space:nowrap;font-size:8px;opacity:.8;}
  .showcase-game-finish {display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:270px;padding-bottom:5px;position:relative;}
  .showcase-finish-score {font-size:63px;font-weight:550;line-height:1.2;color:#ffdb79;letter-spacing:-3px;}
  .showcase-finish-score small {font-size:20px;color:#8fa8d0;letter-spacing:0;}
  .showcase-game-finish h3 {font-size:23px;letter-spacing:-.6px;font-weight:530;margin-top:6px;}
  .showcase-game-finish p {font-size:11px;line-height:1.6;color:#a4b7d6;margin-top:12px;}
  .showcase-game-finish .showcase-game-next {margin-top:24px;}
  .showcase-game-star {position:absolute;left:13%;top:8%;font-size:42px;color:#ffda7055;rotate:-15deg;}
  .showcase-quiz-music {background:#2b2241;box-shadow:0 24px 60px #49305820;}
  .showcase-quiz-music .showcase-quiz-top {color:#ded2ee;}
  .showcase-quiz-music .showcase-answer {border-color:#d4b0e62b;background:#f3dbff0b;}
  .showcase-quiz-music .showcase-answer>span {border-color:#d2b3e63b;color:#baabd2;}
  .showcase-quiz-music .showcase-answer[data-result=correct] {border-color:#afe5b98c;background:#b7e4bd20;}
  .showcase-quiz-music .showcase-answer[data-result=wrong] {border-color:#e59d9d70;background:#e59d9d12;}
  .showcase-quiz-listen {display:flex;align-items:center;gap:24px;padding:0 0 23px;}
  .showcase-quiz-listen>div {flex:1;min-width:0;}
  .showcase-clip-play {position:relative;width:105px;aspect-ratio:1;display:grid;place-items:center;flex-shrink:0;background:none;border-radius:50%;}
  .showcase-clip-record {position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,#191620 0px,#38313e 1px,#191620 2px,#191620 3px);border:1px solid #b0a3c42b;box-shadow:0 10px 20px #0e091533;}
  .showcase-clip-record i {position:absolute;inset:27%;border-radius:50%;background:radial-gradient(circle at 40% 32%,#c1a2db,#8b70b2);}
  .showcase-clip-symbol {position:relative;color:#faf5ff;font-size:16px;line-height:1;padding-left:2px;}
  .showcase-clip-type {font-size:9px;letter-spacing:.7px;color:#bfb0cf;}
  .showcase-quiz-listen h3 {font-size:23px;font-weight:550;letter-spacing:-.5px;margin:8px 0 10px;}
  .showcase-clip-progress {display:block;width:100%;height:12px;accent-color:#bfa0d9;cursor:pointer;}
  .showcase-clip-time {display:block;font-size:8px;color:#ad9dbe;margin-top:6px;}
  .showcase-quiz-music .showcase-answer-reveal p {color:#c3b1d4;}
  .showcase-quiz-music .showcase-quiz-footer {color:#a393b7;}
  .showcase-quiz-music.is-playing .showcase-clip-record {animation:showcase-record-turn 8s linear infinite;}
  @keyframes showcase-record-turn {to{transform:rotate(360deg);}}
  .showcase-mac {height:385px;position:relative;border-radius:22px;overflow:hidden;background:#d9e5df;border:1px solid #ffffffc9;box-shadow:0 25px 60px #48615218;--showcase-room-sky:#c3d6d7;--showcase-room-wall:#d6ddce;--showcase-room-light:#ffcb7770;--showcase-room-floor:#aebcb0;}
  .showcase-mac[data-light=evening] {--showcase-room-sky:#8a8cad;--showcase-room-wall:#bca9a2;--showcase-room-light:#ffbb6c99;--showcase-room-floor:#8f8b90;}
  .showcase-mac[data-light=film] {--showcase-room-sky:#505e77;--showcase-room-wall:#778593;--showcase-room-light:#dfbb9330;--showcase-room-floor:#586676;}
  .showcase-mac-bar {height:28px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;background:#ffffff55;font-size:9px;color:#4b5e61;position:relative;z-index:2;border-bottom:1px solid #ffffff55;}
  .showcase-mac-bar img {width:16px;height:16px;border-radius:3px;}
  .showcase-mac-bar strong {font-weight:550;margin-left:8px;}
  .showcase-room {position:absolute;inset:28px 0 0;background:var(--showcase-room-wall);transition:background 250ms;}
  .showcase-room-window {position:absolute;left:10%;top:16%;width:29%;height:53%;background:var(--showcase-room-sky);border:9px solid #edece1;box-shadow:inset 0 0 0 1px #63787522;transition:background 250ms;}
  .showcase-room-window::before,.showcase-room-window::after {content:'';position:absolute;left:calc(50% - 2px);top:0;width:4px;height:100%;background:#edece1;}
  .showcase-room-window::after {width:100%;height:4px;top:50%;left:0;}
  .showcase-room-sun {position:absolute;left:5%;top:0;width:48%;height:100%;background:linear-gradient(110deg,#fff0 10%,var(--showcase-room-light) 55%,#fff0 80%);clip-path:polygon(8% 0,68% 0,100% 100%,40% 100%);transition:background 250ms;}
  .showcase-room-floor {position:absolute;bottom:0;left:0;right:0;height:21%;background:var(--showcase-room-floor);transition:background 250ms;}
  .showcase-room-lamp {position:absolute;left:46%;top:22%;width:5px;height:60%;background:#6a7068;}
  .showcase-room-lamp::before {content:'';position:absolute;width:54px;height:36px;left:-25px;top:0;background:#eee5c7;clip-path:polygon(25% 0,75% 0,100% 100%,0 100%);}
  .showcase-room-lamp::after {content:'';position:absolute;width:48px;height:6px;left:-22px;bottom:-2px;border-radius:50%;background:#6a7068;}
  .showcase-room-table {position:absolute;left:6%;top:76%;width:32%;height:8px;background:#8c8170;border-radius:5px;box-shadow:0 7px 6px #35443512;}
  .showcase-room-table::before,.showcase-room-table::after {content:'';position:absolute;top:5px;left:9%;width:4px;height:80px;background:#8c8170;}
  .showcase-room-table::after {left:auto;right:9%;}
  .showcase-room-vase {position:absolute;left:27%;top:64%;width:24px;height:40px;background:#758a75;border-radius:6px 6px 10px 10px;}
  .showcase-room-vase::before {content:'';position:absolute;left:10px;bottom:100%;width:3px;height:31px;background:#7a8666;rotate:12deg;}
  .showcase-koop-menu {position:absolute;right:15px;top:50px;min-width:238px;background:#f8faf8e6;border:1px solid #ffffffc9;border-radius:15px;padding:17px 15px 13px;box-shadow:0 18px 40px #314d4822;color:#4a5b59;}
  .showcase-koop-menu header {display:flex;align-items:center;gap:10px;margin-bottom:24px;}
  .showcase-koop-menu header img {width:35px;height:35px;border-radius:8px;}
  .showcase-koop-menu header div {display:flex;flex-direction:column;gap:5px;}
  .showcase-koop-menu header strong {font-size:11px;font-weight:580;}
  .showcase-koop-menu header span {font-size:9px;color:#8c9995;}
  .showcase-menu-label {font-size:10px;font-weight:550;}
  .showcase-light-scenes {display:flex;gap:6px;margin-top:10px;}
  .showcase-light-scenes button {display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;padding:11px 7px;border:1px solid #a5b4ac38;background:#fff3;border-radius:10px;font-size:9px;color:#84938e;transition:background 180ms,border-color 180ms;}
  .showcase-light-scenes button i {width:15px;height:15px;border-radius:50%;background:#e3bd83;box-shadow:0 0 0 4px #e3bd831c;}
  .showcase-light-scenes button:nth-child(2) i {background:#cba999;box-shadow:0 0 0 4px #cba9991c;}
  .showcase-light-scenes button:nth-child(3) i {background:#8297ab;box-shadow:0 0 0 4px #8297ab1c;}
  .showcase-light-scenes button[aria-pressed=true] {background:#fff;color:#52655c;border-color:#a3b5a680;}
  .showcase-screen-switch {display:flex;align-items:center;justify-content:space-between;width:100%;font-size:10px;color:#5d6e65;background:none;border-top:1px solid #adbbb633;margin-top:16px;padding:14px 0 9px;}
  .showcase-screen-switch>i {width:25px;height:15px;border-radius:9px;background:#c7ceca;position:relative;transition:background 180ms;}
  .showcase-screen-switch>i::after {content:'';position:absolute;width:11px;height:11px;left:2px;top:2px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #33453620;transition:transform 180ms var(--ease);}
  .showcase-screen-switch[aria-checked=true]>i {background:#8aa793;}.showcase-screen-switch[aria-checked=true]>i::after{transform:translateX(10px);}
  .showcase-preview-note {font-size:8px;color:#9ba59e;display:block;margin-top:7px;text-align:center;}
  .showcase-mac.is-screen-mode .showcase-room {filter:brightness(.7);}
  .showcase-quay {position:relative;background:#fbfcfce8;border:1px solid #fff;border-radius:18px;padding:0 19px 16px;color:#405061;box-shadow:0 25px 60px #39576418;min-height:370px;}
  .showcase-quay-bar {display:flex;align-items:center;justify-content:space-between;height:55px;font-size:9px;color:#97a3ad;border-bottom:1px solid #c9d4dc45;}
  .showcase-quay-bar>span:first-child {display:flex;align-items:center;gap:8px;font-size:13px;color:#4b606d;font-weight:580;}
  .showcase-quay-bar img {width:25px;height:25px;}
  .showcase-quay-search {display:flex;align-items:center;gap:8px;height:40px;margin-top:13px;border:1px solid #ced8dd60;background:#fff8;border-radius:8px;padding:0 10px;color:#9caab4;}
  .showcase-quay-search>span {font-size:19px;line-height:1;}
  .showcase-quay-search input {border:0;background:none;outline:none;min-width:0;flex:1;color:#4c6571;font-family:inherit;font-size:11px;padding:0;}
  .showcase-quay-search input::placeholder {color:#9eacb5;}.showcase-quay-search kbd {font-size:8px;padding:3px 4px;white-space:nowrap;}
  .showcase-quay-tabs {display:flex;gap:4px;margin:13px 0 9px;}
  .showcase-quay-tabs button {font-size:9px;color:#93a2ae;padding:7px 12px;border-radius:6px;background:none;}
  .showcase-quay-tabs button[aria-pressed=true] {background:#dfe8eb80;color:#5b7481;}
  .showcase-quay-rows {display:flex;flex-direction:column;gap:2px;min-height:151px;}
  .showcase-activity {display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;background:none;border-radius:8px;text-align:left;border:1px solid transparent;color:#4a6270;}
  .showcase-activity[aria-pressed=true] {background:#dfe9ec70;border-color:#c1d2d74a;}
  .showcase-activity-mark {display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:#c9dfd26e;color:#739b84;font-size:12px;flex-shrink:0;}
  .showcase-tone-blue {background:#ccd9f16e;color:#7695c4;}.showcase-tone-purple{background:#dcd2eb6e;color:#a38cbc;}
  .showcase-activity>span:nth-child(2) {display:flex;flex-direction:column;gap:4px;}
  .showcase-activity strong {font-size:11px;font-weight:550;}
  .showcase-activity small {font-size:9px;color:#94a2af;}
  .showcase-activity-meta {display:flex;flex-direction:column;gap:4px;margin-left:auto;text-align:right;font-size:9px;color:#7c919e;}
  .showcase-quay-detail {display:flex;align-items:flex-start;gap:8px;min-height:70px;padding:14px 5px 0;margin-top:10px;border-top:1px solid #cad6dd5c;}
  .showcase-quay-detail strong {font-size:10px;font-weight:550;}
  .showcase-quay-detail p {font-size:10px;line-height:1.6;color:#8c9ca9;margin-top:5px;max-width:340px;}
  .showcase-quay-status-dot {width:5px;height:5px;border-radius:50%;background:#87b8a5;flex-shrink:0;margin-top:6px;}
  .showcase-quay-caption {display:block;font-size:8px;color:#a0adb6;margin-top:15px;text-align:center;}
  .showcase-quay-empty {font-size:11px;color:#8e9eaa;padding:20px 8px;}
  .motion-paused .showcase-clip-record {animation:none!important;}
  .motion-paused .showcase-perspective-plane,.motion-paused .showcase-node,.motion-paused .showcase-node-art,.motion-paused .showcase-keepsake,.motion-paused .showcase-zazu-emblem {transition:none;}
  @media (hover:hover) and (pointer:fine) {
    .showcase-node:hover {scale:1.045;box-shadow:inset 0 1px 2px #fff,0 18px 38px rgb(var(--showcase-tint) / .16);}
    .showcase-node:hover .showcase-node-art {transform:translateY(-3px) rotate(-2deg);}
    .showcase-answer:not(:disabled):hover {background:#ffffff15;border-color:#b6c9f066;}
    .showcase-keepsake:hover {scale:1.08;transform:translateY(-6px) rotate(0deg);}
    .showcase-zazu-words button:hover {background:#ffffff8c;color:#78664f;}
    .showcase-activity:hover {background:#e9eff18c;}
  }
  .showcase-node:active {scale:.98;}
  .showcase-answer:active:not(:disabled) {scale:.98;}
  @media (max-width:1100px) {
    .showcase-focus {gap:40px;grid-template-columns:minmax(210px,.75fr) minmax(0,1.35fr);}
    .showcase-quiz {padding:18px 18px 15px;}.showcase-question{font-size:20px;}.showcase-answer>strong{font-size:10px;}.showcase-answer{padding:12px 8px;gap:7px;}
    .showcase-koop-menu {right:12px;min-width:218px;padding:17px 13px 13px;}.showcase-mac{height:370px;}
    .showcase-copy h2 {font-size:44px;}.showcase-copy>p{font-size:13px;}.showcase-instruction{font-size:11px;}
  }
  @media (max-height:820px) and (min-width:801px) {
    .showcase-garden {height:330px;}.showcase-heading h2{font-size:41px;}.showcase-heading p{font-size:12px;margin-top:12px;}
    .showcase-node {width:195px;}.showcase-node-note{font-size:10px;}.showcase-focus{padding:5px 0;gap:55px;}.showcase-copy h2{font-size:43px;}.showcase-copy>p{font-size:13px;}.showcase-instruction{margin-top:20px;}
    .showcase-quiz {min-height:350px;padding-top:15px;}.showcase-quiz-body{padding-top:17px;}.showcase-question{font-size:20px;margin:9px 0 18px;min-height:57px;}.showcase-answer{min-height:46px;padding:10px;}.showcase-quiz-footer{margin-top:17px;}.showcase-game-finish{min-height:244px;}.showcase-mac{height:350px;}.showcase-zazu{height:330px;}
  }
  @media (max-width:800px) {
    .showcase-heading h2 {font-size:37px;letter-spacing:-1.4px;}.showcase-heading p{font-size:12px;margin-top:13px;}
    .showcase-node {width:178px;}.showcase-node-inner>strong{font-size:13px;}.showcase-node-note{font-size:9px;}.showcase-garden{height:350px;}
    .showcase-count-3 .showcase-node:nth-child(1){left:19%;top:60%;}.showcase-count-3 .showcase-node:nth-child(2){top:29%;}.showcase-count-3 .showcase-node:nth-child(3){top:60%;}
    .showcase-focus {gap:30px;grid-template-columns:1fr;padding:6px 0 30px;max-width:560px;}.showcase-copy{max-width:none;text-align:center;}.showcase-copy h2{font-size:37px;letter-spacing:-1.4px;margin:13px 0 16px;}.showcase-copy>p{font-size:12px;max-width:370px;margin:auto;line-height:1.7;}.showcase-instruction{font-size:10px;margin-top:16px;}.showcase-subtle-back{margin:7px auto 0;font-size:10px;}
    .showcase-demo {max-width:520px;width:100%;margin:auto;}.showcase-desktop{aspect-ratio:1.55;}.showcase-desktop-caption{top:100%;}.showcase-keepsake-three{font-size:17px;}.showcase-perspective{aspect-ratio:1.6;}.showcase-zazu{height:280px;}.showcase-zazu-word{font-size:105px;}.showcase-zazu-emblem{font-size:65px;right:6%;}.showcase-zazu-words{margin-top:20px;}
    .showcase-quiz {min-height:360px;}.showcase-question{font-size:21px;}.showcase-answer>strong{font-size:11px;}.showcase-quiz-listen{gap:24px;padding-bottom:20px;}.showcase-clip-play{width:95px;}.showcase-mac{height:350px;}.showcase-koop-menu{right:20px;min-width:238px;}
  }
  @media (max-width:550px) {
    .showcase-home {margin:0 auto;}.showcase-heading{margin:14px 0 10px;}.showcase-heading h2{font-size:30px;line-height:1.17;letter-spacing:-1.15px;max-width:320px;margin:auto;}.showcase-heading p{font-size:11px;line-height:1.7;max-width:265px;margin:13px auto 0;}
    .showcase-garden {height:390px;width:100%;}.showcase-node{width:154px;}.showcase-node-inner>strong{font-size:11px;}.showcase-node-note{font-size:8px;top:calc(100% + 24%);}.showcase-node-app .showcase-node-art{width:49%;height:51%;}.showcase-node-scene .showcase-node-art{width:87%;height:49%;}
    .showcase-count-3 .showcase-node:nth-child(1){left:27%;top:25%;}.showcase-count-3 .showcase-node:nth-child(2){left:74%;top:48%;}.showcase-count-3 .showcase-node:nth-child(3){left:28%;top:77%;}
    .showcase-count-2 .showcase-node:nth-child(1){left:30%;top:30%;}.showcase-count-2 .showcase-node:nth-child(2){left:71%;top:73%;}.showcase-count-2{height:360px;}
    .showcase-quiet-hint{font-size:10px;margin-top:13px;}.showcase-trace-one{top:12%;left:79%;}.showcase-trace-two{left:11%;top:57%;}
    .showcase-focus{gap:24px;padding-top:7px;}.showcase-copy h2{font-size:32px;margin:11px 0 14px;letter-spacing:-1.2px;}.showcase-copy>p{font-size:11px;max-width:300px;line-height:1.75;}.showcase-instruction{font-size:10px;margin-top:14px;}.showcase-subtle-back{font-size:9px;margin-top:4px;}
    .showcase-desktop{aspect-ratio:1.2;}.showcase-desktop-base{border-radius:15px;}.showcase-keepsake{border-width:4px;}.showcase-keepsake-three{border:0;font-size:13px;}.showcase-desktop-caption{font-size:9px;}.showcase-perspective{aspect-ratio:1.2;}.showcase-perspective-plane{border-radius:17px;}.showcase-perspective-position{font-size:9px;}
    .showcase-zazu{height:270px;}.showcase-zazu-word{font-size:90px;letter-spacing:-8px;}.showcase-zazu-emblem{font-size:58px;top:0;right:2%;}.showcase-zazu-words{gap:7px;margin-top:20px;}.showcase-zazu-words button{font-size:10px;padding:8px 13px;}.showcase-zazu-caption{font-size:10px;bottom:4px;}
    .showcase-quiz{padding:17px 15px 15px;border-radius:19px;min-height:365px;}.showcase-quiz-top>span:first-child{font-size:13px;gap:7px;}.showcase-quiz-top img{width:24px;height:24px;}.showcase-round-count{font-size:9px;}.showcase-quiz-body{padding-top:21px;}.showcase-question-category{font-size:8px;}.showcase-question{font-size:19px;line-height:1.45;margin:10px 0 22px;min-height:81px;}.showcase-answers{gap:7px;}.showcase-answer{padding:10px 8px;min-height:52px;gap:7px;border-radius:10px;}.showcase-answer>strong{font-size:9px;}.showcase-answer>span{width:17px;height:17px;font-size:8px;}.showcase-answer>i{font-size:11px;}.showcase-quiz-footer{font-size:8px;margin-top:19px;}.showcase-game-keys{display:none;}.showcase-answer-reveal{gap:15px;align-items:flex-start;margin-top:17px;}.showcase-answer-reveal p{font-size:9px;line-height:1.6;}.showcase-answer-reveal strong{font-size:11px;}.showcase-game-next{padding:9px 11px;font-size:10px;gap:9px;}.showcase-quiz-listen{gap:17px;padding-bottom:25px;}.showcase-clip-play{width:86px;}.showcase-quiz-listen h3{font-size:20px;}.showcase-clip-type{font-size:8px;}.showcase-clip-time{font-size:8px;}.showcase-game-finish{min-height:285px;}
    .showcase-mac{height:345px;border-radius:18px;}.showcase-koop-menu{right:10px;top:47px;min-width:215px;padding:15px 12px 13px;}.showcase-koop-menu header{margin-bottom:22px;gap:8px;}.showcase-koop-menu header img{width:29px;height:29px;}.showcase-koop-menu header strong{font-size:10px;}.showcase-preview-note{font-size:7px;}.showcase-room-window{left:6%;width:34%;border-width:7px;}.showcase-room-lamp{left:38%;}.showcase-quay{padding:0 13px 14px;border-radius:16px;min-height:363px;}.showcase-quay-bar{font-size:8px;}.showcase-quay-bar>span:first-child{font-size:12px;gap:7px;}.showcase-quay-bar img{width:23px;height:23px;}.showcase-activity{padding:9px 7px;gap:8px;}.showcase-activity strong{font-size:10px;}.showcase-activity small{font-size:8px;}.showcase-activity-meta{font-size:8px;}.showcase-quay-detail p{font-size:9px;}.showcase-quay-caption{font-size:7px;}
  }
  @media (max-width:360px) {.showcase-node{width:140px;}.showcase-node-note{font-size:7px;}.showcase-heading h2{font-size:27px;}.showcase-garden{height:370px;}.showcase-count-2{height:330px;}.showcase-answer{padding:10px 6px;gap:5px;}.showcase-answer>strong{font-size:8px;}.showcase-quiz{padding:16px 12px;}.showcase-clip-play{width:73px;}.showcase-quiz-listen{gap:14px;}.showcase-quiz-listen h3{font-size:18px;}.showcase-koop-menu{min-width:200px;right:8px;}.showcase-koop-menu header strong{font-size:9px;}.showcase-game-next{font-size:9px;padding:9px;}}
}

@layer experience {
  /* Four quiet objects remain a garden, rather than a catalogue grid. */
  .showcase-count-4 {height:clamp(405px,48svh,505px);max-width:880px;}
  .showcase-count-4 .showcase-node {width:clamp(180px,16.5vw,220px);}
  .showcase-count-4 .showcase-node:nth-child(1){left:23%;top:27%;}
  .showcase-count-4 .showcase-node:nth-child(2){left:74%;top:28%;}
  .showcase-count-4 .showcase-node:nth-child(3){left:28%;top:76%;}
  .showcase-count-4 .showcase-node:nth-child(4){left:76%;top:77%;}
  .showcase-node .showcase-node-art {width:91%;height:58%;margin-top:-2%;margin-bottom:11%;}
  .showcase-node .showcase-node-art img {object-fit:cover;border-radius:10px;transform:rotate(-5deg);box-shadow:0 8px 14px #43546c10;border:1px solid #ffffffc2;filter:none;}
  .showcase-node:nth-child(even) .showcase-node-art img {transform:rotate(5deg);}
  .showcase-node .showcase-node-inner>strong {font-size:clamp(11px,1.18vw,16px);}
  .showcase-node .showcase-node-note {font-size:10px;}
  .showcase-garden-back {display:block;margin:10px auto 0;background:none;color:#8492a2;font-size:10px;padding:10px;border-bottom:1px solid #aab9c532;}
  .showcase-story {margin-top:19px;color:#81909f;max-width:340px;}
  .showcase-story summary {display:flex;align-items:center;gap:16px;width:fit-content;cursor:pointer;list-style:none;font-size:10px;color:#81909f;padding:5px 0;}
  .showcase-story summary::-webkit-details-marker {display:none;}
  .showcase-story summary>span {font-size:13px;font-weight:300;transition:transform 160ms var(--ease);}
  .showcase-story[open] summary>span {transform:rotate(45deg);}
  .showcase-story>div {padding-top:7px;}
  .showcase-story p {font-size:11px;line-height:1.75;margin-top:8px;color:#84919e;}
  .showcase-story-meta {display:block;margin-top:14px;font-size:8px;letter-spacing:.25px;color:#a0aab4;}
  .showcase-copy .showcase-instruction {margin-top:19px;}
  .showcase-contained-note {display:block;text-align:center;font-size:8px;line-height:1.5;color:#9aa7b1;margin-top:15px;}
  .showcase-match {border:1px solid #ffffffe3;border-radius:20px;background:#f7faf6ed;padding:19px 23px 17px;min-height:385px;box-shadow:0 25px 60px #375a4515;color:#506454;}
  .showcase-match>header {display:flex;align-items:center;gap:9px;}
  .showcase-match>header strong {font-size:14px;font-weight:620;}
  .showcase-match>header small {margin-left:auto;font-size:8px;color:#a2afa2;}
  .showcase-match-mark {display:grid;place-items:center;width:25px;height:25px;background:#4f7862;color:#f5f7f3;border-radius:7px;font-size:13px;font-weight:600;}
  .showcase-match-date {text-align:center;font-size:8px;color:#9aa99a;letter-spacing:.3px;margin-top:26px;}
  .showcase-fixture {display:flex;align-items:center;justify-content:center;gap:26px;margin-top:21px;}
  .showcase-fixture>div {display:flex;flex-direction:column;align-items:center;gap:11px;min-width:72px;}
  .showcase-fixture strong {font-size:10px;font-weight:550;}
  .showcase-club {display:grid;place-items:center;width:45px;height:48px;clip-path:polygon(0 0,100% 0,95% 72%,50% 100%,5% 72%);background:#b1c6ad;color:#f8fbf4;font-size:21px;font-weight:600;}
  .showcase-club-away {background:#b0c0d4;}
  .showcase-match-score {font-size:27px;font-weight:520;letter-spacing:3px;color:#c0cabd;white-space:nowrap;}
  .showcase-match-score.is-revealed {color:#48634f;}
  .showcase-score-toggle {display:flex;align-items:center;gap:10px;margin:18px auto 22px;padding:7px 11px;background:none;border:1px solid #b2c1aa55;border-radius:15px;font-size:9px;color:#83967d;}
  .showcase-score-toggle>span {font-size:12px;}
  .showcase-match-actions {display:flex;align-items:center;gap:8px;padding-top:17px;border-top:1px solid #cad5c35c;}
  .showcase-match-actions button {flex:1;display:flex;align-items:center;justify-content:center;gap:9px;background:#fff4;border:1px solid #b2c1aa3d;border-radius:9px;padding:10px 8px;font-size:9px;color:#9aa996;}
  .showcase-match-actions button>span {font-size:15px;}
  .showcase-match-actions button[aria-pressed=true] {background:#e7efdf;color:#637f5e;border-color:#acbf9a70;}
  .showcase-match-status {font-size:10px;line-height:1.65;text-align:center;color:#91a089;min-height:33px;max-width:330px;margin:16px auto 0;}
  .showcase-match .showcase-contained-note {color:#a9b3a5;margin-top:10px;}
  .showcase-wiios {background:#f4f7f9;border:1px solid #fff;border-radius:22px;padding:20px 20px 14px;box-shadow:0 25px 60px #37506a14;color:#758895;}
  .showcase-wiios-screen {position:relative;min-height:247px;padding:12px 0;}
  .showcase-wiios-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
  .showcase-wiios-grid[hidden],.showcase-wiios-channel[hidden] {display:none;}
  .showcase-wiios-grid button {aspect-ratio:1.65;background:linear-gradient(#fff,#f0f3f6);border:1px solid #c7d1d998;border-radius:8px;padding:3px;box-shadow:0 2px 3px #75899c0a;color:#8595a3;display:grid;place-items:center;min-width:0;}
  .showcase-wiios-grid button img {width:100%;height:100%;object-fit:cover;border-radius:5px;}
  .showcase-channel-label {font-size:clamp(8px,1vw,12px);font-weight:600;letter-spacing:-.2px;}
  .showcase-wiios-grid button:focus-visible {outline:2px solid #8ab6d3;outline-offset:3px;box-shadow:0 0 0 5px #8fc7e41f;}
  .showcase-wiios>footer {display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #c6d7e66b;padding-top:18px;font-size:9px;}
  .showcase-wiios>footer strong {font-size:20px;font-weight:550;letter-spacing:-1px;color:#99b3c4;}
  .showcase-wiios>footer>span:last-child {font-size:11px;white-space:nowrap;letter-spacing:5px;color:#b3c1cb;}
  .showcase-wiios-status {font-size:9px;color:#9aadb9;}
  .showcase-wiios-channel {position:absolute;inset:4px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;}
  .showcase-wiios-channel>img {display:block;width:65%;aspect-ratio:1.86;border-radius:9px;object-fit:cover;}
  .showcase-wiios-channel>strong {font-size:42px;color:#a6b7c5;letter-spacing:-1px;}
  .showcase-wiios-channel>span {font-size:9px;color:#9fafbb;}
  .showcase-wiios-channel button {font-size:10px;background:#fff;border:1px solid #d5dfe7;border-radius:20px;padding:9px 16px;color:#8a9fb0;}
  .showcase-fire {height:395px;position:relative;overflow:hidden;border-radius:22px;border:1px solid #fff8;background:#211c1c;box-shadow:0 25px 60px #6542261a;color:#fff3df;}
  .showcase-fire-scenes,.showcase-fire-scenes>img,.showcase-fire-shade {position:absolute;inset:0;width:100%;height:100%;}
  .showcase-fire-scenes>img {object-fit:cover;opacity:0;transition:opacity 250ms var(--ease);}
  .showcase-fire-scenes>img.is-active {opacity:1;}
  .showcase-fire-shade {background:linear-gradient(#110e0e66,#110e0e66 55%,#110e0ebd);}
  .showcase-fire-message {position:absolute;left:0;right:0;top:15%;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;}
  .showcase-fire-message>span:first-child {font-size:9px;letter-spacing:2px;text-transform:uppercase;color:#ecd2acb3;}
  .showcase-fire-message>strong {font-size:26px;letter-spacing:-.8px;font-weight:430;}
  .showcase-fire-message>.showcase-fire-breath {font-size:10px;color:#e9d9c6ae;margin-top:3px;min-height:16px;}
  .showcase-breath-orb {display:block;width:51px;height:51px;border:1px solid #f6e1bd3b;border-radius:50%;margin-top:7px;background:radial-gradient(circle,#f1d4aa0c,#f1d4aa03);opacity:.6;}
  .showcase-fire.is-breathing .showcase-breath-orb {animation:showcase-breathe 10s ease-in-out infinite;}
  @keyframes showcase-breathe {0%,100%{transform:scale(.8);opacity:.4;}40%{transform:scale(1.3);opacity:1;}}
  .showcase-fire-choices {display:flex;justify-content:center;gap:6px;position:absolute;left:10%;right:10%;bottom:25%;}
  .showcase-fire-choices button {font-size:9px;padding:8px 12px;border:1px solid #e7cba01a;border-radius:20px;color:#d2b995b3;background:#20140e29;}
  .showcase-fire-choices button[aria-pressed=true] {color:#fce3bd;border-color:#e7cba044;background:#eed1a119;}
  .showcase-fire-start {position:absolute;bottom:12%;left:50%;translate:-50% 0;display:flex;align-items:center;gap:10px;font-size:10px;white-space:nowrap;color:#edd9b9;background:none;padding:9px 0;border-bottom:1px solid #e8cda736;}
  .showcase-fire-start>span {font-size:15px;}
  .showcase-fire-note {position:absolute;bottom:5%;left:0;right:0;text-align:center;font-size:7px;letter-spacing:.15px;color:#cdb18d8c;}
  .showcase-word {border:1px solid #fff;border-radius:21px;background:#faf9f0e8;color:#7c7b5c;padding:19px 22px 16px;box-shadow:0 25px 60px #766c3312;}
  .showcase-word>header {display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
  .showcase-word>header strong {font-size:17px;font-weight:600;letter-spacing:-.7px;}
  .showcase-word>header>span {font-size:8px;color:#b1b09a;}
  .showcase-word-board {display:grid;grid-template-columns:repeat(9,1fr);gap:3px;width:230px;max-width:100%;margin:auto;padding:6px;background:#dddccb;border-radius:7px;}
  .showcase-word-board>span {display:grid;place-items:center;aspect-ratio:1;border-radius:2px;background:#eeeeE4;font-size:13px;font-weight:600;color:#69664c;}
  .showcase-word-board>span:nth-child(11n) {background:#c8d8c9;}
  .showcase-word-board>span:nth-child(14n) {background:#c7d4dc;}
  .showcase-word-board>span.is-letter {background:#eee0b8;box-shadow:0 1px 1px #75683b44;color:#6f633e;}
  .showcase-word-rack {display:flex;justify-content:center;gap:5px;margin-top:17px;}

  .showcase-word-controls {display:flex;align-items:center;justify-content:center;gap:9px;margin-top:19px;}
  .showcase-word-controls button {background:#e4e8d8;color:#7a8461;border-radius:18px;padding:9px 15px;font-size:10px;display:flex;gap:15px;}
  .showcase-word-controls button:disabled {opacity:.6;cursor:default;}
  .showcase-word-controls button:last-child {padding:8px 12px;font-size:16px;background:none;color:#b0b59b;}
  .showcase-word-status {font-size:9px;line-height:1.6;color:#a8aa92;text-align:center;max-width:320px;margin:14px auto 0;min-height:29px;}
  .showcase-song {border:1px solid #fff;border-radius:21px;background:#f9f5faed;color:#806d89;padding:21px 22px 17px;box-shadow:0 25px 60px #7e458f13;}
  .showcase-song>header {display:flex;align-items:center;justify-content:space-between;}
  .showcase-song>header>strong {font-size:22px;letter-spacing:-1px;font-weight:600;}
  .showcase-song>header>strong>span {font-size:21px;color:#bb98bf;margin-left:9px;}
  .showcase-song>header>small {font-size:8px;color:#b2a3b9;}
  .showcase-song-themes {display:flex;gap:6px;margin-top:22px;}
  .showcase-song-themes button {font-size:8px;line-height:1.3;color:#b3a0bc;padding:8px 11px;border-radius:20px;background:none;border:1px solid #cbbbd536;white-space:nowrap;}
  .showcase-song-themes button[aria-pressed=true] {background:#e8dded94;border-color:#bca3c64a;color:#9d7fa9;}
  .showcase-song>h3 {font-size:16px;font-weight:520;letter-spacing:-.3px;line-height:1.4;margin:25px 0 16px;}
  .showcase-song-choices {display:flex;flex-direction:column;gap:8px;}
  .showcase-song-card {display:flex;align-items:center;gap:12px;padding:13px 11px;background:#fff9;border:1px solid #d9cce133;border-radius:12px;min-width:0;}
  .showcase-song-card>button:first-child {display:grid;place-items:center;width:29px;height:29px;background:#ede2f1;color:#aa88ba;border-radius:50%;font-size:10px;flex-shrink:0;}
  .showcase-song-card>button[aria-pressed=true] {background:#cbb5d6;color:#fff;}
  .showcase-song-card>span {display:flex;flex-direction:column;gap:5px;min-width:0;}
  .showcase-song-card strong {font-size:11px;line-height:1.35;color:#8e779a;font-weight:550;}
  .showcase-song-card small {font-size:9px;color:#b8a7c0;}
  .showcase-song-card>button:last-child {margin-left:auto;display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:16px;font-size:8px;background:#eee4f2;color:#a58cb3;white-space:nowrap;}
  .showcase-song-card>button:last-child:disabled:not(.is-voted) {opacity:.4;}
  .showcase-song-card>button.is-voted {background:#d9c8e3;color:#876797;}
  .showcase-song-status {font-size:10px;line-height:1.6;color:#aa96b6;margin-top:19px;min-height:32px;max-width:350px;}
  .showcase-song-status strong {font-weight:620;color:#937a9e;}
  .showcase-song-status>span {display:block;font-size:8px;margin-top:3px;color:#b6a4c1;}
  .showcase-song .showcase-contained-note {color:#bcaec6;margin-top:12px;}
  .showcase-memoji-film {background:#fbfcff87;padding:10px 10px 0;border-radius:22px;border:1px solid #fff;box-shadow:0 25px 60px #5a6c9313;overflow:hidden;}
  .showcase-memoji-film>video {width:100%;aspect-ratio:16/9;border-radius:14px;background:#e9eef6;display:block;}
  .showcase-memoji-film>span {display:block;color:#9ba7b8;font-size:9px;line-height:1.6;text-align:center;padding:15px 10px;}
  .showcase-podcast {display:flex;flex-direction:column;align-items:center;padding:10px 0;}
  .showcase-podcast>img {display:block;width:70%;max-width:290px;aspect-ratio:1;object-fit:cover;border-radius:14px;box-shadow:0 20px 45px #30333820;}
  .showcase-podcast>button {display:flex;align-items:center;gap:28px;background:#ffffffa1;color:#7e7c8a;padding:12px 19px;border:1px solid #fff;border-radius:26px;margin-top:25px;font-size:11px;}
  .showcase-podcast>p {font-size:9px;color:#a4a0ad;margin-top:17px;}
  .showcase-reader {border:1px solid #fff;background:#fbfaf6ed;border-radius:21px;overflow:hidden;box-shadow:0 25px 60px #5a4e2d13;color:#716e60;}
  .showcase-reader-art {height:118px;overflow:hidden;background:#eee9de;}
  .showcase-reader-art>img {width:100%;height:100%;object-fit:cover;display:block;}
  .showcase-reader-page {padding:24px 28px 0;min-height:235px;}



  .showcase-reader>footer {display:flex;align-items:center;justify-content:space-between;padding:22px 27px 16px;}
  .showcase-reader>footer button {display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #d0c8b349;background:none;color:#a99d83;font-size:15px;}
  .showcase-reader>footer button:disabled {opacity:.25;cursor:default;}
  .showcase-page-count {font-size:8px;letter-spacing:2px;color:#b4aa93;}
  .showcase-reader-kind {font-size:7px;line-height:1.5;color:#bbb09b;display:block;text-align:center;padding:0 15px 17px;}
  .showcase-reader-rickroll .showcase-reader-art {height:143px;}
  .showcase-reader-rickroll .showcase-reader-art img {object-position:50% 54%;}
  .motion-paused .showcase-fire-scenes>img {transition:none;}
  .motion-paused .showcase-fire.is-breathing .showcase-breath-orb {animation:none;opacity:.7;}
  @media (prefers-reduced-motion:reduce){.showcase-fire.is-breathing .showcase-breath-orb{animation:none;opacity:.7;}}
  @media (hover:hover) and (pointer:fine) {
    .showcase-wiios-grid button:hover {outline:1px solid #a9c7da;outline-offset:2px;}
    .showcase-garden-back:hover,.showcase-story summary:hover {color:#5b7085;}
    .showcase-fire-choices button:hover {color:#fce3bd;}
  }
  @media (max-width:1100px) {
    .showcase-fixture{gap:18px;}.showcase-match{padding:18px 20px 16px;}.showcase-wiios-screen{min-height:220px;}.showcase-wiios{padding:17px 16px 13px;}.showcase-word-board{width:210px;}.showcase-song-themes{gap:4px;}.showcase-song-themes button{font-size:7px;padding:8px 9px;}.showcase-song-card{gap:9px;padding:11px 9px;}.showcase-song-card strong{font-size:10px;}.showcase-reader-page{padding:22px 23px 0;}
  }
  @media (max-height:820px) and (min-width:801px) {
    .showcase-count-4{height:370px;}.showcase-count-4 .showcase-node{width:180px;}.showcase-match{min-height:350px;}.showcase-match-date{margin-top:20px;}.showcase-fire{height:350px;}.showcase-reader-art{height:85px;}.showcase-reader-rickroll .showcase-reader-art{height:105px;}.showcase-reader-page{min-height:205px;padding-top:18px;}.showcase-reader>footer{padding-top:13px;}.showcase-word-board{width:180px;}.showcase-word{padding-top:16px;}.showcase-word>header{margin-bottom:14px;}.showcase-word-rack{margin-top:13px;}.showcase-song{padding:18px;}.showcase-song-themes{margin-top:17px;}.showcase-song>h3{margin:18px 0 13px;}.showcase-song-status{margin-top:15px;}
  }
  @media (max-width:800px) {
    .showcase-story {max-width:380px;margin:16px auto 0;}.showcase-story summary{margin:auto;}.showcase-story p{font-size:10px;text-align:left;}.showcase-story-meta{font-size:7px;}.showcase-story>div{padding:5px 20px 0;}.showcase-count-4{height:450px;max-width:590px;}.showcase-count-4 .showcase-node{width:177px;}.showcase-node .showcase-node-note{font-size:9px;}.showcase-count-4 .showcase-node:nth-child(1){left:24%;top:25%;}.showcase-count-4 .showcase-node:nth-child(2){left:75%;top:28%;}.showcase-count-4 .showcase-node:nth-child(3){left:25%;top:76%;}.showcase-count-4 .showcase-node:nth-child(4){left:76%;top:78%;}.showcase-wiios-screen{min-height:245px;}.showcase-match{min-height:370px;}.showcase-fire{height:370px;}.showcase-reader-page{min-height:225px;}.showcase-reader-art{height:125px;}
  }
  @media (max-width:550px) {
    .showcase-node .showcase-node-inner>strong{font-size:11px;}.showcase-node .showcase-node-note{font-size:8px;}.showcase-count-4{height:590px;margin-top:10px;}.showcase-count-4 .showcase-node{width:154px;}.showcase-count-4 .showcase-node:nth-child(1){left:28%;top:15%;}.showcase-count-4 .showcase-node:nth-child(2){left:73%;top:39%;}.showcase-count-4 .showcase-node:nth-child(3){left:27%;top:65%;}.showcase-count-4 .showcase-node:nth-child(4){left:74%;top:88%;}.showcase-count-4+.showcase-garden-back{margin-top:26px;}.showcase-story{margin-top:13px;}.showcase-story summary{font-size:9px;}.showcase-story p{font-size:10px;line-height:1.7;}.showcase-copy .showcase-instruction{margin-top:14px;}.showcase-match{padding:17px 15px 15px;min-height:365px;border-radius:18px;}.showcase-match>header strong{font-size:13px;}.showcase-match>header small{font-size:7px;}.showcase-fixture{gap:15px;}.showcase-fixture>div{min-width:66px;}.showcase-match-score{font-size:24px;}.showcase-match-actions{gap:6px;}.showcase-match-actions button{font-size:8px;gap:8px;padding:9px 7px;}.showcase-match-status{font-size:9px;}.showcase-contained-note{font-size:7px;}.showcase-wiios{border-radius:18px;padding:15px 13px 13px;}.showcase-wiios-grid{gap:6px;}.showcase-wiios-grid button{padding:2px;border-radius:6px;}.showcase-wiios-grid button img{border-radius:4px;}.showcase-wiios-screen{min-height:193px;padding-top:7px;}.showcase-wiios>footer{padding-top:14px;}.showcase-wiios>footer strong{font-size:18px;}.showcase-wiios>footer>span:last-child{font-size:9px;letter-spacing:3px;}.showcase-wiios-channel{gap:10px;}.showcase-wiios-channel>img{width:62%;}.showcase-wiios-channel>span{font-size:8px;}.showcase-wiios-channel button{font-size:9px;padding:7px 12px;}.showcase-fire{height:360px;border-radius:18px;}.showcase-fire-message>strong{font-size:23px;}.showcase-fire-choices{left:5%;right:5%;gap:5px;}.showcase-fire-choices button{font-size:8px;padding:8px 10px;}.showcase-fire-start{font-size:9px;}.showcase-fire-note{font-size:6px;}.showcase-word{padding:17px 16px 15px;border-radius:18px;}.showcase-word>header strong{font-size:16px;}.showcase-word>header>span{font-size:7px;}.showcase-word-board{width:215px;}.showcase-word-status{font-size:8px;}.showcase-song{padding:17px 15px 15px;border-radius:18px;}.showcase-song>header>strong{font-size:20px;}.showcase-song-themes{margin-top:20px;}.showcase-song-themes button{font-size:7px;padding:8px 9px;}.showcase-song>h3{font-size:15px;}.showcase-song-card{gap:9px;padding:12px 9px;}.showcase-song-card>button:first-child{width:26px;height:26px;font-size:9px;}.showcase-song-card strong{font-size:9px;}.showcase-song-card small{font-size:8px;}.showcase-song-card>button:last-child{font-size:7px;padding:7px;gap:5px;}.showcase-song-status{font-size:9px;}.showcase-memoji-film{padding:7px 7px 0;border-radius:18px;}.showcase-memoji-film>video{border-radius:12px;}.showcase-memoji-film>span{font-size:8px;padding:13px 5px;}.showcase-podcast>img{width:73%;max-width:240px;}.showcase-podcast>button{font-size:10px;padding:11px 17px;margin-top:23px;}.showcase-podcast>p{font-size:8px;}.showcase-reader{border-radius:18px;}.showcase-reader-art{height:95px;}.showcase-reader-rickroll .showcase-reader-art{height:120px;}.showcase-reader-page{padding:22px 23px 0;min-height:239px;}.showcase-reader>footer{padding:18px 23px 15px;}.showcase-reader-kind{font-size:6px;}
  }
  @media (max-width:360px) {
    .showcase-count-4{height:555px;}.showcase-count-4 .showcase-node{width:139px;}.showcase-node .showcase-node-inner>strong{font-size:10px;}.showcase-node .showcase-node-note{font-size:7px;}.showcase-count-4 .showcase-node:nth-child(1){left:27%;}.showcase-count-4 .showcase-node:nth-child(2){left:74%;}.showcase-match{padding:16px 12px;}.showcase-fixture{gap:8px;}.showcase-fixture>div{min-width:63px;}.showcase-match-score{font-size:22px;}.showcase-match-actions button{gap:6px;font-size:7px;}.showcase-wiios-screen{min-height:171px;}.showcase-wiios-grid{gap:4px;}.showcase-wiios-status{font-size:8px;}.showcase-word-board{width:200px;}.showcase-word-rack{gap:4px;}.showcase-song{padding:16px 12px;}.showcase-song-themes{gap:3px;}.showcase-song-themes button{font-size:6px;padding:7px 8px;}.showcase-song-card{gap:7px;padding:11px 7px;}.showcase-song-card strong{font-size:8px;}.showcase-reader-page{padding:20px 19px 0;min-height:270px;}.showcase-reader>footer{padding-left:19px;padding-right:19px;}
  }
}

@layer experience {
  /* An explicit 4:3 art slot and a separate baseline keep rotated covers clear
     of the title at every bubble size; SVG intrinsic size cannot flex-shrink it. */
  .showcase-node .showcase-node-inner {display:block;}
  .showcase-node .showcase-node-art {position:absolute;left:8%;top:0;width:84%;height:63%;margin:0;min-width:0;min-height:0;}
  .showcase-node .showcase-node-art img {position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;}
  .showcase-node .showcase-node-inner>strong {position:absolute;left:-12%;right:-12%;top:78%;display:block;text-align:center;line-height:1.3;white-space:nowrap;}
}
@layer experience {
  .showcase-home-nested .showcase-node .showcase-node-inner>strong {white-space:normal;line-height:1.2;}
}

@layer experience {
  /* Garden rows reserve the circle plus its outside caption. The world scrolls
     before these objects are compressed into each other on a short screen. */
  .world-stage:has(>.showcase-home) {justify-content:flex-start;}
  .showcase-home {flex:0 0 auto;}
  .showcase-heading,.showcase-garden,.showcase-quiet-hint,.showcase-garden-back {flex-shrink:0;}
  .showcase-count-4 {--garden-node-size:clamp(180px,16.5vw,220px);height:max(500px,calc(var(--garden-node-size) * 2.55 + 20px));min-height:max(500px,calc(var(--garden-node-size) * 2.55 + 20px));}
  .showcase-count-4 .showcase-node {width:var(--garden-node-size);}
  .showcase-node .showcase-node-note {line-height:1.4;}
  @media (max-height:820px) and (min-width:801px) {
    .showcase-count-4 {--garden-node-size:180px;}
  }
  @media (max-width:800px) {
    .showcase-count-4 {--garden-node-size:177px;}
  }
  @media (max-width:550px) {
    .showcase-count-4 {--garden-node-size:154px;}
    .showcase-count-4 .showcase-node:nth-child(1){left:24%;top:21%;}
    .showcase-count-4 .showcase-node:nth-child(2){left:76%;top:25%;}
    .showcase-count-4 .showcase-node:nth-child(3){left:24%;top:71%;}
    .showcase-count-4 .showcase-node:nth-child(4){left:76%;top:75%;}
    .showcase-count-4+.showcase-garden-back {margin-top:7px;}
  }
  @media (max-width:360px) {
    .showcase-count-4 {--garden-node-size:139px;}
    .showcase-count-4 .showcase-node:nth-child(1),.showcase-count-4 .showcase-node:nth-child(3){left:24%;}
    .showcase-count-4 .showcase-node:nth-child(2),.showcase-count-4 .showcase-node:nth-child(4){left:76%;}
  }
}


/* media.css */
@layer experience {
  .media-home,.media-music,.media-films {width:100%;flex:none;color:#2b3a4e;}
  .media-home [hidden],.media-music [hidden],.media-films [hidden] {display:none!important;}
  .media-heading {text-align:center;margin:0 auto 46px;}
  .media-heading h2 {font-size:clamp(34px,3.8vw,56px);line-height:1.08;font-weight:610;letter-spacing:-2px;margin:13px 0 16px;outline:none;}
  .media-heading p {font-size:14px;color:#627087;line-height:1.6;}

  .media-portals {display:flex;justify-content:center;align-items:flex-start;gap:105px;max-width:780px;margin:0 auto;padding:4px 15px 28px;}
  .media-portal {--orb-tint:164 139 211;width:230px;flex:none;position:relative;display:flex;align-items:center;flex-direction:column;background:none;outline-offset:10px;border-radius:50%;padding:0;color:#344052;}
  .media-orb {position:relative;width:230px;aspect-ratio:1;border-radius:50%;display:block;background:radial-gradient(ellipse at 28% 21%,#fff 0%,#ffffff6b 8%,#fff0 28%),radial-gradient(ellipse at 63% 73%,rgb(var(--orb-tint) / .20),#fff0 65%),radial-gradient(circle,#fff0 50%,rgb(var(--orb-tint) / .15) 61%,#ffffffc9 66%,rgb(var(--orb-tint) / .45) 68%,#fff 70%,rgb(var(--orb-tint) / .5) 71%);box-shadow:inset 0 2px 3px #fff,0 24px 35px -28px rgb(var(--orb-tint) / .42);transition:transform 400ms var(--ease);}
  .media-portal-films {--orb-tint:123 151 174;}
  .media-portal strong {font-size:20px;letter-spacing:-.45px;font-weight:560;margin-top:25px;}
  .media-portal>span:last-child {font-size:11px;color:#627087;margin-top:9px;}
  .media-orb-record {position:absolute;right:15%;top:25%;width:49%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(#27303b 0,#131a22 1px,#38404c 2px,#141a21 3px);box-shadow:0 8px 14px #26374728;transition:transform 420ms var(--ease);}
  .media-orb-record::after {content:'';position:absolute;inset:35%;background:#c0accf;border-radius:50%;border:1px solid #ffffff4d;}
  .media-orb-sleeve {position:absolute;left:20%;top:26%;width:44%;height:45%;object-fit:cover;border-radius:3px;border:1px solid #fff9;box-shadow:0 9px 18px #2d394d2b;transform:rotate(-9deg);transition:transform 420ms var(--ease);}
  .media-orb-poster {position:absolute;top:23%;height:56%;width:38%;object-fit:cover;border-radius:3px;border:1px solid #fffc;box-shadow:0 10px 20px #293d4e26;transition:transform 420ms var(--ease);}
  .media-orb-poster.one {left:21%;transform:rotate(-11deg);}.media-orb-poster.two {left:42%;transform:rotate(9deg);}
  .media-orb-glint {position:absolute;width:24%;height:7%;left:19%;top:17%;border-radius:50%;transform:rotate(-42deg);background:linear-gradient(#fff,#fff0);pointer-events:none;}

  @media (hover:hover) and (pointer:fine) {
    .media-portal:hover .media-orb {transform:translateY(-8px) scale(1.025);}
    .media-portal:hover .media-orb-sleeve {transform:translateX(-5px) rotate(-15deg);}.media-portal:hover .media-orb-record {transform:translateX(7px) rotate(22deg);}
    .media-portal:hover .media-orb-poster.one {transform:translateX(-5px) rotate(-16deg);}.media-portal:hover .media-orb-poster.two {transform:translateX(5px) rotate(15deg);}
  }
  .media-listening-room {display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:90px;width:min(950px,100%);margin:0 auto;min-height:340px;}
  .media-record-object {width:100%;position:relative;display:flex;align-items:center;justify-content:center;min-width:0;}
  .media-record-deck {position:relative;width:100%;max-width:380px;aspect-ratio:1.1;isolation:isolate;user-select:none;}
  .media-vinyl {position:absolute;top:10%;right:-1%;width:79%;aspect-ratio:1;border-radius:50%;box-shadow:0 24px 34px -17px #263d5c3b;}
  .media-vinyl-grooves {position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:repeating-radial-gradient(#252b33 0,#161b22 1px,#303741 2px,#191e25 3px);border:2px solid #171c24;animation:media-spin 1.8s linear infinite;animation-play-state:paused;}
  .media-vinyl::after {content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;background:conic-gradient(from -20deg,transparent,#ffffff17,transparent 35%,#ffffff12,transparent 72%);}
  .media-vinyl-grooves img {width:38%;aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #0b0e12,0 0 0 4px #ffffff1a;}
  .media-vinyl-grooves i {position:absolute;width:7px;height:7px;border-radius:50%;background:#edf0f5;box-shadow:0 0 0 1px #0004;}
  .media-music.is-playing .media-vinyl-grooves {animation-play-state:running;}
  .media-music.is-backgrounded .media-vinyl-grooves {animation-play-state:paused;}
  .media-sleeve {position:absolute;left:0;top:8%;width:76%;aspect-ratio:1;transform:rotate(-5deg);padding:0;border:1px solid #ffffff9c;border-radius:5px;overflow:hidden;box-shadow:0 30px 45px -16px #273b5654;background:#e0e5ec;touch-action:pan-y;}
  .media-sleeve>img {width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;}
  .media-sleeve-shine {position:absolute;inset:0;background:linear-gradient(115deg,#ffffff25,transparent 36%);box-shadow:inset 2px 1px 2px #ffffff66,inset -1px -1px 2px #0002;pointer-events:none;}
  .media-sleeve-action {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;background:#20304216;transition:opacity 180ms;}
  .media-sleeve-action svg {width:42px;height:42px;padding:10px;border-radius:50%;background:#253347ad;border:1px solid #ffffff4d;}
  .media-sleeve:hover .media-sleeve-action,.media-sleeve:focus-visible .media-sleeve-action {opacity:1;}
  .media-listening-copy {padding-bottom:4px;min-width:0;}
  .media-artist {font-size:clamp(27px,3vw,41px);letter-spacing:-1.35px;font-weight:600;line-height:1.1;margin:14px 0 12px;overflow-wrap:anywhere;}
  .media-track-title {font-size:13px;color:#627087;margin:0;}
  .media-player {margin-top:29px;max-width:350px;}
  .media-transport {display:flex;align-items:center;gap:14px;}
  .media-icon-button {display:grid;place-items:center;flex:none;width:28px;height:34px;border-radius:50%;padding:5px;background:transparent;color:#627087;transition:color 160ms,transform 160ms;}
  .media-icon-button svg {width:17px;height:17px;fill:currentColor;stroke-width:1;}
  .media-icon-button:hover {color:#5d607b;transform:scale(1.09);}
  .media-play-button {display:grid;place-items:center;flex:none;width:48px;height:48px;padding:13px;border:1px solid #fff;border-radius:50%;background:#ffffffb3;color:#62617f;box-shadow:0 7px 16px #615a8210,inset 0 1px 1px #fff;transition:background 180ms,transform 180ms;}
  .media-play-button svg {width:23px;height:23px;}.media-play-button:hover{background:#fff;transform:scale(1.06);}.media-play-button:active{transform:scale(.94);}
  .media-player-caption {font-size:10px;color:#627087;margin-left:3px;letter-spacing:.1px;}
  .media-timeline {display:flex;align-items:center;gap:10px;margin-top:15px;max-width:330px;font-size:9px;font-variant-numeric:tabular-nums;color:#627087;}
  .media-time-current,.media-time-duration {width:25px;flex:none;}
  .media-time-duration {text-align:right;}
  .media-seek {position:relative;display:block;height:22px;flex:1;min-width:0;cursor:pointer;}
  .media-seek input {position:absolute;inset:0;margin:0;width:100%;height:22px;appearance:none;background:transparent;cursor:pointer;border-radius:12px;outline-offset:3px;}
  .media-seek input::-webkit-slider-runnable-track {background:transparent;height:2px;}.media-seek input::-moz-range-track{background:transparent;height:2px;}
  .media-seek input::-webkit-slider-thumb {appearance:none;width:8px;height:8px;margin-top:-3px;border:1px solid #fff;border-radius:50%;background:#9b91b7;opacity:0;transition:opacity 160ms;}.media-seek input::-moz-range-thumb{width:6px;height:6px;border:1px solid #fff;border-radius:50%;background:#9b91b7;opacity:0;}
  .media-seek:hover input::-webkit-slider-thumb,.media-seek input:focus-visible::-webkit-slider-thumb {opacity:1;}
  .media-progress-rail {position:absolute;left:0;right:0;top:10px;height:2px;border-radius:2px;background:#c5c6d448;overflow:hidden;pointer-events:none;}
  .media-progress-rail>span {display:block;width:100%;height:100%;background:#a299b7;transform-origin:left;transform:scaleX(0);transition:transform 100ms linear;}
  .media-artist-picker {display:flex;align-items:center;gap:12px;margin-top:25px;}
  .media-artist-bubble {width:52px;height:52px;flex:none;border-radius:50%;padding:4px;background:transparent;border:1px solid transparent;opacity:.5;transition:opacity 220ms,transform 260ms var(--ease),border-color 220ms;position:relative;}
  .media-artist-bubble img {width:100%;height:100%;border-radius:50%;object-fit:cover;border:1px solid #fff;}
  .media-artist-bubble[aria-pressed=true] {opacity:1;border-color:#b2a8cb;transform:scale(1.08);}
  .media-artist-bubble:hover {opacity:1;transform:translateY(-3px);}
  .media-artist-bubble>span {position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,4px);opacity:0;font-size:9px;background:#fffce8;color:#627087;white-space:nowrap;border-radius:12px;padding:5px 9px;pointer-events:none;transition:opacity 160ms,transform 180ms;}
  .media-artist-bubble:hover>span,.media-artist-bubble:focus-visible>span {opacity:1;transform:translate(-50%,0);}
  .media-live-button {display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:8px 0;color:#627087;background:none;font-size:10px;transition:color 160ms;}
  .media-live-button svg {width:14px;height:14px;}.media-live-button:hover{color:#69697e;}
  .media-status {font-size:10px;min-height:14px;max-width:330px;color:#9b7b7b;line-height:1.5;margin-top:2px;}
  .media-bottom {display:flex;align-items:center;justify-content:space-between;gap:20px;width:min(950px,100%);margin:30px auto 0;padding:4px 0;font-size:9px;color:#627087;}
  .media-bottom>button {display:inline-flex;align-items:center;gap:5px;border-radius:15px;padding:8px 8px 8px 0;font-size:10px;background:none;color:#627087;}.media-bottom>button svg{width:13px;height:13px;}.media-bottom>button:hover{color:#4f6179;}
  .media-audio {display:none;}
  .media-live-layer {width:calc(100% + 30px);margin-left:-15px;align-self:center;}
  .media-live-video {position:relative;width:100%;aspect-ratio:16/9;border-radius:17px;overflow:hidden;background:#202531;box-shadow:0 25px 40px -20px #253d5c36;}
  .media-live-video iframe,.media-film-video iframe {position:absolute;inset:0;width:100%;height:100%;border:0;}
  .media-live-credit {display:block;font-size:9px;text-align:center;color:#627087;margin-top:15px;}
  .media-video-close {position:absolute;z-index:2;right:10px;top:10px;width:28px;height:28px;padding:7px;border-radius:50%;display:grid;place-items:center;background:#27364bbb;border:1px solid #ffffff45;color:#fff;}.media-video-close svg{width:14px;height:14px;}
  .media-films .media-heading {margin-bottom:32px;}
  .media-film-focus {display:grid;grid-template-columns:1.35fr .75fr;gap:66px;align-items:center;max-width:950px;width:100%;margin:0 auto;}
  .media-cinema {position:relative;aspect-ratio:1.88;border-radius:17px;isolation:isolate;box-shadow:0 25px 40px -26px #34476266;}
  .media-cinema-still {position:absolute;inset:0;border-radius:17px;overflow:hidden;background:#24323c;}
  .media-cinema-atmosphere {position:absolute;inset:-20%;width:140%;height:140%;object-fit:cover;filter:blur(12px) saturate(.5);opacity:.3;pointer-events:none;}
  .media-cinema-still::after {content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(transparent 40%,#17263380);border:1px solid #ffffff17;border-radius:17px;}
  .media-cinema-poster {position:absolute;height:79%;width:31%;object-fit:contain;left:34%;top:10%;transform:rotate(-3deg);box-shadow:0 12px 26px #09111c59;border-radius:3px;}
  .media-trailer-button {position:absolute;z-index:2;bottom:19px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;white-space:nowrap;border-radius:24px;border:1px solid #ffffff4d;padding:9px 15px;background:#ffffffd9;font-size:10px;color:#526176;box-shadow:0 4px 10px #0001;}.media-trailer-button svg{width:15px;height:15px;}.media-trailer-button:hover{background:#fff;}
  .media-poster-label {position:absolute;bottom:18px;width:100%;text-align:center;font-size:9px;letter-spacing:.7px;color:#ffffff87;z-index:2;}
  .media-film-copy h3 {font-size:clamp(27px,2.7vw,38px);letter-spacing:-1.1px;line-height:1.08;font-weight:610;margin:15px 0 13px;}
  .media-film-copy>p {font-size:11px;color:#627087;line-height:1.6;}
  .media-film-number {display:block;margin-top:29px;font-size:10px;letter-spacing:1.8px;font-variant-numeric:tabular-nums;color:#7e8b9f;}
  .media-film-number i {font-style:normal;color:#c1c8d1;margin:0 7px;}
  .media-film-video {position:absolute;inset:0;overflow:hidden;border-radius:17px;background:#18202c;}
  .media-film-shelf {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:start;gap:22px;width:min(950px,100%);margin:36px auto 0;padding:6px 0 5px;}
  .media-film-tile {display:block;min-width:0;position:relative;padding:0;background:none;color:#627087;text-align:left;border-radius:8px;outline-offset:6px;opacity:.62;transition:opacity 200ms,transform 250ms var(--ease);}
  .media-film-tile>span {display:block;width:100%;aspect-ratio:2/3;border:2px solid #ffffffce;border-radius:6px;overflow:hidden;box-shadow:0 10px 18px -11px #273d5e33;}
  .media-film-tile img {width:100%;height:100%;object-fit:cover;display:block;}
  .media-film-tile strong {display:block;font-size:9px;font-weight:450;line-height:1.4;margin-top:10px;}
  .media-film-tile[aria-pressed=true] {opacity:1;transform:translateY(-7px);color:#52647b;}
  .media-film-tile[aria-pressed=true]>span {border-color:#fff;box-shadow:0 11px 17px -9px #273d5e55;}
  .media-film-tile:hover {opacity:1;transform:translateY(-6px);}
  .media-visually-hidden {position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
  @keyframes media-spin {to {transform:rotate(360deg);}}
  .motion-paused .media-vinyl-grooves {animation-play-state:paused!important;}
  @media (min-width:901px) and (max-height:820px) {
    .media-heading {margin-bottom:28px;}.media-heading h2{font-size:43px;margin-top:8px;margin-bottom:12px;}.media-heading p{font-size:13px;}.media-portals{gap:95px;}.media-portal,.media-orb{width:190px;}.media-portal strong{font-size:17px;margin-top:20px;}
    .media-listening-room {min-height:270px;gap:80px;max-width:840px;}.media-record-deck{max-width:310px;}.media-artist{font-size:33px;}.media-player{margin-top:21px;}.media-artist-picker{margin-top:19px;}.media-artist-bubble{width:44px;height:44px;}.media-live-button{margin-top:15px;}.media-bottom{margin-top:20px;max-width:840px;}.media-film-focus{max-width:820px;gap:55px;}.media-film-shelf{max-width:820px;gap:22px;margin-top:25px;}.media-film-copy h3{font-size:29px;}.media-film-tile strong{font-size:8px;}.media-films .media-heading{margin-bottom:25px;}
  }
  @media (min-width:601px) and (max-width:900px) {
    .media-heading h2{font-size:39px;letter-spacing:-1.6px;}.media-listening-room{gap:50px;}.media-artist{font-size:29px;letter-spacing:-1px;}.media-artist-picker{gap:6px;}.media-artist-bubble{width:45px;height:45px;}.media-player-caption{font-size:9px;}.media-transport{gap:9px;}.media-film-focus{gap:35px;}.media-film-copy h3{font-size:27px;}.media-film-shelf{gap:13px;}.media-film-tile strong{font-size:8px;}
  }
  @media (max-width:600px) {
    .media-heading {margin-bottom:31px;}.media-heading h2{font-size:33px;line-height:1.12;letter-spacing:-1.4px;margin-top:11px;margin-bottom:13px;}.media-heading p{font-size:12px;max-width:270px;margin:auto;}
    .media-portals{gap:18px;padding:10px 0 18px;align-items:center;}.media-portal,.media-orb{width:145px;}.media-portal strong{font-size:17px;margin-top:20px;}.media-portal>span:last-child{font-size:9px;margin-top:7px;}
    .media-listening-room{grid-template-columns:1fr;gap:18px;min-height:0;}.media-record-deck{max-width:265px;}.media-record-object{min-height:220px;}.media-listening-copy{max-width:300px;width:100%;margin:0 auto;text-align:center;}.media-artist{font-size:30px;letter-spacing:-1px;margin-top:12px;margin-bottom:9px;}.media-track-title{font-size:11px;}.media-player{max-width:290px;margin:22px auto 0;}.media-transport{justify-content:center;gap:15px;}.media-player-caption{font-size:9px;}.media-timeline{margin-top:11px;}.media-artist-picker{justify-content:center;margin-top:20px;gap:13px;}.media-artist-bubble{width:49px;height:49px;}.media-live-button{margin-top:18px;}.media-status{font-size:9px;}.media-bottom{margin-top:22px;font-size:8px;}.media-bottom>button{font-size:9px;}.media-bottom>span{max-width:160px;text-align:right;line-height:1.7;}.media-live-layer{width:100%;margin-left:0;}.media-live-video{border-radius:12px;}
    .media-film-focus{grid-template-columns:1fr;gap:24px;}.media-films .media-heading{margin-bottom:28px;}.media-cinema{aspect-ratio:1.6;border-radius:14px;}.media-cinema-still,.media-cinema-still::after,.media-film-video{border-radius:14px;}.media-film-copy{position:relative;padding-right:44px;}.media-film-copy h3{font-size:29px;margin-top:12px;margin-bottom:10px;}.media-film-copy>p{font-size:10px;}.media-film-number{position:absolute;top:2px;right:0;font-size:8px;margin-top:3px;letter-spacing:1px;}.media-film-number i{margin:0 2px;}.media-film-shelf{display:flex;gap:15px;overflow:auto;margin-top:28px;padding:12px 3px 6px;scrollbar-width:none;overscroll-behavior-x:contain;scroll-snap-type:x proximity;}.media-film-shelf::-webkit-scrollbar{display:none;}.media-film-tile{width:79px;flex:none;scroll-snap-align:center;}.media-film-tile strong{font-size:8px;margin-top:8px;}.media-film-tile>span{border-radius:5px;}.media-trailer-button{bottom:15px;font-size:9px;padding:8px 13px;}
  }
  @media (max-width:360px) {.media-portal,.media-orb{width:122px;}.media-portals{gap:15px;}.media-heading h2{font-size:29px;}.media-portals strong{font-size:16px;}.media-portal>span:last-child{font-size:8px;}.media-listening-copy{max-width:255px;}.media-record-deck{max-width:230px;}.media-record-object{min-height:195px;}.media-artist{font-size:27px;}}
  @media (prefers-reduced-motion:reduce) { .media-home *,.media-music *,.media-films * {animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}.media-vinyl-grooves{animation:none;}}
}
@layer experience {
  .media-heading h2{letter-spacing:-.035em;text-wrap:balance;}
  .media-artist,.media-film-copy h3{letter-spacing:-.03em;text-wrap:balance;}
  .media-icon-button{width:44px;height:44px;}
  .media-transport{gap:10px;}
  .media-player-caption{flex:1;min-width:0;max-width:130px;min-height:30px;display:flex;align-items:center;line-height:1.5;}
  .media-seek,.media-seek input{height:40px;}
  .media-progress-rail{top:19px;background:#aeb7c659;}
  .media-seek input:disabled{cursor:wait;}
  .media-seek:has(input:disabled){opacity:.45;}
  .media-live-button{min-height:44px;}
  .media-status:empty{display:none;}
  .media-finished-next,.media-film-thread{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:7px 0;background:transparent;color:#5b6b84;font-size:11px;line-height:1.5;text-align:left;}
  .media-film-thread{margin-top:10px;}
  .media-finished-next span,.media-film-thread span{font-size:15px;}
  .media-video-close{width:44px;height:44px;padding:12px;}
  .media-video-close svg{width:18px;height:18px;}
  .media-film-navigation{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0;max-width:70%;}
  .media-film-navigation button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;background:none;color:#5b6b84;font-size:10px;line-height:1.5;border-radius:8px;padding:6px 0;text-align:right;}
  .media-film-navigation button:first-child{width:44px;flex:none;}
  .media-film-navigation svg{width:16px;height:16px;}
  .media-film-navigation button:last-child span{font-size:16px;}
  .media-music[data-playback=loading] .media-play-button,.media-music[data-playback=loading] .media-sleeve-action{opacity:.6;}
  .media-portal:focus-visible .media-orb{transform:translateY(-6px) scale(1.02);}
  .motion-paused .media-orb,.motion-paused .media-orb-record,.motion-paused .media-orb-sleeve,.motion-paused .media-orb-poster,.motion-paused .media-artist-bubble,.motion-paused .media-film-tile,.motion-paused .media-progress-rail>span{transition:none;}
  @media(max-width:600px){
    .media-player-caption{font-size:10px;max-width:120px;}
    .media-transport{gap:8px;}
    .media-live-button,.media-track-title{font-size:11px;}
    .media-time-current,.media-time-duration{font-size:10px;}
    .media-film-copy{padding-right:40px;}
    .media-film-navigation{gap:5px;max-width:72%;}
    .media-film-navigation button{font-size:10px;}
    .media-film-thread{font-size:11px;}
  }
}

/* A record and its controls share the quiet scale used throughout the world. */
.detail[data-category=music] .media-music{max-width:1200px;margin:0 auto;color:#2c3e50;}
.detail[data-category=music] .media-music .media-listening-room{width:min(1060px,100%);gap:clamp(32px,6vw,86px);}
.detail[data-category=music] .media-music .media-record-deck{max-width:420px;}
.detail[data-category=music] .media-music .media-artist{font-size:clamp(34px,3.4vw,52px);line-height:1.12;letter-spacing:-.04em;}
.detail[data-category=music] .media-music .media-track-title{font-size:17px;line-height:1.5;color:#68788b;}
.detail[data-category=music] .media-music .media-player{max-width:400px;margin-top:27px;}
.detail[data-category=music] .media-music .media-transport{gap:12px;}
.detail[data-category=music] .media-music .media-icon-button{width:48px;height:48px;padding:14px;}
.detail[data-category=music] .media-music .media-play-button{width:54px;height:54px;padding:15px;}
.detail[data-category=music] .media-music .media-player-caption{font-size:14px;line-height:1.4;max-width:160px;}
.detail[data-category=music] .media-music .media-timeline{max-width:400px;font-size:14px;margin-top:16px;}
.detail[data-category=music] .media-music .media-time-current,.detail[data-category=music] .media-music .media-time-duration{width:36px;}
.detail[data-category=music] .media-music .media-seek,.detail[data-category=music] .media-music .media-seek input{height:40px;}
.detail[data-category=music] .media-music .media-progress-rail{top:19px;}
.detail[data-category=music] .media-music .media-artist-picker{gap:12px;margin-top:20px;}
.detail[data-category=music] .media-music .media-artist-bubble{width:58px;height:58px;}
.detail[data-category=music] .media-music .media-artist-bubble>span{font-size:13px;padding:7px 10px;}
.detail[data-category=music] .media-music .media-live-button,.detail[data-category=music] .media-music .media-finished-next{min-height:48px;font-size:15px;line-height:1.4;margin-top:16px;}
.detail[data-category=music] .media-music .media-live-button svg{width:18px;height:18px;}
.detail[data-category=music] .media-music .media-status{font-size:14px;line-height:1.5;max-width:400px;}
.detail[data-category=music] .media-music .media-live-credit{font-size:14px;}
/* The fixed world toolbar already provides the return action and Keys guide. */
.detail[data-category=music] .media-music>.media-bottom{display:none;}
@media(max-width:700px){
 .detail[data-category=music] .media-music .media-listening-room{grid-template-columns:1fr;gap:16px;}
 .detail[data-category=music] .media-music .media-record-deck{width:min(72vw,300px);}
 .detail[data-category=music] .media-music .media-listening-copy{max-width:345px;text-align:center;}
 .detail[data-category=music] .media-music .media-artist{font-size:34px;margin:8px 0 9px;}
 .detail[data-category=music] .media-music .media-track-title{font-size:16px;}
 .detail[data-category=music] .media-music .media-player{margin:18px auto 0;max-width:345px;}
 .detail[data-category=music] .media-music .media-transport{gap:8px;justify-content:center;}
 .detail[data-category=music] .media-music .media-player-caption{font-size:13px;max-width:125px;}
 .detail[data-category=music] .media-music .media-artist-picker{justify-content:center;gap:10px;margin-top:16px;}
 .detail[data-category=music] .media-music .media-artist-bubble{width:54px;height:54px;}
 .detail[data-category=music] .media-music .media-live-button{margin-top:12px;}
}
/* One temporary image layer carries the old sleeve until the next cover decodes. */
.detail[data-category=music] .media-music .media-sleeve>.media-sleeve-outgoing{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:1;}
.detail[data-category=music] .media-music .media-sleeve :is(.media-sleeve-shine,.media-sleeve-action){z-index:2;}

/* All Time Favs: a compact, searchable track list beneath the record. */
.detail[data-category=music] .favorites-browser{margin-top:24px;border-top:1px solid rgba(79,88,112,.16);text-align:left;}
.favorites-browser-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0 10px;font-size:15px;font-weight:650;}
.favorites-browser-heading small{font-size:12px;font-weight:400;color:#718095;}
.favorites-browser-heading input{width:148px;max-width:34vw;border:1px solid rgba(79,88,112,.18);border-radius:20px;background:rgba(255,255,255,.6);padding:8px 12px;color:#273347;font:inherit;font-size:13px;}
.favorites-track-list{max-height:190px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;}
.favorites-track{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;border:0;border-radius:10px;padding:7px 10px;background:transparent;color:#314057;text-align:left;cursor:pointer;}
.favorites-track[hidden]{display:none;}.favorites-track:hover,.favorites-track[aria-pressed=true]{background:rgba(110,99,160,.1);}.favorites-track:focus-visible{outline:2px solid #8578b1;outline-offset:-2px;}
.favorites-number{font-size:12px;color:#8793a1;font-variant-numeric:tabular-nums;}.favorites-track-text{display:grid;gap:2px;flex:1;min-width:0;}.favorites-track-text strong,.favorites-track-text small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.favorites-track-text strong{font-size:14px;font-weight:600;}.favorites-track-text small{font-size:12px;color:#748195;}.favorites-track>span:last-child{color:#9281c4;font-size:9px;}
.favorites-no-results{font-size:13px;color:#738092;}.favorites-spotify iframe{width:100%;min-height:152px;border:0;border-radius:12px;}.favorites-spotify{aspect-ratio:auto;min-height:152px;}.media-live-credit[href]{display:inline-block;margin-top:12px;color:#52677b;font-size:13px;}
@media(max-width:650px){.favorites-browser-heading{font-size:14px;}.favorites-track-list{max-height:150px;}.favorites-track{min-height:48px;}.detail[data-category=music] .favorites-browser{margin-top:16px;}}

/* The embedded playlist is live; the searchable shelf is a saved snapshot. */
.favorites-live-playlist{display:inline-flex;align-items:center;min-height:44px;padding:4px 0;color:#52677b;background:none;font-size:14px;text-align:left;}
.favorites-live-playlist:hover{color:#233b59;}
.favorites-spotify-playlist{min-height:352px;}

.favorites-snapshot{margin:12px 0 0;color:#718095;font-size:12px;}


/* universe.css */
@layer experience {
  #detail-title:focus{outline:none;}
  .wordmark{background:transparent;padding:0;text-align:left;}
  .keys-button{display:inline-flex;align-items:center;gap:12px;border:1px solid #bcc9d35c;border-radius:30px;padding:10px 15px;font-size:11px;color:#7a879a;background:#ffffff40;box-shadow:inset 0 1px 0 #fff;}
  .keys-button kbd{font:inherit;font-size:10px;color:#98a3b2;}
  .footer-keys{font-size:12px;letter-spacing:3px;color:#9ba7b8;}.footer-keys span{letter-spacing:0;font-size:11px;margin-left:7px;}
  .world-hint{top:32px;}.world-keys{font-size:10px;padding:8px 13px;}
  .peek-games{position:absolute;inset:0;}.peek-games img{width:62%;height:75%;object-fit:contain;position:absolute;left:1%;top:0;transform:rotate(-12deg);filter:drop-shadow(0 7px 6px #5b453929);}.peek-games img+img{left:38%;top:17%;transform:rotate(12deg);}
  .inner-old{position:fixed;z-index:1;display:flex;flex-direction:column;justify-content:center;overflow:hidden;pointer-events:none;contain:layout style;}
  .inner-portal{position:fixed;z-index:2;left:0;top:0;width:640px;height:640px;border-radius:50%;border:2px solid rgb(var(--detail-tint)/.4);transform-origin:center;pointer-events:none;background:radial-gradient(ellipse at 28% 20%,#fff,#ffffffb0 8%,#fff0 26%),radial-gradient(circle,#f3f6f9 53%,rgb(var(--detail-tint)/.13) 62%,#fff 66%,rgb(var(--detail-tint)/.65) 68%,#fff 69.5%,rgb(var(--detail-tint)/.4) 70.5%);box-shadow:inset 0 3px 4px #fff,inset 5px -3px 10px #fff9;}
  .world-toolbar,.world-footer{z-index:6;}.world-stage{isolation:isolate;}
  .is-subtravelling .showcase-node-inner,.is-subtravelling .media-portal-orbit{animation-play-state:paused;}
  @media(max-width:600px){
    .keys-button{font-size:10px;padding:9px 12px;gap:9px;}.footer-keys{display:none;}.scene{top:86px;height:calc(100svh - 160px);}.world-hint{display:block;left:auto;right:18px;top:-28px;}.world-keys{padding:8px;font-size:0;gap:0;}.world-keys kbd{font-size:11px;}.world-exit{display:none;}
    .inner-old{justify-content:flex-start;}
  }
  @media(max-width:600px) and (max-height:740px){.scene{top:84px;height:calc(100svh - 150px);}.world-hint{top:-28px;}}
}
@layer accessibility {
  #detail-title:focus,#detail-title:focus-visible{outline:none;box-shadow:none;}
}
@layer experience {
  .showcase-node-inner{animation:subbubble-drift 8s ease-in-out infinite;animation-delay:calc(var(--showcase-order,0)*-2.3s);}
  .media-orb{animation:subbubble-drift 8.6s ease-in-out infinite;}.media-portal-films .media-orb{animation-delay:-3.8s;}
  @keyframes subbubble-drift{0%,100%{translate:0 0;rotate:-.6deg;}50%{translate:0 -7px;rotate:.6deg;}}
  .motion-paused .showcase-node-inner,.motion-paused .media-orb,.is-subtravelling .showcase-node-inner,.is-subtravelling .media-orb{animation-play-state:paused;}
  @media(prefers-reduced-motion:reduce){.showcase-node-inner,.media-orb{animation:none;}}
}
@layer experience {
  .inner-old *{animation-play-state:paused!important;}
}

@layer experience {
  .world-toolbar>.world-keys{margin-left:20px;font-size:10px;gap:7px;padding:7px 10px;}
  @media(max-width:600px){.world-counter{display:none;}.world-toolbar>.world-keys{margin-left:auto;font-size:10px;}.world-toolbar>.world-keys kbd{font-size:10px;}}
}


/* morph.css */
@layer experience {
  /* Small frozen assets, native compositor tracks, no animated blur or layout. */
  .inner-old {position:fixed!important;flex:none!important;max-width:none!important;max-height:none!important;overflow:hidden!important;pointer-events:none!important;contain:layout style;}
  .inner-old * {animation-play-state:paused!important;}
  .morph-ghost {position:fixed;z-index:8;pointer-events:none;transform-origin:0 0;isolation:isolate;contain:layout style;overflow:hidden;}
  .morph-ghost * {pointer-events:none!important;animation:none!important;transition:none!important;}
  .morph-context::before,.morph-context::after {display:none!important;}
  [data-morph-hidden],[data-morph-hidden] * {visibility:hidden!important;}
  .morph-ghost-title {overflow:visible;}
  .morph-shell {border:0!important;box-shadow:none!important;background:radial-gradient(circle,transparent 65%,rgb(var(--detail-tint)/.03) 66%,#ffffffa6 68.4%,rgb(var(--detail-tint)/.24) 69%,#ffffffd9 69.5%,transparent 71%)!important;}
  .is-subtravelling .world-stage {scroll-behavior:auto;}
  .is-subtravelling .world-stage>* {animation-play-state:paused!important;}
  @media(prefers-reduced-motion:reduce) {.morph-ghost,.morph-shell {display:none!important;}}
}


/* made.css */
@layer experience {
 .made-home{width:100%;margin:auto;}.made-heading{text-align:center;margin:12px 0 38px;}.made-heading h2{font-size:clamp(34px,3.7vw,55px);font-weight:620;letter-spacing:-2px;line-height:1.08;margin:15px 0 16px;}.made-heading p{font-size:14px;color:#627087;}
 .made-garden{display:flex;align-items:flex-start;justify-content:center;gap:110px;padding:20px 0 30px;}.made-node{padding:0;width:245px;background:none;display:flex;align-items:center;flex-direction:column;color:#37465b;outline-offset:9px;border-radius:50%;}.made-node-orb{display:grid;place-items:center;width:245px;aspect-ratio:1;position:relative;border-radius:50%;background:radial-gradient(ellipse at 29% 20%,#fff,#fff0 28%),radial-gradient(circle,#fff0 50%,rgb(var(--made-tint)/.15) 61%,#fff 67%,rgb(var(--made-tint)/.4) 69%,#fff 70%,rgb(var(--made-tint)/.3) 72%);box-shadow:0 20px 30px -25px rgb(var(--made-tint)/.4);transition:transform 280ms var(--ease);}.made-node-orb .made-cover{display:block;width:49%;height:49%;}.made-node-orb img{display:block;width:100%;height:100%;object-fit:cover;border:2px solid #fff9;border-radius:9px;transform:rotate(-7deg);box-shadow:0 9px 15px #36445629;}.made-node:nth-child(2) .made-node-orb img{transform:rotate(7deg);}.made-node strong{font-size:22px;letter-spacing:-.5px;margin-top:24px;}.made-node>span:last-child{font-size:11px;color:#627087;margin-top:9px;}.made-node-glint{position:absolute;left:19%;top:16%;width:22%;height:7%;border-radius:50%;background:linear-gradient(#fff,#fff0);rotate:-40deg;}
 .made-focus{width:min(1010px,100%);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center;padding:25px 15px;}.made-art{position:relative;aspect-ratio:1;isolation:isolate;max-width:405px;border-radius:18px;box-shadow:0 30px 60px -25px #283e5b44;overflow:hidden;transform:none;}.made-art img{width:100%;height:100%;display:block;object-fit:cover;}.made-art-shine{position:absolute;inset:0;background:linear-gradient(135deg,#ffffff1a,#fff0 30%,#fff0 75%,#ffffff17);pointer-events:none;}.made-art-credit{display:block;font-size:10px;color:#627087;text-align:center;margin-top:28px;letter-spacing:.2px;}.made-copy h2{font-size:clamp(39px,4vw,61px);letter-spacing:-2.5px;font-weight:620;line-height:1.04;margin:18px 0 22px;}.made-intro{font-size:18px;line-height:1.6;color:#52647b;max-width:320px;}.made-story{font-size:13px;line-height:1.9;color:#627087;margin-top:20px;}.made-player{margin-top:30px;}.made-player-top{display:flex;gap:15px;align-items:center;}.made-play{width:49px;height:49px;display:grid;place-items:center;border-radius:50%;background:#ffffffcc;border:1px solid #fff;box-shadow:0 8px 25px #455a7510;flex:none;color:#69768a;}.made-play svg{width:20px;height:20px;fill:currentColor;}.made-player-top strong{font-size:13px;font-weight:570;display:block;line-height:1.5;}.made-player-status{display:block;font-size:10px;color:#627087;margin-top:4px;}.made-seek{display:block;position:relative;height:48px;margin-top:23px;}.made-seek input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;}.made-seek:has(input:focus-visible){outline:2px solid #8ea4bd;outline-offset:5px;border-radius:6px;}.made-wave{display:flex;align-items:center;justify-content:space-between;height:100%;gap:3px;pointer-events:none;}.made-wave i{display:block;flex:1;max-width:4px;min-height:3px;border-radius:3px;background:#cbd2db;transition:background 100ms;}.made-wave i.is-played{background:rgb(var(--made-tint));}.made-times{display:flex;justify-content:space-between;font-size:9px;font-variant-numeric:tabular-nums;color:#627087;margin-top:8px;}.made-back{margin-top:24px;padding:7px 0;background:none;font-size:10px;color:#627087;}.made-status{font-size:10px;color:#765c4c;line-height:1.6;margin-top:12px;}
 .media-portals{display:grid;grid-template-columns:repeat(3,210px);gap:55px;max-width:none;}.media-portals .media-portal,.media-portals .media-orb{width:210px;}.media-portal-made{--orb-tint:133 153 168;}.media-orb-made-art{position:absolute;width:52%;height:52%;object-fit:cover;left:24%;top:24%;border-radius:8px;transform:rotate(-7deg);box-shadow:0 9px 18px #354a6326;}
 @media(hover:hover) and (pointer:fine){.made-node:hover .made-node-orb{transform:translateY(-7px) scale(1.025);}.made-play:hover{transform:scale(1.04);}}
 @media(min-width:901px) and (max-height:820px){.made-heading{margin-bottom:22px;}.made-garden{padding-top:8px;}.made-node,.made-node-orb{width:205px;}.made-focus{max-width:900px;gap:70px;}.made-art{max-width:330px;}.made-copy h2{font-size:48px;}.made-intro{font-size:16px;}.made-story{font-size:12px;margin-top:14px;}.made-player{margin-top:20px;}.media-portals{gap:50px;}.media-portals .media-portal,.media-portals .media-orb{width:190px;}}
 @media(max-width:900px) and (min-width:601px){.made-focus{gap:45px;}.made-garden{gap:55px;}.made-node,.made-node-orb{width:210px;}.media-portals{grid-template-columns:repeat(3,175px);gap:30px;}.media-portals .media-portal,.media-portals .media-orb{width:175px;}.made-copy h2{font-size:43px;}.made-intro{font-size:16px;}}
 @media(max-width:600px){.made-heading{margin:10px 0 25px;}.made-heading h2{font-size:35px;letter-spacing:-1.4px;}.made-heading p{font-size:12px;}.made-garden{gap:18px;padding:15px 0 22px;}.made-node,.made-node-orb{width:145px;}.made-node strong{font-size:19px;margin-top:20px;}.made-node>span:last-child{font-size:9px;}.made-focus{display:flex;flex-direction:column;padding:14px 5px;gap:32px;}.made-art-object{width:100%;max-width:260px;}.made-art-credit{margin-top:20px;}.made-copy{text-align:center;max-width:320px;}.made-copy h2{font-size:42px;letter-spacing:-1.8px;margin:14px 0 18px;}.made-intro{font-size:16px;margin:auto;}.made-story{font-size:12px;margin-top:17px;}.made-player{text-align:left;margin-top:25px;}.made-player-top strong{font-size:12px;}.made-player-status{font-size:9px;}.made-seek{margin-top:18px;height:42px;}.made-wave{gap:2px;}.media-portals{grid-template-columns:repeat(2,145px);gap:24px 18px;justify-content:center;padding-top:0;}.media-portals .media-portal,.media-portals .media-orb{width:145px;}.media-portal-made{grid-column:1/-1;justify-self:center;}.media-portals .media-portal strong{font-size:16px;margin-top:13px;}.media-portals .media-portal>span:last-child{font-size:9px;}}
 @media(max-width:360px){.made-node,.made-node-orb{width:122px;}.made-node>span:last-child{font-size:8px;}.made-node strong{font-size:18px;}.media-portals{grid-template-columns:repeat(2,122px);gap:22px 15px;}.media-portals .media-portal,.media-portals .media-orb{width:122px;}.made-focus{padding-left:0;padding-right:0;}}
 @media(prefers-reduced-motion:reduce){.made-node-orb,.made-play,.made-wave i{transition:none;}}
}
@layer experience {
 .made-heading h2,.made-copy h2{letter-spacing:-.035em;text-wrap:balance;}
 .made-story{line-height:1.85;}
 .made-player-top>div{min-width:0;}
 .made-player-status{line-height:1.6;}
 .made-status:empty{display:none;}
 .made-back{min-height:44px;font-size:11px;margin-top:12px;}
 .made-follow-thread{margin-top:23px;padding-top:17px;border-top:1px solid #9aa7b126;}
 .made-follow-thread>span{font-size:10px;color:#627087;line-height:1.5;}
 .made-follow-thread button{display:flex;align-items:center;gap:12px;min-height:44px;padding:7px 0;color:#536a82;background:none;font-size:11px;line-height:1.6;text-align:left;}
 .made-follow-thread button span{font-size:16px;}
 .made-seek:has(input:disabled){opacity:.4;}
 .made-seek input:disabled{cursor:wait;}
 .made-focus[data-playback=loading] .made-play{opacity:.6;}
 .made-node:focus-visible .made-node-orb{transform:translateY(-6px) scale(1.02);}
 @media(max-width:600px){.made-follow-thread button{margin:auto;}.made-player-status{font-size:10px;}.made-art-credit{font-size:11px;}.made-times{font-size:10px;}.made-follow-thread{margin-top:20px;}}
 .motion-paused .made-node-orb,.motion-paused .made-play,.motion-paused .made-wave i{transition:none;}
}


/* explorer.css */
@layer experience {
  .keys-button {display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:9px 12px;border:1px solid transparent;border-radius:20px;background:transparent;color:#778497;font-size:12px;font-weight:500;transition:background 160ms,border-color 160ms,color 160ms;}
  .keys-button:hover,.keys-button[aria-expanded="true"] {background:#ffffff90;border-color:#ffffffc9;color:#40546e;}
  .keys-button kbd {display:inline-grid;place-items:center;width:19px;height:19px;border:1px solid #b8c4d14d;border-radius:6px;color:#8190a3;font-family:inherit;font-size:11px;font-weight:500;line-height:1;}
  .is-keyboard [data-explorer-active]:focus {outline:2px solid #7b9abd9c;outline-offset:7px;}
  .is-keyboard [data-explore-item][data-explorer-active]:focus {outline-color:rgb(var(--detail-tint,125 151 187) / .74);}
  #keyboard-guide {position:fixed;z-index:30;right:max(26px,env(safe-area-inset-right));bottom:max(28px,env(safe-area-inset-bottom));width:min(345px,calc(100vw - 40px));padding:23px 23px 19px;border:1px solid #ffffffed;border-radius:25px;background:#f7fafbeF;box-shadow:0 17px 65px #48627f1c,inset 0 1px 0 #fff;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#506179;font-size:12px;line-height:1.5;transform-origin:bottom right;}
  #keyboard-guide[hidden] {display:none;}
  .explorer-guide-header {display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:21px;}
  .explorer-guide-header strong {display:block;color:#34475f;font-weight:600;font-size:17px;letter-spacing:-.4px;}
  .explorer-guide-header p {margin:3px 0 0;color:#8996a7;font-size:12px;}
  .explorer-guide-close {display:grid;place-items:center;flex:none;width:28px;height:28px;margin:-5px -6px 0 0;border-radius:50%;background:transparent;color:#8491a2;font-size:23px;font-weight:300;line-height:1;transition:background 150ms,color 150ms;}
  .explorer-guide-close:hover {background:#e9eef5;color:#40536b;}
  .explorer-shortcuts {display:grid;gap:13px;margin:0;}
  .explorer-shortcuts>div {display:grid;grid-template-columns:105px minmax(0,1fr);align-items:center;gap:10px;}
  .explorer-shortcuts dt {display:flex;align-items:center;gap:3px;margin:0;}
  .explorer-shortcuts dd {margin:0;color:#6a7b91;font-size:11px;line-height:1.5;}
  .explorer-shortcuts kbd {display:inline-flex;min-width:22px;min-height:23px;align-items:center;justify-content:center;padding:3px 6px;border:1px solid #b6c4d154;border-radius:6px;background:#ffffffa8;box-shadow:0 1px 0 #a9b8ca21;color:#657890;font-family:inherit;font-size:10px;font-weight:500;line-height:1;}
  .explorer-shortcuts dt>span {padding:0 2px;color:#98a5b5;}
  .explorer-guide-note {margin:19px 0 0;padding-top:14px;border-top:1px solid #cbd5e033;color:#8a97a7;font-size:11px;}
  @media (max-width:600px) {
    .keys-button {padding:8px 9px;font-size:11px;gap:6px;}
    #keyboard-guide {right:20px;bottom:max(20px,env(safe-area-inset-bottom));padding:21px;}
  }
  @media (prefers-reduced-motion:reduce) {
    .keys-button,.explorer-guide-close {transition:none;}
  }
}


/* exploration-v33.css */
/* A visitor's shelf and short editorial paths share the existing world camera. */
.keeps-button,.world-keep{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;background:none;padding:9px 12px;border-radius:24px;color:#526775;font-size:16px;white-space:nowrap;}
.keeps-button svg,.world-keep svg{width:19px;height:21px;flex:none;}
.keeps-button [data-kept-total]{font-variant-numeric:tabular-nums;min-width:19px;font-size:12px;color:#526775;}
.keeps-button:hover{background:#fff9;}
.world-toolbar>.world-keep{margin-left:auto;color:var(--world-ink,#42585f);font-size:17px;}
.world-toolbar:has(.world-keep:not([hidden]))>.world-find{margin-left:0!important;}
.world-keep[aria-pressed=true]{background:color-mix(in srgb,currentColor 9%,transparent);}
.world-keep[aria-pressed=true] svg{fill:currentColor;}
.world-keep[hidden],.exploration-thread[hidden],.exploration-return[hidden]{display:none!important;}
.detail[data-collection-layout=cinema] .world-keep{color:#e7eceb;}
.cinema-room .world-keep{color:#e7eceb;}
.discovery-kept{display:inline-flex;align-items:center;gap:7px;}
.discovery-kept svg{width:16px;height:18px;}
.discovery-foot:has(.discovery-kept)>span{display:none;}
.exploration-home-actions{display:flex;align-items:center;gap:clamp(18px,2vw,34px);min-width:0;}
.exploration-return{display:inline-flex;align-items:center;gap:10px;min-width:0;max-width:310px;min-height:48px;padding:5px 0;background:none;color:#526775;text-align:left;font-size:13px;}
.exploration-return>span:not(.kept-art){min-width:0;display:flex;flex-direction:column;gap:2px;}
.exploration-return strong{font-weight:550;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px;font-size:15px;color:#304b59;}
.exploration-return>.kept-art{width:35px;height:39px;min-height:0;}
.exploration-return>.kept-art img{max-width:100%;max-height:100%;border-radius:4px;}
.exploration-return>svg{width:18px;height:18px;flex:none;}
.footer:has(.exploration-return:not([hidden])) .hint{display:none;}
.exploration-path-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;}
@media(min-width:701px){.exploration-path{max-width:440px;}}
.exploration-path{display:flex;align-items:center;gap:17px;min-width:0;padding:8px 0 12px;min-height:105px;background:none;color:#30413e;text-align:left;border-radius:6px;}
.exploration-path-art{width:75px;height:82px;position:relative;flex:none;display:block;}
.exploration-path-art img{position:absolute;bottom:4px;left:8px;width:53px;height:72px;object-fit:cover;box-shadow:0 9px 13px -8px #233d4655;border-radius:3px;transform:rotate(-8deg);transition:transform .3s cubic-bezier(.22,1,.36,1);}
.exploration-path-art img:nth-child(2){left:22px;bottom:7px;transform:rotate(6deg);}
.exploration-path-art img:nth-child(3){left:14px;bottom:0;transform:rotate(-1deg);}
.exploration-path-copy{display:flex;flex:1;flex-direction:column;gap:7px;min-width:0;}
.exploration-path-copy strong{font-size:20px;font-weight:550;letter-spacing:-.02em;line-height:1.25;}
.exploration-path-copy>span{font-size:15px;color:#5a6b62;line-height:1.4;max-width:28ch;}
.exploration-path-arrow{font-size:21px;color:#5a6b62;align-self:center;}
.exploration-path:focus-visible{outline:2px solid #47775e;outline-offset:5px;}
.exploration-thread{flex:none;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;margin:0 clamp(20px,3.5vw,72px);padding:12px 0;border-top:1px solid color-mix(in srgb,var(--world-ink,#344638) 16%,transparent);color:var(--world-ink,#344638);}
.exploration-thread-copy{min-width:0;max-width:55ch;}
.exploration-thread-copy>strong{display:flex;align-items:center;gap:16px;font-size:17px;font-weight:550;line-height:1.3;}
.exploration-thread-copy>strong>span{font-size:13px;font-weight:400;font-variant-numeric:tabular-nums;opacity:.8;}
.exploration-thread-copy>p{font-size:14px;line-height:1.4;margin:6px 0 0;opacity:.85;}
.exploration-thread-controls{display:flex;align-items:center;gap:12px;flex:none;}
.exploration-thread button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:5px 8px;background:none;color:inherit;border-radius:8px;text-align:left;font-size:15px;}
.exploration-thread .exploration-thread-next{padding-right:0;}
.exploration-thread-next>.kept-art{width:36px;height:42px;min-height:0;}
.exploration-thread-next .kept-art img{max-width:100%;max-height:100%;border-radius:3px;}
.exploration-thread-next>span:not(.kept-art){display:flex;flex-direction:column;gap:3px;font-size:12px;}
.exploration-thread-next strong{font-size:17px;font-weight:550;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.exploration-thread-next>svg{width:20px;height:20px;flex:none;}
.exploration-thread .exploration-thread-close{width:44px;padding:12px;opacity:.8;}
.exploration-thread-close svg{width:20px;height:20px;}
.detail[data-collection-layout] .exploration-thread{color:var(--collection-ink);}
.cinema-room .exploration-thread{color:#e7eceb;}
/* While a thread owns the world footer, the fixed sound pill steps above the
   rail so its next-stop control stays reachable. */
body:has(dialog[data-exploration-thread]) .site-sound{bottom:calc(112px + env(safe-area-inset-bottom));}
.detail[data-exploration-thread][data-category=play] .world-stage{height:auto;min-height:0;flex:1;}
.detail[data-exploration-thread][data-category=play] .wake-frame{min-height:0;}
.detail[data-exploration-thread][data-category=play] .exploration-thread{color:#365044;background:#f3f6ef;margin:0;padding:12px max(20px,3vw);}
.detail[data-exploration-thread][data-category=play] .exploration-thread-copy>p{display:none;}
.kept-shelf{width:min(1180px,100%);margin:auto;padding:32px clamp(14px,2vw,28px) 40px;color:#30413e;flex:none;}
.kept-heading{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:34px;}
.kept-heading h2{font-size:clamp(40px,5vw,72px);font-weight:550;line-height:1.05;letter-spacing:-.04em;margin:0;outline:none;}
.kept-heading p{font-size:16px;line-height:1.5;max-width:42ch;color:#5d7065;margin:15px 0 0;}
.kept-browse,.kept-empty button{display:inline-flex;align-items:center;justify-content:center;gap:17px;min-height:48px;font-size:17px;background:none;color:#355c48;padding:8px 0;}
.kept-browse svg,.kept-empty button svg{width:21px;height:21px;flex:none;}
.kept-search{display:flex;align-items:center;gap:20px;padding:16px 0;border-block:1px solid #7c978338;margin-bottom:8px;}
.kept-search label{font-size:15px;color:#526858;flex:none;}
.kept-search input{display:block;flex:1;min-width:0;height:44px;padding:6px 0;background:none;border:0;font:inherit;font-size:20px;color:#30413e;caret-color:#38634d;}
.kept-search input::placeholder{color:#66786b;}
.kept-search:focus-within{border-bottom-color:#3f7154;}
.kept-filters{display:flex;gap:22px;overflow-x:auto;scrollbar-width:thin;}
.kept-filters button{min-height:48px;padding:9px 0;background:none;font-size:16px;color:#607164;white-space:nowrap;border-bottom:2px solid transparent;}
.kept-filters button[aria-pressed=true]{color:#304c3a;border-bottom-color:#3d7050;}
.kept-feedback{display:flex;align-items:center;gap:15px;min-height:30px;font-size:14px;color:#466450;margin-top:10px;}
.kept-feedback:has([data-kept-feedback]:empty){display:none;}
.kept-feedback button{background:none;text-decoration:underline;text-underline-offset:4px;min-height:44px;color:#314f3b;padding:6px;}
.kept-count{font-size:14px;color:#607164;margin:18px 0 14px;font-variant-numeric:tabular-nums;}
.kept-objects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 28px;}
.kept-object{position:relative;min-width:0;}
.kept-open{background:none;display:flex;align-items:flex-start;flex-direction:column;text-align:left;padding:0;min-width:0;width:100%;color:#30413e;}
.kept-open>[data-morph=cover]{display:block;width:100%;}
.kept-art{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;}
.kept-open .kept-art{height:210px;padding:12px 0 18px;}
.kept-art img{max-width:90%;max-height:100%;object-fit:contain;border-radius:6px;}
.kept-open .kept-art img{box-shadow:0 22px 24px -19px #25433177;transition:transform .3s cubic-bezier(.22,1,.36,1);}
.kept-art svg{width:45px;height:45px;fill:currentColor;}
.kept-open>strong{font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:550;padding-right:35px;overflow-wrap:anywhere;}
.kept-open>span:last-child{font-size:14px;color:#607164;margin-top:7px;line-height:1.4;}
.kept-remove{position:absolute;top:216px;right:-6px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:none;color:#4d7057;}
.kept-remove svg{width:18px;height:21px;fill:currentColor;}
.kept-empty{padding:clamp(30px,7vh,90px) 0;text-align:center;}
.kept-empty>svg{width:36px;height:40px;margin:0 auto 22px;color:#537159;}
.kept-empty h3{font-weight:500;font-size:clamp(25px,3vw,38px);letter-spacing:-.035em;line-height:1.2;margin:0 auto 16px;max-width:23ch;}
.kept-empty p{font-size:17px;color:#607164;line-height:1.6;max-width:40ch;margin:0 auto 18px;}
.kept-shelf button:focus-visible,.world-keep:focus-visible,.keeps-button:focus-visible,.exploration-return:focus-visible,.exploration-thread button:focus-visible{outline:2px solid #4f7b63;outline-offset:4px;}
.kept-shelf ::selection,.collection-entrance ::selection{background:#bfd4bb;color:#20392b;}
.kept-shelf,.collection-entrance{scrollbar-color:#a2b39d transparent;scrollbar-width:thin;}
/* The collector's rooms share a light navigation surface. Cinema retains its
   dark viewing palette, including readable inactive destinations. */
.detail[data-collection-layout][data-room-world] .world-footer .world-nav{background:#fafaf6;border:1px solid #78887935;box-shadow:0 8px 20px -16px #27412f40;}
.detail[data-collection-layout][data-room-world] .world-footer .mini-bubble{color:#56665b;opacity:1;}
.detail[data-collection-layout][data-room-world] .world-footer .mini-bubble[aria-pressed=true]{color:#384e41;background:#dde7dd;}
.detail[data-collection-layout=cinema][data-room-world] .world-footer .world-nav{background:#19212a;border-color:#77899945;}
.detail[data-collection-layout=cinema][data-room-world] .world-footer .mini-bubble{color:#bbc7d2;}
.detail[data-collection-layout=cinema][data-room-world] .world-footer .mini-bubble[aria-pressed=true]{color:#fff;background:#394959;}
.detail[data-collection-layout][data-room-world] .world-footer .world-nav-label{color:inherit;}
@media(hover:hover){
 .exploration-path:hover .exploration-path-art img:first-child{transform:translateX(-4px) rotate(-12deg);}
 .exploration-path:hover .exploration-path-art img:nth-child(2){transform:translateX(4px) rotate(10deg);}
 .kept-open:hover .kept-art img{transform:translateY(-5px);}
 .kept-remove:hover{background:#c8dacb55;}
}
@media(max-width:1000px){.exploration-path-list{gap:14px;}.exploration-path{gap:9px;}.exploration-path-art{width:58px;}.exploration-path-art img{width:41px;height:60px;left:0;}.exploration-path-art img:nth-child(2){left:15px;}.exploration-path-art img:nth-child(3){left:8px;}.exploration-path-copy strong{font-size:18px;}.exploration-path-copy>span{font-size:14px;}.kept-objects{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:700px){
 .exploration-path-list{grid-template-columns:1fr;gap:4px;}
 .exploration-path{min-height:94px;gap:18px;padding:8px 0;}
 .exploration-path-art{width:70px;height:76px;}
 .exploration-path-art img{width:46px;height:64px;left:4px;}
 .exploration-path-art img:nth-child(2){left:19px;}
 .exploration-path-art img:nth-child(3){left:12px;}
 .exploration-path-copy strong{font-size:20px;}
 .exploration-path-copy>span{font-size:15px;max-width:35ch;}
 .exploration-path-arrow{margin-left:auto;}
 .kept-heading{display:block;}
 .kept-browse{margin-top:12px;}
 .kept-objects{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px;}
 .kept-open .kept-art{height:170px;}
 .kept-open>strong{font-size:19px;padding-right:23px;}
 .kept-open>span:last-child{font-size:13px;}
 .kept-remove{top:172px;right:-10px;}
 .kept-search{display:block;}
 .kept-search input{width:100%;margin-top:8px;}
 .kept-filters{gap:18px;}
 .kept-filters button{font-size:15px;}
 .exploration-thread{padding:9px 0;gap:8px;}
 .exploration-thread-copy>p{display:none;}
 .exploration-thread-copy>strong{font-size:14px;display:block;}
 .exploration-thread-copy>strong>span{display:block;font-size:12px;margin-top:4px;}
 .exploration-thread-next>.kept-art{display:none;}
 .exploration-thread-next strong{font-size:15px;max-width:135px;}
 .exploration-thread-controls{gap:0;}
 .exploration-thread button{gap:6px;}
 .exploration-thread .exploration-thread-previous{display:none;}
}
@media(max-width:600px){
 .header-tools .keeps-button{padding:8px;gap:2px;min-width:44px;}
 .header-tools .keeps-button>span:not([data-kept-total]){display:none;}
 .header-tools .keeps-button [data-kept-total]{font-size:10px;min-width:10px;}
 .world-toolbar>.world-keep{width:44px;min-width:44px;padding:10px;}
 .world-keep>span{display:none;}
 .world-toolbar:has(.world-keep:not([hidden])) .world-category{max-width:calc(100% - 215px);font-size:16px;gap:4px;overflow:hidden;white-space:nowrap;}
 .world-toolbar:has(.world-keep:not([hidden])) .world-category svg{display:none;}
 .exploration-return{max-width:155px;font-size:10px;gap:6px;min-height:44px;}
 .exploration-return .kept-art{display:none;}
 .exploration-return strong{max-width:105px;font-size:12px;}
 .exploration-return>svg{width:15px;height:15px;}
 .exploration-home-actions{gap:16px;}
 .footer:has(.exploration-return:not([hidden])) .footer-keys{display:none;}
 .kept-shelf{padding:24px 14px 32px;}
}
@media(max-width:360px){.exploration-return{max-width:125px;}.exploration-return strong{max-width:95px;}.exploration-home-actions{gap:10px;}.kept-open .kept-art{height:145px;}.kept-remove{top:146px;}.kept-open>strong{font-size:17px;}.exploration-thread-next strong{max-width:108px;}}

/* The current centered world menu and the keep action share one compact row. */
@media(max-width:950px){
 body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar:has(>.world-keep:not([hidden])){display:grid;grid-template-columns:44px minmax(0,1fr) 44px 40px 40px;gap:4px;padding-inline:12px;}
 body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden]))>.world-back{grid-column:1;width:44px;max-width:none;padding:0;justify-content:center;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden])) .world-back .breadcrumb{display:none;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden]))>.world-switcher{position:relative;inset:auto;translate:none;grid-column:2;width:min(100%,220px);max-width:100%;min-width:0;justify-self:center;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden])) .world-switcher-toggle{box-sizing:border-box;width:100%;height:44px;min-height:44px;min-width:0;padding:8px;gap:5px;}
 body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden])) .world-category{flex:1;min-width:0;max-width:100%;font-size:14px;line-height:1.1;gap:5px;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden])) .world-category span{max-width:100%;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden])) .world-category svg{display:none;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden])) .world-switcher-menu{left:0;translate:0 0;width:min(246px,calc(100vw - 32px));}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden]))>.world-keep{grid-column:3;width:44px;min-width:44px;margin:0;padding:10px;}
 .cohesive-world .world-toolbar:has(>.world-keep:not([hidden]))>.world-keep>span{display:none;}
 body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden]))>.world-find{grid-column:4;width:40px;height:40px;margin:0;padding:10px;}
 body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden]))>.world-keys{grid-column:5;justify-content:center;width:40px;min-width:40px;height:40px;margin:0;padding:8px 0;gap:0;font-size:12px;}
}
@media(prefers-reduced-motion:reduce){.exploration-path img,.kept-open img{transition:none!important;transform:none!important;}}
.motion-paused .exploration-path img,.motion-paused .kept-open img{transition:none!important;transform:none!important;}


/* moods.css */
@layer experience {
  .mood-atmosphere {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(ellipse at 50% 38%, #203c30 0%, #11251f 33%, #0b1715 70%);
    transition: opacity 1000ms cubic-bezier(.22, 1, .36, 1);
  }
  .mood-matrix .mood-atmosphere { opacity: 1; }
  .ambient { transition: opacity 1000ms cubic-bezier(.22, 1, .36, 1); }
  .mood-matrix .ambient { opacity: 0; }
  .mood-bubble-shade { position:absolute;inset:2px;border-radius:50%;pointer-events:none;z-index:0;opacity:0;background:radial-gradient(ellipse at 30% 20%,#accbb54a,transparent 33%),radial-gradient(ellipse at 65% 75%,rgb(var(--tint)/.22),transparent 70%),#132b23;transition:opacity 1000ms cubic-bezier(.22,1,.36,1); }
  .mood-matrix .mood-bubble-shade { opacity:1; }
  .bubble-content { position:relative;z-index:1; }
  .person h1, .wordmark, .person p, .footer-note, .hint, .footer-keys,
  .footer-keys span, .bubble-label, .keys-button, .motion-toggle {
    transition: color 720ms ease;
  }
  .bubble { transition: scale 240ms var(--ease), transform 180ms var(--ease), box-shadow 240ms var(--ease), opacity 800ms cubic-bezier(.22, 1, .36, 1); }
  .droplet { transition: opacity 800ms ease; }
  .mood-matrix .person h1, .mood-matrix .wordmark { color: #e8f4e9; }
  .mood-matrix .person p, .mood-matrix .footer-note, .mood-matrix .hint,
  .mood-matrix .footer-keys, .mood-matrix .footer-keys span,
  .mood-matrix .keys-button, .mood-matrix .motion-toggle { color: #9ab6a6; }
  .mood-matrix .bubble-label { color: #e1eee6; }
  .mood-matrix .bubble:not(.bubble-play) { opacity: .5; }
  .mood-matrix .bubble-play { --tint: 106 206 155; --color: #89e3ac; }
  .mood-matrix .bubble-play .bubble-label { color: #c9e8d6; }
  .mood-matrix .droplet { opacity: .22; }
  .mood-matrix .keys-button { box-shadow: inset 0 1px 0 #c0f2d42b; border-color: #80a58e4a; background: #b3e9c00a; }
  .mood-matrix .motion-toggle { border-color: #7c9a8660; }
  .mood-matrix .head-shadow { opacity: .15; }
  @media (prefers-reduced-motion: reduce) {
    .mood-atmosphere, .ambient, .droplet { transition: none; }
  }
  @media (forced-colors: active) { .mood-atmosphere { display: none; } }
}


/* bubble-motion.css */
@layer experience {
  .bubble-position > .bubble { touch-action: none; -webkit-user-drag: none; }
  .bubble-position.is-dragging { z-index: 7; }
  .bubble-position.is-dragging > .bubble {
    cursor: grabbing;
    animation-play-state: paused;
    transform: none !important;
    scale: 1.045;
  }
  .overview-dragging, .overview-dragging * { cursor: grabbing !important; }
  .bubble-reset {
    display: grid; place-items: center;
    width: 32px; height: 32px; flex: 0 0 auto;
    border: 1px solid #bac5d15c; border-radius: 50%;
    padding: 0; background: transparent; color: #738196;
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity 160ms var(--ease), visibility 160ms;
  }
  .bubble-reset svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  .bubbles-arranged .bubble-reset { opacity: 1; visibility: visible; pointer-events: auto; }
  .mood-matrix .bubble-reset { color: #9ab6a6; border-color: #7c9a8660; }
  @media (hover: hover) and (pointer: fine) {
    .bubble-position > .bubble { cursor: grab; }
    .bubble-reset:hover { background: #ffffff70; }
  }
  @media (max-width: 600px) {
    .bubble-reset { width: 28px; height: 28px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .bubble-position.is-dragging > .bubble { scale: 1; }
    .bubble-reset { transition: none; }
  }
}


/* hover-scenes.css */
@layer experience {
  .hover-theatre { position:absolute;inset:0;z-index:7;pointer-events:none;color:#344258;--hover-tint:92 157 255; }
  .hover-scene-trace { position:absolute;width:320px;height:280px;left:0;top:0;fill:none;stroke:rgb(var(--hover-tint)/.35);stroke-width:.8;opacity:0;transition:opacity 220ms var(--ease);pointer-events:none; }
  .hover-theatre.is-entered .hover-scene-trace { opacity:.62; }
  .hover-satellite { position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;pointer-events:none;padding:12px;border:1px solid #fffffff2;border-radius:50%;background:radial-gradient(ellipse at 25% 16%,#ffffffed 0%,#ffffff8c 19%,#ffffff4a 50%),radial-gradient(ellipse at 70% 80%,rgb(var(--hover-tint)/.19),#fff0 70%);box-shadow:inset 0 1px 3px #fff,inset -3px -4px 12px rgb(var(--hover-tint)/.08),0 13px 32px -13px rgb(var(--hover-tint)/.29);opacity:0;transition:transform 260ms var(--ease),opacity 180ms var(--ease);font-size:10px;font-weight:450;line-height:1.2;isolation:isolate;touch-action:manipulation; }
  .hover-satellite::after { content:'';position:absolute;inset:3px;border:1px solid #ffffffa3;border-radius:inherit;pointer-events:none; }
  .hover-theatre.is-entered .hover-satellite { opacity:1; }
  .hover-theatre.is-interactive .hover-satellite { pointer-events:auto; }
  .hover-satellite:nth-of-type(2) { transition-delay:30ms; }
  .hover-satellite:nth-of-type(3) { transition-delay:60ms; }
  .hover-theatre.is-gathering .hover-satellite { pointer-events:none;opacity:0;transition-duration:210ms,150ms;transition-delay:0ms; }
  .hover-theatre.is-gathering .hover-scene-trace { opacity:0; }
  .hover-satellite[hidden] { display:none; }
  .hover-satellite strong { display:block;font-size:10px;font-weight:620;letter-spacing:-.15px;white-space:nowrap; }
  .hover-action-note { display:block;font-size:7px;letter-spacing:-.05px;color:#8791a0;white-space:nowrap; }
  .hover-satellite:focus-visible { outline:2px solid rgb(var(--hover-tint));outline-offset:5px; }
  .hover-satellite:active { scale:.97; }
  .hover-cover { border-radius:25px;gap:7px;padding:11px 11px 9px; }
  .hover-game-brand { border-radius:16px; padding:7px; gap:3px; background:#ffffffc9; }
  .hover-game-brand img { width:100%; height:66%; object-fit:cover; object-position:top; border-radius:9px; pointer-events:none; }
  .hover-game-brand strong { font-size:11px; color:#263442; }
  .hover-game-brand .hover-action-note { font-size:8px; color:#536779; }
  .hover-game-songronde img { object-fit:contain; background:#151518; }
  .hover-cover img { display:block;width:100%;height:68%;object-fit:contain;pointer-events:none; }
  .hover-cover-desk img,.hover-cover-fire img { object-fit:cover;border-radius:10px; }
  .hover-cover strong { font-size:9px; }
  .hover-cover-desk { background:linear-gradient(150deg,#fcfef9ec,#e9f0e5b3); }
  .hover-cover-fire { background:linear-gradient(150deg,#fff9f2ed,#f3e2d5b0); }
  .hover-cover-memoji { background:linear-gradient(150deg,#f8faffeb,#e5eaf2b3); }
  .hover-quiz-cover { background:linear-gradient(150deg,#f9fbffed,#e2eaf5b3); }
  .hover-app-card { border-radius:18px;padding:8px;gap:4px;background:#f7f9fbe8;color:#303a49; }
  .hover-app-card>img { display:block;width:42px;height:42px;max-height:62%;object-fit:contain;pointer-events:none; }
  .hover-app-card>strong { font-size:11px;line-height:1.15;color:#303a49; }
  .hover-match { background:#f3f5f9ed; }
  .hover-lamp { gap:2px;overflow:hidden; }
  .hover-lamp>svg { width:68%;height:56%;color:#b2a18b;fill:#e9dfd0;position:relative;z-index:1; }
  .hover-lamp-light { position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse at 50% 50%,#ffdc86a6,#ffdb9d47 30%,#ffd69d00 73%);opacity:0;transition:opacity 220ms var(--ease); }
  .hover-lamp[aria-pressed=true] .hover-lamp-light { opacity:1; }
  .hover-lamp[aria-pressed=true]>svg { color:#ba905c;fill:#f3d69f; }
  .hover-lamp strong { position:relative; }
  .hover-lamp .hover-action-note { font-size:6px; }
  .hover-answer { border-radius:24px;background:linear-gradient(145deg,#fffdf6ed,#f4ead6b8);gap:9px; }
  .hover-answer>strong { font-size:24px;line-height:1;letter-spacing:-1px;color:#795b31; }
  .hover-answer.is-word-question>strong { font-size:16px;letter-spacing:-.4px; }
  .hover-answer-chip { width:90%;padding:5px 7px;border-radius:8px;background:#fff9;border:1px solid #fff;display:flex;align-items:center;justify-content:space-between;gap:4px;color:#795e37;font-size:11px;font-weight:650; }
  .hover-answer-chip>svg { width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
  .hover-answer.has-answer .hover-answer-chip { color:#74562e; }
  .hover-buzzer { gap:4px; }
  .hover-buzzer-cap { display:block;width:62%;height:42%;position:relative; }
  .hover-buzzer-cap::before { content:'';position:absolute;inset:29% 0 0;border-radius:50%;background:#b7a78e;box-shadow:inset 0 -3px 2px #a78e6a29; }
  .hover-buzzer-cap>i { position:absolute;inset:0 5% 23%;border-radius:50%;background:radial-gradient(ellipse at 35% 15%,#f2d2ad,#df9b74 65%,#c9875e);box-shadow:inset 0 2px 1px #fff9,0 6px 0 #be825f;transform:translateY(0);transition:transform 140ms var(--ease); }
  .hover-buzzer.has-buzzed .hover-buzzer-cap>i { transform:translateY(4px); }
  .hover-buzzer>strong { font-size:10px;color:#8a775d; }
  .hover-buzzer .hover-action-note { font-size:6px; }
  .hover-playlist { gap:4px; }
  .hover-playlist-icon { display:grid;place-items:center;width:44%;aspect-ratio:1;border-radius:50%;background:#e7dbf4;color:#8266a5;font-size:24px;line-height:1; }
  .hover-playlist>strong { font-size:9px;letter-spacing:-.2px; }
  .hover-playlist .hover-action-note { font-size:7px; }
  .hover-film img { border-radius:4px; }
  .hover-beat { gap:5px; }
  .hover-beat>svg { height:45%;width:45%;color:#a68bb8;fill:currentColor; }
  .hover-beat-bars { display:flex;align-items:center;justify-content:center;gap:3px;height:8px; }
  .hover-beat-bars>i { width:3px;height:5px;border-radius:3px;background:#ae94c3;transform:scaleY(.6); }
  .hover-beat-bars>i:nth-child(even) { height:7px; }
  .hover-beat>strong { font-size:7px;letter-spacing:0;color:#9680a5; }
  .hover-theatre.is-still .hover-satellite { transition:none; }
  .hover-theatre.is-still .hover-scene-trace { display:none; }
  .detail-open .hover-theatre { display:none; }
  @media (hover:hover) and (pointer:fine) {
    .hover-scenes-enabled .bubble[data-theatre-active] .bubble-peek { opacity:0;transform:none; }
    .hover-scenes-enabled .bubble[data-theatre-active] .bubble-content>.bubble-icon { opacity:1;transform:none; }
    .hover-scenes-enabled .bubble[data-theatre-active] .bubble-label { transform:none; }
    .hover-satellite:hover { scale:1.025; }
  }
  @media (max-width:999px),(max-height:719px) {
    .hover-satellite { padding:8px;gap:4px; }
    .hover-cover { border-radius:19px;gap:4px; }
    .hover-cover>strong { font-size:7px; }
    .hover-app-card { padding:7px;border-radius:15px;gap:3px; }
    .hover-app-card>img { width:38px;height:38px; }
    .hover-app-card>strong { font-size:11px; }
    .hover-answer { gap:6px;border-radius:19px; }
    .hover-answer>strong { font-size:21px; }
    .hover-answer.is-word-question>strong { font-size:12px; }
    .hover-answer-chip { padding:3px 5px;font-size:10px; }
    .hover-answer.has-answer .hover-answer-chip { justify-content:center; }
    .hover-answer.has-answer .hover-answer-chip>svg { display:none; }
    .hover-buzzer>strong { font-size:8px; }
    .hover-buzzer .hover-action-note,.hover-lamp .hover-action-note { font-size:5px; }
    .hover-lamp>strong { font-size:8px; }
    .hover-playlist>strong { font-size:7px; }
    .hover-playlist .hover-action-note { font-size:6px; }
    .hover-playlist-icon { font-size:19px; }
    .hover-beat>strong { font-size:6px; }
    .hover-scene-trace { opacity:.4; }
  }
  @media (prefers-reduced-motion:reduce) {
    .hover-satellite,.hover-lamp-light,.hover-buzzer-cap>i { transition:none; }
    .hover-scene-trace { display:none; }
  }
  @media (forced-colors:active) {
    .hover-satellite { border:1px solid ButtonText;background:Canvas;box-shadow:none; }
    .hover-satellite::after,.hover-scene-trace { display:none; }
  }
}

@layer experience {
 .hover-corridor{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
 .hover-corridor path{fill:none;stroke:transparent;stroke-width:38;pointer-events:none;}
 .hover-theatre.is-crossable .hover-corridor path{pointer-events:stroke;}
 .hover-theatre.is-gathering .hover-corridor path{pointer-events:none;}
 .hover-satellite{min-width:44px;min-height:44px;}
}


/* chill.css */
@layer experience {
 .chill-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;opacity:0;isolation:isolate;}
 .chill-horizon-sky{position:absolute;inset:0;background:linear-gradient(#f9f2e4 0%,#f9f5eb 44%,#e6eeea 69%,#e4eeec);}
 .chill-horizon-light{position:absolute;inset:0;background:radial-gradient(ellipse at 73% 28%,#ffe6af80,transparent 48%);}
 .chill-horizon-water{position:absolute;left:0;right:0;top:67%;bottom:0;background:linear-gradient(#d6e6e260,#e0ece67a 38%,#f2f0e7);}
 .chill-horizon-line{position:absolute;left:0;right:0;top:67%;height:1px;background:linear-gradient(90deg,transparent,#b6cebd5c 34%,#fff8 70%,transparent);}
 .chill-mode .ambient,.chill-mode .mood-atmosphere,.chill-mode .mood-bubble-shade{opacity:0;}
 .chill-mode .person>h1,.chill-mode .person>p{opacity:0;pointer-events:none;}
 .person>h1,.person>p{transition:opacity 240ms ease;}
 .chill-mode .bubble-label{color:#3d514d;}
 .chill-toggle{position:relative;z-index:3;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;margin:18px auto 0;padding:8px 13px;border:1px solid #c8d1d95c;border-radius:100px;color:#657b7c;background:#ffffff57;box-shadow:inset 0 1px 0 #ffffffd9;font-size:12px;transition:background 160ms,opacity 160ms;}
 .chill-toggle-icon,.chill-toggle-icon svg{display:block;width:18px;height:18px;}
 .chill-toggle kbd{font:inherit;font-size:10px;opacity:.65;margin-left:3px;}
 .chill-mode .chill-toggle{background:#fff9;border-color:#bacbbf66;color:#536f65;}
 .detail-open .chill-atmosphere{visibility:hidden;}
 .detail-open .chill-toggle{pointer-events:none;}
 @media(max-width:600px){.chill-toggle{font-size:11px;margin-top:12px;}.chill-toggle kbd{display:none;}}
 @media(prefers-reduced-motion:reduce){.person>h1,.person>p,.chill-toggle{transition:none;}}
 .motion-paused .person>h1,.motion-paused .person>p,.motion-paused .chill-toggle{transition:none;}
}


/* chill-interactions.css */
/* Chill v34 is head-only. The native head keeps its existing pointer and mood
   controller; no articulated body, chair, hand or limb styling is mounted. */


/* collection-shelf.css */
@layer experience {
  /* Four quiet entries keep the overview compact; the objects live a level deeper. */
  .media-portals-four {grid-template-columns:repeat(4,minmax(0,175px));gap:30px;max-width:850px;padding-inline:0;}
  .media-portals-four .media-portal,.media-portals-four .media-orb {width:100%;}
  .media-portals-four .media-portal strong {font-size:17px;white-space:nowrap;}
  .media-portal-shelf {--orb-tint:181 159 121;}
  .shelf-portal-book {position:absolute;top:23%;width:35%;height:54%;border:1px solid #fff9;border-radius:2px 4px 4px 2px;overflow:hidden;box-shadow:0 10px 20px #3c35272b;transition:transform 360ms var(--ease);}
  .shelf-portal-book img {width:100%;height:100%;object-fit:cover;display:block;}
  .shelf-portal-book-back {left:43%;transform:rotate(10deg);}
  .shelf-portal-book-front {left:22%;transform:rotate(-9deg);}
  .collection-shelf {width:100%;color:#344052;}
  .collection-shelf [hidden] {display:none!important;}
  .collection-shelf .media-heading {margin-bottom:25px;}
  .shelf-filters {display:flex;gap:4px;justify-content:center;margin:0 auto 27px;}
  .shelf-filters button {display:flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid transparent;border-radius:20px;background:transparent;color:#627087;font-size:11px;}
  .shelf-filters button span {color:#627087;font-size:9px;font-variant-numeric:tabular-nums;}
  .shelf-filters button[aria-pressed=true] {background:#ffffff8c;border-color:#fff;color:#526273;box-shadow:0 3px 10px #293d4e08;}
  .shelf-objects {display:flex;flex-wrap:wrap;justify-content:center;gap:24px 32px;width:min(940px,100%);margin:auto;}
  .shelf-object {width:155px;flex:none;display:flex;flex-direction:column;align-items:center;padding:0 0 9px;background:none;color:#445365;border-radius:15px;outline-offset:5px;}
  .shelf-object-halo {position:relative;display:flex;justify-content:center;align-items:center;width:155px;aspect-ratio:1;border-radius:50%;background:radial-gradient(ellipse at 31% 25%,#fff9,transparent 46%),radial-gradient(circle,transparent 55%,rgb(var(--shelf-tint) / .09) 68%,#fff8 69%,transparent 71%);}
  .shelf-object-cover {position:relative;display:block;width:60%;aspect-ratio:2/3;border-radius:2px 5px 5px 2px;overflow:hidden;transform:rotate(var(--shelf-tilt));box-shadow:0 14px 22px -12px #31445c65;transition:transform 360ms var(--ease);}
  .shelf-object-cover::after {content:'';position:absolute;inset:0;border-radius:inherit;border:1px solid #ffffff59;background:linear-gradient(90deg,#0002,transparent 5%,#fff2 6%,transparent 9%);pointer-events:none;}
  .shelf-object img {width:100%;height:100%;object-fit:cover;display:block;}
  .shelf-object-podcast .shelf-object-cover {width:65%;aspect-ratio:1;border-radius:7px;}
  .shelf-object-podcast .shelf-object-cover::after {background:linear-gradient(125deg,#fff2,transparent 40%);}
  .shelf-object-glint {position:absolute;width:18%;height:4%;left:20%;top:14%;background:#ffffff94;transform:rotate(-40deg);border-radius:50%;}
  .shelf-object strong {font-size:12px;font-weight:550;line-height:1.35;margin-top:12px;max-width:155px;}
  .shelf-object>span:last-child {font-size:9px;color:#627087;margin-top:6px;}
  .shelf-hint {font-size:10px;line-height:1.6;text-align:center;color:#627087;margin:22px auto 5px;}
  .collection-shelf .media-bottom {max-width:880px;margin-top:22px;}
  .shelf-focus {display:grid;grid-template-columns:1fr 1.1fr;gap:85px;align-items:center;width:min(920px,100%);margin:auto;color:#344052;}
  .shelf-focus-art {position:relative;display:grid;place-items:center;min-width:0;padding:20px 0 35px;}
  .shelf-focus-halo {position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse,rgb(var(--shelf-tint) / .14),transparent 67%);}
  .shelf-focus-cover {position:relative;width:65%;max-width:230px;aspect-ratio:2/3;display:block;transform:rotate(-4deg);border-radius:3px 7px 7px 3px;box-shadow:0 30px 40px -24px #34425c65;overflow:hidden;}
  .shelf-focus-cover::after {content:'';position:absolute;inset:0;border:1px solid #fff9;border-radius:inherit;background:linear-gradient(90deg,#0003,transparent 3%,#fff2 4%,transparent 7%);pointer-events:none;}
  .shelf-focus-cover img {width:100%;height:100%;object-fit:cover;display:block;}
  .shelf-focus-podcast .shelf-focus-cover {aspect-ratio:1;width:85%;max-width:310px;border-radius:12px;}
  .shelf-focus-podcast .shelf-focus-cover::after {background:linear-gradient(125deg,#fff2,transparent 40%);}
  .shelf-focus-number {position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1.5px;color:#627087;font-variant-numeric:tabular-nums;}
  .shelf-focus-number i {font-style:normal;color:#c7ccd2;margin:0 8px;}
  .shelf-focus-copy {min-width:0;}
  .shelf-focus-copy h2 {font-size:clamp(32px,3.7vw,48px);line-height:1.08;letter-spacing:-1.6px;font-weight:600;margin:15px 0 12px;outline:none;overflow-wrap:anywhere;}
  .shelf-credit {font-size:11px;color:#627087;margin:0;line-height:1.5;}
  .shelf-note {font-size:13px;line-height:1.8;color:#627087;margin:24px 0 22px;max-width:390px;}
  .shelf-thread {padding:18px 0 0;border-top:1px solid #9aa7b121;}
  .shelf-thread>span {font-size:9px;color:#806849;letter-spacing:.5px;}
  .shelf-thread>p {font-size:11px;line-height:1.7;color:#627087;margin:9px 0 7px;}
  .shelf-thread>button {display:inline-flex;align-items:center;gap:10px;padding:7px 0;background:none;text-align:left;color:#63778b;font-size:11px;line-height:1.6;border-radius:4px;}
  .shelf-thread>button>span {color:#a7b1bd;}
  .shelf-focus-navigation {display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:30px;padding-top:9px;}
  .shelf-focus-navigation button {display:inline-flex;align-items:center;gap:4px;background:none;padding:7px 0;color:#627087;font-size:9px;line-height:1.5;border-radius:4px;}
  .shelf-focus-navigation button svg {width:12px;height:12px;}
  .shelf-focus-navigation button:last-child {gap:7px;}
  .showcase-game-link {display:inline-flex;width:fit-content;align-items:center;gap:8px;border-radius:18px;padding:8px 12px;margin:3px 0 12px;background:#ffffff9c;border:1px solid #fff;color:#7086a4;font-size:11px;line-height:1.5;text-decoration:none;box-shadow:0 3px 10px #35465d08;transition:transform 180ms var(--ease);}
  .showcase-game-link small {font-size:8px;color:#a1acb9;margin-left:3px;}
  .showcase-game-link:focus-visible {outline:2px solid #9bafd0;outline-offset:4px;}
  @media (hover:hover) and (pointer:fine) {
    .media-portal-shelf:hover .shelf-portal-book-front {transform:translateX(-4px) rotate(-14deg);}
    .media-portal-shelf:hover .shelf-portal-book-back {transform:translateX(4px) rotate(15deg);}
    .shelf-object:hover .shelf-object-cover,.shelf-object:focus-visible .shelf-object-cover {transform:translateY(-7px) rotate(0deg);}
    .shelf-thread>button:hover,.shelf-focus-navigation button:hover {color:#485f79;}
    .showcase-game-link:hover {transform:translateY(-2px);}
  }
  .motion-paused .shelf-object-cover,.motion-paused .shelf-portal-book,.motion-paused .showcase-game-link {transition:none;}
  @media (min-width:901px) and (max-height:820px) {
    .media-portals-four {grid-template-columns:repeat(4,minmax(0,165px));gap:28px;}
    .media-portals-four .media-portal,.media-portals-four .media-orb {width:100%;}
    .shelf-objects {gap:20px 25px;max-width:850px;}.shelf-object,.shelf-object-halo{width:140px;}.shelf-object strong{font-size:11px;}.shelf-focus{gap:70px;}.shelf-focus-cover{max-width:205px;}.shelf-note{font-size:12px;margin:20px 0;}.shelf-focus-copy h2{font-size:39px;}.shelf-focus-navigation{margin-top:21px;}
  }
  @media (max-width:900px) and (min-width:601px) {
    .media-portals-four {grid-template-columns:repeat(2,175px);gap:30px 55px;}
    .media-portals-four .media-portal,.media-portals-four .media-orb {width:175px;}
    .media-portals-four .media-portal strong {margin-top:15px;}
    .shelf-focus {gap:40px;}.shelf-focus-copy h2{font-size:35px;}.shelf-note{font-size:12px;}.shelf-objects{gap:22px 25px;}.shelf-object,.shelf-object-halo{width:145px;}
  }
  @media (max-width:600px) {
    .media-portals-four {grid-template-columns:repeat(2,132px);gap:25px 22px;}
    .media-portals-four .media-portal,.media-portals-four .media-orb {width:132px;}
    .media-portals-four .media-portal-made {grid-column:auto;justify-self:auto;}
    .media-portals-four .media-portal strong {font-size:15px;letter-spacing:-.35px;margin-top:12px;}
    .media-portals-four .media-portal>span:last-child {font-size:8px;margin-top:6px;}
    .collection-shelf .media-heading{margin-bottom:20px;}.collection-shelf .media-heading h2{max-width:290px;margin-inline:auto;}
    .shelf-filters {margin-bottom:21px;gap:2px;}.shelf-filters button{font-size:10px;padding:8px 10px;gap:6px;}.shelf-filters button span{font-size:8px;}
    .shelf-objects {gap:22px 17px;}.shelf-object,.shelf-object-halo{width:132px;}.shelf-object strong{font-size:11px;max-width:130px;}.shelf-hint{max-width:250px;margin-top:20px;font-size:9px;}.collection-shelf .media-bottom{margin-top:16px;}
    .shelf-focus {grid-template-columns:1fr;gap:29px;padding:10px 0;}.shelf-focus-art{width:100%;max-width:280px;margin:auto;padding-top:7px;padding-bottom:28px;}.shelf-focus-cover{width:57%;max-width:170px;}.shelf-focus-podcast .shelf-focus-cover{width:77%;max-width:230px;}.shelf-focus-copy{text-align:center;max-width:305px;margin:auto;}.shelf-focus-copy h2{font-size:35px;margin-top:13px;margin-bottom:12px;letter-spacing:-1.2px;}.shelf-credit{font-size:10px;}.shelf-note{font-size:12px;margin:20px 0;}.shelf-thread{padding-top:16px;}.shelf-thread>p{font-size:10px;}.shelf-thread>button{font-size:10px;text-align:center;justify-content:center;}.shelf-focus-navigation{margin-top:23px;gap:12px;}.shelf-focus-navigation button{font-size:8px;}.shelf-focus-number{font-size:8px;}.showcase-game-link{align-self:center;margin:0 auto 12px;font-size:10px;}
  }
  @media (max-width:360px) {
    .media-portals-four {grid-template-columns:repeat(2,118px);gap:24px 17px;}.media-portals-four .media-portal,.media-portals-four .media-orb{width:118px;}.media-portals-four .media-portal strong{font-size:13px;}.shelf-object,.shelf-object-halo{width:118px;}.shelf-objects{gap:19px 13px;}
  }
  @media (prefers-reduced-motion:reduce) {.shelf-object-cover,.shelf-portal-book,.showcase-game-link{transition:none;}}
}
@layer experience {
 .shelf-filters button{min-height:44px;font-size:11px;}
 .shelf-filters button span{font-size:10px;}
 .shelf-focus-copy h2{letter-spacing:-.035em;text-wrap:balance;}
 .shelf-thread>button,.shelf-focus-navigation button{min-height:44px;}
 .shelf-focus-navigation button{font-size:10px;}
 .shelf-focus-navigation button:last-child{justify-content:flex-end;text-align:right;max-width:58%;}
 .shelf-thread>span{font-size:10px;}
 .shelf-hint,.shelf-object>span:last-child{font-size:10px;}
 @media(max-width:600px){
  .media-portals-four .media-portal>span:last-child{font-size:10px;line-height:1.4;}
  .shelf-focus-navigation button{font-size:10px;}
  .shelf-thread>button{font-size:11px;}
  .shelf-credit{font-size:11px;}
 }
}

/* Natural books and square podcasts, using the same generous scale as Collection. */
.detail[data-category=music] .collection-shelf{max-width:1200px;margin:0 auto;}
.detail[data-category=music] .collection-shelf .shelf-filters{gap:5px;margin-bottom:32px;}
.detail[data-category=music] .collection-shelf .shelf-filters button{min-height:46px;padding:10px 17px;font-size:15px;border-radius:24px;}
.detail[data-category=music] .collection-shelf .shelf-filters button span{font-size:12px;}
.detail[data-category=music] .collection-shelf .shelf-objects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px clamp(22px,3.5vw,50px);width:min(1100px,100%);align-items:start;}
.detail[data-category=music] .collection-shelf .shelf-object{width:100%;min-width:0;max-width:none;}
.detail[data-category=music] .collection-shelf .shelf-object-halo{width:min(100%,210px);}
.detail[data-category=music] .collection-shelf .shelf-object-cover{width:64%;}
.detail[data-category=music] .collection-shelf .shelf-object-podcast .shelf-object-cover{width:74%;}
.detail[data-category=music] .collection-shelf .shelf-object strong{font-size:17px;line-height:1.3;max-width:100%;margin-top:15px;}
.detail[data-category=music] .collection-shelf .shelf-object>span:last-child{font-size:14px;line-height:1.4;}
.detail[data-category=music] .collection-shelf .shelf-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.detail[data-category=music] .collection-shelf>.media-bottom{display:none;}
@media(max-width:700px){
 .detail[data-category=music] .collection-shelf .shelf-filters{gap:2px;margin-bottom:24px;}
 .detail[data-category=music] .collection-shelf .shelf-filters button{font-size:14px;padding:10px 13px;}
 .detail[data-category=music] .collection-shelf .shelf-objects{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;}
 .detail[data-category=music] .collection-shelf .shelf-object-halo{width:min(100%,165px);}
 .detail[data-category=music] .collection-shelf .shelf-object strong{font-size:16px;}
 .detail[data-category=music] .collection-shelf .shelf-object>span:last-child{font-size:13px;}
}


/* polish.css */
@layer experience {
  :root { --quiet-ink:#59687b; --quiet-green:#4f6a60; --focus-ink:#557da9; }
  ::selection {color:#203b56;background:#bed9f49c;}
  input {caret-color:#5b82a9;}
  .world-stage {justify-content:safe center;scrollbar-color:#8196ac80 transparent;scrollbar-gutter:stable;}
  .inner-old {justify-content:safe center;}
  .world-stage::-webkit-scrollbar {width:5px;}
  .world-stage::-webkit-scrollbar-thumb {background:#91a5b960;border-radius:5px;}
  .header-tools {display:flex;align-items:center;gap:5px;}
  .find-button {display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:44px;min-height:44px;padding:8px 12px;border-radius:24px;background:transparent;color:var(--quiet-ink);font-size:12px;transition:background 160ms,color 160ms;}
  .find-button>svg {width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;}
  .find-button kbd {font-family:inherit;font-size:10px;padding:2px 6px;border-color:#aebdce66;color:var(--quiet-ink);}
  .find-button:hover,.find-button[aria-expanded=true] {background:#ffffffa8;color:#2a425e;}
  .keys-button {min-height:44px;color:var(--quiet-ink);}
  .keys-button kbd,.footer-keys,.footer-keys span {color:var(--quiet-ink);}
  .world-toolbar>.world-find {margin-left:auto;}
  .world-toolbar>.world-keys {margin-left:4px;}
  .world-back,.world-exit {color:var(--quiet-ink);min-height:44px;}
  .world-back {max-width:35%;}
  .breadcrumb {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .close-detail {width:44px;height:44px;flex:none;}
  .world-nav .mini-bubble {position:relative;opacity:1;}
  .world-nav .mini-bubble:not([aria-pressed=true])>svg {opacity:.7;}
  .world-nav-label {position:absolute;bottom:calc(100% + 12px);left:50%;translate:-50% 3px;opacity:0;pointer-events:none;padding:5px 9px;border-radius:9px;background:#fffdf9f0;box-shadow:0 4px 12px #30455f10;color:#41566d;font-size:10px;font-weight:500;white-space:nowrap;transition:translate 180ms var(--ease),opacity 150ms;}
  .mini-bubble:is(:hover,:focus-visible) .world-nav-label {opacity:1;translate:-50% 0;}
  .footer {bottom:max(20px,env(safe-area-inset-bottom));}
  .wander-button {display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0;background:transparent;font-size:13px;color:var(--quiet-ink);}
  .wander-button>svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:translate 180ms var(--ease);}
  .wander-button:hover>svg {translate:3px 0;}
  .wander-button:active {translate:0 1px;}
  .hint,.person>p {color:var(--quiet-ink);}
  .motion-toggle {width:44px;height:44px;color:var(--quiet-ink);}
  .chill-toggle {height:36px;color:var(--quiet-ink);}
  .chill-mode .person>p,.chill-mode .footer-note,.chill-mode .hint,.chill-mode .footer-keys,.chill-mode .footer-keys span,.chill-mode .chill-toggle {color:var(--quiet-green);}
  .chill-mode .find-button,.chill-mode .keys-button {color:var(--quiet-green);}
  .discovery {position:fixed;top:max(83px,calc(env(safe-area-inset-top) + 64px));right:max(30px,env(safe-area-inset-right));z-index:40;width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 112px);overflow:auto;padding:9px 10px 0;border:1px solid #ffffffed;border-radius:25px;background:#f7fafbf5;box-shadow:0 20px 80px -15px #304f7240,inset 0 1px 0 #fff;transform-origin:top right;scrollbar-width:thin;scrollbar-color:#91a5b960 transparent;}
  .discovery[hidden] {display:none;}
  .discovery-search {display:flex;align-items:center;gap:9px;border-bottom:1px solid #d9e1eb9c;padding:5px 5px 12px 9px;margin:0;}
  .discovery-search>svg {width:18px;height:18px;fill:none;stroke:#657991;stroke-width:1.5;flex:none;}
  .discovery-search input {min-width:0;flex:1;width:100%;height:39px;border:0;padding:3px;background:transparent;color:#273e57;font:inherit;font-size:14px;outline:none;}
  .discovery-search input::placeholder {color:#65758a;font-size:13px;}
  .discovery-search input::-webkit-search-cancel-button {display:none;}
  .discovery-close {flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:transparent;color:#5b6c82;}
  .discovery-close:hover {background:#e9eef4;}
  .discovery-close svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;}
  .discovery-intro {display:flex;flex-direction:column;gap:5px;padding:15px 10px 9px;color:#53667d;font-size:12px;}
  .discovery-intro small {color:#63758a;font-size:10px;}
  .discovery-results {display:grid;gap:2px;padding:2px 0 8px;}
  .discovery-result {display:flex;align-items:center;gap:13px;min-height:70px;border-radius:15px;padding:9px 10px;background:transparent;text-align:left;transition:background 140ms;}
  .discovery-result:is(:hover,:focus-visible,.is-selected) {background:rgb(var(--discovery-tint)/.12);}
  .discovery-art {display:grid;place-items:center;flex:none;width:45px;height:45px;}
  .discovery-art img {width:100%;height:100%;object-fit:cover;border-radius:10px;box-shadow:0 3px 9px #40576b1a;}
  .discovery-art svg {width:28px;height:28px;fill:rgb(var(--discovery-tint));}
  .discovery-result-copy {min-width:0;display:flex;flex:1;flex-direction:column;gap:5px;}
  .discovery-result strong {font-size:13px;font-weight:580;line-height:1.3;color:#2d415a;}
  .discovery-result small {font-size:10px;line-height:1.4;color:#607187;}
  .discovery-result-enter {padding:7px;color:#596f88;opacity:0;translate:-3px 3px;transition:opacity 140ms,translate 180ms var(--ease);}
  .discovery-result:is(:hover,:focus-visible,.is-selected) .discovery-result-enter {opacity:1;translate:0;}
  .discovery-empty {padding:28px 14px 31px;text-align:center;}
  .discovery-empty strong {font-size:15px;font-weight:550;color:#3c526c;}
  .discovery-empty p {margin:10px 0 12px;font-size:12px;color:#61758b;line-height:1.6;}
  .discovery-empty button {min-height:44px;padding:9px 13px;border-radius:20px;background:#e5edf5;color:#3c5771;font-size:12px;}
  .discovery-foot {position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 10px 8px;border-top:1px solid #d9e1eb9c;background:#f7fafb;}
  .discovery-foot button {min-height:44px;background:transparent;color:#415e7b;font-size:12px;white-space:nowrap;}
  .discovery-foot button>span {margin-left:5px;}
  .discovery-foot>span {display:flex;gap:3px;align-items:center;color:#61758b;font-size:9px;}
  .discovery-foot kbd {font-family:inherit;font-size:9px;color:#4f6883;}
  .mood-matrix .header-tools,.mood-matrix .wander-button {color:#9fac9f;}
  .mood-matrix .find-button {color:#9ab6a6;}
  .mood-matrix .find-button:is(:hover,[aria-expanded=true]) {background:#e4fff010;color:#c6dfd0;}
  .world-exit,.world-back,.discovery-result small,.discovery-intro small,.discovery-foot>span {font-size:11px;}
  .header-tools kbd,.world-toolbar kbd,.world-exit kbd,.chill-toggle kbd,.discovery kbd {font-size:11px;color:#59687b;opacity:1;}
  .chill-toggle {font-size:11px;}
  @media(max-width:600px){
    .header-tools {gap:0;}
    .header-tools .find-button {padding:8px;width:44px;}
    .header-tools .find-button>span,.header-tools .find-button>kbd,.header-tools .keys-button>span {display:none;}
    .header-tools .keys-button {padding:8px;width:44px;}
    .world-toolbar>.world-keys {font-size:0;gap:0;margin:0;padding:7px;width:38px;min-width:38px;}
    .world-toolbar>.world-find {padding:7px;width:38px;min-width:38px;}
    .world-category {left:45%;}
    .world-back {max-width:31%;font-size:11px;}
    .world-back .breadcrumb {max-width:85px;}
    .close-detail {width:40px;height:44px;}
    .wander-button {font-size:11px;gap:6px;}
    .wander-button svg {width:14px;height:14px;}
    .footer {bottom:max(13px,env(safe-area-inset-bottom));}
    .discovery {right:16px;top:max(78px,calc(env(safe-area-inset-top) + 58px));max-height:calc(100dvh - 98px);border-radius:22px;}
    .discovery-foot>span {font-size:0;gap:2px;}
    .discovery-foot>span kbd {font-size:11px;}
    .discovery-result {min-height:70px;}
    .chill-toggle {min-height:36px;}
  }
  .motion-paused .discovery-result,.motion-paused .discovery-result-enter,.motion-paused .world-nav-label,.motion-paused .wander-button>svg {transition:none;}
  @media(prefers-reduced-motion:reduce){.discovery-result,.discovery-result-enter,.world-nav-label,.wander-button>svg {transition:none;}}
}
@layer accessibility {
  :is(.find-button,.wander-button,.discovery button):focus-visible {outline:2px solid #577fa9;outline-offset:3px;}
  .discovery-search:focus-within {box-shadow:0 2px 0 -1px #5a7fa5;}
  .discovery-search input:focus-visible {outline:none;box-shadow:none;}
}


/* world-detail-polish.css */
@layer experience {
  /* The same readable, quiet detail rhythm across the small worlds. */
  .showcase-copy h2 {margin-top:0;letter-spacing:-.035em;}
  .showcase-copy>p {color:#53667c;}
  .showcase-instruction,.showcase-subtle-back {color:#5d7086;}
  .showcase-story summary {font-size:12px;color:#5d7086;min-height:32px;}
  .showcase-story p {font-size:12px;color:#53667c;}
  .showcase-story-meta {font-size:10px;color:#607187;line-height:1.6;}
  .showcase-focus {row-gap:35px;}
  .showcase-focus button:focus-visible,.showcase-story summary:focus-visible {outline:2px solid #668ba6;outline-offset:4px;}
  .showcase-threads {grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px 30px;border-top:1px solid #7890a525;padding-top:20px;margin-top:3px;}
  .showcase-thread {display:flex;align-items:center;gap:12px;text-align:left;background:none;color:#425970;padding:5px 0;max-width:100%;}
  .showcase-thread-art {width:43px;height:43px;flex:none;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#ffffff80;box-shadow:0 5px 11px #344c6510;transition:transform 220ms var(--ease);}
  .showcase-thread-art img {width:100%;height:100%;object-fit:cover;display:block;}
  .showcase-thread>span:nth-child(2) {display:flex;flex-direction:column;gap:4px;min-width:0;}
  .showcase-thread>span:nth-child(2)>span {font-size:10px;line-height:1.4;color:#5c7086;}
  .showcase-thread strong {font-size:12px;line-height:1.4;font-weight:550;}
  .showcase-thread>svg {width:19px;height:19px;margin-left:8px;flex:none;color:#698096;transition:transform 220ms var(--ease);}

  .showcase-zazu-word {letter-spacing:-.065em;}
  .showcase-zazu-emblem {width:88px;height:88px;right:5%;top:0;transition:transform 440ms var(--ease);}
  .showcase-zazu-emblem svg {display:block;width:100%;height:100%;overflow:visible;}
  .showcase-zazu-emblem rect {transform-origin:50px 50px;transition:scale 440ms var(--ease),opacity 280ms var(--ease);}
  .showcase-zazu[data-zazu-phase=ideas] .showcase-zazu-emblem rect:nth-child(even) {scale:.7 1;opacity:.55;}
  .showcase-zazu[data-zazu-phase=people] .showcase-zazu-emblem {transform:rotate(22.5deg) scale(1.13);}
  .showcase-zazu[data-zazu-phase=people] .showcase-zazu-emblem rect {scale:1 .8;}
  .showcase-zazu[data-zazu-phase=making] .showcase-zazu-emblem {transform:rotate(135deg) scale(.92);}
  .showcase-zazu[data-zazu-phase=making] .showcase-zazu-emblem rect:nth-child(2n) {scale:1 1.2;}
  .showcase-zazu-caption {color:#786244;font-size:12px;}
  .showcase-zazu-words button {min-height:40px;color:#786244;}
  .showcase-zazu-words button[aria-pressed=true] {color:#654f32;}

  .showcase-word>header>span {font-size:10px;color:#68694f;}
  .showcase-word-rack {gap:6px;}
  .showcase-word-rack>button {display:grid;place-items:center;width:34px;height:39px;border-radius:5px;background:#e9dba9;color:#574b29;box-shadow:0 3px 0 #b9aa7b;font-size:15px;font-weight:580;padding:0;transition:transform 160ms var(--ease),opacity 160ms;}
  .showcase-word-rack>button[aria-pressed=true] {opacity:.28;box-shadow:none;transform:translateY(3px);}
  .showcase-word-compose {display:flex;justify-content:center;align-items:center;gap:12px;min-height:41px;margin-top:13px;}
  .showcase-word-preview {font-size:16px;letter-spacing:.12em;line-height:1.4;color:#5d5b38;font-weight:570;}
  .showcase-word-preview[data-empty=true] {font-size:11px;letter-spacing:0;font-weight:400;color:#707155;}
  .showcase-word-compose>button {font-size:11px;background:none;color:#636b47;min-height:36px;padding:6px;}
  .showcase-word-compose>button:disabled {opacity:.35;cursor:default;}
  .showcase-word-controls {margin-top:8px;gap:7px;flex-wrap:wrap;}
  .showcase-word-controls button {font-size:11px;min-height:39px;color:#4f5f36;padding:10px 13px;}
  .showcase-word-controls button:nth-child(2) {background:transparent;}
  .showcase-word-controls button:last-child {font-size:20px;color:#62714b;min-width:39px;justify-content:center;}
  .showcase-word-controls button:disabled {opacity:.36;}
  .showcase-word[data-word-state=ready] [data-word-place] {background:#d8e5ba;color:#405525;}
  .showcase-word[data-word-state=placed] .showcase-word-preview {color:#537344;}
  .showcase-word-status {font-size:11px;line-height:1.65;color:#686c4e;min-height:37px;margin-top:12px;}

  .showcase-song>header>small {font-size:10px;color:#765d84;}
  .showcase-song-themes {gap:5px;flex-wrap:wrap;}
  .showcase-song-themes button {font-size:10px;min-height:36px;color:#795f86;padding:8px 10px;}
  .showcase-song-themes button[aria-pressed=true] {background:#e8ddec;color:#654473;}
  .showcase-song>h3 {color:#604c6b;}
  .showcase-song-card {gap:11px;padding:10px 11px;}
  .showcase-song-card>button:first-child {width:37px;height:37px;color:#6d4a80;font-size:12px;}
  .showcase-song-card>button[aria-pressed=true] {background:#715182;color:#fff;}
  .showcase-song-card>span {gap:3px;}
  .showcase-song-card strong {font-size:12px;color:#614b6d;}
  .showcase-song-card small {font-size:10px;line-height:1.4;color:#796585;}
  .showcase-song-card>button:last-child {font-size:10px;min-height:35px;min-width:43px;color:#704f80;justify-content:center;}
  .showcase-song-card>button.is-voted {color:#593a6c;background:#decce7;}
  .showcase-song-person {font-size:10px;line-height:1.5;color:#71557e;font-weight:550;margin-top:3px;}
  .showcase-song-reveal {display:flex;justify-content:flex-end;margin-top:12px;}
  .showcase-song-reveal:has(>button[hidden]+button[hidden]) {display:none;}
  .showcase-song-reveal>button {display:flex;align-items:center;gap:15px;font-size:11px;color:#654473;background:#e5d7ec;border-radius:20px;padding:11px 15px;min-height:40px;}
  .showcase-song-reveal>button[hidden],.showcase-song-person[hidden] {display:none;}
  .showcase-song-status {font-size:11px;color:#735b81;min-height:37px;margin-top:15px;}
  .showcase-song .showcase-contained-note {font-size:9px;line-height:1.6;color:#796786;}

  .showcase-reader-page {display:grid;padding:23px 27px 0;min-height:257px;overflow:hidden;}
  .showcase-reader-sheet {grid-area:1/1;min-width:0;}
  .showcase-reader-sheet>span {display:block;font-size:10px;line-height:1.5;color:#7b7054;}
  .showcase-reader-sheet>h3 {font-size:26px;line-height:1.2;font-weight:560;letter-spacing:-.03em;margin-top:13px;max-width:360px;color:#615c49;}
  .showcase-reader-sheet>p {font-size:13px;line-height:1.75;color:#756c56;margin-top:15px;max-width:48ch;}
  .showcase-reader>footer {padding:16px 27px;gap:20px;}
  .showcase-reader>footer button {width:39px;height:39px;flex:none;color:#7c6e50;}
  .showcase-page-position {display:flex;align-items:center;flex-direction:column;gap:8px;width:72px;}
  .showcase-page-count {font-size:11px;color:#7c7056;letter-spacing:.08em;font-variant-numeric:tabular-nums;}
  .showcase-page-track {width:100%;height:2px;background:#dad2c1;overflow:hidden;border-radius:2px;}
  .showcase-page-track i {display:block;width:100%;height:100%;background:#9d8b62;transform:scaleX(0);transform-origin:left;transition:transform 320ms var(--ease);}
  .showcase-reader-kind {font-size:9px;line-height:1.6;color:#7f735c;padding-bottom:18px;}

  /* Keep the sample app interfaces legible at their actual compact size. */
  .showcase-quay-search input {font-size:12px;caret-color:#496c81;}
  .showcase-quay-search input::placeholder {color:#667e8d;}
  .showcase-quay-search:focus-within {outline:2px solid #7499af;outline-offset:2px;}
  .showcase-quay-tabs button {font-size:10px;min-height:33px;color:#60798a;}
  .showcase-activity small {font-size:10px;color:#60798a;}
  .showcase-quay-detail p,.showcase-quay-caption,.showcase-quay-empty {color:#5e7686;}
  .showcase-quay-detail p {font-size:11px;}
  .showcase-quay-caption {font-size:9px;}
  .showcase-light-scenes button {font-size:10px;color:#596c62;}
  .showcase-koop-menu header span,.showcase-preview-note {color:#66786b;}
  .showcase-preview-note {font-size:9px;}
  .showcase-match-status {color:#5c735f;font-size:11px;}
  .showcase-contained-note {font-size:9px;color:#637686;line-height:1.5;}

  @media (hover:hover) and (pointer:fine) {
    .showcase-thread:hover .showcase-thread-art {transform:translateY(-3px) rotate(-4deg);}
    .showcase-thread:hover>svg {transform:translateX(3px);}
    .showcase-word-rack>button:not(:disabled):hover {transform:translateY(-3px);}
    .showcase-song-card>button:first-child:hover {background:#decee7;}
  }
  @media (max-width:800px) {
    .showcase-copy h2 {margin-top:0;}
    .showcase-story p {font-size:12px;}
    .showcase-story-meta {font-size:10px;}
    .showcase-threads {justify-content:center;gap:16px 27px;padding-top:22px;}
    .showcase-thread {text-align:left;}
    .showcase-reader-page {min-height:246px;}
  }
  @media (max-width:550px) {
    .showcase-focus {row-gap:25px;}
    .showcase-copy>p {font-size:13px;}
    .showcase-story summary {min-height:40px;font-size:12px;}
    .showcase-copy .showcase-instruction {font-size:12px;}
    .showcase-subtle-back {font-size:12px;min-height:40px;}
    .showcase-threads {justify-content:flex-start;gap:12px;padding-top:16px;}
    .showcase-thread {width:100%;min-height:53px;}
    .showcase-thread>svg {margin-left:auto;}
    .showcase-thread>span:nth-child(2)>span {font-size:11px;}
    .showcase-thread strong {font-size:13px;}
    .showcase-zazu-emblem {width:70px;height:70px;}
    .showcase-word-rack>button {width:33px;height:42px;font-size:15px;}
    .showcase-word-compose {min-height:43px;}
    .showcase-word-controls button {min-height:43px;font-size:11px;}
    .showcase-word>header>span {font-size:10px;}
    .showcase-word-status {font-size:11px;}
    .showcase-song-themes button {font-size:10px;padding:8px;min-height:40px;}
    .showcase-song-card {gap:8px;padding:10px 8px;}
    .showcase-song-card>button:first-child {width:40px;height:40px;}
    .showcase-song-card>button:last-child {font-size:10px;padding:7px;min-height:40px;}
    .showcase-song-card strong {font-size:11px;}
    .showcase-song-card small,.showcase-song-person {font-size:10px;}
    .showcase-song>header>small {font-size:10px;}
    .showcase-song-status {font-size:11px;}
    .showcase-song .showcase-contained-note {font-size:9px;}
    .showcase-reader-page {min-height:285px;padding:22px 22px 0;}
    .showcase-reader-sheet>h3 {font-size:25px;}
    .showcase-reader-sheet>p {font-size:13px;line-height:1.75;}
    .showcase-reader>footer {padding:16px 22px;}
    .showcase-reader>footer button {width:43px;height:43px;}
    .showcase-reader-kind {font-size:9px;}
  }
  @media (max-width:360px) {
    .showcase-word-rack {gap:4px;}
    .showcase-word-rack>button {width:30px;}
    .showcase-song-themes button {font-size:9px;}
    .showcase-song-card strong {font-size:10px;}
    .showcase-reader-page {min-height:320px;}
  }
  .motion-paused .showcase-thread-art,.motion-paused .showcase-thread>svg,.motion-paused .showcase-zazu-emblem,.motion-paused .showcase-zazu-emblem rect,.motion-paused .showcase-word-rack>button,.motion-paused .showcase-page-track i {transition:none;}
  .showcase-thread>span:nth-child(2)>span,.showcase-story-meta,.showcase-song-themes button,.showcase-song-card small,.showcase-song-card>button:last-child,.showcase-song-person,.showcase-contained-note,.showcase-song .showcase-contained-note,.showcase-reader-kind {font-size:11px;}
  .media-portals-four .media-portal>span:last-child,.shelf-hint,.shelf-object>span:last-child,.shelf-filters button span,.shelf-focus-navigation button,.shelf-thread>span {font-size:11px;}
  @media (prefers-reduced-motion:reduce) {
    .showcase-thread-art,.showcase-thread>svg,.showcase-zazu-emblem,.showcase-zazu-emblem rect,.showcase-word-rack>button,.showcase-page-track i {transition:none;}
  }
}


/* bubble-optics.css */
@layer experience {
  .bubble-optics {position:absolute;inset:0;border-radius:50%;pointer-events:none;z-index:2;}
  .optic-membrane {position:absolute;inset:1px;border:1px solid #ffffffa3;border-radius:50%;opacity:.42;transform:scale(1);transform-origin:center;transition:opacity 180ms var(--ease);}
  .optic-sheen {position:absolute;left:15%;top:11%;width:28%;height:13%;border-radius:50%;background:linear-gradient(160deg,#ffffffd6,#ffffff08);transform:rotate(-35deg);opacity:0;transition:opacity 180ms var(--ease),transform 180ms var(--ease);}
  .optic-window {position:absolute;inset:5%;border-radius:50%;background:linear-gradient(112deg,transparent 12%,#ffffffa6 13%,#ffffff29 21%,transparent 22% 27%,#ffffff73 28%,#ffffff0d 41%,transparent 42%),radial-gradient(ellipse at 74% 81%,rgb(var(--tint)/.35),transparent 43%);opacity:0;transform:rotate(-14deg);transition:opacity 180ms var(--ease);pointer-events:none;}
  .bubble-optics.is-lit .optic-window {opacity:.46;}
  .bubble-optics.is-held .optic-window {opacity:.62;}
  .optic-echo {position:absolute;inset:0;border:1px solid rgb(var(--tint)/.65);border-radius:50%;opacity:0;transform:scale(1);transform-origin:center;}
  .bubble-optics.is-lit .optic-sheen {opacity:.7;}
  .bubble-optics.is-held .optic-membrane {opacity:.85;}
  .bubble-optics.is-held .optic-sheen {transition:opacity 140ms;}
  .bubble-optics.is-held .optic-membrane {transition:opacity 140ms;}
  .mood-matrix .optic-membrane {border-color:#b4edca70;}
  .mood-matrix .optic-sheen {background:linear-gradient(160deg,#bcf1d8b0,#bcf1d808);}
  .finding .bubble-optics,.detail-open .bubble-optics {opacity:0;}
  .motion-paused .bubble-optics {display:none;}
  .bubble-reset {width:44px;height:44px;}
  #keyboard-guide {max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#91a5b960 transparent;}
  @media(prefers-reduced-motion:reduce){.bubble-optics {display:none;}}
  @media(forced-colors:active){.bubble-optics {display:none;}}
}


/* scene-performance-v29.css */
/* A quiet edge reflection, confined to the object receiving input. */
.performance-rim{position:absolute;inset:0;border-radius:50%;pointer-events:none;z-index:4;opacity:0;background:conic-gradient(from -18deg,transparent 0 29%,#fff9 36%,transparent 44% 81%,#fff6 86%,transparent 93%);mask:radial-gradient(circle,transparent calc(70% - 1.5px),#000 70%,transparent 71%);transform-origin:center}
.detail-open .performance-rim,.chill-mode .performance-rim,.finding .performance-rim,.motion-paused .performance-rim{display:none}
@media(prefers-reduced-motion:reduce){.performance-rim{display:none!important}}
@media(forced-colors:active){.performance-rim{display:none}}


/* project-demos.css */
/* Three contained product samples. No ambient animation or backdrop-filter. */
.project-demo {--pd-ink:#34434a;--pd-muted:#6a777d;--pd-line:#dce2df;--pd-accent:#4d7c72;color:var(--pd-ink);font-family:inherit;font-size:12px;line-height:1.45;border:1px solid #fff;border-radius:19px;background:#fafbf9;box-shadow:0 24px 55px #384a4012,0 3px 10px #384a4007;overflow:hidden;text-align:left;isolation:isolate;}
.project-demo * {box-sizing:border-box;}
.project-demo button,.project-demo input,.project-demo summary {font:inherit;}
.project-demo button {border:0;cursor:pointer;touch-action:manipulation;}
.project-demo button:focus-visible,.project-demo input:focus-visible,.project-demo summary:focus-visible {outline:2px solid #5b8d83;outline-offset:-3px;}
.project-demo svg {display:block;width:18px;height:18px;flex-shrink:0;}
.project-demo strong {font-weight:580;}
.project-demo [hidden] {display:none!important;}
.pd-titlebar {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:10px 18px;border-bottom:1px solid var(--pd-line);background:linear-gradient(#fff9,#f2f5f280);}
.pd-titlebar>span {display:flex;align-items:center;gap:9px;}
.pd-titlebar strong {font-size:14px;letter-spacing:-.2px;}
.pd-titlebar small {font-size:10px;color:var(--pd-muted);text-align:right;}
.pd-brand-mark {display:flex;align-items:center;justify-content:center;gap:2px;width:27px;height:27px;border-radius:7px;background:#dfe9e7;color:#436e65;}
.pd-brand-mark img {display:block;width:100%;height:100%;object-fit:contain;border-radius:7px;}
.pd-sample-note {margin:0;padding:11px 18px 13px;text-align:center;font-size:10px;color:#718078;border-top:1px solid #e5e9e4;}
.pd-segments {display:flex;align-items:center;gap:3px;}
.pd-segments button {min-height:44px;min-width:64px;padding:0 12px;border-radius:7px;background:none;color:var(--pd-muted);font-size:11px;}
.pd-segments button[aria-pressed=true] {background:#e7eeeb;color:#345e53;}
.pd-tone-blue {background:#e2ebf1!important;color:#5b7e93!important;}
.pd-tone-green {background:#dfe9df!important;color:#5a7c60!important;}
.pd-tone-amber {background:#f3e7ce!important;color:#967542!important;}
.pd-tone-rose {background:#eee0df!important;color:#916665!important;}
.pd-tone-grey {background:#e9eceb!important;color:#7b8581!important;}
.pd-quay-search {display:flex;align-items:center;min-height:44px;margin:14px 15px 8px;border:1px solid #d9e2e3;border-radius:9px;background:#fff;}
.pd-quay-search label {display:flex;align-items:center;gap:9px;flex:1;min-width:0;min-height:44px;padding-left:11px;}
.pd-quay-search svg {width:16px;height:16px;color:#87969c;}
.pd-quay-search input {min-width:0;width:100%;height:44px;padding:0;border:0;outline:0;background:none;color:var(--pd-ink);font-size:11px;}
.pd-quay-search input::placeholder {color:#7b898e;}
.pd-quay-search input::-webkit-search-cancel-button {display:none;}
.pd-quay-search>button {width:44px;min-height:44px;border-radius:8px;background:none;color:#73858a;font-size:20px;}
.pd-quay-search kbd {padding:0 11px 0 8px;color:#8e9a9d;font-size:9px;white-space:nowrap;}
.pd-quaydeck>.pd-segments {margin:0 15px 8px;padding:2px;background:#f1f4f1;border-radius:9px;}
.pd-quaydeck>.pd-segments button {flex:1;min-height:44px;}
.pd-quaydeck>.pd-segments button[aria-pressed=true] {background:#fff;box-shadow:0 1px 3px #364a3b0a;}
.pd-quay-list {height:238px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 13px 5px;}
.pd-project-group h3 {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:5px 8px 2px;min-height:23px;font-size:10px;font-weight:600;color:#75837e;}
.pd-project-group h3>span {font-size:9px;font-weight:400;color:#8e9b95;}
.pd-activity {display:flex;align-items:center;gap:10px;width:100%;min-height:54px;padding:8px;border-radius:8px;background:none;text-align:left;border:1px solid transparent!important;color:var(--pd-ink);}
.pd-activity[aria-pressed=true] {background:#e5eeeb;border-color:#d4e2dc!important;}
.pd-project-monogram {display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;font-size:12px;font-weight:600;border-radius:7px;}
.pd-activity-name {display:flex;flex-direction:column;min-width:0;gap:2px;}
.pd-activity-name>strong {font-size:11px;}
.pd-activity-name>small {font-size:10px;color:#71817e;}
.pd-activity-role {display:flex;align-items:center;gap:7px;margin-left:auto;font-size:10px;color:#768580;}
.pd-activity-role svg {width:12px;height:12px;color:#8f9e97;}
.pd-quay-inspector {min-height:157px;margin:0 15px;border-top:1px solid var(--pd-line);padding-top:13px;}
.pd-inspector-heading {display:flex;align-items:flex-start;gap:9px;}
.pd-role-icon {display:grid;place-items:center;width:26px;height:27px;border-radius:6px;background:#e8eeeb;color:#6c8b80;flex-shrink:0;}
.pd-role-icon svg {width:16px;height:16px;}
.pd-inspector-heading>div {display:flex;flex-direction:column;gap:3px;flex:1;}
.pd-inspector-heading strong {font-size:11px;}
.pd-inspector-heading>div>span {font-size:10px;color:#6c7a75;}
.pd-inspector-heading>small {font-size:9px;color:#85928d;}
.pd-quay-inspector dl {margin:10px 0 1px;}
.pd-quay-inspector dl>div {display:flex;gap:10px;line-height:1.5;margin-top:4px;font-size:10px;}
.pd-quay-inspector dt {min-width:49px;color:#839088;}
.pd-quay-inspector dd {margin:0;color:#5c6c63;}
.pd-evidence {margin-top:1px;}
.pd-evidence summary {display:flex;align-items:center;gap:7px;min-height:44px;list-style:none;cursor:pointer;color:#697d71;font-size:10px;}
.pd-evidence summary::-webkit-details-marker {display:none;}
.pd-evidence summary>span {font-size:14px;}
.pd-evidence[open] summary>span {transform:rotate(45deg);}
.pd-evidence p {margin:0 0 11px;font-size:10px;line-height:1.8;color:#758278;}
.pd-quay-no-selection {display:flex;flex-direction:column;justify-content:center;min-height:133px;padding:12px 3px;}
.pd-quay-no-selection strong {font-size:12px;}
.pd-quay-no-selection p {margin:6px 0 0;line-height:1.65;font-size:11px;color:#758278;}
.pd-quay-foot {display:flex;justify-content:space-between;gap:10px;margin:0 18px 10px;font-size:10px;color:#64756a;}
.pd-menubar {display:flex;align-items:center;gap:8px;min-height:34px;padding:0 17px;background:#e7ece7;color:#6c796e;font-size:9px;border-bottom:1px solid #dce3da;}
.pd-menubar-clock {margin-right:auto;white-space:nowrap;}
.pd-menubar-fixture {text-align:right;}
.pd-menubar>svg {width:12px;height:12px;}
.pd-match-clubs {display:flex;gap:5px;padding:12px 16px 5px;}
.pd-match-clubs button {display:flex;align-items:center;gap:7px;min-height:44px;padding:0 12px 0 8px;background:none;border-radius:9px;color:#748074;font-size:11px;}
.pd-match-clubs button[aria-pressed=true] {background:#e7eee3;color:#476345;}
.pd-club-dot {display:grid;place-items:center;width:23px;height:23px;border-radius:50%;font-size:9px;font-weight:600;}
.pd-match-fixtures {display:flex;gap:8px;padding:6px 16px 13px;}
.pd-match-fixtures button {flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:57px;padding:8px 10px;text-align:left;background:#f0f3ed;color:#657560;border:1px solid transparent!important;border-radius:9px;}
.pd-match-fixtures button[aria-pressed=true] {background:#fff;border-color:#c8d6c0!important;}
.pd-match-fixtures button>span {font-size:9px;}
.pd-match-fixtures button small {font-size:8px;color:#85947c;margin-left:3px;}
.pd-match-fixtures button strong {font-size:11px;font-weight:550;}
.pd-match-main {margin:0 16px;}
.pd-fixture-meta {display:flex;align-items:center;justify-content:space-between;gap:8px;color:#63755a;font-size:10px;}
.pd-fixture-meta>span:last-child {display:flex;align-items:center;gap:4px;color:#6c8160;}
.pd-fixture-meta svg {width:12px;height:12px;}
.pd-fixture-teams {display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:17px 4px 18px;}
.pd-fixture-teams>div {display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;}
.pd-fixture-teams strong {font-size:12px;font-weight:570;}
.pd-club-crest {display:grid;place-items:center;width:45px;height:48px;border-radius:10px 10px 17px 17px;font-size:21px;font-family:Georgia,serif;font-weight:600;border:2px solid #fff;box-shadow:0 4px 9px #2948300a;}
.pd-fixture-score {font-size:30px;font-weight:550;letter-spacing:-1px;font-variant-numeric:tabular-nums;white-space:nowrap;color:#41523c;}
.pd-fixture-score.is-shielded {color:#93a187;letter-spacing:1px;font-size:25px;}
.pd-match-timeline {min-height:117px;border-top:1px solid #e3e8de;border-bottom:1px solid #e3e8de;padding:8px 0;}
.pd-match-timeline>div {display:flex;align-items:center;min-height:32px;gap:12px;padding:2px 8px;}
.pd-match-timeline time {min-width:25px;color:#829075;font-size:10px;}
.pd-match-timeline>div>span {display:flex;align-items:center;gap:10px;flex:1;}
.pd-match-timeline strong {font-size:10px;font-weight:550;}
.pd-match-timeline small {font-size:10px;color:#68785f;}
.pd-match-timeline>div>i {width:4px;height:4px;border-radius:50%;background:#93a882;}
.pd-timeline-lock {display:flex;align-items:center;justify-content:center;gap:11px;min-height:99px;color:#6a815c;}
.pd-timeline-lock>svg {width:25px;height:25px;opacity:.7;}
.pd-timeline-lock>span {display:flex;flex-direction:column;gap:6px;}
.pd-timeline-lock strong {font-size:11px;}
.pd-timeline-lock small {font-size:10px;}
.pd-match-actions {display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:12px 16px 0;}
.pd-match-actions button {display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:6px 4px;border-radius:8px;background:#f0f3ed;color:#7d8b73;font-size:10px;}
.pd-match-actions button[aria-pressed=true] {background:#e0ebd9;color:#527046;}
.pd-match-actions svg {width:15px;height:15px;}
.pd-match-status {display:flex;align-items:center;min-height:59px;margin:0;padding:10px 19px;color:#6d7c65;font-size:10px;line-height:1.7;}
.pd-spoor {--pd-accent:#b87865;--pd-line:#e6e0db;background:#fbfaf7;}
.pd-spoor-session {display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid #e9e4dd;}
.pd-record-seal {height:32px;width:32px;border-radius:50%;border:1px solid #ddc1b5;box-shadow:inset 0 0 0 7px #f4e4dc;background:#bd7d67;flex-shrink:0;}
.pd-spoor-session>div {display:flex;flex-direction:column;gap:3px;}
.pd-spoor-session strong {font-size:12px;}
.pd-spoor-session>div>span {font-size:10px;color:#7f6c5b;}
.pd-session-sample {margin-left:auto;font-size:9px;letter-spacing:.7px;color:#8a6a54;border:1px solid #e8d9cc;border-radius:4px;padding:3px 5px;}
.pd-spoor-body {display:grid;grid-template-columns:142px minmax(0,1fr);min-height:340px;}
.pd-spoor-timeline {padding:14px 8px 10px 11px;border-right:1px solid #e8e1d8;}
.pd-spoor-timeline button {position:relative;display:flex;align-items:center;gap:8px;width:100%;min-height:58px;padding:8px 7px;background:none;text-align:left;border-radius:8px;color:#8b8277;}
.pd-spoor-timeline button[aria-pressed=true] {background:#f0e6dd;color:#9c6d55;}
.pd-event-icon {display:grid;place-items:center;width:26px;height:28px;background:#efebe5;border:1px solid #e6dfd5;border-radius:7px;flex-shrink:0;}
.pd-event-icon svg {width:14px;height:14px;}
.pd-spoor-timeline button[aria-pressed=true] .pd-event-icon {border-color:#dbc1ab;background:#fbf1e6;}
.pd-spoor-timeline button>span:nth-child(2) {display:flex;flex-direction:column;gap:2px;}
.pd-spoor-timeline time {font-size:10px;font-variant-numeric:tabular-nums;}
.pd-spoor-timeline strong {font-size:11px;font-weight:550;}
.pd-moment-tick {position:absolute;top:calc(100% - 3px);left:20px;width:1px;height:7px;background:#d9cfc1;}
.pd-spoor-timeline button:last-child .pd-moment-tick {display:none;}
.pd-spoor-view {min-width:0;padding:12px 16px 14px;}
.pd-spoor-view>.pd-segments {border-bottom:1px solid #e9e0d6;gap:5px;padding-bottom:8px;margin-bottom:15px;}
.pd-spoor-view>.pd-segments button {min-width:0;min-height:44px;padding:0 10px;font-size:10px;white-space:nowrap;}
.pd-spoor-view>.pd-segments button[aria-pressed=true] {background:#f0e7dd;color:#956b50;}
.pd-spoor-detail {position:relative;min-height:255px;padding-bottom:26px;}
.pd-moment-heading>span {font-size:10px;color:#866b54;}
.pd-moment-heading i {font-style:normal;margin:0 4px;}
.pd-moment-heading h3 {font-size:15px;letter-spacing:-.3px;line-height:1.3;font-weight:550;margin:7px 0 20px;color:#625345;}
.pd-speaker {display:flex;align-items:center;gap:7px;color:#85664d;font-size:11px;margin-bottom:8px;}
.pd-speaker i {width:6px;height:6px;border-radius:50%;background:#bf8e73;}
.pd-spoor blockquote {font-family:Georgia,serif;font-size:21px;line-height:1.5;letter-spacing:-.3px;color:#67513f;margin:0;}
.pd-transcript-note,.pd-context-note {font-size:11px;color:#806d59;line-height:1.8;margin:15px 0 0;}
.pd-moment-source {position:absolute;bottom:0;left:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;color:#89725a;overflow-wrap:anywhere;}
.pd-screen-preview {border-radius:9px;background:#f8faf7;border:1px solid #e2e2d9;overflow:hidden;margin-top:-7px;padding-bottom:8px;}
.pd-screen-title {display:flex;align-items:center;gap:11px;background:#edf0e9;padding:8px;color:#8c9b8c;font-size:8px;border-bottom:1px solid #e2e5dc;}
.pd-screen-title>span {letter-spacing:1px;font-size:5px;opacity:.7;}
.pd-screen-title strong {font-size:9px;font-weight:550;}
.pd-screen-search {position:relative;display:flex;align-items:center;gap:6px;margin:9px 9px 7px;padding:7px 8px;border:1px solid #e0e4da;border-radius:5px;background:#fff;color:#9ba69b;font-size:8px;}
.pd-screen-search>svg {width:11px;height:11px;}
.pd-screen-search.is-pointed {outline:2px solid #ba80646b;outline-offset:1px;}
.pd-sample-pointer {position:absolute;right:18px;top:14px;color:#a06c50;transform:rotate(-10deg);}
.pd-sample-pointer svg {width:18px;height:18px;fill:#faeee0;}
.pd-screen-row {display:flex;align-items:center;gap:7px;margin:2px 7px;border-radius:5px;padding:7px;color:#7b8e7a;font-size:9px;}
.pd-screen-row.is-selected {background:#e3ecdf;}
.pd-screen-row .pd-project-monogram {width:22px;height:22px;border-radius:5px;font-size:9px;}
.pd-screen-row>span:last-child {display:flex;flex-direction:column;gap:2px;}
.pd-screen-row small {font-size:7px;color:#a0ac9b;}
.pd-screen-synthetic {display:block;font-size:7px;color:#a3aa9b;margin:8px 12px 0;}
.pd-context-note {margin-top:9px;font-size:10px;}
.pd-no-speech {display:flex;flex-direction:column;align-items:flex-start;color:#927d65;}
.pd-no-speech>svg {width:27px;height:27px;margin:0 0 12px;color:#bc9d80;}
.pd-no-speech strong {font-size:12px;font-weight:550;color:#79644f;}
.pd-no-speech p {font-size:11px;line-height:1.8;margin:7px 0;color:#806b55;}
.pd-no-speech button {display:flex;align-items:center;gap:8px;min-height:44px;padding:7px 0;background:none;color:#876140;font-size:11px;}
.pd-no-speech button svg {width:12px;height:12px;}
.pd-file-name {font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;margin-top:10px;color:#a78666;}
.pd-pack-files {border-top:1px solid #e8dfd4;}
.pd-pack-files summary {display:flex;align-items:center;gap:8px;min-height:46px;padding:9px 17px;color:#85664a;font-size:11px;cursor:pointer;list-style:none;}
.pd-pack-files summary::-webkit-details-marker {display:none;}
.pd-pack-files summary>svg {width:15px;height:15px;}
.pd-pack-files summary>span {margin-left:auto;font-size:15px;}
.pd-pack-files[open] summary>span {transform:rotate(45deg);}
.pd-pack-files>div {display:grid;grid-template-columns:auto 1fr;gap:6px 20px;padding:0 18px 14px;font-size:10px;color:#826b52;}
.pd-pack-files code {font-size:10px;color:#8c6643;}
.pd-pack-files p {grid-column:1/-1;margin:6px 0 0;font-size:10px;color:#86725b;}
.pd-pack-preview {display:flex;flex-direction:column;align-items:flex-start;color:#aa8b6b;margin-top:-6px;}
.pd-pack-preview>svg {width:29px;height:29px;margin-bottom:8px;}
.pd-pack-preview>strong {font-size:12px;color:#8d7359;}
.pd-pack-preview>span {font-size:9px;margin:3px 0 9px;color:#a99b88;}
.pd-pack-preview>code {font-size:9px;line-height:1.8;color:#9d8061;}
.pd-spoor>.pd-sample-note {color:#806c55;border-color:#e8dfd4;}
@media (hover:hover) and (pointer:fine) {
  .pd-activity:not([aria-pressed=true]):hover,.pd-segments button:not([aria-pressed=true]):hover,.pd-match-clubs button:not([aria-pressed=true]):hover {background:#edf2ed;}
  .pd-match-actions button:not([aria-pressed=true]):hover {background:#e7eee1;}
  .pd-spoor-timeline button:not([aria-pressed=true]):hover {background:#f4eee6;}
}
@media (max-width:560px) {
  .pd-titlebar {padding:10px 14px;}
  .pd-titlebar small {font-size:10px;}
  .pd-quay-search {margin:11px 11px 7px;}
  .pd-quay-search kbd {display:none;}
  .pd-quaydeck>.pd-segments {margin:0 11px 6px;}
  .pd-quaydeck>.pd-segments button {min-height:44px;}
  .pd-quay-list {height:221px;padding:0 9px 4px;}
  .pd-quay-inspector {margin:0 12px;min-height:164px;}
  .pd-inspector-heading>small {display:none;}
  .pd-quay-inspector dl>div {font-size:10px;gap:7px;}
  .pd-activity-role {font-size:9px;gap:3px;}
  .pd-activity-role svg {width:10px;}
  .pd-quay-foot {margin:0 14px 10px;font-size:10px;}
  .pd-menubar {padding:0 13px;font-size:8px;}
  .pd-match-clubs {padding:10px 11px 3px;}
  .pd-match-fixtures {padding:5px 11px 11px;gap:6px;}
  .pd-match-main {margin:0 12px;}
  .pd-fixture-meta {font-size:10px;}
  .pd-fixture-teams {gap:5px;padding:17px 0;}
  .pd-fixture-teams strong {font-size:11px;}
  .pd-fixture-score {font-size:27px;}
  .pd-match-actions {padding:10px 11px 0;gap:4px;}
  .pd-match-actions button {font-size:10px;gap:4px;}
  .pd-match-actions svg {width:13px;height:13px;}
  .pd-match-status {padding:9px 15px;min-height:64px;font-size:10px;}
  .pd-match-timeline>div>span {gap:5px;}
  .pd-match-timeline small {font-size:9px;}
  .pd-spoor-session {padding:13px 14px;}
  .pd-spoor-body {display:flex;flex-direction:column;min-height:0;}
  .pd-spoor-timeline {display:flex;padding:8px 7px;border-right:0;border-bottom:1px solid #e9e0d6;gap:2px;}
  .pd-spoor-timeline button {flex:1;min-width:0;min-height:68px;padding:7px 2px;gap:4px;flex-direction:column;justify-content:center;text-align:center;}
  .pd-spoor-timeline button>span:nth-child(2) {gap:1px;}
  .pd-spoor-timeline .pd-event-icon {width:22px;height:23px;border-radius:6px;}
  .pd-spoor-timeline strong {font-size:10px;}
  .pd-spoor-timeline time {font-size:10px;}
  .pd-moment-tick {display:none;}
  .pd-spoor-view {padding:9px 15px 13px;}
  .pd-spoor-view>.pd-segments {margin-bottom:12px;}
  .pd-spoor-view>.pd-segments button {flex:1;}
  .pd-spoor-detail {min-height:245px;}
  .pd-moment-heading h3 {margin-bottom:16px;font-size:16px;}
  .pd-spoor blockquote {font-size:23px;max-width:310px;}
  .pd-screen-preview {max-width:310px;margin-top:-5px;}
  .pd-screen-title {padding:6px 9px;}
  .pd-screen-search {margin:7px 9px 5px;padding:6px 8px;}
  .pd-screen-row {padding:5px 7px;}
  .pd-transcript-note {max-width:310px;}
}

/* Actual controls and reading text retain a useful size at every viewport.
   Only the miniature illustrated screen uses display-scale microtype. */
.project-demo .pd-segments button,.project-demo .pd-quay-search input,.project-demo .pd-activity-name>strong,.project-demo .pd-inspector-heading strong,.project-demo .pd-match-clubs button,.project-demo .pd-match-fixtures button strong,.project-demo .pd-fixture-teams strong,.project-demo .pd-match-actions button,.project-demo .pd-spoor-timeline strong,.project-demo .pd-pack-files summary,.project-demo .pd-no-speech button {font-size:12px;}
.project-demo .pd-titlebar small,.project-demo .pd-sample-note,.project-demo .pd-quay-search kbd,.project-demo .pd-project-group h3,.project-demo .pd-project-group h3>span,.project-demo .pd-activity-name>small,.project-demo .pd-activity-role,.project-demo .pd-inspector-heading>div>span,.project-demo .pd-inspector-heading>small,.project-demo .pd-quay-inspector dl>div,.project-demo .pd-evidence summary,.project-demo .pd-evidence p,.project-demo .pd-quay-foot,.project-demo .pd-menubar,.project-demo .pd-match-fixtures button>span,.project-demo .pd-match-fixtures button small,.project-demo .pd-fixture-meta,.project-demo .pd-match-timeline time,.project-demo .pd-match-timeline strong,.project-demo .pd-match-timeline small,.project-demo .pd-timeline-lock strong,.project-demo .pd-timeline-lock small,.project-demo .pd-match-status,.project-demo .pd-spoor-session>div>span,.project-demo .pd-session-sample,.project-demo .pd-spoor-timeline time,.project-demo .pd-spoor-view>.pd-segments button,.project-demo .pd-moment-heading>span,.project-demo .pd-moment-source,.project-demo .pd-context-note,.project-demo .pd-file-name,.project-demo .pd-pack-files>div,.project-demo .pd-pack-files code,.project-demo .pd-pack-files p,.project-demo .pd-pack-preview>span,.project-demo .pd-pack-preview>code {font-size:11px;}
.project-demo .pd-project-group h3,.project-demo .pd-project-group h3>span,.project-demo .pd-activity-name>small,.project-demo .pd-activity-role,.project-demo .pd-inspector-heading>div>span,.project-demo .pd-inspector-heading>small,.project-demo .pd-quay-inspector dt,.project-demo .pd-evidence summary,.project-demo .pd-evidence p,.project-demo .pd-quay-foot,.project-demo .pd-quay-search input::placeholder {color:#607168;}
.project-demo .pd-menubar,.project-demo .pd-fixture-meta,.project-demo .pd-fixture-meta>span:last-child,.project-demo .pd-match-fixtures button>span,.project-demo .pd-match-fixtures button small,.project-demo .pd-match-timeline time,.project-demo .pd-match-timeline small,.project-demo .pd-match-status,.project-demo .pd-timeline-lock {color:#5a6e50;}
.project-demo .pd-match-actions button {color:#5d7253;}
.project-demo .pd-spoor-session>div>span,.project-demo .pd-session-sample,.project-demo .pd-spoor-timeline button,.project-demo .pd-moment-heading>span,.project-demo .pd-moment-source,.project-demo .pd-context-note,.project-demo .pd-transcript-note,.project-demo .pd-file-name,.project-demo .pd-pack-files>div,.project-demo .pd-pack-files code,.project-demo .pd-pack-files p,.project-demo .pd-pack-preview>span,.project-demo .pd-pack-preview>code,.project-demo.pd-spoor>.pd-sample-note {color:#7b634c;}
.project-demo .pd-spoor-timeline button[aria-pressed=true] {color:#7a573f;}
.project-demo .pd-evidence summary,.project-demo .pd-spoor-view>.pd-segments button {font-size:12px;}

/* Matchbar's native source uses a cool system canvas and blue selection.
   Fictional club initials are neutral fallbacks, never invented team crests. */
.project-demo.pd-matchbar {--pd-ink:#20242c;--pd-muted:#616873;--pd-line:#d9dce3;--pd-accent:#2152c9;background:#f7f8fa;border:0;border-radius:12px;box-shadow:0 18px 44px #1d29341a,0 3px 8px #1d293409;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;}
.pd-matchbar .pd-titlebar {min-height:52px;padding:10px 17px;background:#f1f2f5;border-bottom:1px solid #d9dce3;}
.pd-matchbar .pd-titlebar strong {font-size:14px;letter-spacing:-.02em;text-transform:lowercase;color:#252a33;}
.pd-matchbar .pd-titlebar small {color:#616873;}
.pd-matchbar .pd-brand-mark {background:none;}
.pd-matchbar .pd-menubar {background:#e9ecf1;color:#454c59;min-height:35px;font-size:11px;border-color:#d4d8e1;}
.pd-matchbar .pd-menubar-fixture {font-weight:550;color:#313b4d;}
.pd-matchbar .pd-match-clubs {padding:13px 15px 9px;gap:3px;border-bottom:1px solid #e1e4ea;}
.pd-matchbar .pd-match-clubs button {border-radius:6px;padding:0 10px 0 8px;color:#4d5564;min-height:44px;font-size:12px;}
.pd-matchbar .pd-match-clubs button[aria-pressed=true] {background:#e3eaf9;color:#214caa;}
.pd-matchbar .pd-club-dot,.pd-matchbar .pd-club-crest {background:#e8ebef!important;color:#535d6e!important;border:1px solid #d5dbe3;box-shadow:none;font-family:inherit;font-weight:650;border-radius:50%;}
.pd-matchbar .pd-club-dot {width:24px;height:24px;font-size:10px;}
.pd-matchbar .pd-match-fixtures {flex-direction:column;gap:0;padding:3px 9px 8px;}
.pd-matchbar .pd-match-fixtures button {display:flex;flex-direction:row;align-items:center;justify-content:space-between;min-height:48px;padding:9px 10px;border:0!important;border-radius:6px;background:none;color:#313844;gap:10px;}
.pd-matchbar .pd-match-fixtures button[aria-pressed=true] {background:#e4ebf9;color:#214caa;}
.pd-matchbar .pd-match-fixtures button>span {display:flex;align-items:baseline;gap:8px;font-size:11px;color:#626b79;}
.pd-matchbar .pd-match-fixtures button small {font-size:11px;color:inherit;margin:0;}
.pd-matchbar .pd-match-fixtures button strong {font-size:12px;font-weight:550;text-align:right;}
.pd-matchbar .pd-match-main {margin:0 18px;}
.pd-matchbar .pd-fixture-meta {border-top:1px solid #dfe3e9;padding-top:13px;font-size:11px;color:#626b79;}
.pd-matchbar .pd-fixture-meta>span:last-child {color:#626b79;}
.pd-matchbar .pd-fixture-teams {gap:14px;padding:20px 0;}
.pd-matchbar .pd-club-crest {width:36px;height:36px;font-size:14px;border-radius:50%;}
.pd-matchbar .pd-fixture-teams>div {gap:7px;}
.pd-matchbar .pd-fixture-teams strong {font-size:12px;color:#303744;}
.pd-matchbar .pd-fixture-score {font-size:29px;letter-spacing:-.02em;color:#252d3a;}
.pd-matchbar .pd-fixture-score.is-shielded {font-size:25px;letter-spacing:0;color:#7a8494;}
.pd-matchbar .pd-match-timeline {min-height:98px;border-color:#dfe3e9;padding:7px 0;}
.pd-matchbar .pd-timeline-lock {min-height:82px;color:#5e6877;}
.pd-matchbar .pd-timeline-lock>svg {width:22px;height:22px;color:#697a96;opacity:1;}
.pd-matchbar .pd-timeline-lock strong {font-size:12px;font-weight:550;color:#374355;}
.pd-matchbar .pd-timeline-lock small {font-size:11px;color:#616b79;}
.pd-matchbar .pd-match-timeline time,.pd-matchbar .pd-match-timeline small {color:#616b79;}
.pd-matchbar .pd-match-timeline strong {font-size:11px;color:#374355;}
.pd-matchbar .pd-match-timeline>div>i {background:#8197bc;}
.pd-matchbar .pd-match-actions {gap:0;padding:11px 12px 0;}
.pd-matchbar .pd-match-actions button {border-radius:6px;background:none;color:#535e70;font-size:11px;gap:6px;}
.pd-matchbar .pd-match-actions button[aria-pressed=true] {background:#e4ebf9;color:#214caa;}
.pd-matchbar .pd-match-actions button:hover {background:#e9edf4;}
.pd-matchbar .pd-match-actions button[aria-pressed=true]:hover {background:#d9e4f8;}
.pd-matchbar .pd-match-status {padding:9px 18px;min-height:55px;color:#616b79;line-height:1.55;font-size:11px;}
.pd-matchbar .pd-sample-note {color:#626b79;border-color:#dfe3e9;font-size:11px;padding:10px 14px;}
.pd-matchbar button:focus-visible {outline-color:#2152c9;outline-offset:-3px;}
.pd-matchbar ::selection {background:#cad9f9;color:#172b52;}
@media(max-width:400px) {
  .pd-matchbar .pd-fixture-meta {align-items:flex-start;gap:12px;}
  .pd-matchbar .pd-fixture-meta>span:last-child {white-space:nowrap;}
  .pd-matchbar .pd-menubar-clock {display:none;}
  .pd-matchbar .pd-menubar-fixture {margin-right:auto;text-align:left;}
  .pd-matchbar .pd-match-fixtures button>span {gap:5px;}
}


/* craft-v13.css */
/* Float: the same objects, with clearer glass, type and viewing distance.
   Position, drag and journey transforms remain with their original owners. */
@layer experience {
  :root {
    --bg: #f4f5f6;
    --ink: #202934;
    --muted: #5b6877;
    --quiet-ink: #536474;
    --focus-ink: #365f7b;
    --craft-line: #667c9229;
    --craft-paper: #fafbf9;
    --craft-caption: #586a7a;
    --craft-ease: cubic-bezier(.22, 1, .36, 1);
  }

  body { font-optical-sizing: auto; }
  button, a, summary { text-underline-offset: .22em; }
  button:disabled { cursor: default; }
  ::selection { color: #173d51; background: #bcd9e7b3; }
  input, textarea { caret-color: #386981; }

  /* Quiet daylight lets the portraits and project covers carry the colour. */
  .ambient {
    background: radial-gradient(ellipse at 20% 48%, #e8f0f5a8, transparent 48%),
      radial-gradient(ellipse at 84% 22%, #efebf393, transparent 43%),
      linear-gradient(145deg, #f8f9f9, #f1f3f5);
  }
  .ambient::after { background: none; opacity: 0; }
  .header { left: max(32px, env(safe-area-inset-left)); right: max(32px, env(safe-area-inset-right)); }
  .wordmark {
    font-size: clamp(22px, 1.9vw, 27px);
    font-weight: 680;
    letter-spacing: -.04em;
    line-height: 1.15;
    padding-block: 8px;
  }
  .header-tools { gap: 8px; }
  .header-tools .keys-button {
    background: #ffffff36;
    border-color: #ffffffbd;
    box-shadow: inset 0 1px 0 #ffffffa8;
  }
  .find-button, .keys-button, .wander-button { font-weight: 480; }
  .find-button:is(:hover, [aria-expanded=true]),
  .keys-button:is(:hover, [aria-expanded=true]) { background: #ffffffc2; color: #29475e; }
  kbd { font-family: inherit; font-variant-numeric: tabular-nums; }
  .header-tools kbd, .world-toolbar kbd, .chill-toggle kbd {
    color: #576c7c;
    background: #ffffff40;
    border-color: #7c91a126;
    box-shadow: none;
  }
  .person h1 {
    font-size: clamp(25px, 2.6vw, 39px);
    font-weight: 580;
    letter-spacing: -.035em;
    line-height: 1.16;
    text-wrap: balance;
  }
  .person > p { color: #566575; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.6; margin-top: 11px; letter-spacing: -.015em; }
  .hello-bubble { font-size: 13px; line-height: 1.4; color: #3d596c; box-shadow: 0 10px 24px -16px #35536c60; }
  .chill-toggle {
    min-height: 38px;
    margin-top: 18px;
    padding: 0 13px 0 10px;
    font-size: 11px;
    color: #506677;
    background: #ffffff57;
    border-color: #ffffffcf;
    box-shadow: inset 0 1px 0 #fff, 0 5px 13px -11px #344c6959;
  }
  .footer { left: max(32px, env(safe-area-inset-left)); right: max(32px, env(safe-area-inset-right)); }
  .footer .hint { font-size: 12px; letter-spacing: .005em; color: #5e6e7d; }
  .footer-keys { letter-spacing: 4px; font-size: 12px; }
  .footer-keys span { font-size: 11px; letter-spacing: 0; }
  .motion-toggle, .bubble-reset { border-color: #8498aa30; background: #ffffff20; }
  .motion-toggle:hover, .bubble-reset:hover { background: #ffffffb8; }
  .droplet { opacity: .65; }

  /* One continuous rim. Specular light lives on the surface rather than in
     several concentric outlines. The optical release/drag layers still work. */
  .bubble {
    border: 1px solid rgb(var(--tint) / .27);
    background: radial-gradient(ellipse at var(--shine-x, 28%) var(--shine-y, 20%), #ffffffe8 0%, #ffffff64 9%, #ffffff00 27%),
      radial-gradient(ellipse at 70% 78%, rgb(var(--tint) / .12), transparent 63%),
      linear-gradient(145deg, #ffffff36, #ffffff08);
    box-shadow: inset 0 2px 3px #fffffff0,
      inset 0 -5px 12px #ffffff80,
      inset -3px -2px 10px rgb(var(--tint) / .07),
      0 21px 28px -24px rgb(var(--tint) / .64);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .bubble::before {
    inset: 0;
    border: 0;
    background: none;
    box-shadow: inset 1px 1px 2px #ffffffcc, inset -1px -2px 3px rgb(var(--tint) / .16);
  }
  .bubble::after {
    left: 17%; top: 12%; width: 22%; height: 12%;
    background: linear-gradient(150deg, #ffffffe6, #ffffff0d);
    filter: none;
    opacity: .55;
  }
  .bubble-projects { --color: #5c83bc; }
  .bubble-games { --color: #c68c3c; }
  .bubble-music { --color: #9372ba; }
  .bubble-apps { --color: #4d9f8f; }
  .bubble-play { --color: #cf8086; }
  .bubble-content { gap: 15px; }
  .bubble-icon { width: 28%; height: 28%; filter: none; }
  .bubble-label { color: #263542; font-size: clamp(15px, 1.35vw, 20px); font-weight: 510; letter-spacing: -.025em; gap: 7px; }
  .bubble-label .arrow { opacity: .6; width: .68em; height: .68em; }
  .bubble:hover {
    box-shadow: inset 0 2px 3px #fff,
      inset 0 -5px 12px #ffffffb3,
      inset -3px -2px 12px rgb(var(--tint) / .11),
      0 25px 31px -23px rgb(var(--tint) / .56);
  }
  .bubble:hover .bubble-label .arrow { opacity: .95; }
  .optic-membrane { border-color: #ffffffcc; opacity: .14; }
  .bubble-optics.is-held .optic-membrane { opacity: .5; }
  .optic-sheen { left: 17%; top: 12%; opacity: 0; }
  .bubble-optics.is-lit .optic-sheen { opacity: .4; }
  .hover-satellite { box-shadow: inset 0 1px 2px #fff, 0 15px 25px -19px rgb(var(--hover-tint) / .5); }
  .hover-satellite::after { border-color: #ffffff75; }
  .hover-action-note { color: #5a6e7e; }
  .hover-app-heading > small, .hover-task > b { color: #5a6e7e; }

  /* Every destination inherits the same calm viewing room. */
  .world-atmosphere {
    background: radial-gradient(ellipse at 7% 13%, rgb(var(--detail-tint) / .065), transparent 48%),
      radial-gradient(ellipse at 94% 86%, rgb(var(--detail-tint) / .045), transparent 44%), #f4f6f6;
  }
  .world-atmosphere > span { opacity: .25; }
  .world-surface, .inner-portal {
    border-color: rgb(var(--detail-tint) / .24);
    background: radial-gradient(ellipse at 27% 19%, #ffffffde, #ffffff56 13%, #ffffff00 34%),
      radial-gradient(ellipse at 70% 77%, rgb(var(--detail-tint) / .11), transparent 64%), #f4f6f6;
    box-shadow: inset 0 2px 3px #fff, inset 0 -4px 11px #ffffff80;
  }
  .world-toolbar { padding-inline: max(30px, env(safe-area-inset-left)); }
  .world-back { color: #506679; gap: 10px; }
  .world-back:hover { background: #ffffff70; }
  .world-category { color: #506679; font-size: 12px; font-weight: 530; letter-spacing: -.01em; }
  .world-category svg { width: 17px; height: 17px; }
  .world-stage { width: min(1140px, calc(100% - 104px)); padding-block: 18px 30px; scrollbar-width: thin; scrollbar-color: #899ba875 transparent; }
  .world-stage::-webkit-scrollbar { width: 5px; }
  .world-stage::-webkit-scrollbar-thumb { border-radius: 5px; background: #899ba875; }
  .world-footer { height: 108px; }
  .world-nav {
    gap: 18px;
    background: #ffffff5e;
    border-color: #ffffffc7;
    box-shadow: inset 0 1px 0 #fff, 0 12px 24px -23px #35536c70;
    padding: 10px 18px;
  }
  .world-nav .mini-bubble {
    border-color: rgb(var(--tint, 92 157 255) / .23);
    background: radial-gradient(circle at 27% 17%, #ffffffd9, #ffffff00 35%),
      linear-gradient(150deg, #ffffff52, rgb(var(--tint, 92 157 255) / .06));
    box-shadow: inset 0 1px 2px #fff;
  }
  .world-nav .mini-bubble[aria-pressed=true] {
    box-shadow: inset 0 1px 2px #fff, 0 8px 15px -12px rgb(var(--tint, 92 157 255) / .7);
    border-color: rgb(var(--tint, 92 157 255) / .45);
  }
  .world-nav-label { font-size: 11px; color: #3e596e; }
  .world-exit { color: #506679; }
  .view-heading h2, .showcase-heading h2, .media-heading h2, .made-heading h2 {
    font-size: clamp(35px, 4.1vw, 57px);
    font-weight: 560;
    line-height: 1.1;
    letter-spacing: -.035em;
    text-wrap: balance;
  }
  .view-heading p, .showcase-heading p, .media-heading p, .made-heading p {
    font-size: 14px;
    line-height: 1.65;
    color: #566b7a;
    letter-spacing: -.01em;
    max-width: 46ch;
    margin: 15px auto 0;
  }
  .showcase-heading { margin: 8px 0 15px; }
  .showcase-home { max-width: 1040px; }

  /* The cover, title and useful description form one object, with no chrome
     around the copy and no tiny labels floating below the touch target. */
  .showcase-node {
    color: #263b4a;
    background: radial-gradient(ellipse at 29% 18%, #ffffffc7, #ffffff24 24%, #ffffff00 45%),
      radial-gradient(ellipse at 70% 80%, rgb(var(--showcase-tint) / .09), #ffffff00 66%), #ffffff13;
    box-shadow: inset 0 1px 2px #ffffffed, inset -1px -1px 2px rgb(var(--showcase-tint) / .19),
      0 17px 26px -23px rgb(var(--showcase-tint) / .64);
  }
  .showcase-node .showcase-node-inner {
    inset: 10% 8% 12%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .showcase-node .showcase-node-art {
    position: relative; left: auto; top: auto;
    width: 100%; height: 50%; flex: 0 0 50%; margin: 0 0 6px;
  }
  .showcase-node .showcase-node-art img {
    position: static;
    object-fit: contain;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 10px 17px -12px #253c5b6b;
  }
  .showcase-node .showcase-node-inner > strong {
    position: static; left: auto; right: auto; top: auto;
    display: block; flex-shrink: 0; max-width: 100%;
    font-size: clamp(13px, 1.3vw, 17px);
    font-weight: 570;
    line-height: 1.3;
    letter-spacing: -.02em;
  }
  .showcase-node .showcase-node-note {
    position: static;
    top: auto; left: auto; translate: none;
    margin-top: 7px;
    max-width: 21ch;
    color: #526c7d;
    font-size: 11px;
    line-height: 1.4;
    white-space: normal;
    text-wrap: balance;
  }
  .showcase-node-glint { border-top-color: #ffffff8a; inset: 3%; }
  .showcase-quiet-hint { color: #5b6e7c; font-size: 12px; line-height: 1.6; margin-top: 10px; }
  .showcase-garden-back { font-size: 12px; min-height: 44px; padding: 9px 0; color: #526b7e; border-bottom-color: #7d91a23b; }
  .showcase-focus:is(.showcase-focus-quaydeck, .showcase-focus-matchbar, .showcase-focus-spoor) .showcase-subtle-back { display: none; }
  .showcase-count-5, .showcase-count-6 { height: 440px; max-width: 920px; }
  .showcase-count-5 .showcase-node, .showcase-count-6 .showcase-node { width: 182px; }
  .showcase-count-5 .showcase-node:nth-child(1) { left: 17%; top: 25%; }
  .showcase-count-5 .showcase-node:nth-child(2) { left: 50%; top: 30%; }
  .showcase-count-5 .showcase-node:nth-child(3) { left: 83%; top: 23%; }
  .showcase-count-5 .showcase-node:nth-child(4) { left: 33%; top: 75%; }
  .showcase-count-5 .showcase-node:nth-child(5) { left: 68%; top: 74%; }
  .showcase-count-6 .showcase-node:nth-child(1) { left: 17%; top: 24%; }
  .showcase-count-6 .showcase-node:nth-child(2) { left: 50%; top: 29%; }
  .showcase-count-6 .showcase-node:nth-child(3) { left: 83%; top: 23%; }
  .showcase-count-6 .showcase-node:nth-child(4) { left: 18%; top: 75%; }
  .showcase-count-6 .showcase-node:nth-child(5) { left: 51%; top: 80%; }
  .showcase-count-6 .showcase-node:nth-child(6) { left: 83%; top: 74%; }

  /* A project reads as a piece of work: a short introduction next to a large
     working artifact, followed by optional decisions and neighbouring work. */
  .showcase-focus { max-width: 1080px; grid-template-columns: minmax(240px, .78fr) minmax(0, 1.32fr); gap: 70px; row-gap: 34px; padding-block: 16px 24px; }
  .showcase-copy { max-width: 360px; }
  .showcase-copy h2 { margin: 0 0 20px; font-size: clamp(36px, 4.2vw, 56px); line-height: 1.06; font-weight: 560; letter-spacing: -.035em; text-wrap: balance; }
  .showcase-copy > p { color: #4f6576; font-size: 15px; line-height: 1.8; letter-spacing: -.01em; max-width: 35ch; }
  .showcase-copy .showcase-instruction { margin-top: 23px; color: #516c7e; font-size: 12px; line-height: 1.7; max-width: 38ch; }
  .showcase-subtle-back { font-size: 12px; min-height: 44px; margin-top: 14px; color: #526b7e; border-bottom-color: #7d91a23b; }
  .showcase-case, .showcase-story { margin-top: 21px; max-width: 100%; border-top: 1px solid var(--craft-line); }
  .showcase-case > summary, .showcase-story > summary {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    min-height: 44px; width: 100%; padding: 11px 0;
    color: #39576b; font-size: 12px; font-weight: 530; line-height: 1.5;
    cursor: pointer; list-style: none;
  }
  .showcase-case > summary::-webkit-details-marker { display: none; }
  .showcase-case > summary > span { font-size: 16px; font-weight: 400; transition: transform 180ms var(--craft-ease); }
  .showcase-case[open] > summary > span { transform: rotate(45deg); }
  .showcase-case-start { margin: 2px 0 18px; color: #4d6476; font-size: 13px; line-height: 1.8; }
  .showcase-case-start p { margin-top: 10px; }
  .showcase-case-decisions { display: flex; flex-direction: column; gap: 17px; margin-top: 19px; }
  .showcase-case-decisions h3 { margin: 0 0 5px; color: #304e63; font-size: 13px; line-height: 1.5; font-weight: 580; letter-spacing: -.01em; }
  .showcase-case-decisions p, .showcase-case p, .showcase-story p { color: #4f6677; font-size: 12px; line-height: 1.8; }
  .showcase-case .showcase-case-boundary { padding-top: 16px; margin-top: 18px; border-top: 1px solid var(--craft-line); color: #5b6b76; font-size: 11px; line-height: 1.7; }
  .showcase-case .showcase-credits, .showcase-story-meta { display: block; margin-top: 14px; color: #586c7c; font-size: 11px; line-height: 1.65; letter-spacing: 0; }
  .showcase-credits a { text-decoration: underline; text-decoration-color: #6b83965e; }
  .showcase-demo { align-self: center; }
  .showcase-threads { gap: 14px 36px; padding-top: 20px; border-top-color: var(--craft-line); }
  .showcase-thread { min-height: 54px; color: #38566c; }
  .showcase-thread strong { font-size: 13px; letter-spacing: -.01em; font-weight: 560; }
  .showcase-thread > span:nth-child(2) > span { color: #5c7080; font-size: 11px; }
  .showcase-thread-art { width: 46px; height: 46px; box-shadow: 0 6px 13px -10px #344c6570; }
  .showcase-thread > svg { color: #526d82; }
  .showcase-contained-note, .showcase-preview-note, .showcase-quay-caption { color: #52697a; font-size: 11px; line-height: 1.6; }

  /* Native app miniatures keep their own character and become readable at the
     size actually offered to a visitor. Secondary actions share a 44px target. */
  .showcase-quay { border: 0; border-radius: 16px; background: #fbfcfbeF; box-shadow: 0 24px 45px -29px #2b485f59; }
  .showcase-quay-bar { color: #526a7b; height: 57px; font-size: 11px; }
  .showcase-quay-bar > span:first-child { color: #29495e; font-size: 15px; }
  .showcase-quay-tabs button { min-height: 38px; font-size: 11px; color: #4c687c; }
  .showcase-quay-tabs button[aria-pressed=true] { background: #e7eef0; color: #264d65; }
  .showcase-quay-search { height: 44px; background: #ffffffa3; border-color: #a6bac73d; border-radius: 8px; }
  .showcase-quay-search input { font-size: 13px; color: #29495e; }
  .showcase-activity { min-height: 56px; padding: 10px; }
  .showcase-activity strong { font-size: 12px; font-weight: 550; color: #34566b; }
  .showcase-activity small, .showcase-activity-meta { color: #526d80; font-size: 10px; line-height: 1.4; }
  .showcase-activity[aria-pressed=true] { background: #e9f0f1; border-color: transparent; }
  .showcase-quay-detail { min-height: 76px; padding-top: 16px; }
  .showcase-quay-detail strong { font-size: 12px; color: #34566b; }
  .showcase-quay-detail p { font-size: 12px; color: #536d7e; }
  .showcase-quay-caption { margin-top: 12px; }
  .showcase-match { border: 0; background: #f8faf5; border-radius: 16px; box-shadow: 0 24px 45px -29px #34533b52; }
  .showcase-match > header small, .showcase-match-date { font-size: 11px; color: #536d55; }
  .showcase-fixture strong { font-size: 12px; color: #3e5c45; }
  .showcase-score-toggle { min-height: 40px; font-size: 11px; color: #4f6b4c; }
  .showcase-match-actions button { min-height: 44px; font-size: 11px; color: #486440; }
  .showcase-match-status { color: #4d694d; }
  .showcase-light-scenes button { min-height: 44px; color: #4f675a; font-size: 11px; }
  .showcase-koop-menu header strong { font-size: 12px; }
  .showcase-screen-switch { min-height: 44px; font-size: 11px; }
  .showcase-answer > strong { font-size: 12px; line-height: 1.5; }
  .showcase-quiz-footer, .showcase-answer-reveal p { font-size: 11px; line-height: 1.65; }
  .showcase-game-next { min-height: 44px; font-size: 12px; }
  .showcase-perspective-reset { width: 44px; height: 44px; bottom: -10px; }
  .showcase-reader-sheet > p { font-size: 14px; line-height: 1.8; }
  .showcase-reader-sheet > h3 { font-size: 27px; letter-spacing: -.025em; }
  .showcase-reader-page { min-height: 300px; }

  /* Records, films and reading stay tangible. Their controls and captions are
     legible even when the artifact itself is deliberately small. */
  .media-orb, .made-node-orb {
    background: radial-gradient(ellipse at 27% 18%, #ffffffd4, #ffffff1c 27%, #ffffff00 47%),
      radial-gradient(ellipse at 70% 78%, rgb(var(--orb-tint, 147 151 174) / .1), #ffffff00 65%), #ffffff10;
    box-shadow: inset 0 1px 2px #fff, inset -1px -2px 2px rgb(var(--orb-tint, 147 151 174) / .2),
      0 18px 26px -23px rgb(var(--orb-tint, 147 151 174) / .6);
  }
  .media-portal strong, .made-node strong { font-weight: 550; color: #304959; letter-spacing: -.02em; }
  .media-portal > span:last-child, .made-node > span:last-child { color: #536b7c; font-size: 11px; line-height: 1.5; }
  .media-artist, .media-film-copy h3, .shelf-focus-copy h2, .made-copy h2 { font-weight: 560; letter-spacing: -.03em; }
  .media-track-title, .media-film-copy > p, .shelf-credit { color: #50697c; font-size: 12px; line-height: 1.7; }
  .media-player-caption { font-size: 11px; color: #50697c; }
  .media-timeline { font-size: 11px; color: #50697c; }
  .media-play-button { color: #565773; background: #ffffffe0; border: 0; box-shadow: 0 7px 16px -11px #52536d7d; }
  .media-progress-rail { background: #8994a238; }
  .media-progress-rail > span { background: #88799f; }
  .media-film-tile strong { font-size: 11px; line-height: 1.4; color: #50697c; }
  .media-film-tile { opacity: .75; }
  .media-film-tile[aria-pressed=true] strong { color: #263e51; font-weight: 550; }
  .media-bottom { color: #536b7c; font-size: 11px; }
  .media-bottom > button { font-size: 12px; }
  .media-live-button, .media-finished-next, .media-film-thread { font-size: 12px; color: #50697c; }
  .shelf-object strong { font-size: 13px; font-weight: 540; color: #345263; }
  .shelf-object > span:last-child { color: #536b7c; font-size: 11px; }
  .shelf-object-halo { background: radial-gradient(ellipse at 49% 70%, rgb(var(--shelf-tint) / .08), #ffffff00 64%); }
  .shelf-object-glint { opacity: .3; }
  .shelf-filters button { color: #50697c; }
  .shelf-filters button[aria-pressed=true] { color: #29495e; background: #ffffffa3; border-color: #ffffffd9; box-shadow: none; }
  .shelf-note, .shelf-thread > p { font-size: 13px; line-height: 1.8; color: #536b7c; }
  .shelf-thread > span { color: #67573f; }
  .shelf-focus-navigation button { font-size: 11px; color: #50697c; }
  .made-story { color: #536b7c; font-size: 13px; line-height: 1.85; }
  .made-player-status, .made-times { color: #536b7c; font-size: 11px; }

  /* Search is an index of actual work. Results get a stable leading thumbnail,
     title and description rather than additional decorative containers. */
  .discovery {
    padding: 10px 12px 0;
    border: 0;
    border-radius: 18px;
    background: #f9fbfa;
    box-shadow: 0 24px 70px -30px #28455c59;
    scrollbar-color: #899ba875 transparent;
  }
  .discovery-search { padding: 6px 4px 12px 7px; border-bottom-color: var(--craft-line); }
  .discovery-search input { font-size: 15px; color: #28485f; }
  /* iOS zooms the page when an editable field is smaller than 16px. */
  @media (max-width: 600px), (pointer: coarse) { .discovery-search input { font-size: 16px; } }
  .discovery-search input::placeholder { color: #586f80; }
  .discovery-intro { padding: 15px 9px 10px; gap: 6px; color: #3e5c70; font-size: 12px; }
  .discovery-intro small { font-size: 11px; color: #587080; line-height: 1.5; }
  .discovery-results { gap: 3px; padding-bottom: 10px; }
  .discovery-result { min-height: 80px; gap: 13px; padding: 10px 9px; border-radius: 11px; }
  .discovery-art { width: 48px; height: 48px; }
  .discovery-art img { border-radius: 8px; box-shadow: none; }
  .discovery-result strong { font-size: 14px; font-weight: 550; color: #294b63; letter-spacing: -.01em; }
  .discovery-result small { font-size: 11px; line-height: 1.5; color: #526c7f; }
  .discovery-result:is(:hover, :focus-visible, .is-selected) { background: rgb(var(--discovery-tint) / .09); }
  .discovery-result-enter { color: #42647e; }
  .discovery-foot { padding: 7px 9px 9px; border-top-color: var(--craft-line); background: #f9fbfa; }
  .discovery-foot button { color: #365b75; }
  .discovery-foot > span { color: #587080; }
  #keyboard-guide { background: #f9fbfaf5; border: 0; border-radius: 18px; box-shadow: 0 24px 60px -30px #28455c59; }
  .explorer-guide-header p, .explorer-guide-note { color: #5b7182; }
  .explorer-shortcuts dd { font-size: 12px; color: #4c687c; }
  .explorer-guide-close { width: 38px; height: 38px; margin-top: -7px; color: #526d80; }

  /* The emerald hover scene and the beach retain their own lighting. */
  .mood-matrix:not(.chill-mode) .bubble { border-color: rgb(var(--tint) / .22); }
  .mood-matrix:not(.chill-mode) .bubble::before { box-shadow: inset 1px 1px 2px #d5f4df70, inset -1px -2px 3px #b1e1bb30; }
  .mood-matrix:not(.chill-mode) .bubble::after { background: linear-gradient(150deg, #d5f4df70, #d5f4df00); }
  .mood-matrix:not(.chill-mode) .bubble-play { --color: #89e3ac; }
  .mood-matrix:not(.chill-mode) .header-tools .keys-button { background: #c1e9cf09; border-color: #c1e9cf24; }
  .mood-matrix:not(.chill-mode) .find-button { color: #aec6b8; }
  .mood-matrix:not(.chill-mode) .header-tools kbd { background: #c1e9cf06; border-color: #c1e9cf30; color: #aec6b8; }
  .chill-mode .bubble { box-shadow: inset 0 2px 3px #ffffffe8, inset 0 -5px 12px #ffffff6b, 0 21px 28px -24px #516b596b; }
  .chill-mode .person > p { color: #50665b; }
  .chill-mode .chill-toggle { color: #486d5e; background: #ffffff5c; }

  @media (hover: hover) and (pointer: fine) {
    .showcase-node:hover { box-shadow: inset 0 1px 2px #fff, inset -1px -1px 2px rgb(var(--showcase-tint) / .25), 0 22px 30px -23px rgb(var(--showcase-tint) / .58); }
    .showcase-case > summary:hover, .showcase-story > summary:hover { color: #1e435d; }
    .discovery-result:hover .discovery-art img { opacity: .9; }
  }
  @media (min-width: 901px) and (max-height: 820px) {
    .world-toolbar { height: 78px; }
    .world-stage { padding-block: 8px 18px; }
    .world-footer { height: 88px; }
    .showcase-heading h2, .media-heading h2, .made-heading h2 { font-size: 43px; }
    .showcase-heading p, .media-heading p, .made-heading p { margin-top: 12px; font-size: 13px; }
    .showcase-heading { margin-top: 6px; margin-bottom: 10px; }
    .showcase-count-5, .showcase-count-6 { height: 405px; max-width: 900px; }
    .showcase-count-5 .showcase-node, .showcase-count-6 .showcase-node { width: 172px; }
    .showcase-focus { gap: 58px; row-gap: 25px; padding-block: 6px 18px; }
    .showcase-copy h2 { font-size: 46px; margin-bottom: 17px; }
    .showcase-copy > p { font-size: 14px; line-height: 1.75; }
    .showcase-copy .showcase-instruction { margin-top: 17px; }
  }
  @media (min-width: 601px) and (max-width: 900px) {
    .header, .footer { left: 26px; right: 26px; }
    .world-stage { width: calc(100% - 62px); }
    .showcase-count-5, .showcase-count-6 { height: 600px; max-width: 610px; }
    .showcase-count-5 .showcase-node, .showcase-count-6 .showcase-node { width: 180px; }
    .showcase-count-5 .showcase-node:nth-child(1), .showcase-count-6 .showcase-node:nth-child(1) { left: 24%; top: 17%; }
    .showcase-count-5 .showcase-node:nth-child(2), .showcase-count-6 .showcase-node:nth-child(2) { left: 76%; top: 20%; }
    .showcase-count-5 .showcase-node:nth-child(3), .showcase-count-6 .showcase-node:nth-child(3) { left: 25%; top: 50%; }
    .showcase-count-5 .showcase-node:nth-child(4), .showcase-count-6 .showcase-node:nth-child(4) { left: 75%; top: 53%; }
    .showcase-count-5 .showcase-node:nth-child(5) { left: 50%; top: 84%; }
    .showcase-count-6 .showcase-node:nth-child(5) { left: 24%; top: 83%; }
    .showcase-count-6 .showcase-node:nth-child(6) { left: 76%; top: 86%; }
    .showcase-focus { max-width: 600px; grid-template-columns: 1fr; gap: 30px; }
    .showcase-copy { max-width: 460px; margin-inline: auto; }
    .showcase-copy > p { max-width: 44ch; margin-inline: auto; }
    .showcase-case, .showcase-story { text-align: left; }
    .showcase-copy .showcase-instruction { margin-inline: auto; }
    .showcase-subtle-back { margin-inline: auto; }
  }
  @media (max-width: 600px) {
    .header { top: max(18px, env(safe-area-inset-top)); left: 20px; right: 17px; }
    .wordmark { font-size: 22px; letter-spacing: -.04em; }
    .header-tools { gap: 2px; }
    .header-tools .keys-button { border: 0; background: transparent; box-shadow: none; }
    .person h1 { font-size: clamp(23px, 6.2vw, 30px); font-weight: 580; letter-spacing: -.035em; }
    .person > p { font-size: 13px; line-height: 1.6; margin-top: 8px; }
    .chill-toggle { min-height: 37px; font-size: 11px; margin-top: 15px; }
    .bubble-content { gap: 8px; }
    .bubble-label { font-size: 13px; letter-spacing: -.02em; }
    .bubble-icon { width: 29%; height: 29%; }
    .footer { left: 20px; right: 17px; }
    .wander-button { font-size: 12px; }
    .world-toolbar { padding-left: 17px; padding-right: 14px; }
    .world-back { gap: 6px; font-size: 12px; }
    .world-category { font-size: 11px; }
    .world-stage { width: 100%; padding: 14px 24px 25px; }
    .world-footer { height: 91px; }
    .world-nav { gap: 15px; padding: 9px 15px; }
    .world-nav .mini-bubble { width: 44px; height: 44px; padding: 13px; }
    .view-heading h2, .showcase-heading h2, .media-heading h2, .made-heading h2 { font-size: clamp(30px, 8.5vw, 36px); font-weight: 560; letter-spacing: -.035em; line-height: 1.14; }
    .view-heading p, .showcase-heading p, .media-heading p, .made-heading p { font-size: 13px; max-width: 32ch; line-height: 1.65; margin-top: 13px; }
    .showcase-heading { margin: 12px 0 18px; }
    .showcase-node .showcase-node-art { width: 96%; height: 55%; margin-top: -4%; margin-bottom: 9px; }
    .showcase-node .showcase-node-inner > strong { font-size: 13px; }
    .showcase-node .showcase-node-note { font-size: 10px; margin-top: 5px; max-width: 17ch; line-height: 1.4; }
    .showcase-count-5, .showcase-count-6 { height: 565px; max-width: 365px; }
    .showcase-count-5 .showcase-node, .showcase-count-6 .showcase-node { width: 143px; }
    .showcase-count-5 .showcase-node:nth-child(1), .showcase-count-6 .showcase-node:nth-child(1) { left: 23%; top: 15%; }
    .showcase-count-5 .showcase-node:nth-child(2), .showcase-count-6 .showcase-node:nth-child(2) { left: 77%; top: 20%; }
    .showcase-count-5 .showcase-node:nth-child(3), .showcase-count-6 .showcase-node:nth-child(3) { left: 24%; top: 48%; }
    .showcase-count-5 .showcase-node:nth-child(4), .showcase-count-6 .showcase-node:nth-child(4) { left: 76%; top: 53%; }
    .showcase-count-5 .showcase-node:nth-child(5) { left: 49%; top: 84%; }
    .showcase-count-6 .showcase-node:nth-child(5) { left: 23%; top: 82%; }
    .showcase-count-6 .showcase-node:nth-child(6) { left: 77%; top: 87%; }
    .showcase-quiet-hint { font-size: 11px; margin-top: 15px; }
    .showcase-focus { display: grid; grid-template-columns: 1fr; max-width: 520px; gap: 26px; padding: 8px 0 20px; }
    .showcase-copy { max-width: 100%; text-align: left; }
    .showcase-copy h2 { font-size: 37px; line-height: 1.1; margin: 0 0 16px; }
    .showcase-copy > p { font-size: 14px; line-height: 1.8; max-width: 39ch; margin: 0; }
    .showcase-copy .showcase-instruction { font-size: 12px; line-height: 1.7; margin-top: 16px; max-width: 36ch; }
    .showcase-subtle-back { margin: 10px 0 0; font-size: 12px; }
    .showcase-case, .showcase-story { margin-top: 18px; text-align: left; }
    .showcase-case > summary, .showcase-story > summary { font-size: 13px; }
    .showcase-case-start { font-size: 13px; }
    .showcase-case-decisions { gap: 16px; }
    .showcase-case-decisions h3 { font-size: 13px; }
    .showcase-case-decisions p, .showcase-case p, .showcase-story p { font-size: 13px; line-height: 1.8; }
    .showcase-case-boundary, .showcase-credits { font-size: 11px; }
    .showcase-threads { gap: 9px; padding-top: 17px; }
    .showcase-thread { width: 100%; min-height: 60px; }
    .showcase-quay { padding-inline: 12px; }
    .showcase-quay-bar { font-size: 10px; }
    .showcase-quay-bar > span:first-child { font-size: 14px; }
    .showcase-activity { gap: 8px; padding-inline: 7px; }
    .showcase-activity strong { font-size: 11px; }
    .showcase-activity small, .showcase-activity-meta { font-size: 10px; }
    .showcase-quay-detail p { font-size: 11px; }
    .showcase-match { padding-inline: 17px; }
    .showcase-fixture { gap: 17px; }
    .showcase-fixture strong { font-size: 11px; }
    .showcase-match > header small { font-size: 10px; }
    .showcase-answer > strong { font-size: 11px; }
    .showcase-quiz-footer, .showcase-answer-reveal p { font-size: 10px; }
    .showcase-game-next { font-size: 11px; }
    .showcase-reader-sheet > p { font-size: 13px; }
    .showcase-reader-page { min-height: 320px; }
    .media-portals-four .media-portal strong { font-size: 16px; }
    .media-portals-four .media-portal > span:last-child { font-size: 11px; max-width: 16ch; margin-inline: auto; }
    .media-artist { font-size: 32px; }
    .media-film-copy h3 { font-size: 31px; }
    .media-track-title, .media-film-copy > p { font-size: 12px; }
    .media-film-tile { width: 86px; }
    .media-film-tile strong { font-size: 10px; }
    .media-player-caption { font-size: 10px; }
    .media-film-thread, .media-finished-next, .media-live-button { font-size: 11px; }
    .media-bottom { font-size: 10px; gap: 12px; }
    .media-bottom > button { font-size: 11px; }
    .shelf-object strong { font-size: 12px; }
    .shelf-note, .shelf-thread > p { font-size: 13px; }
    .shelf-focus-copy { text-align: left; }
    .shelf-thread > button { text-align: left; justify-content: flex-start; }
    .shelf-focus-navigation button { font-size: 11px; }
    .shelf-credit { font-size: 12px; }
    .made-copy { text-align: left; }
    .made-story { font-size: 13px; }
    .discovery { right: 14px; width: min(420px, calc(100vw - 28px)); border-radius: 16px; }
    .discovery-result { min-height: 82px; padding-inline: 7px; gap: 11px; }
    .discovery-result strong { font-size: 14px; }
    .discovery-result small { font-size: 11px; }
    .discovery-result-enter { padding: 5px; }
    .discovery-foot { padding-inline: 6px; }
  }
  @media (max-width: 600px) and (max-height: 740px) {
    .person h1 { font-size: 22px; }
    .person > p { font-size: 12px; margin-top: 6px; }
    .chill-toggle { min-height: 33px; margin-top: 11px; }
    .world-toolbar { height: 70px; }
    .world-footer { height: 82px; }
    .world-stage { padding-top: 10px; }
    .showcase-heading { margin-top: 8px; }
  }
  @media (max-width: 360px) {
    .header, .footer { left: 17px; right: 14px; }
    .wordmark { font-size: 21px; }
    .world-stage { padding-inline: 20px; }
    .world-nav { gap: 12px; padding-inline: 13px; }
    .showcase-count-5, .showcase-count-6 { height: 535px; }
    .showcase-count-5 .showcase-node, .showcase-count-6 .showcase-node { width: 128px; }
    .showcase-node .showcase-node-inner > strong { font-size: 12px; }
    .showcase-node .showcase-node-note { font-size: 10px; }
    .showcase-copy h2 { font-size: 34px; }
    .showcase-copy > p { font-size: 13px; }
    .showcase-match { padding-inline: 14px; }
    .showcase-activity-mark { width: 24px; height: 24px; }
    .showcase-activity-meta { font-size: 9px; }
    .discovery-art { width: 43px; height: 43px; }
  }
  .motion-paused .showcase-case > summary > span { transition: none; }
  @media (prefers-reduced-motion: reduce) {
    .showcase-case > summary > span { transition: none; }
  }
}

@layer accessibility {
  :is(.wordmark, .memoji, .bubble, .showcase-node, .media-portal, .made-node, .shelf-object,
      .world-back, .world-exit, .mini-bubble, .showcase-subtle-back, .showcase-thread,
      .showcase-case > summary, .showcase-story > summary, .showcase-focus button,
      .discovery button, .keys-button, .find-button, .chill-toggle, .wander-button,
      .motion-toggle, .bubble-reset):focus-visible {
    outline: 2px solid #426a84;
    outline-offset: 5px;
  }
  .discovery-search input:focus-visible { outline: none; }
  .discovery-search:focus-within { box-shadow: 0 2px 0 -1px #426a84; }
  .showcase-quiz button:focus-visible { outline-color: #f6dda3; }
  .mood-matrix:not(.chill-mode) :is(.bubble, .keys-button, .find-button, .chill-toggle, .motion-toggle):focus-visible { outline-color: #b9e9cb; }
  @media (prefers-contrast: more) {
    :root { --quiet-ink: #344f65; --craft-caption: #344f65; }
    .bubble, .showcase-node, .media-orb { border: 1px solid currentColor; }
    .showcase-node .showcase-node-note, .showcase-copy > p, .person > p { color: #344f65; }
    .discovery-result { border: 1px solid transparent; }
    .discovery-result.is-selected { border-color: #426a84; }
  }
  @media (forced-colors: active) {
    .bubble, .showcase-node, .mini-bubble, .media-orb, .world-nav, .discovery { border: 1px solid ButtonText; }
    .bubble::before, .bubble::after, .showcase-node-glint { display: none; }
    :is(button, a, summary):focus-visible { outline-color: Highlight; }
  }
}

/* The five objects share a little more physical presence while keeping their
   existing geometry as the single source for dragging and portal journeys. */
@layer craft {
  .wordmark, .person h1, .bubble-label {
    font-family: 'Portfolio Bricolage', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  }
  .wordmark {font-weight: 700; letter-spacing: -.055em;}
  .person h1 {font-weight: 620; letter-spacing: -.045em;}
  .bubble-label {font-size: clamp(16px, 1.45vw, 22px); font-weight: 640; letter-spacing: -.035em;}
  .bubble {
    border-color: rgb(var(--tint) / .34);
    background:
      radial-gradient(ellipse at var(--shine-x, 28%) var(--shine-y, 20%), #fffffff2 0%, #ffffff72 8%, transparent 27%),
      radial-gradient(ellipse at 70% 78%, rgb(var(--tint) / .17), transparent 65%),
      linear-gradient(145deg, #ffffff56, #ffffff14 55%, rgb(var(--tint) / .045));
    box-shadow: inset 0 2px 4px #fffffff0, inset 0 -5px 12px #ffffff80,
      inset -3px -2px 11px rgb(var(--tint) / .10), 0 20px 30px -23px rgb(var(--tint) / .7);
  }
  @media (min-width:1101px) and (min-aspect-ratio:13/10) and (min-height:651px) {
    .scene .bubble-position {width:16.4%;}
    .scene .position-play {width:14.4%;}
  }
  @media (min-width:601px) and (max-width:1100px) and (min-height:651px) {
    .scene .bubble-position {width:18.4%;}
  }
  @media (max-width:600px) and (min-height:741px) {
    .scene .bubble-position {width:clamp(100px,29vw,142px);}
    .bubble-label {font-size:clamp(13px,3.5vw,15px);}
  }
  @media (max-width:600px) and (max-height:740px) {
    .scene .bubble-position {width:clamp(88px,24vw,102px);}
    .bubble-label {font-size:12px;}
  }
  @media (prefers-contrast:more) {.bubble {border:2px solid currentColor;}}
}
@layer craft {
  @media (min-width:1101px) and (min-aspect-ratio:13/10) and (min-height:651px) {
    .scene .position-play {top:95%;}
  }
  @media (max-width:340px) and (max-height:740px) {
    .scene .bubble-position {width:85px;}
    .scene .position-music {left:17%;}
    .scene .position-apps {left:83%;}
  }
}
@layer craft {
  /* A shorter desktop has no room for the fifth circle directly under the
     introduction. Give it its own station instead of covering Chill. */
  @media (min-width:601px) and (max-width:1100px) and (min-height:651px),
    (min-width:1101px) and (min-height:651px) and (max-height:1100px) and (max-aspect-ratio:13/10),
    (min-width:1101px) and (min-height:651px) and (max-height:860px) and (min-aspect-ratio:13/10) {
    .scene .position-play {left:72%;top:91%;}
  }
}


/* world-delight.css */
/* Borrowed light: the current world reaches the visitor before it is entered.
   All colour fields are static. Only their opacity changes. */
@layer experience {
  .memoji .hello-bubble {
    left: 50%; right: auto; top: auto; bottom: 0;
    white-space: nowrap; font-size: 11px; padding: 6px 11px;
    border-radius: 18px;
    transform: translate(-50%, 5px) scale(.94);
    transition: opacity 180ms var(--ease), transform 240ms var(--ease);
  }
  .memoji:is(:hover, :focus-visible, .greeting) .hello-bubble { opacity: 1; transform: translate(-50%, 0); }
  .memoji:focus-visible { outline: 2px solid #7b96b6; outline-offset: 4px; border-radius: 40%; }
  .world-delight-light, .world-delight-wash { position: absolute; inset: 0; pointer-events: none; }
  .world-delight-light { overflow: hidden; }
  .world-delight-wash { opacity: 0; transition: opacity 560ms cubic-bezier(.22, 1, .36, 1); }
  .world-delight-wash-music {
    background: radial-gradient(ellipse at 20% 57%, #bda6df47, #cdbce81c 42%, #e2d8f000 75%),
      radial-gradient(ellipse at 77% 26%, #bca8df2e, #d9cdeb00 61%);
  }
  .world-delight-wash-projects {
    background: radial-gradient(ellipse at 34% 30%, #a6cce236, #dcebf400 71%);
  }
  .world-delight-wash-games {
    background: radial-gradient(ellipse at 70% 29%, #e7bf7936, #f1dfc000 70%);
  }
  .world-delight-wash-apps {
    background: radial-gradient(ellipse at 78% 54%, #9ecfbf32, #d7ece300 71%);
  }
  .world-delight-light[data-active="music"] .world-delight-wash-music,
  .world-delight-light[data-active="projects"] .world-delight-wash-projects,
  .world-delight-light[data-active="games"] .world-delight-wash-games,
  .world-delight-light[data-active="apps"] .world-delight-wash-apps { opacity: 1; }
  .world-delight-reflection {
    position: absolute;
    inset: 1px;
    z-index: 0;
    border-radius: inherit;
    pointer-events: none;
  }
  .world-delight-flash {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0;
    background: radial-gradient(ellipse at 31% 18%, #ffffffc7, #ffffff00 58%),
      radial-gradient(ellipse at 78% 77%, rgb(var(--tint) / .32), rgb(var(--tint) / 0) 72%);
  }
  /* The quiet resting reflection is a separate pseudo-layer, so finite beat
     feedback never resets an inherited bubble or icon transform. */
  .world-delight-reflection::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(ellipse at 26% 72%, #c5afe555, #c5afe500 70%);
    opacity: 0;
    transition: opacity 560ms cubic-bezier(.22, 1, .36, 1);
  }
  body[data-overview-light="music"] .world-delight-reflection.is-borrowing::before { opacity: 1; }
  .motion-paused .world-delight-wash, .motion-paused .world-delight-reflection::before, .motion-paused .memoji .hello-bubble { transition: none; }
  @media (prefers-reduced-motion: reduce) { .world-delight-wash, .world-delight-reflection::before, .memoji .hello-bubble { transition: none; } }
  @media (forced-colors: active) { .world-delight-light, .world-delight-reflection { display: none; } }
}


/* cinema-hover-v15.css */
@layer experience {
  /* The colour comes from the actual poster. The light is a fixed gradient,
     faded as a layer: no animated blur, radius, dimensions or shadow. */
  .media-cinema{--cinema-rgb:24 48 72;--cinema-companion:48 96 120;}
  .cinema-ambilight{position:absolute;inset:-35% -30%;z-index:-1;pointer-events:none;opacity:.32;background:radial-gradient(ellipse at 22% 49%,rgb(var(--cinema-rgb)/.32),transparent 59%),radial-gradient(ellipse at 82% 64%,rgb(var(--cinema-companion)/.25),transparent 59%);transition:opacity 420ms;}
  .media-films.cinema-looking .cinema-ambilight{opacity:.9;}
  .media-films .media-cinema-poster{height:88%;width:44%;left:28%;top:6%;transform:rotate(-2deg);transition:transform 380ms cubic-bezier(.22,1,.36,1);}
  .media-films.cinema-looking .media-cinema-poster{transform:translateY(-2px) rotate(0deg) scale(1.035);}
  .media-film-tile[data-cinema-looking]{opacity:1;transform:translateY(-7px);}
  .cinema-hover-video{position:absolute;inset:0;z-index:2;border-radius:inherit;overflow:hidden;pointer-events:none;background:#17212a;opacity:0;transition:opacity 240ms;}
  .cinema-previewing .cinema-hover-video{opacity:1;}
  .cinema-hover-video[hidden]{display:none!important;}
  .cinema-hover-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none;}
  .media-films.cinema-previewing .media-trailer-button{z-index:4;}
  .cinema-portal .media-orb{isolation:isolate;}
  .cinema-portal .media-orb::before{content:'';position:absolute;inset:-35%;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(ellipse,rgb(var(--cinema-rgb)/.22),rgb(var(--cinema-companion)/.06) 43%,transparent 68%);transition:opacity 420ms;}
  .cinema-portal:focus-visible .media-orb::before{opacity:1;}
  .cinema-portal:focus-visible .media-orb-poster.one{transform:translate(-4%,-5%) rotate(-6deg) scale(1.2);}
  .cinema-portal:focus-visible .media-orb-poster.two{transform:translate(9%,0) rotate(13deg) scale(1.08);}
  @media(hover:hover) and (pointer:fine){
    .cinema-portal:hover .media-orb::before{opacity:1;}
    .cinema-portal:hover .media-orb-poster.one{transform:translate(-4%,-5%) rotate(-6deg) scale(1.2);}
    .cinema-portal:hover .media-orb-poster.two{transform:translate(9%,0) rotate(13deg) scale(1.08);}
  }
  .motion-paused .media-cinema-poster,.motion-paused .cinema-ambilight,.motion-paused .cinema-portal .media-orb::before{transition:none;}
  @media(prefers-reduced-motion:reduce){.media-cinema-poster,.cinema-ambilight,.cinema-portal .media-orb::before{transition:none;}}
}


/* collection-art-v15.css */
@layer experience {
  .collection-companion{position:absolute;display:block;object-fit:contain;pointer-events:none;user-select:none;z-index:3;width:clamp(66px,9vw,114px);height:auto;aspect-ratio:1;}
  .collection-companion[hidden]{display:none!important;}
  .media-record-object,.shelf-focus-art,.made-art-object,.media-film-copy{position:relative;}
  .collection-companion-portal{width:35%;right:-1%;bottom:0;transform:rotate(5deg);}
  .collection-companion-music{right:-3%;bottom:-1%;width:29%;transform:rotate(4deg);}
  .collection-companion-made{right:-7%;bottom:14%;width:30%;transform:rotate(4deg);}
  .collection-companion-shelf{right:5%;bottom:1%;width:28%;max-width:105px;transform:rotate(-4deg);}
  .collection-companion-film{position:relative;inset:auto;width:76px;max-width:27%;margin:16px 0 -6px;transform:rotate(-3deg);}
  @media(max-width:600px){
    .collection-companion-portal{width:32%;right:-1%;bottom:3%;}
    .collection-companion-film{position:absolute;width:64px;max-width:none;right:0;top:66px;margin:0;opacity:.9;}
    .media-film-copy:has(.collection-companion-film){padding-right:80px;}
    .collection-companion-made{right:-4%;width:28%;}
    .collection-companion-shelf{right:3%;width:26%;max-width:76px;}
  }
}


/* story-art-v15.css */
/* Illustrative objects live within the optional story; product evidence leads. */
.showcase-story .showcase-story-art {display:block;width:156px;height:156px;max-width:60%;margin:18px auto 15px;pointer-events:none;user-select:none;}
.showcase-story .showcase-story-art img {display:block;width:100%;height:100%;object-fit:contain;border:0;border-radius:0;box-shadow:none;}
.showcase-reader .showcase-reader-art.is-concept-art {display:flex;align-items:center;justify-content:center;height:150px;padding:11px 24px 0;overflow:hidden;background:none;}
.showcase-reader .showcase-reader-art.is-concept-art img {width:100%;height:100%;object-fit:contain;object-position:center;mix-blend-mode:normal;border-radius:0;}
@media(min-width:1000px) and (max-height:950px) {
  .showcase-focus-reading {row-gap:20px;padding-block:8px 16px;}
  .showcase-focus-reading .showcase-reader-page {min-height:260px;}
  .showcase-focus-reading .showcase-threads {padding-top:14px;}
  .showcase-home-games .showcase-count-4 {--garden-node-size:clamp(145px,22svh,190px);height:calc(var(--garden-node-size)*2 + 50px);min-height:calc(var(--garden-node-size)*2 + 50px);}
}
@media(max-width:600px) {
  .showcase-story .showcase-story-art {width:132px;height:132px;margin:16px auto 12px;}
  .showcase-reader .showcase-reader-art.is-concept-art {height:126px;padding-top:9px;}
}


/* world-art-v15.css */
/* Physical miniatures sit inside the existing glass; they do not add controls. */
@layer craft {
  .bubble-content:has(.world-art-main) { gap:0; transform:translateY(1%); }
  .bubble-content>.world-art-main { width:57%; height:57%; object-fit:contain; filter:none; }
  .bubble:has(.world-art-main) .bubble-peek { display:none; }
  @media(hover:hover) and (pointer:fine) {
    .bubble:has(.world-art-main):hover {scale:1.075;}
    .bubble:has(.world-art-main):hover .bubble-content>.world-art-main { opacity:1;transform:translateY(-3px) rotate(-3deg) scale(1.085); }
    .bubble-games:has(.world-art-main):hover .bubble-content>.world-art-main { transform:translateY(-3px) rotate(4deg) scale(1.085); }
  }
  .showcase-node-art>.world-art-portal { width:100%;height:100%;object-fit:contain; }
  @media(max-width:600px) {
    .bubble-content>.world-art-main {width:54%;height:54%;}
  }
  @media(prefers-reduced-motion:reduce) { .bubble:has(.world-art-main):hover{scale:1;}  .bubble:has(.world-art-main):hover .bubble-content>.world-art-main {transform:none;} }
  .motion-paused .bubble:has(.world-art-main):hover {scale:1;}
  .motion-paused .bubble:has(.world-art-main):hover .bubble-content>.world-art-main {transform:none;}
}

/* Account for each object's real silhouette rather than forcing one crop. */
@layer craft {
  .bubble-content>.world-art-main {width:59%;height:59%;}
  .bubble-projects .bubble-content>.world-art-main {width:62%;height:62%;}
  .bubble-games .bubble-content>.world-art-main {width:56%;height:56%;}
  .bubble-apps .bubble-content>.world-art-main {width:61%;height:61%;}
  .bubble-play .bubble-content>.world-art-main {width:58%;height:58%;}
  @media(max-width:600px) {
    .bubble-content>.world-art-main {width:56%;height:56%;}
    .bubble-projects .bubble-content>.world-art-main {width:58%;height:58%;}
    .bubble-games .bubble-content>.world-art-main {width:54%;height:54%;}
    .bubble-apps .bubble-content>.world-art-main {width:58%;height:58%;}
    .bubble-play .bubble-content>.world-art-main {width:55%;height:55%;}
  }
}


/* arrival-v15.css */
@layer experience {
  /* Set only by the guarded, timed prepaint bootstrap. Without JavaScript the
     ordinary fully usable overview remains visible. No overlay receives input. */
  .arrival-pending .scene-content,.arrival-pending .header,.arrival-pending .footer,.arrival-pending .chill-toggle{opacity:0!important;}
  .arrival-active .bubble{animation-play-state:paused!important;}
  .arrival-layer{position:fixed;inset:0;z-index:100;overflow:clip;pointer-events:none;isolation:isolate;}
  .arrival-layer *{pointer-events:none!important;}
  .arrival-curtain{position:absolute;inset:0;}
  .arrival-light{position:absolute;inset:0;background:radial-gradient(ellipse at 26% 34%,#d9edffb0,transparent 54%),radial-gradient(ellipse at 76% 63%,#ede3fd94,transparent 50%);}
  .arrival-orbit-line{position:absolute;border:1px solid #718caa2e;border-radius:50%;transform-origin:50% 50%;}
  .arrival-orbit-line-2{border-color:#b1a0c92b;}
  .arrival-face{position:absolute;transform-origin:0 0;}
  .arrival-face>img{display:block;width:100%;height:100%;object-fit:contain;}
  .arrival-orb{position:absolute!important;margin:0!important;animation:none!important;transition:none!important;translate:none!important;scale:1!important;transform-origin:50% 50%;}
  .arrival-orb .bubble-peek{opacity:0!important;}
  .arrival-orb .bubble-label{opacity:0;}
  .explorer-replay{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:12px;border-top:1px solid #64758b1a;}
  .explorer-replay[hidden],.explorer-replay-status[hidden]{display:none!important;}
  .explorer-replay-button{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:0 4px;background:none;border:0;border-radius:7px;color:#536b7c;font:inherit;font-size:11px;cursor:pointer;}
  .explorer-replay-button>span{font-size:17px;}
  .explorer-replay-button:disabled{cursor:default;opacity:.5;}
  .explorer-replay-button:focus-visible{outline:2px solid #697d92;outline-offset:4px;}
  .explorer-replay-status{font-size:10px;color:#68798a;}
  @media(prefers-reduced-motion:reduce){
    .arrival-pending .scene-content,.arrival-pending .header,.arrival-pending .footer,.arrival-pending .chill-toggle{opacity:1!important;}
    .arrival-layer{display:none;}
  }
}

@layer experience {
  .arrival-introduction {position:absolute;left:24px;right:24px;top:63%;display:flex;align-items:center;flex-direction:column;text-align:center;color:#26323c;}
  .arrival-hello {font-size:clamp(18px,2.2vw,25px);font-weight:450;letter-spacing:-.025em;line-height:1.2;}
  .arrival-name {display:block;margin-top:4px;font-size:clamp(42px,7.2vw,88px);font-weight:650;letter-spacing:-.04em;line-height:1.05;}
  .arrival-invitation {margin-top:19px;font-size:clamp(13px,1.5vw,17px);font-weight:400;letter-spacing:-.015em;color:#526371;}
  .arrival-skip-hint {position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:20px;right:20px;text-align:center;font-size:11px;letter-spacing:.01em;color:#61717f;}
  @media(max-height:540px){.arrival-introduction{top:60%;}.arrival-name{font-size:42px;}.arrival-invitation{margin-top:9px;}}
}

@layer experience {
  .arrival-name {display:flex;justify-content:center;gap:.22em;white-space:nowrap;}
  .arrival-name-word {display:block;}
}

@layer experience {
  .arrival-discover {position:absolute;left:24px;right:24px;text-align:center;color:#26323c;font-size:clamp(22px,2.5vw,32px);font-weight:550;letter-spacing:-.03em;line-height:1.2;}
}

@layer experience {
  .arrival-camera .arrival-name{font-size:clamp(26px,4.4vw,48px);}
  .arrival-camera .arrival-hello{font-size:clamp(12px,1.6vw,18px);}
  .arrival-camera .arrival-invitation{font-size:clamp(10px,1.2vw,14px);margin-top:10px;}
  .arrival-camera .arrival-orb .bubble-label{opacity:0;}
  @media(min-width:601px) and (max-aspect-ratio:13/10){
    .scene{width:min(100vw,1180px);height:calc(100svh - 215px);max-height:1050px;aspect-ratio:auto;top:51%;}
    .person{top:30%;}
    .position-projects{left:29%;top:14%;}.position-games{left:72%;top:18%;}
    .position-music{left:18%;top:61%;}.position-apps{left:83%;top:58%;}
    .position-play{left:69%;top:87%;}
    .droplet-one{top:34%;}.droplet-two{top:81%;}
  }
  @media(min-width:1101px) and (min-aspect-ratio:13/10){
    .scene{width:min(94vw,1480px);height:min(76svh,860px);aspect-ratio:auto;top:51%;}
    .person{top:25%;width:40%;}.memoji{width:52%;}
    .position-projects{left:25%;top:16%;}.position-games{left:72%;top:20%;}
    .position-music{left:14%;top:65%;}.position-apps{left:86%;top:62%;}
    .position-play{left:70%;top:88%;}.bubble-position{width:15%;}
  }
  @media(min-width:601px) and (max-height:650px){
    .scene{height:calc(100svh - 150px);width:min(90vw,1050px);}.person{top:17%;}.bubble-position{width:14%;}
    .position-play{top:82%;}.position-music,.position-apps{top:59%;}
  }
}

@layer experience { .arrival-active .scene{z-index:101;} }

@layer experience { .arrival-active .hello-bubble{opacity:0!important;visibility:hidden;} }

@layer experience {
  .arrival-camera .arrival-hello{font-size:clamp(20px,2.4vw,30px);font-weight:450;}
  .arrival-camera .arrival-name{font-size:clamp(38px,6.4vw,76px);font-weight:650;letter-spacing:-.055em;}
  .arrival-camera .arrival-invitation{font-size:clamp(18px,2vw,25px);margin-top:16px;}
  .arrival-skip-hint{font-size:clamp(13px,1.1vw,16px);}
  .arrival-orbit-line{border-color:#8aa3c83d;box-shadow:inset 0 1px 0 #fff9,0 1px 0 #ffffff87;}
  .arrival-orbit-line-2{border-color:#b4a3cc36;}
  @media(max-width:480px){.arrival-camera .arrival-name{font-size:38px;}.arrival-camera .arrival-invitation{margin-top:10px;}}
  @media(max-height:540px){.arrival-camera .arrival-name{font-size:36px;}.arrival-camera .arrival-hello{font-size:19px;}.arrival-camera .arrival-invitation{font-size:17px;margin-top:8px;}}
}

@layer experience {
  .arrival-introduction{overflow:hidden;contain:layout;}
  .arrival-introduction .arrival-hello{font-size:clamp(20px,2.4vw,28px);}
  .arrival-introduction .arrival-name{font-size:clamp(38px,6vw,76px);}
  .arrival-introduction .arrival-invitation{font-size:clamp(17px,1.8vw,24px);margin-top:12px;}
  @media(max-height:540px){
    .arrival-introduction .arrival-hello{font-size:19px;}
    .arrival-introduction .arrival-name{font-size:36px;}
    .arrival-introduction .arrival-invitation{font-size:17px;margin-top:8px;}
  }
}

@layer experience {
  .arrival-camera{z-index:1;}
  .arrival-introduction{z-index:2;}
  .arrival-skip-hint,.arrival-discover{z-index:3;}
}

@layer experience {
  /* Paired stations share a baseline and float phase. Drag wrappers remain
     independent, so arranging a bubble still behaves exactly as before. */
  .position-projects{left:27%;top:20%;}.position-games{left:73%;top:20%;}
  .position-music{left:16%;top:56%;}.position-apps{left:84%;top:56%;}
  .position-play{left:50%;}
  .bubble-projects,.bubble-games{--delay:0s;}
  .bubble-music,.bubble-apps{--delay:-2.4s;}
  @media(min-width:601px) and (max-aspect-ratio:13/10){
    .position-projects,.position-games{top:16%;}
    .position-music,.position-apps{top:60%;}
  }
  @media(min-width:1101px) and (min-aspect-ratio:13/10){
    .position-projects,.position-games{top:18%;}
    .position-music,.position-apps{top:63%;}
  }
  @media(min-width:601px) and (max-height:650px){
    .position-projects,.position-games{top:14%;}
    .position-music,.position-apps{top:59%;}
  }
  @media(max-width:600px){
    .position-projects{left:25%;}.position-games{left:75%;}
    .position-music{left:18%;}.position-apps{left:82%;}
    .position-projects,.position-games{top:12%;}
    .position-music,.position-apps{top:70%;}
  }
}
@layer experience {
  @media(min-width:601px) and (max-height:650px){
    /* In a short window the fifth station joins the right column, leaving
       the portrait, introduction and Chill control usable in the center. */
    .position-play{left:73%;}
    .person{top:10%;width:44%;}
    .memoji{width:clamp(82px,22svh,124px);}
    .head-shadow{width:64px;height:6px;margin:-10px auto 8px;}
    .person h1{font-size:clamp(18px,3svh,24px);}
    .person p{font-size:11px;margin-top:5px;}
    .chill-toggle{margin-top:10px;min-height:32px;padding:6px 12px;font-size:11px;}
  }
}
@layer experience {
  @media(min-width:1101px) and (min-aspect-ratio:13/10) and (min-height:651px){
    .person{top:16%;}
    .position-play{top:93%;width:13%;}
  }
}
@layer experience {
  @media(min-width:601px) and (max-height:450px){
    .position-play{top:101%;width:12%;}
  }
}


/* atmosphere-v20.css */
@layer experience {
  .overview-atmosphere{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;opacity:1;transition:opacity .6s ease;}
  .atmosphere-plane{position:absolute;inset:-8%;pointer-events:none;transition:transform 1.2s cubic-bezier(.23,1,.32,1),opacity .7s ease;}
  .atmosphere-near{background:radial-gradient(ellipse at 20% 36%,#c4e3f98c,transparent 47%),radial-gradient(ellipse at 82% 68%,#f4d7c178,transparent 43%);}
  .atmosphere-far{background:radial-gradient(ellipse at 76% 24%,#ded0f88c,transparent 45%),radial-gradient(ellipse at 30% 84%,#d2efe578,transparent 40%);opacity:.55;}
  .overview-atmosphere[data-world="music"] .atmosphere-far{opacity:1;}
  .overview-atmosphere[data-world="games"] .atmosphere-near{opacity:1;}
  .overview-atmosphere[data-world="apps"] .atmosphere-far{opacity:.8;}
  .overview-atmosphere[data-world="play"]{opacity:.24;}
  body:is(.detail-open,.chill-mode) .overview-atmosphere{opacity:0;}
  .arrival-atmosphere{position:absolute;inset:-12%;pointer-events:none;}
  .arrival-atmosphere-blue{background:radial-gradient(ellipse at 12% 45%,#9dd4f68c,transparent 48%);}
  .arrival-atmosphere-peach{background:radial-gradient(ellipse at 88% 65%,#efbd9a78,transparent 46%);}
  .arrival-atmosphere-lilac{background:radial-gradient(ellipse at 66% 12%,#c4acf080,transparent 50%);}
  .motion-paused .atmosphere-plane{transition:none;transform:none!important;}
  @media(prefers-reduced-motion:reduce){.atmosphere-plane{transition:none;transform:none!important;}}
}

@layer experience {
  .atmosphere-world{position:absolute;left:50%;top:50%;width:110vmax;height:100vmax;transform:translate(-50%,-50%) scale(.72);opacity:0;pointer-events:none;transition:opacity .6s cubic-bezier(.23,1,.32,1),transform 1s cubic-bezier(.23,1,.32,1);}
  .atmosphere-world-projects{background:radial-gradient(ellipse,#9bcafb70,transparent 62%);}
  .atmosphere-world-games{background:radial-gradient(ellipse,#efc27570,transparent 62%);}
  .atmosphere-world-music{background:radial-gradient(ellipse,#b09ae57c,transparent 62%);}
  .atmosphere-world-apps{background:radial-gradient(ellipse,#8bd1bd70,transparent 62%);}
  .atmosphere-world-play{background:radial-gradient(ellipse,#70b59a85,transparent 62%);}
  .overview-atmosphere[data-world="projects"] .atmosphere-world-projects,
  .overview-atmosphere[data-world="games"] .atmosphere-world-games,
  .overview-atmosphere[data-world="music"] .atmosphere-world-music,
  .overview-atmosphere[data-world="apps"] .atmosphere-world-apps,
  .overview-atmosphere[data-world="play"] .atmosphere-world-play{opacity:1;transform:translate(-50%,-50%) scale(1);}
  .overview-atmosphere[data-world="play"]{opacity:1;}
  .motion-paused .atmosphere-world{transition:none;}
  @media(prefers-reduced-motion:reduce){.atmosphere-world{transition:none;}}
}


/* guide-context-v16.css */
@layer experience {
  #keyboard-guide{max-height:calc(100dvh - 48px);overflow-y:auto;overscroll-behavior:contain;}
  .explorer-current-context[hidden],.explorer-all-shortcuts>summary[hidden]{display:none!important;}
  .explorer-current-context{margin:0 0 18px;}
  .explorer-current-context>p{font-size:11px;line-height:1.6;color:#536b7c;margin:15px 0 0;}
  .explorer-current-context .explorer-shortcuts dd{color:#3f596e;}
  .explorer-all-shortcuts>summary{display:list-item;min-height:36px;align-content:center;font-size:11px;color:#536b7c;cursor:pointer;list-style-position:inside;border-radius:5px;}
  .explorer-all-shortcuts>summary:focus-visible{outline:2px solid #697d92;outline-offset:4px;}
  .explorer-all-shortcuts[open]>summary:not([hidden]){margin-bottom:13px;}
  .explorer-current-context:not([hidden])+.explorer-all-shortcuts{padding-top:6px;border-top:1px solid #64758b1a;}
}


/* cinema-room-v15.css */
/* Films occupy the viewport as a dark viewing room. The world controls remain
   outside the player and no layer intercepts pointer or keyboard input. */
.detail::before {content:'';position:fixed;inset:0;z-index:1;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 18% 42%,rgb(var(--cinema-rgb,24 48 72)/.27),transparent 58%),radial-gradient(ellipse at 85% 66%,rgb(var(--cinema-companion,48 96 120)/.2),transparent 57%),#080a0f;transition:opacity 280ms cubic-bezier(.22,1,.36,1);}
.cinema-room .detail::before {opacity:1;}
.cinema-room .detail {color-scheme:dark;color:#f2f1ed;}
.cinema-room .world-stage {width:100%;padding:5px 4vw 18px;justify-content:flex-start;scrollbar-color:#57606e #11151d;}
.cinema-room .world-toolbar {height:66px;padding:8px 28px 0;}
.cinema-room .world-back,.cinema-room .world-category,.cinema-room .world-exit,.cinema-room .world-find,.cinema-room .world-keys {color:#d2d6df;}
.cinema-room .world-back:hover,.cinema-room .world-find:hover,.cinema-room .world-keys:hover {background:#ffffff12;color:#fff;}
.cinema-room .world-keys kbd,.cinema-room .world-exit kbd {color:#d2d6df;border-color:#ffffff25;background:#ffffff0a;}
.cinema-room .world-footer {height:66px;margin-inline:28px;align-items:center;}
.cinema-room .world-nav {background:#161b23b3;border:1px solid #ffffff1a;box-shadow:none;padding:5px 14px;gap:16px;}
.cinema-room .mini-bubble {width:38px;height:38px;padding:11px;color:#c8ced9;opacity:.65;}
.cinema-room .mini-bubble[aria-pressed=true] {color:#fff;opacity:1;}
.cinema-room .world-nav-label {color:#e4e6eb;}
.cinema-room button:focus-visible {outline:2px solid #dce5f5;outline-offset:4px;}
.cinema-room .media-films {--screen-width:min(78vw,1200px);color:#f2f1ed;max-width:none;margin:0 auto;}
.cinema-room .media-films>.media-heading {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.cinema-room .media-film-focus {display:flex;flex-direction:column;align-items:center;gap:13px;width:100%;max-width:none;}
.cinema-room .media-cinema {width:var(--screen-width);aspect-ratio:16/9;flex:none;border:0;border-radius:7px;box-shadow:0 20px 64px #0008;isolation:isolate;background:#05070a;}
.cinema-room .media-cinema-still,.cinema-room .media-film-video,.cinema-room .cinema-hover-video {border-radius:7px;background:#05070a;}
.cinema-room .media-cinema-still::after {border:0;border-radius:7px;background:linear-gradient(transparent 65%,#05070a80);}
.cinema-room .media-cinema-atmosphere {inset:0;width:100%;height:100%;object-fit:cover;filter:none;opacity:.16;}
.cinema-room .media-cinema .media-cinema-poster {height:89%;width:42%;left:29%;top:5%;object-fit:contain;transform:none;border-radius:2px;box-shadow:0 16px 38px #0007;}
.cinema-room .media-films.cinema-looking .media-cinema-poster {transform:translateY(-2px) scale(1.015);}
.cinema-room .cinema-ambilight {display:none;}
.cinema-room .media-film-copy {display:grid;grid-template-columns:1fr auto;gap:3px 24px;width:var(--screen-width);padding:0;align-items:baseline;}
.cinema-room .media-film-copy h3 {font-size:22px;line-height:1.2;font-weight:550;letter-spacing:-.02em;margin:0;color:#f2f1ed;}
.cinema-room .media-film-copy>p {font-size:12px;line-height:1.5;color:#b7bfcc;margin:0;grid-column:1;}
.cinema-room .media-film-number {position:static;grid-column:2;grid-row:1;font-size:11px;letter-spacing:.06em;color:#b7bfcc;margin:0;font-variant-numeric:tabular-nums;}
.cinema-room .media-film-number i {color:#737e90;}
.cinema-room .media-film-thread {grid-column:2;grid-row:2;margin:0;min-height:28px;font-size:11px;color:#c4ccda;text-align:right;justify-content:flex-end;}
.cinema-room .collection-companion-film {display:none;}
.cinema-room .media-trailer-button {min-height:44px;bottom:20px;padding:10px 17px;border:1px solid #ffffff52;background:#101720c9;color:#fff;border-radius:8px;font-size:12px;backdrop-filter:none;}
.cinema-room .media-trailer-button:hover {background:#273240;}
.cinema-room .media-poster-label {color:#d4dae3;font-size:12px;}
.cinema-room .media-video-close {width:44px;height:44px;padding:12px;background:#0a101cdb;border-color:#ffffff52;}
.cinema-room .media-film-shelf {display:flex;justify-content:center;align-items:flex-start;gap:17px;width:var(--screen-width);max-width:none;overflow-x:auto;overflow-y:hidden;margin:18px auto 0;padding:9px 5px 8px;scrollbar-width:thin;scrollbar-color:#4b5565 transparent;scroll-snap-type:x proximity;overscroll-behavior-x:contain;}
.cinema-room .media-film-tile {width:66px;flex:0 0 66px;opacity:.6;border-radius:4px;color:#c4ccd9;transform:none;scroll-snap-align:center;}
.cinema-room .media-film-tile>span {border:1px solid #ffffff26;border-radius:3px;box-shadow:none;}
.cinema-room .media-film-tile strong {font-size:10px;line-height:1.3;margin-top:7px;color:inherit;font-weight:450;}
.cinema-room .media-film-tile[aria-pressed=true],.cinema-room .media-film-tile[data-cinema-looking] {opacity:1;transform:translateY(-4px);color:#f4f6fa;}
.cinema-room .media-film-tile[aria-pressed=true]>span {border-color:#e2e7ef;box-shadow:none;}
@media(hover:hover) and (pointer:fine) {
  .cinema-room .media-film-tile:hover {opacity:1;transform:translateY(-4px);}
}
.cinema-room .media-bottom {width:var(--screen-width);max-width:none;margin:10px auto 0;gap:20px;}
.cinema-room .media-bottom>button,.cinema-room .media-film-navigation button {color:#c4ccda;font-size:12px;}
.cinema-room .media-film-navigation {max-width:75%;gap:15px;}
.cinema-room ::selection {background:#4a5c78;color:#fff;}
@media(min-width:1000px) and (max-height:950px) {
  .cinema-room .media-films {--screen-width:min(78vw,calc((100dvh - 375px)*16/9),1200px);}
  .cinema-room .media-film-shelf {margin-top:11px;gap:16px;}
  .cinema-room .media-film-tile {width:55px;flex-basis:55px;}
  .cinema-room .media-film-tile strong {font-size:9px;}
  .cinema-room .media-film-thread {min-height:22px;}
}
@media(max-width:700px) {
  .cinema-room .world-toolbar {height:65px;padding-inline:16px;}
  .cinema-room .world-stage {padding:8px 0 20px;}
  .cinema-room .media-films {--screen-width:100%;}
  .cinema-room .media-cinema {width:100%;border-radius:0;}
  .cinema-room .media-cinema-still,.cinema-room .media-film-video,.cinema-room .cinema-hover-video,.cinema-room .media-cinema-still::after {border-radius:0;}
  .cinema-room .media-film-copy {width:100%;padding:0 20px;gap:6px 12px;}
  .cinema-room .media-film-copy h3 {font-size:22px;}
  .cinema-room .media-film-copy>p {font-size:12px;grid-column:1/-1;}
  .cinema-room .media-film-thread {grid-column:1/-1;grid-row:auto;justify-content:flex-start;text-align:left;min-height:36px;}
  .cinema-room .media-film-shelf {width:100%;justify-content:flex-start;padding:10px 20px 9px;gap:15px;margin-top:20px;}
  .cinema-room .media-film-tile {width:67px;flex-basis:67px;}
  .cinema-room .media-film-tile strong {font-size:10px;}
  .cinema-room .media-bottom {width:calc(100% - 40px);gap:12px;margin-top:14px;}
  .cinema-room .media-film-navigation button {font-size:11px;}
  .cinema-room .world-footer {height:67px;margin-inline:0;}
  .cinema-room .world-nav {gap:13px;}
}
.motion-paused .detail::before {transition:none;}
@media(prefers-reduced-motion:reduce) {.detail::before {transition:none;}}

/* The selected films are a doorway into the complete film collection. */
.cinema-room .media-film-more {width:var(--screen-width);margin:0 auto;display:flex;justify-content:flex-end;}
.cinema-room .media-film-more button {min-height:44px;padding:8px 4px 8px 14px;border:0;border-radius:8px;background:transparent;color:#c4ccda;font-size:14px;line-height:1.3;transition:color 180ms ease,transform 180ms ease;}
.cinema-room .media-film-more button span {display:inline-block;margin-left:4px;}
@media(hover:hover) and (pointer:fine){.cinema-room .media-film-more button:hover {color:#fff;transform:translateX(3px);}}
@media(max-width:700px){.cinema-room .media-film-more {padding-inline:20px;}}
@media(prefers-reduced-motion:reduce){.cinema-room .media-film-more button{transition:none;}}


/* brand-truth-v15.css */
/* Product identity stays inside its artifact. Float's surrounding glass is unchanged.
   Sources: ART-PROVENANCE-V15-BRANDS.json. */
@font-face {font-family:Portfolio Bungee;src:url('assets/fonts/bungee-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap;}
@font-face {font-family:Portfolio Hanken;src:url('assets/fonts/hanken-grotesk-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap;}
@font-face {font-family:Portfolio Bricolage;src:url('assets/fonts/bricolage-grotesque-latin.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap;}

/* Site captures are actual work, without an invented device frame. */
.showcase-node-brand .showcase-node-art {width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:10px;background:#111526;box-shadow:0 12px 22px #26304118;}
.showcase-node-brand .showcase-node-art img {width:100%;height:100%;object-fit:cover;object-position:top;}
.showcase-node-brand .showcase-node-inner {gap:12px;}

/* Kwisje: the studio's navy and gold, its Bungee sign and answer panels. */
.showcase-quiz {background:#0c1736;color:#f9f8f1;border:0;border-radius:14px;box-shadow:0 20px 45px #14213b21;padding:23px;font-family:Portfolio Hanken,system-ui,sans-serif;}
.showcase-quiz .showcase-product-lockup {display:flex;gap:9px;align-items:center;}
.showcase-quiz .showcase-product-lockup>strong {font:400 22px/1.1 Portfolio Bungee,sans-serif;letter-spacing:0;color:#ffdc5a;}
.showcase-quiz .showcase-product-lockup img {width:25px;height:25px;border-radius:5px;}
.showcase-quiz:not(.showcase-quiz-music) .showcase-product-lockup img {display:none;}
.showcase-quiz .showcase-round-count {color:#d3d9eb;opacity:1;letter-spacing:.04em;}
.showcase-quiz .showcase-question-category {color:#f0ce60;font-size:11px;letter-spacing:.02em;text-transform:none;}
.showcase-quiz .showcase-question {font-size:24px;font-weight:720;line-height:1.3;letter-spacing:-.02em;min-height:unset;margin:11px 0 25px;}
.showcase-quiz .showcase-answer {border-radius:6px;background:#172a5a;border:1px solid #6b7492;color:#f8f7f1;min-height:54px;gap:10px;}
.showcase-quiz .showcase-answer>span {border:0;border-radius:0;color:#f4d569;font-size:12px;font-weight:700;width:15px;}
.showcase-quiz .showcase-answer>strong {font-size:13px;font-weight:600;}
.showcase-quiz .showcase-answer:not(:disabled):hover {background:#243b73;border-color:#f1ce57;}
.showcase-quiz .showcase-answer[data-result=correct] {background:#334c29;border-color:#b6d88b;color:#fff;}
.showcase-quiz .showcase-answer[data-result=wrong] {background:#513042;border-color:#e39aab;color:#fff0f2;}
.showcase-quiz .showcase-answer[data-result=quiet] {opacity:.55;}
.showcase-quiz .showcase-answer-reveal p,.showcase-quiz .showcase-quiz-footer {font-size:12px;line-height:1.55;color:#c7d1e7;}
.showcase-quiz .showcase-game-keys {font-size:10px;opacity:1;}
.showcase-quiz .showcase-game-next {border-radius:7px;min-height:44px;background:#ffda55;color:#18203b;font-size:12px;font-weight:750;padding:10px 14px;}
.showcase-quiz .showcase-game-next:hover {background:#ffe480;}
.showcase-quiz button:focus-visible {outline:2px solid #ffdf65;outline-offset:3px;}

/* Ik wist het!: the actual Sticker Arcade world, deliberately contained. */
.showcase-quiz.showcase-quiz-music {background:#15101d;color:#fff8f0;font-family:Portfolio Hanken,system-ui,sans-serif;}
.showcase-quiz-music .showcase-product-lockup>strong {font-size:18px;color:#fff8f0;}
.showcase-quiz-music .showcase-product-lockup em {font-style:normal;color:#f23197;}
.showcase-quiz-music .showcase-clip-play {width:96px;filter:none;}
.showcase-quiz-music .showcase-clip-record {background:#30203e;box-shadow:none;border:2px solid #8b5cf6;}
.showcase-quiz-music .showcase-clip-record i {background:#ff5c1a;}
.showcase-quiz-music .showcase-clip-symbol {color:#fff8f0;}
.showcase-quiz-music .showcase-clip-type,.showcase-quiz-music .showcase-clip-time {color:#d9cfe6;font-size:11px;}
.showcase-quiz-music .showcase-quiz-listen h3 {font:400 24px/1.25 Portfolio Bungee,sans-serif;letter-spacing:0;color:#fff8f0;}
.showcase-quiz-music .showcase-answer {background:#261c33;border:1px solid #705982;border-radius:7px;color:#fff8f0;}
.showcase-quiz-music .showcase-answer>span {color:#e3b9ff;}
.showcase-quiz-music .showcase-answer:not(:disabled):hover {background:#382447;border-color:#f23197;}
.showcase-quiz-music .showcase-game-next {background:#ff5c1a;color:#170c0a;border:2px solid #0a0710;border-radius:7px;box-shadow:0 3px 0 #a22e09;}
.showcase-quiz-music .showcase-game-next:hover {background:#ff7b44;}
.showcase-quiz-music .showcase-answer-reveal strong {color:#ffc53d;}
.showcase-quiz-music .showcase-answer-reveal p,.showcase-quiz-music .showcase-quiz-footer {color:#d9cfe6;}
.showcase-quiz-music .showcase-clip-progress {accent-color:#ff5c1a;}

/* Songronde is a different project, with its own dark stage and acid vote. */
.showcase-song {background:#0e0f14;color:#f4f2ec;border:0;box-shadow:0 20px 45px #17201e24;border-radius:14px;font-family:Portfolio Bricolage,system-ui,sans-serif;padding:23px;}
.showcase-song>header>strong {font-size:27px;letter-spacing:-.02em;font-weight:800;color:#f4f2ec;}
.showcase-song>header>strong>span {display:none;}
.showcase-song>header>small {font-size:11px;color:#b9bbc6;}
.showcase-song .showcase-song-themes {gap:6px;flex-wrap:wrap;}
.showcase-song .showcase-song-themes button {min-height:44px;padding:8px 10px;font-size:11px;border:1px solid #505461;border-radius:7px;background:#171923;color:#d2d3db;}
.showcase-song .showcase-song-themes button[aria-pressed=true] {background:#e8ff47;color:#0e0f14;border-color:#e8ff47;}
.showcase-song>h3 {font-size:21px;line-height:1.25;font-weight:750;color:#f4f2ec;}
.showcase-song .showcase-song-card {background:#171923;border:0;border-radius:7px;padding:11px;gap:10px;}
.showcase-song .showcase-song-card strong {font-size:13px;color:#f4f2ec;font-weight:650;}
.showcase-song .showcase-song-card small {font-size:11px;color:#b9bbc6;}
.showcase-song .showcase-song-card>button:first-child {width:44px;height:44px;border-radius:50%;background:#2a2e3b;color:#f4f2ec;font-size:13px;}
.showcase-song .showcase-song-card>button[aria-pressed=true] {background:#e8ff47;color:#0e0f14;}
.showcase-song .showcase-song-card>button:last-child {min-height:44px;padding:8px 11px;font-size:12px;background:#e8ff47;color:#0e0f14;border-radius:7px;font-weight:700;}
.showcase-song .showcase-song-card>button.is-voted {background:#5cffb1;color:#0e0f14;}
.showcase-song .showcase-song-person {font-size:11px;color:#e8ff47;}
.showcase-song .showcase-song-status,.showcase-song .showcase-contained-note {font-size:12px;line-height:1.55;color:#b9bbc6;}
.showcase-song .showcase-song-reveal button {background:#e8ff47;color:#0e0f14;min-height:44px;border-radius:7px;font-size:12px;font-weight:700;}
.showcase-song button:focus-visible {outline:2px solid #e8ff47;outline-offset:3px;}

@media(max-width:600px) {
  .showcase-quiz,.showcase-song {padding:19px 16px;border-radius:12px;}
  .showcase-quiz .showcase-question {font-size:22px;}
  .showcase-quiz .showcase-answer>strong {font-size:12px;}
  .showcase-quiz .showcase-answer {padding:11px 9px;gap:7px;}
  .showcase-quiz-music .showcase-quiz-listen {gap:16px;}
  .showcase-quiz-music .showcase-quiz-listen h3 {font-size:22px;}
  .showcase-quiz-music .showcase-clip-play {width:82px;}
  .showcase-song .showcase-song-card {gap:8px;padding:9px;}
  .showcase-song .showcase-song-card strong {font-size:12px;}
  .showcase-song .showcase-song-card>button:last-child {padding:8px;font-size:11px;}
}


/* rooms-hud-v24.css */
/* Resolution-aware room presentation. No injected controls, copied brands or
   perpetual motion. The original real covers remain the room's focal objects. */
.detail[data-room-identity] {--room-unit:clamp(16px,1.35vw,25px);--room-edge:clamp(20px,3.5vw,72px);--room-signal:94 137 181;}
.detail[data-room-identity=projects] {--room-signal:91 141 201;}
.detail[data-room-identity=games] {--room-signal:211 153 53;}
.detail[data-room-identity=apps] {--room-signal:74 154 139;}
.detail[data-room-identity=music] {--room-signal:155 116 186;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-atmosphere {
  background:radial-gradient(ellipse at 50% 70%,rgb(var(--room-signal)/.13),transparent 65%),linear-gradient(160deg,#fbfcfd,#edf2f5);
}
.detail[data-room-identity=games] .world-atmosphere {background:radial-gradient(ellipse at 65% 64%,#f5d18b45,transparent 60%),#f5f4ed;}
.detail[data-room-identity=apps] .world-atmosphere {background:radial-gradient(ellipse at 65% 65%,#91cdb92e,transparent 60%),#f0f5f2;}
.detail[data-room-identity=music]:not([data-room-mode=cinema]) .world-atmosphere {background:radial-gradient(ellipse at 35% 60%,#c1a7df35,transparent 60%),#f5f2f7;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-toolbar {height:clamp(76px,11dvh,114px);padding:12px var(--room-edge) 0;}
.detail[data-room-identity]:not([data-room-mode=play]) :is(.world-back,.world-category,.world-keys) {font-size:var(--room-unit);min-height:52px;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-category svg {width:24px;height:24px;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-back>span:first-child {font-size:32px;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-stage {width:100%;max-width:none;padding:12px var(--room-edge) 30px;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-footer {height:clamp(94px,13dvh,138px);margin:0 var(--room-edge);align-items:center;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-nav {gap:clamp(14px,2.3vw,40px);padding:7px 24px;box-shadow:none;background:#ffffff70;}
.detail[data-room-identity]:not([data-room-mode=play]) .mini-bubble {width:clamp(48px,4.5vw,68px);height:clamp(48px,4.5vw,68px);padding:15px;}
.detail[data-room-identity]:not([data-room-mode=play]) .world-exit {font-size:var(--room-unit);min-height:48px;top:auto;}
.detail[data-room-mode=gallery] :is(.showcase-home,.media-home) {max-width:1500px;width:100%;margin:auto;}
.detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) {margin:0 auto clamp(8px,2dvh,28px);text-align:center;}
.detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) h2 {font-size:clamp(36px,4.8vw,80px);line-height:1.08;letter-spacing:-.045em;max-width:1100px;margin:auto;text-wrap:balance;}
.detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) p {font-size:var(--room-unit);margin-top:16px;line-height:1.5;color:#697b88;}
.detail[data-room-mode=gallery] .showcase-garden {width:min(1350px,100%);height:clamp(330px,47dvh,640px);}
.detail[data-room-mode=gallery] .showcase-node {width:clamp(200px,min(24vw,35dvh),360px);}
.detail[data-room-mode=gallery] .showcase-node-inner>strong {font-size:clamp(20px,2.1vw,32px);letter-spacing:-.025em;}
.detail[data-room-mode=gallery] .showcase-node-note {font-size:clamp(14px,1.2vw,18px);top:calc(100% + 18%);}
.detail[data-room-mode=gallery] :is(.showcase-quiet-hint,.showcase-garden-back) {font-size:var(--room-unit);min-height:44px;}
.detail[data-room-mode=gallery] .media-portals {width:100%;max-width:1350px;gap:clamp(15px,3vw,55px);}
.detail[data-room-mode=gallery] .media-portal {min-width:0;}
.detail[data-room-mode=gallery] .media-orb {width:clamp(150px,18vw,290px);height:auto;aspect-ratio:1;}
.detail[data-room-mode=gallery] .media-portal>strong {font-size:clamp(21px,2.1vw,32px);}
.detail[data-room-mode=gallery] .media-portal>span:last-child {font-size:clamp(15px,1.3vw,20px);}
/* Artifacts get the stage; explanations stay in the side margin. */
.detail[data-room-mode=artifact] .showcase-focus {max-width:1600px;grid-template-columns:minmax(230px,.65fr) minmax(0,1.7fr);gap:clamp(30px,5vw,95px);padding:16px 0;}
.detail[data-room-mode=artifact] .showcase-copy {max-width:420px;}
.detail[data-room-mode=artifact] .showcase-copy h2 {font-size:clamp(38px,4.6vw,76px);letter-spacing:-.045em;}
.detail[data-room-mode=artifact] .showcase-copy>p {font-size:clamp(18px,1.5vw,25px);line-height:1.55;}
.detail[data-room-mode=artifact] :is(.showcase-story summary,.showcase-game-link,.showcase-instruction,.showcase-subtle-back) {font-size:clamp(16px,1.3vw,22px);line-height:1.5;}
.detail[data-room-mode=artifact] :is(.showcase-story summary,.showcase-game-link,.showcase-subtle-back) {min-height:48px;}
.detail[data-room-mode=artifact] .showcase-story p {font-size:clamp(16px,1.2vw,20px);}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-focus {grid-template-columns:1fr;gap:12px;max-width:1200px;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy {display:flex;align-items:baseline;justify-content:space-between;gap:30px;max-width:none;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy h2 {font-size:clamp(28px,3vw,45px);margin:0;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>p {font-size:clamp(16px,1.4vw,22px);max-width:650px;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>:is(.showcase-story,.showcase-instruction,.showcase-subtle-back,.showcase-game-link) {display:none;}
.detail[data-room-identity=games] :is(.showcase-quiz,.showcase-song) {padding:clamp(24px,3vw,50px);border-radius:24px;min-height:clamp(400px,53dvh,720px);}
.detail[data-room-identity=games] .showcase-quiz .showcase-product-lockup>strong {font-size:clamp(24px,2.8vw,40px);}
.detail[data-room-identity=games] .showcase-quiz .showcase-question {font-size:clamp(28px,3.2vw,48px);line-height:1.2;margin:16px 0 30px;}
.detail[data-room-identity=games] .showcase-quiz .showcase-answer {min-height:clamp(64px,8dvh,100px);padding:18px 24px;gap:18px;}
.detail[data-room-identity=games] .showcase-quiz .showcase-answer>strong {font-size:clamp(20px,2vw,30px);}
.detail[data-room-identity=games] .showcase-quiz :is(.showcase-answer>span,.showcase-question-category,.showcase-round-count,.showcase-game-keys,.showcase-answer-reveal p,.showcase-quiz-footer,.showcase-game-next) {font-size:clamp(15px,1.3vw,22px);}
.detail[data-room-identity=games] .showcase-quiz .showcase-game-next {min-height:54px;padding:14px 24px;}
.detail[data-room-identity=games] .showcase-quiz-music .showcase-clip-play {width:clamp(100px,10vw,165px);}
/* Large local app controls preserve the actual samples, rather than a poster. */
.detail[data-room-mode=artifact] .project-demo {font-size:clamp(15px,1.2vw,21px);}
.detail[data-room-mode=artifact] .project-demo :is(button,input,summary) {font-size:inherit;}
.detail[data-room-mode=artifact] .project-demo :is(small,.pd-activity-name>small,.pd-activity-role,.pd-quay-inspector dd,.pd-quay-inspector dt,.pd-project-group h3,.pd-sample-note) {font-size:clamp(13px,1vw,17px);}
.detail[data-room-mode=artifact] .project-demo :is(.pd-activity-name>strong,.pd-titlebar strong,.pd-inspector-heading strong) {font-size:clamp(16px,1.25vw,22px);}
.detail[data-room-mode=artifact] .project-demo :is(.pd-activity,.pd-titlebar) {min-height:68px;}
.detail[data-room-mode=artifact] .project-demo .pd-quay-list {height:clamp(230px,29dvh,390px);}
.detail[data-room-mode=artifact] .project-demo .pd-quay-inspector {min-height:175px;}
/* Cinema retains its existing edge-to-edge dark player. */
.cinema-room .detail[data-room-mode=cinema] .world-stage {padding-inline:3vw;}
.cinema-room .detail[data-room-mode=cinema] .world-toolbar {height:76px;}
.cinema-room .detail[data-room-mode=cinema] .world-footer {height:95px;}
.cinema-room .detail[data-room-mode=cinema] .world-nav {background:#161b23b3;}
.cinema-room .detail[data-room-mode=cinema] .media-film-copy h3 {font-size:clamp(24px,2.4vw,36px);}
.cinema-room .detail[data-room-mode=cinema] :is(.media-film-copy>p,.media-trailer-button,.media-film-tile strong,.media-film-navigation button,.media-bottom>button) {font-size:clamp(15px,1.3vw,22px);}
@media(hover:hover) and (pointer:fine) {
  .detail[data-room-mode=gallery] :is(.showcase-node,.media-portal):hover {scale:1.045;}
}
@media(max-width:760px) {
  .detail[data-room-identity] {--room-unit:16px;--room-edge:20px;}
  .detail[data-room-identity]:not([data-room-mode=play]) .world-toolbar {height:78px;}
  .detail[data-room-identity]:not([data-room-mode=play]) .world-stage {padding-bottom:24px;}
  .detail[data-room-identity]:not([data-room-mode=play]) .world-footer {height:90px;margin-inline:8px;}
  .detail[data-room-identity]:not([data-room-mode=play]) .world-nav {gap:10px;padding:7px 14px;}
  .detail[data-room-identity]:not([data-room-mode=play]) .mini-bubble {width:44px;height:44px;padding:12px;}
  .detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) h2 {font-size:36px;}
  .detail[data-room-mode=gallery] .showcase-garden {height:500px;min-height:0;}
  .detail[data-room-mode=gallery] .showcase-node {width:min(46vw,210px);}
  .detail[data-room-mode=gallery] .showcase-count-3 .showcase-node:nth-child(1) {left:26%;top:27%;}
  .detail[data-room-mode=gallery] .showcase-count-3 .showcase-node:nth-child(2) {left:73%;top:49%;}
  .detail[data-room-mode=gallery] .showcase-count-3 .showcase-node:nth-child(3) {left:27%;top:73%;}
  .detail[data-room-mode=gallery] .showcase-node-inner>strong {font-size:21px;}
  .detail[data-room-mode=gallery] .showcase-node-note {font-size:14px;top:calc(100% + 15%);}
  .detail[data-room-mode=gallery] .media-portals {display:grid;grid-template-columns:1fr 1fr;gap:30px 16px;padding-top:25px;}
  .detail[data-room-mode=gallery] .media-orb {width:min(38vw,200px);}
  .detail[data-room-mode=gallery] .media-portal>strong {font-size:21px;}
  .detail[data-room-mode=gallery] .media-portal>span:last-child {font-size:14px;}
  .detail[data-room-mode=artifact] .showcase-focus {display:flex;flex-direction:column;align-items:stretch;gap:26px;}
  .detail[data-room-mode=artifact] .showcase-copy {max-width:none;}
  .detail[data-room-mode=artifact] .showcase-copy h2 {font-size:40px;}
  .detail[data-room-mode=artifact] .showcase-copy>p {font-size:18px;}
  .detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy {display:block;}
  .detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy h2 {font-size:30px;}
  .detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>p {font-size:16px;margin-top:10px;}
  .detail[data-room-identity=games] :is(.showcase-quiz,.showcase-song) {padding:24px 18px;border-radius:18px;min-height:430px;}
  .detail[data-room-identity=games] .showcase-quiz .showcase-question {font-size:29px;}
  .detail[data-room-identity=games] .showcase-quiz .showcase-answer {padding:15px 12px;gap:10px;min-height:68px;}
  .detail[data-room-identity=games] .showcase-quiz .showcase-answer>strong {font-size:19px;}
  .detail[data-room-identity=games] .showcase-answers {grid-template-columns:1fr;gap:10px;}
  .detail[data-room-identity=games] .showcase-quiz-footer {flex-wrap:wrap;}
  .detail[data-room-mode=artifact] .project-demo .pd-activity-role {display:none;}
}
@media(prefers-reduced-motion:reduce) {
  .detail[data-room-identity] :is(.showcase-node,.media-portal) {transition:none;}
}
.motion-paused .detail[data-room-identity] :is(.showcase-node,.media-portal) {transition:none;}
/* More than three artifacts need real tracks, not overlapping absolute orbits. */
.detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-items:center;align-items:center;gap:clamp(38px,5dvh,70px) 20px;height:auto;min-height:47dvh;max-width:1200px;padding:20px 0 35px;}
.detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node {position:relative;left:auto;top:auto;translate:none;width:min(100%,clamp(170px,min(20vw,26dvh),270px));}
.detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node-note {top:calc(100% + 10%);}
@media(max-width:760px) {
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) {grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 14px;padding-top:25px;}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node {width:min(100%,200px);}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node-inner>strong {font-size:19px;}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node-note {font-size:12px;}
}
/* Keep the real project story and source link available below the large game.
   Only duplicate navigation/instruction copy is suppressed above the stage. */
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-focus {display:flex;flex-direction:column;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-demo {width:100%;order:-1;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy {width:100%;display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:10px 28px;padding-top:12px;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>.showcase-story {display:block;grid-column:1/-1;margin:0;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>.showcase-game-link {display:flex;grid-column:1/-1;justify-self:start;}
.detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy>p {margin:0;}
@media(max-width:760px) {
  .detail[data-room-identity=games][data-room-mode=artifact] .showcase-copy {display:flex;flex-direction:column;gap:14px;}
}
/* Other game objects use the same readable interaction scale. */
.detail[data-room-identity=games] .showcase-song>header>strong {font-size:clamp(30px,3vw,46px);}
.detail[data-room-identity=games] .showcase-song>h3 {font-size:clamp(25px,2.5vw,40px);}
.detail[data-room-identity=games] .showcase-song :is(.showcase-song-themes button,.showcase-song-card>button:last-child,.showcase-song-reveal button) {font-size:clamp(17px,1.5vw,24px);min-height:54px;padding:12px 18px;}
.detail[data-room-identity=games] .showcase-song .showcase-song-card {padding:18px;gap:20px;}
.detail[data-room-identity=games] .showcase-song .showcase-song-card strong {font-size:clamp(20px,1.8vw,30px);}
.detail[data-room-identity=games] .showcase-song :is(.showcase-song-card small,.showcase-song-status,.showcase-contained-note,header>small) {font-size:clamp(15px,1.3vw,21px);}
.detail[data-room-identity=games] .showcase-song .showcase-song-card>button:first-child {width:54px;height:54px;font-size:20px;}
.detail[data-room-identity=games] .showcase-word {font-size:20px;}
.detail[data-room-identity=games] .showcase-word :is(button,input) {font-size:clamp(20px,2vw,30px);min-height:54px;}
.detail[data-room-identity=games] .showcase-word-board {width:clamp(250px,25vw,390px);}
.detail[data-room-identity=games] :is(.showcase-word-status,.showcase-word>header>span) {font-size:clamp(16px,1.3vw,22px);}
.detail[data-room-identity=games] .showcase-word>header strong {font-size:clamp(28px,2.6vw,40px);}
@media(max-width:760px) {
  .detail[data-room-identity=games] .showcase-song .showcase-song-card {gap:12px;padding:15px 12px;flex-wrap:wrap;}
  .detail[data-room-identity=games] .showcase-song .showcase-song-card strong {font-size:20px;}
  .detail[data-room-identity=games] .showcase-song :is(.showcase-song-themes button,.showcase-song-card>button:last-child) {font-size:17px;padding:10px 13px;}
  .detail[data-room-identity=games] .showcase-word-board {width:min(100%,310px);}
}
/* The room gathers its colour around the artifacts only while attended. */
.detail[data-room-identity]:not([data-room-mode=play]):not([data-room-mode=cinema]) .world-atmosphere::after {content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 65%,rgb(var(--room-signal)/.18),transparent 62%);opacity:0;transition:opacity 480ms cubic-bezier(.22,1,.36,1);}
.detail[data-room-attending=true]:not([data-room-mode=play]):not([data-room-mode=cinema]) .world-atmosphere::after {opacity:1;}
.motion-paused .detail[data-room-identity] .world-atmosphere::after {transition:none;}
@media(prefers-reduced-motion:reduce) {.detail[data-room-identity] .world-atmosphere::after {transition:none;}}
/* Round 2: one shared room plane, with artifacts suspended above it. */
.detail[data-room-mode=gallery] .world-atmosphere::before {content:'';position:absolute;left:-12%;right:-12%;top:48%;height:74%;pointer-events:none;transform:perspective(900px) rotateX(48deg);transform-origin:50% 0;border-top:1px solid rgb(var(--room-signal)/.12);border-radius:50% 50% 0 0;background:radial-gradient(ellipse at 50% 26%,rgb(var(--room-signal)/.10),transparent 64%),linear-gradient(180deg,#ffffff5e,#ffffff08 70%);box-shadow:0 -20px 90px #ffffff8a;}
.detail[data-room-mode=gallery] .showcase-node {box-shadow:inset 0 1px 2px #ffffff,0 24px 30px -20px rgb(var(--room-signal)/.26),0 52px 32px -35px rgb(var(--room-signal)/.20);}
.detail[data-room-mode=gallery] .showcase-trace {display:none;}
/* Short landscape displays use a single row. This keeps every artifact and
   its real description in the room, rather than behind the lower HUD. */
@media(min-width:1000px) and (max-height:850px) {
  .detail[data-room-mode=gallery] .world-toolbar {height:72px;}
  .detail[data-room-mode=gallery] .world-footer {height:90px;}
  .detail[data-room-mode=gallery] .world-stage {padding-top:8px;padding-bottom:8px;overflow-y:auto;}
  .detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) {margin-bottom:12px;}
  .detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading) h2 {font-size:clamp(38px,3.8vw,54px);line-height:1.1;}
  .detail[data-room-mode=gallery] :is(.showcase-heading,.media-heading)>p {display:none;}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) {grid-template-columns:repeat(5,minmax(0,1fr));align-content:center;gap:16px;height:clamp(300px,47dvh,420px);min-height:0;padding:20px 0 35px;max-width:1500px;}
  .detail[data-room-mode=gallery] .showcase-count-4 {grid-template-columns:repeat(4,minmax(0,1fr));max-width:1100px;}
  .detail[data-room-mode=gallery] .showcase-count-6 {grid-template-columns:repeat(6,minmax(0,1fr));}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node {width:min(100%,220px);}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node-inner>strong {font-size:clamp(21px,2vw,28px);}
  .detail[data-room-mode=gallery] :is(.showcase-count-4,.showcase-count-5,.showcase-count-6) .showcase-node-note {font-size:16px;line-height:1.35;}
  .detail[data-room-mode=gallery] .showcase-garden {height:clamp(320px,47dvh,430px);}
  .detail[data-room-mode=gallery] .showcase-quiet-hint {margin:0;font-size:17px;min-height:32px;}
  .detail[data-room-mode=gallery] .media-portals {padding-block:20px;}
}


/* app-rooms-v26.css */
/* App stations open into usable workspaces. No idle animation, no scaled UI.
   Loaded after v25; every rule is restricted to the Apps artifact room. */
.detail[data-room-identity=apps][data-room-mode=artifact] {
  --app-surface:#f8fcf9;--app-accent:#326d59;--app-outline:#9bb8a963;
}
.detail[data-room-identity=apps][data-room-mode=artifact]:has(.world-stage:not(.inner-old) .showcase-focus-matchbar) {
  --world-wall:#ece7dd;--world-floor:#b4a18a;--world-lamp:#ffe2af;
  --world-ink:#3c342b;--world-muted:#786957;--world-line:#b7a28b55;
  --app-accent:#8d6033;--app-outline:#b99a6d6b;
}
.detail[data-room-identity=apps][data-room-mode=artifact]:has(.world-stage:not(.inner-old) .showcase-focus-spoor) {
  --world-wall:#e5ebf6;--world-floor:#9eafcb;--world-lamp:#c5dbff;
  --world-ink:#273c5e;--world-muted:#5c7191;--world-line:#8b9ec158;
  --app-accent:#365d9c;--app-outline:#8fa5cc70;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .world-stage {padding-top:8px;overflow-y:auto;scrollbar-width:thin;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-focus {
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  width:100%;max-width:1260px;min-width:0;gap:18px;margin:0 auto;padding:4px 0 24px;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy {
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:8px 24px;width:100%;max-width:none;text-align:left;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy h2 {
  font-size:clamp(34px,3.5vw,54px);line-height:1.06;letter-spacing:-.045em;margin:0;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy>p {
  font-size:clamp(18px,1.5vw,23px);line-height:1.4;margin:0;max-width:720px;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-story {
  grid-column:1/-1;grid-row:2;max-width:none;margin:0;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story summary {
  min-height:44px;font-size:17px;justify-content:flex-start;margin:0;color:var(--world-muted);
}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story>div {max-width:850px;padding:0 0 12px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story p {font-size:18px;line-height:1.6;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story-meta {font-size:15px;color:var(--world-muted);}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-subtle-back {
  grid-column:3;grid-row:1;margin:0;font-size:18px;min-height:48px;white-space:nowrap;
}
/* The sample has its own contextual instructions, plus the persistent HUD exit. */
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-instruction {display:none;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-demo {
  width:100%;max-width:none;min-width:0;margin:0;position:relative;
  border-radius:20px;box-shadow:0 30px 55px -36px #243e3866;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo {
  width:100%;border:1px solid var(--app-outline);border-radius:18px;
  box-shadow:0 1px 0 #ffffffd9 inset;background:var(--app-surface);font-size:17px;
}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo :is(button,input,summary) {font-size:17px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo :is(small,.pd-sample-note,.pd-menubar,.pd-fixture-meta,.pd-match-status,.pd-context-note,.pd-moment-heading>span,.pd-spoor-session>div>span,.pd-spoor-timeline time) {font-size:15px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo :is(.pd-titlebar,.pd-activity) {min-height:54px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo .pd-titlebar strong {font-size:20px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo .pd-sample-note {padding:10px 18px;line-height:1.4;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo button:focus-visible {outline:3px solid var(--app-accent);outline-offset:-3px;}
/* Matchbar: a matchday desk, with the calendar and the live card in one view. */
@media(min-width:900px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar {display:grid;grid-template-columns:minmax(270px,.8fr) minmax(0,1.5fr);}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-titlebar {grid-column:1/-1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-menubar {grid-column:1/-1;min-height:36px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-match-clubs {grid-column:1;grid-row:3;padding:12px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-match-fixtures {grid-column:1;grid-row:4/6;justify-content:flex-start;padding:4px 12px 14px;border-right:1px solid #d9dce3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-match-main {grid-column:2;grid-row:3/5;margin:14px 22px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-match-actions {grid-column:2;grid-row:5;padding:8px 18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-match-status {grid-column:1/-1;min-height:44px;padding:8px 18px;border-top:1px solid #d9dce3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar>.pd-sample-note {grid-column:1/-1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-titlebar {grid-column:1/-1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-search {grid-column:1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-segments {grid-column:1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-list {grid-column:1;height:clamp(180px,28dvh,320px);}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-inspector {grid-column:2;grid-row:2/5;min-height:0;margin:14px 18px 0;padding:14px 0 0 20px;border-top:0;border-left:1px solid var(--pd-line);}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-foot {grid-column:1/-1;padding-top:10px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-sample-note {grid-column:1/-1;}
}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-score {font-size:clamp(35px,4vw,56px);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-teams {padding:16px 0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-teams strong {font-size:18px;text-align:center;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-club-crest {width:44px;height:44px;font-size:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-timeline {min-height:84px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-timeline-lock {min-height:72px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-timeline-lock :is(strong,small) {font-size:15px;line-height:1.4;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-fixtures button {min-height:60px;flex:none;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-fixtures button :is(strong,span) {font-size:16px;}
/* Spoor: the selected moment is the main surface, the timeline is its rail. */
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-body {grid-template-columns:210px minmax(0,1fr);min-height:280px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button {min-height:74px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline strong {font-size:17px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-view {padding:14px 24px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-moment-heading h3 {font-size:25px;line-height:1.2;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor blockquote {font-size:clamp(24px,2.4vw,36px);line-height:1.4;max-width:760px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-detail {min-height:210px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-moment-source {font-size:13px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector :is(dt,dd,.pd-inspector-heading>div>span) {font-size:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-inspector-heading strong {font-size:21px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity-name>strong {font-size:17px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-search input {height:48px;}
/* Existing native concepts fill the same station instead of a miniature mockup. */
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-mac {height:clamp(340px,50dvh,600px);border-radius:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-koop-menu {width:min(360px,75%);min-width:0;right:8%;top:16%;padding:24px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-koop-menu header strong {font-size:20px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-koop-menu header span {font-size:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-koop-menu :is(button,label) {font-size:18px;min-height:48px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios {padding:24px;border-radius:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios-screen {min-height:clamp(230px,36dvh,480px);}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios-grid button {min-height:64px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios :is(.showcase-wiios-status,.showcase-wiios-channel>span,.showcase-wiios-channel button) {font-size:17px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios-channel button {min-height:48px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-threads {width:100%;margin:0;padding-top:10px;}
@media(max-width:899px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy {grid-template-columns:1fr auto;gap:8px 16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy>p {grid-column:1/-1;grid-row:2;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-story {grid-row:3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-subtle-back {grid-column:2;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-list {height:220px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector {min-height:0;padding-bottom:12px;}
}
@media(max-width:600px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-focus {gap:12px;padding-top:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy h2 {font-size:35px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy>p {font-size:18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo {border-radius:14px;font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo :is(button,input,summary) {font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo .pd-titlebar {padding:10px 12px;gap:8px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo .pd-titlebar small {font-size:13px;max-width:42%;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-teams {gap:8px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-teams strong {font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-fixture-meta {font-size:13px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-actions {grid-template-columns:repeat(2,1fr);padding:8px 12px;gap:4px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-actions button {min-height:48px;background:#e9edf4;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-matchbar .pd-match-actions button[aria-pressed=true] {background:#d9e5fa;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-body {display:flex;flex-direction:column;min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button {min-height:72px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline strong {font-size:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-view {padding:12px 16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-view>.pd-segments button {font-size:14px;padding-inline:6px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-session-sample {font-size:11px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-foot {font-size:13px;flex-wrap:wrap;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-koop-menu {right:5%;width:85%;padding:18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios {padding:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios>footer {flex-wrap:wrap;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-wiios>footer>span:last-child {font-size:14px;letter-spacing:2px;}
}
/* Short landscape keeps the complete instrument above the persistent HUD.
   The story remains a real disclosure in the heading row, expanding naturally. */
@media(min-width:900px) and (max-height:850px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-focus {gap:10px;padding-top:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy {grid-template-columns:auto minmax(0,1fr) auto auto;gap:4px 18px;align-items:center;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy h2 {font-size:38px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy>p {font-size:18px;line-height:1.3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-story {grid-column:3;grid-row:1;position:relative;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story summary {font-size:16px;white-space:nowrap;min-height:48px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-subtle-back {grid-column:4;grid-row:1;font-size:17px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy:has(.showcase-story[open]) {grid-template-columns:auto minmax(0,1fr) auto;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy:has(.showcase-story[open]) .showcase-story {grid-column:1/-1;grid-row:2;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy:has(.showcase-story[open]) .showcase-subtle-back {grid-column:3;}
}
/* On a phone the app itself supplies context; reserve the first view for play.
   The full story is still one explicit tap away, with no positioned overlay. */
@media(max-width:600px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy {grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 12px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy h2 {grid-column:1;grid-row:1;font-size:33px;line-height:1.1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy>p {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-story {grid-column:2;grid-row:1;border-top:0;max-width:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-story summary {font-size:15px;white-space:nowrap;min-height:48px;padding:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy .showcase-subtle-back {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy:has(.showcase-story[open]) .showcase-story {grid-column:1/-1;grid-row:2;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-copy:has(.showcase-story[open]) .showcase-story p {font-size:18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .showcase-focus {gap:8px;}
}
@media(min-width:900px) and (max-height:850px){
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button {min-height:54px;padding-block:6px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-body {min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session {padding-block:10px;}
}


/* matchbar-v26.css */
/* Matchbar: an honest fictional matchday, with a legible broadcast centre.
   Scoped to this sample; no clocks, network data or ambient animation. */
.project-demo.pd-matchbar[data-project-demo] {
  --pd-ink:#182538;--pd-muted:#536176;--pd-line:#d6deea;
  color:var(--pd-ink);background:#edf1f7;border-radius:22px;
  border:1px solid #ffffffc9;box-shadow:0 26px 75px #122c4326;
  font-size:clamp(16px,1.35vw,21px);line-height:1.35;
}
.project-demo.pd-matchbar[data-project-demo] .pd-titlebar {min-height:64px;padding:14px 22px;background:#f7f9fc;border-color:var(--pd-line);}
.project-demo.pd-matchbar[data-project-demo] .pd-titlebar strong {font-size:clamp(22px,1.8vw,28px);font-weight:750;letter-spacing:-.065em;text-transform:lowercase;}
.project-demo.pd-matchbar[data-project-demo] .pd-titlebar small {font-size:14px;color:#536176;}
.project-demo.pd-matchbar[data-project-demo] .pd-brand-mark {width:32px;height:32px;}
.project-demo.pd-matchbar[data-project-demo] .pd-menubar {margin:0;padding:10px 22px;min-height:44px;font-size:14px;background:#e2e8f1;color:#394b64;gap:12px;border:0;}
.project-demo.pd-matchbar[data-project-demo] .pd-menubar-fixture {font-size:14px;font-weight:550;color:#394b64;}
.project-demo.pd-matchbar[data-project-demo] .pd-menubar-clock {font-size:14px;font-variant-numeric:tabular-nums;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-clubs {padding:16px 22px 10px;gap:8px;border:0;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-clubs button {min-height:48px;padding:8px 14px;border-radius:12px;gap:9px;font-size:16px;background:transparent;color:#536176;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-clubs button[aria-pressed=true] {background:#fff;color:#173d83;box-shadow:0 2px 9px #193c6310;}
.project-demo.pd-matchbar[data-project-demo] .pd-club-dot {width:27px;height:27px;font-size:13px;font-weight:700;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures {flex-direction:row;gap:8px;padding:0 22px 16px;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button {flex:1;min-width:0;min-height:66px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:10px 13px;border-radius:12px;color:#536176;background:#e5eaf2;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button[aria-pressed=true] {background:#dce7fb;color:#204e99;box-shadow:inset 0 0 0 1px #b1c8ee;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button>span {display:flex;gap:7px;font-size:14px;color:inherit;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button small {font-size:14px;margin:0;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button strong {font-size:16px;font-weight:650;text-align:left;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-main {position:relative;isolation:isolate;overflow:hidden;margin:0 22px;border-radius:16px;background:radial-gradient(ellipse at 50% 0%,#214c71 0%,#12283e 55%,#102236 100%);color:#f2f6fb;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-main::before {content:'';position:absolute;inset:30% -20% -80%;pointer-events:none;z-index:-1;opacity:.08;background:repeating-linear-gradient(90deg,transparent 0 10%,#bce4f7 10% 10.15%);transform:perspective(300px) rotateX(58deg);}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta {display:flex;justify-content:space-between;gap:12px;padding:18px 22px 0;border:0;color:#b9cadc;font-size:14px;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta>span:last-child {display:flex;align-items:center;gap:7px;color:#bad7fe;font-size:14px;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta svg {width:17px;height:17px;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams {display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;align-items:center;padding:25px 22px;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams>div {display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0;}
.project-demo.pd-matchbar[data-project-demo] .pd-club-crest {display:grid;place-items:center;width:56px;height:62px;border-radius:12px 12px 24px 24px;border:1px solid #ffffff40;background:#e0eaf6!important;color:#1f4363!important;font-size:26px;font-weight:750;box-shadow:0 5px 16px #0002;}
.project-demo.pd-matchbar[data-project-demo] .pd-club-crest.pd-tone-green {background:#d4e6dc!important;color:#285742!important;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams strong {color:#f4f8ff;font-size:clamp(18px,1.65vw,26px);font-weight:600;letter-spacing:-.035em;text-align:center;overflow-wrap:anywhere;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-score {font-size:clamp(38px,3.5vw,60px);font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.065em;white-space:nowrap;color:#fff;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-score.is-shielded {display:grid;place-items:center;width:64px;height:68px;color:#91b8e0;}
.project-demo.pd-matchbar[data-project-demo] .pd-fixture-score.is-shielded svg {width:42px;height:42px;stroke-width:1;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline {min-height:100px;margin:0 22px;padding:14px 0;border-color:#ffffff20;}
.project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock {min-height:72px;display:flex;align-items:center;justify-content:center;gap:13px;color:#b9cadc;}
.project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock>svg {width:24px;height:24px;opacity:1;color:#94bfea;}
.project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock strong {display:block;font-size:18px;color:#e3ecf7;font-weight:550;}
.project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock small {display:block;font-size:15px;color:#a8bfd6;margin-top:5px;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline>div {min-height:36px;gap:14px;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline time {font-size:16px;font-variant-numeric:tabular-nums;color:#a9c9ed;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline strong {font-size:16px;color:#e9f2fc;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline small {font-size:14px;color:#adc0d7;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:16px 22px 0;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {display:flex;align-items:center;justify-content:center;gap:7px;min-height:54px;min-width:0;padding:10px 6px;background:#f8faff;color:#465a74;border-radius:11px;font-size:16px;font-weight:550;transition:transform 150ms ease-out,background-color 150ms ease-out;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[aria-pressed=true] {background:#d9e6fc;color:#204d92;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield] {background:#173e76;color:#fff;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions button svg {width:20px;height:20px;}
.project-demo.pd-matchbar[data-project-demo] .pd-match-actions button:active {transform:scale(.97);}
.project-demo.pd-matchbar[data-project-demo] .pd-match-status {min-height:56px;margin:0;padding:14px 22px 12px;font-size:15px;line-height:1.4;color:#536176;}
.project-demo.pd-matchbar[data-project-demo] .pd-sample-note {padding:12px 22px;font-size:14px;color:#596a80;border-color:#d5deeb;background:#e6ecf4;}
.project-demo.pd-matchbar[data-project-demo] button:focus-visible {outline:3px solid #477ed4;outline-offset:2px;}
@media (hover:hover) and (pointer:fine) {
  .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button:hover {background:#d4e2f7;color:#173e76;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield]:hover {background:#255493;color:#fff;}
}
@media (max-width:600px) {
  .project-demo.pd-matchbar[data-project-demo] {border-radius:16px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-titlebar {padding:12px 14px;min-height:56px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-titlebar small {font-size:13px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-menubar {padding:10px 14px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-clubs {padding:12px 14px 8px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures {padding:0 14px 12px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-main {margin:0 14px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta {padding:14px 12px 0;font-size:13px;gap:8px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta>span:last-child {font-size:13px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams {padding:20px 10px;gap:8px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams strong {font-size:18px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-club-crest {width:44px;height:49px;font-size:22px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline {margin:0 14px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-actions {padding:12px 14px 0;grid-template-columns:repeat(2,minmax(0,1fr));}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {min-height:48px;}
  .project-demo.pd-matchbar[data-project-demo] .pd-match-status {padding:12px 14px;}
}
@media (prefers-reduced-motion:reduce) {
  .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {transition:none;}
}
body.motion-paused .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {transition:none;}
/* A short desktop is a matchday console, not a vertically cropped phone.
   Keep the main actions in the same frame as the selected fixture. */
@media (min-width:900px) and (max-height:800px) {
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] {display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.5fr);grid-template-rows:48px 34px 52px 164px 56px 34px 26px;align-items:stretch;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-titlebar {grid-column:1/-1;min-height:48px;padding:7px 18px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-titlebar strong {font-size:23px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-menubar {grid-column:1/-1;min-height:34px;padding:6px 18px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-clubs {grid-column:1;grid-row:3;padding:8px 12px 4px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-clubs button {min-height:40px;padding:6px 10px;font-size:16px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-fixtures {grid-column:1;grid-row:4/6;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;padding:8px 12px;border-right:1px solid #d5deeb;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button {flex:none;min-height:68px;height:auto;justify-content:center;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-main {grid-column:2;grid-row:3/5;min-height:0;margin:8px 18px 0;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta {padding:9px 18px 0;font-size:14px;line-height:20px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams {padding:10px 18px;gap:12px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams>div {gap:4px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams strong {font-size:19px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-club-crest {width:40px;height:44px;font-size:22px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-score.is-shielded {height:52px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline {display:flex;align-items:center;gap:14px;min-height:68px;padding:8px 0;margin:0 18px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline>div {flex:1;min-height:0;display:flex;align-items:flex-start;gap:7px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline>div>i {display:none;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline>div>span {min-width:0;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline strong {font-size:16px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline small {font-size:14px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock {min-height:50px;width:100%;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock strong {font-size:17px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock small {font-size:15px;margin-top:3px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-actions {grid-column:2;grid-row:5;grid-template-columns:repeat(4,minmax(0,1fr));padding:8px 18px 0;gap:6px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {min-height:48px;padding:8px 5px;font-size:16px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-status {grid-column:1/-1;min-height:32px;padding:6px 18px;margin:0;font-size:15px;white-space:nowrap;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-sample-note {grid-column:1/-1;padding:3px 18px;font-size:14px;line-height:20px;}
}
/* Phone matchday: put the four controls beside each other, directly beneath
   the scoreboard. The event strip can scroll without pushing controls away. */
@media (max-width:600px) {
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] {display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:44px 30px 48px 56px 160px 64px 36px 24px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-titlebar {min-height:44px;padding:6px 12px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-titlebar strong {font-size:22px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-brand-mark {width:27px;height:27px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-menubar {min-height:30px;padding:5px 12px;font-size:13px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-menubar-fixture {font-size:13px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-clubs {padding:4px 12px 0;gap:5px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-clubs button {min-height:44px;font-size:16px;padding:6px 10px;gap:6px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-club-dot {width:24px;height:24px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-fixtures {padding:4px 12px 6px;gap:7px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button {flex:1;min-height:46px;padding:4px 10px;gap:2px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button>span {gap:5px;font-size:13px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button small {font-size:13px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-fixtures button strong {font-size:16px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-main {min-height:0;margin:0 12px;border-radius:14px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta {padding:8px 12px 0;font-size:12px;line-height:18px;gap:6px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta>span:last-child {font-size:12px;gap:4px;white-space:nowrap;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-meta svg {width:15px;height:15px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams {padding:8px 8px 6px;gap:8px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams>div {gap:4px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-teams strong {font-size:17px;line-height:21px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-club-crest {width:34px;height:36px;font-size:20px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-score {font-size:36px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-score.is-shielded {width:48px;height:48px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-fixture-score.is-shielded svg {width:32px;height:32px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-timeline {min-height:0;height:51px;overflow-y:auto;overscroll-behavior:contain;margin:0 12px;padding:6px 0;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock {min-height:38px;gap:8px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock>svg {width:19px;height:19px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock strong {font-size:16px;line-height:19px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-timeline-lock small {font-size:14px;line-height:17px;margin:0;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-actions {grid-template-columns:repeat(4,minmax(0,1fr));padding:8px 12px 4px;gap:5px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button {flex-direction:column;justify-content:center;gap:2px;min-height:52px;padding:4px 0;font-size:16px;line-height:19px;letter-spacing:-.035em;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button svg {width:18px;height:18px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield] svg {display:none;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield] span {max-width:63px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-match-status {min-height:0;padding:0 12px;font-size:13px;line-height:17px;}
 .detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo]>.pd-sample-note {padding:3px 10px;font-size:13px;line-height:17px;}
}
.project-demo.pd-matchbar[data-project-demo] .pd-match-timeline:focus-visible {outline:2px solid #94bfea;outline-offset:-2px;border-radius:5px;}
/* Shield remains a high-contrast deliberate action in either pressed state. */
.detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield] {background:#1c437b;color:#fff;}
.detail[data-room-mode=artifact] .project-demo.pd-matchbar[data-project-demo] .pd-match-actions button[data-pd-match-action=shield]:hover {background:#28578f;color:#fff;}


/* app-shell-v27.css */
/* App entry changes the room itself. No outer window frame or project column. */
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] {--workspace-surface:#edf4ef;}
.detail[data-app-workspace=matchbar][data-room-identity=apps][data-room-mode=artifact][data-route="apps/matchbar"]:not([data-room-world=off]) {--workspace-surface:#16263c;--world-ink:#e6edf7;--world-muted:#b4c5da;--world-wall:#16263c;--world-floor:#142137;--world-lamp:#86acd6;--world-line:#ffffff24;}
.detail[data-app-workspace=spoor][data-room-identity=apps][data-room-mode=artifact][data-route="apps/spoor"]:not([data-room-world=off]) {--workspace-surface:#edf2fa;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact]:not([data-room-world=off]) .world-atmosphere {background:var(--workspace-surface);}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .room-world-volume {opacity:.22;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-toolbar {height:76px;padding-top:0;gap:10px;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-category {font-size:clamp(19px,1.6vw,27px);font-weight:650;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-stage {padding:0 clamp(18px,3vw,52px);overflow:hidden;justify-content:stretch;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .showcase-focus {display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);height:100%;min-height:0;max-width:none;width:100%;padding:0;gap:24px;margin:0;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .showcase-copy {display:none;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .showcase-demo {grid-column:1;grid-row:1;width:100%;height:100%;min-height:0;overflow:auto;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .showcase-threads {display:none;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .project-demo {width:100%;max-width:none;border:0;border-radius:0;box-shadow:none;background:transparent;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-live-title {font-size:clamp(25px,3vw,44px);line-height:1.1;margin:0 0 18px;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-about-toggle {margin-left:12px;min-height:48px;font:inherit;font-size:18px;padding:10px 18px;border:1px solid var(--world-line);border-radius:12px;color:var(--world-ink);background:transparent;cursor:pointer;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-find {margin-left:auto;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-keys {margin-left:0;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-footer {height:88px;}
.detail[data-app-workspace=matchbar][data-room-identity=apps][data-room-mode=artifact][data-route="apps/matchbar"]:not([data-room-world=off]) .world-nav {background:#122033e8;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-focus {grid-template-columns:minmax(0,1fr) minmax(280px,350px);}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy {display:block;grid-column:2;grid-row:1;overflow:auto;max-width:none;width:auto;min-height:0;padding:22px;border-left:1px solid var(--world-line);background:var(--workspace-surface);color:var(--world-ink);}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy :is(h2,p,summary) {color:var(--world-ink);}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy h2 {font-size:30px;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy p {font-size:18px;line-height:1.5;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-about-toggle:focus-visible {outline:2px solid var(--world-ink);outline-offset:3px;}
@media(max-width:600px){
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-toolbar {height:68px;padding-inline:16px;gap:4px;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-category {position:static;transform:none;margin-right:auto;font-size:20px;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-category svg {display:none;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-find,.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-keys {display:none;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-about-toggle {font-size:17px;padding:8px 12px;margin-left:0;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-stage {padding-inline:16px;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-footer {height:84px;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-focus {grid-template-columns:1fr;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy {grid-column:1;border-left:0;padding:8px 0;}
 .detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-demo {display:none;}
}
/* Inside an app, its canvas replaces the gallery's architectural backdrop. */
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .room-world-volume {visibility:hidden;}
.detail[data-app-workspace][data-room-identity=apps][data-room-mode=artifact][data-app-about=true] .showcase-copy :is(h3,.showcase-case-start,.showcase-case-boundary,.showcase-story-meta) {color:var(--world-ink);}
/* The outgoing app keeps its canvas while the clip gathers into its source. */
.app-transition-context[data-app-workspace]>.inner-old {background:var(--workspace-surface,var(--world-wall));}


/* app-workspaces-v27.css */
/* App surfaces are the workspace: no browser chrome, nested window or scaled preview. */
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo[data-app-workspace] {border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;min-width:0;font-size:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .showcase-demo:has([data-app-workspace]) {border:0;border-radius:0;box-shadow:none;background:transparent;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading {grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:8px 0 22px;border:0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity {display:flex;align-items:center;gap:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity>span:last-child {display:flex;flex-direction:column;gap:3px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity strong {font-size:clamp(28px,3vw,44px);letter-spacing:-.045em;line-height:1.1;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity>span>span {font-size:18px;color:var(--pd-muted);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading .pd-brand-mark {width:54px;height:54px;box-shadow:none;border:0;background:transparent;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading .pd-brand-mark img {width:100%;height:100%;object-fit:contain;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading>small {font-size:15px;color:var(--pd-muted);text-align:right;max-width:220px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo[data-app-workspace] .pd-sample-note {grid-column:1/-1;padding:12px 0 0;margin:0;border-top:0;font-size:14px;opacity:.85;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo[data-app-workspace] button {min-height:48px;transition:background-color 160ms ease,color 160ms ease;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo[data-app-workspace] button:active {filter:brightness(.94);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck[data-app-workspace] {--pd-ink:#1d3d37;--pd-muted:#4d6b63;--pd-line:#9ebbb44d;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-search {margin:0 24px 12px 0;background:#ffffff80;border:0;border-bottom:1px solid #9abeb4;border-radius:0;min-height:58px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-search input {font-size:18px;height:58px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-search svg {width:22px;height:22px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-segments {margin:0 24px 12px 0;background:transparent;padding:0;gap:8px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-segments button {background:transparent;border-radius:10px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-segments button[aria-pressed=true] {background:#d4e8df;box-shadow:none;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-list {padding:0 24px 0 0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-project-group h3 {font-size:16px;color:#54736a;margin:18px 8px 8px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-project-group h3 span {font-size:15px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity {border-radius:12px;min-height:68px;padding:10px 12px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity[aria-pressed=true] {background:#d2e6de;box-shadow:none;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity-name strong {font-size:19px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity-name small,.pd-activity-role {font-size:15px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-inspector {margin:0;padding:14px 0 0 32px;background:transparent;border-left:1px solid var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-location {margin:0 0 24px;font-size:23px;letter-spacing:-.025em;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-location span {font-size:17px;color:#59776e;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-inspector-heading>div>strong {font-size:clamp(24px,2.5vw,36px);line-height:1.2;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-inspector-heading>div>span {font-size:18px;line-height:1.55;margin-top:10px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector dl>div {display:block;padding:13px 0;border-bottom:1px solid var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector dt {font-size:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector dd {font-size:18px;margin-top:4px;line-height:1.45;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-evidence summary,.pd-evidence p {font-size:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-foot {font-size:15px;margin:12px 0;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] {--pd-ink:#edf1fa;--pd-muted:#afbed4;--pd-line:#d8e4ff30;--pd-accent:#d1e2ff;color:var(--pd-ink);}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-workspace-heading {padding-bottom:12px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-menubar {background:#e4edff12;border-radius:0;border-block:1px solid #d8e4ff22;color:#c4d1e6;padding:8px 0;min-height:40px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-clubs {padding:20px 14px 8px 0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-match-clubs button {color:#becbe0;background:transparent;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-match-clubs button[aria-pressed=true] {color:#fff;background:#d8e5ff24;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-fixtures {padding:0 24px 0 0;border-right:1px solid #d8e4ff24;gap:12px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-match-fixtures button {color:#bfcee5;background:#d8e5ff09;border-radius:10px;padding:14px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-match-fixtures button[aria-pressed=true] {background:#d8e5ff24;border-color:#d8e4ff20!important;color:#fff;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-match-fixtures button small {color:#a3b8d8;font-size:14px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-main {margin:20px 0 0 30px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-fixture-meta {color:#c4d1e6;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams {padding:22px 0;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams strong {font-size:clamp(19px,2.1vw,28px);color:#f5f7ff;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-score {font-size:clamp(44px,6vw,84px);color:#fff;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-club-crest {width:58px;height:64px;font-size:25px;box-shadow:0 14px 22px #0002;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-score.is-shielded {background:transparent;color:#b9d6fb;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-timeline {color:#dbe5f6;border-color:#d8e4ff24;min-height:80px;max-height:130px;overflow:auto;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-timeline :is(strong,small,time) {color:#dbe5f6;font-size:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-actions {padding:18px 0 4px 30px;gap:10px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-actions button {color:#d5e0f3;background:#d8e5ff12;min-height:56px;border-radius:12px;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-actions button[aria-pressed=true] {color:#fff;background:#9abffb30;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-status {color:#b8c8e2;border-color:#d8e4ff24;padding:12px 0;min-height:44px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor[data-app-workspace] {--pd-ink:#19344c;--pd-muted:#4b6b85;--pd-line:#5b80a833;color:var(--pd-ink);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor>.pd-spoor-session {padding:8px 0 18px;border-color:var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session strong {font-size:22px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session>div>span {font-size:16px;color:#45677f;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-session-sample {color:#45677f;background:#d7e4f0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-body {grid-template-columns:190px minmax(0,1fr);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline {padding:16px 20px 0 0;border-right:1px solid var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button {min-height:68px;color:#526f86;padding:8px 12px;border-radius:10px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button[aria-pressed=true] {color:#173f68;background:#b9d1eb55;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button[aria-pressed=true] .pd-event-icon {color:#315d88;background:#dce9f5;border-color:#b1c9df;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline time {font-size:15px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline strong {font-size:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-view {padding:18px 0 0 28px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-segments {background:transparent;gap:8px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-segments button {color:#45677f;background:transparent;padding:10px 18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-segments button[aria-pressed=true] {background:#b9d1eb55;color:#173f68;box-shadow:none;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0;color:#526f86;font-size:15px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator>strong {font-size:21px;color:#173f68;font-variant-numeric:tabular-nums;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator>span:last-child {margin-left:auto;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-heading h3 {font-size:24px;color:#193f60;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor blockquote {font-size:clamp(26px,3vw,42px);line-height:1.3;color:#183c5a;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor :is(.pd-transcript-note,.pd-context-note,.pd-no-speech p,.pd-speaker) {font-size:17px;color:#4d6e89;line-height:1.55;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-source {font-size:15px;color:#4b6b85;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-navigation {display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-top:1px solid var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-navigation button {background:transparent;color:#234e73;padding:8px 0;font-size:18px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-pack-files {border-color:var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-pack-files summary {font-size:17px;padding-inline:0;color:#315a7d;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-pack-files :is(code,p,span) {font-size:16px;color:#45677f;}
@media(min-width:900px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck[data-app-workspace] {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-workspace-heading {grid-row:1;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-inspector {grid-column:2;grid-row:2/5;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] {display:grid;grid-template-columns:minmax(230px,.65fr) minmax(0,1.5fr);}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-workspace-heading {grid-row:1;}
}
@media(min-width:900px) and (max-height:850px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading {padding-bottom:12px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity strong {font-size:30px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity>span>span {font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-list {height:230px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-inspector dl>div {padding:9px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-location {margin-bottom:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams {padding:12px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-timeline {max-height:100px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-timeline button {min-height:58px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator {margin:10px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor blockquote {font-size:30px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-detail {min-height:190px;}
}
@media(max-width:899px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo[data-app-workspace] {display:block;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading {gap:12px;padding:8px 0 18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading>small {font-size:13px;max-width:100px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity {gap:10px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity strong {font-size:28px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity>span>span {font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading .pd-brand-mark {width:42px;height:42px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-search,.pd-quaydeck>.pd-segments {margin-right:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-list {height:220px;padding-right:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-inspector {border-left:0;border-top:1px solid var(--pd-line);padding:20px 0 0;margin:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-search input {font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-search kbd {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity {min-height:60px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity-name strong {font-size:18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-activity-role {font-size:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quay-foot {flex-wrap:wrap;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-main {margin:12px 0 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-clubs {padding-left:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-fixtures {padding:0;border-right:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-fixtures button {padding:10px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams {padding:16px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams strong {font-size:18px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-club-crest {width:44px;height:50px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-score {font-size:40px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-actions {padding:12px 0 0;grid-template-columns:repeat(2,1fr);}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-actions button {min-height:52px;background:#d8e5ff12;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-actions button[aria-pressed=true] {background:#9abffb30;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-body {display:flex;flex-direction:column;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-timeline {display:flex;overflow:auto;gap:6px;border-right:0;padding:12px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-timeline button {flex:0 0 90px;min-height:64px;padding:8px;gap:6px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-timeline strong {font-size:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-timeline time {font-size:13px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-tick {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-event-icon {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-view {padding:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-detail {min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator>span:last-child {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-navigation {gap:10px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-navigation button {font-size:16px;}
}
@media(prefers-reduced-motion:reduce) {.project-demo[data-app-workspace] button {transition:none;}}
/* Full-room height belongs to the parent; these rails can grow into it without
   ever shrinking the controls or adding a second fake window. */
@media(min-width:900px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck[data-app-workspace] {min-height:100%;grid-template-rows:auto auto auto minmax(200px,1fr) auto auto;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck>.pd-quay-list {height:auto;min-height:200px;max-height:360px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor[data-app-workspace] {display:flex;flex-direction:column;min-height:100%;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor>.pd-spoor-body {flex:1;}
}
/* The match instrument occupies the room, including its vertical space. Keep
   its result bars on the same dark broadcast surface rather than white cards. */
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] {color:#edf3ff;--pd-ink:#edf3ff;--pd-muted:#bfcee5;background:transparent;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] :is(.pd-menubar,.pd-match-status,.pd-sample-note) {background:transparent;box-shadow:none;color:#c2d0e7;border-color:#d8e4ff26;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-menubar-fixture {background:transparent;color:#edf3ff;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-menubar-clock {color:#b9cbe4;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-sample-note {padding:4px 0 0;min-height:26px;font-size:14px;line-height:1.4;opacity:.8;border:0;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-status {padding:6px 0;min-height:34px;font-size:14px;line-height:1.45;}
@media(min-width:900px) {
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] {height:100%;min-height:480px;display:grid;grid-template-columns:minmax(230px,.65fr) minmax(0,1.5fr);grid-template-rows:64px 34px 48px minmax(160px,1fr) 64px 34px 26px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-workspace-heading {grid-column:1/-1;grid-row:1;padding:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-menubar {grid-column:1/-1;grid-row:2;min-height:0;padding:4px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-clubs {grid-column:1;grid-row:3;padding:0 14px 0 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-fixtures {grid-column:1;grid-row:4/6;padding:12px 24px 0 0;align-self:stretch;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-main {grid-column:2;grid-row:3/5;margin:0 0 0 30px;display:flex;flex-direction:column;justify-content:center;min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-actions {grid-column:2;grid-row:5;padding:4px 0 4px 30px;align-items:stretch;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-match-status {grid-column:1/-1;grid-row:6;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace]>.pd-sample-note {grid-column:1/-1;grid-row:7;}
}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-main {background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-main::before {display:none;}
.detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-actions button[data-pd-match-action=shield] span {max-width:none;white-space:nowrap;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck[data-app-workspace]>.pd-quay-list {overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding-bottom:16px;border-bottom:1px solid var(--pd-line);}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-quaydeck[data-app-workspace]>.pd-quay-inspector {padding-bottom:24px;}
/* Spoor keeps its transport beneath a scrollable review surface. The selected
   moment may be long; it must never push the primary navigation under the HUD. */
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-project-demo][data-app-workspace] {height:100%;min-height:0;display:grid;grid-template-rows:64px 64px minmax(140px,1fr) 52px minmax(40px,auto) 24px;overflow:hidden;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-workspace-heading {grid-row:1;grid-column:1;min-height:0;padding:0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-session {grid-row:2;grid-column:1;min-height:0;padding:6px 0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-body {grid-row:3;grid-column:1;min-height:0;overflow:hidden;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-timeline {min-height:0;overflow:auto;overscroll-behavior:contain;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-view {min-height:0;overflow:auto;overscroll-behavior:contain;padding-bottom:16px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-detail {min-height:0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-navigation {grid-row:4;grid-column:1;min-height:0;padding:0;align-items:center;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-navigation button {min-height:48px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-pack-files {grid-row:5;grid-column:1;min-height:0;max-height:170px;overflow:auto;overscroll-behavior:contain;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-pack-files summary {min-height:40px;padding-block:6px;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-sample-note {grid-row:6;grid-column:1;min-height:0;font-size:14px;padding:2px 0;margin:0;line-height:20px;white-space:nowrap;}
@media(max-width:899px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-project-demo][data-app-workspace] {display:flex;flex-direction:column;height:100%;min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-workspace-heading {flex:0 0 68px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-session {flex:0 0 64px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-body {flex:1 1 0;display:flex;flex-direction:column;min-height:0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-timeline {flex:0 0 82px;min-height:0;padding:6px 0;overflow-x:auto;overflow-y:hidden;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-view {flex:1 1 0;min-height:0;padding-top:4px;overflow:auto;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-navigation {flex:0 0 56px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-pack-files {flex:0 0 auto;min-height:40px;max-height:170px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-sample-note {flex:0 0 24px;font-size:12px;}
}
/* v34: responsive sample disclosures are part of the usable app surface.
   A long Dutch word must never be clipped by a narrow header column. */
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-identity{min-width:0;}
.detail[data-room-identity=apps][data-room-mode=artifact] .pd-workspace-heading>small{min-width:0;overflow-wrap:anywhere;line-height:1.4;}
.detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop[data-project-demo]{padding:0;}
@media(max-width:600px){
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .pd-workspace-heading{flex-wrap:wrap;gap:8px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .pd-workspace-heading>small{flex:0 0 100%;max-width:none;text-align:left;font-size:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-workspace{padding-top:12px;gap:20px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-controls{padding:6px 16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-controls>button{padding:11px 0;min-height:58px;gap:12px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-controls strong{font-size:20px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-controls small{font-size:16px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-scenes h3{font-size:28px;margin-bottom:8px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-scenes p{font-size:17px;line-height:1.5;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-scenes>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:16px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-scenes button{min-width:0;min-height:48px;padding:10px 0;font-size:17px;}
}
@media(min-width:900px) and (max-height:650px){
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-workspace{padding-top:14px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-koop .pd-koop-controls>button{padding:11px 0;min-height:58px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-project-demo][data-app-workspace]{grid-template-rows:54px 54px minmax(140px,1fr) 52px minmax(40px,auto) 24px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-workspace-heading .pd-brand-mark{width:42px;height:42px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-workspace-identity strong{font-size:28px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-view{padding-top:8px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-locator{margin:8px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-heading h3{margin:4px 0 10px;font-size:23px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-spoor-view>.pd-segments{margin-bottom:8px;padding-bottom:6px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor blockquote{font-size:28px;line-height:1.3;}
}
/* Short handheld windows need a readable moment, not a rigid, overlapping header. */
@media (max-width:899px) and (max-height:680px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-project-demo][data-app-workspace]>.pd-workspace-heading {flex:0 0 auto;min-height:48px;padding:0 0 6px;align-items:center;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-workspace-identity>span>span {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-workspace-heading>small {font-size:12px;line-height:1.3;max-width:112px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-session {flex:0 0 auto;min-height:50px;padding:5px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session strong {font-size:18px;line-height:1.2;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session>div>span {font-size:14px;line-height:1.3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-session .pd-session-sample {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-timeline {flex-basis:64px;padding:4px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-timeline button {min-height:54px;padding-block:4px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-locator {margin:8px 0;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor-view>.pd-segments {margin-bottom:6px;padding-bottom:6px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-heading>span {display:none;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor .pd-moment-heading h3 {margin:4px 0 12px;font-size:21px;line-height:1.25;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .pd-spoor blockquote {font-size:24px;line-height:1.3;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-navigation {flex-basis:50px;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-sample-note {flex-basis:auto;white-space:normal;text-align:center;}
}
/* A match event is content, not a second scrolling pane inside the phone. */
@media (max-width:600px) {
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-timeline {height:auto;max-height:none;overflow:visible;}
}
/* Keep words intact in the scoreboard when a narrow phone has two teams. */
@media (max-width:360px) {
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams {gap:4px;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-fixture-teams strong {font-size:17px;overflow-wrap:normal;}
 .detail[data-room-identity=apps][data-room-mode=artifact][data-app-workspace=matchbar] .project-demo.pd-matchbar[data-project-demo][data-app-workspace] .pd-match-timeline>div>span {display:flex;flex-direction:column;align-items:flex-start;gap:2px;}
}
/* On a short landscape display, let the whole workspace scroll. Reserving a
   fixed slot for every rail would otherwise leave the actual moment at 20px. */
@media (max-width:899px) and (max-height:500px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-project-demo][data-app-workspace] {height:auto;min-height:100%;overflow:visible;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-body {flex:0 0 auto;overflow:visible;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace] .pd-spoor-view {flex:0 0 auto;overflow:visible;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-navigation {position:sticky;bottom:0;z-index:2;background:#eaf1f8;}
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-pack-files {max-height:none;overflow:visible;}
}
/* The sample label remains in the identity. On very short phones, omit its
   repeated session and footer so the actual spoken moment has room to read. */
@media (max-width:360px) and (max-height:680px) {
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-spoor-session,
 .detail[data-room-identity=apps][data-room-mode=artifact] .project-demo.pd-spoor[data-app-workspace]>.pd-sample-note {display:none;}
}


/* collection-library-v32.css */
.collection-library{width:min(1320px,calc(100% - 56px));max-height:none;margin:0 auto;overflow:visible;color:#283438;padding:20px 16px 44px;text-align:left}
.collection-library button{font:inherit;min-height:48px;cursor:pointer}.collection-library button{border:1px solid #a2aeb43b;background:#ffffff87;color:inherit;border-radius:14px;padding:12px 18px}
.collection-library button:focus-visible,.collection-library input:focus-visible{outline:3px solid #8870c6;outline-offset:4px}
.collection-library-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}
.collection-library #detail-title{font-size:clamp(34px,4vw,66px);line-height:1.05;letter-spacing:-.055em;margin:0 0 14px;font-weight:550;max-width:100%;text-wrap:balance}
.collection-library-heading p{font-size:clamp(18px,1.5vw,24px);color:#68717b;margin:0}.collection-library-heading button{white-space:nowrap;font-size:18px}
.collection-library-search{margin:0 0 20px;max-width:650px}.collection-library-search label{display:block;font-size:17px;margin:0 0 8px;color:#66707b}.collection-library-search input{width:100%;box-sizing:border-box;border:1px solid #b3b8c64f;border-radius:14px;background:#fff9;padding:15px 18px;color:inherit;font:inherit;font-size:21px;min-height:58px;appearance:none}
.collection-library-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.collection-library-filters button{font-size:17px;min-height:46px;padding:10px 14px}.collection-library-filters button span{opacity:.5;font-size:.8em;margin-left:4px}.collection-library-filters button[aria-pressed="true"]{background:#313b43;color:#fff;border-color:transparent}
.collection-library-count{font-size:17px;color:#66717c;margin:0 0 20px}.collection-library-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 22px}
.collection-library button.collection-library-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:0;border:0;border-radius:0;background:transparent;min-width:0;overflow:hidden}
.collection-library-card-art{display:grid;place-items:center;width:100%;aspect-ratio:1.12;overflow:hidden;border-radius:14px;background:#c6c7c622;margin-bottom:13px}.collection-library-card-art img{display:block;width:100%;height:100%;object-fit:contain}.collection-library-card[data-medium="screen"] .collection-library-card-art{aspect-ratio:1.12;background:#1e252c}.collection-library-card[data-medium="music"] .collection-library-card-art,.collection-library-card[data-medium="podcast"] .collection-library-card-art{aspect-ratio:1}.collection-library-card[data-medium="book"] .collection-library-card-art img{width:auto;max-width:90%;object-fit:contain}
.collection-library-card-kind{font-size:13px;letter-spacing:.03em;color:#7c7e89;margin-bottom:7px}.collection-library-card strong{font-size:clamp(18px,1.5vw,24px);line-height:1.22;letter-spacing:-.025em;font-weight:550;overflow-wrap:anywhere}.collection-library-card-sub{font-size:16px;line-height:1.45;color:#6e7580;margin-top:5px}.collection-library-no-image{font-size:24px;padding:24px;text-align:center}
.collection-library-pages{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:38px;font-size:17px}.collection-library button:disabled{opacity:.35;cursor:default}.collection-library-empty{font-size:22px;padding:40px 0;grid-column:1/-1}
@media(hover:hover){.collection-library-card:hover strong{text-decoration:underline;text-underline-offset:4px}.collection-library-filters button:hover{border-color:#77818d}}
@media(max-width:1000px){.collection-library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.collection-library{width:calc(100% - 24px);max-height:none;padding:14px 6px 32px;box-sizing:border-box}.collection-library-heading{display:block;margin-bottom:20px}.collection-library-heading button{margin-top:18px}.collection-library #detail-title{font-size:36px}.collection-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}.collection-library-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px;gap:6px}.collection-library-filters button{white-space:nowrap;font-size:16px}.collection-library-card strong{font-size:19px}.collection-library-card-sub{font-size:15px}.collection-library-card-art{border-radius:10px}.collection-library-pages{gap:10px;font-size:15px}.collection-library-pages button{font-size:16px;padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.collection-library *{scroll-behavior:auto!important}}
@layer experience {
 .detail[data-category=music] .media-heading .collection-library-door{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;margin:18px auto 0;padding:10px 18px;border:1px solid #c5bed44d;border-radius:30px;background:#ffffffa3;color:#5d5276;font-size:clamp(15px,1.1vw,18px);font-weight:500;}
 .collection-library-door>span:first-child{opacity:.6;font-size:.85em;font-variant-numeric:tabular-nums;}
}
.collection-library-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
.collection-library-filters button{flex:none;white-space:nowrap}
.collection-library-heading{margin-bottom:22px}
.collection-library #detail-title{font-size:clamp(34px,3.5vw,54px)}
@media(max-width:700px){
 .collection-library{max-height:none;}
 .collection-library-heading{display:flex;align-items:center;gap:12px}
 .collection-library-heading button{font-size:15px;margin-top:0;padding:10px;white-space:normal;max-width:120px}
 .collection-library-heading p{font-size:16px}
 .collection-library-search{margin-bottom:14px}
 .collection-library-search input{font-size:18px;min-height:48px;padding:12px}
}
/* One scrolling owner: the shared world-stage, never a nested shelf panel. */
.world-stage:has(>.collection-library){scroll-behavior:auto;overflow-anchor:none;}
.collection-library{max-height:none;overflow:visible;}
.collection-library-search-row{display:flex;align-items:center;gap:12px}
.collection-library-search-row input{min-width:0;flex:1}
.collection-library-search-row button{white-space:nowrap;font-size:17px;min-height:50px}
.collection-library [data-library-clear][hidden]{display:none!important}
.collection-library-empty{padding:30px 0 40px;font-size:22px}
.collection-library-empty p{margin:0 0 18px;max-width:45ch}
.collection-library-empty button{font-size:18px}
.collection-library-image-fallback{display:grid;place-items:center;align-self:stretch;justify-self:stretch;min-width:0;padding:24px;box-sizing:border-box;font-size:clamp(18px,2vw,28px);line-height:1.3;text-align:center;overflow-wrap:anywhere;color:inherit}
.collection-library-card-art.has-image-fallback{background:#e6e4e2;color:#46515c}
.collection-library img[hidden]{display:none!important}
@media(max-width:700px){.collection-library-search-row{gap:8px}.collection-library-search-row button{font-size:15px;min-height:48px;padding:10px 12px}.collection-library-image-fallback{padding:16px;font-size:19px}}
/* v34: real objects keep their proportions inside the existing glass world. */
.collection-library{color:inherit;padding-top:12px;}
.collection-library-heading{margin-bottom:20px;}
.collection-library #detail-title{font-size:clamp(24px,2vw,30px);font-weight:500;letter-spacing:-.035em;margin:0;}
.collection-library-grid{--collection-art-height:clamp(190px,20vw,250px);display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;gap:38px 28px;}
.collection-library .collection-library-card{flex:0 0 auto;width:min(100%,calc(var(--collection-art-height,200px) * var(--collection-ratio,1)));overflow:visible;}
.collection-library .collection-library-card-art{aspect-ratio:var(--collection-ratio,1);height:auto;border-radius:5px;background:transparent;overflow:visible;box-shadow:none;}
.collection-library .collection-library-card-art img{width:100%;max-width:100%;height:100%;object-fit:contain;border-radius:4px;filter:drop-shadow(0 14px 16px #273b3b12);}
.collection-library .collection-library-card[data-medium="book"] .collection-library-card-art img{width:100%;max-width:100%;}
.collection-library-card-kind{font-size:14px;opacity:.6;color:inherit;}
.collection-library-card-sub{color:inherit;opacity:.65;}
.collection-library-card strong{font-size:clamp(18px,1.5vw,23px);font-weight:500;}
.collection-library-filters button[aria-pressed="true"]{background:#ffffff86;color:inherit;border-color:#b6b3c950;box-shadow:0 4px 18px #48414e06;}
.collection-library-search input{background:#ffffff52;border-color:#bec6d54d;}
.collection-library-heading button,.collection-library-search-row button{background:#ffffff46;}
@media(max-width:700px){.collection-library-grid{--collection-art-height:190px;gap:30px 20px;}.collection-library-heading{margin-bottom:18px;}.collection-library-heading button{max-width:none;}}
.collection-library .collection-library-card-art{position:relative;display:block;min-height:0;}
.collection-library .collection-library-card-art img{position:absolute;inset:0;}
.collection-library-card-art .collection-library-image-fallback{position:absolute;inset:0;}
.detail[data-category=music] .media-heading h2{font-size:clamp(24px,2vw,30px);font-weight:500;line-height:1.2;letter-spacing:-.035em;margin:0;}
.detail[data-category=music] .media-heading{margin-bottom:24px;}
.media-film-description{font-size:clamp(18px,1.4vw,23px)!important;line-height:1.6!important;max-width:48ch;}
/* The shared world toolbar already identifies Collection. Put useful browse
   controls on one line and let actual covers lead the first viewport. */
.collection-library-heading.sr-only{margin:0;padding:0;}
.collection-library-search{max-width:none;margin-bottom:20px;}
.collection-library-search-row input{flex:1 1 360px;max-width:650px;}
.collection-library-search-row [data-library-random]{margin-left:auto;background:#ffffff46;}
.collection-library-search-row [data-library-clear]{flex:none;}
@media(max-width:700px){.collection-library-search-row{flex-wrap:wrap;gap:10px;}.collection-library-search-row input{flex:1 1 160px;min-width:160px;max-width:none;}.collection-library-search-row [data-library-random]{font-size:16px;padding-inline:12px;}.collection-library-search-row [data-library-clear]{font-size:16px;}}
/* The old cinema reserved 375px for a footer that no longer exists. Let the
   actual screen and facts use the shared stage instead of shrinking into a box. */
.cinema-room .detail[data-category=music] .media-films{--screen-width:100%;width:min(1200px,100%);max-width:none;margin:0 auto;color:#edf1f5;}
.cinema-room .detail[data-category=music] .media-film-focus{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);align-items:start;gap:clamp(28px,3vw,48px);width:100%;max-width:none;}
.cinema-room .detail[data-category=music] .media-cinema{width:100%;min-width:0;aspect-ratio:16/9;}
.cinema-room .detail[data-category=music] .media-film-copy{display:block;width:100%;min-width:0;padding:0;align-self:start;}
.cinema-room .detail[data-category=music] .media-film-copy h3{font-size:clamp(30px,3vw,46px);font-weight:500;line-height:1.1;letter-spacing:-.04em;margin:0 0 18px;}
.cinema-room .detail[data-category=music] .media-film-copy>p:first-of-type{font-size:18px;line-height:1.45;color:#bac4d0;margin:0 0 20px;}
.cinema-room .detail[data-category=music] .media-film-copy .media-film-description{font-size:20px!important;line-height:1.55!important;color:#d8e0e8;margin:22px 0;}
.cinema-room .detail[data-category=music] .media-film-number{display:block;position:static;margin-top:22px;font-size:16px;}
.cinema-room .detail[data-category=music] .media-trailer-button{font-size:18px;min-height:48px;padding:12px 20px;}
.cinema-room .detail[data-category=music] .media-film-shelf{width:100%;max-width:none;gap:20px;margin:28px auto 0;padding:8px 4px 14px;}
.cinema-room .detail[data-category=music] .media-film-tile{width:88px;flex:0 0 88px;}
.cinema-room .detail[data-category=music] .media-film-tile strong{font-size:14px;line-height:1.4;}
.cinema-room .detail[data-category=music] .media-bottom{width:100%;max-width:none;margin-top:18px;}
.cinema-room .detail[data-category=music] .media-bottom>button,.cinema-room .detail[data-category=music] .media-film-navigation button{font-size:17px;min-height:48px;}
@media(max-width:760px){.cinema-room .detail[data-category=music] .media-film-focus{grid-template-columns:1fr;gap:24px;}.cinema-room .detail[data-category=music] .media-film-copy h3{font-size:34px;}.cinema-room .detail[data-category=music] .media-film-shelf{justify-content:flex-start;}.cinema-room .detail[data-category=music] .media-film-tile{width:80px;flex-basis:80px;}.cinema-room .detail[data-category=music] .media-bottom{gap:12px;}.cinema-room .detail[data-category=music] .media-film-navigation{max-width:none;}}
.collection-library .collection-library-card[data-medium="person"] .collection-library-card-art{border-radius:12px;overflow:hidden;background:var(--collection-tint,#1b242e);box-shadow:0 6px 20px rgba(0,0,0,0.12);transition:transform .22s cubic-bezier(0.2,0.9,0.3,1),box-shadow .22s ease;}
.collection-library .collection-library-card[data-medium="person"] .collection-library-card-art img{object-fit:cover;object-position:center top;border-radius:12px;filter:none;}
@media(hover:hover){.collection-library .collection-library-card[data-medium="person"]:hover .collection-library-card-art{transform:translateY(-4px);box-shadow:0 18px 36px -8px rgba(0,0,0,0.26),0 0 0 1px rgba(255,255,255,0.14);}}
/* v51: masonry for the main collection grid; covers keep their natural ratio. */
.collection-library .collection-library-grid{display:block;column-width:clamp(150px,17vw,215px);column-gap:clamp(18px,2.4vw,34px);}
.collection-library .collection-library-grid .collection-library-card{display:flex;flex-direction:column;width:100%;margin:0 0 clamp(24px,3vw,38px);break-inside:avoid;page-break-inside:avoid;}
.collection-library .collection-library-grid .collection-library-empty{column-span:all;}
@media(max-width:700px){.collection-library .collection-library-grid{column-width:auto;column-count:2;column-gap:16px;}.collection-library .collection-library-grid .collection-library-card{margin-bottom:24px;}}
/* Long film and concert rails: centred while they fit, scrollable from the first tile
   once they overflow (a centred overflowing row would cut off its start). */
.cinema-room .detail[data-category=music] .media-film-shelf{justify-content:flex-start;}
.cinema-room .detail[data-category=music] .media-film-shelf>.media-film-tile:first-child{margin-left:auto;}
.cinema-room .detail[data-category=music] .media-film-shelf>.media-film-tile:last-child{margin-right:auto;}


/* shelf-layouts-v32.css */
/* Source artwork and readable facts belong to the same glass world. */
.detail[data-category=music] .shelf-layout-v32{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr);width:min(1120px,100%);max-width:none;margin:auto;gap:clamp(30px,5vw,80px);align-items:start;padding:24px clamp(12px,3vw,36px) 40px;box-sizing:border-box;background:transparent;border:0;border-radius:0;box-shadow:none;color:inherit;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-art{position:relative;top:auto;align-self:start;width:100%;max-width:none;min-height:0;padding:12px 8px 28px;margin:0;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-cover{display:block;width:min(100%,300px);max-width:none;aspect-ratio:2/3;margin:0 auto;border:0;border-radius:4px;transform:none;overflow:visible;background:transparent;box-shadow:8px 22px 28px -22px #27383755;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-cover img{display:block;width:100%;height:100%;object-fit:contain;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-halo{display:none;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-copy{width:100%;max-width:none;min-width:0;text-align:left;margin:0;padding:0;color:inherit;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-copy h2{font-size:clamp(34px,4vw,62px);line-height:1.08;font-weight:500;letter-spacing:-.045em;margin:0 0 18px;}
.detail[data-category=music] .shelf-layout-v32 .shelf-credit{font-size:clamp(18px,1.6vw,23px);line-height:1.45;margin:0 0 22px;color:inherit;opacity:.65;}
.detail[data-category=music] .shelf-layout-v32 .shelf-note{font-size:clamp(20px,1.8vw,27px);line-height:1.65;margin:24px 0;max-width:48ch;outline:none;color:inherit;}
.detail[data-category=music] .shelf-focus-book .shelf-note{font-family:Georgia,'Times New Roman',serif;}
.detail[data-category=music] .shelf-layout-v32 :is(.shelf-focus-navigation button,.shelf-reading-toggle,.shelf-listen-toggle){min-height:48px;font-size:18px;line-height:1.35;border-radius:14px;padding:12px 16px;display:inline-flex;align-items:center;gap:10px;box-sizing:border-box;color:inherit;background:#ffffff38;cursor:pointer;}
.detail[data-category=music] .shelf-layout-v32 :is(.shelf-reading-toggle,.shelf-listen-toggle){border:1px solid #a2aeb43b;}
.detail[data-category=music] .shelf-layout-v32 button:focus-visible{outline:2px solid currentColor;outline-offset:4px;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-navigation{display:flex;gap:12px;margin-top:28px;padding:0;border:0;flex-wrap:wrap;align-items:center;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-navigation button{max-width:none;text-align:left;flex:0 1 auto;font-size:17px;}
.detail[data-category=music] .shelf-layout-v32 .shelf-focus-navigation svg{width:20px;height:20px;flex:none;}
.detail[data-category=music] .shelf-focus-book.shelf-layout-v32[data-reading=true]{grid-template-columns:1fr;}
.detail[data-category=music] .shelf-focus-book.shelf-layout-v32[data-reading=true] .shelf-focus-art{display:none;}
.detail[data-category=music] .shelf-focus-book.shelf-layout-v32[data-reading=true] .shelf-focus-copy{max-width:760px;margin:auto;}
.detail[data-category=music] .shelf-focus-book.shelf-layout-v32[data-reading=true] .shelf-note{font-size:clamp(24px,2.5vw,32px);line-height:1.8;max-width:40ch;}
.detail[data-category=music] .shelf-focus-podcast.shelf-layout-v32 .shelf-focus-cover{aspect-ratio:1;width:min(100%,380px);}
.detail[data-category=music] .shelf-layout-v32 .shelf-podcast-player{margin:22px 0;}
.detail[data-category=music] .shelf-layout-v32 .shelf-podcast-player iframe{display:block;width:100%;height:350px;max-height:60vh;border:0;border-radius:14px;}
.detail[data-category=music] .shelf-layout-v32 .shelf-player-status{font-size:17px;line-height:1.5;color:inherit;opacity:.65;}
@media(max-width:700px){.detail[data-category=music] .shelf-layout-v32{grid-template-columns:1fr;gap:24px;padding:12px 18px 34px;}.detail[data-category=music] .shelf-layout-v32 .shelf-focus-art{padding:0;}.detail[data-category=music] .shelf-layout-v32 .shelf-focus-cover{width:min(55vw,240px);}.detail[data-category=music] .shelf-focus-podcast.shelf-layout-v32 .shelf-focus-cover{width:min(68vw,280px);}.detail[data-category=music] .shelf-layout-v32 .shelf-focus-copy h2{font-size:36px;}.detail[data-category=music] .shelf-layout-v32 .shelf-note{font-size:21px;}.detail[data-category=music] .shelf-layout-v32 .shelf-focus-navigation button{font-size:17px;}}
/* The live cover can briefly hold its own place while the description moves. */
.detail[data-category=music] .shelf-layout-v32{position:relative;}


/* collection-entrance-v33.css */
.detail[data-category=music] .collection-entrance{width:min(1260px,100%);margin:auto;color:inherit;padding:24px clamp(16px,3vw,40px) 36px;box-sizing:border-box;}
.detail[data-category=music] .collection-entrance-heading{margin:0 0 22px;}
.detail[data-category=music] .collection-entrance-heading h2{font-size:clamp(24px,2vw,30px);line-height:1.2;letter-spacing:-.035em;font-weight:500;color:inherit;margin:0;outline:none;}
.detail[data-category=music] .collection-doorways{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,4vw,60px);padding:16px 4px 26px;}
.detail[data-category=music] .collection-doorway{position:relative;display:flex;align-items:flex-start;flex-direction:column;border:0;background:transparent;color:inherit;text-align:left;min-width:0;min-height:48px;padding:0;border-radius:8px;cursor:pointer;font:inherit;}
.detail[data-category=music] .collection-doorway-art{position:relative;width:100%;height:clamp(205px,25dvh,280px);display:block;isolation:isolate;margin-bottom:24px;}
.detail[data-category=music] .collection-cover{display:block;position:absolute;object-fit:contain;max-width:none;max-height:calc(100% - 16px);box-shadow:0 18px 24px -18px #293b3a66;transition:transform .4s cubic-bezier(.22,1,.36,1);border:0;border-radius:5px;box-sizing:border-box;bottom:8px;}
.detail[data-category=music] :is(.collection-doorway-made,.collection-doorway-music) .collection-cover{width:72%;aspect-ratio:1;}
.detail[data-category=music] .collection-cover-back{left:0;bottom:23px;transform:rotate(-5deg);}
.detail[data-category=music] .collection-cover-front{right:0;transform:rotate(3deg);}
.detail[data-category=music] .collection-doorway-music .collection-cover-front{left:14%;right:auto;transform:none;}
.detail[data-category=music] .collection-doorway-films .collection-cover{width:52%;aspect-ratio:2/3;}
.detail[data-category=music] .collection-doorway-films .collection-cover-back{left:0;transform:rotate(-6deg);}
.detail[data-category=music] .collection-doorway-films .collection-cover-middle{right:0;bottom:23px;transform:rotate(6deg);}
.detail[data-category=music] .collection-doorway-films .collection-cover-front{left:24%;bottom:8px;transform:none;}
.detail[data-category=music] .collection-doorway-shelf .collection-cover{width:57%;aspect-ratio:2/3;}
.detail[data-category=music] .collection-doorway-title{display:block;font-size:clamp(21px,2vw,28px);line-height:1.2;letter-spacing:-.035em;font-weight:500;}
.detail[data-category=music] .collection-doorway-title>span{font-size:.7em;margin-left:4px;opacity:.5;}
.detail[data-category=music] .collection-library-invitation{display:flex;justify-content:flex-end;margin:24px 0 0;}
.detail[data-category=music] .collection-library-invitation button{display:inline-flex;align-items:center;gap:20px;font:inherit;font-size:18px;color:inherit;min-height:52px;padding:12px 18px;border:1px solid #ffffff80;border-radius:28px;background:#ffffff40;cursor:pointer;}
.detail[data-category=music] .collection-library-invitation button>span:first-child{font-size:14px;opacity:.6;font-variant-numeric:tabular-nums;}
.detail[data-category=music] .collection-entrance button:focus-visible{outline:2px solid currentColor;outline-offset:7px;}
@media(hover:hover){.detail[data-category=music] .collection-doorway:is(:hover,:focus-visible) .collection-cover-front{transform:translateY(-5px) rotate(0deg);}}
@media(max-width:700px){.detail[data-category=music] .collection-entrance{padding:14px 18px 30px;}.detail[data-category=music] .collection-doorways{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 28px;padding-top:4px;}.detail[data-category=music] .collection-doorway-art{height:clamp(165px,46vw,230px);margin-bottom:16px;}.detail[data-category=music] .collection-doorway-title{font-size:clamp(18px,4.6vw,21px);}.detail[data-category=music] .collection-library-invitation{justify-content:center;margin-top:18px;}}
@media(prefers-reduced-motion:reduce){.detail[data-category=music] .collection-cover{transition:none!important;transform:none!important;}}
body.motion-paused .detail[data-category=music] .collection-cover{transition:none!important;transform:none!important;}

/* The app and game names use quiet supporting copy; keep it readable on their pale surfaces. */
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .showcase-node-note,
body>dialog.cohesive-world[data-room-mode][data-category=games] [data-gallery=games] .showcase-node-note{color:#536879;font-size:15px;}


/* made-overview-v33.css */
.detail[data-category=music] .made-overview{width:min(1060px,100%);margin:0 auto;padding:clamp(24px,4vw,50px) clamp(12px,2vw,24px) 40px;color:#30413e;box-sizing:border-box;}
.detail[data-category=music] .made-overview-heading h2{font-size:clamp(40px,5.5vw,76px);line-height:1.05;letter-spacing:-.04em;font-weight:550;color:#30413e;margin:0;outline:none;}
.detail[data-category=music] .made-overview-heading p{font-size:clamp(18px,1.8vw,25px);line-height:1.5;color:#6a766d;margin:16px 0 34px;}
.detail[data-category=music] .made-overview h3{font-size:20px;font-weight:500;letter-spacing:-.02em;color:#68766d;margin:0 0 20px;}
.detail[data-category=music] .made-releases{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);}
.detail[data-category=music] .made-release{display:flex;flex-direction:column;align-items:flex-start;padding:0 0 8px;border:0;border-radius:4px;background:none;color:#30413e;font:inherit;text-align:left;min-width:0;min-height:44px;cursor:pointer;}
.detail[data-category=music] .made-release-art{display:block;width:min(100%,410px);aspect-ratio:1;overflow:hidden;border-radius:7px;box-shadow:0 24px 38px -24px #3d514e66;}
.detail[data-category=music] .made-release-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.detail[data-category=music] .made-release>strong{font-size:clamp(25px,3vw,38px);line-height:1.15;letter-spacing:-.035em;font-weight:550;margin-top:20px;}
.detail[data-category=music] .made-release>strong>span{font-size:.7em;color:#6a766d;margin-left:7px;}
.detail[data-category=music] .made-release-credit{font-size:17px;line-height:1.5;color:#6a766d;margin-top:8px;}
.detail[data-category=music] .made-recordings-section{margin-top:42px;padding-top:26px;border-top:1px solid #71827535;}
.detail[data-category=music] .made-recordings{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
.detail[data-category=music] .made-recording{display:flex;align-items:center;gap:20px;min-height:120px;padding:0;border:0;border-radius:5px;background:none;color:#30413e;font:inherit;text-align:left;cursor:pointer;min-width:0;}
.detail[data-category=music] .made-recording-art{display:block;flex:none;width:112px;aspect-ratio:1;border-radius:5px;overflow:hidden;box-shadow:0 10px 20px -15px #344a4870;}
.detail[data-category=music] .made-recording-art img{width:100%;height:100%;display:block;object-fit:cover;}
.detail[data-category=music] .made-recording-copy{display:flex;flex-direction:column;gap:7px;min-width:0;}
.detail[data-category=music] .made-recording-copy strong{font-size:clamp(21px,2vw,27px);line-height:1.15;font-weight:550;letter-spacing:-.025em;}
.detail[data-category=music] .made-recording-copy>span{font-size:16px;line-height:1.4;color:#6a766d;}
.detail[data-category=music] .made-recording-enter{margin-left:auto;font-size:24px;color:#6a766d;}
.detail[data-category=music] .made-overview button:focus-visible{outline:2px solid #3e7560;outline-offset:7px;}
@media(hover:hover){.detail[data-category=music] .made-release:hover .made-release-art img{transform:scale(1.025);}}
@media(max-width:700px){
 .detail[data-category=music] .made-overview{padding:24px 14px 30px;}
 .detail[data-category=music] .made-overview-heading h2{font-size:42px;}
 .detail[data-category=music] .made-overview-heading p{font-size:18px;margin-bottom:28px;}
 .detail[data-category=music] .made-releases{gap:18px;}
 .detail[data-category=music] .made-release>strong{font-size:24px;margin-top:15px;}
 .detail[data-category=music] .made-release-credit{font-size:15px;}
 .detail[data-category=music] .made-recordings{grid-template-columns:1fr;gap:24px;}
 .detail[data-category=music] .made-recording{min-height:96px;gap:17px;}
 .detail[data-category=music] .made-recording-art{width:88px;}
 .detail[data-category=music] .made-recording-copy strong{font-size:23px;}
 .detail[data-category=music] .made-recording-copy>span{font-size:15px;}
}
@media(prefers-reduced-motion:reduce){.detail[data-category=music] .made-overview img{transition:none!important;transform:none!important;}}
body.motion-paused .detail[data-category=music] .made-overview img{transition:none!important;transform:none!important;}
@media(min-width:701px){
 .detail[data-category=music] .made-overview{padding-block:20px 26px;}
 .detail[data-category=music] .made-overview-heading h2{font-size:clamp(42px,4vw,60px);}
 .detail[data-category=music] .made-overview-heading p{font-size:20px;margin:12px 0 20px;}
 .detail[data-category=music] .made-overview h3{font-size:17px;margin-bottom:14px;}
 .detail[data-category=music] .made-release-art{width:min(100%,clamp(180px,25dvh,300px));}
 .detail[data-category=music] .made-release>strong{font-size:28px;margin-top:14px;}
 .detail[data-category=music] .made-release-credit{font-size:15px;margin-top:6px;}
 .detail[data-category=music] .made-recordings-section{margin-top:24px;padding-top:18px;}
 .detail[data-category=music] .made-recording{min-height:82px;gap:18px;}
 .detail[data-category=music] .made-recording-art{width:82px;}
 .detail[data-category=music] .made-recording-copy strong{font-size:23px;}
 .detail[data-category=music] .made-recording-copy>span{font-size:15px;}
}
/* A typographic listening object for a release whose supplied artwork is a
   file-thumbnail. This is interface typography, not invented release artwork. */
.detail[data-category=music] .made-release-typography{display:flex;width:100%;height:100%;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:9%;box-sizing:border-box;background:linear-gradient(145deg,#3b443b,#202b24);color:#f6f2d9;text-align:left;}
.detail[data-category=music] .made-release-typography>span:first-child{font-size:clamp(9px,1vw,13px);letter-spacing:.12em;}
.detail[data-category=music] .made-release-typography>strong{font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,4.3vw,63px);font-style:italic;font-weight:400;letter-spacing:-.04em;line-height:.95;}
.detail[data-category=music] .made-release-typography>span:last-child{font-size:clamp(9px,1vw,12px);letter-spacing:.04em;}
@media(max-width:700px){.detail[data-category=music] .made-release-typography>strong{font-size:clamp(28px,8.5vw,46px);}}
.detail[data-category=music] .made-overview-heading h2{font-size:clamp(24px,2vw,30px);font-weight:500;line-height:1.2;letter-spacing:-.035em;}
.detail[data-category=music] .made-overview-heading{margin-bottom:24px;}
.detail[data-category=music] .made-release-art{border:0;background:transparent;}
.detail[data-category=music] .made-release-art img{object-fit:contain;}

/* The complete verified KOOPIE shelf: cover first, readable titles, one artist link. */
.detail[data-category=music] .made-release-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px}
.detail[data-category=music] .made-release-heading h3{margin:0}
.detail[data-category=music] .made-release-heading a{display:inline-flex;align-items:center;gap:8px;color:inherit;font-size:15px;line-height:1.4;text-underline-offset:4px;min-height:44px}
.detail[data-category=music] .made-releases{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
.detail[data-category=music] .made-release-art{width:100%;max-width:280px}
.detail[data-category=music] .made-release>strong{font-size:clamp(21px,2.1vw,28px);line-height:1.2;text-wrap:pretty;overflow-wrap:anywhere}
.detail[data-category=music] .made-overview{padding-bottom:100px}
@media(max-width:700px){.detail[data-category=music] .made-releases{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.detail[data-category=music] .made-release>strong{font-size:20px}.detail[data-category=music] .made-release-heading{align-items:center;gap:12px}.detail[data-category=music] .made-release-heading a{font-size:14px;max-width:140px}.detail[data-category=music] .made-release-heading h3{font-size:16px}}

/* My own releases and recordings as one cover row inside the Music room.
   The former Made by me overview (music/made) now lives here. */
.detail[data-category=music] .music-own{grid-column:1/-1;width:100%;min-width:0;margin:clamp(28px,5vw,56px) 0 0;padding:0;box-sizing:border-box;color:inherit;}
.detail[data-category=music] .music-own-heading{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 16px;margin-bottom:10px;}
.detail[data-category=music] .music-own-heading h3{margin:0;font-size:20px;font-weight:550;line-height:1.3;letter-spacing:-.02em;}
.detail[data-category=music] .music-own-heading a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:inherit;font-size:14px;line-height:1.4;text-underline-offset:4px;white-space:nowrap;}
.detail[data-category=music] .music-own-row{display:flex;gap:20px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:6px 4px 16px;margin-inline:-4px;scrollbar-width:thin;}
.detail[data-category=music] .music-own-item{flex:0 0 132px;display:flex;flex-direction:column;align-items:flex-start;min-width:0;min-height:44px;padding:0;border:0;border-radius:6px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;scroll-snap-align:start;}
.detail[data-category=music] .music-own-art{display:block;width:100%;aspect-ratio:1;overflow:hidden;border-radius:6px;background:#ffffff14;box-shadow:0 14px 24px -16px #000000a6;}
.detail[data-category=music] .music-own-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.22,1,.36,1);}
.detail[data-category=music] .music-own-item strong{margin-top:10px;font-size:14px;font-weight:550;line-height:1.3;overflow-wrap:anywhere;text-wrap:pretty;}
.detail[data-category=music] .music-own-credit{margin-top:3px;font-size:12px;line-height:1.4;opacity:.74;}
.detail[data-category=music] .music-own :is(button,a):focus-visible{outline:2px solid currentColor;outline-offset:4px;}
@media(hover:hover){.detail[data-category=music] .music-own-item:hover .music-own-art img{transform:scale(1.03);}}
@media(max-width:700px){
 .detail[data-category=music] .music-own-heading h3{font-size:17px;}
 .detail[data-category=music] .music-own-heading a{font-size:13px;}
 .detail[data-category=music] .music-own-row{gap:14px;}
 .detail[data-category=music] .music-own-item{flex-basis:112px;}
 .detail[data-category=music] .music-own-item strong{font-size:13px;}
}
@media(prefers-reduced-motion:reduce){.detail[data-category=music] .music-own-art img{transition:none;transform:none!important;}}
body.motion-paused .detail[data-category=music] .music-own-art img{transition:none;transform:none!important;}


/* app-preview-v34.css */
.app-preview-v34{display:flex;flex-direction:column;width:100%;min-width:0;color:#273b39;font-family:inherit;text-align:left;transform:none!important;}
.app-preview-v34 .ap-surface{display:block;min-height:290px;background:#f8fbf9e8;border:1px solid #fff;border-radius:15px;box-shadow:0 22px 36px -24px #203e4a55;padding:20px;box-sizing:border-box;overflow:hidden;font-size:16px;line-height:1.4;}
.app-preview-v34 .ap-caption{font-size:14px;color:#75837c;margin-top:12px;text-align:left;}
.app-preview-v34 strong{font-size:17px;font-weight:550;letter-spacing:-.02em;}
.app-preview-v34 .ap-search{border-bottom:1px solid #728b7d29;padding-bottom:14px;font-size:16px;display:flex;justify-content:space-between;gap:12px;}
.app-preview-v34 .ap-search>span{color:#7f8c84;white-space:nowrap;}
.app-preview-v34 .ap-tabs{display:flex;gap:20px;padding:12px 0;font-size:15px;color:#6b7b72;}
.app-preview-v34 .ap-tabs b{color:#254e40;font-weight:550;}
.app-preview-v34 .ap-quay-body{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;}
.app-preview-v34 .ap-quay-body p{margin:0;padding:10px;border-radius:7px;}
.app-preview-v34 .ap-quay-body p>span{display:block;font-size:15px;color:#78867c;margin-top:4px;}
.app-preview-v34 .ap-selected{background:#dcebe3;}
.app-preview-v34 .ap-inspector{padding:12px;border-left:1px solid #728b7d29;}
.app-preview-v34 .ap-inspector>span{display:block;color:#78867c;font-size:15px;margin-top:6px;}
.app-preview-v34 .ap-inspector p{padding:14px 0;font-size:16px;}
.app-preview-v34.ap-matchbar .ap-surface{background:#fffdf4;}
.app-preview-v34 .ap-match-club{display:flex;align-items:center;gap:16px;border-bottom:1px solid #a79b7430;padding-bottom:18px;}
.app-preview-v34 .ap-match-club img{width:50px;height:50px;object-fit:contain;}
.app-preview-v34 .ap-match-club>span>span{display:block;font-size:15px;color:#8b8069;margin-top:6px;}
.app-preview-v34 .ap-match-fixture{display:flex;align-items:center;flex-direction:column;gap:12px;padding:20px 0;color:#7d735c;}
.app-preview-v34 .ap-match-fixture>strong{font-size:22px;color:#363b35;display:flex;align-items:center;gap:20px;}
.app-preview-v34 .ap-match-fixture>strong>span{font-size:28px;color:#a69e8a;}
.app-preview-v34.ap-spoor .ap-surface{background:#f4f7ff;}
.app-preview-v34 .ap-spoor-top,.app-preview-v34 .ap-spoor-timeline,.app-preview-v34 .ap-spoor-files{display:flex;justify-content:space-between;gap:12px;}
.app-preview-v34 .ap-spoor-top>span{color:#6b78a0;font-size:15px;}
.app-preview-v34 .ap-spoor-timeline{margin:22px 0 18px;padding-bottom:12px;border-bottom:2px solid #c1cbe0;color:#6d7b9c;}
.app-preview-v34 .ap-spoor-timeline b{color:#3e5c91;}
.app-preview-v34 .ap-spoor-note>span{font-size:15px;color:#6d7b9c;display:block;margin-bottom:8px;}
.app-preview-v34 .ap-spoor-note>strong{font-size:20px;line-height:1.35;display:block;}
.app-preview-v34 .ap-spoor-note>p{font-size:15px;color:#6d7b9c;margin:10px 0 22px;}
.app-preview-v34 .ap-spoor-files{font-size:14px;color:#6d7b9c;flex-wrap:wrap;}
.app-preview-v34.ap-koop .ap-surface{background:#f6f7f5;max-width:430px;}
.app-preview-v34 .ap-koop-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;}
.app-preview-v34 .ap-koop-row>span>span{display:block;color:#7a847b;font-size:15px;margin-top:3px;}
.app-preview-v34 .ap-switch{width:33px;height:20px;border-radius:20px;background:#cbd0cb;position:relative;flex:none;}
.app-preview-v34 .ap-switch:after{content:'';position:absolute;width:16px;height:16px;background:#fff;border-radius:50%;top:2px;left:2px;box-shadow:0 1px 3px #0002;}
.app-preview-v34 .ap-switch.is-on{background:#478c68;}.app-preview-v34 .ap-switch.is-on:after{left:15px;}
.app-preview-v34 .ap-koop-footer{border-top:1px solid #8e9c8f33;margin-top:10px;padding-top:15px;display:flex;justify-content:space-between;font-size:15px;color:#768178;}
.pd-club-crest .pd-nac-badge{display:block;width:100%;height:100%;object-fit:contain;border-radius:0;}
.pd-club-dot .pd-nac-badge{display:block;width:100%;height:100%;object-fit:contain;}
@media(max-width:700px){.app-preview-v34 .ap-surface{padding:17px;min-height:270px;}.app-preview-v34 .ap-quay-body{grid-template-columns:1fr 1fr;}.app-preview-v34 .ap-tabs{gap:15px;}.app-preview-v34 .ap-match-fixture>strong{font-size:20px;gap:14px;}}
.project-demo.pd-koop[data-project-demo]{color:#2b403b;background:#f9fbf8;padding:clamp(20px,3vw,42px);border-radius:18px;box-sizing:border-box;}
.project-demo.pd-koop .pd-koop-workspace{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,60px);padding-top:30px;}
.project-demo.pd-koop .pd-koop-controls{border:1px solid #6e867c35;background:#fff9;border-radius:15px;padding:10px 18px;align-self:start;}
.project-demo.pd-koop .pd-koop-controls>button{display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;color:#2b403b;border:0;width:100%;padding:17px 0;text-align:left;min-height:64px;font:inherit;}
.project-demo.pd-koop .pd-koop-controls strong{font-size:21px;font-weight:500;}
.project-demo.pd-koop .pd-koop-controls small{display:block;font-size:17px;color:#75847a;margin-top:4px;}
.project-demo.pd-koop .ap-switch{display:block;width:36px;height:22px;border-radius:20px;background:#cbd2cc;position:relative;flex:none;}
.project-demo.pd-koop .ap-switch:after{content:'';position:absolute;width:18px;height:18px;top:2px;left:2px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0002;}
.project-demo.pd-koop .ap-switch.is-on{background:#428460;}.project-demo.pd-koop .ap-switch.is-on:after{left:16px;}
.project-demo.pd-koop .pd-koop-scenes h3{font-size:32px;font-weight:500;margin:0 0 14px;color:#2b403b;}
.project-demo.pd-koop .pd-koop-scenes p{font-size:19px;line-height:1.6;color:#6c7e72;}
.project-demo.pd-koop .pd-koop-scenes>div{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0;}
.project-demo.pd-koop .pd-koop-scenes button{font:inherit;font-size:20px;min-height:56px;padding:14px 22px;border:1px solid #7f95853a;border-radius:12px;background:#fff8;color:#2b403b;}
.project-demo.pd-koop .pd-koop-scenes button[aria-pressed=true]{background:#3d7858;color:#fff;}
.project-demo.pd-koop .pd-koop-scenes[hidden]{display:none;}
.project-demo.pd-koop button:focus-visible{outline:2px solid #458265;outline-offset:4px;}
@media(max-width:700px){.project-demo.pd-koop .pd-koop-workspace{grid-template-columns:1fr;gap:26px;padding-top:20px;}}

/* App previews keep their natural content, while paired captions share a baseline. */
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .showcase-garden{align-items:stretch;}
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .showcase-node{height:100%;}
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .showcase-node-inner{display:flex;flex-direction:column;align-items:stretch;height:100%;}
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .showcase-node-art{flex:1;align-items:stretch;}
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .app-preview-v34{height:100%;}
body>dialog.cohesive-world[data-room-mode][data-category=apps] [data-gallery=apps] .app-preview-v34 .ap-surface{flex:1;}
.app-preview-v34 .ap-level{display:block;height:6px;border-radius:6px;background:#cbd0cb;margin:-4px 0 6px;overflow:hidden;}.app-preview-v34 .ap-level i{display:block;height:100%;background:#478c68;border-radius:6px;}


/* cohesion-v34.css */
/* One portfolio: the hub's light, glass controls and reversible camera remain
   common. Covers and actual app interfaces determine the content geometry. */
/* --pill-clear: the fixed sound pills bottom right stand 64px tall with their offset; scrolling rooms end with that much room plus air, so the last line scrolls clear of them. */
.cohesive-world{--pill-clear:calc(76px + env(safe-area-inset-bottom,0px));--world-pad:clamp(20px,4.4vw,80px);--world-ink:#293a48;--world-muted:#72808f;--world-line:#6d80971b;}
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]):not([data-app-workspace]) .world-atmosphere{background:radial-gradient(ellipse at 17% 32%,rgb(var(--room-signal,130 160 190)/.09),transparent 54%),radial-gradient(ellipse at 84% 88%,rgb(var(--room-signal,130 160 190)/.075),transparent 48%),#f4f6f8;}
.cohesive-world:not([data-category=play]) .world-atmosphere>span{opacity:.2;}
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar{position:relative;z-index:15;display:flex;align-items:center;gap:12px;flex:none;height:clamp(72px,9dvh,92px);padding:8px var(--world-pad);color:var(--world-ink);}
body>dialog.cohesive-world[data-room-mode] .world-back{min-height:44px;padding:8px 12px 8px 0;border-radius:24px;font-size:15px;color:inherit;gap:10px;max-width:34%;}
body>dialog.cohesive-world[data-room-mode] .world-back>span:first-child{font-size:27px;line-height:1;}
.cohesive-world .breadcrumb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cohesive-world .world-switcher{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:5;}
.cohesive-world .world-switcher-toggle{display:flex;align-items:center;gap:13px;list-style:none;cursor:pointer;min-height:44px;padding:8px 17px;border:1px solid #ffffffb3;border-radius:28px;background:#ffffff4a;box-shadow:inset 0 1px 0 #fff9;color:inherit;}
.cohesive-world .world-switcher-toggle::-webkit-details-marker{display:none;}
.cohesive-world .world-switcher-toggle>svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.4;opacity:.5;}
body>dialog.cohesive-world[data-room-mode] .world-category{position:static;transform:none;translate:none;display:flex;align-items:center;gap:9px;margin:0;font-size:16px;font-weight:580;color:inherit;white-space:nowrap;}
body>dialog.cohesive-world[data-room-mode] .world-category svg{width:17px;height:17px;}
.cohesive-world .world-switcher-menu{position:absolute;top:calc(100% + 10px);left:50%;translate:-50% 0;width:246px;padding:9px;border:1px solid #fff;border-radius:22px;background:#f8fafbee;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:#344655;box-shadow:0 15px 55px -16px #3b53663b;}
body>dialog.cohesive-world[data-room-mode] .world-nav{display:flex;flex-direction:column;align-items:stretch;gap:3px;margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;}
body>dialog.cohesive-world[data-room-mode] .world-nav .mini-bubble{position:static;display:flex;align-items:center;justify-content:flex-start;gap:13px;width:100%;height:46px;min-height:44px;margin:0;padding:11px 14px;border:0;border-radius:14px;background:none;box-shadow:none;opacity:.78;color:inherit;transform:none;translate:none;scale:1;animation:none;font:inherit;font-size:16px;}
body>dialog.cohesive-world[data-room-mode] .world-nav .mini-bubble>svg{color:var(--color,currentColor);}
body>dialog.cohesive-world[data-room-mode] .world-nav .mini-bubble:hover{background:rgb(var(--tint,var(--room-signal,130 160 190))/.08);opacity:1;}
body>dialog.cohesive-world[data-room-mode] .world-nav .mini-bubble:focus-visible{outline:2px solid rgb(var(--tint,var(--room-signal,130 160 190))/.55);outline-offset:-2px;}
body>dialog.cohesive-world[data-room-mode] .world-nav .mini-bubble[aria-pressed=true]{background:rgb(var(--tint,var(--room-signal,130 160 190))/.13);color:inherit;font-weight:610;letter-spacing:-.01em;opacity:1;}
.cohesive-world .world-nav .mini-bubble>svg{width:19px;height:19px;fill:currentColor;flex:none;}
.cohesive-world .world-nav-label{position:static;display:block;opacity:1;visibility:visible;color:inherit;transform:none;white-space:nowrap;}
body>dialog.cohesive-world[data-room-mode] .world-exit{position:static;display:flex;align-items:center;justify-content:space-between;width:100%;height:49px;margin:7px 0 0;padding:11px 14px;border:0;border-top:1px solid #62748c1c;border-radius:0;background:none;font-size:15px;color:inherit;}
.cohesive-world .world-exit kbd{font-size:11px;color:#7c8996;}
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-find{display:flex;align-items:center;justify-content:center;margin-left:auto;width:44px;height:44px;padding:12px;color:inherit;background:#ffffff4a;border:1px solid #ffffff80;border-radius:50%;}
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-keys{display:flex;align-items:center;gap:8px;margin:0;padding:10px 14px;min-height:44px;height:44px;border-radius:24px;font-size:14px;color:inherit;background:#ffffff4a;border:1px solid #ffffff80;}
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-stage{width:100%;max-width:none;min-height:0;flex:1;margin:0;justify-content:flex-start;padding:clamp(12px,2.5dvh,28px) var(--world-pad) var(--pill-clear);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#7f8a9a38 transparent;}
.cohesive-world .showcase-home[data-gallery]{width:100%;max-width:1260px;margin:12px auto 0;flex:none;}
.cohesive-world .project-filters{display:flex;align-items:center;gap:5px;width:max-content;margin:0 0 32px;padding:5px;background:#ffffff70;border:1px solid #fff;border-radius:30px;box-shadow:0 5px 20px #52677e05;}
.cohesive-world .project-filters button{padding:9px 20px;min-height:40px;background:transparent;border:0;border-radius:24px;font-size:15px;color:#798694;white-space:nowrap;}
.cohesive-world .project-filters button[aria-pressed=true]{color:#304557;background:#fff;box-shadow:0 3px 9px #405c7010;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-garden{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:38px 32px;width:100%;height:auto;min-height:0;max-width:none;margin:0;perspective:none;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node{position:relative;display:block;inset:auto;left:auto;top:auto;width:100%;height:auto;min-width:0;min-height:0;max-width:100%;aspect-ratio:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:#2c3d4b;text-align:left;isolation:isolate;translate:none;transform:none;rotate:none;scale:1;animation:none;transition:transform 260ms cubic-bezier(.23,1,.32,1);}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-inner{position:static;display:block;inset:auto;width:100%;height:auto;min-height:0;padding:0;gap:0;animation:none;translate:none;rotate:none;scale:1;transform:none;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-art{position:relative;inset:auto;display:flex;align-items:center;justify-content:center;width:100%;height:auto;min-height:0;aspect-ratio:16/10;margin:0;border:0;border-radius:15px;overflow:hidden;perspective:none;background:rgb(var(--showcase-tint)/.09);box-shadow:0 15px 28px -22px rgb(var(--showcase-tint)/.5);transform:none;rotate:none;scale:1;transition:none;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-art>img{position:static;inset:auto;display:block;width:100%;height:100%;object-fit:cover;border:0;border-radius:0;margin:0;box-shadow:none;transform:none;rotate:none;scale:1;filter:none;transition:none;}
.cohesive-world [data-gallery] .showcase-node-caption{display:flex;align-items:flex-start;flex-direction:column;gap:6px;padding:17px 3px 0;}
.cohesive-world [data-gallery] .showcase-node-caption>strong{font-size:clamp(19px,1.65vw,24px);font-weight:580;line-height:1.25;letter-spacing:-.045em;white-space:normal;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-note{position:static;display:block;top:auto;left:auto;translate:none;white-space:normal;max-width:none;margin:0;color:#7d8996;font-size:14px;line-height:1.5;font-weight:400;}
.cohesive-world [data-gallery] .showcase-node-glint{display:none;}
.cohesive-world [data-gallery] [data-cover-kind=square] .showcase-node-art{background:none;box-shadow:none;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] [data-cover-kind=square] .showcase-node-art>img{object-fit:contain;border-radius:8px;width:auto;max-width:100%;box-shadow:0 10px 20px -14px #26384855;}
.cohesive-world .project-zazu-mark{font-size:clamp(70px,8vw,120px);letter-spacing:-.09em;line-height:1;font-weight:720;color:#263d3b;}
.cohesive-world .project-zazu-mark>span{color:#d5a267;}
.cohesive-world .project-word-rack{display:flex;align-items:center;gap:7px;transform:rotate(-5deg);}
.cohesive-world .project-word-rack>i{display:grid;place-items:center;position:relative;width:clamp(34px,4vw,52px);aspect-ratio:1;border-radius:6px;font-style:normal;font-size:28px;font-weight:550;color:#665832;background:linear-gradient(150deg,#fff3cd,#dccb94);box-shadow:inset 0 1px 1px #fff,0 3px 0 #b7a375,0 8px 13px #6a5e3420;}
.cohesive-world .project-word-rack small{position:absolute;bottom:3px;right:4px;font-size:9px;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] [data-cover-kind=memoji] .showcase-node-art>img{width:auto;height:90%;object-fit:contain;}
.cohesive-world .project-video-time{position:absolute;bottom:12px;right:14px;display:flex;align-items:center;gap:14px;font-size:12px;color:#526777;}
.cohesive-world .project-reading-cover{display:grid;grid-template-columns:60px 1fr;align-content:center;gap:15px;padding:30px;width:100%;height:100%;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .project-reading-cover>img{width:60px;height:60px;object-fit:contain;border-radius:10px;grid-column:1;grid-row:2;}
.cohesive-world .project-reading-cover>span{font-size:12px;color:#7e8994;grid-column:1/-1;}
.cohesive-world .project-reading-cover>strong{font-size:clamp(20px,2vw,30px);font-weight:520;letter-spacing:-.045em;line-height:1.13;grid-column:2;grid-row:2;align-self:center;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .showcase-garden{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 40px;max-width:1160px;margin:auto;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .showcase-node-art{aspect-ratio:auto;background:none;box-shadow:none;overflow:visible;border-radius:0;}
.cohesive-world [data-gallery=apps] .app-preview-v34 .ap-caption{display:none;}
.cohesive-world [data-gallery=apps] .app-preview-v34 .ap-surface{min-height:300px;max-width:none;}
.cohesive-world [data-gallery=apps] .showcase-node-caption{padding-top:20px;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=games] .showcase-garden{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 42px;max-width:1120px;margin:auto;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=games] .showcase-node-art{aspect-ratio:16/9;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=games] [data-cover-kind=brand] .showcase-node-art>img{object-fit:cover;}
/* Single ownership: hover moves the whole cover, never flips its image. */
@media(hover:hover) and (pointer:fine){body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:hover{transform:translateY(-3px) scale(1.012);scale:1;}body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:hover .showcase-node-art>img{transform:none;scale:1;rotate:none;}}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:focus-visible{outline:2px solid rgb(var(--room-signal)/.5);outline-offset:9px;border-radius:15px;}
/* The artifact gets the space. Its explanation stays one deliberate step away. */
body>dialog.cohesive-world[data-room-mode]:not([data-app-workspace]) .showcase-focus{max-width:1360px;margin:auto;gap:clamp(28px,5vw,80px);padding:12px 0;grid-template-columns:minmax(220px,.7fr) minmax(0,1.7fr);}
body>dialog.cohesive-world[data-room-mode] .showcase-copy h2{font-size:clamp(30px,3.4vw,52px);letter-spacing:-.05em;margin:0 0 22px;}
body>dialog.cohesive-world[data-room-mode] .showcase-copy>p{font-size:17px;line-height:1.65;max-width:37ch;}
body>dialog.cohesive-world[data-room-mode] .showcase-story{margin:22px 0 0;}
body>dialog.cohesive-world[data-room-mode] .showcase-story summary{font-size:15px;min-height:44px;}
body>dialog.cohesive-world[data-room-mode] .showcase-story p{font-size:15px;line-height:1.65;}
body>dialog.cohesive-world[data-room-mode] .showcase-game-link{font-size:14px;min-height:44px;padding-block:12px;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games][data-room-mode=artifact] .showcase-focus{display:block;width:100%;max-width:none;height:100%;min-height:0;padding:0;margin:0;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games][data-room-mode=artifact] .showcase-copy{position:absolute;inset:auto;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;margin:0;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games][data-room-mode=artifact] .showcase-demo{width:100%;height:100%;min-height:min(650px,calc(100dvh - 124px));}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games][data-room-mode=artifact] .world-stage{padding:8px clamp(16px,2.5vw,40px) max(20px,env(safe-area-inset-bottom));}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] :is(.showcase-quiz,.showcase-song){width:100%;min-height:100%;border:0;box-shadow:none;border-radius:22px;padding:clamp(24px,4vw,64px);display:flex;flex-direction:column;justify-content:center;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz-body{width:min(1100px,100%);margin:auto;padding-top:clamp(18px,4dvh,45px);}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz-top{width:100%;max-width:1300px;margin:0 auto;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-question{font-size:clamp(30px,3.5vw,58px);line-height:1.15;max-width:28ch;min-height:0;margin:18px 0 32px;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-answer{min-height:clamp(64px,9dvh,100px);padding:18px 22px;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-answer>strong{font-size:clamp(20px,2.1vw,30px);}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz-footer{padding-top:20px;width:min(1100px,100%);margin:0 auto;font-size:14px;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-word{width:min(1100px,100%);min-height:100%;margin:auto;padding:clamp(20px,3vw,45px);background:#f1f1e6;border:1px solid #fff;border-radius:22px;box-shadow:none;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-word-board{max-width:440px;margin:18px auto;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-word-rack{max-width:540px;margin:20px auto;}
body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-song-prompt{font-size:clamp(28px,3.5vw,50px);}
body>dialog.cohesive-world[data-room-mode][data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-stage{padding-top:0;padding-bottom:24px;}
body>dialog.cohesive-world[data-room-mode][data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-about-toggle{min-height:44px;height:44px;font-size:14px;border-radius:25px;margin:0;padding:10px 16px;order:4;}
body>dialog.cohesive-world[data-room-mode][data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .world-find{margin-left:auto;}
/* Pause remains the same DOM control, now with the other preferences. */
.explorer-motion-setting{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:18px;padding-top:16px;border-top:1px solid #62748b1c;font-size:13px;color:#65768b;}
.explorer-motion-setting .motion-toggle{position:static;width:auto;height:40px;min-height:40px;padding:9px 13px;border:1px solid #cbd5e251;border-radius:22px;display:flex;align-items:center;gap:9px;background:#fff8;color:#586e86;}
.explorer-motion-setting .motion-toggle svg{width:17px;height:17px;}
.explorer-motion-setting .motion-toggle>span{font-size:12px;}
.cinema-room .cohesive-world{--world-ink:#e4e8ed;}
.cinema-room .cohesive-world .world-switcher-toggle,.cinema-room .cohesive-world :is(.world-find,.world-keys){border-color:#ffffff1c;background:#ffffff09;}
.cinema-room .cohesive-world .world-switcher-menu{background:#1d232fee;border-color:#ffffff20;color:#e4e8ed;}
.cinema-room .cohesive-world .world-nav .mini-bubble:hover{background:#ffffff10;}
.cohesive-world .world-switcher-toggle:focus-visible{outline:2px solid #7d9cbb;outline-offset:4px;}
@media(min-width:1700px){.cohesive-world .showcase-home[data-gallery]{max-width:1460px;}body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-garden{gap:52px 44px;}.cohesive-world [data-gallery] .showcase-node-note{font-size:16px;}}
@media(max-width:950px){body>dialog.cohesive-world[data-room-mode] [data-gallery=projects] .showcase-garden{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;}body>dialog.cohesive-world[data-room-mode] .world-toolbar{gap:8px;}.cohesive-world .world-back .breadcrumb{max-width:19vw;}body>dialog.cohesive-world[data-room-mode] .world-keys kbd{display:none;}body>dialog.cohesive-world[data-room-mode]:not([data-app-workspace]) .showcase-focus{grid-template-columns:1fr;gap:30px;}body>dialog.cohesive-world[data-room-mode] .showcase-copy{max-width:650px;}body>dialog.cohesive-world[data-room-mode] .showcase-copy>p{max-width:55ch;}}
@media(max-width:650px){.cohesive-world{--world-pad:22px;}body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar{height:72px;gap:5px;padding:7px 16px;}body>dialog.cohesive-world[data-room-mode] .world-back{max-width:72px;padding:10px 6px;}.cohesive-world .world-back .breadcrumb{display:none;}.cohesive-world .world-switcher{left:48%;max-width:46%;}.cohesive-world .world-switcher-toggle{padding:8px 13px;gap:7px;}body>dialog.cohesive-world[data-room-mode] .world-category{font-size:15px;gap:7px;}body>dialog.cohesive-world[data-room-mode] .world-category span{overflow:hidden;text-overflow:ellipsis;max-width:34vw;}body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-find{width:40px;height:40px;padding:11px;}body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-keys{font-size:12px;padding:8px 9px;height:40px;min-height:40px;}body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-garden,body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .showcase-garden,body>dialog.cohesive-world[data-room-mode] [data-gallery=games] .showcase-garden{grid-template-columns:1fr;gap:34px;}body>dialog.cohesive-world[data-room-mode] [data-gallery=projects] .showcase-garden{grid-template-columns:1fr;}body>dialog.cohesive-world[data-room-mode] .world-stage{padding-top:15px;}.cohesive-world .project-filters{width:100%;justify-content:space-between;margin-bottom:28px;gap:0;padding:4px;}.cohesive-world .project-filters button{padding:8px 17px;font-size:14px;}body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-caption{padding-top:14px;}.cohesive-world [data-gallery] .showcase-node-caption>strong{font-size:23px;}.cohesive-world [data-gallery] .showcase-node-note{font-size:15px;}.cohesive-world .project-word-rack>i{width:48px;font-size:30px;}.cohesive-world .project-zazu-mark{font-size:100px;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz{padding:24px 20px;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-question{font-size:30px;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-answers{grid-template-columns:1fr;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-answer{min-height:64px;padding:15px 17px;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz .showcase-answer>strong{font-size:21px;}body>dialog.cohesive-world[data-room-mode][data-room-identity=games] .showcase-quiz-footer{font-size:12px;}.cohesive-world[data-app-workspace] .world-keys{display:none!important;}body>dialog.cohesive-world[data-room-mode][data-app-workspace][data-room-identity=apps][data-room-mode=artifact] .app-about-toggle{font-size:12px;padding:8px 12px;}.cohesive-world .world-switcher-menu{width:220px;}}
@media(prefers-reduced-motion:reduce){.cohesive-world [data-gallery] .showcase-node{transition:none;}body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:hover{transform:none;}}
/* Light answers attention with the same restraint as the overview. */
.cohesive-world .world-attention-light{position:absolute;left:calc(50% - 34vw);top:calc(50% - 34vw);width:68vw;height:68vw;border-radius:50%;background:radial-gradient(ellipse,rgb(var(--attention-tint,130 160 190)/.13),transparent 67%);opacity:0;transform:translate(0,0) scale(.85);transition:opacity 700ms ease,transform 850ms cubic-bezier(.22,1,.36,1);pointer-events:none;}
.cohesive-world[data-object-attention=true] .world-attention-light{opacity:1;}
.cinema-room .cohesive-world .world-attention-light,.cohesive-world[data-category=play] .world-attention-light{display:none;}
@media(prefers-reduced-motion:reduce){.cohesive-world .world-attention-light{transition:none;}}
.cohesive-world .world-switcher-menu{max-height:calc(100dvh - 104px);overflow-y:auto;overscroll-behavior:contain;}
.cohesive-world .world-original{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;min-height:44px;font-size:15px;color:inherit;text-decoration:none;border-radius:14px;}
.cohesive-world .world-original:hover{background:#798b9b15;}
.cohesive-world .showcase-game-focus .showcase-copy>:not(h2){display:none;}
@media(max-width:650px){.cohesive-world[data-app-workspace=matchbar] .project-demo.pd-matchbar .pd-titlebar{gap:12px;align-items:flex-start;}.cohesive-world[data-app-workspace=matchbar] .project-demo.pd-matchbar .pd-titlebar>small{flex:0 1 40%;max-width:40%;min-width:0;white-space:normal;overflow-wrap:anywhere;font-size:12px;line-height:1.45;text-align:right;}}

/* Gallery children must shrink to their actual grid track, not image min-content. */
body>dialog.cohesive-world[data-room-mode] [data-gallery] :is(.showcase-node-inner,.showcase-node-art,.showcase-node-caption,.app-preview-v34,.ap-surface){min-width:0;max-width:100%;box-sizing:border-box;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-caption>strong{overflow-wrap:anywhere;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-art>img{min-width:0;max-width:100%;}
/* A single explicit palette keeps the common menu readable in every room. */
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu{color:#344655;background:#f8fafb;}
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble{color:#344655!important;background:transparent!important;box-shadow:none!important;opacity:1;}
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble[aria-pressed=true]{color:#263f50!important;background:#e0e9ef!important;}
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav-label{color:inherit!important;}
body.cinema-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu{color:#e4e8ed;background:#1d232f;border-color:#ffffff20;}
body.cinema-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble{color:#e4e8ed!important;background:transparent!important;}
body.cinema-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble[aria-pressed=true]{color:#f5f8fc!important;background:#354252!important;}
@media(hover:hover){body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble:hover{background:#e8edf1!important;}body.cinema-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble:hover{background:#303a49!important;}}
/* HTML previews are app UI: inherited artwork tilt must never touch badges. */
body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .app-preview-v34 img{transform:none!important;rotate:none!important;scale:1!important;box-shadow:none!important;border:0!important;filter:none!important;}
/* Labels are text inside a row, not the old floating tooltip capsules. */
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav-label{position:static!important;display:block!important;inset:auto!important;translate:none!important;transform:none!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:0!important;margin:0!important;font-size:16px!important;line-height:1.35!important;min-height:0!important;width:auto!important;max-width:none!important;opacity:1!important;visibility:visible!important;}
/* Keep all four app identities within a normal desktop view without microtype. */
@media(min-width:951px) and (min-height:750px){
 .cohesive-world .showcase-home[data-gallery=apps]{margin-top:0;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-surface{min-height:270px;padding:18px;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-quay-body p{padding:8px;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-search{padding-bottom:10px;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-tabs{padding-block:8px;}
}
@media(min-width:951px) and (min-height:750px){
 body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .showcase-garden{row-gap:32px;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-koop-row{padding-block:11px;}
 .cohesive-world [data-gallery=apps] .app-preview-v34 .ap-koop-footer{margin-top:8px;padding-top:12px;}
}
body>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav{background:transparent!important;border:0!important;box-shadow:none!important;color:inherit!important;}

/* The Bureaublad book keeps its own real portrait proportions. */
.cohesive-world .showcase-desktop .showcase-keepsake-three{width:20%;aspect-ratio:2/3;border:4px solid #fff;background:#f4f2ed;overflow:hidden;}
.cohesive-world .showcase-desktop .showcase-keepsake-three img{width:100%;height:100%;object-fit:cover;}


/* cinema-focus-v34.css */
/* Watching changes the existing film composition, never a second popup. */
.cinema-room .detail[data-category=music] .media-films.cinema-watching{width:min(1400px,100%);--cinema-view-height:calc(100dvh - clamp(72px,9dvh,92px) - 56px);min-height:var(--cinema-view-height);display:grid;align-content:center;}
.cinema-room .detail[data-category=music] .cinema-watching .media-film-focus{display:block;position:relative;}
.cinema-room .detail[data-category=music] .cinema-watching .media-cinema{width:min(100%,calc(var(--cinema-view-height)*16/9));margin-inline:auto;aspect-ratio:16/9;background:#050709;box-shadow:0 24px 80px #0007;}
.cinema-room .detail[data-category=music] .cinema-watching .media-heading,
.cinema-room .detail[data-category=music] .cinema-watching .media-film-copy,
.cinema-room .detail[data-category=music] .cinema-watching .media-film-shelf,
.cinema-room .detail[data-category=music] .cinema-watching .media-bottom{display:none;}
.cinema-room .detail[data-category=music] .cinema-watching .media-film-video{background:#050709;border-radius:inherit;}
.cinema-room .detail[data-category=music] .cinema-watching .media-video-close{width:52px;height:52px;min-width:52px;min-height:52px;top:14px;right:14px;border:1px solid #ffffff4d;background:#11171ddd;color:white;box-shadow:0 4px 24px #0005;z-index:3;}
.cinema-room .detail[data-category=music] .cinema-watching .media-video-close:focus-visible{outline:3px solid white;outline-offset:5px;}
@media(max-width:600px){.cinema-room .detail[data-category=music] .media-films.cinema-watching{--cinema-view-height:calc(100dvh - 128px);}.cinema-room .detail[data-category=music] .cinema-watching .media-cinema{width:100%;}.cinema-room .detail[data-category=music] .cinema-watching .media-video-close{top:8px;right:8px;width:48px;height:48px;min-width:48px;min-height:48px;}}


/* prank-room.css */
/* The story keeps its own visual world; the portfolio toolbar remains the way home. */
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-stage:has(.prank-room){width:100%;max-width:none;padding:0 24px 20px;overflow:hidden;justify-content:stretch}
.cohesive-world .world-stage:has(.prank-room)~.world-footer{display:none}
.prank-room{display:flex;flex:1;min-height:0;width:100%;height:100%;align-items:stretch}
.prank-surface{position:relative;flex:1;min-width:0;min-height:0;overflow:hidden;border-radius:16px;background:#185cb4}
.prank-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.prank-frame{position:relative;display:block;border:0;width:100%;height:100%;background:#1b6cc3}
@media(max-width:600px){body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-stage:has(.prank-room){padding:0 0 calc(68px + env(safe-area-inset-bottom))}.prank-surface{border-radius:0}}

/* A short landscape viewport still needs a separate strip for the player. */
@media(min-width:601px) and (max-height:500px){body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-stage:has(.prank-room){padding-bottom:calc(68px + env(safe-area-inset-bottom))}}

/* The original long-form story is loaded only when requested. */
.rickroll-open{display:block;margin:16px auto 0;min-height:44px;padding:10px 18px;border-radius:999px;border:1px solid #c7d2d9;background:#ffffffc9;color:#263f4b;font:inherit;cursor:pointer}
.rickroll-open:focus-visible{outline:2px solid #526f86;outline-offset:3px}
.rickroll-full .prank-surface,.rickroll-full .prank-frame{background:#0c0c0e}
.rickroll-full .prank-surface{border-radius:0}
/* The long story runs edge to edge at every width; the sound control floats over it. */
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-stage:has(.rickroll-full){padding:0;scrollbar-gutter:auto}
/* Reading mode: the toolbar slides out of view and the story takes the whole viewport. The room
   entrance keeps a paused fill animation on the toolbar's transform and opacity, so the slide uses
   the separate translate property and ends in visibility:hidden. */
body>dialog.cohesive-world[data-room-mode]:not([data-category=play]):has(.rickroll-full) .world-toolbar{transition:translate .35s ease,visibility 0s}
body>dialog.cohesive-world.is-reading[data-room-mode]:not([data-category=play]):has(.rickroll-full) .world-toolbar{position:absolute;top:0;left:0;right:0;translate:0 -100%;visibility:hidden;pointer-events:none;transition:translate .35s ease,visibility 0s linear .35s}
@media(prefers-reduced-motion:reduce){body>dialog.cohesive-world[data-room-mode]:not([data-category=play]):has(.rickroll-full) .world-toolbar{transition:none}}
.cohesive-world .world-stage:has(.rickroll-full)>.showcase-focus[hidden]{display:none!important}

/* While reading the story the site's sound control steps aside with the toolbar; the story has its own switch. */
body>dialog.cohesive-world.is-reading:has(.rickroll-full) .site-sound{opacity:0;translate:0 14px;pointer-events:none}

/* The desktop memory is its own screen, with its return control inside it. */
body>dialog.cohesive-world[data-room-mode][data-route="projects/reads/desktop-prank"] .world-toolbar{display:none}
body>dialog.cohesive-world[data-room-mode][data-route="projects/reads/desktop-prank"]:not([data-category=play]) .world-stage:has(.prank-room:not(.rickroll-full)){padding:0;scrollbar-gutter:auto}
.prank-room:not(.rickroll-full) .prank-surface{border-radius:0}
body>dialog.cohesive-world[data-route="projects/reads/desktop-prank"] .site-sound{visibility:hidden;pointer-events:none}

/* Desktop memory: the desktop itself fills the story viewport. */
body>dialog.cohesive-world[data-room-mode] .world-stage:has(.desktop-memory){position:fixed!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;padding:0!important;margin:0!important;z-index:30;transform:none!important}
.desktop-memory{position:absolute;inset:0;width:100%;height:100%;z-index:30}.desktop-memory .prank-surface{border-radius:0}.cohesive-world:has(.desktop-memory) .world-header{visibility:hidden}.cohesive-world:has(.desktop-memory) .world-footer{display:none}

body>dialog.cohesive-world:has(.desktop-memory){overflow:hidden!important}body>dialog.cohesive-world[data-room-mode] .world-stage:has(.desktop-memory){width:100vw!important}

body>dialog.cohesive-world[data-room-mode] .world-stage:has(.desktop-memory){scrollbar-gutter:auto!important}.desktop-memory{width:100vw!important;max-width:none!important}


/* reads-gallery-v39.css */
/* The story art carries its own title; keep its credit below without repeating it. */
.cohesive-world [data-gallery=projects] .showcase-node[data-cover-kind=read]:not([data-showcase-route="projects/reads/desktop-prank"]) .showcase-node-caption>strong{display:none;}
.cohesive-world [data-gallery=projects] .showcase-node[data-cover-kind=read]:not([data-showcase-route="projects/reads/desktop-prank"]) .showcase-node-caption{padding-top:11px;}
/* This playable memory uses an image from its own desktop, instead of an icon. */
.cohesive-world [data-gallery=projects] [data-showcase-route="projects/reads/desktop-prank"] .project-reading-cover{position:relative;display:block;padding:0;overflow:hidden;}
body>dialog.cohesive-world[data-room-mode] [data-gallery=projects] [data-showcase-route="projects/reads/desktop-prank"] .project-reading-cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:0;}
.cohesive-world [data-gallery=projects] [data-showcase-route="projects/reads/desktop-prank"] .project-reading-cover>span{position:absolute;left:16px;top:16px;padding:7px 11px;border-radius:999px;background:#f8fbffeb;color:#234758;font-size:12px;font-weight:650;}
.cohesive-world [data-gallery=projects] [data-showcase-route="projects/reads/desktop-prank"] .project-reading-cover>strong{display:none;}


/* game-film-v47.css */
/* Game films: the room dims like the cinema, the light comes from the frame
   itself and the controls are a quiet glass strip below the picture. */
body.game-film-room .detail::before{opacity:1;background:#06070a;transition-duration:620ms;}
body.game-film-room .detail{color-scheme:dark;color:#f2f1ed;}
body.game-film-room .cohesive-world{--world-ink:#e4e8ed;}
body.game-film-room .world-back,body.game-film-room .world-category,body.game-film-room .world-exit,body.game-film-room .world-find,body.game-film-room .world-keys{color:#d2d6df;}
body.game-film-room .world-back:hover,body.game-film-room .world-find:hover,body.game-film-room .world-keys:hover{background:#ffffff12;color:#fff;}
body.game-film-room .world-keys kbd,body.game-film-room .world-exit kbd{color:#d2d6df;border-color:#ffffff25;background:#ffffff0a;}
body.game-film-room .cohesive-world .world-switcher-toggle,body.game-film-room .cohesive-world :is(.world-find,.world-keys){border-color:#ffffff1c;background:#ffffff09;}
body.game-film-room button:focus-visible,body.game-film-room a:focus-visible{outline:2px solid #dce5f5;outline-offset:4px;}
body.game-film-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu{color:#e4e8ed;background:#1d232f;border-color:#ffffff20;}
body.game-film-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble{color:#e4e8ed!important;background:transparent!important;}
body.game-film-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble[aria-pressed=true]{color:#f5f8fc!important;background:#354252!important;}
@media(hover:hover){body.game-film-room>dialog.cohesive-world[data-room-mode] .world-switcher-menu .world-nav .mini-bubble:hover{background:#303a49!important;}}
body.game-film-room .cohesive-world .world-attention-light{display:none;}
/* Light app rooms (Spoor, Koop) set dark toolbar ink; in the dimmed film room the chrome stays light. */
body.game-film-room>dialog.cohesive-world[data-room-mode]{--world-ink:#e4e8ed;--world-line:#ffffff24;}
body.game-film-room>dialog.cohesive-world[data-room-mode] :is(.world-back,.world-back .breadcrumb,.world-category,.world-switcher-toggle,.world-find,.world-keys,.app-about-toggle,.game-film-return){color:#e4e8ed!important;}
body.game-film-room>dialog.cohesive-world[data-room-mode] :is(.world-switcher-toggle,.world-find,.world-keys,.app-about-toggle){border-color:#ffffff24!important;background:#ffffff0a!important;}

.showcase-demo:has(>.game-film){max-width:none;width:100%;}
.game-film{--film-gap:18px;--film-bar:52px;--film-w:min(100cqw,calc((100cqh - var(--film-bar) - var(--film-gap)) * 16 / 9),1320px);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--film-gap);width:100%;height:100%;padding-bottom:var(--film-dock,58px);box-sizing:border-box;container-type:size;font-family:Portfolio Hanken,system-ui,sans-serif;color:#f4f5f7;}
.game-film-stage{position:relative;isolation:isolate;width:var(--film-w);aspect-ratio:16/9;flex:none;}
.game-film-frame{position:relative;width:100%;height:100%;overflow:hidden;border-radius:18px;background:#05070a;box-shadow:0 28px 80px #000a;}
.game-film-frame::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff12;pointer-events:none;}
.game-film-frame video{display:block;width:100%;height:100%;object-fit:cover;cursor:pointer;background:#05070a;}
.game-film-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:opacity 760ms cubic-bezier(.4,0,.2,1),transform 1.4s cubic-bezier(.22,1,.36,1);}
.game-film.is-rolling .game-film-poster{opacity:0;transform:scale(1.025);}

/* The light is the shared ambilight (ambilight-v75.css): the picture itself, behind the whole room. */

.game-film-big{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:78px;height:78px;margin:-39px 0 0 -39px;padding:0;border:1px solid #ffffff38;border-radius:50%;color:#fff;background:#ffffff1f;backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 10px 30px #0005;cursor:pointer;opacity:0;scale:.92;visibility:hidden;pointer-events:none;transition:opacity 220ms ease,scale 320ms cubic-bezier(.22,1,.36,1),background 160ms ease,visibility 0s linear 220ms;}
.game-film-big svg{width:30px;height:30px;fill:currentColor;margin-left:3px;}
.game-film.is-open:is([data-film-state=poster],[data-film-state=paused]) .game-film-big{opacity:1;scale:1;visibility:visible;pointer-events:auto;transition-delay:0s;}
@media(hover:hover){.game-film-big:hover{background:#ffffff2e;scale:1.05;}}
.game-film-big:active{scale:.97;}

.game-film-bar{display:flex;align-items:center;gap:12px;width:var(--film-w);height:var(--film-bar);flex:none;opacity:0;translate:0 10px;transition:opacity 420ms ease 140ms,translate 560ms cubic-bezier(.22,1,.36,1) 140ms;}
.game-film.is-open .game-film-bar{opacity:1;translate:0 0;}
.game-film-controls{display:flex;align-items:center;gap:10px;flex:1;min-width:0;height:100%;padding:0 8px 0 6px;border:1px solid #ffffff1a;border-radius:999px;background:#ffffff0d;backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);box-shadow:inset 0 1px 0 #ffffff12;}
.game-film-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;min-width:40px;padding:0;border:0;border-radius:999px;color:#eef0f4;background:transparent;font:inherit;font-size:14px;cursor:pointer;transition:background 160ms ease,color 160ms ease;}
.game-film-controls svg{width:20px;height:20px;fill:currentColor;flex:none;}
@media(hover:hover){.game-film-controls button:hover{background:#ffffff14;color:#fff;}}
.game-film-sound{padding:0 14px 0 11px!important;}
.game-film-sound[aria-pressed=true]{background:#ffffff17!important;color:#fff!important;}
.game-film-seek{display:flex;align-items:center;flex:1;min-width:0;height:40px;cursor:pointer;}
.game-film-seek input{width:100%;height:20px;margin:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none;}
.game-film-seek input::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--film-accent) var(--film-progress,0%),#ffffff26 var(--film-progress,0%));}
.game-film-seek input::-moz-range-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--film-accent) var(--film-progress,0%),#ffffff26 var(--film-progress,0%));}
.game-film-seek input::-webkit-slider-thumb{width:12px;height:12px;margin-top:-4px;border:0;border-radius:50%;background:#fff;box-shadow:0 1px 6px #0006;-webkit-appearance:none;appearance:none;opacity:0;transition:opacity 160ms ease;}
.game-film-seek input::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;opacity:0;}
.game-film-seek:hover input::-webkit-slider-thumb,.game-film-seek input:focus-visible::-webkit-slider-thumb{opacity:1;}
.game-film-seek:hover input::-moz-range-thumb,.game-film-seek input:focus-visible::-moz-range-thumb{opacity:1;}
.game-film-seek input:focus-visible{outline:2px solid #dce5f5;outline-offset:6px;border-radius:4px;}
.game-film-time{font-size:13px;font-variant-numeric:tabular-nums;color:#c9ced8;white-space:nowrap;}

.game-film-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:100%;padding:0 24px;border-radius:999px;color:var(--film-ink);background:var(--film-accent);font-size:15px;font-weight:700;letter-spacing:.005em;text-decoration:none;white-space:nowrap;box-shadow:0 8px 26px #0005;transition:transform 220ms cubic-bezier(.22,1,.36,1),box-shadow 220ms ease,filter 160ms ease;}
.game-film-cta span{font-size:16px;transition:transform 220ms cubic-bezier(.22,1,.36,1);}
@media(hover:hover){.game-film-cta:hover{transform:translateY(-1px);filter:brightness(1.06);}.game-film-cta:hover span{transform:translate(2px,-2px);}}
.game-film-cta:active{transform:scale(.98);}
/* When the film ends, the next step answers once with the film's own light. */
.game-film[data-film-state=ended] .game-film-cta{animation:game-film-call 1.8s cubic-bezier(.22,1,.36,1) 2;}
@keyframes game-film-call{0%{box-shadow:0 8px 26px #0005,0 0 0 0 color-mix(in srgb,var(--film-accent) 55%,transparent);}70%{box-shadow:0 8px 26px #0005,0 0 0 14px transparent;}100%{box-shadow:0 8px 26px #0005,0 0 0 0 transparent;}}

@media(max-width:700px){
  .game-film{--film-gap:14px;--film-bar:auto;--film-w:100cqw;--film-dock:0px;container-type:inline-size;}
  .game-film-frame{border-radius:14px;}
  .game-film-big{width:62px;height:62px;margin:-31px 0 0 -31px;}
  .game-film-big svg{width:24px;height:24px;}
  .game-film-bar{flex-direction:column;align-items:stretch;gap:10px;height:auto;}
  .game-film-controls{height:50px;flex:none;}
  .game-film-time{display:none;}
  .game-film-sound span{display:none;}
  .game-film-sound{padding:0!important;width:40px;}
  .game-film-cta{height:50px;}
  /* Chapters get their own row on a phone, so the timeline keeps its width. */
  .game-film-controls:has(.game-film-chapters){flex-wrap:wrap;height:auto;padding:5px 8px 6px 6px;border-radius:24px;row-gap:4px;}
  .game-film-controls .game-film-chapters{order:-1;flex:1 0 100%;}
  .game-film-controls .game-film-chapters button{flex:1;padding:0 9px;font-size:12.5px;}
  .game-film-return span{display:none;}
  .game-film-return{padding:8px 12px;margin-left:4px;}
}
/* Films outside Games take the same full room while the film is shown; the demo gets its room's own layout back. Apps keep their About side view. */
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus:has(.game-film:not([hidden])){display:block;width:100%;max-width:none;height:100%;min-height:0;padding:0;margin:0;}
body>dialog.cohesive-world[data-room-mode=artifact]:not([data-app-about=true]) .showcase-film-focus:has(.game-film:not([hidden])) .showcase-copy{position:absolute;inset:auto;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:0;margin:0;}
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus:has(.game-film:not([hidden])) .showcase-demo{width:100%;height:100%;min-height:min(650px,calc(100dvh - 124px));overflow:visible;}
/* The film is the surface: no card behind it. */
.showcase-demo:has(>.game-film:not([hidden])){background:none!important;box-shadow:none!important;border:0!important;overflow:visible!important;}
.showcase-demo:has(>.game-film)>.app-live-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0;}
.game-film[hidden],.game-film-demo[hidden]{display:none!important;}
button.game-film-cta{border:0;font-family:inherit;cursor:pointer;}
.game-film-cta.game-film-cta-quiet{color:#eef0f4;background:#ffffff0f;border:1px solid #ffffff30;box-shadow:none;}
@media(hover:hover){.game-film-cta.game-film-cta-quiet:hover{background:#ffffff1c;filter:none;}}

/* Chapters: a quiet segmented choice inside the glass strip. */
.game-film-chapters{display:flex;flex:none;gap:2px;padding:3px;border-radius:999px;background:#ffffff0f;}
.game-film-controls .game-film-chapters button{height:32px;min-width:0;padding:0 12px;font-size:13px;color:#c9ced8;}
.game-film-controls .game-film-chapters button[aria-pressed=true]{color:var(--film-ink);background:var(--film-accent);}

/* The demo stands where the film stood; the film is one quiet step back. */
.game-film-demo{position:relative;width:100%;height:100%;}
.game-film-demo-host{width:100%;height:100%;}
.game-film-return{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-left:10px;padding:8px 16px 8px 13px;border:1px solid var(--world-line,#ffffff2a);border-radius:999px;color:var(--world-ink,#eef0f4);background:transparent;font:inherit;font-size:16px;cursor:pointer;}
.game-film-return svg{width:15px;height:15px;fill:currentColor;}
@media(hover:hover){.game-film-return:hover{background:#ffffff12;}}
.game-film-return:focus-visible{outline:2px solid var(--world-ink,#eef0f4);outline-offset:3px;}

/* On wide, short viewports the controls can sit beside the picture, giving
   the film back the height that a second row would otherwise take away. */
@media (max-height:500px) and (min-width:560px), (max-height:620px) and (min-width:900px){
  .game-film{--film-gap:14px;--film-dock:0px;--film-w:min(calc(100cqh * 16 / 9),calc(100cqw - 224px));flex-direction:row;}
  .game-film-frame{border-radius:14px;}
  .game-film-bar{flex-direction:column;align-items:stretch;gap:10px;width:210px;height:auto;}
  .game-film-controls{height:50px;flex:none;}
  .game-film-time{display:none;}
  .game-film-sound span{display:none;}
  .game-film-sound{padding:0!important;width:40px;}
  .game-film-cta{height:50px;}
}
/* In very short landscape rooms the global mixer otherwise covers the last
   action. The film's own sound button remains available; the mixer returns
   automatically as soon as the film room is left. */
@media (max-height:380px) and (min-width:560px){
  body.game-film-room .site-sound{visibility:hidden;pointer-events:none;}
}
@media(prefers-reduced-motion:reduce){
  .game-film-poster{transition:none;}
  .game-film-bar,.game-film-big,.game-film-cta,.game-film-cta span{transition:none;}
  .game-film[data-film-state=ended] .game-film-cta{animation:none;}
  body.game-film-room .detail::before{transition:none;}
}

/* Games: large Play and Watch buttons under Kwisje and Songronde (showcases.js, cardActions). */
.showcase-node-cell{display:flex;flex-direction:column;min-width:0;}
.showcase-node-actions{display:flex;flex-wrap:wrap;gap:12px;padding:18px 3px 0;}
.showcase-action{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:52px;padding:0 26px;border-radius:999px;font:inherit;font-size:17px;font-weight:700;letter-spacing:-.005em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform 220ms cubic-bezier(.22,1,.36,1),box-shadow 220ms ease,background-color 160ms ease;}
.showcase-action-play{min-width:150px;color:var(--action-ink);background:var(--action-accent);border:0;box-shadow:0 10px 26px -12px #0008,inset 0 0 0 1px #0000001f;}
.showcase-action-play span{font-size:18px;transition:transform 220ms cubic-bezier(.22,1,.36,1);}
.showcase-action-watch{color:#17181c;background:#ffffffc7;border:1px solid #17181c2e;}
.showcase-action-watch svg{width:18px;height:18px;fill:currentColor;}
@media(hover:hover){.showcase-action-play:hover{transform:translateY(-1px);box-shadow:0 14px 30px -12px #0009,inset 0 0 0 1px #0000001f;}.showcase-action-play:hover span{transform:translate(2px,-2px);}.showcase-action-watch:hover{background:#fff;transform:translateY(-1px);}}
.showcase-action:active{transform:scale(.98);}
.showcase-action:focus-visible{outline:3px solid #2f6fdb;outline-offset:3px;}
@media(max-width:520px){.showcase-node-actions{gap:10px;}.showcase-action{flex:1 1 0;height:54px;padding:0 18px;}}
@media(prefers-reduced-motion:reduce){.showcase-action,.showcase-action-play span{transition:none;}}
/* Games is one column on narrow screens; a per-card offset would push cards off screen. */
@media(max-width:950px){[data-gallery=games] .showcase-garden .showcase-node{left:auto!important;top:auto!important;}}
/* In a film room the text is visually hidden; keyboard focus on "The story" shows it as a panel. */
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus .showcase-copy:has(summary:focus-visible){display:block!important;position:fixed!important;left:max(20px,env(safe-area-inset-left))!important;top:84px!important;z-index:60;width:min(440px,calc(100vw - 40px))!important;height:auto!important;max-height:calc(100dvh - 190px);overflow:auto!important;clip-path:none!important;margin:0!important;padding:18px 20px!important;border:1px solid #ffffff24;border-radius:18px;color:#eef0f4;background:#101318f2;box-shadow:0 18px 50px #000a;}
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus .showcase-copy:has(summary:focus-visible) :is(h2,p,summary,span,h3,div){color:#eef0f4!important;}
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus .showcase-copy:has(summary:focus-visible)>p{display:block!important;margin:8px 0 12px!important;color:#c9d0d8!important;font-size:15px;line-height:1.5;}
body>dialog.cohesive-world[data-room-mode=artifact] .showcase-film-focus .showcase-copy:has(summary:focus-visible) summary:focus-visible{outline:3px solid #8fb4ff;outline-offset:3px;border-radius:6px;}
/* Card focus: the same firm ring as the action buttons (3:1 on light and on the dark aura). */
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:focus-visible{outline:3px solid #2f6fdb;outline-offset:6px;}
/* On a phone, focused content never sits under the sound pill. */
@media(max-width:700px){.world-stage:has([data-gallery]){scroll-padding-bottom:112px;}}
/* Arriving from the dark home: the room is dark from the first frame of the reveal (game-film-v47.js, darkArrival). */
body.game-film-dark-arrival .detail::before{opacity:1;background:#06070a;transition:none;}
body.game-film-dark-arrival .detail{background:#06070a;}
/* Phones: the film runs edge to edge in portrait, and a full screen button turns it landscape. */
.game-film-full{display:none!important;}
@media(max-width:700px),(pointer:coarse) and (max-width:1024px){.game-film-full{display:inline-flex!important;}}
@media(max-width:700px) and (orientation:portrait){
  .game-film-stage{width:100vw;margin-inline:calc((100cqw - 100vw) / 2);}
  .game-film-frame{border-radius:0;}
  .game-film-frame::after{border-radius:0;}
}


/* site-sound-v47.css */
/* Sound sits where KOOPIE sat: two quiet toggles, music and effects. */
.site-sound{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:80;display:flex;align-items:center;gap:3px;padding:3px;border:1px solid #ffffffb8;border-radius:999px;color:#33475a;background:#f8fafbe6;box-shadow:0 4px 20px #24394a14;backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);font:500 13px/1 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.01em;}
.site-sound[hidden]{display:none;}
/* The control joins the page with the rest of it, not before the entrance. */
html:is(.arrival-pending,.arrival-active) .site-sound{opacity:0;translate:0 10px;pointer-events:none;}

/* The gate: the first thing on an empty page, then it lifts away and the entrance begins. */
.site-sound-gate{position:fixed;left:50%;top:50%;z-index:90;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px 15px;width:min(380px,calc(100vw - 32px));padding:18px;border:1px solid #ffffffc4;border-radius:30px;color:#22323f;background:#f8fafbf2;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 24px 60px #1f344a26,0 2px 6px #1f344a12;font:400 13.5px/1.35 Portfolio Hanken,system-ui,sans-serif;translate:-50% -50%;overflow:hidden;animation:site-sound-gate-in 700ms cubic-bezier(.2,1.25,.4,1) both;}
.site-sound-gate p{display:grid;gap:3px;margin:0;}
.site-sound-gate strong{font-size:16px;font-weight:650;letter-spacing:-.01em;}
.site-sound-gate p span{color:#5b6c7a;font-size:13px;}
.site-sound-gate .site-sound-ask-orb{width:48px;height:48px;}
.site-sound-gate .site-sound-ask-actions button{height:44px;font-size:14px;}
.site-sound-gate [data-gate=yes]{color:#fff;background:#2b4152;}
.site-sound-gate [data-gate=no]{color:#33475a;background:transparent;border-color:#d5dee5;}
@media(hover:hover){.site-sound-gate [data-gate=yes]:hover{background:#1f3242;transform:translateY(-1px);}.site-sound-gate [data-gate=no]:hover{background:#eef2f5;}}
.site-sound-gate button:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
.site-sound-gate.is-leaving{animation:site-sound-gate-out 360ms cubic-bezier(.4,0,.6,1) forwards;}
@keyframes site-sound-gate-in{from{opacity:0;scale:.7;}to{opacity:1;scale:1;}}
@keyframes site-sound-gate-out{to{opacity:0;scale:1.12;filter:blur(3px);}}
@media(prefers-reduced-motion:reduce){.site-sound-gate,.site-sound-gate.is-leaving,.site-sound-gate-time::after{animation:none;}}
.site-sound{transition:opacity 520ms ease 120ms,translate 620ms cubic-bezier(.22,1,.36,1) 120ms;}
.site-sound.is-aside{opacity:0;translate:0 8px;pointer-events:none;visibility:hidden;transition:opacity 140ms ease,translate 180ms ease,visibility 0s linear 140ms;}
.site-sound button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 13px 0 11px;border:0;border-radius:999px;color:inherit;background:transparent;font:inherit;cursor:pointer;transition:background 160ms ease,color 160ms ease;}
.site-sound button svg{width:15px;height:15px;fill:currentColor;opacity:.7;transition:opacity 160ms ease;}
@media(hover:hover){.site-sound button:hover{background:#e3eaef;}}
.site-sound button[aria-pressed=true]{color:#fff;background:#2b4152;}
.site-sound button[aria-pressed=true] svg{opacity:1;}
.site-sound button:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
.site-sound-bars{display:inline-flex;align-items:flex-end;gap:2px;width:15px;height:13px;}
.site-sound-bars i{display:block;width:2.5px;height:35%;border-radius:2px;background:currentColor;opacity:.7;transform-origin:bottom;}
.site-sound-bars i:nth-child(2){height:70%;}.site-sound-bars i:nth-child(3){height:50%;}.site-sound-bars i:nth-child(4){height:85%;}
.site-sound[data-music=playing] .site-sound-bars i{opacity:1;animation:site-sound-bar 1.1s ease-in-out infinite alternate;}
.site-sound[data-music=playing] .site-sound-bars i:nth-child(2){animation-duration:.8s;animation-delay:-.3s;}
.site-sound[data-music=playing] .site-sound-bars i:nth-child(3){animation-duration:1.3s;animation-delay:-.6s;}
.site-sound[data-music=playing] .site-sound-bars i:nth-child(4){animation-duration:.95s;animation-delay:-.15s;}
@keyframes site-sound-bar{from{transform:scaleY(.35);}to{transform:scaleY(1);}}
.site-sound[data-music=waiting] .site-sound-bars i{opacity:.55;}
/* Local lab only: a small mark that the effects come from the lab. */
.site-sound[data-lab=true]::before{content:'lab';align-self:center;margin:0 2px 0 8px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.5;}

/* Mixer: one small glass panel above the control, two levels. */
.site-sound .site-sound-mix{padding:0 10px;}
.site-sound .site-sound-mix svg{width:17px;height:17px;opacity:.75;}
.site-sound .site-sound-mix[aria-expanded=true]{background:#e3eaef;}
.site-sound-mixer{position:absolute;right:0;bottom:calc(100% + 12px);display:grid;gap:10px;width:min(280px,calc(100vw - 28px));padding:14px 16px;border:1px solid #ffffffc4;border-radius:22px;color:#22323f;background:#f8fafbf2;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 16px 40px #1f344a24;animation:site-sound-ask-in 420ms cubic-bezier(.2,1.2,.4,1) both;}
.site-sound-mixer[hidden]{display:none;}
.site-sound-mixer label{display:grid;grid-template-columns:58px minmax(0,1fr) 40px;align-items:center;gap:10px;font-size:13px;}
.site-sound-mixer input{width:100%;accent-color:#2b4152;}
.site-sound-mixer output{font-variant-numeric:tabular-nums;text-align:right;color:#5b6c7a;}
body:is(.cinema-room,.game-film-room) .site-sound-mixer{color:#e8ecf1;border-color:#ffffff22;background:#161b23ee;}
body:is(.cinema-room,.game-film-room) .site-sound-mixer input{accent-color:#e9edf2;}
body:is(.cinema-room,.game-film-room) .site-sound-mixer output{color:#aab4c0;}
body:is(.cinema-room,.game-film-room) .site-sound .site-sound-mix[aria-expanded=true]{background:#ffffff1a;}

/* The start question floats up from the control like one of the home bubbles. */
.site-sound-ask{position:absolute;right:0;bottom:calc(100% + 14px);display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px 13px;width:min(318px,calc(100vw - 28px));padding:14px;border:1px solid #ffffffc4;border-radius:26px;color:#22323f;background:#f8fafbf0;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 18px 44px #1f344a26,0 2px 6px #1f344a12;font:400 13px/1.35 Portfolio Hanken,system-ui,sans-serif;transform-origin:78% 100%;animation:site-sound-ask-in 620ms cubic-bezier(.2,1.35,.4,1) both,site-sound-ask-bob 5.5s ease-in-out 700ms infinite;}
.site-sound-ask[hidden]{display:none;}
.site-sound-ask::after{content:'';position:absolute;right:122px;bottom:-7px;width:14px;height:14px;border-right:1px solid #ffffffc4;border-bottom:1px solid #ffffffc4;border-bottom-right-radius:4px;background:inherit;transform:rotate(45deg);}
.site-sound-ask p{display:grid;gap:2px;margin:0;}
.site-sound-ask strong{font-size:14.5px;font-weight:650;letter-spacing:-.005em;}
.site-sound-ask p span{color:#5b6c7a;font-size:12.5px;}
.site-sound-ask-orb{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:2.5px;width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 32% 28%,#ffffff 0 14%,#e7eef3 38%,#c9d7e1 100%);box-shadow:inset 0 -3px 8px #8fa5b84d,inset 0 2px 3px #fff,0 4px 12px #6f86991f;}
.site-sound-ask-orb i{width:3px;height:14px;border-radius:2px;background:#2b4152;transform-origin:center;animation:site-sound-bar .9s ease-in-out infinite alternate;}
.site-sound-ask-orb i:nth-child(2){height:20px;animation-delay:-.35s;}.site-sound-ask-orb i:nth-child(3){animation-delay:-.6s;}
.site-sound-ask-actions{grid-column:1/-1;display:flex;gap:8px;}
.site-sound-ask-actions button{flex:1;height:40px;padding:0 14px;border:1px solid transparent;border-radius:999px;font:600 13.5px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;transition:background 160ms ease,transform 200ms cubic-bezier(.22,1,.36,1);}
.site-sound-ask [data-ask=yes]{color:#fff;background:#2b4152;}
.site-sound-ask [data-ask=no]{color:#33475a;background:transparent;border-color:#d5dee5;}
@media(hover:hover){.site-sound-ask [data-ask=yes]:hover{background:#1f3242;transform:translateY(-1px);}.site-sound-ask [data-ask=no]:hover{background:#eef2f5;}}
.site-sound-ask button:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
.site-sound-ask.is-leaving{animation:site-sound-ask-out 300ms cubic-bezier(.4,0,.6,1) forwards;}
@keyframes site-sound-ask-in{from{opacity:0;transform:translateY(14px) scale(.6);}to{opacity:1;transform:none;}}
@keyframes site-sound-ask-bob{0%,100%{translate:0 0;}50%{translate:0 -3px;}}
@keyframes site-sound-ask-out{to{opacity:0;transform:translateY(-10px) scale(1.08);filter:blur(2px);}}
.site-sound:has(.site-sound-ask:not([hidden])) .site-sound-music{box-shadow:0 0 0 2px #2b415233;}
body:is(.cinema-room,.game-film-room) .site-sound-ask{color:#e8ecf1;border-color:#ffffff22;background:#161b23ee;box-shadow:0 18px 44px #0008;}
body:is(.cinema-room,.game-film-room) .site-sound-ask p span{color:#aab4c0;}
body:is(.cinema-room,.game-film-room) .site-sound-ask::after{border-color:#ffffff22;}
body:is(.cinema-room,.game-film-room) .site-sound-ask [data-ask=yes]{color:#10151c;background:#e9edf2;}
body:is(.cinema-room,.game-film-room) .site-sound-ask [data-ask=no]{color:#dfe4ea;border-color:#ffffff2e;}
@media(hover:hover){body:is(.cinema-room,.game-film-room) .site-sound-ask [data-ask=yes]:hover{background:#fff;}body:is(.cinema-room,.game-film-room) .site-sound-ask [data-ask=no]:hover{background:#ffffff12;}}
@media(max-width:600px){.site-sound-ask{right:-2px;}.site-sound-ask::after{right:118px;}}
@media(prefers-reduced-motion:reduce){.site-sound-ask,.site-sound-ask.is-leaving{animation:none;}.site-sound-ask-orb i{animation:none;}}

body:is(.cinema-room,.game-film-room) .site-sound{color:#dfe4ea;border-color:#ffffff1f;background:#161b23cc;box-shadow:0 4px 24px #0006;}
@media(hover:hover){body:is(.cinema-room,.game-film-room) .site-sound button:hover{background:#ffffff14;}}
body:is(.cinema-room,.game-film-room) .site-sound button[aria-pressed=true]{color:#10151c;background:#e9edf2;}

@media(max-width:600px){
  .site-sound{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));}
  .site-sound button{height:38px;padding:0 12px 0 10px;}
}
@media(prefers-reduced-motion:reduce){.site-sound[data-music=playing] .site-sound-bars i{animation:none;}.site-sound button{transition:none;}}

/* The entry choice is a real modal, on every visit and at every motion setting. */
.site-sound-gate{margin:0;box-sizing:border-box;max-width:none;max-height:calc(100dvh - 32px)}
.site-sound-gate:not([open]){display:none}
.site-sound-gate::backdrop{background:#eef2f6d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.site-sound-gate.is-leaving::backdrop{animation:site-sound-gate-out 260ms ease forwards}
@media(prefers-reduced-motion:reduce){.site-sound-gate,.site-sound-gate.is-leaving,.site-sound-gate::backdrop{animation:none}}

/* The volume peek: one slider that slides out above the control when something starts to sound.
   It floats, so the control itself never moves (party mode measures its top). */
.site-sound-peek{position:absolute;right:0;bottom:calc(100% + 10px);display:flex;align-items:center;gap:10px;height:44px;padding:0 14px 0 16px;border:1px solid #ffffffc4;border-radius:999px;color:#22323f;background:#f8fafbf2;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 12px 32px #1f344a24,0 2px 6px #1f344a10;font:600 13px/1 Portfolio Hanken,system-ui,sans-serif;transform-origin:85% 100%;animation:site-sound-peek-in 420ms cubic-bezier(.2,1.25,.4,1) both;}
.site-sound-peek[hidden]{display:none;}
.site-sound-peek input{width:min(150px,40vw);margin:0;accent-color:#2b4152;}
.site-sound-peek output{min-width:38px;font-weight:500;font-variant-numeric:tabular-nums;text-align:right;color:#5b6c7a;}
.site-sound-peek input:focus-visible{outline:2px solid #6f8ea8;outline-offset:3px;border-radius:4px;}
/* Video only: a mute switch in front of the one volume every film and YouTube player shares (video-volume-v75.js). */
.site-sound .site-sound-peek .site-sound-peek-mute{display:grid;place-items:center;flex:none;width:36px;height:36px;margin:0 -6px 0 -10px;padding:0;border:0;border-radius:50%;color:inherit;background:transparent;cursor:pointer;}
.site-sound .site-sound-peek .site-sound-peek-mute[hidden]{display:none;}
.site-sound .site-sound-peek .site-sound-peek-mute svg{width:19px;height:19px;fill:currentColor;opacity:1;}
.site-sound .site-sound-peek .site-sound-peek-mute[aria-pressed=true]{color:inherit;background:transparent;}
.site-sound-peek-mute .site-sound-peek-cross,.site-sound-peek-mute[aria-pressed=true] .site-sound-peek-waves{display:none;}
.site-sound-peek-mute[aria-pressed=true] .site-sound-peek-cross{display:inline;}
@media(hover:hover){.site-sound .site-sound-peek .site-sound-peek-mute:hover{background:#22323f14;}body:is(.cinema-room,.game-film-room) .site-sound .site-sound-peek .site-sound-peek-mute:hover,body>.site-sound .site-sound-peek .site-sound-peek-mute:hover{background:#ffffff1a;}}
.site-sound-peek.is-muted input{opacity:.55;}
.site-sound-peek.is-leaving{animation:site-sound-peek-out 220ms ease forwards;}
@keyframes site-sound-peek-in{from{opacity:0;transform:translateY(10px) scale(.92);}to{opacity:1;transform:none;}}
@keyframes site-sound-peek-out{to{opacity:0;transform:translateY(6px) scale(.97);}}
/* Wide screens: it slides out sideways beside the control, so it never covers a film's next step. */
@media(min-width:901px){.site-sound-peek{right:calc(100% + 10px);bottom:-1px;transform-origin:100% 50%;animation-name:site-sound-peek-side;}.site-sound-peek.is-leaving{animation:site-sound-peek-side-out 220ms ease forwards;}}
@keyframes site-sound-peek-side{from{opacity:0;transform:translateX(14px) scale(.94);}to{opacity:1;transform:none;}}
@keyframes site-sound-peek-side-out{to{opacity:0;transform:translateX(10px) scale(.97);}}
body:is(.cinema-room,.game-film-room) .site-sound-peek{color:#e8ecf1;border-color:#ffffff22;background:#161b23ee;box-shadow:0 12px 32px #0008;}
body:is(.cinema-room,.game-film-room) .site-sound-peek input{accent-color:#e9edf2;}
body:is(.cinema-room,.game-film-room) .site-sound-peek output{color:#aab4c0;}

/* Radio by Koop: a small warm radio while Chill is on. Its own fixed place: on the water in the
   middle on wide screens, a one-row strip above the sound control on phones. */
.site-radio{position:fixed;left:50%;bottom:max(26px,env(safe-area-inset-bottom));z-index:79;width:300px;box-sizing:border-box;border:1px solid #ffffffd6;border-radius:20px;color:#3b2c22;background:linear-gradient(180deg,#fffaf3f4,#f5ece0f4);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 20px 48px #5a3d2229,0 2px 6px #5a3d2214;font:400 13px/1.3 Portfolio Hanken,system-ui,sans-serif;overflow:hidden;translate:-50% 0;transform-origin:50% 100%;animation:site-radio-in 560ms cubic-bezier(.2,1.2,.4,1) both;}
.site-radio[hidden],.site-radio[data-room=none]{display:none;}
html:is(.arrival-pending,.arrival-active) .site-radio{opacity:0;pointer-events:none;}
.site-radio-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;height:30px;padding:0 12px;border-bottom:1px solid #e9dccb;}
.site-radio-bar strong{font-size:12px;font-weight:650;letter-spacing:.03em;}
.site-radio-stripes{height:9px;border-radius:1px;background:repeating-linear-gradient(180deg,#cbb597 0 1px,transparent 1px 3px);opacity:.85;}
.site-radio-screen{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;margin:12px 12px 0;padding:14px 14px 12px;border-radius:14px;color:#ffd9a6;background:radial-gradient(120% 150% at 18% 0%,#43332a,#221914);box-shadow:inset 0 1px 0 #ffffff14,inset 0 -10px 22px #0005;}
.site-radio-screen p{display:grid;gap:4px;min-width:0;margin:0;padding-right:44px;}
.site-radio-screen strong{overflow:hidden;color:#ffe7c7;font-size:15px;font-weight:650;letter-spacing:-.005em;white-space:nowrap;text-overflow:ellipsis;}
.site-radio-screen p span{color:#d6a676;font-size:11.5px;font-variant-numeric:tabular-nums;}
.site-radio-air{position:absolute;top:9px;right:11px;display:inline-flex;align-items:center;gap:5px;color:#c99a6c;font-size:9.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;}
.site-radio-air::before{content:'';width:6px;height:6px;border-radius:50%;background:#7a5d47;}
.site-radio[data-state=playing] .site-radio-air{color:#ffb36b;}
.site-radio[data-state=playing] .site-radio-air::before{background:#ff6a3d;box-shadow:0 0 8px #ff6a3dcc;}
.site-radio-wave{display:flex;align-items:flex-end;gap:2px;width:30px;height:28px;}
.site-radio-wave i{display:block;width:2.6px;height:30%;border-radius:2px;background:#ffb36b;opacity:.5;transform-origin:bottom;}
.site-radio-wave i:nth-child(2){height:55%;}.site-radio-wave i:nth-child(3){height:80%;}.site-radio-wave i:nth-child(4){height:45%;}.site-radio-wave i:nth-child(5){height:70%;}.site-radio-wave i:nth-child(6){height:40%;}.site-radio-wave i:nth-child(7){height:60%;}
.site-radio[data-state=playing] .site-radio-wave i{opacity:1;animation:site-sound-bar 1.15s ease-in-out infinite alternate;}
.site-radio[data-state=playing] .site-radio-wave i:nth-child(2n){animation-duration:.82s;animation-delay:-.3s;}
.site-radio[data-state=playing] .site-radio-wave i:nth-child(3n){animation-duration:1.4s;animation-delay:-.55s;}
.site-radio-controls{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:8px;padding:12px;}
.site-radio button{display:grid;place-items:center;padding:0;font:inherit;cursor:pointer;transition:transform 200ms cubic-bezier(.22,1,.36,1),background 160ms ease;}
.site-radio .site-radio-play{width:42px;height:42px;border:0;border-radius:50%;color:#fff;background:#2b4152;box-shadow:0 4px 12px #2b415233;}
.site-radio .site-radio-next{width:36px;height:36px;border:1px solid #e4d6c3;border-radius:50%;color:#3b2c22;background:#fffdf9;}
.site-radio button svg{width:18px;height:18px;fill:currentColor;}
.site-radio .site-radio-next svg{width:15px;height:15px;}
.site-radio-play[aria-pressed=true] .site-radio-icon-play,.site-radio-play[aria-pressed=false] .site-radio-icon-pause{display:none;}
@media(hover:hover){.site-radio .site-radio-play:hover{background:#1f3242;transform:translateY(-1px);}.site-radio .site-radio-next:hover{background:#fff5e9;transform:translateY(-1px);}}
.site-radio button:focus-visible,.site-radio input:focus-visible{outline:2px solid #b07a4e;outline-offset:2px;}
.site-radio-level{display:grid;grid-template-columns:auto minmax(0,1fr) 34px;align-items:center;gap:6px;min-width:0;}
.site-radio-level input{width:100%;min-width:0;margin:0;accent-color:#c0763c;}
.site-radio-level output{color:#8a6a4f;font-size:11.5px;font-variant-numeric:tabular-nums;text-align:right;}
.site-radio-speaker svg{display:block;width:16px;height:16px;fill:#8a6a4f;}
@keyframes site-radio-in{from{opacity:0;transform:translateY(16px) scale(.92);}to{opacity:1;transform:none;}}
/* Phones and narrow windows: one compact row above the sound control. Volume stays in the mixer there. */
@media(max-width:900px){
  .site-radio{left:auto;right:max(12px,env(safe-area-inset-right));bottom:calc(max(12px,env(safe-area-inset-bottom)) + 54px);width:auto;max-width:calc(100vw - 24px);translate:none;display:flex;align-items:center;gap:6px;padding:5px 5px 5px 12px;border-radius:999px;transform-origin:85% 100%;}
  .site-radio[hidden]{display:none;}
  .site-radio-bar,.site-radio-level,.site-radio-air,.site-radio-screen p span{display:none;}
  .site-radio-screen{display:flex;gap:9px;margin:0;padding:0;min-width:0;color:#3b2c22;background:none;box-shadow:none;}
  .site-radio-screen p{padding:0;}
  .site-radio-screen strong{max-width:150px;color:#3b2c22;font-size:13.5px;}
  .site-radio-wave{width:20px;height:18px;}
  .site-radio-wave i{background:#c0763c;}
  .site-radio-controls{display:flex;gap:5px;padding:0;}
  .site-radio .site-radio-play{width:38px;height:38px;}
  .site-radio .site-radio-next{width:34px;height:34px;}
}
@media(prefers-reduced-motion:reduce){.site-sound-peek,.site-sound-peek.is-leaving,.site-radio{animation:none;}.site-radio[data-state=playing] .site-radio-wave i{animation:none;}.site-radio button{transition:none;}}
/* The pill is dark on the aura (aura-v60.css, body>.site-sound); the volume slider beside it follows the pill. */
body>.site-sound .site-sound-peek{color:#e8e5f2;border-color:#ffffff24;background:#16131fee;box-shadow:0 12px 32px #0007;}
body>.site-sound .site-sound-peek input{accent-color:#ece9f4;}
body>.site-sound .site-sound-peek output{color:#b9b2cf;}


/* aura-v60.css */
/* Aura: the home sits in a room of slow, silky light instead of white paper. Dark by default,
   light on request (html[data-theme=light]). Colours: violet and
   indigo satin, warm bronze, a trace of moss. Only transform moves; reduced or paused motion
   keeps the light still. */
html,body{background:#0d0b15;}
.ambient{overflow:hidden;background:radial-gradient(120% 90% at 50% 118%,#221a3a 0%,#110e1c 55%,#09080f 100%);}
.ambient::before,.ambient::after{content:'';position:absolute;inset:-25%;pointer-events:none;will-change:transform;}
.ambient::before{background:radial-gradient(ellipse 38% 30% at 28% 34%,#5d4bd0a6,transparent 70%),radial-gradient(ellipse 34% 28% at 76% 70%,#2f3cae8c,transparent 72%),radial-gradient(ellipse 26% 20% at 62% 22%,#8a5fd05c,transparent 70%);animation:aura-drift 34s ease-in-out infinite alternate;}
.ambient::after{background:linear-gradient(158deg,transparent 38%,#9d8cf426 47%,#c9b8ff33 50%,#9d8cf41f 53%,transparent 62%),radial-gradient(ellipse 30% 22% at 72% 30%,#b07a4352,transparent 72%),radial-gradient(ellipse 30% 24% at 18% 82%,#3a5a4459,transparent 72%);animation:aura-sweep 47s ease-in-out infinite alternate;}
@keyframes aura-drift{0%{transform:translate(-3%,2%) rotate(-4deg) scale(1);}50%{transform:translate(4%,-3%) rotate(3deg) scale(1.08);}100%{transform:translate(-2%,4%) rotate(6deg) scale(.96);}}
@keyframes aura-sweep{0%{transform:translate(6%,-4%) rotate(0deg);}100%{transform:translate(-7%,5%) rotate(-10deg);}}
@media(prefers-reduced-motion:reduce){.ambient::before,.ambient::after{animation:none;}}
.motion-paused .ambient::before,.motion-paused .ambient::after{animation-play-state:paused;}
/* The attention light follows what you point at, in the aura's own colours. */
.atmosphere-near{background:radial-gradient(ellipse at 20% 36%,#6f5fe047,transparent 47%),radial-gradient(ellipse at 82% 68%,#c08a503d,transparent 43%);}
.atmosphere-far{background:radial-gradient(ellipse at 76% 24%,#4a58d040,transparent 45%),radial-gradient(ellipse at 30% 84%,#4f7a5f33,transparent 40%);}

/* Light type on the dark room. The green matrix mood and Chill bring their own colours. */
/* Header in its own dark colours; a filter on the header would trap the fixed Keys guide inside it. */
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header :is(.wordmark,.wordmark span){color:#f1edfa;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header .header-linkedin{color:#d4cee6;opacity:.72;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header .header-linkedin:hover{color:#fff;background:#0a66c2;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return),:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return) span{color:#d4cee6;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return):is(:hover,[aria-expanded=true]){color:#fff;background:#ffffff1f;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return):is(:hover,[aria-expanded=true]) span{color:#fff;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools .keys-button{background:#ffffff0f;border-color:#ffffff29;box-shadow:none;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools kbd{color:#d4cee6;background:#ffffff14;border-color:#ffffff2e;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools .theme-button{color:#e8e5f2;background:#ffffff0f;border-color:#ffffff29;box-shadow:none;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools .theme-button:hover{color:#fff;background:#ffffff1f;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .person h1{color:#f3effb;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .scene .person p{color:#b9b2cf;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .bubble-label{color:#f4f1fb;text-shadow:0 1px 10px #0009;}
:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{color:#16131f;background:#efeaff;box-shadow:0 10px 30px #6c5bd640,0 0 0 1px #ffffff40;}
:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned:hover{background:#ffffff;}
/* The sound question on a first visit waits in the same dark room. */
:root:not([data-theme=light]) .site-sound-gate::backdrop{background:#0d0b15c2;}
:root:not([data-theme=light]) body>.site-sound{color:#e8e5f2;border-color:#ffffff24;background:#16131fd9;box-shadow:0 4px 24px #0007;}
:root:not([data-theme=light]) body>.site-sound button:hover{background:#ffffff14;}
:root:not([data-theme=light]) body>.site-sound button[aria-pressed=true]{color:#16131f;background:#ece9f4;}

/* Light aura: pearl lilac with violet, sky and bronze light and a white silk sheen. Type,
   bubbles and controls keep their original light-room styles. */
:root[data-theme=light],:root[data-theme=light] body{background:#f1ecf6;}
:root[data-theme=light] .ambient{background:radial-gradient(120% 90% at 50% 115%,#f8f1ea 0%,#f1ebf7 55%,#e5def0 100%);}
:root[data-theme=light] .ambient::before{background:radial-gradient(ellipse 38% 30% at 28% 34%,#8d7bf073,transparent 70%),radial-gradient(ellipse 34% 28% at 76% 70%,#7fb0f066,transparent 72%),radial-gradient(ellipse 26% 20% at 62% 22%,#c08ff04d,transparent 70%);}
:root[data-theme=light] .ambient::after{background:linear-gradient(158deg,transparent 38%,#ffffff70 48%,#ffffffa6 50%,#ffffff66 52%,transparent 62%),radial-gradient(ellipse 30% 22% at 72% 30%,#e8a86a61,transparent 72%),radial-gradient(ellipse 30% 24% at 18% 82%,#8fd3b259,transparent 72%);}
:root[data-theme=light] .atmosphere-near{background:radial-gradient(ellipse at 20% 36%,#9c8cf440,transparent 47%),radial-gradient(ellipse at 82% 68%,#f0b98a40,transparent 43%);}
:root[data-theme=light] .atmosphere-far{background:radial-gradient(ellipse at 76% 24%,#8fb6f240,transparent 45%),radial-gradient(ellipse at 30% 84%,#9fdcc040,transparent 40%);}
:root[data-theme=light] body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{background:#2a2347;box-shadow:0 10px 26px #2a234733;}
:root[data-theme=light] body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned:hover{background:#1d1833;}
/* Header tools on the lavender light read at 5:1 or better. */
:root[data-theme=light] body:not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return),:root[data-theme=light] body:not(.chill-mode) .header-tools :is(.find-button,.keeps-button,.keys-button,.exploration-return) span,:root[data-theme=light] body:not(.chill-mode) .header-tools kbd{color:#44566a;}
/* The volume peek next to the pill turns light again with it. */
:root[data-theme=light] body>.site-sound .site-sound-peek{color:#22323f;border-color:#ffffffc4;background:#f8fafbf2;box-shadow:0 12px 32px #24394a1f;}
:root[data-theme=light] body>.site-sound .site-sound-peek input{accent-color:#2b4152;}
:root[data-theme=light] body>.site-sound .site-sound-peek output{color:#5b6c7a;}

/* The light switch sits with the other header tools. */
.theme-button{display:inline-grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #bcc9d35c;border-radius:50%;color:#6a7488;background:#ffffff40;box-shadow:inset 0 1px 0 #fff;cursor:pointer;transition:color .2s ease,background .2s ease;}
.theme-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;}
.theme-button:hover{color:#2a2347;background:#ffffffa6;}
.theme-button[aria-pressed=true]{color:#2a2347;background:#fff;}
@media(max-width:600px){.theme-button{width:34px;height:34px;border-color:transparent;background:transparent;box-shadow:none;}}
/* In a room it matches the round find button next to it and takes the room's own ink. */
.detail .world-theme{width:44px;height:44px;color:inherit;background:#ffffff4a;border-color:#ffffff80;box-shadow:none;}
.detail .world-theme:hover{color:inherit;background:#ffffff73;}
.detail .world-theme[aria-pressed=true]{color:#2a2347;background:#ffffffc7;}
@media(max-width:600px){.detail .world-theme{width:40px;height:44px;border-color:#ffffff80;background:#ffffff4a;}}
/* With the keep button showing, the room toolbar is a fixed grid; the switch gets its own column before Keys. */
@media(min-width:601px){
  body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar:has(>.world-keep:not([hidden])):has(>.world-theme){grid-template-columns:44px minmax(0,1fr) 44px 40px 40px 40px;}
  body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden])):has(>.world-theme)>.world-theme{grid-column:5;width:40px;height:44px;}
  body>dialog.cohesive-world[data-room-mode] .world-toolbar:has(>.world-keep:not([hidden])):has(>.world-theme)>.world-keys{grid-column:6;}
}
.detail .world-theme-menu{display:none;}
@media(max-width:600px){
  .detail .world-theme{display:none;}
  .detail .world-theme-menu{display:flex;align-items:center;gap:10px;width:100%;height:49px;margin:7px 0 0;padding:11px 14px;border:0;border-top:1px solid #62748c1c;border-radius:0;color:inherit;background:none;box-shadow:none;font-size:15px;text-align:left;}
  .detail .world-theme-menu svg{width:17px;height:17px;flex:none;}
  .detail .world-theme-menu span{flex:1;}
  .detail .world-theme-menu small{font-size:11px;opacity:.75;}
  .detail .world-theme-menu[aria-pressed=true]{color:inherit;background:none;}
}

/* The face on the home page: a nudge, not a throw. */
body:not(.party-on) .scene .memoji{touch-action:none;}
body:not(.party-on) .scene .memoji.is-nudged{cursor:grabbing;}

/* Intro text was drawn for white paper; on the dark aura it needs light ink. */
:root:not([data-theme=light]) :is(.arrival-hello,.arrival-name){color:#f3effb;}
:root:not([data-theme=light]) .arrival-invitation{color:#c4bddb;}
:root:not([data-theme=light]) .arrival-discover{color:#f3effb;text-shadow:0 1px 14px #0008;}
:root:not([data-theme=light]) .arrival-skip-hint{color:#a9a2c2;}
:root:not([data-theme=light]) .arrival-light{opacity:.35;}


/* party-v58.css */
/* Party mode: a button beside Music, a dark room with moving light, a bigger face and smaller bubbles. */
.site-sound .site-sound-party svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;width:16px;height:16px;opacity:.8;}
.site-sound .site-sound-party[aria-pressed=true]{color:#fff;background:linear-gradient(110deg,#ff3fd8,#8f63ff 35%,#21e4ff 65%,#ffb21f);background-size:300% 100%;animation:party-button 3s linear infinite;}
.site-sound .site-sound-party[aria-pressed=true] svg{opacity:1;animation:party-spin 4s linear infinite;}
@keyframes party-button{to{background-position:300% 0;}}
@keyframes party-spin{to{rotate:360deg;}}
body:not(.party-on).detail-open .site-sound-party{display:none;}
@media(max-width:359px){.site-sound .site-sound-party{padding:0 10px;}.site-sound .site-sound-party span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}}

/* The question, in the same family as the sound question at the door, but already in the dark. */
.party-confirm{position:fixed;left:50%;top:50%;margin:0;box-sizing:border-box;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px 15px;width:min(390px,calc(100vw - 32px));max-width:none;padding:18px;border:1px solid #ffffff26;border-radius:30px;color:#f3f1fa;background:#14121df2;box-shadow:0 24px 70px #0009,0 0 0 1px #ff3fd81f;font:400 13.5px/1.35 Portfolio Hanken,system-ui,sans-serif;translate:-50% -50%;animation:party-confirm-in 620ms cubic-bezier(.2,1.25,.4,1) both;}
.party-confirm:not([open]){display:none;}
.party-confirm::backdrop{background:#0b0a12b3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.party-confirm p{display:grid;gap:3px;margin:0;}
.party-confirm strong{font-size:17px;font-weight:700;letter-spacing:-.01em;}
.party-confirm p span{color:#b9b4c9;font-size:13px;}
.party-confirm-ball{width:50px;height:50px;border-radius:50%;background:repeating-linear-gradient(0deg,#0000 0 6px,#ffffff30 6px 7px),repeating-linear-gradient(90deg,#0000 0 6px,#ffffff30 6px 7px),radial-gradient(circle at 34% 30%,#fff 0 8%,#c9ced8 24%,#6c7380 58%,#22262e);box-shadow:0 0 22px #ff3fd859,0 0 40px #21e4ff33;animation:party-spin 6s linear infinite;}
.party-confirm-actions{grid-column:1/-1;display:flex;gap:8px;}
.party-confirm-actions button{flex:1;height:44px;padding:0 14px;border:1px solid transparent;border-radius:999px;font:650 14px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;transition:transform 200ms cubic-bezier(.22,1,.36,1),background 160ms ease;}
.party-confirm [data-party=yes]{color:#14121d;background:linear-gradient(110deg,#ff7be6,#b49bff 45%,#7cefff);}
.party-confirm [data-party=no]{color:#e9e6f2;background:transparent;border-color:#ffffff33;}
@media(hover:hover){.party-confirm [data-party=yes]:hover{transform:translateY(-1px);}.party-confirm [data-party=no]:hover{background:#ffffff12;}}
.party-confirm button:focus-visible{outline:2px solid #ff7be6;outline-offset:2px;}
.party-confirm.is-leaving{animation:party-confirm-out 220ms ease forwards;}
@keyframes party-confirm-in{from{opacity:0;scale:.75;}to{opacity:1;scale:1;}}
@keyframes party-confirm-out{to{opacity:0;scale:1.1;filter:blur(3px);}}

/* The room. Darkness and beams sit behind the scene; spots and the pointer's light in front. */
.party-room{position:fixed;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 112%,#1d1430 0%,#0b0a12 58%,#050409 100%);}
.party-room canvas,.party-front{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;}
.party-front{z-index:70;}
.party-ball{--drop:0;--ball:150px;--bx:0px;--by:0px;--tilt:0deg;position:fixed;left:50%;top:0;z-index:71;width:var(--ball);height:calc(var(--ball) + 22px);margin-left:calc(var(--ball) / -2);pointer-events:none;translate:var(--bx) calc((var(--drop) - 1) * 130% + var(--by));rotate:var(--tilt);transform-origin:50% 0;filter:drop-shadow(0 6px 18px #0008);}
.party-ball canvas{position:absolute;left:0;bottom:0;width:var(--ball);height:var(--ball);border-radius:50%;pointer-events:auto;cursor:grab;touch-action:none;}
body.party-ball-held .party-ball canvas{cursor:grabbing;}
/* The string runs from the hook to the top of the ball, wherever it swings. */
.party-string{position:fixed;left:50%;top:0;z-index:71;width:1px;height:22px;transform-origin:50% 0;pointer-events:none;background:linear-gradient(#ffffff30,#ffffff90);}
body.party-ending .party-string{opacity:0;transition:opacity .8s ease;}
.party-meter{position:fixed;left:0;right:0;top:0;z-index:73;height:3px;pointer-events:none;background:#ffffff10;}
.party-meter i{display:block;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#ff3fd8,#8f63ff 35%,#21e4ff 70%,#ffb21f);box-shadow:0 0 14px #ff3fd8aa,0 0 4px #21e4ff;}
.party-count{position:fixed;left:50%;top:62%;z-index:72;display:grid;justify-items:center;gap:2px;translate:-50% 0;color:#fff;pointer-events:none;font-family:Portfolio Hanken,system-ui,sans-serif;text-shadow:0 0 30px #ff3fd8aa,0 0 60px #21e4ff66;transition:opacity 300ms ease;}
.party-count span{font-size:13px;font-weight:650;letter-spacing:.24em;text-transform:uppercase;opacity:.75;}
.party-count b{display:block;font-size:clamp(72px,14vmin,150px);font-weight:800;line-height:.9;font-variant-numeric:tabular-nums;letter-spacing:-.04em;}
.party-count small{margin-top:6px;font-size:12px;font-weight:600;letter-spacing:.06em;opacity:.7;text-shadow:none;}
.party-count.is-final b{color:#ffe1f8;text-shadow:0 0 34px #ff3fd8,0 0 80px #ff3fd8aa;}
body:not(.party-counting) .party-count{opacity:0;}

/* The scene inside the party. */
body.party-on .scene .person :is(h1,p),body.party-on .head-shadow{opacity:0;transition:opacity 1.2s ease;}
body.party-on .header{filter:invert(1) hue-rotate(180deg);transition:filter 1.2s ease;}
@media(max-width:600px){body.party-on .header{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s linear .6s;}}
body.party-on .scene .memoji .hello-bubble{display:none;}
body.party-on :is(.hover-theatre,.stay-tuned,.chill-toggle){opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s linear .5s;}
body.party-on .bubble-label{color:#fff;text-shadow:0 1px 10px #000c;}
body.party-live .scene .memoji{filter:drop-shadow(0 0 30px color-mix(in srgb,var(--party-color,#ff3fd8) 55%,transparent));transition:filter .5s ease;}
.bubble-position::before{content:'';position:absolute;inset:8%;border-radius:50%;opacity:0;pointer-events:none;box-shadow:0 0 34px 6px var(--party-color,#ff3fd8),0 0 0 2px var(--party-color,#ff3fd8);transition:opacity .6s ease;}
body.party-live .bubble-position::before{opacity:.7;}
body.party-on .site-sound{color:#e8e5f2;border-color:#ffffff24;background:#14121dd9;box-shadow:0 4px 24px #0007;}
@media(hover:hover){body.party-on .site-sound button:hover{background:#ffffff14;}}
body.party-on .site-sound button[aria-pressed=true]:not(.site-sound-party){color:#14121d;background:#ece9f4;}
/* Your face can be grabbed: it floats above the bubbles while the party lasts. */
body.party-on .scene .person{z-index:3;pointer-events:none;}
body.party-on .scene .memoji{pointer-events:auto;cursor:grab;touch-action:none;}
body.party-face-held .scene .memoji{cursor:grabbing;}

/* Finds: one small note at a time, only when something was found. */
.party-toasts{position:fixed;left:50%;bottom:max(92px,calc(env(safe-area-inset-bottom) + 80px));z-index:85;display:grid;justify-items:center;gap:8px;translate:-50% 0;pointer-events:none;}
.party-toast{display:flex;align-items:center;gap:10px;padding:9px 16px 9px 11px;border:1px solid #ffffff2e;border-radius:999px;color:#fff;background:#14121de6;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px #0007,0 0 24px #ff3fd833;font:500 13.5px/1.2 Portfolio Hanken,system-ui,sans-serif;animation:party-toast-in 520ms cubic-bezier(.2,1.3,.4,1) both;}
.party-toast svg{width:18px;height:18px;fill:#ffd54a;filter:drop-shadow(0 0 6px #ffd54a99);}
.party-toast span{display:grid;gap:1px;}
.party-toast small{font-size:10.5px;font-weight:650;letter-spacing:.16em;text-transform:uppercase;color:#cfc8e6;}
.party-toast b{font-weight:650;}
.party-toast.is-leaving{animation:party-toast-out 380ms ease forwards;}
@keyframes party-toast-in{from{opacity:0;translate:0 -12px;scale:.8;}to{opacity:1;translate:0 0;scale:1;}}
@keyframes party-toast-out{to{opacity:0;translate:0 -8px;}}
body:not(.party-on) .party-toast{background:#22323fe6;}

/* Bubbles to pop: soap film in a party colour, one golden one with a star. */
.party-pops{position:fixed;inset:0;z-index:72;overflow:hidden;pointer-events:none;}
.party-pop{position:absolute;left:0;top:0;width:var(--size);height:var(--size);border:1.5px solid #ffffffb3;border-radius:50%;pointer-events:auto;cursor:crosshair;touch-action:none;animation:party-pop-in 320ms cubic-bezier(.2,1.4,.4,1) both;background:radial-gradient(circle at 30% 26%,#fffffff2 0 5%,#ffffff40 6% 12%,#0000 13%),radial-gradient(circle,color-mix(in srgb,var(--hue) 14%,#0000) 30%,color-mix(in srgb,var(--hue) 60%,#0000) 100%);box-shadow:0 0 24px color-mix(in srgb,var(--hue) 65%,#0000),inset 0 0 12px #ffffff4d;}
.party-pop.is-gold{border-color:#ffe08a;background:radial-gradient(circle at 30% 26%,#fff 0 6%,#fff6 7% 13%,#0000 14%),radial-gradient(circle,#ffd25a40 0,#ffb21fcc 72%,#ff8a00 100%);box-shadow:0 0 30px #ffb21fcc,0 0 64px #ff8a0066;animation:party-pop-in 320ms cubic-bezier(.2,1.4,.4,1) both,party-gold 520ms ease-in-out 320ms infinite alternate;}
.party-pop.is-gold::after{content:"★";position:absolute;inset:0;display:grid;place-items:center;color:#fff8e0;font-size:28px;line-height:1;text-shadow:0 0 12px #fff;}
.party-pop.is-popped{animation:party-pop-out 240ms ease-out forwards;}
body.party-ending .party-pop{pointer-events:none;}
.party-pop-word{position:absolute;left:0;top:0;color:#fff;font:800 18px/1 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;text-shadow:0 0 14px var(--party-color,#ff3fd8);pointer-events:none;animation:party-word 900ms cubic-bezier(.2,1,.3,1) forwards;}
.party-pop-word.is-gold{font-size:26px;color:#ffe08a;text-shadow:0 0 18px #ffb21f,0 0 40px #ff8a00;}
@keyframes party-pop-in{from{scale:.2;opacity:0;}}
@keyframes party-gold{to{scale:1.08;box-shadow:0 0 40px #ffd25a,0 0 90px #ff8a0088;}}
@keyframes party-pop-out{to{scale:1.6;opacity:0;}}
@keyframes party-word{0%{transform:translate(-50%,-50%) scale(.6);opacity:0;}15%{transform:translate(-50%,-90%) scale(1.15);opacity:1;}100%{transform:translate(-50%,-220%) scale(1);opacity:0;}}

/* What is playing, with the store link, for as long as the party runs. */
.party-credit{position:fixed;left:max(20px,calc(env(safe-area-inset-left) + 14px));bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px));z-index:74;display:flex;align-items:center;gap:8px;max-width:min(440px,calc(100vw - 32px));padding:7px 12px;border:1px solid #ffffff26;border-radius:999px;color:#fff;background:#14121dcc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font:500 12px/1.2 Portfolio Hanken,system-ui,sans-serif;text-decoration:none;opacity:0;transition:opacity .4s ease;}
body.party-on:not(.party-ending) .party-credit{opacity:1;}
.party-credit small{font-size:10px;font-weight:650;letter-spacing:.16em;text-transform:uppercase;opacity:.6;}
.party-credit span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.party-credit b{font-weight:650;color:#ffd2f4;white-space:nowrap;}
.party-credit:hover b,.party-credit:focus-visible b{text-decoration:underline;}
@media(max-width:600px){.party-credit{left:50%;translate:-50% 0;max-width:calc(100vw - 24px);}}

@media(prefers-reduced-motion:reduce){.site-sound .site-sound-party[aria-pressed=true],.site-sound .site-sound-party[aria-pressed=true] svg,.party-confirm-ball{animation:none;}}
/* The site's own Pause motion switch stills the same things. */
.motion-paused :is(.site-sound .site-sound-party[aria-pressed=true],.site-sound .site-sound-party[aria-pressed=true] svg,.party-confirm-ball,.party-confirm,.party-confirm.is-leaving,.party-toast,.party-toast.is-leaving,.party-pop,.party-pop.is-gold){animation:none;}

/* The face offers a party after a run of clicks, in its own speech bubble. */
.party-offer{position:fixed;z-index:86;display:grid;gap:10px;width:min(270px,calc(100vw - 32px));padding:14px 16px 12px;border:1px solid #ffffff2e;border-radius:22px 22px 22px 5px;color:#fff;background:#14121df0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 14px 40px #0007,0 0 30px #ff3fd833;font:500 13px/1.35 Portfolio Hanken,system-ui,sans-serif;animation:party-offer-in 420ms cubic-bezier(.2,1.3,.4,1) both;}
.party-offer p{display:grid;gap:3px;margin:0;}
.party-offer strong{font-size:17px;font-weight:750;}
.party-offer small{font-size:11.5px;color:#cfc8e6;}
.party-offer div{display:flex;gap:8px;}
.party-offer button{min-height:38px;padding:0 14px;border:0;border-radius:999px;font:650 13px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;}
.party-offer [data-offer=yes]{color:#fff;background:linear-gradient(90deg,#b8239a,#6a42c9);}
/* While the face makes its offer, its own glasses label steps aside. */
body.party-offering .scene .memoji .hello-bubble{opacity:0!important;}
.party-offer [data-offer=no]{color:#e8e5f2;background:#ffffff14;}
@media(max-width:600px){.party-offer{border-radius:22px;}}
@keyframes party-offer-in{from{opacity:0;translate:0 8px;scale:.85;}}

/* What the face shouts during the party. */
.party-say{position:absolute;left:80%;top:2%;z-index:2;padding:9px 15px;border-radius:22px 22px 22px 4px;color:#14121d;background:#fff;font:750 15px/1.2 Portfolio Hanken,system-ui,sans-serif;white-space:nowrap;box-shadow:0 8px 30px #0006,0 0 26px var(--party-color,#ff3fd8);pointer-events:none;animation:party-say 1.9s cubic-bezier(.2,1.3,.4,1) both;}
@media(max-width:600px){.party-say{left:50%;top:-16%;translate:-50% 0;border-radius:22px;font-size:14px;}}
@keyframes party-say{0%{opacity:0;transform:translateY(8px) scale(.6);}12%{opacity:1;transform:none;}84%{opacity:1;transform:none;}100%{opacity:0;transform:translateY(-6px);}}
.motion-paused :is(.party-offer,.party-say){animation:none;}


/* project-links-v47.css */
/* A hobby project that lives on its own site: its card echoes that site, without borrowed photos. */
.project-walkons{display:grid;place-content:center;justify-items:center;gap:6px;width:100%;height:100%;padding:12px;box-sizing:border-box;border-radius:inherit;color:#f1ece2;background:radial-gradient(ellipse at 50% 120%,#c2392f33,transparent 60%),#0d0f10;font-family:'Arial Narrow','Helvetica Neue',system-ui,sans-serif;text-align:center;}
.project-walkons-target{width:34%;max-width:64px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#e04a3f 0 9%,#0d0f10 10% 22%,#f1ece2 23% 26%,#0d0f10 27% 44%,#f1ece2 45% 48%,#0d0f10 49% 66%,#f1ece2 67% 70%,transparent 71%);}
.project-walkons strong{font-size:clamp(13px,1.6vw,20px);font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
.project-walkons small{font-size:clamp(9px,.9vw,11px);color:#a59f95;letter-spacing:.02em;}
.showcase-node-link{text-decoration:none;color:inherit;}
.project-zazu{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;height:100%;padding:14px;box-sizing:border-box;border-radius:inherit;background:#f5f8fd;}
.project-zazu img{display:block;width:auto;height:clamp(56px,8vw,118px);}
.project-zazu small{font:600 clamp(10px,.95vw,12px)/1 system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#4a5870;}


/* home-extras-v47.css */
/* Home corner: a small silent loop of the product films, opposite the sound control. */

/* Stay up to date: the Chill button invites an email first; Chill comes right after.
   The form opens on the button itself: one row, then a short consent line. */
body:not(.chill-mode) .chill-toggle.is-stay-tuned{min-height:48px;padding:10px 22px 10px 18px;gap:10px;border-color:transparent;color:#fff;background:#2b4152;box-shadow:0 10px 26px #24394a2e;font-size:15px;font-weight:600;}
body:not(.chill-mode) .chill-toggle.is-stay-tuned .chill-toggle-icon,body:not(.chill-mode) .chill-toggle.is-stay-tuned .chill-toggle-icon svg{width:20px;height:20px;}
body:not(.chill-mode) .chill-toggle.is-stay-tuned kbd{display:none;}
@media(hover:hover){body:not(.chill-mode) .chill-toggle.is-stay-tuned:hover{background:#1f3242;}}
.stay-tuned{position:fixed;z-index:85;display:grid;gap:8px;width:min(470px,calc(100vw - 24px));box-sizing:border-box;padding:7px 7px 10px;border:1px solid #ffffffc4;border-radius:28px;color:#22323f;background:#f8fafbf6;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 18px 44px #1f344a29,0 2px 6px #1f344a12;font:400 13px/1.35 Portfolio Hanken,system-ui,sans-serif;animation:stay-tuned-in 420ms cubic-bezier(.2,1.25,.4,1) both;}
.stay-tuned-row{display:flex;align-items:center;gap:6px;}
.stay-tuned-field{flex:1;min-width:0;}
.stay-tuned input[type=email]{width:100%;box-sizing:border-box;height:48px;padding:0 18px;border:0;border-radius:999px;color:#22323f;background:#fff;font:inherit;font-size:17px;}
.stay-tuned input[type=email]::placeholder{color:#8796a3;}
.stay-tuned input[type=email]:focus-visible{outline:2px solid #6f8ea8;outline-offset:1px;}
.stay-tuned-trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.stay-tuned-row>button{flex:none;height:48px;padding:0 20px;border:1px solid transparent;border-radius:999px;font:600 15px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;}
.stay-tuned [type=submit]{color:#fff;background:#2b4152;}
.stay-tuned [type=submit]:disabled{opacity:.6;cursor:default;}
.stay-tuned [data-just-chill]{color:#33475a;background:transparent;padding:0 14px;}
@media(hover:hover){.stay-tuned [type=submit]:not(:disabled):hover{background:#1f3242;}.stay-tuned [data-just-chill]:hover{background:#eef2f5;}}
.stay-tuned-row>button:focus-visible,.stay-tuned a:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
.stay-tuned-purposes{display:grid;gap:0;margin:2px 0 0;padding:2px 12px 2px 18px;border:0;border-radius:18px;}
.stay-tuned-consent{margin:0 18px;color:#5b6c7a;font-size:12px;text-wrap:pretty;}
.stay-tuned-consent a{color:inherit;text-underline-offset:2px;}
.stay-tuned-status{margin:0 18px;color:#5b6c7a;font-size:13px;}
.stay-tuned-status:empty{display:none;}
.stay-tuned.is-done .stay-tuned-status{color:#2f705d;font-weight:600;}
@keyframes stay-tuned-in{from{opacity:0;transform:scale(.7,.85);}to{opacity:1;transform:none;}}
@media(max-width:420px){.stay-tuned-row>button{padding:0 13px;font-size:14px;}.stay-tuned [data-just-chill]{padding:0 10px;}}
@media(prefers-reduced-motion:reduce){.stay-tuned{animation:none;}}

/* App cards with a film: the poster, and a silent preview while the card is looked at. */
.app-film-card{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;background:#0b0d10;box-shadow:0 18px 40px #24394a1f;}
.app-film-card img,.app-film-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.app-film-card video{opacity:0;transition:opacity 280ms ease;}
.showcase-node.is-previewing .app-film-card video{opacity:1;}
@media(prefers-reduced-motion:reduce){.app-film-card video{transition:none;}}
/* Like the app previews before them, posters never take the gallery's artwork tilt. */
body>dialog.cohesive-world[data-room-mode] [data-gallery=apps] .app-film-card :is(img,video){transform:none!important;rotate:none!important;scale:1!important;box-shadow:none!important;border:0!important;filter:none!important;}

/* Play by invite: one calm card in the Play room until an invite link opens the game. */
.play-invite{position:relative;display:grid;justify-items:center;gap:14px;width:min(560px,calc(100vw - 32px));margin:auto;padding:min(9vh,70px) 0;text-align:center;color:#22323f;font-family:Portfolio Hanken,system-ui,sans-serif;}
.detail[data-category="play"] .world-stage:has(.play-invite){display:grid;place-items:center;min-height:100dvh;overflow:auto;background:radial-gradient(ellipse at 50% 30%,#fdd9da 0,#f6eef2 45%,#f2f4f6 80%);}
.play-invite-back{position:fixed;left:max(20px,env(safe-area-inset-left));top:max(18px,env(safe-area-inset-top));height:40px;padding:0 16px;border:1px solid #d5dee5;border-radius:999px;color:#33475a;background:#fffc;font:500 14px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;}
.play-invite-tag{padding:6px 12px;border-radius:999px;color:#9c3d43;background:#fde3e4;font-size:12.5px;font-weight:600;letter-spacing:.02em;}
.play-invite h2{margin:0;font-size:clamp(28px,4.2vw,44px);line-height:1.08;letter-spacing:-.02em;text-wrap:balance;}
.play-invite-lede{margin:0;max-width:44ch;color:#4f6170;font-size:16px;line-height:1.5;text-wrap:pretty;}
.play-invite-form{display:grid;gap:10px;width:100%;margin-top:6px;}
.play-invite-row{display:flex;gap:6px;padding:6px;border:1px solid #ffffffc4;border-radius:999px;background:#f8fafbf2;box-shadow:0 16px 40px #6b3a3e1f;}
.play-invite-row label{flex:1;min-width:0;}
.play-invite-row input{width:100%;box-sizing:border-box;height:50px;padding:0 18px;border:0;border-radius:999px;background:#fff;color:#22323f;font:inherit;font-size:17px;}
.play-invite-row input:focus-visible{outline:2px solid #6f8ea8;outline-offset:1px;}
.play-invite-row button{flex:none;height:50px;padding:0 22px;border:0;border-radius:999px;color:#fff;background:#c4505a;font:600 15px/1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;}
.play-invite-row button:disabled{opacity:.6;}
@media(hover:hover){.play-invite-row button:not(:disabled):hover{background:#a8424b;}}
.play-invite-purposes{display:grid;gap:0;margin:0;padding:2px 12px 2px 24px;border:0;border-radius:20px;}
.play-invite-consent{margin:0 24px;color:#6b7b88;font-size:12.5px;line-height:1.45;text-align:left;text-wrap:pretty;}
.play-invite-consent a{color:inherit;text-underline-offset:2px;}
.play-invite-status{margin:0 24px;color:#5b6c7a;font-size:13.5px;text-align:left;}
.play-invite-status:empty{display:none;}
.play-invite :is(button,a,input):focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
@media(max-width:480px){.play-invite-row{flex-direction:column;border-radius:24px;}.play-invite-row button{width:100%;}}

/* A small prize tag floats beside the Play bubble until the visitor is on the list. */
.prize-tag{position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(calc(-50% + var(--tag-shift,0px)));z-index:4;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid #ffffffd0;border-radius:999px;color:#9c3d43;background:#fff4f4f0;box-shadow:0 8px 22px #9c3d4324;font:600 12.5px/1 Portfolio Hanken,system-ui,sans-serif;white-space:nowrap;text-decoration:none;cursor:pointer;animation:prize-bob 4.8s ease-in-out infinite;}
.prize-tag::before{content:'';width:7px;height:7px;border-radius:50%;background:#e0565f;}
@media(hover:hover){.prize-tag:hover{background:#fff;}}
.prize-tag:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
@keyframes prize-bob{0%,100%{translate:0 0;}50%{translate:0 -4px;}}
body.chill-mode .prize-tag,body.detail-open .prize-tag{opacity:0;pointer-events:none;}
@media(max-width:600px){.prize-tag{font-size:11px;padding:6px 10px;}}
@media(prefers-reduced-motion:reduce){.prize-tag{animation:none;}}
/* Consent boxes (both signup forms): drawn in the form's own look, never the browser's grey box.
   The box sits on the first text line and lines up with the text in the email field. */
:is(.stay-tuned,.play-invite-form){--check-ink:#2b4152;--check-line:#b9c6d1;}
.play-invite-form{--check-ink:#c4505a;--check-line:#d9b9bd;}
:is(.stay-tuned-check,.play-invite-check){display:flex;align-items:flex-start;gap:10px;padding:6px 0;color:#33475a;font:500 14px/20px Portfolio Hanken,system-ui,sans-serif;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.play-invite-check{font-size:15px;}
:is(.stay-tuned-check,.play-invite-check) input{flex:none;appearance:none;-webkit-appearance:none;width:20px;height:20px;margin:0;border:1.5px solid var(--check-line);border-radius:7px;background:#fff center/14px 14px no-repeat;box-shadow:0 1px 2px #1f344a14;cursor:pointer;transition:background-color .15s ease,border-color .15s ease;}
:is(.stay-tuned-check,.play-invite-check) input:checked{border-color:var(--check-ink);background-color:var(--check-ink);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E");}
:is(.stay-tuned-check,.play-invite-check) input:focus-visible{outline:2px solid #6f8ea8;outline-offset:2px;}
@media(hover:hover){:is(.stay-tuned-check,.play-invite-check):hover input:not(:checked){border-color:var(--check-ink);}}
:is(.stay-tuned-purposes,.play-invite-purposes).is-missing input:not(:checked){border-color:var(--check-ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--check-ink) 18%,transparent);}
@media(pointer:coarse),(max-width:480px){:is(.stay-tuned-check,.play-invite-check){padding:12px 0;}}
@media(prefers-reduced-motion:reduce){:is(.stay-tuned-check,.play-invite-check) input{transition:none;}}


/* polish-gallery-v48.css */
/* Projects gallery, v48 polish: one crop system for every tile, a feature tile that breaks the even
   grid, and an editorial caption. Scoped to the Projects world gallery only. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects]{
  --pg-ink:#1d2c38;--pg-muted:#596876;--pg-radius:14px;--pg-art:16/9;
  --pg-shadow:0 1px 2px rgb(29 44 56/.06),0 22px 40px -30px rgb(29 44 56/.55);
}

/* Filters: same pill, quieter type that matches the captions. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters{margin-bottom:26px;}
/* The note beside the tabs: one quiet line on the tabs' axis, wrapping under them on narrow screens. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;margin-bottom:26px;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-head .project-filters{margin-bottom:0;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note{margin:0;font:450 14px/1.45 'Portfolio Hanken',system-ui,sans-serif;letter-spacing:-.003em;color:#7b8794;text-wrap:balance;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note a{color:inherit;text-decoration:underline;text-decoration-color:#7b879466;text-underline-offset:3px;transition:color .2s,text-decoration-color .2s;}
@media(hover:hover){body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note a:hover{color:var(--pg-ink,#22323f);text-decoration-color:currentColor;}}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters button{font:500 15px/1 'Portfolio Hanken',system-ui,sans-serif;letter-spacing:-.005em;color:#66737f;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters button[aria-pressed=true]{color:var(--pg-ink);font-weight:600;}

/* Grid rhythm. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 26px;align-items:stretch;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden.showcase-count-4{grid-template-columns:repeat(2,minmax(0,1fr));}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node{display:flex;flex-direction:column;height:100%;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node-inner{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex:1;height:100%;}

/* One frame for every tile: full bleed, same radius, same hairline and shadow. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art{display:block;flex:none;aspect-ratio:var(--pg-art);border-radius:var(--pg-radius);background:#16191d;box-shadow:var(--pg-shadow);overflow:hidden;isolation:isolate;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art::after{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;box-shadow:inset 0 0 0 1px rgb(255 255 255/.14),inset 0 0 0 .5px rgb(10 20 30/.18);pointer-events:none;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art>*{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;box-sizing:border-box;border-radius:0;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art>img{object-fit:cover;object-position:50% 50%;box-shadow:none;}

/* Older gallery rules tilt nested images; inside this frame nothing is tilted. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art :is(.project-read-art,.project-zazu)>img{transform:none;rotate:none;border:0;background:none;box-shadow:none;}

/* Per-tile crops: every image fills its frame, framed on its subject. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-cover-kind=square] .showcase-node-art>img{width:100%;max-width:none;object-fit:cover;object-position:50% 36%;border-radius:0;box-shadow:none;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/three-d"] .showcase-node-art>img{object-position:50% 34%;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/vuurtje"] .showcase-node-art>img{object-position:50% 62%;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node-brand .showcase-node-art>img{object-position:0 0;}

/* ZAZU: the real mark, large, on a field of its own light blue so it reads as a tile, not a sticker. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-zazu{display:grid;place-items:center;padding:0;background:radial-gradient(110% 95% at 50% 38%,#f7faff 0,#dfe9f9 52%,#bfd3f1 100%);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-zazu>img{width:auto;height:62%;filter:drop-shadow(0 18px 20px rgb(15 38 70/.18));}

/* Woordfeud: the rack sits on a board instead of an empty field. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-cover-kind=word] .showcase-node-art{background:
  linear-gradient(rgb(255 255 255/.06) 1px,transparent 1px) 0 0/calc(100% / 11) calc(100% / 6.2),
  linear-gradient(90deg,rgb(255 255 255/.06) 1px,transparent 1px) 0 0/calc(100% / 11) calc(100% / 6.2),
  radial-gradient(90% 80% at 50% 45%,#2c4a4d 0,#1b2f33 70%,#142427 100%);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack{display:flex;align-items:center;justify-content:center;gap:clamp(5px,.6vw,9px);transform:rotate(-4deg);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack>i{width:clamp(30px,4.2vw,60px);font:600 clamp(18px,2.3vw,32px)/1 'Portfolio Hanken',system-ui,sans-serif;color:#4f4224;box-shadow:inset 0 1px 1px #fff,0 3px 0 #a8935f,0 14px 18px rgb(0 0 0/.35);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack small{font-size:clamp(7px,.7vw,10px);}

/* Reads: covers edge to edge; app icons on a field blurred from the icon itself. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-read-art>img{width:100%;height:100%;object-fit:cover;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/desktop-prank"] .project-read-art>img{scale:1.03;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/rickroll"] .project-read-art>img{object-position:30% 100%;scale:1.02;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-read-icon{display:grid;place-items:center;overflow:hidden;background:#1b2530;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-read-icon::before{content:'';position:absolute;inset:-30%;background:var(--read-art) center/cover no-repeat;filter:blur(46px) saturate(1.35) brightness(.92);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-read-icon::after{content:'';position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 45%,transparent 30%,rgb(8 14 22/.32) 100%);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-read-icon>img{position:relative;z-index:1;width:auto;height:44%;max-height:120px;aspect-ratio:1;object-fit:contain;border-radius:22%;filter:drop-shadow(0 16px 22px rgb(0 0 0/.32));}
/* The same matchbar icon appears twice: the second note crops into it instead. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/one-club-several-competitions"] .project-read-icon::before{background-position:80% 20%;background-size:240%;}

/* Caption: title in the Portfolio display face, one quiet line under it. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption{align-self:stretch;align-items:flex-start;gap:5px;padding:15px 2px 0;text-align:left;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption>strong{display:block;font:600 clamp(19px,1.45vw,22px)/1.16 'Portfolio Bricolage',system-ui,sans-serif;letter-spacing:-.022em;color:var(--pg-ink);}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption>strong>span{font-weight:500;color:#7a8794;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-note{font:450 14.5px/1.45 'Portfolio Hanken',system-ui,sans-serif;color:var(--pg-muted);letter-spacing:0;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node[data-cover-kind=read] .showcase-node-caption{padding-top:15px;}

/* All: the first project is a feature tile over two rows; the last read closes the grid wide. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child{grid-column:span 2;grid-row:span 2;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:is(:first-child,:last-child) .showcase-node-art{flex:1 1 0;aspect-ratio:auto;min-height:0;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:last-child{grid-column:span 2;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-caption{padding-top:18px;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-caption>strong{font-size:clamp(26px,2.3vw,34px);letter-spacing:-.03em;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-note{font-size:16px;}

/* Hover: the frame stays put, the picture leans in. Never needed to read anything. */
@media (hover:hover) and (pointer:fine){
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node:hover{transform:none;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art>:first-child{transition:transform 520ms cubic-bezier(.23,1,.32,1);}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node:hover .showcase-node-art>:first-child{transform:scale(1.035);}
}
@media (prefers-reduced-motion:reduce){
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-art>:first-child{transition:none;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node:hover .showcase-node-art>:first-child{transform:none;}
}
.motion-paused .showcase-home-projects .showcase-node-art>:first-child{transition:none!important;}

body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node:focus-visible{outline-offset:6px;border-radius:calc(var(--pg-radius) + 4px);}

/* Two columns: the feature spans the row, the last read closes it. */
@media (max-width:950px){
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 18px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child{grid-row:auto;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-art{flex:none;aspect-ratio:16/9;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:last-child .showcase-node-art{flex:none;aspect-ratio:21/9;}
}
@media (max-width:650px){
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects]{--pg-art:1/1;--pg-radius:12px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters{margin-bottom:20px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-head{margin-bottom:20px;gap:10px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note{font-size:13px;padding-left:6px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden,
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden.showcase-count-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-art{aspect-ratio:3/2;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:last-child .showcase-node-art{aspect-ratio:2/1;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption{gap:3px;padding-top:10px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption>strong{font-size:17px;line-height:1.18;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-note{font-size:13px;line-height:1.4;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-caption>strong{font-size:24px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-note{font-size:14px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node-brand .showcase-node-art>img{object-position:4% 0;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/desktop-prank"] .project-read-art>img{object-position:86% 50%;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] [data-showcase-route$="/rickroll"] .project-read-art>img{object-position:12% 0;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack{gap:3px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack>i{width:26px;font-size:16px;border-radius:4px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack small{font-size:6px;bottom:1px;right:2px;}
}
/* Very narrow phones: one column, so no caption has to break mid-word. */
@media (max-width:359px){
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects]{--pg-art:16/10;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden,
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-garden.showcase-count-4{grid-template-columns:minmax(0,1fr);}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:is(:first-child,:last-child){grid-column:auto;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:first-child .showcase-node-art{aspect-ratio:4/3;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects:has(.project-filters>button:first-child[aria-pressed=true]) .showcase-garden>.showcase-node:last-child .showcase-node-art{aspect-ratio:16/10;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .project-word-rack>i{width:32px;font-size:19px;}
  body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption>strong{font-size:19px;}
}


/* polish-music-v48.css */
/* v48 Music listening room: one grid, one text column, a list that runs to the floor, lit by the sleeve.
   The room is a two column grid: the record fills the left column, vertically centred;
   the heading, the now-playing copy and All Time Favs share one left edge on the right.
   The track list takes whatever height is left and fades out above the shared sound bar. */
.detail[data-category=music] .media-music{
  --music-gap:clamp(36px,6vw,88px);
  --music-clear:52px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);
  column-gap:var(--music-gap);flex:1 0 auto;width:min(1060px,100%);max-width:none;margin:0 auto;
  padding-bottom:var(--music-clear);box-sizing:border-box;
  font-family:Portfolio Hanken,system-ui,sans-serif;color:#26364a;
}
.detail[data-category=music] .media-music .media-listening-room{display:contents;}
.detail[data-category=music] .media-music :is(button,input){font-family:inherit;}

/* Heading: a quiet label on the text column, not a centred title above the split. */
.detail[data-category=music] .media-music>.media-heading{grid-column:2;grid-row:1;margin:clamp(6px,2.2vh,22px) 0 14px;text-align:left;}
.detail[data-category=music] .media-music>.media-heading h2{margin:0;font:650 13px/1.2 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#6a5aa6;}

/* Record: the hero. The sleeve is sized by the window height and runs off the left edge,
   where the stage clips it; the vinyl peeks out towards the text column. */
.detail[data-category=music] .media-music .media-record-object{grid-column:1;grid-row:1/3;align-self:center;justify-content:flex-end;width:auto;min-height:0;margin-left:-50vw;}
.detail[data-category=music] .media-music .media-record-deck{flex:none;width:min(82vh,58vw,820px);max-width:none;margin-right:calc(var(--music-gap) * -.35);}
.detail[data-category=music] .media-music .media-sleeve{border-radius:3px;box-shadow:0 56px 90px -34px rgba(24,34,54,.5),0 14px 28px -14px rgba(24,34,54,.32);}
.detail[data-category=music] .media-music .media-vinyl{box-shadow:0 40px 60px -30px rgba(24,34,54,.4);}
/* Playing pulls the record out of its sleeve: the sleeve steps aside and the cover on the label turns at 33 1/3. */
.detail[data-category=music] .media-music :is(.media-sleeve,.media-vinyl){transition:translate .9s cubic-bezier(.23,1,.32,1);}
.detail[data-category=music] .media-music:is([data-playback=playing],[data-playback=loading],[data-playback=paused]) .media-sleeve{translate:-40% 0;}
.detail[data-category=music] .media-music:is([data-playback=playing],[data-playback=loading],[data-playback=paused]) .media-vinyl{translate:4% 0;}
/* On a phone the record sits above the text, so it can come further out. */
@media (max-width:700px){
  .detail[data-category=music] .media-music:is([data-playback=playing],[data-playback=loading],[data-playback=paused]) .media-sleeve{translate:-26% 0;}
  .detail[data-category=music] .media-music:is([data-playback=playing],[data-playback=loading],[data-playback=paused]) .media-vinyl{translate:13% 0;}
}
/* After a record ends, a line fills while the next one gets ready. */
.detail[data-category=music] .media-music .media-finished-next.is-up-next{position:relative;}
.detail[data-category=music] .media-music .media-finished-next.is-up-next::after{content:'';position:absolute;left:0;right:0;bottom:4px;height:2px;border-radius:2px;background:currentColor;opacity:.45;transform-origin:left;animation:media-up-next 2.2s linear both;}
@keyframes media-up-next{from{transform:scaleX(0);}}
.detail[data-category=music] .media-music .media-live-layer{flex:none;width:min(460px,42vw);}

/* Now playing. */
.detail[data-category=music] .media-music .media-listening-copy{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-height:0;padding:0;container-type:inline-size;}
.detail[data-category=music] .media-music .media-artist{margin:0 0 0 -.04em;font:700 clamp(52px,19cqi,104px)/.9 Portfolio Bricolage,system-ui,sans-serif;letter-spacing:-.055em;color:#17243a;overflow-wrap:normal;word-break:normal;hyphens:manual;text-wrap:balance;}
.detail[data-category=music] .media-music .media-track-title{margin:14px 0 0;font-size:20px;font-weight:500;line-height:1.35;color:#4f5f73;}
.detail[data-category=music] .media-music .media-player{margin-top:24px;}
.detail[data-category=music] .media-music .media-timeline{margin-top:10px;}
.detail[data-category=music] .media-music .media-player-caption{color:#5b6b7e;}

/* All Time Favs: set as type straight on the page, a numbered running order with hairlines. */
.detail[data-category=music] .media-music .favorites-browser{display:flex;flex-direction:column;flex:1 1 0;min-height:auto;margin-top:30px;border-top:0;}
.detail[data-category=music] .media-music .favorites-browser-heading{flex:none;align-items:flex-end;gap:18px;padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--music-ink) 30%,transparent);}
.detail[data-category=music] .media-music .favorites-browser-heading>span{display:grid;gap:4px;font:700 26px/1 Portfolio Bricolage,system-ui,sans-serif;letter-spacing:-.035em;color:#17243a;}
.detail[data-category=music] .media-music .favorites-browser-heading small{font:500 12.5px/1.3 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.01em;color:#5f6e82;font-variant-numeric:tabular-nums;}
.detail[data-category=music] .media-music .favorites-browser-heading input{width:150px;max-width:38cqi;height:34px;padding:0 2px;border:0;border-bottom:1px solid rgba(23,36,58,.22);border-radius:0;background:transparent;font-size:14px;color:#17243a;}
.detail[data-category=music] .media-music .favorites-browser-heading input::placeholder{color:#6b798b;}
.detail[data-category=music] .media-music .favorites-browser-heading input:focus-visible{outline:none;border-bottom-color:var(--music-ink);box-shadow:0 1px 0 var(--music-ink);}
.detail[data-category=music] .media-music .favorites-track-list{
  flex:1 1 0;min-height:64px;max-height:none;margin:0;padding:0 0 56px;scroll-padding-block:4px 60px;
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 72px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 72px),transparent);
}
.detail[data-category=music] .media-music .favorites-track{min-height:46px;gap:14px;padding:0 4px 0 0;border-radius:0;background:transparent;box-shadow:inset 0 -1px 0 rgba(23,36,58,.08);}
.detail[data-category=music] .media-music .favorites-track:hover{background:color-mix(in srgb,var(--music-tone) 12%,transparent);}
.detail[data-category=music] .media-music .favorites-track[aria-pressed=true]{background:transparent;}
.detail[data-category=music] .media-music .favorites-track:focus-visible{outline:2px solid var(--music-ink);outline-offset:-2px;}
.detail[data-category=music] .media-music .favorites-number{width:22px;flex:none;font:600 12px/1 Portfolio Hanken,system-ui,sans-serif;color:#7d889a;}
.detail[data-category=music] .media-music .favorites-track-text{display:flex;align-items:baseline;gap:10px;}
.detail[data-category=music] .media-music .favorites-track-text strong{flex:0 1 auto;font-size:15px;font-weight:600;color:#17243a;}
.detail[data-category=music] .media-music .favorites-track-text small{flex:0 10 auto;font-size:13px;color:#5f6e82;}
.detail[data-category=music] .media-music .favorites-track[aria-pressed=true] :is(.favorites-number,.favorites-track-text strong,.favorites-track>span:last-child){color:var(--music-ink);}
.detail[data-category=music] .media-music .favorites-no-results{flex:none;margin:12px 0 0;}
.detail[data-category=music] .media-music .favorites-live-playlist{flex:none;align-self:flex-start;min-height:42px;margin:0;font-size:14px;color:#3f5269;}
.detail[data-category=music] .media-music .favorites-live-playlist:hover{color:var(--music-ink);}

/* Room light: the current sleeve tints the room. media.js samples the cover into --music-tone
   (a light hue) and --music-ink (a dark one); without a sample both stay the site's lavender. */
@property --music-tone{syntax:'<color>';inherits:true;initial-value:hsl(255 30% 76%);}
@property --music-ink{syntax:'<color>';inherits:true;initial-value:hsl(254 30% 42%);}
.detail[data-category=music] .media-music{transition:--music-tone .9s cubic-bezier(.22,1,.36,1),--music-ink .9s cubic-bezier(.22,1,.36,1);}
.detail[data-category=music] .media-music::before{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(66% 92% at 18% 54%,color-mix(in srgb,var(--music-tone) 74%,transparent),transparent 74%),
    radial-gradient(46% 56% at 92% 6%,color-mix(in srgb,var(--music-tone) 18%,transparent),transparent 72%),
    linear-gradient(180deg,color-mix(in srgb,var(--music-tone) 8%,transparent),color-mix(in srgb,var(--music-tone) 22%,transparent));
}
.detail[data-category=music] .media-music>.media-heading h2{color:var(--music-ink);}
.detail[data-category=music] .media-music :is(.media-artist,.favorites-browser-heading>span){color:color-mix(in srgb,var(--music-ink) 26%,#0f141c);}
.detail[data-category=music] .media-music .media-progress-rail>span{background:var(--music-ink);}
.detail[data-category=music] .media-music :is(.media-track-title,.media-player-caption,.media-timeline,.favorites-track-text small,.favorites-browser-heading small,.favorites-live-playlist){color:color-mix(in srgb,var(--music-ink) 34%,#4d5868);}
.detail[data-category=music] .media-music .media-sleeve{box-shadow:0 56px 90px -34px color-mix(in srgb,var(--music-ink) 62%,transparent),0 14px 28px -14px rgba(24,34,54,.32);}
@media (prefers-reduced-motion:reduce){.detail[data-category=music] .media-music{transition:none;}}
.motion-paused .detail[data-category=music] .media-music,.detail[data-category=music].motion-paused .media-music{transition:none;}
.detail[data-category=music] .media-music :is(.media-status,.media-finished-next){flex:none;}

/* Short desktop windows: keep the list legible rather than squeezed. */
@media (min-width:701px) and (max-height:760px){
  .detail[data-category=music] .media-music>.media-heading{margin:4px 0 10px;}
  .detail[data-category=music] .media-music .media-artist{font-size:clamp(46px,13cqi,76px);}
  .detail[data-category=music] .media-music .media-track-title{margin-top:8px;font-size:18px;}
  .detail[data-category=music] .media-music .media-player{margin-top:12px;}
  .detail[data-category=music] .media-music .media-live-button{min-height:40px;margin-top:6px;}
  .detail[data-category=music] .media-music .favorites-browser{margin-top:16px;}
  .detail[data-category=music] .media-music .favorites-browser-heading{padding-bottom:8px;}
  .detail[data-category=music] .media-music .favorites-browser-heading>span{font-size:22px;}
}

/* Phone: one column on one left edge; the sleeve runs off the left side above it. */
@media (max-width:700px){
  .detail[data-category=music] .media-music{
    --music-clear:44px;
    grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);column-gap:0;
    width:100%;
  }
  .detail[data-category=music] .media-music .media-record-object{grid-column:1;grid-row:1;align-self:start;justify-content:flex-end;margin-top:-18px;}
  .detail[data-category=music] .media-music .media-record-deck{width:min(76vw,310px);margin-right:calc(28vw - 22px);}
  .detail[data-category=music] .media-music .media-live-layer{width:calc(100vw - 44px);margin:0;}
  .detail[data-category=music] .media-music>.media-heading{grid-column:1;grid-row:2;margin:2px 0 4px;text-align:left;}
  .detail[data-category=music] .media-music>.media-heading h2{font-size:12px;}
  .detail[data-category=music] .media-music .media-listening-copy{grid-column:1;grid-row:3;width:100%;max-width:none;margin:0;text-align:left;}
  .detail[data-category=music] .media-music .media-artist{font-size:clamp(34px,10.4vw,46px);}
  .detail[data-category=music] .media-music .media-track-title{margin-top:4px;font-size:17px;}
  .detail[data-category=music] .media-music .media-player{margin:12px 0 0 -12px;max-width:none;}
  .detail[data-category=music] .media-music .media-transport{justify-content:flex-start;}
  .detail[data-category=music] .media-music .media-timeline{margin:2px 0 0 12px;max-width:none;}
  .detail[data-category=music] .media-music .favorites-browser{margin-top:16px;}
  .detail[data-category=music] .media-music .favorites-browser-heading{padding-bottom:8px;}
  .detail[data-category=music] .media-music .favorites-browser-heading>span{font-size:21px;}
  .detail[data-category=music] .media-music .favorites-browser-heading input{width:128px;max-width:38vw;}
  .detail[data-category=music] .media-music::before{background:
    radial-gradient(90% 46% at 24% 20%,color-mix(in srgb,var(--music-tone) 52%,transparent),transparent 74%),
    linear-gradient(180deg,color-mix(in srgb,var(--music-tone) 8%,transparent),color-mix(in srgb,var(--music-tone) 14%,transparent));}
  .detail[data-category=music] .media-music .favorites-track-list{min-height:76px;padding-bottom:40px;scroll-padding-block:4px 44px;
    -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent);}
  .detail[data-category=music] .media-music .favorites-track{min-height:44px;}
  .detail[data-category=music] .media-music .favorites-live-playlist{font-size:13.5px;}
  /* A streamed track adds the Spotify button; the list gives up that height, the sleeve keeps its size. */
  .detail[data-category=music] .media-music .media-live-button{align-self:flex-start;min-height:40px;margin-top:2px;}
  .detail[data-category=music] .media-music .media-record-object{min-height:0;}
}
@media (max-width:360px){
  .detail[data-category=music] .media-music .media-record-deck{width:86vw;}
  .detail[data-category=music] .media-music .favorites-browser-heading input{width:108px;}
}


/* polish-home-v48.css */
/* Home first screen: one leader and a structure. The face is the strongest
   thing on screen, larger than the title; the five stations sit in three clear size tiers (one large, two medium,
   two small) on fixed columns (wide screens) or rows (phones and portrait tablets).
   home-ui-v70.css refines the final five-destination layout; positions stay consistent across visits.
   Unlayered on purpose: it settles the layered home layout without touching other screens.
   The bubble physics and the entrance measure these boxes, so both land on this layout. */

/* Type: Bricolage headline as a two-line block; Hanken for the line under it. */
.scene .person h1{max-width:7.6em;margin-inline:auto;font-weight:680;letter-spacing:-.05em;line-height:.98;text-wrap:balance;}
.scene .person>p{font-family:Portfolio Hanken,system-ui,sans-serif;font-weight:450;letter-spacing:-.005em;color:#4b5c6a;}
body.chill-mode .scene .person>p{color:#50665b;}

/* The face sizes from one value so its shadow follows it. */
.scene .person{--face:240px;}
.scene .memoji{width:var(--face);height:var(--face);}
.scene .head-shadow{width:calc(var(--face)*.5);height:calc(var(--face)*.05);margin:calc(var(--face)*-.12) auto calc(var(--face)*.12);}

/* LinkedIn sits beside the wordmark as a quiet mark in the header's own ink. */
.header-id{display:flex;align-items:center;gap:12px;}
.header-linkedin{display:grid;place-items:center;width:34px;height:34px;margin-left:-4px;border-radius:9px;color:inherit;opacity:.42;transition:opacity .2s,color .2s,background-color .2s;}
.header-linkedin svg{width:19px;height:19px;fill:currentColor;}
@media(hover:hover){.header-linkedin:hover{opacity:1;color:#0a66c2;background:#ffffffa8;}}
.header-linkedin:focus-visible{opacity:1;outline:2px solid #6f8ea8;outline-offset:2px;}
@media(max-width:600px){.header-id{gap:8px;}.header-linkedin{width:30px;height:30px;}.header-linkedin svg{width:16px;height:16px;}}

/* Labels follow their tier. */
.position-projects .bubble-label{font-size:var(--label-l);}
.position-games .bubble-label,.position-play .bubble-label{font-size:var(--label-m);}
.position-music .bubble-label,.position-apps .bubble-label,.position-reads .bubble-label{font-size:var(--label-s);}

/* Reads, the sixth station: a paper-and-brass tint of its own, a small-tier slot everywhere. */
.bubble-reads{--tint:196 160 98;--color:#a7834c;--delay:-3.6s;}
.position-reads{left:27%;top:82%;}
.hover-cover-read img{object-fit:cover;border-radius:10px;}
.hover-cover-read,.hover-cover-note{background:linear-gradient(150deg,#fffbf3ee,#f1e8d8b3);}

/* The prize tag rides on the rim of its bubble instead of hanging below it. */
.scene .prize-tag{top:calc(100% - 14px);}

/* Wide screens: two columns either side of the text, each a clean vertical line, three rows.
   Left: small, large, small. Right: medium, small, medium. */
@media(min-width:601px) and (min-aspect-ratio:13/10) and (min-height:651px){
  .scene{--label-l:clamp(20px,1.75vw,26px);--label-m:clamp(16px,1.3vw,20px);--label-s:clamp(13px,1vw,15px);}
  .scene .person{--face:clamp(190px,min(19vw,30svh),300px);top:16%;width:56%;}
  .scene .person h1{max-width:none;font-size:clamp(34px,min(3.3vw,5.4svh),52px);}
  .scene .person>p{margin-top:16px;font-size:clamp(17px,1.3vw,19px);}
  .scene .chill-toggle{margin-top:26px;}
  .position-reads{width:9%;left:14%;top:11%;}
  .position-projects{width:18.5%;left:14%;top:50%;}
  .position-music{width:9%;left:14%;top:89%;}
  .position-games{width:13%;left:86%;top:13.5%;}
  .position-apps{width:9%;left:86%;top:50%;}
  .position-play{width:13%;left:86%;top:86.5%;}
  /* The bottom row's tag rides the upper rim, the others the lower rim: always the wider gap. */
  .scene :is(.position-music,.position-play) .prize-tag{top:auto;bottom:calc(100% - 12px);}
  /* Some visits mirror the two columns (set by the shuffle in index.html). */
  .bubbles.is-mirrored :is(.position-reads,.position-projects,.position-music){left:86%;}
  .bubbles.is-mirrored :is(.position-games,.position-apps,.position-play){left:14%;}
}

/* Portrait tablets: the phone rows, at tablet scale. */
@media(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .scene{--label-l:22px;--label-m:17px;--label-s:14px;}
  .scene .person{--face:clamp(170px,24vw,260px);top:25%;}
  .scene{--l:22vw;--sm:13vw;--g:3.4vw;}
  .scene .person h1{max-width:none;font-size:clamp(34px,5.4vw,52px);}
  .scene .person>p{margin-top:14px;font-size:17px;}
  .scene .chill-toggle{margin-top:24px;}
  .position-music{width:13%;left:20%;top:90.5%;}
  .position-play{width:18%;left:50%;top:88%;}
  .position-apps{width:13%;left:80%;top:90.5%;}
  /* Beside the large centre station the tags lean outward, away from it. */
  .scene .position-games .prize-tag{left:auto;right:0;transform:none;}
  .scene .position-reads .prize-tag{left:0;transform:none;}
}

/* Phones and portrait tablets: a top row of small, large, small (tops aligned, the large one
   centred above the face) mirrors the lower row of small, medium, small. */
@media(max-width:600px),(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .position-projects{width:var(--l);left:50%;top:calc(var(--t,12px) + var(--l)/2);}
  .position-games,.position-reads{width:var(--sm);top:calc(var(--t,12px) + var(--sm)/2);}
  .position-games{left:calc(50% - var(--l)/2 - var(--g) - var(--sm)/2);}
  .position-reads{left:calc(50% + var(--l)/2 + var(--g) + var(--sm)/2);}
  /* In the top row the tag rides the upper rim, away from the face. */
  /* Top row: over the large centre station the tag sits above; beside the face it sits below. */
  .scene .position-projects .prize-tag{top:auto;bottom:calc(100% + 3px);}
  .scene :is(.position-games,.position-reads) .prize-tag{top:calc(100% + 4px);}
  .scene .position-music .prize-tag{left:0;transform:none;top:calc(100% + 4px);}
  .scene .position-apps .prize-tag{left:auto;right:0;transform:none;top:calc(100% + 4px);}
}

/* Short desktop windows keep their own compact layout; only the type gets firmer. */
@media(min-width:601px) and (max-height:650px){
  .scene{--label-l:inherit;--label-m:inherit;--label-s:inherit;}
  .position-reads{left:27%;top:82%;}
  .scene :is(.position-music,.position-apps) .prize-tag{top:auto;bottom:calc(100% - 12px);}
  .scene .person{--face:clamp(120px,32svh,200px);}
  .scene .person h1{max-width:none;font-size:clamp(22px,4.2svh,28px);}
  .scene .person>p{font-size:12px;}
}

/* Phones: two rows of three. Top: small, large, small (above). Bottom: small, medium, small,
   bottoms aligned, with clear air under the button. */
@media(max-width:600px){
  .scene{--s:clamp(60px,min(21.5vw,10svh),86px);--m:clamp(74px,min(27vw,12.4svh),108px);--l:clamp(76px,min(32vw,13.4svh),124px);--sm:var(--s);--g:clamp(12px,4.5vw,20px);--t:14px;--label-l:clamp(13px,4vw,16px);--label-m:clamp(12px,3.4vw,13.5px);--label-s:clamp(10.5px,2.9vw,11.5px);}
  .scene .person{--face:clamp(96px,min(42vw,19svh),170px);top:24%;width:calc(100% - 32px);}
  .scene .person h1{font-size:clamp(24px,min(7.6vw,3.9svh),34px);}
  .scene .person>p{margin-top:12px;font-size:clamp(13px,3.7vw,15px);}
  .scene .chill-toggle{margin-top:18px;}
  .position-music,.position-apps{width:var(--s);top:88%;}
  .position-music{left:15%;}.position-apps{left:85%;}
  .position-play{width:var(--m);left:50%;top:calc(88% + (var(--s) - var(--m))/2);}
  .scene .prize-tag{top:calc(100% - 12px);}
}
/* Shorter phones: the same rows, pulled together so nothing reaches the sound control. */
@media(max-width:600px) and (max-height:740px){
  .scene .person{--face:clamp(80px,min(34vw,15.5svh),130px);top:22%;}
  .scene .chill-toggle{margin-top:14px;}
  .position-music,.position-apps{top:87%;}
  .position-play{top:calc(87% + (var(--s) - var(--m))/2);}
  .scene .prize-tag{top:calc(100% - 9px);}
}
@media(max-width:600px) and (max-height:620px){
  .scene{--t:10px;--l:70px;}
  .scene .person{--face:64px;top:22.5%;}
  .scene .person h1{font-size:22px;}
  .scene .prize-tag{padding:5px 8px;font-size:10px;}
  .scene .position-projects .prize-tag{bottom:calc(100% - 10px);}
}

/* prize-tag-v47.js measures the settled layout and, when the slot's default side would touch a
   neighbour, the face, the text or the header, moves the tag to the first clean side. */
.scene .prize-tag[data-place=below]{top:calc(100% + 4px);bottom:auto;}
.scene .prize-tag[data-place=above]{top:auto;bottom:calc(100% + 3px);}
.scene .prize-tag[data-place]{margin-left:var(--tag-nudge,0px);}


/* collection-swipe-v50.css */
.collection-library.is-swiping>.collection-library-search,.collection-library.is-swiping>.collection-library-filters,.collection-library.is-swiping>.collection-library-results{display:none}
.collection-swipe{width:min(100%,920px);margin:0 auto;outline:none;color:#293744}
.swipe-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:clamp(10px,2vh,20px)}
.swipe-head>span{font-size:15px;color:#73818b;font-variant-numeric:tabular-nums}
.collection-swipe .swipe-head button{background:#fff9;padding:9px 16px;font-size:15px;min-height:44px}
.swipe-content{width:min(100%,620px);margin:auto}
.swipe-sources{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 14px;margin:0 0 12px;font-size:13px;color:#758691}
.swipe-more{position:relative}.swipe-more summary{cursor:pointer;padding:8px 0;text-decoration:underline;text-underline-offset:3px}.swipe-more>div{position:absolute;top:100%;right:0;z-index:5;display:flex;align-items:center;gap:8px;padding:10px;border-radius:14px;background:#f9fafaeF;box-shadow:0 8px 24px #42586c22;white-space:nowrap}.swipe-more:not([open])>div{display:none}
.swipe-file{position:relative;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.swipe-file:focus-within{outline:2px solid #6f96ad;outline-offset:4px;border-radius:3px}.swipe-file input{position:absolute;width:1px;height:1px;opacity:0}
.collection-swipe .swipe-sources button{min-height:36px;padding:5px 11px;border-radius:999px;font-size:13px;background:#fff9}.collection-swipe .swipe-sources button[hidden]{display:none}
.swipe-kind{display:flex;align-items:center;gap:6px}.swipe-kind select{border:1px solid #a2aeb43b;background:#fff9;color:inherit;border-radius:10px;padding:6px 8px;min-height:36px;font:inherit;font-size:14px}
.swipe-card{display:grid;grid-template-columns:minmax(140px,42%) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,42px);min-height:clamp(210px,34vh,380px);padding:clamp(18px,3vw,34px);box-sizing:border-box;border:1px solid #fff;border-radius:28px;background:linear-gradient(150deg,#ffffffdb,#ffffff78);box-shadow:0 18px 56px #657b9020;touch-action:pan-y;user-select:none;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.swipe-card.is-dragging{transition:none;cursor:grabbing}
.swipe-art{display:grid;place-items:center;min-width:0;min-height:0;height:min(28vh,300px);overflow:hidden}
.swipe-art img{display:block;width:100%;height:100%;min-height:0;max-width:100%;max-height:100%;object-fit:contain;border-radius:5px;filter:drop-shadow(0 16px 20px #2836412c)}
.swipe-art img[hidden],.swipe-art-fallback[hidden]{display:none}.swipe-art-fallback{color:#a3bbc2;font-size:56px}
.swipe-copy span{font-size:13px;text-transform:capitalize;letter-spacing:.04em;color:#778995}
.swipe-copy h3{font-size:clamp(26px,3.4vw,42px);line-height:1.08;letter-spacing:-.045em;margin:10px 0 12px;overflow-wrap:anywhere}
.swipe-copy p{font-size:clamp(15px,1.45vw,19px);line-height:1.4;color:#6e7d89;margin:0}
.swipe-origin{display:block;margin-top:12px;color:#87949c;font-size:13px;line-height:1.35}
.swipe-finished{grid-column:1/-1;text-align:center}.swipe-finished h3{font-size:clamp(28px,4vw,42px);letter-spacing:-.04em;margin:0 0 10px}.swipe-finished p{color:#6e7d89}
.swipe-actions{display:flex;justify-content:center;gap:14px;margin:20px 0 0}
.collection-swipe .swipe-actions button{min-width:clamp(135px,22vw,185px);min-height:60px;border-radius:999px;font-size:18px;background:#fff9;box-shadow:0 5px 18px #7c8fa215}
.collection-swipe .swipe-actions [data-swipe-yes]{background:#d6efe4;border-color:#bae1d0;color:#285549}
.collection-swipe .swipe-actions button span{font-size:20px}.collection-swipe .swipe-actions small{font-size:13px;opacity:.65;margin-left:4px}
.swipe-hint,.swipe-status{text-align:center;font-size:14px;color:#758691;line-height:1.45;margin:14px 0 0}.swipe-status:empty{display:none}
.swipe-kept{margin:20px auto 0;max-width:460px;border-top:1px solid #b4c3cb66}.swipe-kept summary{cursor:pointer;padding:16px 4px;font-size:15px}.swipe-kept summary span{color:#78908c;margin-left:4px}.swipe-kept>div{display:grid;gap:6px}.collection-swipe .swipe-kept button{text-align:left;background:#fff8;font-size:15px;display:flex;justify-content:space-between}.swipe-kept p{font-size:14px;color:#74838d}
@media(max-width:600px){.collection-library.is-swiping{width:100%;padding:8px 12px 24px;box-sizing:border-box}.swipe-head{margin-bottom:8px}.collection-swipe .swipe-head button{white-space:nowrap;font-size:13px;padding:8px 11px}.swipe-sources{gap:4px 10px;margin-bottom:8px}.swipe-card{min-height:0;grid-template-columns:1fr;gap:6px;text-align:center;padding:12px;border-radius:22px}.swipe-art{height:min(18vh,160px)}.swipe-copy h3{font-size:20px;line-height:1.1;margin:3px 0}.swipe-copy p{font-size:13px}.swipe-origin{margin-top:4px;font-size:12px}.swipe-actions{gap:10px;margin-top:8px}.collection-swipe .swipe-actions button{min-width:0;flex:1;min-height:48px;padding:7px 10px;white-space:nowrap}.swipe-hint{margin-top:6px}.swipe-kept{margin-top:8px}}
@media(min-width:601px) and (max-height:650px){.swipe-copy h3{font-size:28px}.swipe-copy p{font-size:16px}.swipe-card{padding:20px;min-height:210px}.swipe-actions{margin-top:10px}.swipe-head{margin-bottom:8px}}
@media(max-width:600px){body:has(.collection-swipe) .site-sound{visibility:hidden;pointer-events:none}}
@media(prefers-reduced-motion:reduce){.swipe-card{transition:none}}


/* collection-objects-v51.css */
/* v51: objects in the collection grid. Covers behave like the shelf's objects:
   a slight resting tilt, a lift that straightens on hover, a thin edge of light.
   Nothing here is needed to read a card; paused motion shows the plain grid. */
.collection-library .collection-library-grid .collection-library-card{--card-tilt:0deg;--card-rx:0deg;--card-ry:0deg;animation:collection-card-arrive 420ms cubic-bezier(.23,1,.32,1) both;animation-delay:var(--card-delay,0ms);}
@keyframes collection-card-arrive{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.collection-library .collection-library-grid .collection-library-card-art{position:relative;transform:perspective(900px) rotate(var(--card-tilt)) rotateX(var(--card-rx)) rotateY(var(--card-ry));transform-origin:50% 60%;transition:transform 480ms cubic-bezier(.23,1,.32,1);}
.collection-library .collection-library-grid .collection-library-card-art img{transition:filter 480ms cubic-bezier(.23,1,.32,1);}
.collection-library .collection-library-grid .collection-library-card-art:not(.has-image-fallback)::after{content:'';position:absolute;inset:0;border-radius:4px;pointer-events:none;border:1px solid #ffffff4d;background:linear-gradient(125deg,#ffffff2b,transparent 42%);}
.collection-library .collection-library-grid .collection-library-card[data-medium="book"] .collection-library-card-art:not(.has-image-fallback)::after{border-radius:2px 4px 4px 2px;background:linear-gradient(90deg,#0003,transparent 5%,#fff3 6%,transparent 9%),linear-gradient(125deg,#ffffff24,transparent 40%);}
.collection-library .collection-library-grid .collection-library-card.is-lit .collection-library-card-art{transition-duration:140ms;}
@media(hover:hover){
 .collection-library .collection-library-grid .collection-library-card:hover .collection-library-card-art,.collection-library .collection-library-grid .collection-library-card:focus-visible .collection-library-card-art{transform:perspective(900px) translateY(-6px) rotate(0deg) rotateX(var(--card-rx)) rotateY(var(--card-ry));}
 .collection-library .collection-library-grid .collection-library-card:hover .collection-library-card-art img,.collection-library .collection-library-grid .collection-library-card:focus-visible .collection-library-card-art img{filter:drop-shadow(0 24px 26px #273b3b24);}
 .collection-library .collection-library-grid .collection-library-card:hover strong{text-decoration:none;}
}
.motion-paused .collection-library .collection-library-grid .collection-library-card{animation:none;}
.motion-paused .collection-library .collection-library-grid .collection-library-card-art,.motion-paused .collection-library .collection-library-grid .collection-library-card-art img{transition:none;transform:none!important;filter:none;}
@media(prefers-reduced-motion:reduce){
 .collection-library .collection-library-grid .collection-library-card{animation:none;}
 .collection-library .collection-library-grid .collection-library-card-art,.collection-library .collection-library-grid .collection-library-card-art img{transition:none;transform:none!important;}
}


/* polish-collection-v54.css */
/* Collection objects retain their quick hover straightening. */
.collection-library .collection-library-grid .collection-library-card:is(:hover,:focus-visible) .collection-library-card-art{transition-duration:140ms}


/* collection-detail-v55.css */
/* Item details: one owner for artwork, reading hierarchy and player geometry.
   A poster stays a poster until the visitor chooses the video. */
.detail[data-collection-layout]{--collection-wall:#f2f4f6;--collection-ink:#283438;color:var(--collection-ink);background:var(--collection-wall)}
.detail[data-collection-layout=cinema]{--collection-wall:#11161d;--collection-ink:#eff1f5}
.detail[data-collection-layout] :is(.world-visual,.world-surface){background:radial-gradient(ellipse 70% 65% at 22% 40%,rgb(var(--ambient-a,130 150 170) / .1),transparent 74%),var(--collection-wall)}
.detail[data-collection-layout] :is(.room-world-volume,.world-atmosphere){visibility:hidden}
.detail[data-collection-layout] .world-surface::before,.detail[data-collection-layout] .world-surface::after{display:none}
/* Keep the travel source measurable, but retire its cloned bubble at rest. */
body[data-journey=world] .detail[data-collection-layout] .portal-glyph-source{visibility:hidden}
.detail[data-collection-layout] .world-toolbar{background:linear-gradient(var(--collection-wall),color-mix(in srgb,var(--collection-wall) 90%,transparent));color:var(--collection-ink)}
.detail[data-collection-layout] .world-toolbar :is(button,.world-category,.breadcrumb,.world-category span){color:var(--collection-ink)}
.detail[data-collection-layout] .world-stage{width:100%;max-width:none;padding-top:0}
.collection-detail{box-sizing:border-box;width:min(1120px,calc(100% - 80px));max-height:none;overflow:visible;margin:0 auto;padding:clamp(28px,5dvh,58px) 0 88px;color:inherit;text-align:left}
.collection-detail button,.collection-detail a{font:inherit;cursor:pointer}
.collection-detail button[hidden],.collection-detail [hidden]{display:none!important}
.collection-detail :is(button,a):focus-visible{outline:2px solid currentColor;outline-offset:5px}
.collection-detail-back{display:inline-flex;align-items:center;min-height:44px;margin:0 0 24px;padding:8px 0;border:0;background:transparent;color:inherit}
.collection-detail-composition{display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr);gap:clamp(36px,6vw,88px);align-items:center}
.collection-detail-stage{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;overflow:visible;box-sizing:border-box;justify-self:center}
.collection-detail-art{display:flex;justify-content:center;align-items:center;position:relative;inset:auto;width:100%;height:auto;min-width:0;min-height:0}
.collection-detail-art img{position:static;display:block;width:auto;height:auto;max-width:100%;max-height:min(560px,62dvh);min-width:0;min-height:0;object-fit:contain;border-radius:3px;filter:drop-shadow(0 20px 22px #24333b20)}
.collection-detail-book .collection-detail-stage,.collection-detail[data-art-shape=poster] .collection-detail-stage{max-width:340px}
.collection-detail-book .collection-detail-art img,.collection-detail[data-art-shape=poster] .collection-detail-art img{width:100%;height:auto;max-height:min(530px,60dvh)}
.collection-detail-copy{min-width:0;max-width:580px;color:inherit}
.collection-detail-medium{font-size:15px;line-height:1.4;letter-spacing:.015em;color:inherit;opacity:.62;margin:0 0 16px}
.collection-detail #detail-title{font-size:clamp(34px,4.1vw,60px);line-height:1.08;font-weight:550;letter-spacing:-.045em;text-wrap:balance;overflow-wrap:anywhere;margin:0 0 16px;color:inherit;max-width:100%}
.collection-detail-credit{font-size:clamp(19px,1.8vw,25px);line-height:1.4;color:inherit;opacity:.72;margin:0 0 26px}
.collection-detail-facts{display:flex;flex-wrap:wrap;gap:18px 32px;margin:0 0 26px}
.collection-detail-facts>div{min-width:0}
.collection-detail-facts dt{font-size:13px;line-height:1.4;opacity:.58;margin:0 0 5px}
.collection-detail-facts dd{font-size:17px;line-height:1.5;margin:0;text-wrap:pretty}
.collection-detail-note{margin:0 0 28px}
.collection-detail-note p{font-size:clamp(18px,1.45vw,21px);line-height:1.65;max-width:48ch;margin:0 0 16px;text-wrap:pretty}
.collection-detail-note p:last-child{margin-bottom:0}
.collection-detail-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px}
.collection-detail-actions:empty{display:none}
.collection-detail :is([data-library-play],[data-library-stop]){scroll-margin-block:24px 90px}
.collection-detail .collection-detail-play,.collection-detail .collection-detail-link{position:static;transform:none;display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:48px;box-sizing:border-box;padding:12px 19px;font-size:17px;line-height:1.3;border:1px solid #63768238;border-radius:28px;background:#ffffff70;color:inherit;text-decoration:none;box-shadow:none;transition:background .18s ease,border-color .18s ease}
.collection-detail[data-collection-layout=cinema] .collection-detail-play{background:#eef1f5;color:#17212b;border-color:transparent}
.collection-detail :is(.collection-detail-play,.collection-detail-link):hover{background:#ffffffb8;border-color:#63768270}
.collection-detail[data-collection-layout=cinema] .collection-detail-play:hover{background:#fff}
.collection-detail :is(.collection-detail-play,.collection-detail-link):active{transform:translateY(1px)}
.collection-detail[data-art-shape=landscape] .collection-detail-composition{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(28px,4vw,56px)}
.collection-detail[data-art-shape=landscape] .collection-detail-art{aspect-ratio:var(--detail-art-ratio,16/9);border-radius:10px;overflow:hidden;background:#10161e}
.collection-detail[data-art-shape=landscape] .collection-detail-art img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain;filter:none}
.collection-detail-music .collection-detail-stage,.collection-detail-podcast .collection-detail-stage{max-width:400px}
.collection-detail-music .collection-detail-art img,.collection-detail-podcast .collection-detail-art img{width:100%;border-radius:8px}
.collection-detail-object .collection-detail-stage,.collection-detail-article .collection-detail-stage{max-width:440px}
.collection-detail-object .collection-detail-art img,.collection-detail-article .collection-detail-art img{width:100%;max-height:480px}
.collection-detail-player{display:none}
.collection-detail.is-playing .collection-detail-composition{grid-template-columns:1fr;gap:28px;align-items:start}
.collection-detail.is-playing .collection-detail-stage{max-width:none;width:100%;aspect-ratio:16/9;min-height:0;overflow:hidden;border-radius:12px;background:#090d12}
.collection-detail.is-playing .collection-detail-art{display:none}
.collection-detail.is-playing .collection-detail-copy{max-width:780px}
.collection-detail.is-playing .collection-detail-player{display:block;position:absolute;inset:0;width:100%;height:100%;max-height:none}
.collection-detail-player iframe{display:block;width:100%;height:100%;border:0;background:#090d12}
.collection-detail-stop{position:absolute;z-index:2;top:12px;right:12px;min-height:44px;padding:10px 16px;border:1px solid #ffffff4d;border-radius:24px;background:#17212bef;color:#fff;font-size:15px}
.collection-detail-related{margin-top:64px;padding-top:28px;border-top:1px solid #87949e30}
.collection-detail-related h3{font-size:20px;font-weight:500;letter-spacing:-.02em;margin:0 0 24px}
.collection-detail-related>div{--collection-art-height:150px;display:flex;flex-wrap:wrap;gap:28px;align-items:start}
.collection-detail-related .collection-library-card{border:0;background:transparent;padding:0;color:inherit;text-align:left;font:inherit;cursor:pointer}
.collection-detail-art.has-image-fallback{min-height:200px;border:1px solid #87949e40;border-radius:8px;color:inherit}
.collection-detail:is(.collection-detail-music,.collection-detail-podcast).is-playing .collection-detail-composition{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center}
.collection-detail:is(.collection-detail-music,.collection-detail-podcast).is-playing .collection-detail-stage{max-width:520px;aspect-ratio:auto;height:360px}
.detail[data-collection-layout=cinema] .site-sound{color:#dfe4ea;border-color:#ffffff24;background:#161b23eb;box-shadow:0 4px 24px #0003}
.detail[data-collection-layout=cinema] .site-sound button[aria-pressed=true]{color:#10151c;background:#e9edf2}
@media(max-width:760px){
 .collection-detail{width:100%;padding:24px 20px 100px}
 .collection-detail-composition,.collection-detail[data-art-shape=landscape] .collection-detail-composition{display:flex;flex-direction:column;align-items:stretch;gap:30px}
 .collection-detail-stage{align-self:center;width:100%;max-width:340px}
 .collection-detail-book .collection-detail-stage,.collection-detail[data-art-shape=poster] .collection-detail-stage{max-width:220px}
 .collection-detail-art img,.collection-detail-book .collection-detail-art img,.collection-detail[data-art-shape=poster] .collection-detail-art img{max-height:340px}
 .collection-detail-book .collection-detail-art img,.collection-detail[data-art-shape=poster] .collection-detail-art img{max-height:28dvh}
 .collection-detail-music .collection-detail-stage,.collection-detail-podcast .collection-detail-stage{max-width:260px}
 .collection-detail[data-art-shape=landscape] .collection-detail-stage{max-width:none}
 .collection-detail #detail-title{font-size:clamp(30px,7.7vw,42px);letter-spacing:-.04em;margin-bottom:12px}
 .collection-detail-medium{font-size:14px;margin-bottom:10px}
 .collection-detail-credit{font-size:20px;margin-bottom:22px}
 .collection-detail-note p{font-size:18px;line-height:1.6}
 .collection-detail-facts{gap:16px 26px;margin-bottom:22px}
 .collection-detail-facts dd{font-size:16px}
 .collection-detail-actions{margin-top:22px}
 .collection-detail.is-playing .collection-detail-stage{max-width:none}
 .collection-detail-related{margin-top:44px}
 .collection-detail-related>div{--collection-art-height:130px;gap:24px 18px}
}
@media(prefers-reduced-motion:reduce){.collection-detail *{transition:none!important;scroll-behavior:auto!important}}
@media(prefers-contrast:more){.detail[data-collection-layout] :is(.world-visual,.world-surface){background:var(--collection-wall)}.collection-detail-medium,.collection-detail-credit,.collection-detail-facts dt{opacity:1}}
.collection-detail-related .collection-library-card{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;width:min(100%,calc(var(--collection-art-height,150px) * var(--collection-ratio,1)));min-width:0;overflow:visible}
.collection-detail-related .collection-library-card-art{position:relative;display:block;aspect-ratio:var(--collection-ratio,1);width:100%;height:auto;margin-bottom:12px;border-radius:4px;background:transparent;overflow:visible}
.collection-detail-related .collection-library-card-art img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;border-radius:4px;filter:drop-shadow(0 10px 12px #273b3b12)}
/* The shared HUD has stronger desktop selectors; keep every cinema control
   readable on its dark wall, including the switcher and shortcut hint. */
body>dialog.cohesive-world[data-room-mode][data-collection-layout=cinema] .world-toolbar :is(.world-switcher-toggle,.world-find,.world-keys){background:#ffffff0b;border-color:#ffffff2d;color:var(--collection-ink)}
body>dialog.cohesive-world[data-room-mode][data-collection-layout=cinema] .world-keys kbd{background:#ffffff12;color:inherit;border-color:#ffffff20}


/* chill-scene-v60.css */
/* Chill: the sun sinks into the sea, ported from the Zomernachtschool hero (see HOME-AURA.md). The scene is its own opaque layer that only exists while Chill is on,
   so it reads the same on any home background. chill.js measures the head and sets --horizon and --sun-x,
   so the sun sits just below the chin on every screen. Motion is slow, transform/opacity only, finite,
   and stops with reduced motion or the site's pause; every word on the page stays readable without it. */
.chill-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;isolation:isolate;
  --horizon:66%;--sun-x:50%;--sun:min(34vmin,300px);--sun-start:.5;--sun-end:1.04;--glint:min(20vmin,170px);}
body[data-chill=off] .chill-atmosphere{visibility:hidden;}
.chill-atmosphere>*{position:absolute;}
/* The evening starts orange; dusk only darkens the strip above the horizon, where labels take light ink (chill.js). */
.chill-horizon-sky{inset:0;background:linear-gradient(180deg,#ff9d3f 0%,#f0503c calc(var(--horizon) * .85),#c2344b calc(var(--horizon) * .97),#a62c4e var(--horizon),#a62c4e 100%);}
.chill-dusk{inset:0 0 calc(100% - var(--horizon)) 0;opacity:0;background:linear-gradient(180deg,#3b245400 0%,#3b245400 85%,#3b245466 93%,#2a0e33b8 100%);}
.chill-stars{inset:0;opacity:0;}
.chill-stars i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff3d8;box-shadow:0 0 4px #fff3d8;}
.chill-stars i:nth-child(1){left:31%;top:14%}.chill-stars i:nth-child(2){left:64%;top:9%}
.chill-horizon-light{inset:0;background:radial-gradient(ellipse 46% 28% at var(--sun-x) var(--horizon),#ffd23f66,#ff962d26 48%,#ff962d00 72%);}
.chill-sun{left:0;right:0;top:0;height:var(--horizon);overflow:hidden;}
.chill-sun-disc{position:absolute;left:var(--sun-x);bottom:0;width:var(--sun);height:var(--sun);margin-left:calc(var(--sun) / -2);border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#ffd23f,#ff6b1a 78%);box-shadow:0 0 90px 30px #ff962d8c;transform:translateY(calc(var(--sun-start) * 100%));}
.chill-horizon-water{left:0;right:0;top:var(--horizon);bottom:0;background:linear-gradient(180deg,#6e2154 0%,#43163f 55%,#2a0e33 100%);}
/* The sun's road on the water: a column of glinting stripes that fades as the sun goes under. */
.chill-reflection{left:calc(var(--sun-x) - var(--glint) / 2);top:var(--horizon);bottom:0;width:var(--glint);opacity:.55;filter:blur(1px);
  background:repeating-linear-gradient(180deg,#ffbe5a59 0 3px,#ffbe5a00 3px 14px);}
.chill-boat{left:var(--boat-x,26vw);top:calc(var(--horizon) - 19px);width:24px;height:18px;opacity:.75;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 18'%3E%3Cpath d='M12 1v12' stroke='%236f5a63' stroke-width='1'/%3E%3Cpath d='M12.5 2c4 3.5 6 7.5 6.5 11h-6.5z' fill='%23f5ddc5'/%3E%3Cpath d='M11.5 4c-3 3-4.5 6-5 9h5z' fill='%23efd3bd'/%3E%3Cpath d='M3 14h18l-2.6 3.5H5.6z' fill='%236f5a63'/%3E%3C/svg%3E");}
.chill-boat[data-place=none]{display:none;}
.chill-horizon-line{left:0;right:0;top:var(--horizon);height:2px;background:#ffd2828c;}

/* The clock of the evening: it starts when Chill starts and keeps going while it fades out again. Nothing loops forever. */
body:is([data-chill=entering],[data-chill=chilling],[data-chill=leaving]) .chill-sun-disc{animation:chill-sun-set 80s linear forwards;}
body:is([data-chill=entering],[data-chill=chilling],[data-chill=leaving]) .chill-dusk{animation:chill-dusk 90s ease-in-out 10s forwards;}
body:is([data-chill=entering],[data-chill=chilling],[data-chill=leaving]) .chill-stars{animation:chill-stars 30s ease-in 80s forwards;}
body:is([data-chill=entering],[data-chill=chilling],[data-chill=leaving]) .chill-reflection{animation:chill-reflect 80s linear forwards;}
body:is([data-chill=entering],[data-chill=chilling],[data-chill=leaving]) .chill-boat{animation:chill-drift 240s linear forwards;}
@keyframes chill-sun-set{from{transform:translateY(calc(var(--sun-start) * 100%))}to{transform:translateY(calc(var(--sun-end) * 100%))}}
@keyframes chill-dusk{from{opacity:0}to{opacity:1}}
@keyframes chill-stars{from{opacity:0}to{opacity:.5}}
@keyframes chill-reflect{from{opacity:.55}to{opacity:.06}}
@keyframes chill-drift{from{transform:translateX(0)}to{transform:translateX(8vw)}}

/* Chill stays where the visitor is, never travels with an open world. */
.detail-open .chill-atmosphere{visibility:hidden;}

/* The way in: a small setting sun beside "Stay up to date" (Shift+C on a keyboard). It only shows while
   the main button invites a sign-up; once someone has signed up, that button says "Chill for a bit" itself. */
.chill-sun-entry{display:none;position:relative;z-index:3;vertical-align:middle;align-items:center;justify-content:center;width:48px;height:48px;margin:0 0 0 10px;padding:0;
  border:1.5px solid #b0603b;border-radius:50%;background:#fff7ef;box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px #b0603b66;cursor:pointer;overflow:hidden;
  transition:transform 220ms cubic-bezier(.22,1,.36,1);}
.chill-toggle.is-stay-tuned+.chill-sun-entry{display:inline-flex;}
.chill-toggle,.chill-toggle.is-stay-tuned+.chill-sun-entry{vertical-align:bottom;}
.chill-sun-entry-disc{position:relative;display:block;width:24px;height:24px;margin-top:9px;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#ffc23a,#f2621c 80%);
  transition:transform 420ms cubic-bezier(.22,1,.36,1);}
.chill-sun-entry::after{content:'';position:absolute;left:9px;right:9px;top:30px;height:1.5px;border-radius:2px;background:#b0603b;}
@media(hover:hover){.chill-sun-entry:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #fff,0 12px 24px -10px #b0603b80;}.chill-sun-entry:hover .chill-sun-entry-disc{transform:translateY(5px);}}
.chill-sun-entry:active{transform:scale(.96);}
.chill-sun-entry:focus-visible{outline:3px solid #2f6fdb;outline-offset:3px;}
body.chill-mode .chill-sun-entry,.detail-open .chill-sun-entry{display:none!important;}
.arrival-pending .chill-sun-entry{opacity:0!important;}
body.party-on .chill-sun-entry{opacity:0;visibility:hidden;}

/* Back to my world: warm glass on the water, never across the horizon (chill.js sets the shift). */
body.chill-mode .chill-toggle{translate:0 var(--chill-pill-shift,0px);color:#6a3a26;background:#fff3e6e6;border-color:#e8b994;box-shadow:inset 0 1px 0 #fff,0 10px 26px -14px #a0563580;}
body.chill-mode .chill-toggle .chill-toggle-icon{color:#c4652f;}
body.chill-mode .chill-toggle kbd{color:#8a4f30;background:#fffaf4;border-color:#ebc6a6;box-shadow:none;}
@media(hover:none){body.chill-mode .chill-toggle:hover,body:not(.chill-mode) .chill-toggle:hover{box-shadow:none;}}

/* The page around the scene: deep ink that reads on the orange sky, glass that catches the evening. */
body.chill-mode .header :is(a,button,span,strong,small,kbd){color:#2b1005;}
body.chill-mode .bubble-label{color:#2b1005;}
body.chill-mode .bubble.is-low .bubble-label{color:#fff1e2;text-shadow:0 1px 6px #2a0e3366;}
body.chill-mode .bubble[data-panel]:not(:hover):not(:focus-visible){border-color:rgb(var(--tint) / .26);
  box-shadow:inset 0 2px 4px #fff1d4f0,inset 0 -5px 12px #82949d3d,inset -3px -2px 11px rgb(var(--tint) / .05),0 20px 30px -23px rgb(var(--tint) / .35),0 18px 26px -22px #554c611f;}
body.chill-mode .bubble[data-panel]::before{border-color:#fff1d4a6;box-shadow:inset -2px -3px 4px #fff1d499,inset 0 2px 4px rgb(var(--tint) / .18);}
body.chill-mode .bubble[data-panel]::after{background:linear-gradient(145deg,#fff8ea,#fff1d49c);}
body.chill-mode .optic-membrane{border-color:#fff1d4a6;}
body.chill-mode .optic-sheen{background:linear-gradient(160deg,#fff4dcd6,#fff4dc08);}

@media(max-width:950px){.chill-atmosphere{--sun:min(44vmin,300px);}}
@media(max-width:600px){
  .chill-atmosphere{--sun:min(50vw,196px);--sun-start:.44;--glint:min(30vw,120px);}
  .chill-stars,.chill-boat{display:none;}
  .chill-sun-entry{margin-left:8px;}
  body.chill-mode .chill-toggle{min-height:44px;padding:10px 18px;font-size:13px;}
}

/* Still, not gone: with reduced motion or the site's pause the evening is a picture. */
@media(prefers-reduced-motion:reduce){
  .chill-atmosphere *,.chill-sun-entry,.chill-sun-entry-disc{animation:none!important;transition:none!important;}
  .chill-sun-disc{transform:translateY(calc(var(--sun-start) * 100% + (var(--sun-end) - var(--sun-start)) * 30%));}
  .chill-dusk{opacity:.5;}.chill-reflection{opacity:.3;}.chill-stars{display:none;}
}
.motion-paused .chill-atmosphere *{animation-play-state:paused!important;}
/* The plain "Chill for a bit" button (for visitors already on the list) on the dark aura. */
:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle:not(.is-stay-tuned){color:#ece8f8;background:#ffffff17;border-color:#ffffff33;box-shadow:none;}
:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle:not(.is-stay-tuned) kbd{color:#c4bddb;}
:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle:not(.is-stay-tuned):hover{background:#ffffff24;}
/* Dark home: while the golden scene fades in or out, the page ink (dark in Chill, light on the aura) steps aside instead of reading dark on dark, and the aura is already back under the fading scene. Set by chill.js. */
body.chill-swap :is(.header,.bubble-label,.person h1,.person p,.footer-note,.hint,.footer-keys,.motion-toggle){opacity:0!important;transition:opacity .22s ease;}
body.chill-swap-in :is(.header,.bubble-label,.person h1,.person p,.footer-note,.hint,.footer-keys,.motion-toggle){animation:chill-swap-in .5s ease both;}
@keyframes chill-swap-in{from{opacity:0;}to{opacity:1;}}
body.chill-mode[data-chill=leaving] .ambient{opacity:1;transition:opacity .9s ease .25s;}
@media(prefers-reduced-motion:reduce){body.chill-swap-in :is(.header,.bubble-label,.person h1,.person p,.footer-note,.hint,.footer-keys,.motion-toggle){animation:none;}}


/* contrast-v63.css */
/* Contrast: text and controls in the (light) rooms that read below WCAG AA,
   measured on the rendered background in both themes. Last in the bundle, so it only sharpens
   colours; layout stays where its own stylesheet put it. */

/* Intro hint (light theme; it keeps its own fade, so the ink is dark enough at its opacity). */
:root[data-theme=light] .arrival-skip-hint{color:#26303a;}
:root:not([data-theme=light]) .arrival-skip-hint{color:#d6d1e8;}

/* Music room: track numbers, and the fade at the foot of the list stops before the last row on phones. */
.detail[data-category=music] .media-music .favorites-track:not([aria-pressed=true]) .favorites-number{color:#4f5a68;}
@media(max-width:700px){
  .detail[data-category=music] .media-music .favorites-track-list{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 16px),transparent);}
}

/* Collection: doorway arrows and the count on Browse collection. */
.detail[data-category=music] .collection-doorway-title>span{opacity:1;color:#5b6670;}
.detail[data-category=music] .collection-library-invitation button>span:first-child,.detail[data-category=music] .collection-library-invitation button span{opacity:1;color:#50585c;}

/* Library cards and count. */
.detail .collection-library-card-kind{opacity:1;color:#5b6670;}
.detail .collection-library-card-sub{opacity:1;color:#5b6670;}
.detail .collection-library-count{color:#50585c;}

/* Projects: the note beside the tabs, the inactive tabs, card notes and the link arrow. */
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note{color:#5d6873;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note a{text-decoration-color:#5d687366;}
body>dialog.cohesive-world[data-room-mode] .project-filters button[aria-pressed=false]{color:#56626d;}
body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node .showcase-node-note,
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption .showcase-node-note{color:#44505e;}
body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node.showcase-node-link .showcase-node-caption>strong>span{color:#46515c;opacity:1;}

/* Kept: filters and the privacy line. */
.kept-filters button:not([aria-pressed=true]){color:#4f6153;}
.kept-heading [data-kept-privacy]{color:#4f6153;}

/* Films room: the slash in 01 / 07. */
.cinema-room .media-film-number i{color:#8d98a9;}

/* Keys guide (always a light panel): separators, keys, the motion row. */
.explorer-shortcuts dt>span{color:#556070;}
.explorer-shortcuts kbd{color:#4f5f72;}
.explorer-motion-setting{color:#556070;}
#keyboard-guide .explorer-motion-setting .motion-toggle{color:#4f5f72;}

/* Stay up to date: an empty box needs a visible edge, the placeholder a readable grey. */
.stay-tuned{--check-line:#7d8b98;}
.stay-tuned input[type=email]::placeholder{color:#68737b;}

/* Sound: the mixer is a solid card (nothing shows through), dark next to the dark pill. */
.site-sound-mixer{background:#f8fafb;backdrop-filter:none;-webkit-backdrop-filter:none;}
:root:not([data-theme=light]) body>.site-sound .site-sound-mixer{color:#e8e5f2;border-color:#ffffff24;background:#16131f;color-scheme:dark;}
:root:not([data-theme=light]) body>.site-sound .site-sound-mixer input{accent-color:#ece9f4;}
:root:not([data-theme=light]) body>.site-sound .site-sound-mixer output{color:#c4bddb;}
:root:not([data-theme=light]) body>.site-sound .site-sound-peek{color-scheme:dark;}

/* Nothing ends under the sound pill: the films pager clears it on wide screens, galleries scroll past it on phones. */
@media(min-width:701px){.media-films .media-film-navigation{margin-right:236px;}}
@media(max-width:700px){
  .world-stage:has([data-gallery]) .showcase-garden{padding-bottom:104px;}
  .media-films .media-bottom{padding-bottom:84px;}
}
/* Light rooms: book/film detail meta and release credits sat under 4.5:1. Dark rooms override these in rooms-dark-v64-collection.css. */
.collection-detail-medium,.collection-detail-facts dt{opacity:.86;}
.made-release-credit{color:#4d5850;}
/* Light theme only. */
.detail[data-collection-layout] .world-toolbar .world-theme[aria-pressed=true]{color:#2a2347;}
:root[data-theme=light] .detail[data-category=music] :is(.made-release-credit,#made-releases-title){color:#4d5850;}
:root[data-theme=light] .detail input::placeholder{color:#5f6a72;}
:root[data-theme=light] .kept-count{color:#4f5f55;}
:root[data-theme=light] .header .header-linkedin{opacity:.82;}
:root[data-theme=light] .world-switcher-menu kbd{color:#56616d;}


/* rooms-dark-v64.css */
/* Rooms follow the theme. In dark (the default) a room sits in the same aura family as the home, but stiller:
   no moving light, dark glass cards, light ink. Light theme keeps the existing light rooms.
   Tokens from the aura (makossa, aura-v60.css); every rule below is scoped to :root:not([data-theme=light]). */
:root:not([data-theme=light]){
  --rd-base:#0d0b15;
  --rd-room:radial-gradient(120% 90% at 50% 118%,#221a3a 0%,#110e1c 55%,#09080f 100%);
  --rd-glow:radial-gradient(ellipse 40% 30% at 28% 30%,#5d4bd040,transparent 70%);
  --rd-violet:#5d4bd0;--rd-indigo:#2f3cae;--rd-lilac:#8a5fd0;--rd-silk:#c9b8ff;--rd-bronze:#b07a43;--rd-moss:#3a5a44;
  --rd-ink:#f1edfa;--rd-ui:#d4cee6;--rd-muted:#b9b2cf;
  --rd-glass:#16131fd9;--rd-glass-solid:#1a1626;--rd-line:#ffffff24;--rd-shadow:0 12px 32px #0007;
  --rd-hover:#ffffff1f;--rd-pressed:#ece9f4;--rd-pressed-ink:#16131f;
  --rd-primary:linear-gradient(135deg,#b8239a,#6a42c9);
}

/* ---- Room shell (H1). Film rooms (body.game-film-room), Play and app workspaces keep their own dark worlds. ---- */
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]){
  --world-ink:#ece8f8;--world-line:#ffffff24;--ink:#f1edfa;--quiet-ink:#b9b2cf;
  color:var(--rd-ink);color-scheme:dark;background:var(--rd-base);
}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-atmosphere{background:var(--rd-glow),var(--rd-room);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) :is(.world-atmosphere>span,.world-attention-light){opacity:.12;}
/* The portal surface the room grows from: dark glass instead of white glass, so no white disc on the way in. */
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-surface{background:transparent;border-color:transparent;box-shadow:none;}
/* Toolbar: back, world switcher and menu, keep, find and keys. */
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-toolbar{color:var(--rd-ui);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-back{color:var(--rd-ui);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-back:hover{color:#fff;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) :is(.world-switcher-toggle,.world-find,.world-keys,.world-keep){color:var(--rd-ui);background:#ffffff12;border-color:#ffffff2e;box-shadow:none;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) :is(.world-switcher-toggle,.world-find,.world-keys,.world-keep):hover{color:#fff;background:var(--rd-hover);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-keep[aria-pressed=true]{color:var(--rd-pressed-ink);background:var(--rd-pressed);border-color:transparent;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-toolbar kbd{color:var(--rd-ui);background:#ffffff14;border-color:#ffffff2e;box-shadow:none;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-switcher-menu{color:var(--rd-ui);background:var(--rd-glass-solid);border-color:var(--rd-line);box-shadow:var(--rd-shadow);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-switcher-menu .world-nav .mini-bubble{color:var(--rd-ui)!important;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-nav .mini-bubble::after{display:none;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-switcher-menu .world-nav .mini-bubble:hover{color:#fff!important;background:#ffffff14!important;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-switcher-menu .world-nav .mini-bubble[aria-pressed=true]{color:var(--rd-ink)!important;background:#ffffff1c!important;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .world-switcher-menu :is(a,button,span,small,kbd){border-color:#ffffff1f;}

/* ---- Sound pill inside a room (it moves into the dialog), with its volume peek, mixer and music question. ---- */
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound{color:#e8e5f2;border-color:#ffffff24;background:#16131fd9;box-shadow:0 4px 24px #0007;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound>button:hover{background:#ffffff14;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound>button[aria-pressed=true]{color:#16131f;background:#ece9f4;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound .site-sound-mix{color:#e8e5f2;background:#ffffff14;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound .site-sound-mix[aria-expanded=true]{color:#16131f;background:#ece9f4;}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]) .site-sound .site-sound-bars i{background:currentColor;}
:root:not([data-theme=light]) :is(body>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]),body) .site-sound .site-sound-peek{color:#e8e5f2;border-color:#ffffff24;background:#16131fee;box-shadow:0 12px 32px #0007;}
:root:not([data-theme=light]) :is(body>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace]),body) .site-sound .site-sound-peek output{color:#b9b2cf;}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound .site-sound-mixer{color:var(--rd-ui);background:var(--rd-glass-solid);border-color:var(--rd-line);box-shadow:var(--rd-shadow);color-scheme:dark;}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound .site-sound-mixer label>span{color:var(--rd-ui);}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound .site-sound-mixer output{color:var(--rd-muted);}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound :is(.site-sound-mixer,.site-sound-peek) input[type=range]{accent-color:#ece9f4;color-scheme:dark;}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound .site-sound-ask{color:var(--rd-ink);background:var(--rd-glass-solid);border-color:var(--rd-line);box-shadow:var(--rd-shadow);}
:root:not([data-theme=light]) body:not(.game-film-room) .site-sound .site-sound-ask p span{color:var(--rd-muted);}

/* ---- Shared dark glass for panels and dialogs (home and rooms). ---- */
/* Sound gate. */
:root:not([data-theme=light]) .site-sound-gate{color:var(--rd-ink);background:#17131ff2;border-color:var(--rd-line);box-shadow:0 24px 60px #000b;color-scheme:dark;}
:root:not([data-theme=light]) .site-sound-gate p span{color:var(--rd-muted);}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-orb{background:radial-gradient(circle at 32% 28%,#ffffff2e,#ffffff08 60%),#221c31;box-shadow:inset 0 0 0 1px #ffffff1f;}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-orb i{background:#ece9f4;}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-actions button{color:var(--rd-ui);background:transparent;border-color:#ffffff33;}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-actions button:first-child{color:var(--rd-pressed-ink);background:var(--rd-pressed);border-color:transparent;}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-actions button:hover{color:#fff;background:var(--rd-hover);}
:root:not([data-theme=light]) :is(.site-sound-gate,.site-sound-ask) .site-sound-ask-actions button:first-child:hover{color:var(--rd-pressed-ink);background:#fff;}
:root:not([data-theme=light]) .site-sound-gate::backdrop{background:#0d0b15c2;}

/* Keys guide. */
:root:not([data-theme=light]) #keyboard-guide{color:var(--rd-ui);background:#17131ff2;border-color:var(--rd-line);box-shadow:0 18px 50px #000a;color-scheme:dark;}
:root:not([data-theme=light]) #keyboard-guide :is(strong,summary,h2,h3){color:var(--rd-ink);}
:root:not([data-theme=light]) #keyboard-guide :is(dd,.explorer-current-context,.explorer-current-context *){color:var(--rd-ui);}
:root:not([data-theme=light]) #keyboard-guide :is(dt,dt span,.explorer-guide-note,.explorer-replay-status,.explorer-motion-setting>span,.explorer-motion-setting p){color:var(--rd-muted);}
:root:not([data-theme=light]) #keyboard-guide kbd,:root:not([data-theme=light]) #keyboard-guide dt>kbd{color:var(--rd-ui);background:#ffffff12;border-color:#ffffff2e;box-shadow:none;}
:root:not([data-theme=light]) #keyboard-guide :is(.explorer-guide-close,.explorer-replay-button){color:var(--rd-ui);}
:root:not([data-theme=light]) #keyboard-guide :is(.explorer-guide-close,.explorer-replay-button):hover{color:#fff;}
:root:not([data-theme=light]) #keyboard-guide .explorer-motion-setting .motion-toggle,:root:not([data-theme=light]) #keyboard-guide .explorer-motion-setting .motion-toggle span{color:var(--rd-ui);background:#ffffff12;border-color:#ffffff2e;box-shadow:none;}
:root:not([data-theme=light]) #keyboard-guide .explorer-motion-setting .motion-toggle span{background:transparent;}
:root:not([data-theme=light]) #keyboard-guide :is(footer,.explorer-motion-setting,.explorer-all-shortcuts,.explorer-current-context,hr){border-color:#ffffff1f;}

/* Find. */
:root:not([data-theme=light]) #discovery{color:var(--rd-ink);background:#17131f;border-color:var(--rd-line);box-shadow:0 24px 60px #000b;color-scheme:dark;}
:root:not([data-theme=light]) #discovery .discovery-search{border-color:#ffffff1f;}
:root:not([data-theme=light]) #discovery input{color:var(--rd-ink);}
:root:not([data-theme=light]) #discovery input::placeholder{color:var(--rd-muted);opacity:1;}
:root:not([data-theme=light]) #discovery :is(.discovery-intro,.discovery-intro span){color:var(--rd-ui);}
:root:not([data-theme=light]) #discovery :is(.discovery-intro small,.discovery-foot>span,.discovery-result-copy small,.discovery-result-copy span:not(:first-child)){color:var(--rd-muted);}
:root:not([data-theme=light]) #discovery .discovery-result{color:var(--rd-ink);}
:root:not([data-theme=light]) #discovery .discovery-result:is(:hover,:focus-visible,[aria-selected=true]){background:#ffffff14;}
:root:not([data-theme=light]) #discovery .discovery-result-enter{color:var(--rd-silk);}
:root:not([data-theme=light]) #discovery .discovery-close{color:var(--rd-ui);}
:root:not([data-theme=light]) #discovery .discovery-foot{background:#17131f;border-color:#ffffff1f;}
:root:not([data-theme=light]) #discovery .discovery-foot button,:root:not([data-theme=light]) #discovery .discovery-foot button span{color:var(--rd-silk);}
:root:not([data-theme=light]) #discovery kbd{color:var(--rd-ui);background:#ffffff12;border-color:#ffffff2e;box-shadow:none;}

/* Stay up to date form. */
:root:not([data-theme=light]) form.stay-tuned{--check-ink:#8a5fd0;--check-line:#8f87ad;color:var(--rd-ink);background:#17131ff5;border-color:var(--rd-line);box-shadow:0 20px 50px #000b;color-scheme:dark;}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-field input{color:var(--rd-ink);background:#0f0c18;border-color:#ffffff33;box-shadow:none;}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-field input::placeholder{color:var(--rd-muted);opacity:1;}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-row button[type=submit]{color:var(--rd-pressed-ink);background:var(--rd-pressed);}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-row button[type=submit]:hover{background:#fff;}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-row button:not([type=submit]){color:var(--rd-ui);background:transparent;}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-check,:root:not([data-theme=light]) form.stay-tuned .stay-tuned-check span{color:var(--rd-ui);}
:root:not([data-theme=light]) form.stay-tuned .stay-tuned-check input:not(:checked){background-color:#0f0c18;}
:root:not([data-theme=light]) form.stay-tuned :is(.stay-tuned-consent,.stay-tuned-consent a,.stay-tuned-status){color:var(--rd-muted);}

/* Your keeps (#music/kept). */
:root:not([data-theme=light]) .kept-shelf{color:var(--rd-ink);}
:root:not([data-theme=light]) .kept-shelf :is(h2,h3){color:var(--rd-ink);}
:root:not([data-theme=light]) .kept-shelf :is(.kept-heading p,.kept-empty p,.kept-search label){color:var(--rd-muted);}
:root:not([data-theme=light]) .kept-shelf :is(.kept-browse,.kept-empty button,.kept-feedback button){color:var(--rd-silk);}
:root:not([data-theme=light]) .kept-shelf .kept-search input{color:var(--rd-ink);background:#0f0c18;border-color:#ffffff33;}
:root:not([data-theme=light]) .kept-shelf .kept-filters button{color:var(--rd-ui);border-color:#ffffff2e;}
:root:not([data-theme=light]) .kept-shelf .kept-feedback{color:var(--rd-ui);}
:root:not([data-theme=light]) body:not(.game-film-room)>dialog.cohesive-world[data-room-mode]:not([data-route="play/wake"]):not([data-app-workspace])[data-collection-layout]:not([data-collection-layout=cinema]) .world-toolbar{background:linear-gradient(#110e1cf2,#110e1cd6);color:var(--rd-ui);}
:root:not([data-theme=light]) #discovery .discovery-result-copy :is(strong,b,span:first-child){color:var(--rd-ink);}
/* Theme button in the room bar and its row in the world menu (makossa, home-aura-v60.js): same dark glass as Find and Keys. */
:root:not([data-theme=light]) .detail .world-theme{color:var(--rd-ui);background:#ffffff12;border-color:#ffffff2e;box-shadow:none;}
:root:not([data-theme=light]) .detail .world-theme:hover{color:#fff;background:var(--rd-hover);}
:root:not([data-theme=light]) .detail .world-theme[aria-pressed=true]{color:var(--rd-pressed-ink);background:var(--rd-pressed);border-color:transparent;}
:root:not([data-theme=light]) .detail .world-switcher-menu .world-theme-menu{color:var(--rd-ui);border-color:#ffffff1f;}
:root:not([data-theme=light]) .detail .world-switcher-menu .world-theme-menu :is(span,small,output,b){color:var(--rd-muted);}
:root:not([data-theme=light]) .detail .world-switcher-menu .world-theme-menu:hover{color:#fff;background:#ffffff14;}
/* Kept filters: the pressed filter is a light pill with dark ink, the others light ink on the room. */
:root:not([data-theme=light]) .kept-shelf .kept-filters button[aria-pressed=true]{color:var(--rd-pressed-ink)!important;background:var(--rd-pressed);border-color:transparent;}
/* The category row at the foot of collection rooms (exploration-v33.css draws it on light paper). Cinema keeps its own. */
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema])[data-room-world] .world-footer .world-nav{background:var(--rd-glass-solid);border-color:var(--rd-line);box-shadow:var(--rd-shadow);}
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema])[data-room-world] .world-footer .mini-bubble{color:var(--rd-ui);}
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema])[data-room-world] .world-footer .mini-bubble:hover{color:#fff;background:#ffffff14;}
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema])[data-room-world] .world-footer .mini-bubble[aria-pressed=true]{color:var(--rd-pressed-ink);background:var(--rd-pressed);}
/* Kept needs light ink on the dark room. */
:root:not([data-theme=light]) .kept-open>strong{color:var(--rd-ink);}
:root:not([data-theme=light]) :is(.kept-count,.kept-open>span:last-child){color:var(--rd-muted);}
:root:not([data-theme=light]) #kept-query{color:var(--rd-ink);caret-color:var(--rd-silk);}
:root:not([data-theme=light]) #kept-query::placeholder{color:var(--rd-muted);}
/* The place name inside "Back to …" on the dark home header. */
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header .exploration-return strong{color:#f1edfa;}
/* Gallery rooms: the floor plane kept a white wash that lifted captions to mid-grey. */
:root:not([data-theme=light]) .detail[data-room-mode=gallery] .world-atmosphere::before{background:radial-gradient(ellipse at 50% 26%,rgb(var(--room-signal)/.10),transparent 64%);}
/* The open mixer button on the dark home (rooms already had this). */
:root:not([data-theme=light]) body>.site-sound .site-sound-mix[aria-expanded=true]{color:#16131f;background:#ece9f4;}
:root:not([data-theme=light]) #collection-library-search{border-color:#ffffff5c;}
/* The perspective floor of gallery rooms drew a light horizon arc behind the cards on the dark room; dark rooms go without it. */
:root:not([data-theme=light]) .detail[data-room-mode=gallery] .world-atmosphere::before{display:none;}


/* rooms-dark-v64-galleries.css */
/* Galleries (Projects with its tabs and Reads, Games, Apps) and the plain detail pages, in the dark rooms.
   Brand captures, posters and covers keep their own picture; the paper around them turns into dark glass.
   Tokens: rooms-dark-v64.css. Light theme is untouched (every rule is scoped to the dark theme). */

/* Gallery ink */
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery]{color:var(--rd-ink);}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects]{
  --pg-ink:var(--rd-ink);--pg-muted:var(--rd-muted);
  --pg-shadow:0 0 0 1px var(--rd-line),0 22px 40px -28px #000c;
}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node .showcase-node-caption>strong,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption>strong{color:var(--rd-ink);}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node .showcase-node-caption>strong>span,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node.showcase-node-link .showcase-node-caption>strong>span{color:var(--rd-muted);opacity:1;}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node .showcase-node-caption .showcase-node-note,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode][data-category=games] [data-gallery=games] .showcase-node .showcase-node-note,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node .showcase-node-caption .showcase-node-note{color:var(--rd-muted);}

/* Frames around the art: no paper shadow, a thin line of light instead */
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node-brand .showcase-node-art,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery=games] .showcase-node-art{box-shadow:0 0 0 1px var(--rd-line),0 18px 34px -24px #000d;}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] [data-cover-kind=square] .showcase-node-art>img{box-shadow:0 0 0 1px var(--rd-line),0 14px 26px -16px #000c;}
:root:not([data-theme=light]) .cohesive-world .app-film-card img{box-shadow:0 0 0 1px var(--rd-line);}

/* Hover and keyboard focus */
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:focus-visible,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects[data-gallery=projects] .showcase-node:focus-visible{outline:3px solid var(--rd-silk);outline-offset:6px;}
@media(hover:hover){:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] [data-gallery] .showcase-node:hover .showcase-node-caption>strong{color:#fff;}}

/* Project tabs and the note beside them */
:root:not([data-theme=light]) .cohesive-world .project-filters{background:var(--rd-glass);border-color:var(--rd-line);box-shadow:none;}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters button,
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .project-filters button[aria-pressed=false]{color:var(--rd-ui);}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .project-filters button[aria-pressed=true],
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-filters button[aria-pressed=true]{color:var(--rd-pressed-ink);background:var(--rd-pressed);box-shadow:none;}
@media(hover:hover){:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .project-filters button[aria-pressed=false]:hover{color:#fff;background:var(--rd-hover);}}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .project-filters button:focus-visible{outline:3px solid var(--rd-silk);outline-offset:2px;}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note{color:var(--rd-muted);}
:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note a{color:var(--rd-ui);text-decoration-color:#d4cee680;}
@media(hover:hover){:root:not([data-theme=light]) body>dialog.cohesive-world[data-room-mode] .showcase-home-projects .project-note a:hover{color:#fff;}}
:root:not([data-theme=light]) .showcase-garden-back{color:var(--rd-ui);border-bottom-color:var(--rd-line);}
@media(hover:hover){:root:not([data-theme=light]) .showcase-garden-back:hover{color:#fff;}}

/* Games: Play keeps the game's own colour; Watch video is dark glass */
:root:not([data-theme=light]) .showcase-action-watch{color:var(--rd-ink);background:var(--rd-glass);border-color:#ffffff3d;}
@media(hover:hover){:root:not([data-theme=light]) .showcase-action-watch:hover{background:#2a2438;}}
:root:not([data-theme=light]) .showcase-action:focus-visible{outline-color:var(--rd-silk);}
:root:not([data-theme=light]) .showcase-action-play{box-shadow:0 10px 26px -14px #000c,inset 0 0 0 1px #ffffff26;}

/* App previews (shown for an app without a film) */
:root:not([data-theme=light]) .app-preview-v34{color:var(--rd-ui);}
:root:not([data-theme=light]) .app-preview-v34 .ap-surface,
:root:not([data-theme=light]) .app-preview-v34:is(.ap-matchbar,.ap-spoor,.ap-koop) .ap-surface{background:var(--rd-glass-solid);border-color:var(--rd-line);box-shadow:var(--rd-shadow);}
:root:not([data-theme=light]) .app-preview-v34 .ap-caption,
:root:not([data-theme=light]) .app-preview-v34 .ap-tabs,
:root:not([data-theme=light]) .app-preview-v34 .ap-koop-row>span>span,
:root:not([data-theme=light]) .app-preview-v34 .ap-koop-footer{color:var(--rd-muted);}
:root:not([data-theme=light]) .app-preview-v34 .ap-tabs b{color:var(--rd-ink);}
:root:not([data-theme=light]) .app-preview-v34 .ap-koop-footer{border-top-color:var(--rd-line);}
:root:not([data-theme=light]) .app-preview-v34 .ap-switch{background:#4a4560;}
:root:not([data-theme=light]) .app-preview-v34 .ap-level{background:#4a4560;}

/* Plain detail pages (Bureaublad, De Trap, A different perspective): title, text and the story */
:root:not([data-theme=light]) .showcase-copy{--craft-line:var(--rd-line);color:var(--rd-ink);}
:root:not([data-theme=light]) .showcase-copy>h2,
:root:not([data-theme=light]) .showcase-copy #detail-title{color:var(--rd-ink);}
:root:not([data-theme=light]) .showcase-copy>p,
:root:not([data-theme=light]) .showcase-copy .showcase-instruction{color:var(--rd-muted);}
:root:not([data-theme=light]) .showcase-copy :is(.showcase-story,.showcase-case),
:root:not([data-theme=light]) .showcase-copy :is(.showcase-story,.showcase-case)>summary{color:var(--rd-ui);border-top-color:var(--rd-line);}
@media(hover:hover){:root:not([data-theme=light]) .showcase-copy :is(.showcase-story,.showcase-case)>summary:hover{color:#fff;}}
:root:not([data-theme=light]) .showcase-copy :is(.showcase-story p,.showcase-case p,.showcase-case-decisions p){color:var(--rd-muted);}
:root:not([data-theme=light]) .showcase-copy .showcase-case-start{color:var(--rd-ui);}
:root:not([data-theme=light]) .showcase-copy .showcase-case-decisions h3{color:var(--rd-ink);}
:root:not([data-theme=light]) .showcase-copy .showcase-case .showcase-case-boundary{color:var(--rd-muted);border-top-color:var(--rd-line);}
:root:not([data-theme=light]) .showcase-copy :is(.showcase-credits,.showcase-story-meta){color:var(--rd-muted);}
:root:not([data-theme=light]) .showcase-copy .showcase-credits a{color:var(--rd-ui);text-decoration-color:#d4cee680;}
:root:not([data-theme=light]) .showcase-copy summary:focus-visible{outline:3px solid var(--rd-silk);outline-offset:3px;border-radius:6px;}

/* Detail controls drawn for paper: De Trap's trailer button and the perspective reset */
:root:not([data-theme=light]) .showcase-podcast>button,
:root:not([data-theme=light]) .showcase-perspective-reset{color:var(--rd-ink);background:var(--rd-glass);border-color:#ffffff3d;}
:root:not([data-theme=light]) .showcase-podcast>p{color:var(--rd-muted);}
:root:not([data-theme=light]) .showcase-podcast>img{box-shadow:0 0 0 1px var(--rd-line),0 20px 45px #0008;}
@media(hover:hover){:root:not([data-theme=light]) :is(.showcase-podcast>button,.showcase-perspective-reset):hover{background:#2a2438;}}
:root:not([data-theme=light]) :is(.showcase-podcast>button,.showcase-perspective-reset):focus-visible{outline:3px solid var(--rd-silk);outline-offset:3px;}


/* rooms-dark-v64-collection.css */
/* Collection and Music rooms on the dark aura. The room shell, nav, sound pill and panels live in rooms-dark-v64.css;
   this file only colours what sits inside the Collection room: doorways, library, details, shelf, swipe, made and music (Your keeps is in rooms-dark-v64.css).
   Covers, posters and the cinema room keep their own picture. Light theme is untouched (every rule is scoped). */

/* Collection details and the shelf focus share the wall/ink tokens; the cinema layout is already dark. */
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema]){--collection-wall:#110e1c;--collection-ink:#f1edfa;}
:root:not([data-theme=light]) .collection-detail :is(.collection-detail-play,.collection-detail-link){border-color:#ffffff2e;background:#ffffff14;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .collection-detail :is(.collection-detail-play,.collection-detail-link):hover{border-color:#ffffff4d;background:#ffffff24;}
:root:not([data-theme=light]) .collection-detail[data-collection-layout=cinema] .collection-detail-play{background:var(--rd-pressed,#ece9f4);color:var(--rd-pressed-ink,#16131f);}
:root:not([data-theme=light]) .collection-detail-art.has-image-fallback{border-color:#ffffff26;}
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema]) :is(.collection-detail-medium,.collection-detail-credit,dt){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .collection-detail :is(.collection-detail-medium,.collection-detail-credit,.collection-detail-facts dt){opacity:1;}

/* Collection home: doorways, the three walks and Browse collection. */
:root:not([data-theme=light]) .detail[data-category=music] .collection-entrance{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .collection-doorway-title{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .collection-doorway-title>span{color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] .collection-cover{box-shadow:0 18px 28px -16px #000a;}
:root:not([data-theme=light]) .detail[data-category=music] .collection-library-invitation button{border-color:#ffffff2e;background:#ffffff12;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .collection-library-invitation button:hover{background:#ffffff22;}
:root:not([data-theme=light]) .detail[data-category=music] :is(.collection-library-invitation button>span:first-child,.collection-library-invitation button span){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] .exploration-path{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.exploration-path-copy>span,.exploration-path-arrow){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] .exploration-path-art img{box-shadow:0 9px 14px -8px #000b;}
:root:not([data-theme=light]) .detail[data-category=music] .exploration-path:focus-visible{outline-color:var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.media-portal){color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.media-portal>span:last-child,.media-heading p){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .collection-entrance ::selection{background:#5d4bd0;color:#fff;}

/* Library: search, filters, cards and the count. */
:root:not([data-theme=light]) .collection-library{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .collection-library button{border-color:#ffffff26;background:#ffffff12;}
:root:not([data-theme=light]) .collection-library :is(.collection-library-heading button,.collection-library-search-row button,.collection-library-search-row [data-library-random]){background:#ffffff12;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .collection-library button.collection-library-card{background:transparent;border-color:transparent;}
:root:not([data-theme=light]) .collection-library :is(.collection-library-heading p,.collection-library-search label){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .collection-library .collection-library-search input{border-color:#ffffff2e;background:#ffffff0d;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .collection-library .collection-library-search input::placeholder{color:#a49dbb;}
:root:not([data-theme=light]) .collection-library .collection-library-filters button{color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .collection-library .collection-library-filters button[aria-pressed="true"]{background:var(--rd-pressed,#ece9f4);border-color:transparent;color:var(--rd-pressed-ink,#16131f);box-shadow:none;}
:root:not([data-theme=light]) .collection-library .collection-library-filters button:hover{border-color:#ffffff4d;}
:root:not([data-theme=light]) .collection-library button:focus-visible,:root:not([data-theme=light]) .collection-library input:focus-visible{outline-color:var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail :is(.collection-library-card-kind,.collection-library-card-sub){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail .collection-library-count{color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .collection-library-card strong{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .collection-library-card-art.has-image-fallback{background:#1f1a2e;color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .detail[data-category=music] .media-heading .collection-library-door{border-color:#ffffff2e;background:#ffffff12;color:var(--rd-ui,#d4cee6);}

/* Shelf (Books & stories) and its focus view. */
:root:not([data-theme=light]) .collection-shelf{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) :is(.shelf-filters button,.shelf-filters button span,.shelf-hint,.shelf-object>span:last-child,.shelf-focus-number,.shelf-credit,.shelf-note,.shelf-thread>p,.shelf-focus-navigation button){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .shelf-filters button[aria-pressed=true]{background:var(--rd-pressed,#ece9f4);border-color:transparent;color:var(--rd-pressed-ink,#16131f);box-shadow:none;}
:root:not([data-theme=light]) .shelf-filters button[aria-pressed=true] span{color:#4a4560;}
:root:not([data-theme=light]) :is(.shelf-object,.shelf-focus){color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .shelf-focus-number i{color:#7d7698;}
:root:not([data-theme=light]) .shelf-thread>span{color:#e2c29a;}
:root:not([data-theme=light]) .shelf-thread>button{color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .shelf-thread>button>span{color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) :is(.shelf-thread>button:hover,.shelf-focus-navigation button:hover){color:#fff;}
:root:not([data-theme=light]) :is(.shelf-object-cover,.shelf-focus-cover){box-shadow:0 16px 26px -12px #000b;}
:root:not([data-theme=light]) .showcase-game-link{background:#ffffff12;border-color:#ffffff2e;color:var(--rd-ui,#d4cee6);box-shadow:none;}
:root:not([data-theme=light]) .showcase-game-link small{color:var(--rd-muted,#b9b2cf);}

/* Swipe through the collection. */
:root:not([data-theme=light]) .collection-swipe{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) :is(.swipe-head>span,.swipe-sources,.swipe-copy span,.swipe-copy p,.swipe-origin,.swipe-finished p,.swipe-hint,.swipe-status,.swipe-kept summary span,.swipe-kept p){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .collection-swipe :is(.swipe-head button,.swipe-sources button,.swipe-actions button,.swipe-kept button){background:#ffffff12;border-color:#ffffff26;color:var(--rd-ink,#f1edfa);box-shadow:none;}
:root:not([data-theme=light]) .collection-swipe .swipe-actions [data-swipe-yes]{background:#2f5a49;border-color:#4f8a72;color:#e6f6ef;}
:root:not([data-theme=light]) .swipe-kind select{border-color:#ffffff26;background:#ffffff12;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .swipe-more>div{background:#1a1626f2;box-shadow:var(--rd-shadow,0 12px 32px #0007);color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .swipe-card{border-color:#ffffff26;background:linear-gradient(150deg,#ffffff17,#ffffff08);box-shadow:var(--rd-shadow,0 12px 32px #0007);}
:root:not([data-theme=light]) .swipe-art-fallback{color:var(--rd-muted,#b9b2cf);}

/* Made by me: overview, KOOPIE and De Trap. */
:root:not([data-theme=light]) .detail[data-category=music] :is(.made-overview,.made-overview-heading h2,.made-release,.made-recording){color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.made-overview-heading p,.made-overview h3,.made-release>strong>span,.made-release-credit,.made-recording-copy>span,.made-recording-enter){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.made-release-art,.made-recording-art){box-shadow:0 24px 38px -22px #000c;}
:root:not([data-theme=light]) .detail[data-category=music] .made-overview button:focus-visible{outline-color:var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail[data-category=music] :is(.made-copy,.made-copy h2,.made-node,.made-heading h2){color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) :is(.made-heading p,.made-node>span:last-child,.made-art-credit,.made-story,.made-player-status,.made-times,.made-back,.made-follow-thread>span){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .made-intro{color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .made-follow-thread button{color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .made-back:hover{color:#fff;}
:root:not([data-theme=light]) .made-play{background:var(--rd-pressed,#ece9f4);border-color:transparent;color:var(--rd-pressed-ink,#16131f);box-shadow:0 8px 25px #0006;}
:root:not([data-theme=light]) .made-wave i{background:#ffffff2e;}
:root:not([data-theme=light]) .made-status{color:#e7b9a0;}
:root:not([data-theme=light]) .made-art{box-shadow:0 30px 60px -25px #000c;}
:root:not([data-theme=light]) .made-node-orb img{border-color:#ffffff40;}
:root:not([data-theme=light]) .made-seek:has(input:focus-visible){outline-color:var(--rd-silk,#c9b8ff);}

/* Music room: the sleeve still tints the room, but as a glow on the dark; the ink turns light and keeps a trace of the tone. */
:root:not([data-theme=light]) .detail[data-category=music] .media-music{color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music::before{background:
  radial-gradient(66% 92% at 18% 54%,color-mix(in srgb,var(--music-tone) 30%,transparent),transparent 74%),
  radial-gradient(46% 56% at 92% 6%,color-mix(in srgb,var(--music-tone) 10%,transparent),transparent 72%),
  linear-gradient(180deg,transparent,color-mix(in srgb,var(--music-tone) 7%,transparent));}
:root:not([data-theme=light]) .detail[data-category=music] .media-music>.media-heading h2{color:color-mix(in srgb,var(--music-tone) 55%,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music :is(.media-artist,.favorites-browser-heading>span){color:color-mix(in srgb,var(--music-tone) 14%,#f6f3fc);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music :is(.media-track-title,.media-player-caption,.media-timeline,.favorites-track-text small,.favorites-browser-heading small,.favorites-live-playlist,.favorites-snapshot,.favorites-no-results){color:color-mix(in srgb,var(--music-tone) 22%,#c4bdd8);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-progress-rail{background:#ffffff1f;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-progress-rail>span{background:color-mix(in srgb,var(--music-tone) 60%,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-sleeve{border-color:#ffffff26;background:#1a1626;box-shadow:0 56px 90px -34px #000c,0 14px 28px -14px #0009;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-browser-heading{border-bottom-color:color-mix(in srgb,var(--music-tone) 34%,transparent);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-browser-heading input{border-bottom-color:#ffffff38;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-browser-heading input::placeholder{color:#a49dbb;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-browser-heading input:focus-visible{border-bottom-color:var(--rd-silk,#c9b8ff);box-shadow:0 1px 0 var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track{box-shadow:inset 0 -1px 0 #ffffff12;color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track:hover{background:color-mix(in srgb,var(--music-tone) 14%,transparent);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track:focus-visible{outline-color:var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track:not([aria-pressed=true]) .favorites-number{color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track-text strong{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-track[aria-pressed=true] :is(.favorites-number,.favorites-track-text strong,.favorites-track>span:last-child){color:color-mix(in srgb,var(--music-tone) 55%,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .favorites-live-playlist:hover{color:#fff;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music :is(.media-icon-button,.media-live-button,.media-bottom,.media-bottom>button,.media-live-credit,.media-live-credit[href]){color:var(--rd-muted,#b9b2cf);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music :is(.media-icon-button:hover,.media-live-button:hover,.media-bottom>button:hover){color:#fff;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-play-button{border-color:transparent;background:var(--rd-pressed,#ece9f4);color:var(--rd-pressed-ink,#16131f);box-shadow:0 7px 18px #0007;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-play-button:hover{background:#fff;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-seek input::-webkit-slider-thumb{border-color:#16131f;background:color-mix(in srgb,var(--music-tone) 50%,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-seek input::-moz-range-thumb{border-color:#16131f;background:color-mix(in srgb,var(--music-tone) 50%,#f1edfa);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-artist-bubble>span{background:#1a1626;color:var(--rd-ui,#d4cee6);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-artist-bubble img{border-color:#ffffff40;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-artist-bubble[aria-pressed=true]{border-color:var(--rd-silk,#c9b8ff);}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-status{color:#e7b9b9;}
:root:not([data-theme=light]) .detail[data-category=music] .media-music .media-live-video{box-shadow:0 25px 40px -20px #000b;}

:root:not([data-theme=light]) .shelf-object strong{color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .detail[data-collection-layout]:not([data-collection-layout=cinema]) dt{opacity:1;}
:root:not([data-theme=light]) .shelf-focus .shelf-credit{opacity:1;}
:root:not([data-theme=light]) .shelf-focus :is(.shelf-focus-navigation button,.shelf-reading-toggle){background:#ffffff12;border-color:#ffffff2e;color:var(--rd-ink,#f1edfa);}
:root:not([data-theme=light]) .shelf-focus :is(.shelf-focus-navigation button,.shelf-reading-toggle):hover{background:#ffffff22;color:#fff;}


/* america-v65.css */
/* America mode (V65): see AMERICA-MODE.md. Everything hangs off body.america-mode and steps aside for
   Party, Chill, an open world and the entrance. Old Glory red #b22234, blue #3c3b6e. */

/* Behind the scene: wallpaper, scrim, rising bubbles and bunting. Never takes a pointer. */
.america-stage{position:fixed;inset:0;pointer-events:none;overflow:hidden;opacity:1;transition:opacity .6s ease;}
body:not(.america-mode) .america-stage,body:is(.party-on,.chill-mode,.detail-open) .america-stage,:root:is(.arrival-pending,.arrival-active) .america-stage{opacity:0;}
.america-walls,.america-wall,.america-scrim,.america-floats{position:absolute;inset:0;}
.america-walls{background:#14163a;}
.america-wall{opacity:0;transition:opacity 1.4s ease;}
.america-wall.is-shown{opacity:1;}
/* A light print grain over every wallpaper. */
.america-wall::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,#00000038 1px,transparent 1.6px) 0 0/6px 6px;mix-blend-mode:multiply;opacity:.55;}
.america-photo{width:100%;height:100%;object-fit:cover;filter:saturate(1.15) contrast(1.05);}

/* Warhol strip: the same face four times, each in its own duotone (multiply the light, lighten the dark). */
.america-pop{display:grid;grid-template-columns:1fr minmax(34%,1.1fr) 1fr;grid-template-rows:1fr 1fr;width:100%;height:100%;}
.america-pop>:nth-child(1){grid-area:1/1;}.america-pop>:nth-child(2){grid-area:2/1;}.america-pop>.america-gap{grid-area:1/2/3/3;}
.america-pop>:nth-child(4){grid-area:1/3;}.america-pop>:nth-child(5){grid-area:2/3;}
.america-gap{background:radial-gradient(circle,#ffffffb3 0 .8px,transparent 1.3px) 0 0/46px 41px,radial-gradient(circle,#ffffff66 0 .7px,transparent 1.2px) 23px 20px/46px 41px,#11133a;box-shadow:inset 0 0 60px #0a0c24;}
.america-tone{position:relative;overflow:hidden;background:var(--hi);isolation:isolate;}
.america-tone img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.3) brightness(1.08);mix-blend-mode:multiply;}
.america-tone::after{content:"";position:absolute;inset:0;background:var(--lo);mix-blend-mode:lighten;}
.america-tone-navy{--lo:#1f2266;--hi:#ff7a7a;}
.america-tone-red{--lo:#8c1022;--hi:#f6e7c8;}
.america-tone-sky{--lo:#10235a;--hi:#8fd8ff;}
.america-tone-gold{--lo:#3c3b6e;--hi:#ffd23f;}
.america-tone-pink{--lo:#2b1a5c;--hi:#ff8fc7;}
.america-tone-mint{--lo:#0f3b3a;--hi:#7ff0c8;}
.america-filters{position:absolute;width:0;height:0;}
.america-posters{display:grid;grid-template-columns:1fr minmax(34%,1.1fr) 1fr;width:100%;height:100%;}
.america-poster{position:relative;overflow:hidden;background:#112e51;}
.america-poster img{display:block;width:100%;height:100%;object-fit:cover;filter:url(#america-poster) contrast(1.05);}
.america-poster:last-child img{scale:-1 1;}
.america-posters>.america-gap{grid-area:auto;}
@media(max-aspect-ratio:4/5){.america-posters{grid-template-columns:1fr;grid-template-rows:30% 1fr 30%;}}
@media(max-aspect-ratio:4/5){
  .america-pop{grid-template-columns:1fr 1fr;grid-template-rows:27% 1fr 27%;}
  .america-pop>:nth-child(1){grid-area:1/1;}.america-pop>:nth-child(2){grid-area:1/2;}.america-pop>.america-gap{grid-area:2/1/3/3;}
  .america-pop>:nth-child(4){grid-area:3/1;}.america-pop>:nth-child(5){grid-area:3/2;}
}

/* The home controls dress up too, doing the same as always: the sun for Chill sets into stripes under a
   starry blue sky, and "Stay up to date" turns Old Glory red (white on #b22234 is 6.3:1). */
body.america-mode:not(.chill-mode) .chill-sun-entry{border-color:#ffffffb3;background:radial-gradient(circle,#fff 0 .7px,transparent 1.2px) 3px 2px/8px 7px,#3c3b6e;box-shadow:inset 0 1px 0 #ffffff40,0 8px 22px -8px #b2223499;}
body.america-mode:not(.chill-mode) .chill-sun-entry::after{left:0;right:0;top:29px;height:19px;border-radius:0;background:repeating-linear-gradient(#b22234 0 3px,#fff 3px 6px);}
:root:not([data-theme=light]) body.america-mode:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{color:#fff;background:#b22234;box-shadow:0 10px 28px #b2223459,0 0 0 1px #ffffff4d;}
:root:not([data-theme=light]) body.america-mode:not(.chill-mode) .scene .chill-toggle.is-stay-tuned:hover{background:#c42a3e;}

/* Labels, the face and the header stay readable on any wallpaper. */
body.america-mode:not(.chill-mode):not(.party-on) .person :is(h1,p){text-shadow:0 0 2px #0a0c24,0 1px 3px #0a0c24,0 2px 14px #0a0c24e6,0 0 34px #0a0c24b3;}
:root:not([data-theme=light]) body.america-mode:not(.mood-matrix):not(.chill-mode):not(.party-on) .scene .person p{color:#f3f1fb;}
.america-scrim{background:radial-gradient(ellipse 34% 46% at 50% 50%,#0b0d26e0,#0b0d26a6 55%,#0b0d2626 100%),linear-gradient(#0a0c24b3,#0a0c2400 22%,#0a0c2400 74%,#0a0c24bf);}
@media(max-aspect-ratio:4/5){.america-scrim{background:radial-gradient(ellipse 62% 30% at 50% 52%,#0b0d26e6,#0b0d26b3 55%,#0b0d2626 100%),linear-gradient(#0a0c24b3,#0a0c2400 20%,#0a0c2400 76%,#0a0c24bf);}}

.america-floats{overflow:hidden;}
.america-float{position:absolute;bottom:calc(var(--size) * -2.4);width:var(--size);height:var(--size);display:grid;place-items:center;will-change:transform;}
.america-float::after{content:"";position:absolute;left:50%;top:92%;width:1.5px;height:calc(var(--size) * 1.1);background:linear-gradient(#f6efe2cc,#f6efe200);border-radius:1px;}
.america-float>*{display:block;}
.america-float i{font-style:normal;font-size:var(--size);line-height:1;filter:drop-shadow(0 3px 4px #0a0c2480);}
.america-float img{width:82%;height:82%;border-radius:50%;object-fit:cover;}
.america-float.is-popped{transition:scale .22s ease,opacity .22s ease;scale:1.35;opacity:0;}

.america-bunting{position:absolute;left:0;right:0;top:64px;}
.america-bunting svg{display:block;overflow:visible;}
.america-rope{fill:none;stroke:#f7f4eeb3;stroke-width:1.5;}
.america-pennant{transform:translate(var(--x),var(--y));}
.america-pennant>*{transform-box:view-box;transform-origin:0 0;animation:america-sway 2.8s ease-in-out var(--d) infinite alternate;}
@keyframes america-sway{from{rotate:-5deg;}to{rotate:5deg;}}

/* In front: countdown, credit line, stickers, pops and the Lubach card. Only those take a pointer. */
.america-front{position:fixed;inset:0;z-index:60;pointer-events:none;transition:opacity .4s ease;}
body:is(.party-on,.chill-mode,.detail-open) .america-front,:root:is(.arrival-pending,.arrival-active) .america-front{opacity:0;visibility:hidden;}
body:not(.america-mode) .america-front{opacity:0;}

.america-countdown{position:absolute;left:50%;top:132px;translate:-50% 0;display:flex;align-items:center;gap:14px;padding:10px 18px 10px 14px;border:1px solid #ffffff2e;border-radius:18px;color:#fff;background:#14163ad1;box-shadow:0 12px 30px #0a0c2459;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);white-space:nowrap;}
.america-countdown-body{display:grid;gap:2px;}
.america-countdown-label{font:600 11px/1.2 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#ffd23f;}
.america-countdown-time{display:flex;align-items:baseline;gap:3px;font:400 24px/1.1 Portfolio Bungee,system-ui,sans-serif;font-variant-numeric:tabular-nums;}
.america-countdown-time small{font:600 12px/1 Portfolio Hanken,system-ui,sans-serif;color:#d9dcf2;margin-right:7px;}
.america-countdown-time small:last-child{margin-right:0;}
.america-today{font-weight:400;}
.america-countdown-short{display:none;}
.america-countdown.is-compact{gap:8px;padding:4px 12px 4px 6px;border-radius:12px;}
.america-countdown.is-compact .america-countdown-body{display:flex;align-items:baseline;gap:7px;}
.america-countdown.is-compact .america-countdown-label{display:none;}
.america-countdown.is-compact .america-countdown-short{display:inline;font:600 12px/1 Portfolio Hanken,system-ui,sans-serif;color:#ffd23f;}
.america-countdown.is-compact .america-countdown-time{font-size:15px;}
.america-countdown.is-compact .america-countdown-time small{font-size:10px;margin-right:4px;}
.america-countdown.is-compact .america-flag{width:30px;height:20px;}
.america-countdown.is-compact .america-flag i{background-size:30px 20px;background-position:calc(var(--i) * -3px) 0;}
.america-flag{display:flex;width:54px;height:36px;flex:none;filter:drop-shadow(0 2px 4px #0006);}
.america-flag i{flex:1;background:var(--america-flag) no-repeat;background-size:54px 36px;background-position:calc(var(--i) * -5.4px) 0;animation:america-wave 1.5s ease-in-out calc(var(--i) * -.15s) infinite alternate;}
@keyframes america-wave{from{translate:0 -2px;filter:brightness(.86);}to{translate:0 2px;filter:brightness(1.08);}}

.america-credit{position:absolute;left:50%;bottom:8px;translate:-50% 0;max-width:calc(100vw - 32px);margin:0;padding:3px 10px;border-radius:99px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 12px/1.5 Portfolio Hanken,system-ui,sans-serif;color:#eef0fa;background:#0a0c24e6;box-shadow:0 0 0 1px #ffffff1a;pointer-events:auto;}
.america-credit a{color:inherit;text-decoration:underline;text-decoration-color:#ffffff59;text-underline-offset:2px;}
.america-credit a:hover{text-decoration-color:currentColor;}
.america-credit.is-wrapped{bottom:auto;white-space:normal;text-align:center;line-height:1.35;border-radius:10px;width:max-content;}

.america-sticker{position:absolute;margin:0;padding:6px;border:0;border-radius:16px;background:#fff;box-shadow:0 10px 24px #0a0c2459,0 1px 0 #0000001a;rotate:var(--tilt);cursor:pointer;pointer-events:auto;animation:america-slap .46s cubic-bezier(.2,1.5,.4,1) both;transition:rotate .2s ease,scale .2s ease;}
.america-sticker:hover{rotate:0deg;scale:1.04;}
.america-sticker:focus-visible{outline:3px solid #ffd23f;outline-offset:3px;}
.america-sticker img{display:block;border-radius:11px;object-fit:cover;background:#3c3b6e;}
.america-sticker.is-word span{display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:11px;font:400 19px/1.1 Portfolio Bungee,system-ui,sans-serif;color:#fff;background:#3c3b6e;box-shadow:inset 0 0 0 2px #b22234;white-space:nowrap;}
.america-sticker.is-word i{font-style:normal;font-size:24px;}
.america-sticker.is-leaving{animation:america-peel .42s ease-in forwards;pointer-events:none;}
@keyframes america-slap{from{scale:1.6;opacity:0;}to{scale:1;opacity:1;}}
@keyframes america-peel{to{scale:.7;translate:0 -14px;rotate:calc(var(--tilt) + 14deg);opacity:0;}}
@media(max-width:600px){.america-sticker.is-word span{font-size:15px;padding:8px 12px;}.america-sticker.is-word i{font-size:19px;}}

.america-burst{position:absolute;width:0;height:0;}
.america-burst b{position:absolute;left:0;top:0;translate:-50% -50%;font:400 22px/1 Portfolio Bungee,system-ui,sans-serif;color:#fff;text-shadow:0 2px 0 #b22234,0 4px 12px #0a0c2499;white-space:nowrap;animation:america-word .9s ease-out forwards;}
.america-burst i{position:absolute;left:-4px;top:-4px;width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1px #0a0c2433;animation:america-spark .8s cubic-bezier(.15,.7,.3,1) forwards;}
@keyframes america-word{from{scale:.6;opacity:0;}20%{scale:1.1;opacity:1;}to{translate:-50% -170%;opacity:0;}}
@keyframes america-spark{from{transform:rotate(var(--a)) translateX(0);}to{transform:rotate(var(--a)) translateX(var(--r));opacity:0;}}

.america-lubach{position:absolute;left:16px;bottom:16px;display:grid;grid-template-columns:112px 1fr 28px;align-items:center;gap:12px;width:min(340px,calc(100vw - 32px));padding:8px;border:1px solid #ffffff2e;border-radius:18px;color:#fff;background:#14163ae0;box-shadow:0 14px 34px #0a0c2466;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;translate:0 calc(100% + 24px);opacity:0;transition:translate .5s cubic-bezier(.2,1,.3,1),opacity .3s ease,width .35s ease;}
.america-lubach.is-shown{translate:0 0;opacity:1;}
.america-lubach-play{position:relative;display:block;width:112px;aspect-ratio:16/9;padding:0;border:0;border-radius:11px;overflow:hidden;background:#000;cursor:pointer;}
.america-lubach-play img{display:block;width:100%;height:100%;object-fit:cover;}
.america-lubach-play span{position:absolute;inset:0;margin:auto;width:34px;height:24px;border-radius:7px;background:#b22234;}
.america-lubach-play span::after{content:"";position:absolute;left:13px;top:6px;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;}
.america-lubach-play:focus-visible,.america-lubach-close:focus-visible{outline:2px solid #ffd23f;outline-offset:2px;}
.america-lubach-text{display:grid;gap:3px;min-width:0;}
.america-lubach-text strong{font:700 14px/1.25 Portfolio Hanken,system-ui,sans-serif;}
.america-lubach-text small{font:500 12px/1.3 Portfolio Hanken,system-ui,sans-serif;color:#d9dcf2;}
.america-lubach-close{align-self:start;width:28px;height:28px;padding:0;border:0;border-radius:50%;font:400 20px/1 system-ui,sans-serif;color:#fff;background:#ffffff1a;cursor:pointer;}
.america-lubach-close:hover{background:#ffffff33;}
.america-lubach-badge{display:none;}
.america-lubach.is-badge{grid-template-columns:1fr;width:46px;height:46px;padding:0;border-radius:50%;}
.america-lubach.is-badge>:not(.america-lubach-badge){display:none;}
.america-lubach.is-badge .america-lubach-badge{display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;border-radius:50%;font-size:22px;background:transparent;cursor:pointer;}
.america-lubach.is-badge .america-lubach-badge:focus-visible{outline:2px solid #ffd23f;outline-offset:2px;}
.america-lubach.is-playing{grid-template-columns:1fr 28px;width:min(430px,calc(100vw - 32px));}
.america-lubach.is-playing iframe{grid-column:1/-1;grid-row:2;width:100%;aspect-ratio:16/9;border:0;border-radius:11px;background:#000;}
.america-lubach.is-playing .america-lubach-text{grid-column:1;grid-row:1;}
.america-lubach.is-playing .america-lubach-close{grid-column:2;grid-row:1;}
@media(max-width:600px){
  .america-lubach{bottom:74px;grid-template-columns:88px 1fr 28px;}
  .america-lubach.is-badge{left:14px;bottom:14px;}
  .america-lubach-play{width:88px;}
  .america-credit{bottom:0;font-size:11px;padding:2px 9px;}
  .america-lubach.is-playing{top:calc(var(--america-header,80px) + 6px);bottom:auto;left:12px;right:12px;width:auto;}
}

@media(prefers-reduced-motion:reduce){
  .america-wall{transition:opacity .3s linear;}
  .america-pennant>*,.america-flag i{animation:none;}
  .america-sticker,.america-sticker.is-leaving,.america-burst b{animation:none;}
  .america-burst i{display:none;}
  .america-lubach{transition:opacity .2s linear;translate:0 0;}
}
body.motion-paused :is(.america-pennant>*,.america-flag i){animation-play-state:paused;}

/* V65.3: fireworks and smoke behind the bubbles, a sparkler in front, the eagle, Uncle Sam's hat,
   a star in the wordmark and red, white and blue rims on the bubbles. */
.america-sky,.america-sparkler{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.america-eagle{position:absolute;left:0;top:0;margin:-42px 0 0 -42px;font-size:84px;line-height:1;will-change:transform;filter:drop-shadow(0 6px 10px #0a0c2466);}
.america-eagle[hidden]{display:none;}
.america-eagle i{display:block;font-style:normal;animation:america-flap .34s ease-in-out infinite alternate;}
.america-eagle.is-right i{rotate:y 180deg;}
@keyframes america-flap{from{scale:1 .84;}to{scale:1 1.05;}}
.america-hat{position:absolute;left:15.9%;top:-24.8%;width:66%;aspect-ratio:200/160;pointer-events:none;transform-origin:50% 87.5%;rotate:-9deg;filter:drop-shadow(0 5px 6px #0a0c2459);animation:america-hat-drop .9s cubic-bezier(.3,1.45,.5,1) both;}
.america-hat svg{display:block;width:100%;height:100%;}
@keyframes america-hat-drop{from{translate:0 -140%;rotate:-34deg;opacity:0;}60%{opacity:1;}to{translate:0 0;rotate:-9deg;opacity:1;}}
body:is(.party-on,.chill-mode) .america-hat,:root:is(.arrival-pending,.arrival-active) .america-hat{display:none;}
body.america-mode:not(.chill-mode) .wordmark span{font-size:0;}
body.america-mode:not(.chill-mode) .wordmark span::after{content:"\2605";display:inline-block;margin-left:.08em;font-size:15px;color:#ff4155;vertical-align:.32em;}
body.america-mode:not(.party-on):not(.chill-mode) .bubble:not(:focus-visible){outline:2px solid var(--america-rim,#ffffffb3);outline-offset:4px;}
body.america-mode .bubble-position:nth-child(3n+1) .bubble{--america-rim:#ff4155c7;}
body.america-mode .bubble-position:nth-child(3n) .bubble{--america-rim:#6d86ffc7;}
@media(max-width:600px){.america-eagle{font-size:56px;margin:-28px 0 0 -28px;}}
@media(prefers-reduced-motion:reduce){.america-hat{animation:none;}.america-eagle i{animation:none;}}

/* One line at the bottom of the scene: what it is here for. */
.america-note{position:absolute;left:50%;bottom:24px;translate:-50% 0;width:max-content;max-width:calc(100vw - 32px);margin:0;padding:6px 14px;border-radius:99px;font:600 13px/1.4 Portfolio Hanken,system-ui,sans-serif;color:#f4f2fb;background:#0a0c24e6;box-shadow:0 0 0 1px #ffffff1f;text-align:center;}


/* world-v66.css */
/* Travel (V66): the header button, the picker and the chill countries. See WORLD-MODE.md.
   America keeps its own look in america-v65.css; the countries stay soft and calm. */

.travel-button{display:inline-grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #bcc9d35c;border-radius:50%;color:#6a7488;background:#ffffff40;box-shadow:inset 0 1px 0 #fff;cursor:pointer;transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease;}
.travel-button svg{width:19px;height:19px;}
@media(hover:hover) and (pointer:fine){.travel-button:hover{color:#2a2347;background:#ffffffa6;}}
.travel-button-flag{font-size:19px;line-height:1;}
:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools .travel-button{color:#e8e5f2;background:#ffffff0f;border-color:#ffffff29;box-shadow:none;}
@media(hover:hover) and (pointer:fine){:root:not([data-theme=light]) body:not(.mood-matrix):not(.chill-mode) .header-tools .travel-button:hover{color:#fff;background:#ffffff1f;}}
body .header-tools .travel-button[aria-pressed=true]{background:#ffffff26;border-color:#ffffff73;}
body .header-tools .travel-button.is-america[aria-pressed=true]{background:#b22234;border-color:#ffffff59;}
.travel-button:focus-visible{outline:2px solid #ffd23f;outline-offset:2px;}
@media(max-width:600px){.travel-button{width:34px;height:34px;border-color:transparent;background:transparent;box-shadow:none;}}

.travel-picker{position:fixed;z-index:90;width:min(460px,calc(100vw - 24px));max-height:calc(100vh - 100px);overflow-y:auto;padding:14px;border:1px solid #ffffff26;border-radius:20px;color:#f3f1fb;background:#15173a;box-shadow:0 22px 50px #05061466;translate:0 -6px;transition:translate .22s cubic-bezier(.2,1,.3,1);}
.travel-picker.is-open{translate:0 0;}
.travel-picker[hidden]{display:none;}
.travel-picker-title{margin:2px 4px 10px;font:600 11px/1.2 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#c9c4e2;}
.travel-picker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.travel-chip{display:grid;justify-items:center;gap:2px;min-height:76px;padding:9px 6px 8px;border:1px solid #ffffff1f;border-radius:14px;color:inherit;background:#ffffff0d;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,transform .18s ease;}
@media(hover:hover) and (pointer:fine){.travel-chip:hover{background:#ffffff1f;transform:translateY(-1px);}}
.travel-chip:focus-visible,.travel-home:focus-visible{outline:2px solid #ffd23f;outline-offset:2px;}
.travel-chip[aria-pressed=true]{border-color:#ffffffa6;background:#ffffff26;}
.travel-chip.is-america{background:linear-gradient(135deg,#b2223433,#3c3b6e4d);}
.travel-chip-flag{font-size:24px;line-height:1.1;}
.travel-chip-name{font:600 13px/1.2 Portfolio Hanken,system-ui,sans-serif;}
.travel-chip small{font:500 11px/1.2 Portfolio Hanken,system-ui,sans-serif;color:#b9b3d3;}
.travel-home{display:block;width:100%;margin-top:10px;padding:9px;border:1px solid #ffffff26;border-radius:12px;font:600 13px/1.2 Portfolio Hanken,system-ui,sans-serif;color:#f3f1fb;background:transparent;cursor:pointer;}
@media(hover:hover) and (pointer:fine){.travel-home:hover{background:#ffffff14;}}
.travel-home[hidden]{display:none;}

/* The country room, behind the scene and never taking a pointer. */
.travel-stage{position:fixed;inset:0;pointer-events:none;overflow:hidden;transition:opacity .9s ease;}
.travel-stage.is-leaving,.travel-front.is-leaving{opacity:0;}
body:is(.party-on,.chill-mode,.detail-open) .travel-stage,:root:is(.arrival-pending,.arrival-active) .travel-stage{opacity:0;}
.travel-walls,.travel-wall,.travel-scrim,.travel-motes{position:absolute;inset:0;}
.travel-walls{background:#10122e;}
.travel-wall{opacity:0;transition:opacity 2s ease;overflow:hidden;}
.travel-wall.is-shown{opacity:1;}
.travel-wall img{display:block;width:100%;height:100%;object-fit:cover;}
/* A photo drifts a few percent over half a minute; painted frames stay put so their calm middle stays put. */
.travel-wall img.is-photo{filter:saturate(1.08) contrast(1.02);animation:travel-drift 32s ease-in-out infinite alternate;}
@keyframes travel-drift{from{transform:scale(1.04) translate(0,0);}to{transform:scale(1.12) translate(var(--drift-x),var(--drift-y));}}
/* Warm evening light and a quiet middle for the face, the headline and the buttons. */
.travel-scrim{background:radial-gradient(ellipse 36% 46% at 50% 50%,#0d0f2ac7,#0d0f2a80 55%,#0d0f2a1f 100%),linear-gradient(#0d0f2a99,#0d0f2a00 20%,#0d0f2a00 76%,#0d0f2aa6);}
.travel-scrim::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 100%,var(--travel-tint),transparent 70%);mix-blend-mode:soft-light;opacity:.55;}
@media(max-aspect-ratio:4/5){.travel-scrim{background:radial-gradient(ellipse 64% 32% at 50% 52%,#0d0f2ad1,#0d0f2a94 55%,#0d0f2a1f 100%),linear-gradient(#0d0f2a99,#0d0f2a00 18%,#0d0f2a00 78%,#0d0f2aa6);}}
.travel-motes{width:100%;height:100%;}

.travel-stage[data-kind=frame] :is(.travel-aurora,.travel-papel){opacity:0;}
.travel-aurora,.travel-papel{transition:opacity 1.6s ease;}
/* Norway: a slow aurora over the top of the sky. */
.travel-aurora{position:absolute;inset:0 0 40% 0;mix-blend-mode:screen;opacity:.75;}
.travel-aurora i{position:absolute;width:70%;height:70%;border-radius:50%;filter:blur(42px);animation:travel-aurora 18s ease-in-out infinite alternate;}
.travel-aurora i:nth-child(1){left:-10%;top:0;background:radial-gradient(ellipse,#3ff2a6aa,transparent 65%);}
.travel-aurora i:nth-child(2){left:30%;top:-15%;background:radial-gradient(ellipse,#36c5f099,transparent 65%);animation-duration:23s;animation-delay:-6s;}
.travel-aurora i:nth-child(3){left:55%;top:5%;background:radial-gradient(ellipse,#b58cff80,transparent 65%);animation-duration:27s;animation-delay:-11s;}
@keyframes travel-aurora{from{transform:translate(0,0) scale(1,.7) rotate(-6deg);opacity:.55;}to{transform:translate(8%,6%) scale(1.25,.9) rotate(5deg);opacity:1;}}

/* Mexico: one row of papel picado under the header, swaying a little. */
.travel-papel{position:absolute;left:0;right:0;top:64px;}
.travel-papel svg{display:block;overflow:visible;}
.travel-papel-string{fill:none;stroke:#f6efe2b3;stroke-width:1.2;}
.travel-papel-flag{transform:translateX(var(--x));}
.travel-papel-flag path{transform-box:fill-box;transform-origin:50% 0;opacity:.92;animation:travel-sway 3.4s ease-in-out var(--d) infinite alternate;}
@keyframes travel-sway{from{rotate:-3deg;}to{rotate:3deg;}}

/* In front: the postcard and the credit line. */
.travel-front{position:fixed;inset:0;z-index:60;pointer-events:none;transition:opacity .5s ease;}
body:is(.party-on,.chill-mode,.detail-open) .travel-front,:root:is(.arrival-pending,.arrival-active) .travel-front{opacity:0;visibility:hidden;}
.travel-postcard{appearance:none;cursor:pointer;pointer-events:auto;position:absolute;left:50%;top:84px;translate:-50% 0;display:flex;align-items:center;gap:10px;margin:0;padding:8px 16px 8px 12px;border:1px solid #ffffff29;border-radius:999px;color:#f6f3ff;background:#14163acc;box-shadow:0 10px 26px #0a0c2440;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:500 14px/1.2 Portfolio Hanken,system-ui,sans-serif;white-space:nowrap;}
.travel-postcard b{font-weight:700;}
.travel-postcard-flag{font-size:18px;line-height:1;}
.travel-postcard-time{padding-left:10px;border-left:1px solid #ffffff33;color:#d6d1ee;font-variant-numeric:tabular-nums;}
.travel-credit{position:absolute;left:50%;bottom:8px;translate:-50% 0;max-width:calc(100vw - 32px);margin:0;padding:4px 12px;border-radius:99px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 12px/1.5 Portfolio Hanken,system-ui,sans-serif;color:#eef0fa;background:#0a0c24d9;box-shadow:0 0 0 1px #ffffff1a;pointer-events:auto;}
.travel-credit:empty{display:none;}
.travel-credit a{color:inherit;text-decoration:underline;text-decoration-color:#ffffff59;text-underline-offset:2px;}
.travel-credit.is-wrapped{bottom:auto;white-space:normal;text-align:center;line-height:1.35;border-radius:10px;width:max-content;}
@media(max-width:600px){
  .travel-postcard{font-size:13px;gap:8px;padding:5px 11px 5px 9px;}
  .travel-postcard-time{padding-left:8px;}
  .travel-credit{bottom:0;font-size:11px;padding:2px 9px;}
}
:root:not([data-theme=light]) body.travel-mode:not(.mood-matrix):not(.chill-mode):not(.party-on) .scene .person p{color:#f3f1fb;}
body.travel-mode:not(.chill-mode):not(.party-on) .person :is(h1,p){text-shadow:0 0 2px #0a0c24,0 1px 3px #0a0c24,0 2px 14px #0a0c24cc;}

@media(prefers-reduced-motion:reduce){
  .travel-wall img.is-photo,.travel-aurora i,.travel-papel-flag path{animation:none;}
  .travel-wall{transition:opacity .4s linear;}
  .travel-picker{transition:none;}
}
body.motion-paused :is(.travel-wall img.is-photo,.travel-aurora i,.travel-papel-flag path){animation-play-state:paused;}
/* Cameos (Antarctica, the Moon): behind the bubbles, gone under reduced motion. */
.travel-cameos{position:absolute;inset:0;overflow:hidden;}
.travel-penguin,.travel-astronaut{position:absolute;left:0;top:0;line-height:1;filter:drop-shadow(0 4px 6px #0a0c2466);will-change:transform;}
.travel-penguin{top:auto;}
@media(max-width:600px){
  .travel-picker-grid{grid-template-columns:repeat(3,1fr);gap:6px;}
  .travel-chip{min-height:64px;padding:7px 4px 6px;}
  .travel-chip-flag{font-size:21px;}
  .travel-chip small{font-size:10.5px;}
}
@media(prefers-reduced-motion:reduce){.travel-cameos{display:none;}}
@media(hover:hover) and (pointer:fine){.travel-postcard:hover{background:#1c1f4dd9;}}
.travel-postcard:focus-visible{outline:2px solid #ffd23f;outline-offset:3px;}
.travel-shout{position:absolute;translate:-50% 0;padding:6px 12px;border-radius:999px;font:700 15px/1.2 Portfolio Hanken,system-ui,sans-serif;color:#10122e;background:#ffd23f;box-shadow:0 8px 20px #0a0c2459;pointer-events:none;animation:travel-shout 1.4s cubic-bezier(.2,1.4,.4,1) forwards;}
@keyframes travel-shout{0%{scale:.6;opacity:0;}15%{scale:1.08;opacity:1;}70%{scale:1;opacity:1;}100%{translate:-50% -14px;opacity:0;}}
@media(prefers-reduced-motion:reduce){.travel-shout{animation:none;}}

/* The postcard's small print, and the same line as a short note on entry where the postcard is not shown. */
.travel-postcard-note{padding-left:10px;border-left:1px solid #ffffff33;color:#c9c5e6;}
.scene-note,.america-note.is-toast{position:absolute;left:50%;bottom:calc(72px + env(safe-area-inset-bottom));translate:-50% 0;width:max-content;max-width:calc(100vw - 32px);margin:0;padding:9px 14px;border-radius:14px;box-sizing:border-box;font:600 13px/1.35 Portfolio Hanken,system-ui,sans-serif;text-align:center;color:#f4f2fb;background:#0a0c24f2;box-shadow:0 0 0 1px #ffffff24,0 10px 26px #05061680;opacity:0;animation:scene-note 7.5s ease .9s 1 both;}
@keyframes scene-note{0%{opacity:0;translate:-50% 8px}6%,84%{opacity:1;translate:-50% 0}100%{opacity:0;translate:-50% 0}}
@media(min-width:951px){.scene-note{display:none;}}
@media(max-width:600px){.travel-postcard-note{display:none;}}
@media(prefers-reduced-motion:reduce){.scene-note,.america-note.is-toast{animation-name:scene-note-calm;}@keyframes scene-note-calm{0%,84%{opacity:1}100%{opacity:0}}}
/* The note waits for the arrival and for an open room, so it is seen when the scene is. */
:root:is(.arrival-pending,.arrival-active) :is(.scene-note,.america-note.is-toast),body:is(.party-on,.chill-mode,.detail-open) :is(.scene-note,.america-note.is-toast){animation-play-state:paused;}


/* mobile-v68.css */
/* Small-screen controls keep their space, including browser chrome and safe areas. */
html{-webkit-text-size-adjust:100%;}
:is(.header,.world-toolbar,.site-sound,.travel-picker) :is(button,summary){
  touch-action:manipulation;-webkit-user-select:none;user-select:none;
}
.travel-picker{overscroll-behavior:contain;max-height:calc(100dvh - var(--travel-picker-top,100px) - max(12px,env(safe-area-inset-bottom)));}
#keyboard-guide{max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
  .header .exploration-return{width:44px;min-width:44px;min-height:44px;height:44px;padding:6px;justify-content:center;}
  .header .exploration-return>.kept-art{display:grid;width:30px;height:30px;}
  .header .exploration-return>svg{display:none;}
  .header .exploration-return>span:not(.kept-art){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
}

@media(max-width:600px){
  /* A second row preserves every header action instead of squeezing the wordmark. */
  .header{top:max(8px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));}
  .header .header-id{min-width:0;gap:4px;}
  .header .wordmark{white-space:nowrap;min-height:44px;font-size:21px;}
  .header .header-linkedin{width:44px;height:44px;flex:none;margin:0;}
  .header .header-tools{gap:2px;}
  .header .header-tools :is(.find-button,.keeps-button,.travel-button,.theme-button,.keys-button){width:44px;min-width:44px;height:44px;padding:8px;flex:none;}
  .header-tools .keeps-button [data-kept-total]{display:none;}
  .travel-home{min-height:44px;}
  .site-sound>button{min-width:44px;height:44px;justify-content:center;}
  body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar :is(.world-find,.world-keys){min-width:44px;width:44px;height:44px;min-height:44px;}
  body>dialog.cohesive-world[data-room-mode]:not([data-category=play]) .world-toolbar:has(>.world-keep:not([hidden])){grid-template-columns:44px minmax(0,1fr) 44px 44px 44px;}
}
@media(max-width:420px){
  .header{flex-wrap:wrap;justify-content:center;row-gap:0;}
  .header .header-id{width:100%;justify-content:space-between;}
  .header .header-tools{width:100%;justify-content:space-between;}
  .scene{top:calc(max(8px,env(safe-area-inset-top)) + 100px);height:calc(100svh - max(8px,env(safe-area-inset-top)) - 178px - env(safe-area-inset-bottom));}
  /* Keep the labelled sound controls comfortable on narrow phones. */
  .site-sound{gap:2px;}
  .site-sound>button{padding:0 10px;}
  /* America keeps its video badge in the now-vacant bottom-left corner. */
  .america-mode .site-sound :is(.site-sound-music,.site-sound-effects)>span:last-child{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
}
@media(max-width:420px) and (max-height:620px){
  .scene .position-music,.scene .position-apps{top:91%;}
  .scene .position-play{top:calc(91% + (var(--s) - var(--m))/2);}
}
@media(max-width:420px) and (max-height:520px){
  .scene{--l:62px;}
  .scene .person{--face:40px;top:26%;}
  .scene .person h1{font-size:20px;}
  .scene .person>p{display:none;}
  .scene .chill-toggle{margin-top:10px;}
}
/* Short landscape screens use two side columns, leaving the centre and bottom controls clear. */
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
  body{min-height:0;}
  .header{top:max(4px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));}
  .header .wordmark{font-size:21px;white-space:nowrap;}
  .header .header-tools{gap:2px;}
  .header .header-tools :is(.find-button,.keeps-button,.travel-button,.theme-button,.keys-button){width:44px;min-width:44px;height:44px;padding:8px;flex:none;}
  .header-tools :is(.find-button>span,.find-button>kbd,.keys-button>span,.keeps-button>span){display:none;}
  .scene{inset:calc(max(4px,env(safe-area-inset-top)) + 52px) max(12px,env(safe-area-inset-right)) calc(max(12px,env(safe-area-inset-bottom)) + 58px) max(12px,env(safe-area-inset-left));width:auto;height:auto;aspect-ratio:auto;transform:none;}
  .scene .person{--face:clamp(48px,17svh,78px);left:50%;top:2%;width:60%;}
  .scene .person h1{font-size:clamp(18px,4.8svh,24px);max-width:none;line-height:1.05;}
  .scene .person>p{font-size:12px;margin-top:8px;}
  .scene .chill-toggle{margin-top:8px;}
  .scene .bubble-position{width:clamp(48px,16svh,72px);}
  .scene :is(.position-projects,.position-music,.position-reads){left:10%;}
  .scene :is(.position-games,.position-apps,.position-play){left:90%;}
  .scene :is(.position-projects,.position-games){top:16%;}
  .scene :is(.position-music,.position-apps){top:50%;}
  .scene :is(.position-reads,.position-play){top:84%;}
  .scene .bubble-label{font-size:11px;}
}
@media(pointer:coarse){
  :is(.travel-chip,.travel-home):active{opacity:.75;}
}


/* country-mode-v69.css */
/* Country mode replaces the sun next to signup. Flags remain paired with names. */
.country-entry{position:relative;z-index:3;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;vertical-align:bottom;gap:3px;width:110px;min-height:48px;margin:0 0 0 8px;padding:5px 8px;border:1px solid #ffffff38;border-radius:16px;color:#f3efff;background:#ffffff14;font:600 11px/1.1 Portfolio Hanken,system-ui,sans-serif;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .16s ease,transform .16s ease;}
.country-entry-flags{font-size:20px;line-height:1.1;white-space:nowrap;}
.country-entry-time{display:none;font:600 11px/1.1 Portfolio Hanken,system-ui,sans-serif;font-variant-numeric:tabular-nums;}
.country-entry-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.country-entry[aria-pressed=true]{border-color:#ffffff80;background:#ffffff24;}
:root[data-theme=light] .country-entry{color:#30284e;border-color:#30284e38;background:#ffffff85;}
.country-entry:focus-visible,.travel-close:focus-visible{outline:3px solid #ffd23f;outline-offset:3px;}
.country-entry:active{transform:scale(.96);}
@media(hover:hover) and (pointer:fine){.country-entry:hover{background:#ffffff30;}.travel-close:hover{background:#ffffff26;}}
.arrival-pending .country-entry{opacity:0!important;}
body:is(.party-on,.detail-open) .country-entry{visibility:hidden;pointer-events:none;}
.travel-picker{box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden;padding:10px;}
.travel-picker-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;}
.travel-picker-heading .travel-picker-title{margin:0 4px;letter-spacing:.08em;font-size:12px;}
.travel-picker-title span{margin-left:6px;color:#aaa4c2;}
.travel-close{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:inherit;font:26px/1 system-ui;cursor:pointer;touch-action:manipulation;}
.travel-picker-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:3px;scroll-padding:3px;}
.travel-extra-title{margin:18px 2px 10px;}
.travel-home{flex:none;min-height:44px;}
.travel-chip{min-width:0;touch-action:manipulation;}
.travel-chip-name{overflow-wrap:anywhere;}
.travel-stage[data-kind=photo] .travel-scrim{background:radial-gradient(ellipse 46% 48% at 50% 50%,#0d0f2ad9,#0d0f2a8c 60%,#0d0f2a30 100%),linear-gradient(#0d0f2ae6,#0d0f2a22 27%,#0d0f2a22 72%,#0d0f2acc);}
@media(max-width:600px){
  body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{font-size:12px;padding-inline:12px;gap:7px;vertical-align:bottom;}
  .country-entry{width:104px;}
  .travel-postcard{max-width:calc(100vw - 32px);box-sizing:border-box;white-space:normal;display:grid;grid-template-columns:20px minmax(0,1fr);gap:3px 7px;min-height:44px;border-radius:16px;}
  .travel-postcard-flag{grid-row:1 / 3;}
  .travel-postcard-time{grid-column:2;padding:0;border:0;font-size:11px;}
}
@media(min-width:601px) and (max-height:500px){
  body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{font-size:12px;padding-inline:12px;gap:7px;vertical-align:bottom;}
}
@media(prefers-reduced-motion:reduce){.country-entry{transition:none;}}
/* On mobile the flag control carries the clock, leaving the floating bubbles clear. */
@media(max-width:950px){
  .travel-postcard{display:none;}
  .country-entry-time{display:inline-block;margin-left:6px;vertical-align:middle;}
}


/* home-ui-v70.css */
/* One clear utility row. The bubbles and person remain the main way into the site. */
.home-ui-ready .header{z-index:95;}
.home-ui-ready .header-tools{position:relative;}
.home-ui-ready .header-tools>.travel-button,.home-ui-ready .header-tools>.exploration-home-actions{display:none;}
.home-more{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:44px;min-height:44px;padding:0 12px;border:1px solid #ffffff25;border-radius:14px;background:#ffffff0a;color:#f2f0f8;font:500 13px/1 Portfolio Hanken,system-ui,sans-serif;}
.home-more svg{width:21px;height:21px;fill:currentColor;}
.home-options{position:absolute;top:calc(100% + 12px);right:0;width:min(300px,calc(100vw - 24px));max-height:calc(100dvh - 90px - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;padding:8px;border:1px solid #ffffff2b;border-radius:20px;background:#191a25;color:#f2f0f8;box-shadow:0 18px 50px #07071155;}
.home-options[hidden]{display:none;}
.home-options-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-left:12px;}
.home-options-heading strong{font:600 14px/1.2 Portfolio Hanken,system-ui,sans-serif;}
#home-options :is(button,a){min-height:48px;touch-action:manipulation;}
#home-options>.theme-button,#home-options>.keys-button,#home-options>.header-linkedin,#home-options>.exploration-return,#home-options>.home-credits-open{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;height:auto;margin:0;padding:10px 12px;border:0;border-radius:12px;box-shadow:none;background:transparent;color:inherit;opacity:1;text-decoration:none;font:500 14px/1.3 Portfolio Hanken,system-ui,sans-serif;}
#home-options>.theme-button svg,#home-options>.header-linkedin svg{flex:none;width:20px;height:20px;}
#home-options>.keys-button>span{display:inline;}
#home-options>.keys-button>kbd{order:-1;margin-left:0;}
#home-options>.theme-button svg{fill:none;stroke:currentColor;stroke-width:1.7;}
#home-options>.header-linkedin svg{fill:currentColor;}
#home-options :is(small,kbd){margin-left:auto;font:500 12px/1.2 Portfolio Hanken,system-ui,sans-serif;color:#a9a7b9;}
#home-options>.exploration-return[hidden]{display:none;}
#home-options>.exploration-return>span:not(.kept-art){position:static;width:auto;height:auto;clip-path:none;white-space:normal;overflow:hidden;text-align:left;}
#home-options>.exploration-return>.kept-art{width:32px;height:32px;flex:none;}
#home-options>.home-credits-open{display:none;}
body:is(.travel-mode,.america-mode) #home-options>.home-credits-open{display:flex;}
.home-options-close,.scene-credits-dialog header button{display:grid;place-items:center;flex:none;width:44px;min-height:44px;padding:0;border:0;border-radius:12px;background:transparent;color:inherit;font:26px/1 system-ui;}
:root[data-theme=light] .home-more{border-color:#342d4a25;background:#fff7;color:#302a40;}
:root[data-theme=light] .home-options{background:#faf8fd;color:#302a40;border-color:#342d4a25;box-shadow:0 18px 50px #302a4026;}
:root[data-theme=light] #home-options :is(small,kbd){color:#686172;}
@media(hover:hover) and (pointer:fine){#home-options :is(button,a):hover,.home-more:hover{background:#87829c24;}}

/* Country scenes use a darkened centre and edges, without a grey wash over the entire view. */
.travel-stage[data-kind=photo] .travel-scrim{background:radial-gradient(ellipse 42% 52% at 50% 52%,#090d19e0 5%,#090d19a6 44%,#090d1926 82%),linear-gradient(#090d19d9 0%,#090d191a 25%,#090d1900 66%,#090d19bd 100%);}
.travel-stage[data-kind=photo] .travel-motes{opacity:.22;}
.home-ui-ready :is(.travel-credit,.america-credit){display:none;}
.scene-credits-dialog{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;margin:auto;padding:16px 20px 24px;border:1px solid #ffffff29;border-radius:22px;color:#f2f0f8;background:#191a25;font:400 15px/1.65 Portfolio Hanken,system-ui,sans-serif;}
.scene-credits-dialog::backdrop,.stay-tuned-dialog::backdrop{background:#080a15a6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.scene-credits-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;}
.scene-credits-dialog h2{margin:0;font-size:19px;letter-spacing:-.025em;}
.scene-credit-copy{overflow-wrap:anywhere;}
.scene-credit-copy a{text-decoration:underline;text-underline-offset:4px;}
.scene-credit-copy a[title]::after{content:attr(title);display:block;margin-top:4px;font-size:13px;color:#b7b3c6;text-decoration:none;}

/* Secondary home actions stay legible without looking like the main destinations. */
.home-ui-ready:root:not([data-theme=light]) body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{background:#171821a6;border:1px solid #ffffff38;color:#f1eef8;box-shadow:none;}
.home-ui-ready:root[data-theme=light] body:not(.chill-mode) .scene .chill-toggle.is-stay-tuned{background:#ffffffb3;border:1px solid #332c4433;color:#302a40;box-shadow:none;}
.home-ui-ready .country-entry{width:118px;border-radius:999px;background:#17182180;border-color:#ffffff38;}
.home-ui-ready .country-entry[aria-pressed=true]{border-color:#ffffff59;background:#171821ad;}
.home-ui-ready .country-entry-label::after{content:'';display:inline-block;width:5px;height:5px;margin:0 0 2px 7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);opacity:.8;}
.home-ui-ready :is(.country-entry,.home-more,.home-options button,.home-options a,.travel-picker button,.travel-picker input,.scene-credits-dialog button):focus-visible{outline:2px solid #b9caff;outline-offset:3px;}
:root[data-input=pointer] :is(.country-entry,.is-stay-tuned,.header button,.travel-picker button,.home-options a):focus-visible{outline:none;}
.home-ui-ready :is(.home-more,.home-options button,.country-entry,.is-stay-tuned,.travel-picker button):active{transform:scale(.98);}

.travel-search{position:relative;display:flex;align-items:center;flex:none;margin:4px 3px 8px;}
.travel-search input{min-width:0;width:100%;height:44px;padding:0 44px 0 12px;border:1px solid #ffffff26;border-radius:12px;background:#ffffff0b;color:inherit;font:400 16px/1.2 Portfolio Hanken,system-ui,sans-serif;}
.travel-search input::placeholder{color:#b9b6c9;}
.travel-search input::-webkit-search-cancel-button{display:none;}
.travel-search-clear{position:absolute;right:0;top:0;width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:inherit;font-size:21px;}
.travel-search-clear[hidden],.travel-chip[hidden],.travel-extra-title[hidden]{display:none;}
.travel-empty{padding:20px 12px;font-size:14px;line-height:1.5;color:#c5c0d5;}
.travel-empty[hidden]{display:none;}
.travel-home{font-size:14px;min-height:48px;}

/* A complete, scrollable form instead of a cramped row floating over the home. */
.stay-tuned-dialog{position:fixed;inset:auto;box-sizing:border-box;width:min(460px,calc(100vw - 32px));margin:0;padding:0;max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;border:1px solid #d8d4e1;border-radius:24px;background:#faf9fd;color:#302a40;}
.stay-tuned-dialog .stay-tuned{position:static;width:100%;max-width:none;padding:20px;border:0;border-radius:0;background:transparent;box-shadow:none;animation:none;backdrop-filter:none;}
.stay-tuned-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.stay-tuned-heading h2{margin:0;font:650 22px/1.2 Portfolio Hanken,system-ui,sans-serif;letter-spacing:-.03em;}
.stay-tuned-heading [data-close-signup]{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:transparent;color:inherit;font-size:25px;}
.stay-tuned-dialog .stay-tuned-row{display:grid;gap:8px;}
.stay-tuned-dialog .stay-tuned-field{display:grid;gap:7px;font-size:13px;font-weight:600;}
.stay-tuned-dialog .stay-tuned input[type=email]{border:1px solid #d9d4e3;border-radius:12px;font-size:16px;}
.stay-tuned-dialog .stay-tuned-purposes{margin:8px 0 0;padding:0;}
.stay-tuned-dialog .stay-tuned-consent{margin:0;font-size:12px;line-height:1.6;}
.stay-tuned-dialog .stay-tuned-status{margin:4px 0;font-size:14px;line-height:1.5;}
.stay-tuned-submit{width:100%;min-height:48px;margin-top:10px;border:0;border-radius:12px;color:#fff;background:#3d3356;font:600 15px/1.2 Portfolio Hanken,system-ui,sans-serif;}
.stay-tuned-submit:disabled{opacity:.6;cursor:wait;}
:root:not([data-theme=light]) .stay-tuned-dialog{background:#17131f;border-color:#ffffff29;}
:root:not([data-theme=light]) .stay-tuned-submit{color:#302a40;background:#ece7f7;}
.stay-tuned-dialog .stay-tuned.is-done :is(.stay-tuned-row,.stay-tuned-purposes,.stay-tuned-submit){display:none;}
.stay-tuned-dialog .stay-tuned.is-done .stay-tuned-status{padding:12px 0;}
.stay-tuned-dialog button:focus-visible{outline:2px solid #5875a5;outline-offset:2px;}
.home-ui-ready :is(.world-toolbar button,.world-switcher-toggle,.discovery-close,.stay-tuned-check){min-height:44px;}

@media(max-width:600px){
  .home-ui-ready .header{top:max(8px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));flex-wrap:nowrap;gap:8px;}
  .home-ui-ready .header .header-id{width:auto;min-width:0;flex:1;}
  .home-ui-ready .header .header-tools{width:auto;gap:2px;justify-content:flex-end;}
  .home-ui-ready .header .wordmark{font-size:21px;letter-spacing:-1px;}
  .home-ui-ready .header-tools>.find-button,.home-ui-ready .header-tools>.keeps-button,.home-ui-ready .header-tools>.home-more{flex:none;width:44px;height:44px;padding:10px;border:0;background:transparent;border-radius:12px;}
  .home-ui-ready .header-tools>.home-more>span,.home-ui-ready .header-tools>.find-button :is(span,kbd),.home-ui-ready .header-tools>.keeps-button>span{display:none;}
  .home-ui-ready .scene{top:calc(max(8px,env(safe-area-inset-top)) + 56px);height:calc(100svh - max(8px,env(safe-area-inset-top)) - 134px - env(safe-area-inset-bottom));}
  .home-ui-ready #home-options>.header-linkedin{width:100%;}
  .home-ui-ready .country-entry{font-size:11px;min-height:48px;}
  .travel-picker{width:calc(100vw - 24px);border-radius:20px;}
  .travel-chip{min-height:72px;}
  .travel-chip-name{font-size:13px;}
  .travel-chip small{font-size:11px;}
}
@media(max-width:420px) and (max-height:520px){.home-ui-ready .scene .person{--face:56px;top:25%;}}
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
  .home-ui-ready .scene{inset:calc(max(4px,env(safe-area-inset-top)) + 52px) max(12px,env(safe-area-inset-right)) calc(max(12px,env(safe-area-inset-bottom)) + 58px) max(12px,env(safe-area-inset-left));height:auto;}
  .home-ui-ready .home-more>span{display:none;}
}
@media(prefers-reduced-motion:reduce){.home-more,.country-entry{transition:none;}}

/* Keep feedback beside its source, never across the mouth or heading. This
   layer owns only the caption: the portrait/arrival keep their own transforms. */
.home-ui-ready .scene .memoji .hello-bubble{left:calc(100% + 6px);right:auto;top:25%;bottom:auto;max-width:118px;padding:6px 10px;font:500 11px/1.3 Portfolio Hanken,system-ui,sans-serif;color:#354452;background:#fafcff;border:1px solid #dce3eb;border-radius:12px;box-shadow:0 4px 12px -6px #25364b35;transform:translateY(3px);}
.home-ui-ready .scene .memoji:is(:hover,:focus-visible,.greeting) .hello-bubble{transform:translateY(0);}
:root:not([data-theme=light]) .scene .memoji .hello-bubble{color:#f1f3fc;background:#242733;border-color:#ffffff35;}
/* The optical object and its name have independent slots. Hover can magnify
   the object, but never reflows/tilts its label or invents another art angle. */
.home-ui-ready .scene .bubble .bubble-content:has(.world-art-main){display:grid;width:100%;grid-template-columns:minmax(0,1fr);grid-template-rows:61% 22%;align-content:center;justify-items:center;align-items:center;gap:1%;transform:none;}
.home-ui-ready .scene .bubble .bubble-content>.world-art-main{width:62%;height:100%;object-fit:contain;align-self:center;transform:none;}
.home-ui-ready .scene .bubble .bubble-label{white-space:nowrap;line-height:1.15;letter-spacing:-.025em;transform:none;align-self:center;}
.home-ui-ready .scene .bubble-projects .bubble-content>.world-art-main{width:65%;}
.home-ui-ready .scene .bubble-apps .bubble-content>.world-art-main{width:64%;}
@media(hover:hover) and (pointer:fine){.home-ui-ready .scene .bubble:has(.world-art-main):hover{scale:1.035;}.home-ui-ready .scene .bubble:has(.world-art-main):hover .world-art-main{transform:scale(1.035);}}
@media(prefers-reduced-motion:reduce){.home-ui-ready .scene .bubble:has(.world-art-main):hover{scale:1;}.home-ui-ready .scene .bubble:has(.world-art-main):hover .world-art-main{transform:none;}}
.motion-paused .scene .bubble:has(.world-art-main):hover{scale:1;}
.motion-paused .scene .bubble:has(.world-art-main):hover .world-art-main{transform:none;}

/* Four steady destinations, with the existing artwork/label/physics owners. */
.home-ui-ready .scene .position-apps{left:25%;top:28%;}
.home-ui-ready .scene .position-reads{left:75%;top:28%;}
.home-ui-ready .scene .position-music{left:22%;top:76%;}
.home-ui-ready .scene .position-play{left:78%;top:76%;}
@media(max-width:600px),(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .home-ui-ready .scene .position-apps{left:28%;top:calc(var(--t,12px) + var(--l)/2);}
  .home-ui-ready .scene .position-reads{left:72%;top:calc(var(--t,12px) + var(--l)/2);}
  .home-ui-ready .scene .position-music{left:25%;top:77%;}
  .home-ui-ready .scene .position-play{left:75%;top:77%;}
}
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
  .home-ui-ready .scene .position-apps{left:13%;top:28%;}
  .home-ui-ready .scene .position-reads{left:13%;top:84%;}
  .home-ui-ready .scene .position-music{left:87%;top:28%;}
  .home-ui-ready .scene .position-play{left:87%;top:84%;}
}
/* In the mixed shelf, app UI keeps its established two-column breathing room. */
body>dialog.cohesive-world[data-room-mode] [data-gallery=stuff] .showcase-garden{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 36px;max-width:1160px;margin:auto;}
.cohesive-world [data-gallery=stuff] .app-preview-v34 .ap-caption{display:none;}
.cohesive-world [data-gallery=stuff] [data-cover-kind=app-ui] .showcase-node-art{aspect-ratio:auto;overflow:visible;background:none;box-shadow:none;}
@media(max-width:600px){body>dialog.cohesive-world[data-room-mode] [data-gallery=stuff] .showcase-garden{grid-template-columns:minmax(0,1fr);gap:32px;}}

.scene-credit-stance{margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid #ffffff1f;font-weight:600;}
.scene-credit-sources{margin:0;}


/* favorites-v71.css */
/* A fifth home object, carrying the actual playlist cover. Existing position,
   physics and journey layers retain ownership of movement. */
.bubble-favorites{--tint:222 161 100;--color:#dc9860;--delay:-2.4s;}
.home-ui-ready .scene .position-favorites{left:12%;top:52%;width:12%;}
.home-ui-ready .scene .bubble-favorites .bubble-content>.favorites-bubble-art{width:56%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:6px;}
.scene .position-favorites .bubble-label{font-size:var(--label-s,14px);}
@media(max-width:600px),(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .home-ui-ready .scene .position-favorites{width:var(--l);left:50%;top:87%;}
  .home-ui-ready .scene .position-music{left:21%;top:79%;}
  .home-ui-ready .scene .position-play{left:79%;top:79%;}
  .scene .position-favorites .bubble-label{font-size:clamp(10px,2.8vw,13px);}
}
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
  .home-ui-ready .scene .position-favorites{left:50%;top:91%;width:72px;}
}
.favorites-room{--fav-ink:#f5f0e9;--fav-muted:#c1b7ae;--fav-line:#ffffff2b;--fav-field:#ffffff09;max-width:1040px;margin:auto;padding:clamp(20px,4vw,60px) clamp(16px,3vw,40px) 60px;color:var(--fav-ink);font-family:Portfolio Hanken,system-ui,sans-serif;}
.favorites-intro{display:grid;grid-template-columns:minmax(180px,360px) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,64px);}
.favorites-art img{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:8px;box-shadow:0 24px 48px -20px #0008;}
.favorites-copy h2{font-family:Portfolio Bricolage,Portfolio Hanken,system-ui,sans-serif;font-size:clamp(36px,5vw,64px);line-height:1.04;letter-spacing:-.035em;font-weight:650;white-space:normal;}
.favorites-introduction{max-width:30ch;margin:20px 0 28px;font-size:clamp(17px,2vw,21px);line-height:1.55;color:var(--fav-ink);}
.favorites-actions{display:flex;flex-wrap:wrap;gap:12px;}
.favorites-actions :is(a,button),.song-submit{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 18px;border-radius:12px;font:600 15px/1.3 Portfolio Hanken,system-ui,sans-serif;}
.favorites-spotify,.song-submit{background:#f1e8dc;color:#25201b;}
.favorites-listen{border:1px solid var(--fav-line);background:transparent;color:var(--fav-ink);}
.favorites-actions svg,.song-submit svg{width:20px;height:20px;flex:none;}
.favorites-byline{margin:20px 0 0;font-size:14px;color:var(--fav-muted);line-height:1.5;}
.favorites-player{margin:32px 0;}
.favorites-player[hidden]{display:none;}
.favorites-player iframe{display:block;border:0;border-radius:12px;}
.favorites-suggestion{margin-top:clamp(32px,5vw,56px);border-top:1px solid var(--fav-line);}
.favorites-suggestion summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:18px 0;list-style:none;cursor:pointer;font-size:20px;font-weight:600;letter-spacing:-.02em;}
.favorites-suggestion summary::-webkit-details-marker{display:none;}
.favorites-suggestion summary svg{width:22px;height:22px;flex:none;transition:transform .2s;}
.favorites-suggestion[open] summary svg{transform:rotate(45deg);}
.favorites-suggestion-body{max-width:640px;padding:0 0 8px;}
.favorites-suggestion-body>p{margin:0 0 24px;font-size:17px;color:var(--fav-muted);}
.song-suggestion-form{display:grid;gap:20px;}
.song-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.song-suggestion-form label{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:600;}
.song-suggestion-form label>span{font-weight:400;color:var(--fav-muted);}
.song-suggestion-form input{display:block;width:100%;min-width:0;min-height:48px;padding:12px 14px;border:1px solid var(--fav-line);border-radius:10px;background:var(--fav-field);color:var(--fav-ink);font:400 16px/1.35 Portfolio Hanken,system-ui,sans-serif;caret-color:var(--fav-ink);}
.song-suggestion-form input::placeholder{color:var(--fav-muted);opacity:1;}
.song-suggestion-form .song-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.song-privacy{font-size:13px;line-height:1.5;color:var(--fav-muted);}
.song-submit{justify-self:start;border:0;}
.song-submit:disabled{opacity:.65;cursor:default;}
.song-status{font-size:15px;line-height:1.6;}
.song-status:empty{display:none;}
.song-suggestion-form.is-sent>:not(.song-status){display:none;}
.favorites-room :is(a,button,input,summary):focus-visible{outline:2px solid #efb16c;outline-offset:4px;}
.favorites-room input[aria-invalid=true]{border-color:#f3a995;}
.favorites-room ::selection{background:#dc9860;color:#211a16;}
.favorites-room{scrollbar-color:#a68a75 transparent;}
@media(hover:hover) and (pointer:fine){.favorites-spotify:hover,.song-submit:not(:disabled):hover{background:#fff6ea;}.favorites-listen:hover{background:#ffffff10;}.favorites-suggestion summary:hover{color:#efb16c;}}
:root[data-theme=light] .favorites-room{--fav-ink:#30291f;--fav-muted:#695f52;--fav-line:#30291f38;--fav-field:#ffffff80;}
:root[data-theme=light] .favorites-spotify,:root[data-theme=light] .song-submit{background:#3d3025;color:#fff8ef;}
:root[data-theme=light] .favorites-room input[aria-invalid=true]{border-color:#a63e2b;}
@media(max-width:600px){.favorites-intro{grid-template-columns:1fr;gap:24px;}.favorites-art{width:min(60vw,220px);margin:auto;}.favorites-copy h2{font-size:38px;}.favorites-introduction{margin:14px 0 20px;max-width:30ch;font-size:18px;}.song-fields{grid-template-columns:1fr;gap:20px;}.favorites-suggestion{margin-top:32px;}.favorites-room{padding-top:20px;}.song-submit{width:100%;}}
@media(prefers-reduced-motion:reduce){.favorites-suggestion summary svg{transition:none;}}

@media(min-width:360px) and (max-width:600px){.favorites-actions :is(a,button){padding:12px 14px;gap:7px;font-size:14px;}}


/* listening-room-v72.css */
/* Concerts and favourites share the film room and its existing watching layout. */
.bubble-concerts{--tint:210 144 93;--color:#d9a26f;--delay:-5.1s;}
.home-ui-ready .scene .position-concerts{left:88%;top:52%;width:12%;}
.scene .position-concerts .bubble-label{font-size:var(--label-s,14px);}
.home-ui-ready .scene .bubble-concerts .bubble-content>.concerts-bubble-art{width:61%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:5px;}
@media(max-width:600px),(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
 .home-ui-ready .scene .position-favorites{left:34%;top:93%;}
 .home-ui-ready .scene .position-concerts{left:66%;top:93%;width:var(--l);}
 .scene .position-concerts .bubble-label{font-size:clamp(10px,2.8vw,13px);}
}
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
 .home-ui-ready .scene .position-favorites{left:38%;top:91%;}
 .home-ui-ready .scene .position-concerts{left:62%;top:91%;width:72px;}
}
.detail[data-category=music] .collection-doorway-concerts .collection-cover{width:90%;aspect-ratio:4/3;object-fit:cover;left:5%;right:auto;transform:none;}
.cinema-room .media-concerts .media-cinema .media-cinema-poster{width:100%;height:100%;left:0;top:0;object-fit:contain;box-shadow:none;}
.cinema-room .media-concerts .media-film-tile{width:100px;flex-basis:100px;}
.cinema-room .media-concerts .media-film-tile>span{aspect-ratio:4/3;}
.cinema-room .media-concerts .media-film-tile img{object-fit:cover;}
.cinema-room .concert-source{display:inline-flex;align-items:center;min-height:44px;grid-column:1/-1;font:500 13px/1.5 Portfolio Hanken,system-ui,sans-serif;color:#d4deeb;text-decoration:underline;text-underline-offset:4px;}
.cinema-room .concerts-next{font-size:13px;line-height:1.5;color:#bcc6d6;margin:8px 0;}
.cinema-room .media-film-more [hidden]{display:none;}
.media-provider-fallback{position:absolute;top:14px;left:14px;z-index:3;display:inline-flex;align-items:center;min-height:44px;padding:9px 14px;border:1px solid #ffffff4d;border-radius:9px;background:#11171ddd;color:#fff;font:500 13px/1.3 Portfolio Hanken,system-ui,sans-serif;}
.media-provider-fallback:focus-visible{outline:3px solid #fff;outline-offset:4px;}
/* Favourites keep one bounded column before playback and on small screens.
   On wide screens, watching uses the film room's screen (see the block below). */
.cinema-room .detail[data-category=music] .media-films.favorites-cinema {
  --screen-width:100%;
  width:min(100%,960px);min-width:0;max-width:100%;min-height:0;
  display:block;padding:0 0 32px;margin-inline:auto;
}
.cinema-room .favorites-cinema .media-film-focus {min-width:0;}
.cinema-room .detail[data-category=music] .favorites-cinema .media-cinema {
  width:100%;min-width:0;max-width:100%;aspect-ratio:16/9;
}
.cinema-room .favorites-cinema .media-cinema .media-cinema-poster {height:89%;width:50%;left:25%;object-fit:contain;}
.cinema-room .favorites-cinema .media-film-copy {display:block;box-sizing:border-box;}
.cinema-room .favorites-cinema .favorites-copy h3 {font-size:28px;line-height:1.2;letter-spacing:-.025em;}
.cinema-room .favorites-cinema .favorites-introduction {margin:10px 0 16px;font-size:17px;line-height:1.5;}
.cinema-room .favorites-cinema .favorites-byline {margin-top:12px;font-size:13px;color:#b7bfcc;}
.cinema-room .favorites-cinema .favorites-player {margin:0;}
.cinema-room .favorites-cinema .favorites-player iframe {width:100%;height:100%;border:0;border-radius:inherit;}
.cinema-room .detail[data-category=music] .favorites-cinema .media-cinema[data-player-provider=spotify] {aspect-ratio:auto;height:352px;}
.cinema-room .favorites-cinema .favorites-suggestion {width:100%;margin:20px auto 0;color:#f0edf7;}
.cinema-room .favorites-cinema.cinema-watching .favorites-suggestion {display:none;}
.fav-carousel-controls {min-width:0;margin:12px auto 0;color:#f5f0e9;}
.fav-transport {display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;align-items:center;}
.fav-carousel-controls button,.fav-carousel-controls a {min-height:44px;box-sizing:border-box;color:inherit;font:inherit;}
.fav-transport>button {height:44px;padding:8px;border:1px solid #ffffff35;border-radius:50%;background:#ffffff08;font-size:23px;}
.fav-scroll-list {height:106px;min-width:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-width:none;border-radius:10px;background:#ffffff07;}
.fav-scroll-list::-webkit-scrollbar {display:none;}
.fav-current-song {position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;width:100%;height:100%;box-sizing:border-box;padding:12px 54px 12px 14px;scroll-snap-align:start;scroll-snap-stop:always;}
.fav-current-song strong {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:18px;line-height:1.3;font-weight:600;overflow-wrap:anywhere;}
.fav-current-song>span {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c1b7ae;font-size:14px;line-height:1.4;}
.fav-current-song>small {position:absolute;right:10px;top:14px;color:#b7bfcc;font-size:11px;font-variant-numeric:tabular-nums;}
.fav-swipe-help {display:none;margin:6px 0 0;text-align:center;color:#b7bfcc;font-size:12px;}
.fav-player-footer {display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;min-width:0;}
.fav-player-footer output {flex:1 1 160px;color:#b7bfcc;font-size:13px;line-height:1.4;overflow-wrap:anywhere;}
.fav-player-footer :is(a,button) {display:inline-flex;align-items:center;justify-content:center;padding:6px 0;background:transparent;border:0;font-size:13px;line-height:1.4;}
.fav-player-footer a {text-decoration:underline;text-underline-offset:4px;}
.fav-player-footer [data-fav-retry] {color:#efb16c;}
.fav-browser {margin-top:12px;border-block:1px solid #ffffff26;}
.fav-browser summary {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;cursor:pointer;list-style:none;font-weight:600;font-size:15px;}
.fav-browser summary::-webkit-details-marker {display:none;}
.fav-browser summary span {font-size:12px;color:#b7bfcc;font-weight:400;}
.fav-browser-body {padding:0 0 12px;}
.fav-browser input {width:100%;min-height:46px;margin:0 0 8px;padding:10px 12px;border:1px solid #ffffff35;border-radius:8px;background:#ffffff08;color:#f5f0e9;font:400 16px/1.4 Portfolio Hanken,system-ui,sans-serif;}
.fav-browser input::placeholder {color:#b7bfcc;opacity:1;}
.fav-track-list {max-height:min(360px,42dvh);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;}
.fav-track {display:flex;align-items:center;gap:12px;width:100%;min-height:62px;padding:10px 12px;border:0;border-radius:7px;background:transparent;color:#f5f0e9;text-align:left;font-family:inherit;}
.fav-track[aria-pressed=true] {background:#ffffff12;}
.fav-track[aria-pressed=true] .fav-track-number {color:#efb16c;font-weight:650;}
.fav-track[aria-pressed=true] strong {font-weight:650;}
.fav-track-number {flex:0 0 22px;font-size:12px;color:#b7bfcc;font-variant-numeric:tabular-nums;}
.fav-track>span:nth-child(2) {min-width:0;flex:1;}
.fav-track strong,.fav-track small {display:block;line-height:1.4;}
.fav-track strong {font-size:15px;font-weight:550;overflow-wrap:anywhere;}
.fav-track small {font-size:12px;color:#b7bfcc;}
.fav-track-provider {flex:none;}
.fav-no-results {padding:12px;color:#b7bfcc;font-size:14px;line-height:1.5;}
.favorites-room :is(.fav-scroll-list,a):focus-visible {outline:2px solid #efb16c;outline-offset:3px;}
:root[data-theme=light] .cinema-room .favorites-room {--fav-ink:#f5f0e9;--fav-muted:#c1b7ae;--fav-line:#ffffff2b;--fav-field:#ffffff09;}
:root[data-theme=light] .cinema-room :is(.favorites-spotify,.song-submit) {background:#f1e8dc;color:#25201b;}
@media(hover:hover) and (pointer:fine) {
 .fav-track:hover,.fav-transport>button:hover {background:#ffffff14;}
 .fav-player-footer :is(a,button):hover {color:#fff;}
}
@media(pointer:coarse) {.fav-swipe-help {display:block;}}
@media(min-width:801px) and (max-height:800px) {
 .cinema-room .detail[data-category=music] .media-films.favorites-cinema {width:min(100%,max(420px,calc((100dvh - 300px)*16/9)));}
}
/* The room takes its light from the song that plays (favorite-light.js): six pools of colour cast from the edges of
   the screen (--sx, --sy, --sw, --sh, in px), read from the same six zones of the video still. Each pool has its own
   strength (--a1..--a6): a grey picture leaves the room dark. Two layers, so a new song fades in over the old one.
   The script holds every colour under a brightness ceiling, so the controls stay readable on any song. */
.fav-light {position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;--sx:0;--sy:0;--sw:0;--sh:0;}
.fav-light span {
  --side:ellipse calc(var(--sw) * .28px + 90px) calc(var(--sh) * .46px + 60px);
  --edge:ellipse calc(var(--sw) * .42px + 40px) calc(var(--sh) * .2px + 60px);
  --left:calc(var(--sx) * 1px + 8px);--right:calc((var(--sx) + var(--sw)) * 1px - 8px);
  --high:calc((var(--sy) + var(--sh) * .27) * 1px);--low:calc((var(--sy) + var(--sh) * .73) * 1px);
  --middle:calc((var(--sx) + var(--sw) * .5) * 1px);
  position:absolute;inset:0;opacity:0;transition:opacity 1800ms cubic-bezier(.3,.6,.2,1);
  background:
    radial-gradient(var(--side) at var(--left) var(--high),rgb(var(--l1,0 0 0) / var(--a1,0)),rgb(var(--l1,0 0 0) / calc(var(--a1,0) * .42)) 42%,rgb(var(--l1,0 0 0) / calc(var(--a1,0) * .1)) 74%,transparent),
    radial-gradient(var(--side) at var(--left) var(--low),rgb(var(--l2,0 0 0) / var(--a2,0)),rgb(var(--l2,0 0 0) / calc(var(--a2,0) * .42)) 42%,rgb(var(--l2,0 0 0) / calc(var(--a2,0) * .1)) 74%,transparent),
    radial-gradient(var(--side) at var(--right) var(--high),rgb(var(--l3,0 0 0) / var(--a3,0)),rgb(var(--l3,0 0 0) / calc(var(--a3,0) * .42)) 42%,rgb(var(--l3,0 0 0) / calc(var(--a3,0) * .1)) 74%,transparent),
    radial-gradient(var(--side) at var(--right) var(--low),rgb(var(--l4,0 0 0) / var(--a4,0)),rgb(var(--l4,0 0 0) / calc(var(--a4,0) * .42)) 42%,rgb(var(--l4,0 0 0) / calc(var(--a4,0) * .1)) 74%,transparent),
    radial-gradient(var(--edge) at var(--middle) calc(var(--sy) * 1px + 6px),rgb(var(--l5,0 0 0) / calc(var(--a5,0) * .7)),rgb(var(--l5,0 0 0) / calc(var(--a5,0) * .26)) 46%,transparent),
    radial-gradient(var(--edge) at var(--middle) calc((var(--sy) + var(--sh)) * 1px - 6px),rgb(var(--l6,0 0 0) / calc(var(--a6,0) * .8)),rgb(var(--l6,0 0 0) / calc(var(--a6,0) * .3)) 46%,transparent);
}
.fav-light span.is-lit {opacity:1;}
.motion-paused .fav-light span {transition:none;}
@media(prefers-reduced-motion:reduce) {.fav-light span {transition:none;}}
/* Wide screens, watching: the film room's screen with one quiet line under it. */
@media(min-width:801px) {
 .cinema-room .detail[data-category=music] .media-films.favorites-cinema.cinema-watching {
  /* 104px below keeps the control line clear of the fixed sound pill. */
  --cinema-view-height:calc(100dvh - clamp(72px,9dvh,92px) - 104px);
  --fav-screen-height:calc(var(--cinema-view-height) - 54px);
  width:min(1400px,100%,calc(var(--fav-screen-height)*16/9));min-height:var(--cinema-view-height);padding:0;
  display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;align-content:center;
 }
 .cinema-room .detail[data-category=music] .media-films.favorites-cinema.cinema-watching:has(.media-cinema[data-player-provider=spotify]) {width:min(100%,960px);}
 .cinema-room .favorites-cinema.cinema-watching .media-film-focus {grid-column:1/-1;}
 .cinema-room .favorites-cinema.cinema-watching .fav-carousel-controls:not([hidden]) {grid-column:1;display:flex;flex-wrap:wrap;align-items:center;gap:0 20px;margin:10px 0 0;}
 .cinema-room .favorites-cinema.cinema-watching .fav-transport {flex:1 1 0;min-width:220px;max-width:620px;grid-template-columns:44px minmax(0,1fr) 44px;gap:2px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-transport>button {border-color:transparent;background:transparent;font-size:18px;color:#c9d0db;}
 .cinema-room .favorites-cinema.cinema-watching .fav-scroll-list {height:44px;border-radius:8px;background:transparent;}
 .cinema-room .favorites-cinema.cinema-watching .fav-current-song {flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;padding:0 8px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-current-song strong {display:block;flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-current-song>span {flex:0 1 auto;min-width:0;font-size:13px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-current-song>small {position:static;flex:none;margin-left:auto;font-size:12px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-player-footer {flex:none;max-width:100%;margin-left:auto;gap:0 16px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-player-footer output {flex:0 1 auto;}
 .cinema-room .favorites-cinema.cinema-watching [data-fav-state=quiet] output {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
 /* A message gets its own line on the left, away from the sound pill. */
 .cinema-room .favorites-cinema.cinema-watching .fav-carousel-controls:not([data-fav-state=quiet]) .fav-player-footer {flex:1 0 100%;margin-left:0;}
 .cinema-room .favorites-cinema.cinema-watching .fav-browser {grid-column:2;align-self:start;margin:10px 0 0;border:0;}
 .cinema-room .favorites-cinema.cinema-watching .fav-browser summary {min-height:44px;gap:6px;font-size:13px;font-weight:400;color:#b7bfcc;}
 .cinema-room .favorites-cinema.cinema-watching .fav-browser summary span {font-size:13px;}
 .cinema-room .favorites-cinema.cinema-watching .fav-browser[open] {grid-column:1/-1;margin-top:6px;border-top:1px solid #ffffff26;}
 .cinema-room .favorites-cinema.cinema-watching .fav-browser[open] summary {color:#f5f0e9;}
}
@media(min-width:801px) and (hover:hover) and (pointer:fine) {
 .cinema-room .favorites-cinema.cinema-watching .fav-browser summary:hover {color:#fff;}
}
@media(max-width:700px) {
 .media-provider-fallback {left:8px;top:8px;font-size:12px;}
 .cinema-room .favorites-cinema :is(.fav-carousel-controls,.fav-browser,.favorites-suggestion) {width:calc(100% - 32px);margin-inline:auto;}
 .cinema-room .favorites-cinema .media-film-copy {padding-inline:16px;}
 .cinema-room .favorites-cinema .favorites-actions {flex-wrap:wrap;}
 .cinema-room .media-concerts .media-film-tile {width:96px;flex-basis:96px;}
 .fav-current-song {padding-right:44px;padding-left:12px;}
 .fav-current-song strong {font-size:16px;}
 .fav-current-song>span {font-size:13px;}
 .fav-current-song>small {right:8px;font-size:10px;}
 .fav-player-footer output {flex-basis:130px;}
}


/* bubble-app-v73.css */
/* Bubble, the Mac app: the largest home bubble and its own room.
   Position, physics, journey and optics stay with the existing home layers;
   this file only places and sizes the new bubble (and re-spaces the bottom row
   that All Time Favs left) and styles the room. */
.bubble-bubble{--tint:128 140 255;--color:#7d8cff;--delay:-3.6s;}
/* Wide screens: the left-middle slot, opposite Concerts. */
.home-ui-ready .scene .position-bubble{--bb:clamp(160px,min(15.5vw,25svh),224px);left:11%;top:52%;width:var(--bb);}
.home-ui-ready .scene .bubble-bubble .bubble-content:has(.world-art-main){grid-template-rows:56% 20% 11%;gap:0;}
.home-ui-ready .scene .bubble-bubble .bubble-content>.bubble-app-art{width:50%;height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 6px 10px #1d2a6b55);}
.scene .position-bubble .bubble-label{font-size:var(--label-l,24px);}
.scene .bubble-app-tag{font:600 clamp(10px,.85vw,12.5px)/1 Portfolio Hanken,system-ui,sans-serif;letter-spacing:.01em;color:#dfe6ff;opacity:.92;white-space:nowrap;align-self:start;}
:root[data-theme=light] .scene .bubble-app-tag{color:#2b3a86;}
/* Short desktop windows. */
@media(min-width:601px) and (min-height:501px) and (max-height:650px){
  .home-ui-ready .scene .position-bubble{--bb:clamp(150px,31svh,190px);left:6%;}
}
/* Portrait phones and tall tablets: Bubble takes the top middle; Stuff and Reads
   step aside. Concerts moves to the middle of the bottom row. */
@media(max-width:600px),(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .home-ui-ready .scene .position-bubble{--bb:min(calc(var(--l) * 1.27),18.5svh);left:50%;top:calc(var(--bb) / 2 + 2px);width:var(--bb);}
  .home-ui-ready .scene .position-apps{left:15%;}
  .home-ui-ready .scene .position-reads{left:85%;}
  .home-ui-ready .scene .position-concerts{left:50%;}
  /* Without All Time Favs: Collection and Play flank Concerts, below the two buttons. */
  .home-ui-ready .scene .position-music{left:20%;top:86%;}
  .home-ui-ready .scene .position-play{left:80%;top:86%;}
  .scene .position-bubble .bubble-label{font-size:clamp(13px,4.2vw,17px);}
  .scene .bubble-app-tag{font-size:clamp(8.5px,2.4vw,10.5px);}
}
/* Wider than a phone but still taller than 13:10 (a half-screen desktop window, a small tablet): the bottom middle
   belongs to the two buttons there, so Concerts stands beside the face, as it does on wide screens. */
@media(min-width:601px) and (max-aspect-ratio:13/10) and (min-height:651px){
  .home-ui-ready .scene .position-concerts{left:87%;top:47%;width:clamp(92px,min(13.5vw,15svh),150px);}
  /* A low window leaves less room above the face: Bubble gives way just enough not to touch it. */
  .home-ui-ready .scene .position-bubble{--bb:min(calc(var(--l) * 1.27),calc(18.5svh - max(0px,(880px - 100svh) * .09)));}
  /* Collection and Play stand clear of the two buttons between them. */
  .home-ui-ready .scene .position-music{left:18%;}
  .home-ui-ready .scene .position-play{left:83%;}
}
@media(max-width:600px) and (min-height:521px) and (max-height:700px){
  .home-ui-ready .scene .position-bubble{--bb:min(calc(var(--l) * 1.2),18.5svh);}
}
@media(max-width:420px) and (max-height:520px){
  .home-ui-ready .scene .position-bubble{--bb:78px;}
  .home-ui-ready .scene .bubble-bubble .bubble-content:has(.world-art-main){grid-template-rows:58% 24%;}
  .scene .bubble-app-tag{display:none;}
}
/* Short landscape phones: Bubble and Concerts share the row under the headline. */
@media(min-width:421px) and (max-width:950px) and (max-height:500px){
  .home-ui-ready .scene .position-bubble{--bb:96px;left:50%;top:88%;width:var(--bb);}
  .home-ui-ready .scene .position-concerts{left:31%;}
  .scene .position-bubble .bubble-label{font-size:15px;}
  .scene .bubble-app-tag{font-size:9px;}
}
@media(min-width:421px) and (max-width:799px) and (max-height:500px){
  .home-ui-ready .scene .position-bubble{--bb:88px;left:44%;}
  .home-ui-ready .scene .position-concerts{left:25%;}
}
/* Very short landscape phones have no row under the buttons: Bubble floats right
   of the headline and Concerts sits low on the left, clear of the sound bar. */
@media(min-width:421px) and (max-width:950px) and (max-height:370px){
  .home-ui-ready .scene .position-bubble{--bb:84px;left:calc(50% + 150px);top:calc(var(--bb) / 2 + 8px);}
}
@media(min-width:421px) and (max-width:700px) and (max-height:340px){
  .home-ui-ready .scene .position-concerts{left:calc(50% - 104px);top:calc(100% + 30px);}
  .home-ui-ready .scene .position-reads{left:93%;top:54%;}
}
/* The room. Its film is the site's own film player. */
.bubble-app{--ba-accent:#9cc0ff;--ba-ink:#0b1430;--ba-muted:color-mix(in srgb,currentColor 72%,transparent);--ba-line:color-mix(in srgb,currentColor 18%,transparent);
  display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);grid-template-areas:"film head" "film price" "film facts" "film req";grid-template-rows:auto auto auto 1fr;column-gap:clamp(28px,4vw,64px);row-gap:18px;align-items:start;
  width:100%;max-width:1320px;margin:0 auto;padding:clamp(8px,2vh,28px) 0 0;font-family:Portfolio Hanken,system-ui,sans-serif;}
.bubble-app-head{grid-area:head;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;}
.bubble-app-icon{grid-row:1/3;width:56px;height:56px;}
.bubble-app-kicker{margin:0;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ba-muted);}
.bubble-app h2{margin:0;font-family:Portfolio Bricolage,Portfolio Hanken,system-ui,sans-serif;font-size:clamp(34px,3.4vw,52px);line-height:1;letter-spacing:-.035em;font-weight:650;}
.bubble-app h2:focus{outline:none;}
.bubble-app-lede{grid-column:1/-1;margin:14px 0 0;max-width:34ch;font-size:clamp(16px,1.25vw,18px);line-height:1.5;}
.bubble-app-film{grid-area:film;container-type:inline-size;min-width:0;}
.bubble-app .game-film{--film-w:100%;height:auto;padding-bottom:0;flex-direction:column;}
.bubble-app .game-film-bar{width:var(--film-w);}
.bubble-app-price{grid-area:price;display:grid;justify-items:start;gap:6px;padding:18px 0 0;border-top:1px solid var(--ba-line);}
.bubble-app-amount{margin:0;font-size:20px;line-height:1.2;}
.bubble-app-amount strong{font-family:Portfolio Bricolage,Portfolio Hanken,system-ui,sans-serif;font-size:44px;font-weight:650;letter-spacing:-.03em;}
.bubble-app-terms{margin:0 0 10px;font-size:15px;color:var(--ba-muted);}
.bubble-app-buy{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;color:var(--ba-ink);background:var(--ba-accent);font-size:17px;font-weight:700;text-decoration:none;box-shadow:0 10px 28px -12px #000a;transition:transform 220ms cubic-bezier(.22,1,.36,1),filter 220ms ease;}
@media(hover:hover){.bubble-app-buy:hover{transform:translateY(-1px);filter:brightness(1.06);}}
.bubble-app-buy:active{transform:scale(.98);}
.bubble-app-key{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:inherit;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--ba-line);}
.bubble-app :is(.bubble-app-buy,.bubble-app-key):focus-visible{outline:3px solid #dce5f5;outline-offset:3px;}
.bubble-app-facts{grid-area:facts;display:grid;gap:10px;margin:0;padding:16px 0 0;list-style:none;border-top:1px solid var(--ba-line);}
.bubble-app-facts li{position:relative;padding-left:22px;font-size:15px;line-height:1.5;}
.bubble-app-facts li::before{content:'';position:absolute;left:2px;top:.5em;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--ba-accent);}
.bubble-app-req{grid-area:req;margin:0;font-size:13px;color:var(--ba-muted);}
.bubble-app-req a{color:inherit;text-underline-offset:3px;text-decoration-color:var(--ba-line);}
.bubble-app-needs{font-size:13px;}
/* Wide but short screens: the film is limited by height, so the price stays in view. */
@media(min-width:901px) and (max-height:700px){
  .bubble-app{grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);padding-top:4px;row-gap:12px;}
  .bubble-app-lede{margin-top:10px;font-size:16px;}
  .bubble-app-price{padding-top:12px;}
  .bubble-app-amount strong{font-size:36px;}
  .bubble-app-terms{margin-bottom:6px;}
}
/* One column on narrow screens: name, film, price, facts. */
@media(max-width:900px){
  .bubble-app{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "film" "price" "facts" "req";grid-template-rows:none;row-gap:22px;padding-top:4px;}
  .bubble-app-lede{max-width:none;}
  .bubble-app-price{grid-template-columns:1fr;justify-items:stretch;}
  .bubble-app-amount,.bubble-app-terms,.bubble-app-key{justify-self:start;}
  .bubble-app-buy{width:100%;}
}
/* Landscape phones keep the film beside the price. */
@media(max-width:900px) and (min-aspect-ratio:1/1) and (max-height:500px){
  .bubble-app{grid-template-areas:"film head" "film price" "film facts" "film req";grid-template-rows:auto auto auto 1fr;}
  .bubble-app-price{justify-items:start;}
  .bubble-app-buy{width:auto;}
  .bubble-app{grid-template-columns:minmax(0,1.1fr) minmax(240px,1fr);column-gap:22px;row-gap:8px;padding-top:0;}
  .bubble-app-kicker{display:none;}
  .bubble-app-icon{grid-row:1;width:34px;height:34px;}
  .bubble-app h2{font-size:26px;}
  .bubble-app-lede{margin-top:6px;font-size:13.5px;line-height:1.4;}
  .bubble-app-price{padding-top:8px;gap:2px;}
  .bubble-app-amount{font-size:16px;}
  .bubble-app-amount strong{font-size:26px;}
  .bubble-app-terms{margin-bottom:6px;font-size:13.5px;}
  .bubble-app-buy{min-height:46px;}
}
/* A vertical film is held to the screen height, centred. */
.bubble-app-vertical .game-film{--film-w:min(100%,calc(60svh * 9 / 16));}
.bubble-app-vertical .game-film-stage{width:var(--film-w)!important;aspect-ratio:9/16;margin-inline:auto!important;}
.bubble-app-vertical .game-film-frame,.bubble-app-vertical .game-film-frame::after{border-radius:14px!important;}
@media(prefers-reduced-motion:reduce){.bubble-app-buy{transition:none;}}


/* ambilight-v75.css */
/* One light for every player (ambilight-v75.js): a single fixed layer under the whole room.
   It is a canvas of at most 64 texels a side, laid out at that size and scaled to the window
   by the compositor, so nothing blurs or repaints at window size. It sits above the room's
   backdrop (.detail::before, z-index 1) and under everything else (.world-content, z-index 2). */
:root{
  --ambilight-strength:1;  /* the pools carry their own strength (ambilight-v75.js, favorite-light.js) */
  --ambilight-rest:.78;    /* paused or ended */
  --ambilight-breath:.8;   /* the low point of a YouTube light while it plays */
  --ambilight-rise:1.5s;
}
.ambilight{position:fixed;left:0;top:0;z-index:1;display:block;max-width:none;max-height:none;transform-origin:0 0;transform:scale(var(--ambilight-sx,1),var(--ambilight-sy,1));will-change:transform,opacity;pointer-events:none;user-select:none;opacity:0;transition:opacity var(--ambilight-rise) cubic-bezier(.22,1,.36,1);}
.ambilight[data-ambilight=still],.ambilight[data-ambilight=playing]{opacity:var(--ambilight-strength);}
.ambilight[data-ambilight=paused]{opacity:calc(var(--ambilight-strength) * var(--ambilight-rest));}
/* A YouTube picture cannot be read: its light is the video's still, and it breathes while the video plays. */
.ambilight[data-ambilight-source=poster][data-ambilight=playing]{animation:ambilight-breathe 6.5s ease-in-out 1.5s infinite alternate;}
@keyframes ambilight-breathe{from{opacity:var(--ambilight-strength);}to{opacity:calc(var(--ambilight-strength) * var(--ambilight-breath));}}
.ambilight.is-leaving{opacity:0!important;animation:none!important;transition-duration:420ms;}
.motion-paused .ambilight{transition:none;animation:none!important;}
@media(prefers-reduced-motion:reduce){.ambilight{transition:none;animation:none!important;}}
@media print{.ambilight{display:none;}}
/* A player's wide drop shadow is cut off by the scrolling stage and would show as a straight edge on the lit
   room. While the light is on, the shadow stays under the player, where nothing clips it. */
.detail:has(>.ambilight[data-ambilight]) :is(.game-film-frame,.media-cinema){box-shadow:0 34px 60px -30px #000a!important;}
/* A room whose top bar has its own dark band (the library) would cut the light off in a straight line under
   the bar. While the light is on, the bar is clear like in the film rooms and the light runs behind it. */
.detail:has(>.ambilight[data-ambilight]) .world-toolbar{background:none!important;}


/* player-bar-v76.css */
/* The site's own controls for a YouTube player ("Open on YouTube" and close) never sit on the player:
   YouTube's title, channel and controls stay free. They form a row directly above it, left and right,
   and the player gives up that row's height (and ends above the sound control, so that never sits on it either). The link's base style lives in listening-room-v72.css and
   the close button's in media.css and cinema-focus-v34.css; this sheet only moves them. */
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema){--player-bar:60px;--cinema-view-height:calc(100dvh - clamp(72px,9dvh,92px) - 96px - var(--player-bar));}
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-cinema{margin-top:var(--player-bar);}
/* While watching, everything but the player steps back (cinema-focus-v34.css). The line under the shelf was left
   behind there, half under the sound control; it steps back too, which gives the row its room. */
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-film-more{display:none;}
/* The row hangs outside the player's box, so the box may not clip; the frame keeps the rounded corners itself. */
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-film-video{overflow:visible;}
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-film-video iframe{border-radius:inherit;}
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-provider-fallback{top:auto;bottom:calc(100% + 10px);left:0;font-size:13px;}
.cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-video-close{top:auto;bottom:calc(100% + 8px);right:0;width:44px;height:44px;min-width:44px;min-height:44px;}
@media(max-width:600px){
  .cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema){--player-bar:56px;--cinema-view-height:calc(100dvh - 128px - var(--player-bar));}
  .cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-provider-fallback{left:12px;bottom:calc(100% + 6px);}
  .cinema-room .detail[data-category=music] .media-films.cinema-watching:not(.favorites-cinema) .media-video-close{right:12px;bottom:calc(100% + 6px);}
}
/* The collection library: "Close player" above the player, on the right, for a video and for a song or podcast embed. */
.collection-detail.is-playing .collection-detail-stage{overflow:visible;margin-top:58px;}
.collection-detail.is-playing .collection-detail-player{overflow:hidden;border-radius:12px;}
.collection-detail.is-playing .collection-detail-stop{top:auto;bottom:calc(100% + 8px);right:0;}