/* Storyverse — clean Julia UI base
   Lockscreen + editable macOS-like home + reusable windows + Messages. */

@font-face{
  font-family:"Storyverse SF";
  src:local("SF Pro Text"),local("SF Pro Display"),local(".SF NS Text"),local(".SFNSText");
  font-style:normal;font-weight:100 900;font-display:swap;
}
html,body,#app,button,input,textarea,select{
  font-family:"Storyverse SF",-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
:root{
  --sv-radius:16px;
  --sv-shadow:0 16px 48px rgba(15,12,22,.18);
}
.julia-clean-root,.julia-desktop-home,.julia-lock{
  --sv-text:var(--u-text,#20182f);
  --sv-card:var(--u-card,#fff);
  --sv-accent:var(--u-accent,#8c6bc0);
  --sv-bg1:var(--u-bg1,#eeeaff);
  --sv-bg2:var(--u-bg2,#ffeef7);
  --sv-line:color-mix(in srgb,var(--sv-text) 10%,transparent);
  --sv-muted:color-mix(in srgb,var(--sv-text) 58%,transparent);
}
.theme-dark.julia-clean-root,.theme-dark.julia-desktop-home,.theme-dark.julia-lock{
  --sv-text:#f5f1fb;--sv-card:#211d29;--sv-line:rgba(255,255,255,.10);--sv-muted:rgba(240,235,246,.60);
  color-scheme:dark;
}

/* basic loading / future mobile home */
.julia-clean-root{min-height:100dvh;width:100%;display:grid;background:linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));color:var(--sv-text);overflow:hidden}
.julia-clean-main{min-height:100dvh;overflow:auto;padding:clamp(18px,4vw,52px);display:grid;place-items:center}
.julia-clean-start,.julia-clean-state{width:min(620px,100%);padding:clamp(24px,5vw,48px);border:1px solid var(--sv-line);border-radius:28px;background:color-mix(in srgb,var(--sv-card) 86%,transparent);box-shadow:0 20px 60px rgba(25,20,35,.08)}
.julia-clean-kicker{display:block;font-size:9px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;opacity:.54}
.julia-clean-start h1{margin:7px 0 10px;font-size:clamp(32px,6vw,62px);line-height:.95;letter-spacing:-.06em;font-weight:620}
.julia-clean-start p{max-width:520px;margin:0;font-size:12px;line-height:1.65;opacity:.68}
.julia-clean-state{text-align:center;display:grid;justify-items:center;gap:5px}.julia-clean-state strong{font-size:14px}.julia-clean-state p{font-size:10px;opacity:.6;margin:0}
.julia-clean-spinner{width:26px;height:26px;border-radius:50%;border:2px solid var(--sv-line);border-top-color:var(--sv-accent);animation:juliaSpin .8s linear infinite;margin-bottom:6px}
@keyframes juliaSpin{to{transform:rotate(360deg)}}

/* lockscreens */
.julia-lock{position:fixed;inset:0;overflow:hidden;background:linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));color:#fff;user-select:none;-webkit-user-select:none}
.julia-lock-wallpaper{position:absolute;inset:0;background-image:var(--julia-desktop-wallpaper),linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));background-size:cover;background-position:var(--julia-desktop-position,50% 50%);background-repeat:no-repeat}
.julia-mobile-lock .julia-lock-wallpaper{background-image:var(--julia-mobile-wallpaper),linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));background-position:var(--julia-mobile-position,50% 50%)}
.julia-lock-shade{position:absolute;inset:0;pointer-events:none}
.julia-desktop-lock .julia-lock-shade{background:linear-gradient(180deg,rgba(3,5,12,.05),rgba(3,5,12,.02) 45%,rgba(3,5,12,.20))}
.julia-desktop-status{position:absolute;left:0;right:0;top:0;height:27px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;z-index:2;color:rgba(255,255,255,.9);font-size:9px;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.julia-desktop-status>div{display:flex;align-items:center;gap:5px}.julia-desktop-status i{display:block;width:9px;height:6px;border-radius:2px;border:1px solid rgba(255,255,255,.82)}
.julia-desktop-status i:first-child{width:3px;height:3px;border-radius:50%;background:#fff;border:0}
.julia-desktop-clock{position:absolute;top:8%;left:50%;transform:translateX(-50%);z-index:2;text-align:center;text-shadow:0 3px 20px rgba(0,0,0,.34)}
.julia-desktop-clock span{display:block;font-size:clamp(15px,1.5vw,22px);font-weight:500;margin-bottom:4px;text-transform:capitalize}
.julia-desktop-clock strong{display:block;font-size:clamp(72px,8.2vw,132px);font-weight:420;letter-spacing:-.065em;line-height:.92}
.julia-desktop-user{position:absolute;left:50%;bottom:6.5%;transform:translateX(-50%);z-index:3;border:0;background:transparent;color:#fff;display:grid;justify-items:center;gap:5px;font:inherit;text-shadow:0 2px 10px rgba(0,0,0,.48);cursor:pointer}
.julia-user-avatar{width:70px;height:70px;border-radius:50%;overflow:hidden;display:grid;place-items:center;margin-bottom:3px;background:rgba(245,245,247,.24);border:1px solid rgba(255,255,255,.45);box-shadow:0 14px 40px rgba(0,0,0,.22);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.julia-user-avatar img{width:100%;height:100%;object-fit:cover}.julia-user-avatar>span{font-size:25px;font-weight:650}
.julia-desktop-user strong{font-size:13px;font-weight:650}.julia-desktop-user small{font-size:8px;opacity:.72}
.julia-desktop-user:hover .julia-user-avatar{transform:scale(1.035);box-shadow:0 16px 48px rgba(0,0,0,.28),0 0 0 3px rgba(255,255,255,.12)}
.julia-mobile-lock{touch-action:none;background:#000;--julia-swipe-y:0px;--julia-swipe-progress:0}
.julia-mobile-lock .julia-lock-shade{background:linear-gradient(180deg,rgba(0,0,0,.20),rgba(0,0,0,.03) 37%,rgba(0,0,0,.12) 73%,rgba(0,0,0,.35))}
.julia-mobile-lock-layer{position:absolute;inset:0;z-index:2;transform:translate3d(0,var(--julia-swipe-y),0);opacity:calc(1 - (var(--julia-swipe-progress) * .28));transition:transform .24s cubic-bezier(.22,.76,.25,1),opacity .2s ease}
.julia-mobile-lock.is-dragging .julia-mobile-lock-layer{transition:none}.julia-mobile-lock.is-unlocking .julia-mobile-lock-layer{transition:transform .26s cubic-bezier(.22,.76,.25,1),opacity .18s ease}
.julia-mobile-status{height:46px;padding:9px max(15px,env(safe-area-inset-left)) 0;display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:600;text-shadow:0 1px 5px rgba(0,0,0,.6)}
.julia-mobile-status>div{display:flex;align-items:center;gap:4px}.julia-mobile-status b{font-size:9px}
.julia-mobile-status .signal{width:14px;height:9px;background:linear-gradient(to right,#fff 0 17%,transparent 17% 26%,#fff 26% 43%,transparent 43% 52%,#fff 52% 69%,transparent 69% 78%,#fff 78%);clip-path:polygon(0 100%,0 72%,20% 72%,20% 52%,43% 52%,43% 32%,66% 32%,66% 12%,100% 12%,100% 100%)}
.julia-mobile-status .battery{width:17px;height:8px;border:1px solid rgba(255,255,255,.92);border-radius:2px;position:relative}.julia-mobile-status .battery:before{content:'';position:absolute;left:1px;top:1px;bottom:1px;width:11px;border-radius:1px;background:#fff}.julia-mobile-status .battery:after{content:'';position:absolute;right:-3px;top:2px;width:2px;height:4px;border-radius:0 1px 1px 0;background:rgba(255,255,255,.85)}
.julia-mobile-clock{position:absolute;top:10.5%;left:0;right:0;text-align:center;text-shadow:0 3px 20px rgba(0,0,0,.42)}.julia-mobile-clock span{display:block;font-size:18px;font-weight:500;text-transform:capitalize;margin-bottom:4px}.julia-mobile-clock strong{display:block;font-size:clamp(76px,22vw,118px);font-weight:420;letter-spacing:-.075em;line-height:.92}
.julia-mobile-footer{position:absolute;left:0;right:0;bottom:max(8px,env(safe-area-inset-bottom));padding:0 27px 1px;display:grid;gap:18px}.julia-mobile-shortcuts{display:flex;align-items:center;justify-content:space-between}.julia-mobile-shortcuts>span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(25,25,27,.60);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-size:23px;box-shadow:0 8px 22px rgba(0,0,0,.14)}
.julia-swipe-hint{display:grid;justify-items:center;gap:6px;text-shadow:0 1px 5px rgba(0,0,0,.58)}.julia-swipe-hint small{font-size:9px;font-weight:600;opacity:calc(.72 - (var(--julia-swipe-progress) * .5))}.julia-swipe-hint i{display:block;width:122px;height:5px;border-radius:999px;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.38)}
@media(min-width:761px){.julia-mobile-lock{display:none}}@media(max-width:760px){.julia-desktop-lock{display:none}}

/* mac desktop base */
.julia-desktop-home{position:fixed;inset:0;overflow:hidden;color:#fff;background:#111;--window-bg:rgba(247,247,249,.95);--window-panel:rgba(239,239,242,.95);--window-line:rgba(40,40,45,.11);--window-text:#17171a;--window-muted:#85858b}
.theme-dark.julia-desktop-home{--window-bg:rgba(36,33,42,.96);--window-panel:rgba(43,40,49,.96);--window-line:rgba(255,255,255,.09);--window-text:#f5f4f7;--window-muted:#aaa7b1}
.julia-desktop-wallpaper{position:absolute;inset:0;background-image:var(--julia-desktop-wallpaper),linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));background-size:cover;background-position:var(--julia-desktop-position,50% 50%);background-repeat:no-repeat}
.julia-desktop-tint{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,18,.04),rgba(8,10,18,.01) 62%,rgba(8,10,18,.11));pointer-events:none}
.julia-mac-menubar{position:absolute;left:0;right:0;top:0;height:29px;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:rgba(28,29,35,.20);border-bottom:1px solid rgba(255,255,255,.09);backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px) saturate(1.35);text-shadow:0 1px 4px rgba(0,0,0,.32)}
.julia-menu-left,.julia-menu-right{display:flex;align-items:center;gap:12px;white-space:nowrap}.julia-menu-left{font-size:9px}.julia-menu-left strong{font-weight:700}.julia-menu-left span{font-weight:480}.julia-menu-logo{width:17px;height:17px;display:grid;place-items:center;border-radius:5px;background:rgba(255,255,255,.18);font-size:9px}
.julia-menu-right{font-size:9px;gap:7px}.julia-menu-right time{font-weight:600}.julia-menu-right>button{height:21px;border:0;border-radius:7px;padding:0 8px;background:transparent;color:#fff;font:inherit;font-size:8px}.julia-menu-right>button:hover,.julia-menu-right>button.active{background:rgba(255,255,255,.18)}
.julia-menu-wifi{font-size:13px;transform:rotate(-15deg)}.julia-menu-battery{font-size:9px}
.julia-desktop-canvas{position:absolute;left:0;right:0;top:29px;bottom:0;overflow:hidden}
.julia-home-workspace{position:absolute;inset:10px 14px 78px;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:16px;z-index:5;pointer-events:none}
.julia-home-workspace>*{pointer-events:auto}.julia-desktop-home.is-editing .julia-home-workspace{right:374px}
.julia-widget-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:64px;gap:10px;align-content:start;overflow:auto;padding:2px;scrollbar-width:none}.julia-widget-grid::-webkit-scrollbar{display:none}
.julia-icon-grid{display:grid;grid-template-columns:repeat(3,76px);grid-auto-rows:91px;justify-content:end;align-content:start;gap:6px 7px;overflow:auto;padding:3px 0 80px;scrollbar-width:none}.julia-icon-grid::-webkit-scrollbar{display:none}
.julia-add-first{grid-column:1/span 4;align-self:start;height:78px;border:1px dashed rgba(255,255,255,.34);border-radius:18px;background:rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(16px);font:inherit;font-size:9px}

/* desktop icons */
.julia-desktop-icon{position:relative;display:grid;justify-items:center;align-content:start}
.julia-desktop-icon>button:first-child{width:72px;border:0;background:transparent;color:#fff;display:grid;justify-items:center;gap:5px;padding:4px 2px;cursor:default}
.julia-desktop-appicon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.44),rgba(255,255,255,.12));border:1px solid rgba(255,255,255,.36);box-shadow:0 8px 20px rgba(6,6,10,.18),inset 0 1px 0 rgba(255,255,255,.40);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5)}
.julia-desktop-appicon svg{width:25px;height:25px}.julia-desktop-icon small{font-size:8px;max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.58)}
.julia-desktop-icon.is-editing{animation:juliaWiggle .22s ease-in-out infinite alternate;cursor:grab}.julia-desktop-icon.dragging{opacity:.55}
.julia-desktop-icon-remove{position:absolute;left:2px;top:1px;width:20px;height:20px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(24,22,28,.78);color:#fff;font-size:14px;display:grid;place-items:center;padding:0;z-index:3}
@keyframes juliaWiggle{from{transform:rotate(-.35deg)}to{transform:rotate(.35deg)}}

/* app icon variations */
.app-messages{background:linear-gradient(145deg,#58dc79,#25ad4d)!important}.app-gallery{background:linear-gradient(145deg,#ff9b96,#d997ea 48%,#74b8ff)!important}.app-notes{background:linear-gradient(180deg,#fff 0 30%,#ffd85a 31% 100%)!important;color:#3a331f!important}.app-music{background:linear-gradient(145deg,#ff6f91,#cf5de6)!important}.app-scenes{background:linear-gradient(145deg,#a98be8,#7557b8)!important}.app-calendar{background:linear-gradient(180deg,#fff 0 31%,#ef5e64 32% 100%)!important}.app-people{background:linear-gradient(145deg,#75baf4,#537bd7)!important}.app-phone{background:linear-gradient(145deg,#62dc82,#28ae52)!important}.app-gallery_feed{background:linear-gradient(145deg,#ff9a72,#e76ba7)!important}.app-instagram{background:linear-gradient(145deg,#f6a34d,#e15a9e 52%,#7b67dd)!important}.app-maps{background:linear-gradient(135deg,#7fd2b9 0 32%,#f4df7d 33% 54%,#6aa9ee 55% 100%)!important}.app-wallet{background:linear-gradient(145deg,#555966,#171923)!important}.app-theme{background:linear-gradient(145deg,#8f969f,#5e6470)!important}.app-universe{background:linear-gradient(145deg,#7a82dc,#9c67ca)!important}.app-finder{background:linear-gradient(135deg,#68c7ef 0 49%,#edf9ff 50% 100%)!important;color:#1f6688!important}.app-lock{background:linear-gradient(145deg,#f2f3f5,#bfc3ca)!important;color:#4a4e55!important}

/* widgets */
.julia-home-widget{position:relative;min-width:0}.julia-home-widget.size-small{grid-column:span 2;grid-row:span 2}.julia-home-widget.size-medium{grid-column:span 4;grid-row:span 2}.julia-home-widget.size-large{grid-column:span 6;grid-row:span 3}
.julia-home-widget>button:first-child{width:100%;height:100%;border-radius:22px;border:1px solid rgba(255,255,255,.25);background:color-mix(in srgb,var(--sv-card) 83%,transparent);color:var(--sv-text);padding:12px;display:grid;grid-template-rows:auto minmax(0,1fr);text-align:left;overflow:hidden;box-shadow:0 12px 34px rgba(8,7,12,.13);backdrop-filter:blur(24px) saturate(1.28);-webkit-backdrop-filter:blur(24px) saturate(1.28)}
.theme-dark .julia-home-widget>button:first-child{background:rgba(28,26,33,.90);border-color:rgba(255,255,255,.09)}
.julia-home-widget header{display:flex;align-items:center;gap:6px}.julia-home-widget header>span{width:21px;height:21px;border-radius:7px;display:grid;place-items:center;background:color-mix(in srgb,var(--sv-accent) 14%,var(--sv-card));color:var(--sv-accent)}.julia-home-widget header svg{width:12px;height:12px}.julia-home-widget header strong{font-size:8px}.julia-widget-body{min-height:0;padding-top:7px}
.julia-home-widget.is-editing{animation:juliaWiggle .22s ease-in-out infinite alternate;cursor:grab}.julia-home-widget.dragging{opacity:.55}
.julia-widget-edit-controls{position:absolute;left:7px;right:7px;top:7px;z-index:5;display:flex;justify-content:space-between;pointer-events:none}.julia-widget-edit-controls button{pointer-events:auto;min-width:22px;height:22px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(24,22,28,.80);color:#fff;padding:0 7px;font-size:7px}.julia-widget-edit-controls button:first-child{width:22px;padding:0;font-size:14px}
.julia-widget-empty{height:100%;display:grid;place-content:center;text-align:center;gap:2px;color:var(--sv-muted)}.julia-widget-empty strong{font-size:10px;color:var(--sv-text)}.julia-widget-empty span{font-size:7px}
.julia-widget-clock{height:100%;display:grid;grid-template-columns:62px 1fr;gap:10px;align-items:center}.clock-face{width:58px;height:58px;border-radius:50%;background:color-mix(in srgb,var(--sv-card) 92%,#fff);border:1px solid var(--sv-line);position:relative}.clock-face:before{content:'12';position:absolute;top:4px;left:50%;transform:translateX(-50%);font-size:8px;color:var(--sv-muted)}.clock-face i{position:absolute;left:50%;bottom:50%;transform-origin:50% 100%;background:var(--sv-text);border-radius:4px}.clock-face .h{height:16px;width:2px;transform:translateX(-50%) rotate(var(--wh))}.clock-face .m{height:21px;width:1px;transform:translateX(-50%) rotate(var(--wm))}.clock-face b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:5px;height:5px;border-radius:50%;background:var(--sv-accent)}
.julia-widget-clock>div:last-child{display:grid}.julia-widget-clock span{font-size:7px;color:var(--sv-muted)}.julia-widget-clock strong{font-size:20px;letter-spacing:-.05em}
.julia-widget-events{display:grid;gap:5px}.julia-widget-events>div{display:grid;grid-template-columns:34px 1fr;gap:7px;align-items:center}.julia-widget-events time{display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--sv-accent) 13%,var(--sv-card));color:var(--sv-accent);padding:4px 2px}.julia-widget-events time b{font-size:11px}.julia-widget-events time small{font-size:6px;text-transform:uppercase}.julia-widget-events p{display:grid;min-width:0;margin:0}.julia-widget-events p strong{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.julia-widget-events p span{font-size:7px;color:var(--sv-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.julia-widget-photo{position:absolute;inset:0}.julia-widget-photo img{width:100%;height:100%;object-fit:cover}.julia-widget-photo span{position:absolute;left:8px;right:8px;bottom:8px;padding:7px 8px;border-radius:11px;background:rgba(255,255,255,.80);color:#17171a;display:grid;backdrop-filter:blur(12px)}.julia-widget-photo strong{font-size:8px}.julia-widget-photo small{font-size:6px;opacity:.55}
.julia-widget-number{height:100%;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto;align-items:end}.julia-widget-number>span{font-size:7px;color:var(--sv-muted)}.julia-widget-number>strong{grid-column:1;font-size:38px;line-height:.88;letter-spacing:-.07em}.julia-widget-number>small{grid-column:1;font-size:7px;color:var(--sv-muted)}.julia-widget-number>i{grid-column:2;grid-row:2/4;width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:var(--sv-accent);color:#fff;font-style:normal}.julia-widget-number svg{width:16px;height:16px}
.julia-widget-scenes{display:grid;gap:4px}.julia-widget-scenes>div{display:grid;grid-template-columns:8px 1fr;gap:6px;align-items:center;padding:4px 0;border-bottom:1px solid var(--sv-line)}.julia-widget-scenes>div:last-child{border:0}.julia-widget-scenes i{width:7px;height:7px;border-radius:50%;background:var(--sv-muted)}.julia-widget-scenes i.live{background:#55c56d;box-shadow:0 0 0 4px rgba(85,197,109,.12)}.julia-widget-scenes p{display:grid;min-width:0;margin:0}.julia-widget-scenes strong{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.julia-widget-scenes span{font-size:7px;color:var(--sv-muted)}
.julia-widget-notes{height:100%;display:grid;align-content:center}.julia-widget-notes>strong{font-size:38px;line-height:.9;letter-spacing:-.07em}.julia-widget-notes>span{font-size:8px;color:var(--sv-muted);margin-top:3px}.julia-widget-notes>p{font-size:8px;margin:8px 0 0;padding-top:7px;border-top:1px solid var(--sv-line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.julia-widget-music{height:100%;display:grid;grid-template-columns:52px 1fr 24px;gap:8px;align-items:center;min-width:0}.julia-widget-music>img,.julia-widget-music>i{width:52px;height:52px;border-radius:12px;object-fit:cover;display:grid;place-items:center;background:color-mix(in srgb,var(--sv-accent) 13%,var(--sv-card));font-style:normal;font-size:21px}.julia-widget-music>div{display:grid;min-width:0}.julia-widget-music span,.julia-widget-music small{font-size:7px;color:var(--sv-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.julia-widget-music strong{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.julia-widget-music>b{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:var(--sv-text);color:var(--sv-card);font-size:8px}
.julia-widget-message{height:100%;display:grid;grid-template-columns:45px 1fr;gap:9px;align-items:center}.julia-widget-message .julia-messages-avatar{width:45px;height:45px}.julia-widget-message>div{display:grid;min-width:0}.julia-widget-message span{font-size:7px;color:var(--sv-muted)}.julia-widget-message strong{font-size:9px}.julia-widget-message small{font-size:7px;color:var(--sv-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Dock */
.julia-mac-dock{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);z-index:950;display:flex;align-items:end;gap:6px;padding:7px 9px;border-radius:17px;background:rgba(235,239,246,.25);border:1px solid rgba(255,255,255,.34);box-shadow:0 14px 35px rgba(9,9,14,.20),inset 0 1px 0 rgba(255,255,255,.26);backdrop-filter:blur(24px) saturate(1.45);-webkit-backdrop-filter:blur(24px) saturate(1.45)}
.julia-dock-app{position:relative;width:48px;height:51px;border:0;background:transparent;color:#fff;padding:0;display:grid;place-items:center;cursor:pointer;transition:transform .14s ease}.julia-dock-app:hover{transform:translateY(-8px) scale(1.12)}
.julia-dock-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.34);box-shadow:0 7px 15px rgba(5,5,10,.18),inset 0 1px 0 rgba(255,255,255,.38);background:linear-gradient(145deg,rgba(255,255,255,.50),rgba(255,255,255,.13));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.julia-dock-icon svg{width:22px;height:22px}
.julia-dock-app small{position:absolute;bottom:58px;left:50%;transform:translate(-50%,5px);opacity:0;pointer-events:none;padding:4px 7px;border-radius:6px;background:rgba(28,28,32,.82);font-size:7px;color:#fff;white-space:nowrap;transition:.12s}.julia-dock-app:hover small{opacity:1;transform:translate(-50%,0)}
.julia-dock-app>i{position:absolute;bottom:-3px;width:4px;height:4px;border-radius:50%;background:#fff}.julia-dock-separator{width:1px;height:38px;background:rgba(255,255,255,.34);margin:0 2px}
.julia-desktop-home.is-editing .julia-dock-app[draggable="true"]{animation:juliaWiggle .22s ease-in-out infinite alternate;cursor:grab}

/* reusable window manager */
.julia-mac-window{position:absolute;min-width:430px;min-height:300px;z-index:500;overflow:hidden;border-radius:15px;background:var(--window-bg);color:var(--window-text);border:1px solid rgba(255,255,255,.62);box-shadow:0 30px 90px rgba(8,7,12,.30),0 3px 12px rgba(8,7,12,.15);display:grid;grid-template-rows:43px minmax(0,1fr)}
.theme-dark .julia-mac-window{border-color:rgba(255,255,255,.12)}
.julia-mac-window.is-maximized{left:8px!important;right:8px!important;top:8px!important;bottom:68px!important;width:auto!important;height:auto!important}
.julia-window-titlebar{height:43px;display:grid;grid-template-columns:92px 1fr 120px;align-items:center;padding:0 12px;background:color-mix(in srgb,var(--window-bg) 94%,transparent);border-bottom:1px solid var(--window-line);cursor:grab;user-select:none}.julia-window-titlebar:active{cursor:grabbing}
.julia-traffic{display:flex;gap:7px}.julia-traffic button{width:12px;height:12px;border:0;border-radius:50%;padding:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}.julia-traffic .close{background:#ff5f57}.julia-traffic .minimize{background:#febc2e}.julia-traffic .maximize{background:#28c840}
.julia-window-title{display:flex;align-items:center;justify-content:center;gap:7px}.julia-window-title>span{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;background:color-mix(in srgb,var(--window-text) 8%,transparent)}.julia-window-title svg{width:14px;height:14px}.julia-window-title strong{font-size:10px;font-weight:650}
.julia-window-universe{text-align:right;font-size:8px;color:var(--window-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.julia-window-content{min-height:0;overflow:auto;background:var(--window-bg);scrollbar-width:thin}.julia-window-content-messages{overflow:hidden}
.julia-window-resize{position:absolute;z-index:15}.resize-n{left:12px;right:12px;top:-3px;height:7px;cursor:n-resize}.resize-s{left:12px;right:12px;bottom:-3px;height:7px;cursor:s-resize}.resize-e{top:12px;bottom:12px;right:-3px;width:7px;cursor:e-resize}.resize-w{top:12px;bottom:12px;left:-3px;width:7px;cursor:w-resize}.resize-ne{top:-3px;right:-3px;width:13px;height:13px;cursor:ne-resize}.resize-nw{top:-3px;left:-3px;width:13px;height:13px;cursor:nw-resize}.resize-se{bottom:-3px;right:-3px;width:16px;height:16px;cursor:se-resize}.resize-sw{bottom:-3px;left:-3px;width:16px;height:16px;cursor:sw-resize}

/* generic future app reference */
.julia-app-placeholder{padding:28px;min-height:100%;background:var(--window-bg)}.julia-placeholder-hero{display:flex;align-items:center;gap:14px;padding-bottom:22px;border-bottom:1px solid var(--window-line)}.julia-placeholder-hero>span{width:58px;height:58px;border-radius:15px;display:grid;place-items:center;background:color-mix(in srgb,var(--sv-accent) 13%,var(--window-bg));color:var(--sv-accent)}.julia-placeholder-hero svg{width:28px;height:28px}.julia-placeholder-hero>div{display:grid}.julia-placeholder-hero small{font-size:8px;color:var(--window-muted)}.julia-placeholder-hero h2{font-size:24px;letter-spacing:-.04em;margin:2px 0}.julia-placeholder-hero p{font-size:9px;color:var(--window-muted);margin:0}
.julia-placeholder-list{display:grid;gap:8px;padding-top:18px}.julia-placeholder-row{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--window-text) 4%,transparent)}.julia-placeholder-row>span{width:30px;height:30px;border-radius:9px;background:color-mix(in srgb,var(--sv-accent) 13%,var(--window-bg))}.julia-placeholder-row>div{display:grid}.julia-placeholder-row strong{font-size:9px}.julia-placeholder-row small{font-size:8px;color:var(--window-muted)}

/* Messages: independent list scroll + independent conversation scroll + persistent composer */
.julia-messages-layout{height:100%;min-height:0;display:grid;grid-template-columns:320px minmax(0,1fr);overflow:hidden}
.julia-messages-sidebar{min-width:0;min-height:0;background:var(--window-panel);border-right:1px solid var(--window-line);display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}
.julia-messages-search{margin:10px 10px 8px;height:31px;border-radius:8px;background:color-mix(in srgb,var(--window-text) 8%,transparent);display:flex;align-items:center;gap:6px;padding:0 9px;color:var(--window-muted)}.julia-messages-search svg{width:13px;height:13px}.julia-messages-search input{flex:1;min-width:0;border:0!important;background:transparent!important;outline:0!important;font:inherit;font-size:9px;color:var(--window-text)!important;box-shadow:none!important;padding:0!important}
.julia-messages-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 6px 8px;scrollbar-width:thin}
.julia-message-conversation{width:100%;min-height:67px;border:0;background:transparent;color:var(--window-text);border-radius:10px;padding:7px 8px;display:grid;grid-template-columns:43px minmax(0,1fr) auto;gap:9px;align-items:center;text-align:left;cursor:pointer}.julia-message-conversation:hover{background:color-mix(in srgb,var(--window-text) 6%,transparent)}.julia-message-conversation.active{background:color-mix(in srgb,var(--window-text) 11%,transparent)}
.julia-messages-avatar{width:43px;height:43px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:color-mix(in srgb,var(--window-text) 12%,transparent);color:var(--window-muted);font-size:14px;font-weight:650;overflow:hidden}.julia-messages-avatar img{width:100%;height:100%;object-fit:cover}.julia-messages-avatar svg{width:20px;height:20px}
.julia-conversation-copy{display:grid;min-width:0;gap:3px}.julia-conversation-copy strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.julia-conversation-copy small{font-size:8px;color:var(--window-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}.julia-message-conversation time{font-size:7px;color:var(--window-muted);align-self:start;margin-top:4px}
.julia-messages-empty{padding:28px 16px;text-align:center;display:grid;gap:4px;color:var(--window-muted)}.julia-messages-empty strong{font-size:10px;color:var(--window-text)}.julia-messages-empty span{font-size:8px;line-height:1.4}
.julia-chat-panel{min-width:0;min-height:0;display:grid;grid-template-rows:43px minmax(0,1fr) auto auto;background:var(--window-bg);overflow:hidden}
.julia-chat-header{display:flex;align-items:center;gap:5px;padding:0 12px;border-bottom:1px solid var(--window-line);font-size:9px;background:var(--window-bg);z-index:2}.julia-chat-header>span{color:var(--window-muted)}.julia-chat-header>strong{font-weight:560}.julia-chat-header>button{margin-left:auto;width:25px;height:25px;border:0;border-radius:50%;background:transparent;color:var(--window-muted);font-size:16px}
.julia-message-stream{min-height:0;overflow-y:auto!important;overscroll-behavior:contain;padding:20px 20px 14px;display:flex;flex-direction:column;gap:5px;scrollbar-width:thin;background:var(--window-bg)}
.julia-message-stream .message-row{display:flex;flex-direction:column;align-items:flex-start;margin:1px 0;max-width:72%}.julia-message-stream .message-row.mine{align-self:flex-end;align-items:flex-end}
.julia-message-stream .bubble{max-width:100%;border:0!important;border-radius:18px!important;background:color-mix(in srgb,var(--window-text) 10%,var(--window-bg))!important;color:var(--window-text)!important;padding:7px 11px!important;font-size:10px!important;line-height:1.32!important;box-shadow:none!important}.julia-message-stream .bubble.me,.julia-message-stream .message-row.mine .bubble{background:#0a84ff!important;color:#fff!important}.julia-message-stream .bubble img{max-width:260px;border-radius:12px}
.julia-message-stream .message-row>small,.julia-message-stream .read-receipt{font-size:7px!important;color:var(--window-muted)!important;margin-top:2px!important}.julia-message-stream .v31-message-meta,.julia-message-stream .message-meta{font-size:6px!important;opacity:.55;margin-top:2px}
.julia-chat-empty{height:100%;display:grid;place-content:center;text-align:center;gap:4px;color:var(--window-muted)}.julia-chat-empty strong{font-size:13px;color:var(--window-text)}.julia-chat-empty span{font-size:9px}.julia-chat-empty-full{grid-row:1/-1}
#chat-photo-preview:empty{display:none}#chat-photo-preview{padding:7px 10px 0;background:var(--window-bg)}#chat-photo-preview .chat-photo-preview{display:inline-flex;position:relative}#chat-photo-preview img{height:68px;width:auto;border-radius:10px}#chat-photo-preview button{position:absolute;right:-6px;top:-6px;width:18px;height:18px;border-radius:50%;border:0;background:#555;color:#fff}
.julia-message-compose{min-height:48px;padding:7px 10px;border-top:1px solid var(--window-line);display:grid;grid-template-columns:28px 26px minmax(0,1fr) 28px;gap:5px;align-items:end;background:var(--window-bg);position:relative;z-index:3}
.julia-message-compose textarea{min-height:31px;max-height:96px;resize:none;border:1px solid color-mix(in srgb,var(--window-text) 16%,transparent)!important;background:color-mix(in srgb,var(--window-bg) 92%,#fff)!important;color:var(--window-text)!important;border-radius:17px!important;padding:7px 12px!important;font:inherit!important;font-size:9px!important;line-height:1.4!important;outline:none!important;box-shadow:none!important}
.julia-compose-add,.julia-send-message,.julia-message-compose .view-once-toggle{width:27px;height:27px;border:0;border-radius:50%;display:grid;place-items:center;padding:0;font:inherit}.julia-compose-add{background:color-mix(in srgb,var(--window-text) 9%,transparent);color:var(--window-muted);font-size:17px;cursor:pointer}.julia-message-compose .view-once-toggle{font-size:7px;background:color-mix(in srgb,var(--window-text) 9%,transparent);color:var(--window-muted)}.julia-message-compose .view-once-toggle.active{background:#0a84ff;color:#fff}.julia-send-message{background:#0a84ff;color:#fff;font-size:16px;font-weight:700;cursor:pointer}

/* Edit Home panel */
.julia-home-editor{position:absolute;right:10px;top:39px;bottom:78px;width:350px;z-index:880;border-radius:20px;background:color-mix(in srgb,var(--sv-card) 88%,rgba(255,255,255,.13));color:var(--sv-text);border:1px solid rgba(255,255,255,.30);box-shadow:0 22px 60px rgba(8,7,12,.22);backdrop-filter:blur(30px) saturate(1.4);-webkit-backdrop-filter:blur(30px) saturate(1.4);display:grid;grid-template-rows:auto auto auto minmax(0,1fr);overflow:hidden}
.theme-dark .julia-home-editor{background:rgba(31,28,37,.92);border-color:rgba(255,255,255,.11)}
.julia-home-editor>header{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px}.julia-home-editor>header>div{display:grid}.julia-home-editor>header small{font-size:7px;text-transform:uppercase;letter-spacing:.12em;color:var(--sv-muted)}.julia-home-editor>header strong{font-size:15px}.julia-home-editor>header span{font-size:7px;color:var(--sv-muted);margin-top:2px}.julia-home-editor>header button{height:30px;border:0;border-radius:9px;background:var(--sv-accent);color:#fff;padding:0 10px;font-size:8px;font-weight:700}
.julia-device-tabs,.julia-editor-tabs{display:flex;gap:5px;padding:0 12px 8px}.julia-device-tabs button,.julia-editor-tabs button{flex:1;height:30px;border:1px solid var(--sv-line);border-radius:9px;background:color-mix(in srgb,var(--sv-card) 82%,transparent);color:var(--sv-text);font-size:8px}.julia-device-tabs button.active,.julia-editor-tabs button.active{background:color-mix(in srgb,var(--sv-accent) 14%,var(--sv-card));border-color:color-mix(in srgb,var(--sv-accent) 40%,transparent);color:var(--sv-accent);font-weight:700}
.julia-editor-body{min-height:0;overflow:auto;padding:4px 12px 14px;scrollbar-width:thin}.julia-editor-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:9px 8px;border-bottom:1px solid var(--sv-line)}.julia-editor-app{display:flex;align-items:center;gap:8px;min-width:0}.julia-editor-app>span{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--sv-accent) 12%,var(--sv-card));color:var(--sv-accent)}.julia-editor-app svg{width:16px;height:16px}.julia-editor-app>div{display:grid;min-width:0}.julia-editor-app strong{font-size:9px}.julia-editor-app small{font-size:7px;color:var(--sv-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.julia-editor-check{display:grid;justify-items:center;gap:2px;font-size:6px;color:var(--sv-muted)}.julia-editor-check input{width:15px;height:15px;accent-color:var(--sv-accent)}
.julia-editor-widget-row{grid-template-columns:minmax(0,1fr) auto 74px}.julia-editor-widget-row select{height:28px;border:1px solid var(--sv-line);border-radius:8px;background:var(--sv-card);color:var(--sv-text);font-size:7px;padding:0 6px}
.julia-switch input{display:none}.julia-switch span{display:block;width:32px;height:18px;border-radius:999px;background:color-mix(in srgb,var(--sv-text) 18%,transparent);position:relative;transition:.15s}.julia-switch span:after{content:'';position:absolute;width:14px;height:14px;border-radius:50%;left:2px;top:2px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.16);transition:.15s}.julia-switch input:checked+span{background:var(--sv-accent)}.julia-switch input:checked+span:after{transform:translateX(14px)}
.julia-appearance section{padding:8px 0 14px;border-bottom:1px solid var(--sv-line)}.julia-appearance section:last-of-type{border:0}.julia-appearance h3{font-size:11px;margin:0 0 3px}.julia-appearance p{font-size:7px;color:var(--sv-muted);margin:0 0 10px}.julia-mode-buttons{display:grid;grid-template-columns:1fr 1fr;gap:6px}.julia-mode-buttons button{height:34px;border:1px solid var(--sv-line);border-radius:10px;background:var(--sv-card);color:var(--sv-text);font-size:8px}.julia-mode-buttons button.active{border-color:var(--sv-accent);background:color-mix(in srgb,var(--sv-accent) 12%,var(--sv-card));color:var(--sv-accent);font-weight:700}
.julia-color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:8px}.julia-color-grid label{display:grid;gap:3px;font-size:6px;color:var(--sv-muted);text-align:center}.julia-color-grid input{width:100%;height:34px;border:0;background:transparent;padding:0}
.julia-wall-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.julia-appearance-wall{display:grid;gap:6px}.julia-appearance-wall-head{display:flex;align-items:center;justify-content:space-between}.julia-appearance-wall-head>div{display:grid}.julia-appearance-wall-head strong{font-size:8px}.julia-appearance-wall-head small{font-size:6px;color:var(--sv-muted)}.julia-appearance-wall-head button{border:0;background:transparent;color:var(--sv-muted);font-size:6px}
.julia-wall-preview{height:90px;border-radius:12px;overflow:hidden;border:1px solid var(--sv-line);background:linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2))}.julia-wall-preview.mobile{height:118px}.julia-wall-preview>div{width:100%;height:100%;background-image:var(--preview-wall),linear-gradient(145deg,var(--sv-bg1),var(--sv-bg2));background-size:cover;background-position:var(--preview-pos,50% 50%)}
.julia-upload{height:29px;border:1px solid var(--sv-line);border-radius:9px;background:var(--sv-card);display:grid;place-items:center;font-size:7px;cursor:pointer}.julia-upload input{display:none}.julia-range{display:grid;grid-template-columns:48px 1fr 28px;align-items:center;gap:4px;font-size:6px;color:var(--sv-muted)}.julia-range input{width:100%;accent-color:var(--sv-accent)}.julia-range b{text-align:right;font-size:6px}.julia-save-appearance{width:100%;height:36px;border:0;border-radius:11px;background:var(--sv-accent);color:#fff;font-size:8px;font-weight:700;margin-top:10px}

/* responsive desktop */
@media(max-width:1120px) and (min-width:761px){
  .julia-home-workspace{grid-template-columns:minmax(0,1fr) 230px}.julia-icon-grid{grid-template-columns:repeat(2,76px)}
  .julia-messages-layout{grid-template-columns:270px minmax(0,1fr)}
  .julia-menu-left span:nth-of-type(n+4){display:none}
}
@media(max-width:900px) and (min-width:761px){
  .julia-home-editor{width:320px}.julia-desktop-home.is-editing .julia-home-workspace{right:344px}
  .julia-home-widget.size-large{grid-column:span 8}
}
@media(max-width:760px){.julia-desktop-home{display:none}}
@media(max-width:420px){.julia-mobile-clock{top:11%}.julia-mobile-clock span{font-size:16px}.julia-mobile-shortcuts>span{width:45px;height:45px}}

/* reduced motion */
@media(prefers-reduced-motion:reduce){
  .julia-mobile-lock-layer,.julia-desktop-user,.julia-dock-app,.julia-home-widget,.julia-desktop-icon{transition:none!important;animation:none!important}
}


/* Dark mode wallpaper dimming */
.theme-dark .julia-desktop-wallpaper,
.theme-dark .julia-desktop-lock .julia-lock-wallpaper,
.theme-dark .julia-mobile-lock .julia-lock-wallpaper{
  filter:brightness(.82);
}
.theme-dark .julia-desktop-tint{
  background:linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.14) 55%,rgba(0,0,0,.24));
}

/* Reliable edit-mode dragging */
.julia-desktop-home.is-editing .julia-desktop-icon,
.julia-desktop-home.is-editing .julia-home-widget,
.julia-desktop-home.is-editing .julia-dock-app[data-julia-dock]{
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}
.julia-desktop-home.is-editing .julia-desktop-icon,
.julia-desktop-home.is-editing .julia-home-widget,
.julia-desktop-home.is-editing .julia-dock-app[data-julia-dock]{
  cursor:grab;
}
.julia-desktop-home.is-editing .dragging{
  cursor:grabbing!important;
  opacity:.58!important;
  transform:scale(.96)!important;
  z-index:1200!important;
}

/* Message date separators: one per day, before the first message of that day */
.julia-message-stream .v31-day-separator{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:10px 0 6px;
  color:var(--window-muted);
  font-size:8px;
  font-weight:650;
}
.julia-message-stream .v31-day-separator:before,
.julia-message-stream .v31-day-separator:after{
  content:'';
  height:1px;
  flex:1;
  background:var(--window-line);
}
.julia-message-stream .v31-day-separator span{
  white-space:nowrap;
}

/* Message actions are context-menu / long-press only */
.julia-messages-window .v3632-message-action{
  display:none!important;
}

/* Presence dots in the conversation list */
.julia-messages-avatar-wrap{
  width:43px;
  height:43px;
  border-radius:50%;
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
}
.julia-messages-avatar-wrap>img.avatar,
.julia-messages-avatar-wrap>.julia-messages-avatar{
  width:43px!important;
  height:43px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  display:block;
}
.julia-messages-avatar-wrap>i{
  position:absolute;
  right:-1px;
  bottom:1px;
  width:11px;
  height:11px;
  border-radius:50%;
  border:2px solid var(--window-panel);
  background:#9a9aa1;
  box-sizing:border-box;
}
.julia-messages-avatar-wrap>i.online{background:#34c759}
.julia-messages-avatar-wrap>i.offline{background:#9a9aa1}

/* Typing indicator lives immediately above the composer */
.julia-chat-panel{
  grid-template-rows:43px minmax(0,1fr) auto auto auto;
}
.julia-typing-line{
  min-height:0;
  max-height:0;
  overflow:hidden;
  opacity:0;
  padding:0 14px;
  background:var(--window-bg);
  color:var(--window-muted);
  font-size:8px;
  font-weight:560;
  transition:max-height .16s ease,opacity .16s ease,padding .16s ease;
}
.julia-typing-line.active{
  max-height:26px;
  min-height:22px;
  opacity:1;
  padding:5px 14px 3px;
}

/* Feed app — central timeline only, no sidebar */
.julia-feed-app{
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:48px auto minmax(0,1fr);
  background:var(--window-bg);
  color:var(--window-text);
  overflow:hidden;
}
.julia-feed-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 14px;
  border-bottom:1px solid var(--window-line);
  background:color-mix(in srgb,var(--window-bg) 96%,transparent);
}
.julia-feed-header>strong{
  justify-self:center;
  font-size:11px;
  font-weight:700;
}
.julia-feed-header>button{
  justify-self:end;
  width:28px;
  height:28px;
  border:1px solid var(--window-line);
  border-radius:9px;
  background:color-mix(in srgb,var(--window-text) 5%,transparent);
  color:var(--window-text);
  font-size:17px;
  line-height:1;
}
.julia-feed-composer{
  width:min(680px,calc(100% - 28px));
  justify-self:center;
  margin:12px auto 0;
  padding:12px;
  border:1px solid var(--window-line);
  border-radius:14px;
  background:color-mix(in srgb,var(--window-bg) 96%,transparent);
  box-shadow:none;
}
.julia-feed-composer .composer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
}
.julia-feed-composer .composer-head>div{display:grid}
.julia-feed-composer .composer-head strong{font-size:10px}
.julia-feed-composer .composer-head small{font-size:7px;color:var(--window-muted)}
.julia-feed-composer .composer-head>button{
  width:24px;height:24px;border:0;border-radius:50%;background:transparent;color:var(--window-muted);font-size:15px
}
.julia-feed-composer textarea{
  width:100%;
  min-height:72px;
  resize:vertical;
  border:1px solid var(--window-line)!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--window-text) 4%,transparent)!important;
  color:var(--window-text)!important;
  padding:10px!important;
  font-size:10px!important;
  box-shadow:none!important;
}
.julia-feed-scroll{
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  display:grid;
  justify-items:center;
}
.julia-feed-column{
  width:min(720px,100%);
  min-height:100%;
  border-left:1px solid var(--window-line);
  border-right:1px solid var(--window-line);
  background:var(--window-bg);
}
.julia-feed-column .post{
  margin:0!important;
  border:0!important;
  border-bottom:1px solid var(--window-line)!important;
  border-radius:0!important;
  background:transparent!important;
  padding:15px 16px!important;
  box-shadow:none!important;
}
.julia-feed-column .post-head{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:start!important;
}
.julia-feed-column .v31-post-avatar,
.julia-feed-column .post-head>.avatar{
  width:42px!important;
  height:42px!important;
}
.julia-feed-column .post-meta{
  min-width:0!important;
}
.julia-feed-column .v31-post-meta-line,
.julia-feed-column .post-meta-line{
  margin-bottom:4px!important;
}
.julia-feed-column .v31-post-author,
.julia-feed-column .post-meta-line{
  font-size:9px!important;
}
.julia-feed-column .v31-post-author strong,
.julia-feed-column .post-meta-line strong{
  font-size:10px!important;
}
.julia-feed-column .v31-post-author span,
.julia-feed-column .post-meta-line span,
.julia-feed-column .v31-post-date{
  color:var(--window-muted)!important;
  font-size:7px!important;
}
.julia-feed-column .post-text{
  font-size:10px!important;
  line-height:1.45!important;
  margin:3px 0 9px!important;
}
.julia-feed-column .post-media{
  margin-top:8px!important;
}
.julia-feed-column .post-media img{
  width:100%!important;
  max-height:420px!important;
  object-fit:cover!important;
  border-radius:14px!important;
}
.julia-feed-column .post-actions{
  margin-top:9px!important;
  display:flex!important;
  gap:14px!important;
}
.julia-feed-column .post-action{
  border:0!important;
  background:transparent!important;
  color:var(--window-muted)!important;
  padding:3px 0!important;
  font-size:8px!important;
}
.julia-feed-empty{
  min-height:320px;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:4px;
  color:var(--window-muted);
}
.julia-feed-empty strong{font-size:12px;color:var(--window-text)}
.julia-feed-empty span{font-size:8px}

/* Feed app icon */
.app-feed{
  background:linear-gradient(145deg,#111,#34343b)!important;
  color:#fff!important;
}


/* Instagram — desktop experience inspired by the real web app */
.julia-window-content-instagram{
  overflow:hidden!important;
}
.julia-instagram{
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:50px minmax(0,1fr);
  background:var(--window-bg);
  color:var(--window-text);
  overflow:hidden;
}
.julia-ig-topbar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  padding:0 18px;
  border-bottom:1px solid var(--window-line);
  background:color-mix(in srgb,var(--window-bg) 97%,transparent);
}
.julia-ig-wordmark{
  font-family:"Storyverse SF",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  font-size:15px;
  font-weight:760;
  letter-spacing:-.035em;
}
.julia-ig-top-actions{
  display:flex;
  align-items:center;
  gap:7px;
}
.julia-ig-top-actions button,
.julia-ig-top-action,
.julia-ig-back{
  border:0;
  background:transparent;
  color:var(--window-text);
  font:inherit;
  cursor:pointer;
}
.julia-ig-top-actions button{
  width:29px;
  height:29px;
  border-radius:8px;
  font-size:17px;
  display:grid;
  place-items:center;
}
.julia-ig-top-actions button:hover{
  background:color-mix(in srgb,var(--window-text) 7%,transparent);
}

.julia-ig-layout{
  min-height:0;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,720px) 280px;
  justify-content:center;
  gap:38px;
  padding:0 24px;
}
.julia-ig-main{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
}
.julia-ig-stories{
  display:flex;
  gap:14px;
  overflow-x:auto;
  padding:14px 2px 12px;
  border-bottom:1px solid var(--window-line);
  scrollbar-width:none;
}
.julia-ig-stories::-webkit-scrollbar{display:none}
.julia-ig-story{
  width:67px;
  min-width:67px;
  border:0;
  background:transparent;
  color:var(--window-text);
  display:grid;
  justify-items:center;
  gap:5px;
  padding:0;
  cursor:pointer;
}
.julia-ig-story>span{
  width:58px;
  height:58px;
  border-radius:50%;
  padding:3px;
  background:conic-gradient(#d300c5,#ff3040,#ff8a00,#ffd600,#d300c5);
  position:relative;
  display:grid;
  place-items:center;
}
.julia-ig-story>span:after{
  content:'';
  position:absolute;
  inset:3px;
  border:2px solid var(--window-bg);
  border-radius:50%;
  pointer-events:none;
}
.julia-ig-story img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
}
.julia-ig-story small{
  width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:7px;
  text-align:center;
}
.julia-ig-story-self>span{
  background:color-mix(in srgb,var(--window-text) 12%,transparent);
  padding:2px;
}
.julia-ig-story-self>span:after{display:none}
.julia-ig-story-self i{
  position:absolute;
  right:-1px;
  bottom:1px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#0095f6;
  color:#fff;
  border:2px solid var(--window-bg);
  display:grid;
  place-items:center;
  font-style:normal;
  font-size:12px;
  z-index:2;
}
.julia-ig-story-empty{
  color:var(--window-muted);
  font-size:8px;
  padding:20px 4px;
}

.julia-ig-feed{
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  padding:12px 0 40px;
}
.julia-ig-feed .ig-post{
  width:min(100%,520px);
  margin:0 auto 20px!important;
  border:0!important;
  border-bottom:1px solid var(--window-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  padding-bottom:16px!important;
}
.julia-ig-feed .ig-post>header{
  min-height:43px;
  padding:0 4px 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  border:0!important;
  background:transparent!important;
}
.julia-ig-feed .ig-post>header>button:first-child{
  border:0!important;
  background:transparent!important;
  color:var(--window-text)!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  text-align:left!important;
}
.julia-ig-feed .ig-post>header img{
  width:32px!important;
  height:32px!important;
  border-radius:50%!important;
  object-fit:cover!important;
}
.julia-ig-feed .ig-post>header strong{
  font-size:9px!important;
  font-weight:700!important;
}
.julia-ig-feed .ig-post>header small{
  display:block!important;
  font-size:7px!important;
  color:var(--window-muted)!important;
  margin-top:1px!important;
}
.julia-ig-feed .social-menu-button{
  border:0!important;
  background:transparent!important;
  color:var(--window-text)!important;
  width:27px!important;
  height:27px!important;
  font-size:15px!important;
  padding:0!important;
  cursor:pointer;
}
.julia-ig-feed .ig-carousel{
  position:relative!important;
  width:100%!important;
  aspect-ratio:4/5!important;
  max-height:585px!important;
  overflow:hidden!important;
  border-radius:4px!important;
  background:#111!important;
}
.julia-ig-feed .ig-carousel>img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:none!important;
}
.julia-ig-feed .ig-carousel>img.active{display:block!important}
.julia-ig-feed .ig-prev,
.julia-ig-feed .ig-next{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:3!important;
  width:27px!important;
  height:27px!important;
  border:0!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.88)!important;
  color:#333!important;
  display:grid!important;
  place-items:center!important;
  font-size:18px!important;
  box-shadow:0 2px 8px rgba(0,0,0,.2)!important;
}
.julia-ig-feed .ig-prev{left:8px!important}
.julia-ig-feed .ig-next{right:8px!important}
.julia-ig-feed .ig-dots{
  position:absolute!important;
  left:50%!important;
  bottom:8px!important;
  transform:translateX(-50%)!important;
  z-index:3!important;
  display:flex!important;
  gap:4px!important;
}
.julia-ig-feed .ig-dots i{
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.55)!important;
}
.julia-ig-feed .ig-dots i.active{background:#0095f6!important}
.julia-ig-feed .ig-post-actions{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  padding:9px 2px 4px!important;
  border:0!important;
  background:transparent!important;
}
.julia-ig-feed .ig-post-actions button{
  border:0!important;
  background:transparent!important;
  color:var(--window-text)!important;
  padding:0!important;
  min-width:23px!important;
  min-height:23px!important;
  display:grid!important;
  place-items:center!important;
  cursor:pointer!important;
}
.julia-ig-feed .ig-post-actions svg{
  width:20px!important;
  height:20px!important;
}
.julia-ig-feed .ig-post-actions button.liked{
  color:#ed4956!important;
}
.julia-ig-feed .ig-post-copy{
  padding:0 2px!important;
  font-size:8px!important;
  line-height:1.45!important;
}
.julia-ig-feed .ig-post-copy>button[data-likes-list],
.julia-ig-feed .ig-post-copy>strong{
  color:var(--window-text)!important;
  font-size:8px!important;
  font-weight:700!important;
}
.julia-ig-feed .ig-post-copy p{
  margin:5px 0 3px!important;
  font-size:8px!important;
  line-height:1.45!important;
}
.julia-ig-feed .ig-post-copy small{
  display:block!important;
  margin-top:5px!important;
  color:var(--window-muted)!important;
  font-size:6px!important;
  text-transform:uppercase!important;
}
.julia-ig-feed .social-comments-preview{
  margin-top:4px!important;
  color:var(--window-muted)!important;
  font-size:7px!important;
}

.julia-ig-sidebar{
  min-width:0;
  padding-top:22px;
  overflow-y:auto;
  scrollbar-width:none;
}
.julia-ig-sidebar::-webkit-scrollbar{display:none}
.julia-ig-me,
.julia-ig-profile-row{
  width:100%;
  border:0;
  background:transparent;
  color:var(--window-text);
  display:grid;
  grid-template-columns:43px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  text-align:left;
  padding:6px 0;
  cursor:pointer;
}
.julia-ig-me{
  margin-bottom:16px;
}
.julia-ig-me img,
.julia-ig-profile-row img{
  width:43px;
  height:43px;
  border-radius:50%;
  object-fit:cover;
}
.julia-ig-me span,
.julia-ig-profile-row span{
  min-width:0;
  display:grid;
  gap:1px;
}
.julia-ig-me strong,
.julia-ig-profile-row strong{
  font-size:8px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.julia-ig-me small,
.julia-ig-profile-row small{
  font-size:7px;
  color:var(--window-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.julia-ig-profile-row>b{
  color:#0095f6;
  font-size:7px;
  font-weight:700;
}
.julia-ig-side-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:6px;
  color:var(--window-muted);
}
.julia-ig-side-head strong{
  font-size:8px;
}
.julia-ig-side-head span{
  font-size:7px;
}
.julia-ig-profile-list{
  display:grid;
}
.julia-ig-side-note{
  display:block;
  margin-top:14px;
  color:var(--window-muted);
  font-size:6px;
  line-height:1.45;
}

/* Instagram profile */
.julia-instagram-profile{
  grid-template-rows:50px minmax(0,1fr);
}
.julia-ig-profile-top{
  grid-template-columns:40px 1fr auto;
}
.julia-ig-profile-top>strong{
  justify-self:center;
  font-size:10px;
}
.julia-ig-back{
  font-size:22px;
  justify-self:start;
}
.julia-ig-top-action{
  color:#0095f6;
  font-size:8px;
  font-weight:700;
}
.julia-ig-profile-scroll{
  min-height:0;
  overflow-y:auto;
}
.julia-ig-profile-hero{
  width:min(760px,calc(100% - 38px));
  margin:0 auto;
  display:grid;
  grid-template-columns:130px minmax(0,1fr);
  gap:34px;
  align-items:start;
  padding:30px 0 26px;
}
.julia-ig-profile-avatar{
  width:112px;
  height:112px;
  border-radius:50%;
  object-fit:cover;
  justify-self:center;
}
.julia-ig-profile-main{
  display:grid;
  gap:14px;
  min-width:0;
}
.julia-ig-profile-name{
  display:flex;
  align-items:center;
  gap:5px;
}
.julia-ig-profile-name strong{
  font-size:14px;
  font-weight:520;
}
.julia-ig-profile-stats{
  display:flex;
  gap:24px;
  flex-wrap:wrap;
  font-size:8px;
}
.julia-ig-profile-stats b{
  font-size:9px;
}
.julia-ig-profile-bio{
  font-size:8px;
  line-height:1.45;
}
.julia-ig-profile-bio p{
  margin:3px 0 0;
  white-space:pre-wrap;
}
.julia-ig-profile-tabs{
  border-top:1px solid var(--window-line);
  display:flex;
  justify-content:center;
  height:36px;
}
.julia-ig-profile-tabs span{
  height:36px;
  display:flex;
  align-items:center;
  border-top:1px solid var(--window-text);
  margin-top:-1px;
  font-size:7px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.julia-ig-profile-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2px;
  width:min(850px,100%);
  margin:0 auto 30px;
}
.julia-ig-profile-grid button{
  position:relative;
  border:0;
  padding:0;
  aspect-ratio:1;
  background:color-mix(in srgb,var(--window-text) 6%,transparent);
  overflow:hidden;
  color:var(--window-text);
  cursor:pointer;
}
.julia-ig-profile-grid img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.julia-ig-profile-grid i{
  position:absolute;
  right:8px;
  top:8px;
  color:#fff;
  text-shadow:0 1px 4px rgba(0,0,0,.7);
  font-style:normal;
}
.julia-ig-empty{
  min-height:240px;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:4px;
  color:var(--window-muted);
}
.julia-ig-empty strong{
  color:var(--window-text);
  font-size:11px;
}
.julia-ig-empty span{
  font-size:7px;
}
.julia-ig-empty.compact{
  min-height:80px;
  font-size:7px;
}
.julia-ig-empty.span3{
  grid-column:1/-1;
}

/* Preserve Instagram feel in dark mode */
.theme-dark .julia-instagram{
  background:#0d0d0f;
  --window-bg:#0d0d0f;
  --window-panel:#151519;
  --window-line:rgba(255,255,255,.10);
  --window-text:#fafafa;
  --window-muted:#a8a8ad;
}

/* Responsive Instagram window */
@media(max-width:1050px) and (min-width:761px){
  .julia-ig-layout{
    grid-template-columns:minmax(0,650px);
    padding:0 18px;
  }
  .julia-ig-sidebar{display:none}
}


/* Preserve author formatting in social text */
.julia-feed-column .post-text,
.julia-ig-feed .ig-post-copy p,
.julia-ig-profile-bio p,
.julia-feed-composer textarea,
.julia-feed-column .social-comments-preview,
.julia-ig-feed .social-comments-preview{
  white-space:pre-wrap!important;
  overflow-wrap:anywhere;
  word-break:break-word;
}


/* Instagram sizing polish: circular stories + wider feed + slimmer profile rail */
.julia-ig-layout{
  grid-template-columns:minmax(0,1fr) 190px!important;
  gap:24px!important;
  padding:0 18px!important;
}
.julia-ig-sidebar{
  width:190px!important;
  max-width:190px!important;
}
.julia-ig-main{
  min-width:0!important;
}
.julia-ig-feed .ig-post{
  width:min(100%,620px)!important;
}
.julia-ig-stories{
  min-height:92px;
  box-sizing:border-box;
}
.julia-ig-story{
  width:64px!important;
  min-width:64px!important;
  align-content:start;
  box-sizing:border-box;
}
.julia-ig-story>span{
  width:60px!important;
  height:60px!important;
  min-width:60px!important;
  min-height:60px!important;
  aspect-ratio:1/1!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  padding:0!important;
  position:relative!important;
  overflow:visible!important;
  display:block!important;
  background:conic-gradient(#d300c5,#ff3040,#ff8a00,#ffd600,#d300c5)!important;
}
.julia-ig-story>span:after{
  inset:3px!important;
  border:2px solid var(--window-bg)!important;
  box-sizing:border-box!important;
  z-index:1!important;
}
.julia-ig-story>span>img{
  position:absolute!important;
  inset:5px!important;
  width:calc(100% - 10px)!important;
  height:calc(100% - 10px)!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:1/1!important;
  border-radius:50%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  z-index:0!important;
}
.julia-ig-story-self>span{
  background:color-mix(in srgb,var(--window-text) 12%,transparent)!important;
}
.julia-ig-story-self>span:after{
  display:none!important;
}
.julia-ig-story-self>span>img{
  inset:2px!important;
  width:calc(100% - 4px)!important;
  height:calc(100% - 4px)!important;
  border:2px solid var(--window-bg)!important;
  box-sizing:border-box!important;
}
.julia-ig-story-self i{
  right:-2px!important;
  bottom:1px!important;
  z-index:3!important;
}
.julia-ig-story small{
  margin-top:4px;
}
.julia-ig-profile-row{
  grid-template-columns:38px minmax(0,1fr) auto!important;
  gap:7px!important;
}
.julia-ig-me{
  grid-template-columns:40px minmax(0,1fr)!important;
  gap:8px!important;
}
.julia-ig-me img,
.julia-ig-profile-row img{
  width:38px!important;
  height:38px!important;
}
.julia-ig-me img{
  width:40px!important;
  height:40px!important;
}
.julia-ig-profile-row>b{
  font-size:6.5px!important;
}
@media(max-width:1050px) and (min-width:761px){
  .julia-ig-layout{
    grid-template-columns:minmax(0,1fr)!important;
    padding:0 16px!important;
  }
  .julia-ig-sidebar{display:none!important}
  .julia-ig-feed .ig-post{width:min(100%,640px)!important}
}


/* ===== Instagram Stories — immersive fullscreen viewer ===== */
body.julia-story-open{
  overflow:hidden!important;
  background:#151515!important;
}
body.julia-story-open .julia-mac-menubar,
body.julia-story-open .julia-mac-dock,
body.julia-story-open .julia-home-editor,
body.julia-story-open .julia-desktop-canvas,
body.julia-story-open .julia-desktop-wallpaper,
body.julia-story-open .julia-desktop-tint{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.julia-story-open #overlay-root{
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  display:block!important;
  pointer-events:auto!important;
}

.julia-story-overlay{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  grid-template-columns:minmax(150px,1fr) minmax(320px,440px) minmax(150px,1fr);
  align-items:center;
  gap:34px;
  padding:18px 28px;
  box-sizing:border-box;
  overflow:hidden;
  background:#181818;
  color:#fff;
  font-family:"Storyverse SF",-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;
}
.julia-story-brand{
  position:absolute;
  left:18px;
  top:18px;
  z-index:20;
  font-size:20px;
  font-weight:750;
  letter-spacing:-.055em;
  color:#fff;
}
.julia-story-close{
  position:absolute;
  right:20px;
  top:14px;
  z-index:25;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#fff;
  display:grid;
  place-items:center;
  padding:0;
  font:inherit;
  font-size:37px;
  font-weight:200;
  line-height:1;
  cursor:pointer;
}
.julia-story-close:hover{
  background:rgba(255,255,255,.08);
}

.julia-story-stage{
  position:relative;
  grid-column:2;
  width:min(440px,32vw);
  height:min(790px,94vh);
  max-height:calc(100vh - 36px);
  justify-self:center;
  align-self:center;
  overflow:hidden;
  border-radius:11px;
  background:#080808;
  box-shadow:0 18px 70px rgba(0,0,0,.38);
}
.julia-story-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#080808;
  user-select:none;
  -webkit-user-drag:none;
}
.julia-story-stage:after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.42),transparent 15%,transparent 70%,rgba(0,0,0,.42));
  z-index:2;
}

.julia-story-progress{
  position:absolute;
  left:12px;
  right:12px;
  top:11px;
  z-index:8;
  height:3px;
  display:flex;
  gap:4px;
}
.julia-story-progress i{
  flex:1;
  height:3px;
  min-width:2px;
  border-radius:99px;
  overflow:hidden;
  background:rgba(255,255,255,.34);
}
.julia-story-progress i.done,
.julia-story-progress i.active{
  background:#fff;
}

.julia-story-head{
  position:absolute;
  left:12px;
  right:12px;
  top:24px;
  z-index:9;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.julia-story-user{
  min-width:0;
  border:0;
  background:transparent;
  color:#fff;
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px 0;
  text-align:left;
  cursor:pointer;
}
.julia-story-user>img{
  width:33px;
  height:33px;
  min-width:33px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.70);
}
.julia-story-user>span{
  min-width:0;
  display:flex;
  align-items:baseline;
  gap:6px;
}
.julia-story-user strong{
  max-width:160px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
  font-weight:700;
  text-shadow:0 1px 5px rgba(0,0,0,.55);
}
.julia-story-user small{
  flex:0 0 auto;
  font-size:8px;
  color:rgba(255,255,255,.66);
  text-shadow:0 1px 5px rgba(0,0,0,.55);
}
.julia-story-head-actions{
  display:flex;
  align-items:center;
  gap:4px;
}
.julia-story-head-actions button{
  width:29px;
  height:29px;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:12px;
  cursor:pointer;
  text-shadow:0 1px 5px rgba(0,0,0,.6);
}
.julia-story-head-actions button:hover{
  background:rgba(0,0,0,.22);
}
.julia-story-head-actions svg{
  width:18px;
  height:18px;
}
.julia-story-head-actions .liked,
.julia-story-heart.liked{
  color:#ff3040!important;
}

.julia-story-caption{
  position:absolute;
  left:50%;
  bottom:78px;
  z-index:9;
  max-width:82%;
  transform:translateX(-50%);
  padding:5px 8px;
  border-radius:5px;
  background:rgba(0,0,0,.68);
  color:#fff;
  font-size:8px;
  line-height:1.42;
  text-align:center;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  box-shadow:0 2px 10px rgba(0,0,0,.16);
}

.julia-story-hit{
  position:absolute;
  top:72px;
  bottom:64px;
  z-index:5;
  width:42%;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}
.julia-story-hit.prev{left:0}
.julia-story-hit.next{right:0}

.julia-story-footer{
  position:absolute;
  left:16px;
  right:16px;
  bottom:14px;
  z-index:10;
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px auto;
  gap:8px;
  align-items:center;
}
.julia-story-reply{
  min-width:0;
  height:39px;
  border:1px solid rgba(255,255,255,.80);
  border-radius:999px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 29px;
  align-items:center;
  overflow:hidden;
  background:rgba(10,10,10,.10);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.julia-story-reply input{
  min-width:0;
  width:100%;
  height:100%;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#fff!important;
  padding:0 12px!important;
  font:inherit!important;
  font-size:9px!important;
}
.julia-story-reply input::placeholder{
  color:rgba(255,255,255,.82);
}
.julia-story-reply button{
  width:27px;
  height:27px;
  margin-right:4px;
  border:0;
  border-radius:50%;
  background:#fff;
  color:#111;
  display:grid;
  place-items:center;
  padding:0;
  font-size:14px;
  opacity:0;
  transition:.15s ease;
}
.julia-story-reply:focus-within button{
  opacity:1;
}
.julia-story-heart{
  width:34px;
  height:34px;
  border:0;
  background:transparent;
  color:#fff;
  display:grid;
  place-items:center;
  padding:0;
  cursor:pointer;
}
.julia-story-heart svg{
  width:25px;
  height:25px;
  stroke-width:1.7;
}
.julia-story-comment-count{
  min-width:12px;
  font-size:7px;
  color:rgba(255,255,255,.76);
}

.julia-story-side{
  position:relative;
  height:min(540px,66vh);
  display:flex;
  align-items:center;
  gap:22px;
  min-width:0;
  overflow:visible;
}
.julia-story-left{
  grid-column:1;
  justify-content:flex-end;
}
.julia-story-right{
  grid-column:3;
  justify-content:flex-start;
}
.julia-story-peek{
  position:relative;
  flex:0 0 auto;
  width:150px;
  height:268px;
  padding:0;
  border:0;
  border-radius:10px;
  overflow:hidden;
  background:#252525;
  box-shadow:0 10px 34px rgba(0,0,0,.24);
  cursor:pointer;
  color:#fff;
  transition:transform .18s ease,opacity .18s ease;
}
.julia-story-peek.distance-1{
  width:166px;
  height:296px;
  opacity:.92;
}
.julia-story-peek.distance-2{
  width:132px;
  height:236px;
  opacity:.50;
}
.julia-story-peek:hover{
  opacity:1;
  transform:scale(1.025);
}
.julia-story-peek-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.julia-story-peek-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.02) 54%,rgba(0,0,0,.52));
}
.julia-story-peek-user{
  position:absolute;
  left:10px;
  right:10px;
  bottom:11px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:8px;
  align-items:center;
  text-align:left;
  text-shadow:0 1px 5px rgba(0,0,0,.7);
}
.julia-story-peek-user>img{
  grid-row:1/3;
  width:38px;
  height:38px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid #e1306c;
}
.julia-story-peek-user b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:8px;
}
.julia-story-peek-user small{
  font-size:7px;
  color:rgba(255,255,255,.78);
}

/* story viewer is the only visible system surface while open */
body.julia-story-open .julia-desktop-home{
  background:#181818!important;
}
body.julia-story-open .julia-desktop-home>#overlay-root{
  opacity:1!important;
  visibility:visible!important;
}

/* narrower desktops: show only immediate neighbors */
@media(max-width:1280px) and (min-width:761px){
  .julia-story-overlay{
    grid-template-columns:minmax(110px,1fr) minmax(320px,420px) minmax(110px,1fr);
    gap:22px;
    padding-inline:18px;
  }
  .julia-story-peek.distance-2{display:none}
  .julia-story-peek.distance-1{
    width:132px;
    height:236px;
  }
  .julia-story-stage{
    width:min(420px,38vw);
  }
}

/* phone/tablet: story itself becomes the entire screen */
@media(max-width:760px){
  body.julia-story-open #app{
    background:#000!important;
  }
  .julia-story-overlay{
    display:block;
    padding:0;
    background:#000;
  }
  .julia-story-brand,
  .julia-story-side{
    display:none!important;
  }
  .julia-story-close{
    right:7px;
    top:max(7px,env(safe-area-inset-top));
    width:36px;
    height:36px;
    font-size:31px;
  }
  .julia-story-stage{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-height:none;
    border-radius:0;
    box-shadow:none;
  }
  .julia-story-progress{
    top:max(9px,env(safe-area-inset-top));
    left:8px;
    right:48px;
  }
  .julia-story-head{
    top:max(20px,calc(env(safe-area-inset-top) + 12px));
    left:10px;
    right:50px;
  }
  .julia-story-footer{
    bottom:max(14px,env(safe-area-inset-bottom));
  }
  .julia-story-caption{
    bottom:max(75px,calc(env(safe-area-inset-bottom) + 66px));
    font-size:10px;
  }
}
