.live-screen-stage{position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none;--screen-text:#19233b;--screen-muted:#5c6980;--screen-line:#dfe5f0;--screen-card:#ffffffb8;--screen-accent:#2448ed;--screen-soft:#e5ebff;--screen-positive:#44886c;font-family:Inter,Arial,sans-serif;color:var(--screen-text)}
.live-web-surface,.live-phone-surface{position:absolute;left:0;top:0;transform-origin:0 0;overflow:hidden;background:transparent;backface-visibility:hidden}
.live-web-surface{border-radius:20px}.live-browser-bar{height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 35px;border-bottom:1px solid var(--screen-line);font-size:15px;color:var(--screen-muted)}.live-browser-dots{display:flex;gap:11px}.live-browser-dots i{width:12px;height:12px;border-radius:50%;background:#93a4c5}.live-browser-dots i:first-child{background:#f07775}.live-browser-dots i:nth-child(2){background:#e4ba68}.live-browser-dots i:nth-child(3){background:#77ac98}
.live-web-body{display:grid;grid-template-columns:175px minmax(0,1fr);height:674px}.live-nav{padding:34px 15px 0 19px;border-right:1px solid var(--screen-line)}.live-nav .live-brand{width:111px;height:33px;object-fit:contain;margin:0 9px 47px}.live-nav>div{display:flex;align-items:center;gap:12px;font-size:16px;padding:16px 11px;margin-bottom:15px;color:var(--screen-muted);border-radius:7px}.live-nav>div.active{color:var(--screen-accent);background:var(--screen-soft)}.live-nav svg{width:21px;height:21px;flex:none}
.live-web-content{padding:36px 90px 25px 37px;min-width:0}.live-web-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:37px}.live-web-heading h3{font-size:37px;line-height:1.15;letter-spacing:-.05em;font-weight:590;max-width:17ch}.live-avatar{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:50%;background:var(--screen-soft);color:var(--screen-accent);font-size:18px;font-weight:560}.live-list-label{display:flex;justify-content:space-between;gap:15px;padding:0 6px 14px;font-size:17px;color:var(--screen-muted)}.live-list-label strong{font-weight:500;color:var(--screen-text)}.live-project-list{display:grid;gap:12px}.live-row{display:flex;align-items:center;gap:18px;padding:20px 18px;background:var(--screen-card);border:1px solid var(--screen-line);border-radius:12px;min-height:98px}.live-service-icon{width:47px;height:47px;display:grid;place-items:center;background:var(--screen-soft);color:var(--screen-accent);border-radius:10px;flex:none}.live-service-icon svg{width:31px;height:31px}.live-row>div{min-width:0}.live-row strong{font-size:25px;font-weight:560;display:block;line-height:1.2;letter-spacing:-.025em}.live-row small{display:block;color:var(--screen-muted);font-size:13px;margin-top:6px}.live-status{margin-left:auto;display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:13px;color:var(--screen-muted)}.live-status i{width:8px;height:8px;display:block;border-radius:50%;background:var(--screen-accent);flex:none}.live-status.is-green i{background:var(--screen-positive)}
.live-workflow{margin-top:22px;border-top:1px solid var(--screen-line);padding:19px 3px 0}.live-workflow>strong{font-size:16px;font-weight:500}.live-workflow>div{display:flex;align-items:center;gap:16px;margin-top:13px;font-size:14px;color:var(--screen-muted)}.live-workflow span{background:var(--screen-soft);border-radius:5px;padding:8px 15px;color:var(--screen-accent)}.live-workflow b{font-weight:400;font-size:20px;color:var(--screen-accent)}
.live-phone-surface{border-radius:44px;padding:89px 22px 24px}.live-phone-heading>span{font-size:17px;color:var(--screen-muted)}.live-phone-heading h3{font-size:40px;font-weight:600;letter-spacing:-.05em;line-height:1.1;margin:17px 0 10px}.live-phone-heading p{font-size:18px;color:var(--screen-muted);line-height:1.5}.live-phone-rows{display:grid;gap:21px;margin-top:39px}.live-phone-row{display:flex;align-items:center;gap:13px;background:var(--screen-card);border:1px solid var(--screen-line);border-radius:17px;padding:24px 14px;min-height:113px}.live-phone-row>svg{width:30px;height:30px;color:var(--screen-accent);flex:none}.live-phone-row>div{min-width:0}.live-phone-row strong{font-size:22px;font-weight:550;letter-spacing:-.03em;display:block}.live-phone-row span{font-size:15px;color:var(--screen-muted);display:block;margin-top:7px}.live-phone-row>i{margin-left:auto;background:var(--screen-accent);width:7px;height:7px;border-radius:50%;flex:none}.live-phone-footer{margin-top:32px;text-align:center;font-size:14px;color:var(--screen-muted)}
html[data-appearance=night] .live-screen-stage{--screen-text:#e1e9fb;--screen-muted:#9daeca;--screen-line:#33415c;--screen-card:#202d44dc;--screen-accent:#91acff;--screen-soft:#293d67;--screen-positive:#82c7a6}
html[data-appearance=night] .live-brand{filter:brightness(0) invert(1)}
.intersection-house,.intersection-night{transition-duration:var(--scene-crossfade,950ms)}.live-screen-stage,.live-row,.live-phone-row,.live-service-icon,.live-nav>div,.live-workflow span{transition:color var(--scene-crossfade,950ms),background-color var(--scene-crossfade,950ms),border-color var(--scene-crossfade,950ms)}
.theme-shifting .intersection-seam-glint{animation-duration:var(--scene-signal,1150ms)}
.theme-shifting .live-status i,.theme-shifting .live-phone-row>i{animation:live-status-ready 1s ease-out 1;animation-delay:calc(var(--row-index,0)*90ms)}
.theme-shifting .live-workflow b{animation:live-flow-ready .8s ease-out 1;animation-delay:calc(var(--row-index,0)*120ms)}
@keyframes live-status-ready{0%,100%{transform:scale(1);opacity:1}35%{transform:scale(1.5);opacity:.5}}
@keyframes live-flow-ready{0%,100%{transform:translateX(0);opacity:.7}45%{transform:translateX(4px);opacity:1}}
html[data-scene-motion=off] .scene-motion{transform:none!important;transition:none}html[data-scene-motion=off] .intersection-seam-glint{display:none}html[data-scene-motion=off] .live-screen-stage *{animation:none!important}
@media(prefers-reduced-motion:reduce){.live-screen-stage,.live-screen-stage *{animation:none!important;transition:none!important}}
html[data-scene-motion=off],html[data-scene-motion=off] *{animation:none!important;transition:none!important}