/* Marina: presentation adapter for Ellis's actual hosted v1/Home DOM.
   Load last. No state, permissions, actions, asset fetching or storage. */
.remote-shell{grid-template-columns:248px minmax(0,1fr)}
.remote-shell>.rail{height:100dvh;min-height:0;overflow:auto;overscroll-behavior:contain;background:var(--rail-bg,#21352f);color:var(--rail-ink,#F8F5EE);border-color:var(--rail-line,#425949)}
.remote-shell .rail-inner{height:100%;min-height:0;padding:10px 12px;gap:8px;overflow:visible}
.remote-brand-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:32px}
.remote-brand-row .brand.company-brand{display:flex;align-items:center;gap:8px;min-width:0;max-width:100%;min-height:30px;color:var(--rail-ink,#F8F5EE)}
.remote-brand-row .brand.company-brand strong{font:600 1rem/1.35 var(--sans);letter-spacing:0;overflow-wrap:anywhere}
.remote-brand-row .brand.company-brand .company-logo{display:block;width:auto;height:auto;max-width:100%;max-height:30px;object-fit:contain;object-position:left center;border-radius:0;background:none}
.remote-brand-row .brand.company-brand.has-wide-logo{display:block;align-content:center}
.remote-brand-row .brand.company-brand.has-wide-logo .company-logo{max-width:180px;max-height:30px}
.remote-shell .remote-nav-wrap{display:flex;flex-direction:column;flex:1;min-height:0;gap:8px}
.remote-shell .org-switch{border:0;margin:0;padding:0 8px 5px 38px;gap:2px;min-width:0}
.remote-shell .org-switch .org-name{font:600 .875rem/1.4 var(--sans);margin:0;color:var(--rail-ink,#F8F5EE)}
.remote-shell .org-switch small{font:.8125rem/1.4 var(--sans);color:var(--rail-muted,#BAC8BC);overflow-wrap:anywhere}
.remote-shell .nav{display:grid;align-content:start;gap:1px;min-width:0}
.remote-shell .nav :is(a,.rail-team-link){display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:0;width:100%;min-height:28px;margin:0;padding:4px 8px;border:0;border-radius:6px;background:transparent;color:var(--rail-ink,#F8F5EE);font:400 .875rem/1.4 var(--sans);text-decoration:none;text-align:left;box-shadow:none}
.remote-shell .nav .rail-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit}
.remote-shell .nav .rail-icon{width:22px;height:22px;display:grid;place-items:center;flex:none;border-radius:50%;background:var(--rail-avatar-bg,#344C3D);color:var(--rail-ink,#F8F5EE);font:600 .625rem/1 var(--sans)}
.remote-shell .nav .rail-team-link>img{width:22px;height:22px;flex:none;object-fit:contain;border-radius:50%;margin:0}
.remote-shell .nav .rail-activity-wrap{width:16px;height:16px;flex:none;display:grid;place-items:center;color:inherit}
.remote-shell .nav .rail-activity-wrap svg{width:16px;height:16px}
.remote-shell .nav .count{margin:0 0 0 auto;padding:0 3px;flex:none;background:transparent;color:var(--rail-muted,#BAC8BC);font:.75rem/1.4 var(--sans)}
.remote-shell .nav :is(a,.rail-team-link):hover{background:var(--rail-hover,#344C3D);color:var(--rail-ink,#F8F5EE)}
.remote-shell .nav :is(a,.rail-team-link)[aria-current="page"]{background:var(--rail-selected,#F8F5EE);color:var(--rail-selected-ink,#21352F);font-weight:600}
.remote-shell .nav :is(a,.rail-team-link)[aria-current="page"] :is(.rail-name,.rail-icon,.count){color:var(--rail-selected-ink,#21352F);background:transparent}
.remote-shell .nav :is(a,.rail-team-link):is(:disabled,[aria-disabled="true"]){opacity:1;color:var(--rail-muted,#BAC8BC)}
.remote-shell .nav>a:is([href="#home"],[href="#inbox"]){padding-left:38px;position:relative}
.remote-shell .nav>a:is([href="#home"],[href="#inbox"])::before{content:'';position:absolute;left:11px;width:16px;height:16px;background:currentColor;mask:center/contain no-repeat;mask-image:url("/office/rail-home.svg")}
.remote-shell .nav>a[href="#inbox"]::before{mask-image:url("/office/rail-inbox.svg")}
.remote-rail-section{display:grid;gap:1px;min-width:0}
.remote-rail-section .nav-label{padding:5px 8px 2px 38px;margin:0;min-height:20px;text-transform:none;letter-spacing:0;font:500 .75rem/1.4 var(--sans);color:var(--rail-muted,#BAC8BC)}
.remote-rail-section .team-list{list-style:none;display:grid;gap:1px;margin:0;padding:0;min-width:0}
.remote-rail-section .team-list>li{margin:0;min-width:0}
.remote-shell .remote-tools{position:relative;margin-top:auto;min-width:0;border-top:1px solid var(--rail-line,#425949);padding-top:4px;display:block}
.remote-tools>summary{min-height:36px;display:flex;align-items:center;gap:8px;padding:6px 8px;color:var(--rail-ink,#F8F5EE);font:400 .8125rem/1.4 var(--sans);cursor:pointer;list-style:none}
.remote-tools>summary::-webkit-details-marker{display:none}
.remote-tools>summary::after{content:'⌃';margin-left:auto;font-size:1rem}
.remote-tools[open]>summary::after{content:'⌄'}
.remote-tools>summary:hover{background:var(--rail-hover,#344C3D);border-radius:6px}
.remote-tools-body{position:absolute;inset:auto 0 44px;max-height:min(470px,70dvh);overflow:auto;overscroll-behavior:contain;display:grid;gap:12px;padding:14px;border:1px solid var(--rail-line,#425949);border-radius:9px;background:var(--rail-bg,#21352F);color:var(--rail-ink,#F8F5EE);box-shadow:0 8px 28px #0003;z-index:6}
.remote-tools-body :is(button,a,select){min-height:36px}
.remote-shell .remote-theme .btn{border-color:var(--rail-line,#425949);color:var(--rail-ink,#F8F5EE);background:transparent}
.remote-shell .remote-theme .btn[aria-pressed="true"]{background:var(--rail-selected,#F8F5EE);color:var(--rail-selected-ink,#21352F)}
.remote-shell :is(.remote-theme-label,.remote-tools-body .hint){color:var(--rail-muted,#BAC8BC)}
.remote-shell .rail :is(a,button,summary,select):focus-visible{outline:3px solid var(--rail-focus,#57D3E3);outline-offset:2px}
.remote-shell .rail :is(a,button)[aria-disabled="true"]{cursor:default}
.remote-main{max-width:none;min-width:0}
.remote-main>.remote-connection{flex:none;margin:0;font:.8125rem/1.45 var(--sans);overflow-wrap:anywhere}
.remote-shell>.remote-main:has(>.home-focus){gap:10px;padding:18px clamp(18px,2.5vw,32px) 14px;overflow:hidden}
.remote-main>.home-focus{min-height:0;flex:1}
.remote-main .home-focus .daily-start-choice{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 8px;color:var(--muted)}
.remote-main>.answer-inbox{width:100%;max-width:980px;margin-inline:auto}
.remote-main .answer-inbox .work-item :is(h3,p){margin:0;overflow-wrap:anywhere}
.remote-main .answer-inbox .work-item h3{font:600 1rem/1.45 var(--sans)}
.remote-main .answer-inbox .work-item>header{display:flex;align-items:baseline;justify-content:space-between;gap:6px 10px;flex-wrap:wrap;font:.875rem/1.4 var(--sans)}
.remote-main .answer-inbox .work-item>.remote-composer{padding:0;border:0;background:transparent;gap:8px}
.remote-main .answer-inbox .remote-composer textarea{min-height:72px;font:400 1rem/1.5 var(--sans)}
.remote-main .answer-inbox .remote-composer .btn-row{margin:0}
.remote-main .remote-priority-editor fieldset{display:grid;gap:12px;min-width:0;border:1px solid var(--line);border-radius:10px;padding:16px;margin:0}
.remote-main .remote-priority-editor legend{padding:0 5px;font:600 .9375rem/1.4 var(--sans)}
/* The hosted renderer has an empty tutorial placeholder. Keep it an explicit
   zero-height row; the local four-child renderer and its approved CSS stay exact. */
.remote-conversation:has(>.agent-conversations){grid-template-rows:auto auto minmax(0,1fr) auto auto}
.remote-conversation:has(>.agent-conversations)>.remote-page-head{grid-row:1}
.remote-conversation:has(>.agent-conversations)>.agent-conversations{grid-row:2}
.remote-conversation:has(>.agent-conversations)>.remote-feed{grid-row:3}
.remote-conversation:has(>.agent-conversations)>.tutorial-slot{grid-row:4;min-height:0}
.remote-conversation:has(>.agent-conversations)>.remote-composer{grid-row:5}
@media(max-width:820px){
 .remote-shell{grid-template-columns:minmax(0,1fr)}
 .remote-shell>.rail{height:auto;max-height:none;position:relative;overflow:visible;z-index:5}
 .remote-shell .rail-inner{height:auto;min-height:0;padding:10px 14px;gap:0}
 .remote-shell .remote-menu{display:inline-flex;min-height:44px;background:transparent;color:var(--rail-ink,#F8F5EE);border-color:var(--rail-line,#425949)}
 .remote-shell .remote-nav-wrap{display:none}
 .remote-shell .remote-nav-wrap.open{position:absolute;inset:100% 0 auto;max-height:calc(100dvh - 76px);overflow:auto;overscroll-behavior:contain;display:flex;gap:10px;padding:12px 14px;background:var(--rail-bg,#21352F);color:var(--rail-ink,#F8F5EE);border-bottom:1px solid var(--rail-line,#425949);box-shadow:0 8px 16px #0003}
 .remote-shell .nav :is(a,.rail-team-link){min-height:44px;padding-block:10px}
 .remote-shell .remote-tools{margin-top:8px}
 .remote-tools>summary{min-height:44px}
 .remote-tools-body{position:static;margin-top:6px;max-height:60dvh;border:0;border-radius:0;box-shadow:none;padding:8px}
 .remote-tools-body :is(button,a,select){min-height:44px}
 .remote-shell>.remote-main:has(>.home-focus){padding:10px 12px max(12px,env(safe-area-inset-bottom));gap:8px}
 .remote-main{padding:18px 14px 28px}
 .remote-conversation:has(>.agent-conversations){grid-template-rows:max-content auto minmax(6rem,1fr) auto max-content;overflow:auto}
}
@media(max-width:380px){.remote-brand-row .brand.company-brand.has-wide-logo .company-logo{max-width:150px}.remote-main .answer-inbox .work-item>.remote-composer .btn-row>div{width:100%}}
@media(forced-colors:active){.remote-shell .nav>a:is([href="#home"],[href="#inbox"])::before{background:CanvasText}.remote-shell .nav :is(a,.rail-team-link)[aria-current="page"]{outline:1px solid Highlight}}

/* A read-only refresh stays next to the host-confirmed connection state. */
.remote-main>.remote-sync-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 12px;flex:none;min-width:0}
.remote-shell .remote-sync-row>.remote-connection{padding:0;margin:0;flex:1 1 180px;font:.8125rem/1.45 var(--sans);color:var(--muted);overflow-wrap:anywhere}
.remote-sync-row>.btn{min-height:32px;padding:5px 9px;font:.8125rem/1.4 var(--sans);flex:none}
.is-conversation .remote-sync-row{padding:6px clamp(14px,3vw,36px);border-bottom:1px solid var(--line)}
@media(max-width:820px){.remote-sync-row>.btn{min-height:44px}.is-conversation .remote-sync-row{padding:6px 14px}}

/* Hosted Home has a connection row above the approved three-area view.
   At laptop height trim only the hero artwork and unused gaps; preserve type. */
@media(min-width:821px) and (max-height:760px){
 .remote-main .home-focus-hero{min-height:72px;grid-template-columns:64px minmax(0,1fr)}
 .remote-main .home-focus-hero .pose.home-focus-art{width:64px;height:64px}
 .remote-main .home-focus-main{gap:12px}
}

/* A narrow view with enlarged text must retain a real reading area.
   The approved Home wrapper scrolls vertically when its controls need more room. */
@media(max-width:820px){.remote-main .home-focus-content{min-height:min(32dvh,14rem);flex-shrink:0}}

/* Real saved-order rows: original name/icon target and a separate controls column.
   Runtime alone decides draggability, membership, retry and saved order. */
.remote-shell .nav .rail-reorder-row{display:grid;grid-template-columns:minmax(0,1fr) 28px;align-items:center;min-width:0;position:relative;border-radius:6px}
.remote-shell .nav .rail-reorder-row>:is(a,.rail-team-link){min-width:0}
.remote-shell .nav .rail-reorder-row:has(>[aria-current="page"]){background:var(--rail-selected);color:var(--rail-selected-ink)}
.remote-shell .nav .rail-reorder-row>[aria-current="page"]{background:transparent}
.remote-shell .nav .rail-reorder-row[draggable="true"]>:is(a,.rail-team-link){cursor:grab}
.remote-shell .nav .rail-reorder-row.is-dragging>:is(a,.rail-team-link){cursor:grabbing}
.remote-shell .nav .rail-reorder-row.is-dragging{opacity:.55}
.rail-row-options{position:relative;min-width:0;align-self:stretch;color:inherit}
.rail-row-options>summary{display:grid;place-items:center;min-height:28px;width:28px;padding:0;margin:0;border:0;border-radius:5px;list-style:none;cursor:pointer;color:inherit;font:500 1rem/1 var(--sans)}
.rail-row-options>summary::-webkit-details-marker{display:none}
.rail-row-options>summary:hover,.rail-row-options[open]>summary{background:var(--rail-hover);color:var(--rail-ink)}
.rail-row-options[open]{z-index:7}
.rail-row-options-menu{position:absolute;right:0;top:calc(100% + 4px);display:grid;gap:2px;min-width:max(140px,6rem);padding:6px;border:1px solid var(--rail-line);border-radius:8px;background:var(--rail-bg);color:var(--rail-ink);box-shadow:0 6px 20px #0003}
.remote-shell .nav .rail-row-options-menu>.btn{display:block;width:100%;min-height:36px;padding:7px 10px;margin:0;border:0;border-radius:5px;background:transparent;color:inherit;text-align:left;font:400 .875rem/1.4 var(--sans)}
.remote-shell .nav .rail-row-options-menu>.btn:hover{background:var(--rail-hover)}
.remote-shell .nav .rail-row-options-menu>.btn:disabled{opacity:1;color:var(--rail-muted);cursor:default}
@media(max-width:820px){
 .remote-shell .nav .rail-reorder-row{grid-template-columns:minmax(0,1fr) 44px}
 .rail-row-options>summary{width:44px;min-height:44px}
 .remote-shell .nav .rail-row-options-menu>.btn{min-height:44px}
}
