/* Mobile Works — Figma 5382:47996. Desktop geometry remains in works.css. */
:root{--rail:0px;--header:0px;--month:62.5px;--row:64px;--top:92px;--works-ui-font:14px}
#viewport{inset:0}
.rail{inset:auto 0 0;height:calc(64px + var(--safe-bottom));width:100%;padding:0 16px var(--safe-bottom);border:0;background:transparent;pointer-events:none!important}
.rail .identity{position:absolute;left:16px;top:11px;width:92px;height:44px;translate:none!important;transform:none;pointer-events:auto}
.identity>.static-identity{display:none}
.identity[data-live-logo=true]>.nav-glyph-box{display:block;margin-top:0}
.identity[data-live-logo=true]::after{content:none}
.identity::after{content:attr(data-label);position:absolute;left:0;top:15px;font:400 16px/1 'Courier New',monospace;white-space:nowrap}
.rail nav{position:static;writing-mode:horizontal-tb}
.rail nav button{font-size:14px;line-height:1;font-weight:400;pointer-events:auto}
#about{position:absolute;left:50%;top:10px;transform:translateX(-50%);min-height:44px;min-width:44px}
#language{position:fixed;right:16px;top:16px;min-height:21px;min-width:40px;line-height:21px;z-index:8}
#language::before{content:'';position:absolute;inset:-28px -28px -14px -38px;border-radius:50%;background:#ccc;filter:blur(22px);opacity:var(--rail-fill,0);z-index:-1;pointer-events:none}
#language::after{content:'';position:absolute;inset:-10px 0}
.month,.month.year{padding-top:24px;font-size:12px;line-height:1;color:rgb(0 0 0/.3)}
.project .bar-title{font-size:15px;line-height:1.04}.project .type{font-size:14px;line-height:1}
.cover-info .cover-name{font-size:15px;line-height:1;font-weight:500}.cover-info .cover-kind,.cover-info .cover-date{font-size:14px;line-height:1}
.cover-info>span{padding:8px}.cover-info .cover-kind{padding:4px 8px}
/* A single copy tree is reordered by layout; no duplicate mobile content. */
.project .expanded,.project.open .expanded{display:flex;flex-direction:column;gap:24px;padding:16px 16px 8px;height:calc(var(--panel-height) - 64px);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
.project .project-copy,.project .project-meta{display:contents}
.project .project-heading{order:1;flex:none;min-height:29px;width:var(--mobile-content-width);align-items:center;gap:24px}
.project-heading h2{font-size:24px;line-height:1.2;font-weight:500;letter-spacing:normal;overflow-wrap:normal}
.project .enter{width:24px;height:24px;flex:0 0 24px;mask-size:24px;position:relative}
.project .enter::after{content:'';position:absolute;inset:-10px}
.project .project-meta>.disciplines{order:2;flex:none;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 0;align-self:auto;align-content:start;width:var(--mobile-content-width);font-size:13px;line-height:14px;color:color-mix(in srgb,var(--surface-ink) 80%,transparent)}
.disciplines>span{white-space:nowrap;max-width:100%;overflow-wrap:normal}
.disciplines>span:not(:last-child)::after{content:'|';display:inline-block;font-weight:300;margin-inline:4px}
.project .project-media,.project .placeholder-art{order:3;flex:1 0 120px;min-height:120px;width:var(--mobile-content-width);height:auto;border:0;overflow:hidden}
.project .project-meta>div{order:4;display:flex;flex-direction:column;gap:8px;align-self:auto;flex:none;width:var(--mobile-content-width);font-size:14px;line-height:1.4;color:color-mix(in srgb,var(--surface-ink) var(--mobile-body-alpha,90%),transparent)}
.project-meta .summary{margin:0}.project-meta p{overflow-wrap:normal}
.mobile-collapse{display:block;position:absolute;right:16px;bottom:10px;width:24px;height:44px;color:var(--surface-ink);z-index:6;opacity:var(--detail-opacity,0);pointer-events:none}
.project.open .mobile-collapse{pointer-events:auto}
.mobile-collapse span::before,.mobile-collapse span::after{content:'';position:absolute;left:2px;top:21px;width:20px;height:1px;background:currentColor;transform:rotate(45deg)}
.mobile-collapse span::after{transform:rotate(-45deg)}
.mobile-card-open .rail .identity,.mobile-card-open #about,.ui-ready.works-controls-visible.mobile-card-open .controls{visibility:hidden;pointer-events:none}
/* Selected card reaches the bottom chrome. The shared top feather still protects dates. */
.mobile-card-open #projects{mask-image:linear-gradient(to bottom,transparent var(--mask-top),#000 calc(var(--mask-top) + 24px))!important}
.mobile-card-open .project.open{clip-path:none!important}
.controls{left:16px;right:16px;bottom:calc(20px + var(--safe-bottom))}
.filter-wrap{--filter-width:66.666667vw;--filter-slot-height:calc(64px + var(--safe-bottom))}
.filter-dismiss{position:absolute;inset:0;display:block;pointer-events:none}
.filter-wrap.is-open .filter-dismiss{pointer-events:auto}
.filter-surface{z-index:1}
#filters{top:0;bottom:var(--filter-slot-height);z-index:2}
#filters button{padding:20px 16px;min-height:60px;font-size:14px;line-height:1.4}
#filterClose{display:none}
#filterToggle{right:16px;bottom:calc(20px + var(--safe-bottom));width:24px!important;height:24px;z-index:2;justify-content:center;font-size:14px;line-height:1}
#filterToggle::after{content:'';position:absolute;inset:-10px}
#filterToggle #filterLabel{display:none}
#filterToggle .filter-mark{width:24px;height:24px;font-size:14px}
.menu-lines i{left:5px;top:11.5px;width:14px}
.filter-wrap.is-open #filterToggle{right:0;bottom:0;width:var(--filter-width)!important;height:var(--filter-slot-height);padding:20px 16px calc(20px + var(--safe-bottom));justify-content:space-between}
.filter-wrap.is-open #filterToggle #filterLabel{display:block}
.filter-wrap.is-open #filterToggle::after{inset:0}
.filter-wrap.is-open .filter-surface{pointer-events:none}
.hint{right:16px;bottom:calc(24px + var(--safe-bottom));font-size:14px}
/* The same global launcher uses tap-to-expand on touch, with artwork at rest. */
.player-artwork{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;opacity:1;transition:opacity 220ms;pointer-events:none}
.global-music #play{overflow:visible}
.global-music #play::after{content:'';position:absolute;inset:-4px;border-radius:50%}
.player-levels{position:absolute;width:18px;height:18px;left:9px;top:9px;color:#fff;filter:drop-shadow(0 1px 3px #0009);opacity:0;pointer-events:none;transition:opacity 220ms}
.global-music.is-playing:not(.expanded-player) .player-levels{opacity:1}
.global-music:not(.expanded-player) .player-play,.global-music:not(.expanded-player) .player-pause{opacity:0}
.global-music.expanded-player .player-artwork{opacity:0}
.music-flow{border-radius:50%;overflow:hidden}
.global-music:not(.expanded-player) .music-flow{opacity:0}
.music-close{width:16px;height:16px;top:0;margin-left:0}.dock-right .music-close{margin-left:0;margin-right:0}
.music-close::after{content:'';position:absolute;inset:-8px}
.music-close img{width:7px;height:7px}
.global-music.expanded-player::after{width:calc(var(--player-width) + 36px)}
#albumLink{position:relative}#albumLink::after{content:'';position:absolute;inset:-12px -6px}

.player-artwork{animation:player-cover-spin 24s linear infinite;animation-play-state:paused}
.global-music.is-playing .player-artwork{animation-play-state:running}
.global-music #play::before{content:'';position:absolute;inset:0;background:#0008;border-radius:50%;z-index:1;pointer-events:none;opacity:1;transition:opacity 220ms}
.global-music.expanded-player #play::before{opacity:0}
.global-music .player-levels{z-index:2}
@keyframes player-cover-spin{to{transform:rotate(360deg)}}
.rail .identity .nav-glyph-box,.rail .identity .nav-logo-guides{scale:1.16;transform-origin:left center}

@media(max-width:760px){.filter-wrap.is-open .filter-dismiss{pointer-events:none}}