/* The Consequence Engine Lab's look (the CE demo's colors, Inter, lockup).
   Every rule sits under html.lab-mode: the demo host loads this file and must not change. */

/* 1. Tokens and base */
html.lab-mode{ --navy:#071e48; --bg:#f3f5f8; --text:#17283d; --text-medium:#536279; --text-dim:#536279; --border:#d7dfe8; --wire-red:#a62c32; --wire-green:#176b43; --wire-grey:#4c586a; --danger:#a62c32; --success:#176b43; --gold:#d8b65f; --sidebar-w:252px; --sans:'Inter','Segoe UI',system-ui,sans-serif; --radius:12px; --radius-sm:7px; --fs-xs:calc(12px * var(--fs-scale)); --fs-sm:calc(14px * var(--fs-scale)); --fs-md:calc(16px * var(--fs-scale)); --fs-lg:calc(18px * var(--fs-scale)); --lab-header-h:76px; --lab-wire-h:42px; --lab-dock-clear:112px; }
html.lab-mode body{font-size:var(--fs-md);line-height:1.55;background:var(--bg)}
html.lab-mode #lab-gate{background:var(--bg)}
html.lab-mode #lab-gate .signin-brand{justify-content:center}
html.lab-mode .lab-lockup{display:block;border-radius:0;width:220px;max-width:100%;height:auto}
/* The lockup picture has an opaque white background: on the door it sits on a deliberate white badge. The badge (not the picture) carries the padding, border and radius, and does not clip, so the picture's own corners stay square and whole. */
html.lab-mode #lab-gate .signin-card[data-screen="door"] .signin-brand{box-sizing:border-box;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;padding:10px;background:#fff;border:1px solid var(--border);border-radius:10px}
html.lab-mode .lab-brand-words{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 2. The front door: two cards under the lockup; the later gate steps keep a single narrow card */
html.lab-mode #lab-gate .signin-card[data-screen="door"]{max-width:920px;background:transparent;box-shadow:none;border:0;padding:0}
html.lab-mode #lab-gate .signin-card[data-screen="step"]{max-width:480px;border-top:0;border:1px solid var(--border);border-radius:12px;box-shadow:none}
html.lab-mode .lab-door{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
html.lab-mode .lab-door-card{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:22px}
html.lab-mode .lab-eyebrow{margin:0;font-size:calc(12px * var(--fs-scale));font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-medium)}
html.lab-mode .lab-door-card h2{margin:0;font-size:calc(21px * var(--fs-scale));font-weight:750}
html.lab-mode .lab-door-card .lede{margin:0}
html.lab-mode .lab-door-card .btn-ms{margin-top:auto}
html.lab-mode .join-go,html.lab-mode .btn-ms{min-height:42px;border-radius:7px}
html.lab-mode .join-go{background:var(--navy);color:#fff}
html.lab-mode .join-go.wide[data-lab="join-seat"]{white-space:normal;line-height:1.25;padding-top:10px;padding-bottom:10px}
html.lab-mode .lab-door-card .join-go{width:100%}
html.lab-mode .join-role,html.lab-mode .join-names input{min-height:42px;border-radius:7px;border:1px solid var(--border)}
@media (max-width:860px){html.lab-mode .lab-door{grid-template-columns:minmax(0,1fr)}}

/* 3. The chrome: the white header (the lockup, the lifecycle, the bar) and the status strip */
html.lab-mode #lab-header{position:sticky;top:0;z-index:40;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;min-height:76px;box-sizing:border-box;padding:8px 24px;background:#fff;border-bottom:1px solid var(--border)}
html.lab-mode .lh-brand{flex:0 0 auto;display:flex;align-items:center;min-width:0}
html.lab-mode .lh-actions{display:flex;flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;min-width:0}
html.lab-mode #lab-header #lab-bar{flex-wrap:wrap;justify-content:flex-end;margin-left:0}
html.lab-mode #lab-life:empty{display:none}
html.lab-mode #lab-life .fh-life{display:flex;gap:8px}
html.lab-mode #lab-header .btn{min-height:42px}
html.lab-mode #lab-life .fh-end,html.lab-mode #lab-header .btn-danger{color:#9c272e;background:#fff6f6;border-color:#e8bfc2}
html.lab-mode .lab-seat{position:relative}
html.lab-mode #lab-seat-btn::after{content:"";display:inline-block;margin-left:8px;vertical-align:middle;border:4px solid transparent;border-top-color:currentColor;border-bottom-width:0}
html.lab-mode .lab-seat-who{display:inline-block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
html.lab-mode #lab-seat-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:45;min-width:260px;padding:10px 12px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-hover)}
html.lab-mode #lab-seat-menu[hidden]{display:none}
html.lab-mode body.view-participant #lab-bar > [data-lang-switch]{display:none} /* the participant switch is parked until Stage 2 (the one rule Stage 2 deletes) */

/* Between a phone and the full desktop (861-1399 px) the lockup shrinks and the actions wrap onto more rows, the header growing with them. A lifecycle button has one fixed box (wide enough, and in Español tall enough, for its armed words), so the first press moves nothing and the second lands on it. */
@media (min-width:861px){
  html.lab-mode #lab-life .fh-life .btn{box-sizing:border-box;width:15em;min-width:15em;max-width:none;white-space:normal;line-height:1.2;justify-content:center;text-align:center}
  html.lab-mode:lang(es) #lab-life .fh-life .btn{width:15em;min-width:15em;height:54px}
}
@media (min-width:861px) and (max-width:1399px){
  html.lab-mode #lab-header .lab-lockup{width:160px}
}

/* The page's own control bar: a slim right-aligned row, and none for a participant (the seat menu and the strip carry its pieces). */
html.lab-mode #control-bar{position:static;background:transparent;border:0;backdrop-filter:none;padding:8px 0 0;justify-content:flex-end}
html.lab-mode #control-bar .cb-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html.lab-mode .cb-clock:empty{display:none}
html.lab-mode body.view-participant #control-bar{display:none}
html.lab-mode .fh-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* The status strip: Exercise, Round, Current step, Sim time, Your seat (the page's own nodes, moved in). */
html.lab-mode #lab-strip{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding:8px 24px;background:#fff;border-bottom:1px solid var(--border)}
html.lab-mode .ls-field{display:flex;align-items:center;gap:8px;min-width:0}
html.lab-mode .ls-k{font-size:var(--fs-xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-medium);white-space:nowrap}
html.lab-mode .ls-step{display:inline-flex;align-items:center;gap:8px;min-width:0}
html.lab-mode #lab-step-title{font-weight:700;color:var(--navy)}
html.lab-mode #lab-strip #lab-ex-name{display:block;max-width:40ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-sm);font-weight:700;color:var(--navy)}
html.lab-mode body:not(.view-participant) #lab-strip-seat{display:none}

/* 4. The news bar (red, green, grey), the strip's finish and the breadcrumb */
html.lab-mode #wire-bar{height:42px;padding:0 24px;gap:12px;font-size:calc(14px * var(--fs-scale));background:var(--wire-red)}
html.lab-mode #wire-bar.started{background:var(--wire-green)}
html.lab-mode #wire-bar.ended{background:var(--wire-grey)}
html.lab-mode #wire-bar .wire-tag{color:var(--wire-red)}
html.lab-mode #wire-bar.started .wire-tag{color:var(--wire-green)}
html.lab-mode #wire-bar.ended .wire-tag{color:var(--wire-grey)}
html.lab-mode #lab-strip{min-height:52px;gap:8px 28px}
html.lab-mode #lab-strip .ls-k{display:block;font-size:calc(11px * var(--fs-scale));font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text-medium)}
html.lab-mode #lab-strip .ls-field{flex-direction:column;align-items:flex-start;gap:2px}
html.lab-mode #lab-strip #lab-ex-name,html.lab-mode #lab-strip #round-badge,html.lab-mode #lab-strip #sim-time,html.lab-mode #lab-strip #lab-step-title,html.lab-mode #lab-strip #lab-strip-seat-who{font-size:calc(15px * var(--fs-scale));font-weight:700;color:var(--text)}
html.lab-mode #lab-strip .sim-time:not([hidden]){display:flex;flex-direction:column}
html.lab-mode #lab-strip .sim-time[hidden]{display:none}
html.lab-mode #lab-strip .sim-label{display:block;font-size:calc(11px * var(--fs-scale));font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text-medium)}
html.lab-mode #lab-strip .ls-step{display:flex;align-items:center;gap:6px}
html.lab-mode #lab-strip .round-control button,html.lab-mode #lab-strip .step-arrow{min-height:42px;min-width:42px}
html.lab-mode .lab-crumb{margin:0;padding:14px 32px 0;font-size:calc(12px * var(--fs-scale));font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-medium)}
html.lab-mode #lab-strip .ls-field{max-width:100%}
html.lab-mode #lab-strip #lab-ex-name{max-width:min(40ch,100%)}
html.lab-mode #lab-strip #round-badge{background:#e8eef6}

/* 5. The menu and the workspace */
html.lab-mode{--lab-dock-clear:112px}
html.lab-mode .sidebar{background:#071e48;border-right:0;padding:12px 12px 18px}
html.lab-mode .sidebar::before{display:none}
html.lab-mode .brand{display:none}
html.lab-mode .sidebar-label{font-family:inherit;font-size:calc(12px * var(--fs-scale));letter-spacing:.08em;color:#afc3df;padding:14px 12px 6px}
html.lab-mode .nav-item{min-height:42px;padding:10px 12px;border-radius:7px;font-size:calc(15px * var(--fs-scale));font-weight:600;color:#e9f0fa;gap:10px}
html.lab-mode .nav-item:hover{background:#1b355a;transform:none}
html.lab-mode .nav-item.active{background:#243f68;color:#fff;box-shadow:inset 3px 0 0 #dc6878}
html.lab-mode .nav-item svg{background:transparent;padding:0;width:18px;height:18px}
html.lab-mode .nav-item.active svg{background:transparent;color:#fff;box-shadow:none}
html.lab-mode .nav-item.nav-sub{margin-left:14px;width:calc(100% - 14px);min-height:42px;font-size:calc(15px * var(--fs-scale))}
html.lab-mode .nav-badge{background:#a62c32}
html.lab-mode .page-stack{padding:28px 32px max(var(--lab-dock-clear),var(--lab-teddy-clear,0px))}
html.lab-mode .page{max-width:1440px;margin:0 auto}
html.lab-mode .card{padding:22px;border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 5px rgba(23,48,74,.03)}
html.lab-mode .fac-head{top:-28px;border-radius:12px}
html.lab-mode .step-bar{border-radius:12px}
html.lab-mode .page-title,html.lab-mode h1.fh-name{font-size:calc(30px * var(--fs-scale));font-weight:750;letter-spacing:-.02em}
html.lab-mode [data-lang-switch] .view-btn,html.lab-mode #seat-leave{min-height:42px;border-radius:7px}
html.lab-mode .btn,html.lab-mode .btn-sm{min-height:42px;padding:9px 14px;border-radius:7px;font-weight:650}
html.lab-mode .btn-primary{background:var(--navy);color:#fff;border-color:var(--navy)}
html.lab-mode .btn-danger{color:#9c272e;background:#fff6f6;border-color:#e8bfc2}
html.lab-mode body :focus-visible,html.lab-mode #lab-new :is(button,select,input,a):focus-visible,html.lab-mode .fac-head button:focus-visible,html.lab-mode .seat-chip button:focus-visible,html.lab-mode :is(.join-go,.join-alt,.join-role,.join-back,.join-reveal):focus-visible{outline:3px solid #1772d6;outline-offset:3px}
/* The page's older focus styles (index.html 173, 231, 397, 424, 564-565, 623, 631, 740, 748, 761, 1225, 1280) give way to the Lab's ring. */
html.lab-mode body .step-arrow:focus-visible,html.lab-mode body .prov:focus-visible,html.lab-mode body .team-card button:focus-visible,html.lab-mode body .team-dialog button:focus-visible,html.lab-mode body .demo-row:focus-visible,html.lab-mode body .fac-head button:focus-visible,html.lab-mode body .fac-head .seat-chip button:focus-visible,html.lab-mode body .fac-page .ws-fold:focus-visible,html.lab-mode body .fac-page .ws-tools button:focus-visible,html.lab-mode body .fac-page .ws-note button:focus-visible,html.lab-mode body .fac-page .acc-header:focus-visible,html.lab-mode body .fac-page .loc-grid .btn:focus-visible,html.lab-mode body #loc-review-card:focus-visible,html.lab-mode body .fac-page .details-edit :is(button,input):focus-visible,html.lab-mode body .fac-page .details-dash a:focus-visible,html.lab-mode body .fac-page .exercise-row:focus-visible,html.lab-mode body .join-go:focus-visible,html.lab-mode body .join-alt:focus-visible,html.lab-mode body .join-role:focus-visible,html.lab-mode body .join-back:focus-visible,html.lab-mode body .join-reveal:focus-visible,html.lab-mode body .seat-chip button:focus-visible,html.lab-mode body #lab-new :is(button,select,input,a):focus-visible{outline:3px solid #1772d6;outline-offset:3px;box-shadow:none}
@media (max-width:640px){
  html.lab-mode .card{padding:16px}
  html.lab-mode .page-title,html.lab-mode h1.fh-name{font-size:calc(24px * var(--fs-scale))}
}
@media (max-width:860px){
  html.lab-mode .page-stack{padding:20px 16px var(--lab-dock-clear)}
}

/* 6. Phones (860 px and below): one Menu button; the real #sidebar is a slide-over drawer that also holds the header's buttons. */
html.lab-mode #lab-menu-btn,html.lab-mode #lab-drawer-close,html.lab-mode #lab-scrim{display:none}
html.lab-mode #lab-drawer-actions:empty{display:none}
@media (max-width:860px){
  html.lab-mode{--lab-dock-clear:156px}
  html.lab-mode #lab-header{height:60px;min-height:60px;padding:0 16px;flex-wrap:nowrap}
  html.lab-mode #lab-header .lab-lockup{width:150px}
  html.lab-mode #lab-menu-btn{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto}
  html.lab-mode .app-shell{display:block}
  html.lab-mode #sidebar{position:fixed;top:0;left:0;bottom:0;height:100dvh;width:min(86vw,340px);z-index:55;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:12px 12px 24px;border-bottom:0;transform:translateX(-102%);visibility:hidden;transition:transform .2s ease,visibility 0s linear .2s}
  html.lab-mode body.lab-drawer-open #sidebar{transform:none;visibility:visible;transition:transform .2s ease}
  html.lab-mode .sidebar-label{display:block}
  html.lab-mode #nav{display:flex;flex-direction:column;flex:0 0 auto;overflow:visible;gap:2px}
  html.lab-mode .nav-item,html.lab-mode .nav-item.nav-sub{flex-direction:row;justify-content:flex-start;width:100%;min-width:0;white-space:normal;text-align:left;font-size:calc(15px * var(--fs-scale))}
  html.lab-mode .nav-item.nav-sub{margin-left:14px;width:calc(100% - 14px)}
  html.lab-mode .nav-badge{position:static;margin-left:auto}
  html.lab-mode #lab-drawer-close{display:inline-flex;align-items:center;justify-content:center;align-self:flex-end;min-height:42px;min-width:42px}
  html.lab-mode #lab-drawer-actions{display:block;margin-top:16px;padding-top:16px;border-top:1px solid #243f68}
  html.lab-mode #lab-drawer-actions .lh-actions,html.lab-mode #lab-drawer-actions #lab-bar,html.lab-mode #lab-drawer-actions #lab-life .fh-life,html.lab-mode #lab-drawer-actions .lab-seat{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:10px;width:100%;max-width:100%;min-width:0;margin:0}
  html.lab-mode #lab-drawer-actions #lab-bar > .btn,html.lab-mode #lab-drawer-actions .fh-life .btn{flex:0 0 auto;width:100%;min-width:0;max-width:100%;white-space:normal;justify-content:center;text-align:center}
  html.lab-mode #lab-drawer-actions [data-lang-switch]{display:flex;width:100%}
  html.lab-mode #lab-drawer-actions [data-lang-switch] .view-btn{flex:1;justify-content:center}
  html.lab-mode #lab-drawer-actions #lab-life:empty{display:none}
  html.lab-mode #lab-seat-btn{display:none}
  html.lab-mode #lab-seat-menu{position:static;min-width:0;box-shadow:none}
  @media (prefers-reduced-motion:reduce){html.lab-mode #sidebar,html.lab-mode body.lab-drawer-open #sidebar{transition:none}}
  html.lab-mode #lab-scrim{position:fixed;inset:0;z-index:54;background:rgba(7,30,72,.55)}
  html.lab-mode body.lab-drawer-open #lab-scrim{display:block}
  html.lab-mode body.lab-drawer-open{overflow:hidden}
  /* The strip: the exercise on its own first line (label and name side by side), then the round, step and sim time. */
  html.lab-mode #lab-strip{padding:6px 16px;gap:4px 12px}
  html.lab-mode #lab-strip #lab-strip-time{order:1} /* the sim time beside the round; the step, the widest, takes the line under them (it has no focusable control to reorder) */
  html.lab-mode #lab-strip #lab-strip-step{order:2}
  html.lab-mode #lab-strip #lab-strip-seat{order:3;flex:1 1 150px} /* a player's seat takes what is left beside the step and wraps rather than runs off */
  html.lab-mode #lab-strip #lab-strip-seat-who{white-space:normal;overflow-wrap:anywhere}
  html.lab-mode #lab-strip .ls-k{line-height:1.1}
  html.lab-mode #lab-strip #lab-strip-exercise{flex:1 0 100%;flex-direction:row;align-items:baseline;gap:8px}
  html.lab-mode #lab-strip #round-badge{padding:0 8px}
  html.lab-mode #wire-bar .wire-breaking,html.lab-mode #wire-bar .wire-viewall{display:none}
}

/* 7. Learning with Teddy: the docked button (bottom right), the guide above it, the chat slot's reserved place (Stage 4) */
html.lab-mode:not(.lab-exercise) #lab-dock,html.lab-mode:not(.lab-exercise) #lab-teddy{display:none!important}
html.lab-mode #lab-dock{position:fixed;right:20px;bottom:20px;z-index:50;display:flex;flex-direction:row-reverse;align-items:flex-end;gap:12px}
html.lab-mode #lab-dock-chat-slot{flex:0 0 auto;min-width:56px;min-height:56px}
html.lab-mode .lt-launch{position:relative;display:block;width:70px;height:86px;padding:0;border:0;border-radius:12px;background:transparent;cursor:pointer}
html.lab-mode .lt-launch img{display:block;width:64px;height:78px;margin:4px auto 0;pointer-events:none}
html.lab-mode .lt-dot{position:absolute;top:0;right:0;width:22px;height:22px;border-radius:50%;background:#d8b65f;color:#071e48;font-size:calc(14px * var(--fs-scale));font-weight:800;line-height:22px;text-align:center;box-shadow:0 1px 3px rgba(7,30,72,.3)}
html.lab-mode #lab-teddy[hidden]{display:none}
html.lab-mode #lab-teddy:not([hidden]){position:fixed;right:20px;bottom:20px;z-index:62;width:min(480px,calc(100vw - 40px));display:grid;grid-template-columns:minmax(0,1fr) 132px;align-items:end;transform-origin:bottom right;animation:lt-grow .16s ease-out} /* above the side panels (z 61): the guide stays usable while Show me has one open. Teddy grows where the small one was: the dock's corner */
html.lab-mode #lab-teddy .lt-pic{grid-column:2;grid-row:1;justify-self:end}
html.lab-mode #lab-teddy .lt-bubble{grid-column:1;grid-row:1}
html.lab-mode #lab-teddy .lt-pic img{display:block;width:120px;height:auto}
html.lab-mode body.lab-teddy-open .lt-launch{visibility:hidden} /* one Teddy at a time: the dock keeps its size, so the chat slot does not move */
@keyframes lt-grow{from{transform:scale(.6)}to{transform:none}}
@media (prefers-reduced-motion:reduce){html.lab-mode #lab-teddy:not([hidden]){animation:none}}
html.lab-mode #lab-teddy .lt-bubble{position:relative;box-sizing:border-box;padding:16px 18px;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 24px rgba(7,30,72,.16);color:var(--text)}
html.lab-mode #lab-teddy .lt-kicker{margin:0 56px 4px 0;font-size:calc(11px * var(--fs-scale));font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-medium)}
html.lab-mode #lab-teddy-title{margin:0 56px 6px 0;font-size:calc(18px * var(--fs-scale));font-weight:750;line-height:1.25;color:var(--navy)}
html.lab-mode #lab-teddy-title:focus{outline:none}
html.lab-mode #lab-teddy-title:focus-visible{outline:3px solid #1772d6;outline-offset:3px;border-radius:4px}
html.lab-mode #lab-teddy-body{margin:0 0 12px;font-size:calc(14px * var(--fs-scale));line-height:1.5}
html.lab-mode #lab-teddy .lt-actions{display:flex;flex-wrap:wrap;gap:8px}
html.lab-mode #lab-teddy .lt-actions .btn{min-height:42px}
html.lab-mode #lab-teddy .lt-count{margin:10px 0 0;font-size:calc(12px * var(--fs-scale));color:var(--text-medium)}
html.lab-mode #lab-teddy .lt-min{position:absolute;top:8px;right:8px;min-height:42px;min-width:42px;padding:0;line-height:1;font-size:calc(20px * var(--fs-scale))}
html.lab-mode .side-body{padding-bottom:max(28px,var(--lab-teddy-clear,0px))} /* an open panel's last controls scroll clear of the open guide (set on a desktop only) */
html.lab-mode .lab-teddy-focus{outline:3px solid #1772d6;outline-offset:4px;box-shadow:0 0 0 7px rgba(216,182,95,.55);border-radius:7px;position:relative;z-index:1}
html.lab-mode .toast-stack{bottom:var(--lab-dock-clear)}
@media (max-width:860px){
  html.lab-mode #lab-dock{right:16px;bottom:16px;flex-direction:column;align-items:flex-end;gap:12px}
  html.lab-mode .lt-launch{width:56px;height:56px;border-radius:50%;background:#fff;border:1px solid var(--border);box-shadow:0 4px 12px rgba(7,30,72,.2)}
  html.lab-mode .lt-launch img{width:40px;height:48px;margin:3px auto 0}
  html.lab-mode .lt-dot{top:-4px;right:-4px}
  html.lab-mode #lab-teddy:not([hidden]){left:0;right:0;bottom:0;width:auto;max-height:70dvh;overflow:auto;grid-template-columns:minmax(0,1fr) 88px;border-radius:16px 16px 0 0;background:#fff;border-top:1px solid var(--border);box-shadow:0 -8px 24px rgba(7,30,72,.18)}
  html.lab-mode #lab-teddy .lt-pic img{width:80px}
  html.lab-mode #lab-teddy .lt-bubble{border:0;border-radius:0;box-shadow:none;padding:16px 4px 18px 16px}
  html.lab-mode body.lab-teddy-open #lab-dock{visibility:hidden}
  html.lab-mode body.lab-drawer-open #lab-dock{display:none}
}