/* Standalone shell inspired by the inspected CloudLights Teams preview. */
#teams-mock{--tm-frame:#ebebeb;--tm-surface:#fff;--tm-canvas:#f5f5f5;--tm-fg:#242424;--tm-muted:#616161;--tm-stroke:#e0e0e0;--tm-brand:#5b5fc7;--tm-active:#e8e8f7;--tm-input:#fff;--tm-hover:#e2e2e2;color:var(--tm-fg);background:var(--tm-frame);border-color:var(--tm-stroke);font-family:'Segoe UI',Arial,sans-serif;font-size:14px;border-radius:8px;box-shadow:0 8px 24px #00000012;position:relative;height:760px;max-height:85vh;min-height:530px;display:flex;flex-direction:column}
#teams-mock.tm-dark{--tm-frame:#292929;--tm-surface:#1f1f1f;--tm-canvas:#242424;--tm-fg:#f0f0f0;--tm-muted:#b6b6b6;--tm-stroke:#414141;--tm-brand:#a6a7ec;--tm-active:#383752;--tm-input:#1f1f1f;--tm-hover:#383838;box-shadow:0 8px 30px #00000025}
#teams-mock.tm-expanded{height:1000px;max-height:none}
#teams-mock .tm-icon{display:inline-block;width:22px;height:22px;min-width:22px;background:currentColor;mask-image:var(--tm-icon-url);mask-size:contain;mask-repeat:no-repeat;mask-position:center;-webkit-mask-image:var(--tm-icon-url);vertical-align:middle}
#teams-mock button:focus-visible,#teams-mock input:focus-visible{outline:2px solid var(--tm-brand);outline-offset:-2px}
#teams-mock .teams-bar{display:grid;grid-template-columns:auto minmax(100px,1fr) auto;gap:18px;padding:0 12px;height:49px;min-height:49px;background:var(--tm-frame);border:0;color:var(--tm-muted);position:relative;z-index:5}
.tm-title-left,.tm-title-right{display:flex;align-items:center;gap:4px}.tm-title-right{gap:8px}.tm-preview-pill{background:var(--tm-active);color:var(--tm-brand);font-size:10px;font-weight:600;padding:3px 9px;border-radius:20px;margin-left:7px}.tm-icon-button{border:0;border-radius:4px;background:transparent;color:inherit;display:grid;place-items:center;width:32px;height:32px;padding:5px;cursor:pointer}.tm-icon-button:hover{background:var(--tm-hover)}.tm-icon-button:disabled{opacity:.35;cursor:default}.tm-icon-button .tm-icon{width:20px!important;height:20px!important}
#teams-mock .tm-search{display:flex;flex-direction:row;align-items:center;gap:8px;height:32px;padding:0 10px;background:var(--tm-input);border:1px solid var(--tm-stroke);border-radius:4px;max-width:560px;width:100%;justify-self:center;color:var(--tm-muted)}
#teams-mock .tm-search input{border:0;border-radius:0;background:transparent;box-shadow:none;padding:0;height:28px;color:var(--tm-fg);font-size:12px;min-width:0}#teams-mock .tm-search input::placeholder{color:var(--tm-muted)}#teams-mock .tm-search:focus-within{border-bottom:2px solid var(--tm-brand)}.tm-search>span{height:20px;display:flex;align-items:center}.tm-search .tm-icon{width:18px!important;height:18px!important;min-width:18px!important}
.tm-avatar-button{width:32px;height:32px;border:1px solid #d3c9ec;border-radius:50%;background:#e7e0f2;color:#5b447e;font-size:10px;font-weight:600;position:relative;cursor:pointer}.tm-presence{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;background:#6bb143;border:2px solid var(--tm-frame);border-radius:50%}.tm-profile-menu{position:absolute;right:12px;top:47px;z-index:10;width:260px;border:1px solid var(--tm-stroke);border-radius:7px;background:var(--tm-surface);color:var(--tm-fg);box-shadow:0 12px 32px #0002;padding:19px}.tm-profile-menu>strong{display:block;font-size:14px}.tm-profile-menu>span{display:block;font-size:11px;color:var(--tm-muted);margin-top:7px}.tm-profile-menu button{width:100%;text-align:left;margin-top:20px;padding:11px;border:1px solid var(--tm-stroke);border-radius:4px;background:var(--tm-canvas);color:var(--tm-fg);font-size:12px}.tm-profile-menu p{font-size:10px;color:var(--tm-muted);line-height:1.7;margin:14px 0 0}
#teams-mock .teams-workspace{grid-template-columns:64px 230px minmax(0,1fr);min-height:0;flex:1;overflow:hidden}#teams-mock .teams-workspace.tm-solo{grid-template-columns:64px minmax(0,1fr)}
#teams-mock .teams-apps{display:flex;flex-direction:column;gap:3px;background:var(--tm-frame);border:0;padding:5px 5px 10px;overflow-y:auto;min-height:0}.tm-rail-button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;min-height:59px;padding:9px 2px;border:0;border-radius:4px;background:transparent;color:var(--tm-muted);font-size:9px;line-height:1.2}.tm-rail-button:hover{background:var(--tm-hover)}.tm-rail-button.active{color:var(--tm-brand);background:var(--tm-active)}.tm-rail-button.active:before{content:'';position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--tm-brand)}.tm-rail-button:last-child{margin-top:auto}.tm-rail-button:nth-last-child(2){margin-top:10px;border-top:1px solid var(--tm-stroke)}
#teams-mock .teams-list{background:var(--tm-canvas);border-right:1px solid var(--tm-stroke);padding:24px 14px;color:var(--tm-fg);overflow:auto;min-height:0}#teams-mock .teams-list h3{font-size:16px;font-weight:600;letter-spacing:-.2px;color:var(--tm-fg);margin-bottom:25px}#teams-mock .mock-team-title strong{color:var(--tm-fg);font-size:12px}#teams-mock .team-initials{background:var(--tm-active);color:var(--tm-brand);border-radius:4px}#teams-mock .mock-subtitle,#teams-mock .mock-side-note{color:var(--tm-muted);font-size:10px;line-height:1.8}#teams-mock .mock-side-note{border-color:var(--tm-stroke);margin-top:25px}#teams-mock .mock-channel{color:var(--tm-muted);font-size:12px;padding:10px;border-radius:4px}#teams-mock .mock-channel:hover{background:var(--tm-hover)}#teams-mock .mock-channel.active{background:var(--tm-active);color:var(--tm-brand)}.tm-empty-note{font-size:12px;line-height:1.7;color:var(--tm-muted)}
#teams-mock .channel-workspace{display:flex;flex-direction:column;background:var(--tm-canvas);min-height:0;overflow:hidden}#teams-mock .channel-header{background:var(--tm-surface);padding:23px 24px 7px;min-height:62px}#teams-mock .channel-header h2{color:var(--tm-fg);font-size:18px;font-weight:600}#teams-mock .channel-header>span{color:var(--tm-muted);font-size:10px}#teams-mock .channel-tabs{background:var(--tm-surface);border-color:var(--tm-stroke);gap:24px;min-height:47px;flex-shrink:0}#teams-mock .channel-tabs button{color:var(--tm-muted);font-size:12px}#teams-mock .channel-tabs button.active{color:var(--tm-fg);border-color:var(--tm-brand);font-weight:600}#channel-content{overflow:auto;min-height:0;flex:1}
#teams-mock .mock-post{background:var(--tm-surface);border-color:var(--tm-stroke);border-radius:5px;padding:27px;margin:28px 24px 14px}#teams-mock .mock-post .eyebrow{color:var(--tm-brand);font-size:9px}#teams-mock .mock-post h2{color:var(--tm-fg);font-size:25px;margin-top:20px;font-weight:600}#teams-mock .mock-post p,#teams-mock .post-meta,#teams-mock .mock-caption{color:var(--tm-muted)}#teams-mock .mock-post p{font-size:13px}#teams-mock .post-meta{font-size:10px}#teams-mock .mock-post .secondary,#teams-mock .mock-files-empty .secondary{color:var(--tm-brand);border-color:var(--tm-stroke);background:var(--tm-surface);font-size:12px}#teams-mock .mock-files-empty h2{color:var(--tm-fg)}#teams-mock .mock-files-empty p{color:var(--tm-muted)}#teams-mock .mock-empty{background:var(--tm-canvas);color:var(--tm-muted);flex:1}#teams-mock .mock-caption{font-size:10px}
.tm-aux{min-width:0;min-height:0;overflow:auto;background:var(--tm-surface);color:var(--tm-fg);display:flex;flex-direction:column}.tm-panel{padding:30px 32px}.tm-panel>h2{font-size:23px;font-weight:600;color:var(--tm-fg)}.tm-panel-lead{font-size:12px;color:var(--tm-muted);margin:12px 0 25px}.tm-activity{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:15px;row-gap:6px;width:100%;text-align:left;background:var(--tm-canvas);color:var(--tm-fg);border:1px solid var(--tm-stroke);border-radius:6px;padding:22px}.tm-activity .tm-icon{grid-row:1/4;color:var(--tm-brand)}.tm-activity strong{font-size:13px;font-weight:600}.tm-activity span:not(.tm-icon),.tm-activity small{font-size:11px;color:var(--tm-muted)}.tm-app-card{display:flex;flex-direction:column;gap:14px;align-items:flex-start;max-width:360px;padding:27px;background:var(--tm-canvas);color:var(--tm-fg);border:1px solid var(--tm-stroke);border-radius:7px;text-align:left}.tm-app-card>.tm-icon{color:var(--tm-brand)}.tm-app-card strong{font-size:16px}.tm-app-card span:not(.tm-icon),.tm-app-card small{font-size:12px;color:var(--tm-muted);line-height:1.6}.tm-empty-state{text-align:center;padding:70px 20px;color:var(--tm-muted)}.tm-empty-state>.tm-icon{width:42px!important;height:42px!important;margin-bottom:20px;color:var(--tm-brand)}.tm-empty-state h3{font-size:19px;color:var(--tm-fg);letter-spacing:-.4px;margin:0 0 15px}.tm-empty-state p{font-size:12px;max-width:420px;margin:0 auto 12px}.tm-empty-state small{font-size:11px;line-height:1.7}
.tm-site-slot{min-width:0;min-height:0;overflow:auto;flex:1}.tm-site-slot .sharepoint-mock{border:0;border-radius:0;box-shadow:none}.tm-site-slot .sp-suite{display:none}.tm-site-slot .sp-site-heading{padding:23px}.tm-site-slot .sp-site-heading h2{font-size:21px}.tm-site-slot .sp-hero h2{font-size:26px}.tm-site-slot .sp-home-grid{grid-template-columns:1fr}.tm-site-slot #sp-body{min-height:0}.tm-site-slot .sp-audience{display:none}.tm-site-slot .sp-hero{padding:26px}.tm-site-slot .sp-documents{padding:20px 15px}
.tm-dark .tm-site-slot .sharepoint-mock,.tm-dark .tm-site-slot .sp-site-heading,.tm-dark .tm-site-slot .sp-tabs,.tm-dark .tm-site-slot .sp-tabs>button,.tm-dark .tm-site-slot .sp-tile,.tm-dark .tm-site-slot .sp-documents{background:var(--tm-surface);color:var(--tm-fg);border-color:var(--tm-stroke)}.tm-dark .tm-site-slot #sp-body{background:var(--tm-canvas)}.tm-dark .tm-site-slot h2,.tm-dark .tm-site-slot .sp-tabs>button.active{color:var(--tm-fg)}.tm-dark .tm-site-slot p,.tm-dark .tm-site-slot small,.tm-dark .tm-site-slot .sp-site-heading>div>span,.tm-dark .tm-site-slot .sp-tabs>span,.tm-dark .tm-site-slot td{color:var(--tm-muted)}.tm-dark .tm-site-slot .sp-tabs>button{color:var(--tm-muted)}.tm-dark .tm-site-slot th{background:var(--tm-canvas);color:var(--tm-muted)}.tm-dark .tm-site-slot td,.tm-dark .tm-site-slot th{border-color:var(--tm-stroke)}.tm-dark .tm-site-slot .folder-link,.tm-dark .tm-site-slot .sp-shortcut,.tm-dark .tm-site-slot .sp-breadcrumb{color:var(--tm-brand);border-color:var(--tm-stroke)}.tm-dark .tm-site-slot .folder-permission,.tm-dark .tm-site-slot .doc-access{background:var(--tm-active);color:var(--tm-brand)}
@media(min-width:1600px){#teams-mock .teams-workspace{grid-template-columns:68px 260px minmax(0,1fr)}#teams-mock .teams-workspace.tm-solo{grid-template-columns:68px minmax(0,1fr)}.tm-site-slot .sp-home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px){#teams-mock .teams-workspace{grid-template-columns:58px 180px minmax(0,1fr)}#teams-mock .teams-workspace.tm-solo{grid-template-columns:58px minmax(0,1fr)}#teams-mock .teams-list{padding-inline:10px}#teams-mock .teams-bar{gap:10px}.tm-preview-pill{display:none}#teams-mock .mock-post{margin:20px 15px;padding:22px}#teams-mock .channel-tabs{padding-inline:18px;gap:18px}#teams-mock .channel-header{padding-inline:18px}.tm-title-left #tm-forward{display:none}.tm-panel{padding:27px 22px}}
@media(max-width:700px){#teams-mock{height:780px;max-height:none;min-height:0}#teams-mock .teams-bar{height:52px;min-height:52px;padding:0 8px;gap:7px}#teams-mock .tm-search input{font-size:11px}.tm-title-right{gap:2px}.tm-icon-button{width:30px}.tm-title-left #tm-forward{display:grid}.tm-title-left{gap:0}#teams-mock .teams-workspace{display:grid;grid-template-columns:49px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}#teams-mock .teams-workspace.tm-solo{grid-template-columns:49px minmax(0,1fr);grid-template-rows:minmax(0,1fr)}#teams-mock .teams-apps{display:flex;grid-column:1;grid-row:1/3;padding-inline:3px;gap:4px}#teams-mock .teams-list{grid-column:2;grid-row:1;border-right:0;border-bottom:1px solid var(--tm-stroke);padding:15px 14px;max-height:220px}#teams-mock .teams-list h3{font-size:13px;margin-bottom:13px}#teams-mock .mock-team-title strong{font-size:12px}#teams-mock .mock-subtitle{font-size:9px;margin:10px 0}#teams-mock #result-channels{display:flex;flex-wrap:wrap;gap:4px}#teams-mock .mock-channel{width:auto;font-size:10px;padding:7px 9px}#teams-mock .channel-workspace{grid-column:2;grid-row:2;min-height:0}#teams-mock .tm-aux{grid-column:2;grid-row:1;min-height:0}.tm-rail-button{min-height:57px;font-size:7px;padding-inline:0}#teams-mock .teams-list .mock-side-note{display:none}#teams-mock .channel-header{padding:17px 14px 8px;gap:7px;min-height:62px}#teams-mock .channel-header h2{font-size:16px}#teams-mock .channel-header>span{font-size:8px}#teams-mock .channel-tabs{padding-inline:14px;gap:17px;min-height:43px}#teams-mock .channel-tabs button{font-size:11px;padding:12px 0}#teams-mock .mock-post{margin:18px 12px;padding:20px}#teams-mock .mock-post h2{font-size:21px}#teams-mock .mock-post p{font-size:12px}.tm-panel{padding:24px 18px}.tm-panel>h2{font-size:21px}.tm-activity{padding:17px;gap:8px}.tm-site-slot .sp-site-heading{padding:19px 15px}.tm-site-slot .sp-site-heading h2{font-size:18px}.tm-site-slot .sp-initials{display:none}.tm-site-slot .sp-tabs{padding-inline:15px;gap:16px}.tm-site-slot .sp-tabs>span{display:none}.tm-site-slot .sp-hero{padding:24px 17px}.tm-site-slot .sp-hero h2{font-size:23px}.tm-site-slot #sp-body{padding:10px}.tm-site-slot .sp-home-grid{grid-template-columns:1fr}.tm-profile-menu{right:8px;width:245px}.tm-search>span{display:none!important}.tm-title-left #tm-forward{display:none}}