/* Portable F&S workspace showcase.
 * Preserves the accepted copy/layout from the earlier preview screenshot.
 * Glass panel and neutral states only; no active left highlight strip.
 */
fs-workspace-showcase{display:block}
.fs11-workspace-section{padding:92px 0 110px;border-top:1px solid var(--fs11-line);border-bottom:1px solid var(--fs11-line)}
.fs11-workspace-grid{display:grid;grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr);align-items:center;gap:66px}
.fs11-workspace-copy h2{font-family:var(--fs11-display);font-size:clamp(46px,4.5vw,72px);line-height:1.12;letter-spacing:-.055em;max-width:470px}
.fs11-workspace-copy p{max-width:390px;margin-top:22px;font-size:15px;line-height:1.85;color:var(--fs11-muted)}
.fs11-workspace-copy .fs11-button{margin-top:25px}
.fs11-workspace-frame{min-width:0;overflow:hidden;border-radius:25px;border:1px solid var(--fs11-glass-rim);background:var(--fs11-glass);box-shadow:var(--fs11-glass-shadow);-webkit-backdrop-filter:blur(30px) saturate(135%);backdrop-filter:blur(30px) saturate(135%)}
.fs11-workspace-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 22px;border-bottom:1px solid var(--fs11-line);background:rgba(255,255,255,.06)}
.fs11-workspace-brand{font:400 19px/1.2 var(--fs11-display);letter-spacing:-.035em;color:var(--fs11-ink)}
.fs11-workspace-preview-label{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;color:var(--fs11-muted);font-size:10px}
.fs11-workspace-avatar{width:29px;height:29px;display:grid;place-items:center;border:1px solid var(--fs11-line);border-radius:50%;font-size:10px;color:var(--fs11-ink)}
.fs11-workspace-body{display:grid;grid-template-columns:147px minmax(0,1fr);min-height:338px}
.fs11-workspace-sidebar{border-right:1px solid var(--fs11-line);padding:24px 12px;background:rgba(255,255,255,.035);display:flex;flex-direction:column;gap:7px;min-width:0}
.fs11-workspace-sidebar button{display:block;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:10px;color:var(--fs11-muted);font-size:12px;font-weight:500;padding:10px 12px}
.fs11-workspace-sidebar button:hover,.fs11-workspace-sidebar button[aria-current="page"]{color:var(--fs11-ink);border-color:var(--fs11-line);background:var(--fs11-glass-heavy);font-weight:650}
.fs11-workspace-sidebar p{font:400 18px/1.18 var(--fs11-display);color:var(--fs11-muted);margin-top:auto;padding:24px 13px 3px}
.fs11-workspace-content{min-width:0;padding:34px 29px 30px}
.fs11-workspace-content h3{font:400 clamp(27px,2.4vw,39px)/1.15 var(--fs11-display);letter-spacing:-.04em;color:var(--fs11-ink)}
.fs11-workspace-content .fs11-workspace-lead{margin-top:21px;font-size:13px;font-weight:650;color:var(--fs11-ink)}
.fs11-workspace-content .fs11-workspace-description{margin-top:17px;max-width:325px;font-size:12px;line-height:1.75;color:var(--fs11-muted)}
@media(max-width:1080px){.fs11-workspace-grid{gap:35px;grid-template-columns:.83fr 1.17fr}.fs11-workspace-copy h2{font-size:clamp(43px,4.65vw,57px)}.fs11-workspace-content{padding:29px 22px}.fs11-workspace-sidebar{padding-inline:8px}}
@media(max-width:850px){.fs11-workspace-section{padding:73px 0 85px}.fs11-workspace-grid{grid-template-columns:1fr;gap:36px}.fs11-workspace-copy p{max-width:520px}.fs11-workspace-copy h2{max-width:650px;font-size:clamp(47px,7vw,66px)}.fs11-workspace-frame{max-width:760px}}
@media(max-width:600px){.fs11-workspace-section{padding:62px 0 70px}.fs11-workspace-copy h2{font-size:clamp(43px,10vw,59px)}.fs11-workspace-frame{border-radius:18px}.fs11-workspace-topbar{padding:15px 13px}.fs11-workspace-brand{font-size:16px}.fs11-workspace-preview-label{gap:6px;font-size:9px}.fs11-workspace-body{grid-template-columns:109px 1fr;min-height:300px}.fs11-workspace-sidebar{padding:17px 6px;gap:3px}.fs11-workspace-sidebar button{padding:10px 7px;font-size:10px}.fs11-workspace-sidebar p{font-size:14px;padding:18px 8px 2px}.fs11-workspace-content{padding:26px 15px}.fs11-workspace-content h3{font-size:clamp(24px,6.7vw,34px)}.fs11-workspace-content .fs11-workspace-lead{font-size:12px;margin-top:16px}.fs11-workspace-content .fs11-workspace-description{font-size:11px;margin-top:12px}}

/* Extra glass depth without changing the approved workspace content or structure. */
.fs11-workspace-section{position:relative;isolation:isolate}
.fs11-workspace-section::before{content:"";pointer-events:none;position:absolute;z-index:-1;inset:0;background-image:url("fs-columns-hero-r11.webp");background-size:cover;background-position:center 67%;filter:grayscale(1) blur(18px);opacity:.08}
html[data-theme="dark"] .fs11-workspace-section::before{opacity:.16}
.fs11-workspace-frame{background:rgba(250,249,247,.44);border-color:rgba(255,255,255,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 25px 76px rgba(30,33,30,.2);-webkit-backdrop-filter:blur(32px) saturate(110%);backdrop-filter:blur(32px) saturate(110%)}
html[data-theme="dark"] .fs11-workspace-frame{background:rgba(37,40,37,.38);border-color:rgba(255,255,255,.23);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 27px 77px rgba(0,0,0,.35)}
.fs11-workspace-sidebar{background:rgba(255,255,255,.07)}
.fs11-workspace-sidebar button[aria-current="page"]{background:var(--fs11-glass-heavy)}


/* R46 — workspace stone + glass material pass. Interaction/markup unchanged. */
.fs11-workspace-frame{
  position:relative;
  isolation:isolate;
  border:1px solid rgba(111,118,112,.26);
  background:
    linear-gradient(145deg,rgba(244,243,239,.86),rgba(215,216,211,.68) 48%,rgba(190,194,188,.72)),
    radial-gradient(circle at 18% 10%,rgba(255,255,255,.72),transparent 30%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -1px 0 rgba(88,95,90,.14),
    0 26px 70px rgba(30,38,33,.18);
  -webkit-backdrop-filter:blur(24px) saturate(112%);
  backdrop-filter:blur(24px) saturate(112%);
}
.fs11-workspace-frame::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  border-radius:inherit;
  opacity:.34;
  background:
    radial-gradient(ellipse at 22% 28%,rgba(116,126,119,.16),transparent 28%),
    radial-gradient(ellipse at 77% 62%,rgba(255,255,255,.34),transparent 34%),
    repeating-linear-gradient(118deg,rgba(94,103,97,.035) 0 1px,transparent 1px 8px);
}
.fs11-workspace-topbar{
  background:linear-gradient(180deg,rgba(255,255,255,.52),rgba(255,255,255,.2));
  border-bottom-color:rgba(82,92,85,.16);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
}
.fs11-workspace-body{
  background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(235,237,233,.08));
}
.fs11-workspace-sidebar{
  background:linear-gradient(180deg,rgba(222,224,219,.5),rgba(194,199,192,.32));
  border-right-color:rgba(74,86,78,.15);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
}
.fs11-workspace-sidebar button{
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.fs11-workspace-sidebar button:hover{
  background:rgba(255,255,255,.38);
  border-color:rgba(93,113,103,.24);
}
.fs11-workspace-sidebar button[aria-current="page"]{
  background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(219,224,219,.44));
  border-color:rgba(95,127,120,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 8px 22px rgba(55,66,59,.1);
}
.fs11-workspace-content{
  background:linear-gradient(135deg,rgba(255,255,255,.32),rgba(255,255,255,.08));
  -webkit-backdrop-filter:blur(20px) saturate(108%);
  backdrop-filter:blur(20px) saturate(108%);
}

html[data-theme="dark"] .fs11-workspace-frame{
  border-color:rgba(151,164,155,.22);
  background:
    linear-gradient(145deg,rgba(55,62,57,.88),rgba(29,37,32,.82) 52%,rgba(18,27,22,.9)),
    radial-gradient(circle at 16% 8%,rgba(143,158,148,.14),transparent 31%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.1),
    inset 0 -1px 0 rgba(0,0,0,.38),
    0 28px 78px rgba(0,0,0,.34);
}
html[data-theme="dark"] .fs11-workspace-frame::before{
  opacity:.3;
  background:
    radial-gradient(ellipse at 20% 28%,rgba(177,190,181,.09),transparent 29%),
    radial-gradient(ellipse at 78% 60%,rgba(255,255,255,.055),transparent 35%),
    repeating-linear-gradient(118deg,rgba(255,255,255,.018) 0 1px,transparent 1px 8px);
}
html[data-theme="dark"] .fs11-workspace-topbar{
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  border-bottom-color:rgba(255,255,255,.09);
}
html[data-theme="dark"] .fs11-workspace-sidebar{
  background:linear-gradient(180deg,rgba(57,68,61,.58),rgba(24,34,28,.5));
  border-right-color:rgba(255,255,255,.08);
}
html[data-theme="dark"] .fs11-workspace-sidebar button:hover{
  background:rgba(255,255,255,.075);
  border-color:rgba(127,164,154,.28);
}
html[data-theme="dark"] .fs11-workspace-sidebar button[aria-current="page"]{
  background:linear-gradient(145deg,rgba(118,142,132,.2),rgba(255,255,255,.055));
  border-color:rgba(127,164,154,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 10px 26px rgba(0,0,0,.18);
}
html[data-theme="dark"] .fs11-workspace-content{
  background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(5,12,8,.12));
}
