/* Approved ByLilly signature details: original mascot, editorial separators. */
.contact-fab,.contact-fab:hover { width:auto !important;height:auto !important;max-width:calc(100vw - 24px);padding:0 !important;right:18px !important;bottom:16px !important;display:flex !important;flex-direction:row-reverse;align-items:center;gap:10px;color:var(--portfolio-ink) !important;background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important; }
.contact-fab .fab-mark { position:relative;flex:0 0 88px;width:88px !important;height:88px !important;animation:none !important; }
.contact-fab .fab-mark::before { display:none !important; }
.contact-fab .fab-ring { display:block !important;position:absolute;inset:0;width:100%;height:100%;animation:signature-ring 18s linear infinite !important; }
.contact-fab .fab-ring-text { font-family:var(--font-sans) !important;font-size:10px;letter-spacing:.16em; }
.contact-fab .fab-smiley { width:40px !important;height:40px !important; }
.contact-fab .fab-tip { display:block !important;background:var(--portfolio-accent) !important;color:#fff !important;font:600 .75rem/1.3 var(--font-sans) !important;letter-spacing:.025em !important;padding:11px 16px !important;border-radius:24px !important;box-shadow:none !important;transition:opacity 180ms ease,transform 180ms ease; }
.contact-fab .fab-tip::after { background:var(--portfolio-accent) !important; }
.contact-fab:is(:hover,:focus-visible) .fab-tip { opacity:1;transform:none; }
@keyframes signature-ring { to { transform:rotate(360deg); } }
.portfolio-band { position:relative;display:flex;align-items:center;width:100%;min-width:0;min-height:52px;margin:24px 0;background:var(--portfolio-ink);color:#fff;border:0;overflow:hidden; }
.portfolio-band-viewport { flex:1;min-width:0;overflow:hidden; }
.portfolio-band-track { display:flex;width:max-content;max-width:none;animation:none; }
body[data-band-ready="true"] .portfolio-band-track { animation:signature-line 48s linear infinite; }
.portfolio-band-group { display:flex;flex:0 0 auto;align-items:center;gap:24px;padding:12px 24px 12px 0;white-space:nowrap; }
.portfolio-band-group span { color:#fff !important;font:500 clamp(15px,1.25vw,18px)/1.5 var(--font-sans) !important;letter-spacing:.01em !important;text-transform:none !important; }
.portfolio-band-group .band-sep { font-size:20px !important; }
.band-pause { position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;min-width:44px;min-height:44px;margin-inline:4px 8px;padding:0;color:#fff;background:var(--portfolio-ink);border:1px solid #fff;font:500 16px/1 var(--font-sans); }
.band-pause[hidden] { display:none; }
.portfolio-band:is(:hover,:focus-within) .portfolio-band-track,.portfolio-band[data-paused="true"] .portfolio-band-track,.portfolio-band[data-offscreen="true"] .portfolio-band-track,.portfolio-band[data-document-hidden="true"] .portfolio-band-track { animation-play-state:paused; }
@keyframes signature-line { to { transform:translateX(-50%); } }
.motion-host { position:relative; }
.local-motion { position:absolute;right:0;bottom:-44px;z-index:4;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0;border:1px solid var(--portfolio-accent);background:#fff;color:var(--portfolio-accent);font:600 17px/1 var(--font-sans);opacity:0;pointer-events:none;transition:opacity 180ms ease; }
.motion-host:is(:hover,:focus-within)>.local-motion,.motion-host[data-local-paused="true"]>.local-motion { opacity:1;pointer-events:auto; }
.mark-wrap.motion-host { overflow:visible !important;margin-bottom:44px !important; }
.ambient-computer.motion-host { pointer-events:auto;overflow:visible;margin-bottom:44px !important; }
.signature .logo-motion { grid-column:2;grid-row:2 / span 3;width:340px;max-width:100%;align-self:center;justify-self:end;margin-bottom:44px; }
.signature .logo-motion .logo-stage { position:relative;width:100% !important;margin:0 !important; }
.logo-stage .logo-fallback { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:1; }
.logo-stage canvas { position:relative;display:block;opacity:0; }
.logo-stage[data-particles-ready="true"] canvas { opacity:1; }
.logo-stage[data-particles-ready="true"] .logo-fallback { opacity:0; }
[data-page="contacts"] .ct-hero-inner { display:block; }
[data-page="contacts"] .ct-hero-inner .ct-lead { margin-top:16px !important; }
[data-page="contacts"] .ct-brief-actions { margin-top:20px; }
[data-page="contacts"] .ct-final-inner { display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:center;gap:16px 40px !important;max-width:1160px; }
[data-page="contacts"] .ct-final-inner>:not(.ambient-computer) { grid-column:1; }
[data-page="contacts"] .ct-final .ambient-computer { grid-column:2;grid-row:1 / span 4;width:280px;max-width:100%;justify-self:end; }
[data-page="playground"] .pg-chapter { max-width:1160px !important;padding-block:24px !important; }
[data-page="playground"] :is(.opener-grid,.biskwit-cluster,.objects-grid,.motion-row) { display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;align-items:start;gap:40px 32px !important; }
[data-page="playground"] .interior-stack { max-width:340px !important; }
[data-page="playground"] .pc-frame { width:100%;height:auto !important;aspect-ratio:auto !important;background:transparent !important;border:0 !important;box-shadow:none !important;transform:none !important; }
[data-page="playground"] .pc-frame :is(img,video) { display:block;width:100% !important;height:auto !important;max-height:none !important;aspect-ratio:auto !important;object-fit:contain !important;background:transparent !important;border:0 !important;box-shadow:none !important; }
[data-page="playground"] .pc-cap { margin-top:12px; }
[data-page="playground"][data-playground-motion="ready"] .pc:not([hidden]) { opacity:0 !important;transform:translateY(16px) !important;transition:opacity 650ms cubic-bezier(.22,1,.36,1),transform 650ms cubic-bezier(.22,1,.36,1);transition-delay:var(--gallery-delay,0ms); }
[data-page="playground"][data-playground-motion="ready"] .pc.is-exhibited { opacity:1 !important;transform:none !important; }
.preview-expand { min-height:44px !important; }
.portfolio-trail { position:fixed;inset:0;z-index:1100;pointer-events:none;overflow:hidden; }
.portfolio-trail i { position:absolute;top:0;left:0;display:block;width:4px;height:4px;background:var(--portfolio-accent);border-radius:50%;opacity:0;pointer-events:none;transition:opacity 100ms linear; }
.portfolio-trail i:nth-child(2) { width:3px;height:3px; }
.portfolio-trail i:nth-child(3) { width:2px;height:2px; }
.sg-translation,.sg-kicker { color:var(--portfolio-ink) !important; }
.sg-cta { padding-block:8px; }
@media(hover:none),(pointer:coarse) { .local-motion { opacity:1;pointer-events:auto; } }
@media(max-width:760px) {
 .contact-fab,.contact-fab:hover { right:12px !important;bottom:12px !important;gap:8px; }
 .contact-fab .fab-mark { flex-basis:72px;width:72px !important;height:72px !important; }
 .contact-fab .fab-smiley { width:34px !important;height:34px !important; }
 .contact-fab .fab-tip { padding:9px 12px !important;font-size:.6875rem !important; }
 .portfolio-band { margin-block:20px; }
 .portfolio-band-group { gap:18px;padding-right:18px; }
 .signature .logo-motion { grid-column:1;grid-row:4;justify-self:center;width:280px; }
 [data-page="contacts"] .ct-final-inner { grid-template-columns:minmax(0,1fr);gap:16px !important; }
 [data-page="contacts"] .ct-final .ambient-computer { grid-column:1;grid-row:auto;width:220px;justify-self:center;margin-top:12px; }
 [data-page="playground"] :is(.opener-grid,.biskwit-cluster,.objects-grid,.motion-row) { grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:32px 20px !important; }
}
@media(max-width:420px) { [data-page="playground"] :is(.opener-grid,.biskwit-cluster,.objects-grid,.motion-row) { grid-template-columns:minmax(0,1fr) !important;max-width:284px;margin-inline:auto;gap:36px !important; } }
@media(prefers-reduced-motion:reduce) {
 .contact-fab .fab-ring,body[data-band-ready="true"] .portfolio-band-track { animation:none !important; }
 [data-page="playground"][data-playground-motion="ready"] .pc:not([hidden]) { opacity:1 !important;transform:none !important;transition:none !important; }
 .portfolio-trail { display:none; }
}

/* Approved refinement: black/white ribbons, local media controls and native artwork. */
.portfolio-band { color:#fff;border-block:1px solid #111;animation:band-tone 10s steps(1,end) infinite; }
.portfolio-band-group span { color:inherit !important;font-weight:800 !important;letter-spacing:.025em !important; }
.portfolio-band-group .band-sep { display:block;width:18px;height:10px;padding:0;color:inherit; }
.band-sep svg { display:block;width:18px;height:10px;fill:currentColor; }
.portfolio-band[data-offscreen="true"],.portfolio-band[data-document-hidden="true"] { animation-play-state:paused; }
.portfolio-band:is(:hover,:focus-within) .portfolio-band-track { animation-play-state:running; }
.portfolio-band[data-offscreen="true"] .portfolio-band-track,.portfolio-band[data-document-hidden="true"] .portfolio-band-track { animation-play-state:paused; }
@keyframes band-tone { 0%,100% { background:#111;color:#fff; } 50% { background:#fff;color:#111; } }
.local-motion,.local-sound { position:absolute;bottom:10px;right:10px;min-width:44px;min-height:44px;z-index:5;border:1px solid #b20f4d;background:#fff;color:#b20f4d;opacity:0;pointer-events:none;transition:opacity 160ms ease;font:600 15px/1.2 var(--font-sans); }
.local-sound { right:62px;padding:0 12px; }
.motion-host[data-local-paused="true"]>.local-motion { opacity:0;pointer-events:none; }
.motion-host:is(:hover,:focus-within)>.local-motion,.motion-host:is(:hover,:focus-within)>.local-sound { opacity:1;pointer-events:auto; }
.motion-host .local-motion:focus-visible,.motion-host .local-sound:focus-visible { outline:2px solid #111;outline-offset:3px; }
.mark-wrap.motion-host,.ambient-computer.motion-host,.signature .logo-motion { margin-bottom:0 !important; }
.preview-motion { position:relative;min-width:0; }
.preview-motion>a { display:block;width:100%; }
.preview-motion .local-motion { bottom:auto;top:10px; }
.ex-piece-frame { position:relative; }
.ex-piece-frame .preview-expand { position:absolute;top:8px;right:8px;min-width:44px;padding:8px;font:600 12px var(--font-sans);border:1px solid #111;background:#fff;color:#111;opacity:0;pointer-events:none; }
.ex-piece-frame:is(:hover,:focus-within) .preview-expand { opacity:1;pointer-events:auto; }
[data-page="3d-poster-series"] .ex-piece-frame .preview-expand { background:#fff !important;padding:8px 10px !important;text-decoration:none;border:0 !important; }
.ex-piece .meta { display:none; }
.ex-piece h3 { font:600 16px/1.3 var(--font-sans) !important; }
.contact-fab .fab-ring-text { font-size:10px !important;letter-spacing:0 !important; }
.contact-fab .fab-mark { background:rgba(255,255,255,.78);border-radius:50%; }
.portfolio-trail i { width:10px !important;height:4px !important;border-radius:0;clip-path:polygon(0 25%,20% 25%,20% 0,80% 0,80% 25%,100% 25%,100% 75%,80% 75%,80% 100%,20% 100%,20% 75%,0 75%); }
.portfolio-trail i:nth-child(even) { background:#111; }
[data-page="contacts"] .ct-final-inner>a { justify-self:start; }
[data-page="playground"] .pg-hero-meta { display:none; }
[data-page="playground"] .pg-hero-inner { max-width:1320px;padding-inline:clamp(24px,3vw,40px);box-sizing:border-box;gap:14px; }
[data-page="playground"] .pg-collage { display:flex;flex-wrap:wrap;align-items:start;gap:6px;max-width:1320px;margin:18px auto 28px;padding:0 clamp(12px,3vw,40px);box-sizing:border-box; }
[data-page="playground"] .pg-collage .pc { position:relative;flex:0 0 auto;width:calc(20% - 5px);min-width:0;margin:0 !important;overflow:hidden;cursor:zoom-in; }
[data-page="playground"] .pg-collage .pc-frame { margin:0 !important;display:block;width:100%;height:100% !important; }
[data-page="playground"] .pg-collage .pc-frame :is(img,video) { width:100% !important;height:100% !important;object-fit:contain !important; }
[data-page="playground"] .pg-collage .pc-cap { position:absolute;left:8px;top:8px;right:8px;margin:0;padding:7px 10px;background:#fff;color:#111;opacity:0;pointer-events:none;transition:opacity 180ms ease; }
[data-page="playground"] .pg-collage .pc-cap .fmt { display:none; }
[data-page="playground"] .pg-collage .pc-cap b { color:#111;font:600 13px/1.3 var(--font-sans); }
[data-page="playground"] .pg-collage .pc:is(:hover,:focus-visible,:focus-within) .pc-cap { opacity:1; }
[data-page="playground"] .pg-collage .pc:is(:hover,:focus-visible,:focus-within) { outline:2px solid #b20f4d;outline-offset:-2px; }
[data-page="playground"][data-playground-motion="ready"] .pg-collage .pc { transform:translateY(8px) !important;transition:opacity 500ms cubic-bezier(.22,1,.36,1),transform 500ms cubic-bezier(.22,1,.36,1); }
[data-page="playground"][data-playground-motion="ready"] .pg-collage .pc.is-exhibited { transform:none !important; }
[data-page="about"] .about-hero { display:block !important;width:100%;max-width:none;margin:0;padding:0 0 20px !important; }
[data-page="about"] .eyes-stage { display:block;position:relative !important;width:100% !important;height:clamp(190px,19vw,280px);aspect-ratio:auto;margin:0;background:transparent !important;overflow:hidden; }
[data-page="about"] .eyes-stage img { width:100% !important;height:100% !important;object-fit:cover !important;object-position:center; }
[data-page="about"] .hero-copy { position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;padding-top:22px !important;z-index:1;text-align:center;pointer-events:none; }
[data-page="about"] .hero-title { font-size:clamp(28px,3.3vw,46px) !important;color:#fff !important;line-height:1.1 !important;margin:0; }
.about-portrait { position:relative;display:block;width:144px;height:144px;object-fit:cover;object-position:55% 40%;border:5px solid #fff;border-radius:50%;margin:-68px auto 12px;z-index:2;box-sizing:border-box; }
[data-page="about"] .about-hero>.hero-sub { margin:8px auto 0;max-width:620px;padding-inline:24px;text-align:center;color:#111 !important;font:16px/1.5 var(--font-sans); }
[data-page="about"] .process-window { display:block !important;padding-block:20px !important; }
[data-page="about"] .process-frame { width:min(264px,100%);max-width:264px !important;aspect-ratio:auto;padding:12px 7px 8px;border-radius:24px;box-shadow:none;margin:0 auto !important; }
[data-page="about"] .process-frame::before { width:40px;height:3px;top:5px; }
[data-page="about"] .process-frame video { width:100%;height:auto !important;max-height:none !important;aspect-ratio:720 / 1558;object-fit:contain;border-radius:17px; }
.keyboard-overlay .key.is-relabelled { background:#eeeae1 !important;border:1px solid #aaa59b;border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 3px #f7f4ed; }
.key-label { color:#111;font:700 clamp(5px,.65vw,10px)/1.1 var(--font-sans);text-align:center;max-width:95%;overflow-wrap:anywhere; }
.key.is-relabelled:is(:hover,:focus-visible) { background:#f8dbe5 !important; }
.sg-section h2 { font:600 17px/1.3 var(--font-sans) !important;letter-spacing:0 !important;margin:0 0 14px !important;white-space:normal !important; }
.sg-section { padding-block:24px; }
.sg-visual { height:auto !important;max-width:1010px !important;margin:0 auto !important;background:transparent;border:0; }
.sg-section .sg-copy,.sg-section .sg-note { font:14px/1.5 var(--font-sans) !important;color:#281b1b !important;margin-top:14px;max-width:820px; }
.sg-palette { margin-top:0; }
.sg-swatch { min-height:84px;font:600 11px/1.4 var(--font-sans) !important;letter-spacing:0;text-transform:none; }
.sg-menu-preview { display:flex !important;flex-direction:column;align-items:center;gap:14px;margin:0; }
.sg-menu-preview>a { display:block;width:min(100%,420px); }
.sg-menu-preview img { display:block;width:100%;height:auto !important;max-height:none;object-fit:contain; }
.sg-menu-preview>p { align-self:flex-start; }
@media(max-width:760px) {
 [data-page="playground"] .pg-collage .pc { width:calc(50% - 3px); }
 .about-portrait { width:120px;height:120px;margin-top:-56px; }
 [data-page="about"] .about-hero>.hero-sub { font-size:15px; }
 .sg-menu-preview>a { width:min(100%,360px); }
}
@media(hover:none),(pointer:coarse) {
 .motion-host>.local-motion,.motion-host>.local-sound,.motion-host[data-local-paused="true"]>.local-motion { opacity:1;pointer-events:auto; }
 .ex-piece-frame .preview-expand { opacity:1;pointer-events:auto; }
 .local-sound { font-size:12px;padding-inline:8px; }
}
@media(prefers-reduced-motion:reduce) {
 .portfolio-band { animation:none !important;background:#fff;color:#111; }
 [data-page="playground"][data-playground-motion="ready"] .pg-collage .pc { opacity:1 !important;transform:none !important;transition:none !important; }
}