/* OilStation mobile app shell.
 * Reference: supplied banking mobile screenshot — content structure and icon
 * navigation, not its trademarks, amounts, mascots or orange palette.
 * Gentelella v4 remains the desktop visual system.
 */
.os-mobile-home,.os-mobile-bottom{display:none}
@media(max-width:850px){
 #app.workspace-mode{
   background:#f4f7f9;min-height:100dvh;
 }
 #app.workspace-mode .ws-layout{min-height:100dvh}
 #app.workspace-mode .ws-main{
   padding-bottom:calc(118px + env(safe-area-inset-bottom));
 }
 #app.workspace-mode .os-mobile-bottom{
   position:fixed;display:grid;
   grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;
   left:0;right:0;bottom:0;z-index:60;
   min-height:77px;
   padding:9px 8px calc(9px + env(safe-area-inset-bottom));
   background:#fff;border:1px solid #e4e9ee;
   border-radius:24px 24px 0 0;
   box-shadow:0 -5px 22px rgba(20,40,55,.10);
 }
 #app.workspace-mode .os-mobile-tab{
   display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
   height:63px;min-height:63px;min-width:0;
   background:transparent;border:0;border-radius:12px;color:#596773;
   padding:5px 2px;cursor:pointer;
   font:inherit;font-size:11px;font-weight:580;line-height:1.2;
   touch-action:manipulation;position:relative;
 }
 #app.workspace-mode .os-mobile-tab>svg{width:23px;height:23px;stroke-width:1.85;flex:none}
 #app.workspace-mode .os-mobile-tab>span:last-child{
   white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
 }
 #app.workspace-mode .os-mobile-tab.is-current:not(.os-mobile-scan){
   color:#07816f;font-weight:760;
 }
 #app.workspace-mode .os-mobile-tab.is-current:not(.os-mobile-scan)>svg{
   stroke-width:2.35;
 }
 #app.workspace-mode .os-mobile-scan{
   height:77px;min-height:77px;overflow:visible;justify-content:flex-start;
   transform:translateY(-16px);font-weight:750;color:#0b796b;
 }
 #app.workspace-mode .os-mobile-scan-bubble{
   display:grid;place-items:center;flex:none;
   width:65px;height:65px;border-radius:50%;
   background:#12a68b;border:5px solid #fff;color:#fff;
   box-shadow:0 5px 15px rgba(3,114,95,.23);
 }
 #app.workspace-mode .os-mobile-scan-bubble svg{width:30px;height:30px;stroke-width:2.1}
 #app.workspace-mode .os-mobile-scan>span:last-child{margin-top:0;font-size:11px}
 #app.workspace-mode .os-mobile-scan:disabled{
   opacity:.42;filter:grayscale(.6);cursor:not-allowed;
 }
 #app.workspace-mode .os-mobile-tab:focus-visible,
 #app.workspace-mode .os-mobile-quick:focus-visible,
 #app.workspace-mode .os-mobile-feature:focus-visible{
   outline:3px solid #1aa98f;outline-offset:2px;
 }
 #app.workspace-mode .ws-layout[data-active-screen="overview"] .ws-toolbar,
 #app.workspace-mode .ws-layout[data-active-screen="overview"] .ws-header,
 #app.workspace-mode [data-ws-screen="overview"] .ws-screen-head,
 #app.workspace-mode [data-ws-screen="overview"] .ws-overview-columns{
   display:none;
 }
 #app.workspace-mode .ws-layout[data-active-screen="overview"] .ws-main{
   padding:0 0 calc(115px + env(safe-area-inset-bottom));
 }
 #app.workspace-mode .ws-layout[data-active-screen="overview"] .ws-content{width:100%}
 #app.workspace-mode .os-mobile-home{display:block;width:100%;min-width:0}
 #app.workspace-mode .os-mobile-hero{
   position:relative;overflow:hidden;
   padding:calc(24px + env(safe-area-inset-top)) 19px 29px;
   background:linear-gradient(140deg,#08786b 0%,#12a88c 50%,#097b80 100%);
   color:#fff;
   border-radius:0 0 25px 25px;
 }
 #app.workspace-mode .os-mobile-hero::before,
 #app.workspace-mode .os-mobile-hero::after{
   content:"";position:absolute;pointer-events:none;
   width:230px;height:230px;border-radius:50%;opacity:.18;
   background:radial-gradient(circle at 45% 45%,#c6ffe3,transparent 73%);
 }
 #app.workspace-mode .os-mobile-hero::before{top:-122px;right:-96px}
 #app.workspace-mode .os-mobile-hero::after{bottom:80px;left:-142px}
 #app.workspace-mode .os-mobile-hero>*{position:relative;z-index:1}
 #app.workspace-mode .os-mobile-hero-title{
   display:flex;justify-content:space-between;align-items:center;gap:10px;
   margin-bottom:20px;
 }
 #app.workspace-mode .os-mobile-eyebrow{
   display:block;font-size:10px;font-weight:750;letter-spacing:.15em;
   color:#d8fef2;margin-bottom:2px;
 }
 #app.workspace-mode .os-mobile-hero-title h3{
   font-size:23px;letter-spacing:-.02em;color:#fff;
   margin:0 0 3px;font-weight:780;
 }
 #app.workspace-mode .os-mobile-hero-title p{
   margin:0;font-size:12px;line-height:1.6;color:#e1fff5;
 }
 #app.workspace-mode .os-mobile-hero-mark{
   display:grid;place-items:center;flex:none;width:39px;height:39px;
   background:#ffffff26;border:1px solid #ffffff66;
   border-radius:11px;font-size:22px;font-weight:820;color:#fff;
 }
 #app.workspace-mode .os-mobile-search{
   display:flex;align-items:center;gap:11px;
   min-height:49px;padding:0 15px;border:1px solid #ffffff65;
   border-radius:30px;background:#ffffff28;
   color:#fff;margin-bottom:20px;
   backdrop-filter:blur(4px);
 }
 #app.workspace-mode .os-mobile-search svg{height:19px;width:19px;flex:none}
 #app.workspace-mode .os-mobile-search input{
   flex:1;min-width:0;min-height:46px;border:0;outline:0!important;
   background:transparent!important;color:#fff!important;
   font:inherit;font-size:16px;padding:0;
   box-shadow:none;
 }
 #app.workspace-mode .os-mobile-search input::placeholder{color:#e5fff4;opacity:.95}
 #app.workspace-mode .os-mobile-search:focus-within{outline:2px solid #fff;outline-offset:1px}
 #app.workspace-mode .os-mobile-quick-grid{
   display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
   gap:4px;margin:0 -4px 23px;
 }
 #app.workspace-mode .os-mobile-quick{
   display:flex;flex-direction:column;align-items:center;gap:10px;
   min-width:0;min-height:89px;
   border:0;background:transparent;color:#fff;
   border-radius:12px;padding:8px 1px;cursor:pointer;
   font:inherit;font-size:12px;font-weight:670;line-height:1.35;
   text-align:center;touch-action:manipulation;
 }
 #app.workspace-mode .os-mobile-quick:hover{background:#ffffff22}
 #app.workspace-mode .os-mobile-quick-icon{display:grid;place-items:center;height:39px}
 #app.workspace-mode .os-mobile-quick-icon svg{height:31px;width:31px;stroke-width:1.8}
 #app.workspace-mode .os-mobile-quick>span:last-child{
   overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;
   -webkit-box-orient:vertical;overflow:hidden;
 }
 #app.workspace-mode .os-mobile-summary-grid{
   display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
 }
 #app.workspace-mode .os-mobile-summary-card{
   display:flex;flex-direction:column;align-items:flex-start;
   min-height:174px;min-width:0;padding:17px 15px;
   border:0;border-radius:20px;background:#fff;color:#223846;
   box-shadow:0 5px 15px rgba(9,54,54,.09);
 }
 #app.workspace-mode .os-mobile-summary-icon{
   display:grid;place-items:center;width:28px;height:28px;
   border-radius:8px;background:#e6f7f0;color:#0b9179;
   margin-bottom:11px;
 }
 #app.workspace-mode .os-mobile-summary-icon svg{width:18px;height:18px}
 #app.workspace-mode .os-mobile-summary-card h4{
   font-size:13px;line-height:1.45;margin:0 0 7px;
   font-weight:750;color:#263a49;
 }
 #app.workspace-mode .os-mobile-summary-card strong{
   font-size:21px;font-variant-numeric:tabular-nums;
   font-weight:790;line-height:1.2;margin-bottom:8px;color:#0b7c6f;
 }
 #app.workspace-mode .os-mobile-summary-card p{
   margin:0;font-size:12px;line-height:1.55;color:#5f7281;
 }
 #app.workspace-mode .os-mobile-features{
   background:#fff;margin-top:16px;padding:20px 15px 25px;
   border-radius:18px 18px 0 0;
 }
 #app.workspace-mode .os-mobile-section-title{
   display:flex;align-items:baseline;justify-content:space-between;
   gap:10px;padding:0 5px 17px;
 }
 #app.workspace-mode .os-mobile-section-title h3{
   margin:0;font-size:17px;font-weight:780;color:#2c3d4b;
 }
 #app.workspace-mode .os-mobile-section-title span{font-size:12px;color:#72838f}
 #app.workspace-mode .os-mobile-feature-grid{
   display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
   gap:19px 7px;align-items:start;
 }
 #app.workspace-mode .os-mobile-feature{
   display:flex;flex-direction:column;align-items:center;gap:9px;
   min-width:0;min-height:91px;padding:4px 2px;
   border:0;border-radius:10px;background:#fff;
   color:#3c4c59;font:inherit;font-size:12px;
   text-align:center;line-height:1.45;cursor:pointer;
 }
 #app.workspace-mode .os-mobile-feature:hover{background:#f2f9f6}
 #app.workspace-mode .os-mobile-feature-icon{
   display:grid;place-items:center;width:47px;height:47px;
   border-radius:15px;background:#e9f6f2;color:#148e78;
 }
 #app.workspace-mode .os-mobile-feature:nth-child(4n+2) .os-mobile-feature-icon{
   background:#eaf3ff;color:#2e719f;
 }
 #app.workspace-mode .os-mobile-feature:nth-child(4n+3) .os-mobile-feature-icon{
   background:#fff4e5;color:#bd7c24;
 }
 #app.workspace-mode .os-mobile-feature:nth-child(4n+4) .os-mobile-feature-icon{
   background:#f1eeff;color:#7363b6;
 }
 #app.workspace-mode .os-mobile-feature-icon svg{width:25px;height:25px;stroke-width:1.9}
 #app.workspace-mode .os-mobile-feature>span:last-child{
   overflow-wrap:anywhere;
 }
 #app.workspace-mode .os-mobile-no-results{
   padding:16px;text-align:center;font-size:13px;color:#6d7d8b;
 }
 /* Real camera view occupies the screen once the center scan button is tapped. */
 #app.workspace-mode .os-mobile-camera.is-scanning{
   display:flex;flex-direction:column;align-items:center;justify-content:center;
   position:fixed;inset:0;z-index:100;
   width:100vw;height:100dvh;
   border:0;border-radius:0;background:#091921;
   margin:0;padding:0;overflow:hidden;
 }
 #app.workspace-mode .os-mobile-camera.is-scanning #scan-video{
   display:block!important;width:100%;height:100%;max-height:none;
   object-fit:cover;position:absolute;inset:0;
 }
 #app.workspace-mode .os-mobile-camera.is-scanning::after{
   content:"";position:absolute;
   width:min(68vw,270px);height:min(68vw,270px);
   border:3px solid #59eed0;border-radius:18px;
   box-shadow:0 0 0 9999px #041a2777;pointer-events:none;
 }
 #app.workspace-mode .os-mobile-camera.is-scanning #stop-camera{
   position:absolute;top:calc(18px + env(safe-area-inset-top));right:16px;
   z-index:2;background:#fff;color:#19333d;border:0;border-radius:30px;
   min-width:110px;padding:10px 16px;box-shadow:0 3px 14px #0006;
 }
 #app.workspace-mode .os-mobile-camera.is-scanning #start-camera{display:none!important}
}
@media(max-width:360px){
 #app.workspace-mode .os-mobile-feature-grid{gap:14px 4px}
 #app.workspace-mode .os-mobile-hero{padding-inline:12px}
 #app.workspace-mode .os-mobile-feature{font-size:11px}
 #app.workspace-mode .os-mobile-tab{font-size:10px}
 #app.workspace-mode .os-mobile-summary-card{padding:14px 12px}
}
@media(prefers-reduced-motion:reduce){
 #app.workspace-mode .os-mobile-tab,
 #app.workspace-mode .os-mobile-scan{transition:none;animation:none}
}

/* Mobile drawer must sit ABOVE its scrim and the persistent bottom tabs.
   Regression fix: Gentelella's desktop sidebar z-index (25) was overriding
   the older mobile value (45), leaving the scrim (44) intercepting taps. */
@media(max-width:850px){
 #app.workspace-mode .ws-sidebar,
 #app.workspace-mode .ws-layout[data-rail="collapsed"] .ws-sidebar{
   z-index:120;
   pointer-events:auto;
 }
 #app.workspace-mode .ws-menu-backdrop:not([hidden]){
   z-index:100;
 }
 #app.workspace-mode .os-mobile-bottom{
   z-index:60;
 }
 #app.workspace-mode .ws-mobile-close{
   color:#f3faf9;
   background:rgba(255,255,255,.1);
 }
 #app.workspace-mode .ws-mobile-close:hover{
   background:rgba(255,255,255,.17);
 }
}


/* Shared mobile page treatment: the overview is the design source of truth.
   All authenticated module views get the same teal hero and card rhythm. */
.os-mobile-page-hero{display:none}
.os-mobile-page-content{display:contents}
@media(max-width:850px){
 #app.workspace-mode .ws-layout:not([data-active-screen="overview"]) .ws-main{
   --os-mobile-gutter:18px;
   padding:0 var(--os-mobile-gutter) calc(126px + env(safe-area-inset-bottom));
 }
 #app.workspace-mode .ws-layout:not([data-active-screen="overview"]) :is(.ws-toolbar,.ws-header){
   display:none;
 }
 #app.workspace-mode .ws-screen:not([data-ws-screen="overview"]).panel{
   min-height:0;border:0;border-radius:0;background:transparent;
   padding:0;margin:0;box-shadow:none;
 }
 /* Keep one accessible heading/description for screen readers without
    repeating the old desktop title above the teal mobile header. */
 #app.workspace-mode .ws-screen:not([data-ws-screen="overview"]) .ws-screen-head{
   position:absolute!important;width:1px!important;height:1px!important;
   padding:0!important;margin:-1px!important;overflow:hidden!important;
   border:0!important;white-space:nowrap!important;
   clip-path:inset(50%)!important;
 }
 #app.workspace-mode .os-mobile-page-hero{
   display:block;position:relative;overflow:hidden;
   margin:0 calc(-1 * var(--os-mobile-gutter));
   padding:calc(20px + env(safe-area-inset-top)) 20px 66px;
   border-radius:0 0 25px 25px;
   color:#fff;
   background:linear-gradient(140deg,#08786b 0%,#12a88c 50%,#097b80 100%);
 }
 #app.workspace-mode .os-mobile-page-hero::before,
 #app.workspace-mode .os-mobile-page-hero::after{
   content:"";pointer-events:none;position:absolute;border-radius:50%;
   width:235px;height:235px;opacity:.17;
   background:radial-gradient(circle at center,#c6ffe3,transparent 72%);
 }
 #app.workspace-mode .os-mobile-page-hero::before{top:-135px;right:-85px}
 #app.workspace-mode .os-mobile-page-hero::after{bottom:-142px;left:-120px}
 #app.workspace-mode .os-mobile-page-hero>*{position:relative;z-index:1}
 #app.workspace-mode .os-mobile-page-top{
   display:flex;align-items:center;justify-content:space-between;gap:12px;
   margin-bottom:25px;
 }
 #app.workspace-mode .os-mobile-page-home{
   min-height:42px;display:flex;align-items:center;justify-content:center;
   gap:6px;border-radius:22px;border:1px solid #ffffff69;
   padding:9px 13px;background:#ffffff20;color:#fff;
   font:inherit;font-size:12px;font-weight:740;cursor:pointer;
   touch-action:manipulation;
 }
 #app.workspace-mode .os-mobile-page-home svg{width:17px;height:17px}
 #app.workspace-mode .os-mobile-page-home:hover{background:#ffffff35}
 #app.workspace-mode .os-mobile-page-heading{
   display:flex;align-items:flex-start;gap:14px;min-width:0;
 }
 #app.workspace-mode .os-mobile-page-icon{
   display:grid;place-items:center;flex:none;width:54px;height:54px;
   border:1px solid #ffffff78;border-radius:17px;
   color:#fff;background:#ffffff24;
 }
 #app.workspace-mode .os-mobile-page-icon svg{width:28px;height:28px;stroke-width:1.9}
 #app.workspace-mode .os-mobile-page-copy{min-width:0}
 #app.workspace-mode .os-mobile-page-kicker{
   display:block;margin-bottom:3px;
   color:#defff3;font-size:11px;font-weight:720;
 }
 #app.workspace-mode .os-mobile-page-copy strong{
   display:block;font-size:clamp(21px,4.9vw,26px);
   line-height:1.4;letter-spacing:-.018em;overflow-wrap:anywhere;
   font-weight:780;color:#fff;
 }
 #app.workspace-mode .os-mobile-page-copy p{
   font-size:13px;line-height:1.65;color:#e6fff6;
   margin:5px 0 0;overflow-wrap:anywhere;
 }
 #app.workspace-mode .os-mobile-page-shortcuts{
   display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
   padding:18px 0 0;min-width:0;
 }
 #app.workspace-mode .os-mobile-page-shortcuts::-webkit-scrollbar{display:none}
 #app.workspace-mode .os-mobile-page-shortcuts button{
   display:flex;align-items:center;gap:7px;min-height:41px;
   flex:0 0 auto;max-width:75vw;
   padding:7px 12px;border:1px solid #ffffff52;border-radius:22px;
   color:#fff;background:#ffffff20;font:inherit;font-size:12px;
   font-weight:680;cursor:pointer;touch-action:manipulation;
 }
 #app.workspace-mode .os-mobile-page-shortcuts button:hover{background:#ffffff32}
 #app.workspace-mode .os-mobile-page-shortcuts button svg{
   flex:none;width:17px;height:17px;
 }
 #app.workspace-mode .os-mobile-page-shortcuts button span{
   overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
 }
 #app.workspace-mode :is(.os-mobile-page-shortcuts button,.os-mobile-page-home,.os-mobile-power):focus-visible{
   outline:3px solid #fff;outline-offset:3px;
 }
 #app.workspace-mode .os-mobile-page-content{
   display:block;position:relative;
   margin-top:-38px;padding:0 0 18px;
   min-width:0;
 }
 #app.workspace-mode .os-mobile-page-content>.ws-widget:not(:empty){
   min-width:0;max-width:100%;overflow:visible;
   background:#fff;border:1px solid #e3e8ed;
   border-radius:21px;
   padding:clamp(16px,3.6vw,23px);
   box-shadow:0 6px 20px rgba(12,56,66,.06);
 }
 #app.workspace-mode .os-mobile-page-content>.ws-widget:empty{display:none}
 #app.workspace-mode .os-mobile-page-content>.ws-widget+.ws-widget:not(:empty){
   margin-top:15px;
 }
 #app.workspace-mode .os-mobile-page-content>.ws-widget>section{
   background:transparent;border:0;border-radius:0;
   box-shadow:none;padding:0;
 }
 #app.workspace-mode .os-mobile-page-content :is(h2,h3){
   color:#203849;letter-spacing:-.015em;
 }
 #app.workspace-mode .os-mobile-page-content h2{
   font-size:21px;line-height:1.38;
 }
 #app.workspace-mode .os-mobile-page-content h3{
   font-size:18px;line-height:1.5;
 }
 #app.workspace-mode .os-mobile-page-content :is(.field input,.field select,.field textarea){
   border-radius:10px;
 }
 #app.workspace-mode .os-mobile-page-content :is(.module-item,.fuel-row,.os-station-card){
   border-radius:14px;box-shadow:none;
 }
 #app.workspace-mode .os-mobile-page-content :is(.notice,.hint){
   border-radius:12px;
 }
 #app.workspace-mode .os-mobile-page-content :is(.button.primary,.button.secondary){
   border-radius:11px;
 }
 /* The homepage action is a real button, not a decorative logo. */
 #app.workspace-mode .os-mobile-power{
   display:grid;place-items:center;
   flex:none;width:46px;height:46px;
   padding:0;border:1px solid #ffffff77;
   border-radius:15px;background:#ffffff22;
   color:#fff;cursor:pointer;touch-action:manipulation;
 }
 #app.workspace-mode .os-mobile-power:hover{background:#ffffff38}
 #app.workspace-mode .os-mobile-power svg{width:24px;height:24px;stroke-width:2.1}
}
@media(max-width:620px){
 #app.workspace-mode .ws-layout:not([data-active-screen="overview"]) .ws-main{
   --os-mobile-gutter:12px;
 }
 #app.workspace-mode .os-mobile-page-hero{padding-inline:17px;padding-bottom:67px}
 #app.workspace-mode .os-mobile-page-top{margin-bottom:22px}
 #app.workspace-mode .os-mobile-page-content>.ws-widget:not(:empty){
   padding:17px;border-radius:20px;
 }
 #app.workspace-mode .os-mobile-page-heading{gap:12px}
 #app.workspace-mode .os-mobile-page-icon{width:49px;height:49px;border-radius:15px}
 #app.workspace-mode .os-mobile-page-icon svg{width:25px;height:25px}
}
@media(prefers-reduced-motion:reduce){
 #app.workspace-mode .os-mobile-page-hero,
 #app.workspace-mode .os-mobile-page-shortcuts button{transition:none}
}


/* OilStation confirmation dialog — same visual language as the mobile home.
   Native <dialog> supplies top-layer, focus containment and Android back/Escape
   semantics without rendering browser-domain confirm text. */
#app.workspace-mode .os-logout-dialog{
  box-sizing:border-box;
  width:min(400px,calc(100vw - 32px));
  max-width:calc(100vw - 32px);
  max-height:min(85dvh,540px);
  margin:auto;padding:0;
  border:1px solid rgba(228,238,239,.96);
  border-radius:24px;
  background:#fff;color:#203849;
  box-shadow:0 25px 75px rgba(7,36,47,.23);
  overflow:auto;
  font-family:"Noto Sans Thai","Segoe UI",Tahoma,system-ui,sans-serif;
  text-align:center;
}
#app.workspace-mode .os-logout-dialog::backdrop{
  background:rgba(7,27,35,.68);
  backdrop-filter:blur(3px);
}
#app.workspace-mode .os-logout-dialog-body{
  padding:30px 25px 24px;
  display:flex;flex-direction:column;align-items:center;
}
#app.workspace-mode .os-logout-icon{
  display:grid;place-items:center;
  width:66px;height:66px;
  border-radius:21px;
  background:linear-gradient(145deg,#e6f8f2,#d9f3ea);
  color:#087d6a;
  margin-bottom:17px;
}
#app.workspace-mode .os-logout-icon svg{
  width:32px;height:32px;stroke-width:2;
}
#app.workspace-mode .os-logout-eyebrow{
  color:#087f6d;font-size:10px;letter-spacing:.13em;
  font-weight:800;margin-bottom:7px;
}
#app.workspace-mode .os-logout-dialog h2{
  margin:0 0 9px;
  font-size:23px;font-weight:790;
  letter-spacing:-.025em;line-height:1.4;
  color:#1d3442;
}
#app.workspace-mode .os-logout-dialog p#os-logout-description{
  margin:0;color:#607682;
  font-size:14px;line-height:1.75;
  max-width:300px;
}
#app.workspace-mode .os-logout-feedback{
  align-self:stretch;border-radius:11px;
  padding:11px 13px;margin:14px 0 0;
  background:#e9f7f2;color:#116e5c;
  font-size:12px;line-height:1.65;
}
#app.workspace-mode .os-logout-feedback[data-tone="error"]{
  background:#fff1ee;color:#b03d37;
  border:1px solid #ebcbc6;
}
#app.workspace-mode .os-logout-actions{
  display:grid;grid-template-columns:1fr 1fr;
  width:100%;gap:11px;margin-top:25px;
}
#app.workspace-mode .os-logout-actions button{
  display:flex;align-items:center;justify-content:center;
  gap:8px;min-width:0;min-height:49px;
  padding:11px 13px;
  border-radius:12px;
  border:1px solid #d8e4e8;
  font:inherit;font-size:14px;
  font-weight:750;line-height:1.35;
  touch-action:manipulation;
  cursor:pointer;
}
#app.workspace-mode .os-logout-cancel{
  background:#f3f6f7;color:#405766;
}
#app.workspace-mode .os-logout-cancel:hover{
  background:#e9eff1;
}
#app.workspace-mode .os-logout-confirm{
  background:#099681;border-color:#087f71!important;
  color:#fff;
}
#app.workspace-mode .os-logout-confirm:hover:not(:disabled){
  background:#087966;
}
#app.workspace-mode .os-logout-confirm svg{
  width:18px;height:18px;flex:none;
}
#app.workspace-mode .os-logout-actions button:focus-visible{
  outline:3px solid #098f7a;
  outline-offset:3px;
}
#app.workspace-mode .os-logout-actions button:disabled{
  opacity:.64;cursor:progress;
}
@media(max-width:360px){
 #app.workspace-mode .os-logout-dialog-body{padding:24px 17px 18px}
 #app.workspace-mode .os-logout-actions{gap:8px}
}
@media(prefers-reduced-motion:reduce){
 #app.workspace-mode .os-logout-dialog *,
 #app.workspace-mode .os-logout-dialog{transition:none;animation:none}
}