/* =========================================================
   TEA2 P0 FINISH v3.0 · visual completion pass
   Based on approved Operations Center reference.
   ========================================================= */
:root{
 --tea2f-ink:#173653;
 --tea2f-ink-soft:#315570;
 --tea2f-muted:#657f94;
 --tea2f-glass:rgba(245,250,253,.76);
 --tea2f-glass2:rgba(225,238,245,.70);
 --tea2f-line:rgba(255,255,255,.86);
 --tea2f-line-dark:rgba(55,96,126,.14);
 --tea2f-blue:#3183f6;
 --tea2f-cyan:#28bad9;
 --tea2f-violet:#7854ee;
 --tea2f-green:#22be78;
 --tea2f-orange:#ff8b24;
 --tea2f-pink:#e5439b;
 --tea2f-red:#ef315a;
 --tea2f-shadow:0 15px 38px rgba(29,61,91,.13);
}

/* Stronger scenic depth; still mid-tone and calm */
body{
 background:
   radial-gradient(circle at 3% 7%,rgba(36,194,224,.42),transparent 30%),
   radial-gradient(circle at 93% 6%,rgba(120,84,238,.30),transparent 32%),
   radial-gradient(circle at 92% 90%,rgba(255,139,36,.26),transparent 31%),
   radial-gradient(circle at 9% 91%,rgba(49,131,246,.20),transparent 30%),
   linear-gradient(142deg,#90bed2 0%,#adc8d8 38%,#beb9d5 68%,#d0b0a0 100%)!important;
}
body:before{opacity:.18!important}

/* Header: premium light glass with clear hierarchy */
.tea2-header{
 border-color:rgba(255,255,255,.88)!important;
 background:linear-gradient(135deg,rgba(247,251,253,.87),rgba(219,235,243,.78))!important;
 box-shadow:0 16px 42px rgba(34,66,91,.13),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.myoffice-name{color:#173653!important}
.myoffice-name span{
 background:linear-gradient(100deg,#146cf3,#6748ee)!important;
 -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;
}
.myoffice-sub{color:#6b8191!important;font-weight:750!important}
.mo-commandbar{
 border-color:rgba(255,255,255,.92)!important;
 background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(226,239,246,.70))!important;
 box-shadow:0 9px 24px rgba(34,66,91,.09),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.mo-commandbar button,.mo-commandbar select,.mo-command-search{
 border-color:rgba(59,103,133,.14)!important;
 background:rgba(255,255,255,.54)!important;
 color:#244965!important;
}
.mo-commandbar button:hover{background:rgba(255,255,255,.86)!important;color:#173653!important}
.mo-command-search span{color:#496a80!important}
.mo-james-button{
 background:linear-gradient(135deg,rgba(49,131,246,.14),rgba(120,84,238,.11))!important;
}
.tea2-env-badge{border-color:rgba(255,255,255,.86)!important}

/* Navigation: readable, dimensional, and clearly active */
.tea2-side-ui{
 border-color:rgba(255,255,255,.89)!important;
 background:linear-gradient(150deg,rgba(246,250,252,.88),rgba(214,232,241,.81))!important;
 box-shadow:0 17px 42px rgba(34,67,91,.14),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.tea2-side-head{border-bottom-color:rgba(49,86,113,.12)!important}
.tea2-side-head small{color:#6e8394!important;font-size:9.5px!important}
.tea2-side-head strong{color:#173653!important;font-size:18px!important}
.myoffice-area-menu{padding-right:3px!important}
.myoffice-area-item{
 position:relative!important;
 min-height:50px!important;
 margin:2px 0!important;
 padding:7px 8px!important;
 border:1px solid transparent!important;
 border-radius:13px!important;
 color:#203f59!important;
 background:transparent!important;
 transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease!important;
}
.myoffice-area-item:hover{
 transform:translateX(2px)!important;
 background:rgba(255,255,255,.58)!important;
 border-color:rgba(255,255,255,.78)!important;
 box-shadow:0 7px 18px rgba(40,72,96,.07)!important;
}
.myoffice-area-item.active{
 background:
   linear-gradient(135deg,rgba(255,255,255,.83),rgba(222,238,246,.74))!important;
 border-color:rgba(255,255,255,.92)!important;
 box-shadow:0 9px 22px rgba(34,74,108,.10),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.myoffice-area-item.active:before{
 content:""!important;position:absolute!important;left:-2px!important;top:8px!important;bottom:8px!important;width:4px!important;
 border-radius:99px!important;background:linear-gradient(180deg,var(--tea2f-cyan),var(--tea2f-blue),var(--tea2f-violet))!important;
}
.myoffice-area-icon{
 width:34px!important;height:34px!important;border-radius:10px!important;
 background:linear-gradient(145deg,#2e9ee5,#5269dc 62%,#7357dc)!important;
 border:1px solid rgba(255,255,255,.90)!important;
 color:#fff!important;
 box-shadow:0 6px 15px rgba(47,100,176,.20),inset 0 1px 0 rgba(255,255,255,.42)!important;
}
.myoffice-area-copy strong{display:block!important;color:#24445e!important;font-size:12.5px!important;font-weight:820!important}
.myoffice-area-copy small{display:block!important;color:#6c8394!important;font-size:9.5px!important;line-height:1.25!important;margin-top:2px!important}
.myoffice-area-item.active .myoffice-area-copy strong{color:#174d78!important}
.myoffice-area-item.active .myoffice-area-copy small{color:#51748c!important}
.myoffice-area-chev{color:#4c93bd!important;font-size:17px!important}

/* Main workspace */
.main-screen{
 border-color:rgba(255,255,255,.86)!important;
 background:
   radial-gradient(circle at 6% 4%,rgba(40,186,217,.11),transparent 31%),
   radial-gradient(circle at 95% 2%,rgba(120,84,238,.09),transparent 34%),
   linear-gradient(145deg,rgba(239,247,251,.79),rgba(213,230,239,.72))!important;
 box-shadow:0 19px 48px rgba(33,65,89,.13),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.workspace-view:not(.idle-view){color:var(--tea2f-ink)!important}
.view-head{
 border-color:rgba(255,255,255,.84)!important;
 background:linear-gradient(135deg,rgba(250,253,255,.82),rgba(225,238,245,.72))!important;
 box-shadow:0 8px 20px rgba(36,68,91,.07),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.view-head strong{color:#173653!important}
.view-head small{color:#617c91!important}
.mini-btn,.tea2-work-btn,.preset-btn{
 border-color:rgba(54,98,127,.14)!important;
 background:rgba(255,255,255,.55)!important;
 color:#31546e!important;
 box-shadow:none!important;
}
.mini-btn:hover,.tea2-work-btn:hover,.preset-btn:hover{background:rgba(255,255,255,.88)!important}
.mini-btn.primary,.tea2-work-btn.primary{
 background:linear-gradient(135deg,#3183f6,#6754e7)!important;color:#fff!important;
}

/* Mission Control: card hierarchy and color accents */
.mc-hero,.dashboard-kpis,.dashboard-content{
 border-color:rgba(255,255,255,.88)!important;
 background:linear-gradient(145deg,rgba(249,253,255,.86),rgba(224,238,246,.74))!important;
 box-shadow:0 11px 28px rgba(31,65,91,.09),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.mc-hero{min-height:104px!important;padding:17px 19px 16px 23px!important}
.mc-hero:before{width:6px!important;background:linear-gradient(180deg,var(--tea2f-cyan),var(--tea2f-violet),var(--tea2f-orange))!important}
.mc-hero-copy small{color:#317fb0!important;font-size:9px!important}
.mc-hero-copy strong{color:#173653!important;font-size:24px!important;letter-spacing:-.25px!important}
.mc-hero-copy span{color:#5b768b!important;font-size:11px!important}
.mc-hero-state{gap:6px!important}
.mc-chip{
 background:rgba(255,255,255,.66)!important;border-color:rgba(56,100,130,.12)!important;
 box-shadow:0 4px 12px rgba(37,69,91,.045)!important;
}
.mc-chip b{color:#6b8192!important}.mc-chip em{color:#24465e!important}.mc-chip small{color:#7890a0!important}
.dashboard-kpis.mc-kpis{padding:9px!important;gap:8px!important}
.dashboard-kpi{
 min-height:78px!important;padding:11px 12px!important;
 border-color:rgba(255,255,255,.88)!important;
 background:linear-gradient(145deg,rgba(255,255,255,.77),rgba(230,241,247,.67))!important;
 box-shadow:0 7px 18px rgba(34,65,89,.06)!important;
}
.dashboard-kpi small{color:#668095!important;font-size:8.5px!important}
.dashboard-kpi strong{color:#173653!important;font-size:20px!important}
.dashboard-kpi span{color:#637d91!important;font-size:9.5px!important}
.dashboard-content.mc-content{background:rgba(218,233,241,.46)!important}
.dashboard-card.mc-card{
 border-color:rgba(255,255,255,.90)!important;
 background:linear-gradient(145deg,rgba(252,254,255,.86),rgba(231,241,247,.73))!important;
 box-shadow:0 9px 24px rgba(30,62,88,.075),inset 0 1px 0 rgba(255,255,255,.99)!important;
}
.dashboard-card.mc-card:nth-child(4n+1){border-top:3px solid var(--tea2f-blue)!important}
.dashboard-card.mc-card:nth-child(4n+2){border-top:3px solid var(--tea2f-violet)!important}
.dashboard-card.mc-card:nth-child(4n+3){border-top:3px solid var(--tea2f-green)!important}
.dashboard-card.mc-card:nth-child(4n+4){border-top:3px solid var(--tea2f-orange)!important}
.mc-build-card{border-top:3px solid var(--tea2f-violet)!important}
.mc-card-head h3{color:#173653!important}.mc-card-head small{color:#668095!important}
.dashboard-row.mc-row,.mc-next,.mc-build-grid>section,.mc-activity-item,.mc-statline span{
 background:rgba(255,255,255,.58)!important;
 border-color:rgba(255,255,255,.86)!important;
 box-shadow:0 4px 12px rgba(37,68,90,.035)!important;
}
.mc-row b,.mc-next b,.mc-build-now strong,.mc-build-deploy strong,.mc-activity-item b,.mc-statline b{color:#24445e!important}
.mc-row small,.mc-next small,.mc-next em,.mc-build-grid small,.mc-build-now p,.mc-build-next span,.mc-build-deploy>span,.mc-activity-item span,.mc-statline small{color:#657f93!important}

/* James: smaller, sharper, calmer */
.mo-assistant{
 width:286px!important;
 border-color:rgba(255,255,255,.90)!important;
 background:linear-gradient(150deg,rgba(247,251,253,.91),rgba(216,233,242,.85))!important;
 box-shadow:0 18px 45px rgba(32,64,88,.14),inset 0 1px 0 rgba(255,255,255,.99)!important;
}
body.myoffice-v4-ai:not(.mo-assistant-collapsed) .main-screen{margin-right:306px!important}
.mo-assistant-head{background:linear-gradient(135deg,rgba(255,255,255,.35),rgba(102,142,214,.08))!important}
.mo-assistant-head-copy strong{color:#173653!important}.mo-assistant-head-copy small{color:#668095!important}
.mo-ai-avatar{background:linear-gradient(145deg,#28c0db,#4b86ed 55%,#7954ed)!important}
.mo-context-chip,.mo-assistant-note,.mo-chat-row,.mo-assistant-quick button{
 background:rgba(255,255,255,.57)!important;border-color:rgba(255,255,255,.82)!important;
}
.mo-context-chip b{color:#2b7aa9!important}.mo-context-chip span{color:#31536a!important}
.mo-assistant-note strong,.mo-chat-row p{color:#24465f!important}
.mo-assistant-note p,.mo-assistant-note small,.mo-chat-row small{color:#637e92!important}
.mo-assistant-quick button{color:#355a72!important}
.mo-assistant-quick button:hover{background:rgba(255,255,255,.90)!important}
.mo-assistant-composer{background:rgba(190,216,229,.30)!important}
.mo-assistant-form textarea{
 background:rgba(255,255,255,.72)!important;
 color:#1d4059!important;
 border-color:rgba(55,99,128,.17)!important;
}
.mo-assistant-form textarea::placeholder{color:#718a9b!important;opacity:1!important}
.mo-assistant-send{background:linear-gradient(180deg,#2db9da,#5369df)!important;color:#fff!important}

/* Workspace tabs and bottom dock must not fall back to old navy */
.workspace-tabs{
 min-height:46px!important;
 padding:5px 7px!important;
 border:1px solid rgba(255,255,255,.84)!important;
 border-radius:15px!important;
 background:linear-gradient(145deg,rgba(247,251,253,.82),rgba(210,231,241,.75))!important;
 box-shadow:0 9px 23px rgba(34,66,90,.10),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.workspace-tab{
 min-height:34px!important;height:34px!important;
 border-color:rgba(55,98,128,.13)!important;
 background:rgba(255,255,255,.58)!important;
 color:#355970!important;
 box-shadow:none!important;
}
.workspace-tab.active{
 background:linear-gradient(135deg,#3183f6,#6553e9)!important;
 border-color:rgba(255,255,255,.82)!important;color:#fff!important;
 box-shadow:0 7px 16px rgba(61,98,187,.18)!important;
}
.tea2-footer{
 border:0!important;background:transparent!important;box-shadow:none!important;
}
.tea2-taskbar,.status-pill,.james-pill,.process-btn,.footer-mini{
 border-color:rgba(255,255,255,.84)!important;
 background:linear-gradient(145deg,rgba(248,252,254,.84),rgba(210,231,241,.76))!important;
 box-shadow:0 8px 21px rgba(35,67,90,.10),inset 0 1px 0 rgba(255,255,255,.98)!important;
 color:#284c64!important;
}
.tea2-taskbar .taskbar-item{
 border-color:rgba(255,255,255,.84)!important;
 background:rgba(255,255,255,.40)!important;
}
.tea2-taskbar .taskbar-item:hover{background:rgba(255,255,255,.76)!important}
.status-pill b,.james-pill b,.process-btn{color:#284c64!important}
.status-pill small,.james-pill small,.james-work small{color:#6b8394!important}

/* Approval drawer */
.mo-approval-drawer{
 border-color:rgba(255,255,255,.91)!important;
 background:linear-gradient(150deg,rgba(249,252,254,.96),rgba(216,233,242,.91))!important;
 box-shadow:0 24px 64px rgba(31,62,84,.19),inset 0 1px 0 rgba(255,255,255,.99)!important;
}
.mo-approval-summary>div,.mo-approval-item,.mo-approval-foot{
 background:rgba(255,255,255,.65)!important;border-color:rgba(255,255,255,.88)!important;
}
.mo-approval-item{box-shadow:0 6px 16px rgba(31,64,88,.05)!important}
.mo-approval-item strong,.mo-approval-summary strong{color:#173653!important}
.mo-approval-item p{color:#506d81!important}

/* Broad center consistency */
.workspace-view :is(.panel,.card,.box,.detail-panel,.list-panel,.software-card,.system-center-card,.report-card,.support-card,.history-entry,.website-card){
 border-color:rgba(255,255,255,.84)!important;
}
.workspace-view :is(h1,h2,h3,h4,strong){text-shadow:none!important}
.workspace-view :is(p,span,small,label){text-rendering:optimizeLegibility}
.workspace-view table{
 background:rgba(255,255,255,.36)!important;border-radius:11px!important;overflow:hidden!important;
}
.workspace-view table th{background:rgba(61,128,169,.07)!important;color:#516f83!important}
.workspace-view table td{color:#31536a!important}

/* Scrollbars */
.myoffice-area-menu,.dashboard-content,.mo-assistant-main,.mo-approval-list,.workspace-view{
 scrollbar-width:thin;
 scrollbar-color:rgba(73,134,174,.48) rgba(255,255,255,.18);
}
.myoffice-area-menu::-webkit-scrollbar,.dashboard-content::-webkit-scrollbar,.mo-assistant-main::-webkit-scrollbar,.mo-approval-list::-webkit-scrollbar{width:8px}
.myoffice-area-menu::-webkit-scrollbar-thumb,.dashboard-content::-webkit-scrollbar-thumb,.mo-assistant-main::-webkit-scrollbar-thumb,.mo-approval-list::-webkit-scrollbar-thumb{
 background:linear-gradient(#3fb4d6,#6970df);border-radius:999px;border:2px solid rgba(255,255,255,.72)
}

/* Wide 1600-ish layout like TEA2 desktop screenshot */
@media(min-width:1500px){
 .side-left.expanded{width:236px!important}
 .tea2-side-ui{width:226px!important}
 #leftRail.expanded~.main-screen{margin-left:254px!important}
 .main-screen{margin-left:254px!important;margin-right:306px!important}
 .mo-assistant{width:286px!important}
}
@media(max-width:1360px){
 .mo-assistant{width:272px!important}
 body.myoffice-v4-ai:not(.mo-assistant-collapsed) .main-screen{margin-right:292px!important}
}