.mobile-header,.mobile-nav,#mobile-home,#mobile-account{display:none}
@keyframes awal-mobile-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
#mobile-account:not([hidden]){display:block;max-width:800px;padding:30px;margin:auto}
.mobile-service:only-child{grid-column:1/-1}
.mobile-header svg,.mobile-nav svg{width:25px;height:25px;vertical-align:middle}.mobile-service-icon svg{width:28px;height:28px}.push-enable-label{display:flex;align-items:center;gap:10px;margin:20px 0}.push-enable-label input{width:22px;height:22px;min-height:22px}#push-settings-form label{margin-top:18px}#push-settings-form>.primary{margin-top:20px}
.notification-workspace{max-width:1100px;margin:0 auto;padding:30px}.notification-card{width:100%;display:flex;align-items:center;gap:16px;text-align:right;padding:22px;margin:12px 0;background:white;border:1px solid #e1e4ef;border-radius:16px;color:#27334c}.notification-card>span:nth-child(2){flex:1}.notification-card strong,.notification-card small,.notification-card span>span{display:block}.notification-card strong{font-size:16px}.notification-card span>span{margin:7px 0;font-size:14px}.notification-card small{color:#69728a;font-size:12px}.notification-card.unread{background:#edf7ff;border-color:#b8d3e9}.notification-dot{width:9px;height:9px;border-radius:50%;background:#aaa}.unread .notification-dot{background:#4385bb}
@media(max-width:800px){
 body.signed-in{padding-bottom:100px;background:#f4f7fa}body.signed-in>.topbar{display:none}.mobile-header:not([hidden]){display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fff;border-bottom:1px solid #e5ebf0;min-height:80px}.mobile-logo img{width:58px;height:50px;object-fit:contain}.mobile-header>div{flex:1}.mobile-header strong{font-size:16px;color:#124b7b}.mobile-header small{display:block;font-size:12px;color:#69728a;margin-top:5px}.mobile-bell{position:relative;min-width:48px;height:48px;padding:8px;border-radius:16px;border:1px solid #e3eaf0;background:#f6f9fc;color:#336b98;font-size:27px}.mobile-bell>span{position:absolute;top:-3px;right:-4px;border-radius:20px;min-width:21px;padding:2px 5px;background:#cc314a;color:white;font-size:11px;border:2px solid white}
 .mobile-nav:not([hidden]){display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;background:#fff;border-top:1px solid #e4ebf0;padding:9px 10px calc(9px + env(safe-area-inset-bottom));gap:6px;box-shadow:0 -8px 30px #124b7b09}.mobile-nav button{flex:1;min-width:0;border:0;border-radius:16px;background:transparent;color:#78829a;padding:8px 3px;min-height:62px;font:inherit}.mobile-nav button>span{display:block;font-size:27px;line-height:1}.mobile-nav small{display:block;font-size:11px;margin-top:7px}.mobile-nav button.active{background:#e7f3fc;color:#155c98}.mobile-nav button:focus-visible,.mobile-service:focus-visible{outline:3px solid #2b91c8;outline-offset:2px}
 #mobile-home:not([hidden]),#mobile-account:not([hidden]){display:block;padding:20px 16px;max-width:800px;margin:auto}.mobile-hero{position:relative;overflow:hidden;padding:26px 22px;border-radius:25px;background:linear-gradient(125deg,#103f6b,#1768a7 60%,#247bb4);color:#fff;box-shadow:0 12px 30px #124b7b1c}.mobile-hero:after{content:'';position:absolute;left:-45px;top:-60px;width:200px;height:200px;border:25px solid #ffffff0b;border-radius:50%;pointer-events:none}.mobile-hero-label{color:#b9ddfa;font-size:12px}.mobile-hero h1{font-size:25px;line-height:1.7;margin:9px 0}.mobile-hero p{color:#e0eefa;font-size:13px}.mobile-hero-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px;position:relative;z-index:1}.mobile-hero-actions button{font-size:12px;padding:11px 14px;min-height:46px}.mobile-hero-actions .primary{background:white;color:#275377;border:0}.mobile-hero-actions .secondary{background:#ffffff16;color:white;border:1px solid #ffffff40}
 .mobile-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:16px 0 28px}.mobile-overview:empty{display:none}.mobile-overview button{padding:16px 7px;border:1px solid #e3e6f1;background:#fff;border-radius:17px;color:#124b7b;text-align:center}.mobile-overview strong{display:block;font-size:25px}.mobile-overview small{display:block;font-size:10px;line-height:1.8;color:#68748d;margin-top:7px}.mobile-section-heading{display:flex;justify-content:space-between;align-items:center;margin:24px 0 14px}.mobile-section-heading h2{font-size:18px;margin:0}.mobile-section-heading .muted{font-size:11px}
 .mobile-services{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.mobile-service{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:right;padding:20px 16px;min-height:157px;background:#fff;border:1px solid #e1e5f0;border-radius:22px;color:#29334d;box-shadow:0 4px 14px #124b7b04}.mobile-service-icon{display:flex;align-items:center;justify-content:center;width:49px;height:49px;background:#ebf5fd;color:#1768a7;font-size:31px;border-radius:15px;margin-bottom:13px}.mobile-service:nth-child(3n+2) .mobile-service-icon{background:#e4f2fc;color:#247ba7}.mobile-service:nth-child(3n) .mobile-service-icon{background:#e9f4ef;color:#2b7c61}.mobile-service strong{font-size:16px}.mobile-service small{font-size:10px;color:#78819a;margin-top:7px;line-height:1.8}.mobile-service-arrow{position:absolute;left:16px;top:25px;color:#a4abc0;font-size:21px}.mobile-service:active{transform:scale(.98);background:#f5fbff}.mobile-avatar{font-size:48px;color:#1768a7}.mobile-logout{margin-top:25px;width:100%;min-height:48px}#mobile-account>.info-block{margin-bottom:16px}#mobile-account-actions button{width:100%;margin:8px 0}.notification-workspace{padding:22px 16px}.notification-card{padding:17px 13px;gap:11px}.notification-card strong{font-size:14px}.notification-card span>span{font-size:12px}.notification-workspace .page-heading h1{font-size:26px}.notification-workspace .heading-actions button{min-height:44px}
 .welcome{padding:20px 16px}.welcome .intro{display:none}.login-card{width:100%;max-width:460px;margin:15px auto}.signed-in .page-heading h1{font-size:25px}body.signed-in main{min-height:65vh}input,select,textarea{font-size:16px}button,input,select{min-height:44px}
}
/* Shared touch experience across the phone workspaces. */
@media(max-width:800px){
 body.signed-in{background:radial-gradient(ellipse at top right,#e9f4ff,transparent 52%),#f5f8fb;padding-bottom:112px}
 .mobile-header:not([hidden]){position:sticky;top:0;z-index:25;background:#ffffffed;backdrop-filter:blur(16px);border:0;box-shadow:0 3px 20px #124b7b08}
 .mobile-header strong{font-size:17px}.mobile-logo img{border-radius:14px;background:white;padding:4px}
 .mobile-nav:not([hidden]){left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));padding:7px;gap:4px;border:1px solid #e4ebf1;border-radius:25px;background:#ffffffed;backdrop-filter:blur(18px);box-shadow:0 9px 35px #124b7b24}
 .mobile-nav button{border-radius:18px;transition:background .2s,color .2s,transform .18s}
 .mobile-nav button.active{background:linear-gradient(125deg,#124b7b,#176eb5);color:white;box-shadow:0 4px 12px #176eb52b}
 .mobile-nav button.active svg{transform:translateY(-2px)}.mobile-nav svg{transition:transform .2s}
 .mobile-hero{background:linear-gradient(125deg,#124b7b 10%,#344e9a 65%,#199bcd);box-shadow:0 14px 30px #124b7b25;border:1px solid #ffffff50}
 .mobile-hero:after{border-color:#ffffff12;width:230px;height:230px;left:-80px;top:-90px}
 .mobile-hero h1{font-size:27px}.mobile-hero-label{display:inline-block;background:#ffffff16;border:1px solid #ffffff28;padding:5px 12px;border-radius:20px;color:#ecf7ff}
 .mobile-overview{gap:10px;margin-top:20px}.mobile-overview button{border:0;box-shadow:0 5px 20px #124b7b08;border-top:3px solid #3d75c4;border-radius:18px}
 .mobile-overview button:nth-child(2){border-top-color:#b78b29}.mobile-overview button:nth-child(3){border-top-color:#32967a}
 .mobile-overview button:nth-child(2) strong{color:#966e16}.mobile-overview button:nth-child(3) strong{color:#238369}
 .mobile-service{border:1px solid #e4e9f4;background:linear-gradient(145deg,#fff,#f7fbff);box-shadow:0 6px 20px #124b7b08;min-height:165px;transition:transform .18s,box-shadow .18s,border-color .18s}
 .mobile-service:nth-child(3n+2){background:linear-gradient(145deg,#fff,#f0f8ff)}.mobile-service:nth-child(3n){background:linear-gradient(145deg,#fff,#f0faf7)}
 .mobile-service-icon{box-shadow:0 5px 12px #124b7b09;transition:transform .2s}.mobile-service:active .mobile-service-icon{transform:rotate(-7deg) scale(1.08)}
 .mobile-service-arrow{background:white;border-radius:50%;width:27px;height:27px;text-align:center;line-height:27px;font-size:17px}
 .mobile-service:active{border-color:#9bbce3;box-shadow:0 2px 8px #124b7b13}
 body.signed-in :is(button,.workspace-table-row){-webkit-tap-highlight-color:transparent;touch-action:manipulation}
 body.signed-in button{transition:transform .16s,box-shadow .18s,background-color .18s}
 body.signed-in button:active:not(:disabled){transform:scale(.97)}body.signed-in button:disabled{opacity:.58}
 body.signed-in :is(input,select,textarea){border-radius:12px;transition:border-color .18s,box-shadow .18s}
 body.signed-in :is(input,select,textarea):focus-visible{outline:0;border-color:#287fc0;box-shadow:0 0 0 3px #287fc01f}
 body.signed-in :is(.detail,.info-block,.workspace-list-panel,#mobile-account>section){border-radius:20px;border-color:#e3e8f3;box-shadow:0 5px 18px #124b7b06}
 body.signed-in .workspace-table tbody tr.selected{background:#eaf2ff;box-shadow:inset -3px 0 #176eb5}
 body.signed-in :is(.primary,.secondary){border-radius:14px;min-height:46px}.mobile-hero-actions .primary{box-shadow:0 4px 12px #15235320}
 .notification-card{box-shadow:0 4px 14px #124b7b06;border-radius:20px}.notification-card.unread{background:linear-gradient(115deg,#edf7ff,#edf6ff);border-color:#d4e3ef}
 :is(#mobile-home,#mobile-account,#workspace,#project-workspace,#inventory-workspace,#notification-workspace):not([hidden]),body.signed-in .detail{animation:awal-mobile-enter .28s ease-out both}
 dialog[open]{animation:awal-mobile-enter .22s ease-out both}dialog::backdrop{backdrop-filter:blur(4px)}
}
@media(prefers-reduced-motion:reduce){
 body :is(#mobile-home,#mobile-account,#workspace,#project-workspace,#inventory-workspace,#notification-workspace,.detail,dialog[open]){animation:none!important}
 body.signed-in :is(button,input,select,textarea,.mobile-service-icon,.mobile-nav svg){transition:none!important;scroll-behavior:auto!important}
 body.signed-in button:active:not(:disabled),.mobile-service:active .mobile-service-icon,.mobile-nav button.active svg{transform:none!important}
}