@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#19332e;background:#f4f5f0;font-synthesis:none;--ink:#173b32;--muted:#7b8880;--green:#2e8067;--line:#e0e5dc;--cream:#f7f8f3;--orange:#d47949}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button{border:0;background:none;color:inherit}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3,.brand{font-family:Manrope,system-ui,sans-serif}h1{font-size:34px;letter-spacing:-1.3px;line-height:1.25;font-weight:650}h2{font-size:19px;letter-spacing:-.5px}h3{font-size:15px}.muted{color:var(--muted)}.small{font-size:12px}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:10px;font-weight:700}.icon{width:20px;height:20px;display:inline-block;vertical-align:middle;flex-shrink:0}.shell{min-height:100vh;display:grid;grid-template-columns:238px 1fr}.sidebar{background:#112e27;color:#b7c7bd;padding:32px 20px;position:fixed;width:238px;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:15}.brand{display:flex;gap:10px;align-items:center;font-weight:800;font-size:27px;color:#fff;letter-spacing:-1px}.brand-mark{display:flex;align-items:center;gap:3px;width:29px;height:30px}.brand-mark i{width:4px;border-radius:5px;background:#b8dac3;height:14px}.brand-mark i:nth-child(2){height:26px}.brand-mark i:nth-child(3){height:20px}.brand-mark i:nth-child(4){height:10px}.brand-sub{margin:7px 0 35px 40px;color:#839e8d;font-size:9px;letter-spacing:3px}.property{border:1px solid #385047;padding:14px 12px;border-radius:10px;display:flex;gap:10px;align-items:center;margin-bottom:35px}.property>div:last-child{min-width:0}.property strong{color:#e5ece4;font-size:12px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.property small{font-size:10px;color:#86a28f}.side-label{font-size:9px;letter-spacing:1.8px;margin:0 14px 12px;color:#668674}nav{display:grid;gap:5px}nav button{display:flex;align-items:center;gap:13px;padding:13px 14px;border-radius:8px;text-align:left;font-size:12px}nav button:hover{background:#244236}nav button.active{background:#c8e0bf;color:#16362b;font-weight:700}nav .count{margin-left:auto;background:#345545;border-radius:5px;padding:2px 5px;font-size:10px}.side-bottom{margin-top:auto;padding-top:40px}.help{border:1px solid #385047;border-radius:10px;padding:14px;font-size:12px;line-height:1.7}.profile{display:flex;gap:10px;align-items:center;padding:23px 5px 0}.profile .avatar{width:32px;height:32px;background:#c6bc9a;color:#344233;font-size:12px}.profile div:nth-child(2){flex:1;font-size:12px}.profile small{display:block;color:#869f8d;font-size:10px;margin-top:3px}.main{grid-column:2;min-width:0}.topbar{height:78px;border-bottom:1px solid var(--line);padding:0 38px;display:flex;align-items:center;justify-content:space-between;background:#fafbf7;font-size:11px}.crumb{display:flex;gap:12px;color:#9aa69c}.crumb strong{color:#425d4d;font-weight:500}.top-right{display:flex;gap:16px;align-items:center}.mode-pill{border:1px solid #e3d9b4;color:#8a7745;border-radius:6px;padding:6px 10px;font-size:10px;background:#fbf8e9}.signal-dot{width:6px;height:6px;border-radius:50%;background:#6ba17b;display:inline-block;margin-right:6px}.ticker{background:#e8eddf;color:#53654b;display:flex;align-items:center;gap:14px;min-height:36px;padding:6px 38px;font-size:11px;overflow:hidden}.ticker-label{font-size:9px;font-weight:700;letter-spacing:1px;white-space:nowrap;border-right:1px solid #cbd6be;padding-right:14px}.ticker-copy{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.ticker button{font-size:11px;text-decoration:underline}.content{max-width:1550px;margin:auto;padding:34px 38px 45px}.heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:26px}.heading .eyebrow{color:#85967f;margin-bottom:11px}.heading p{font-size:12px;color:#7c887c;margin-top:10px}.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.btn{border:1px solid #dbe1d5;padding:11px 15px;border-radius:7px;background:#fff;display:inline-flex;gap:8px;align-items:center;justify-content:center;font-size:11px;font-weight:600;white-space:nowrap}.btn .icon{width:15px;height:15px}.btn.primary{background:#1e5745;color:#fff;border-color:#1e5745}.btn.primary:hover{background:#123b2e}.btn.soft{background:#e7eddc;border-color:transparent;color:#526b42}.btn.danger{color:#a34c3e;border-color:#edc9c2}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:19px 20px;position:relative}.stat-label{font-size:11px;color:#7f8b80;display:flex;align-items:center;justify-content:space-between}.stat-label .icon{color:#839480;width:17px}.stat-value{font-family:Manrope;font-size:31px;letter-spacing:-1.5px;margin-top:9px;font-weight:600}.stat-value span{font-size:13px;color:#a0ab9c;font-weight:400;letter-spacing:0;margin-left:4px}.stat-note{font-size:10px;color:#8c9889;margin-top:7px}.stat-note.green{color:#58936e}.stat-note.orange{color:#c68049}.dashboard-columns{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:22px;align-items:start}.section-head{display:flex;align-items:center;justify-content:space-between;margin:3px 0 17px;gap:15px}.section-head p{font-size:11px;color:#8a9786;margin-top:5px}.section-head button{font-size:11px;color:#688559;display:flex;gap:5px;align-items:center}.group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.group-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:19px;text-align:left;min-width:0;transition:transform .18s,border-color .18s;position:relative}.group-card:hover{border-color:#85ab8b;transform:translateY(-2px)}.group-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.group-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 12%,white);color:var(--accent)}.live-pill{display:flex;align-items:center;gap:5px;background:#eff7ec;color:#739264;padding:4px 7px;border-radius:4px;font-size:9px}.live-pill b{width:4px;height:4px;border-radius:100%;background:currentColor}.group-card h3{font-size:14px;font-weight:700}.group-card p{font-size:10px;color:#8f9b89;margin-top:5px}.group-footer{border-top:1px solid #eef0e9;padding-top:15px;margin-top:17px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#7e9178}.avatars{display:flex;padding-left:0}.avatar{border-radius:50%;width:25px;height:25px;display:inline-flex;align-items:center;justify-content:center;background:#eceade;font-size:9px;color:#6d7359;flex-shrink:0;font-weight:600}.avatars .avatar{border:2px solid white;margin-left:-5px}.avatars .avatar:first-child{margin-left:0}.avatar.c1{background:#e0eadd;color:#5c7a53}.avatar.c2{background:#f5e5d5;color:#9b7044}.avatar.c3{background:#e4e2ef;color:#7f769f}.avatar.c4{background:#e0e9ed;color:#627f8c}.surface{background:#fff;border:1px solid var(--line);border-radius:11px;overflow:hidden}.surface.pad{padding:21px}.connect-card{background:#163e32;color:#e1eddf;border-radius:11px;padding:23px;position:relative;overflow:hidden;min-height:209px}.connect-card:before,.connect-card:after{content:'';position:absolute;border:1px solid #42624b;border-radius:50%;width:260px;height:260px;right:-130px;top:-15px;pointer-events:none}.connect-card:after{width:190px;height:190px;right:-95px;top:20px}.connect-card>*{position:relative;z-index:1}.connect-card .eyebrow{font-size:9px;color:#9fbb96}.connect-card h2{font-size:24px;line-height:1.3;width:180px;margin-top:13px}.connect-card p{font-size:11px;color:#9aba9e;max-width:205px;line-height:1.7;margin-top:12px}.connect-card button{font-size:10px;margin-top:20px;color:#d3e7bf;display:flex;align-items:center;gap:8px}.alerts{padding:20px;margin-top:17px}.alert-item{display:flex;gap:11px;margin-top:21px;align-items:flex-start}.alert-icon{background:#fcf2df;border-radius:7px;padding:7px;color:#c38e4b;display:flex}.alert-icon .icon{width:15px;height:15px}.alert-item strong{font-size:11px;font-weight:600}.alert-item p{font-size:10px;line-height:1.6;color:#8a9384;margin-top:5px}.activity-item{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px solid #edf0e8}.activity-item:last-child{border-bottom:0}.activity-item .dot{width:6px;height:6px;background:#a7be96;border-radius:50%;margin-top:5px}.activity-item p{font-size:11px}.activity-item small{display:block;font-size:9px;color:#8e9d85;margin-top:6px}.table-section{margin-top:27px}.table-toolbar{padding:17px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:14px}.table-toolbar input{max-width:200px;border:1px solid var(--line);border-radius:6px;background:#fafbf7;padding:9px 10px;font-size:11px}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap;font-size:11px}th{padding:13px 18px;color:#8a9585;font-size:9px;text-transform:uppercase;letter-spacing:.7px;font-weight:500;background:#fcfdf9}td{padding:14px 18px;border-top:1px solid #edf0e8}td .name{display:flex;align-items:center;gap:10px}.name strong{font-size:11px;font-weight:600}.name small{display:block;font-size:9px;color:#95a08b;margin-top:3px}.tag{font-size:9px;border-radius:4px;display:inline-flex;align-items:center;gap:4px;padding:4px 6px;background:#f0f3e9;color:#7b8c63}.tag.green{background:#edf5ea;color:#61875a}.tag.orange{background:#faf0e1;color:#b98b52}.tag.gray{background:#f0f1ee;color:#92998c}.tag.purple{background:#eeebf7;color:#8982aa}.battery{display:flex;align-items:center;gap:6px;color:#7e9870;font-size:10px}.battery.low{color:#c58d4a}.battery-box{width:21px;height:10px;border:1px solid currentColor;border-radius:2px;padding:1px;position:relative}.battery-box:after{content:'';position:absolute;right:-3px;top:2px;width:2px;height:4px;background:currentColor;border-radius:1px}.battery-fill{height:100%;background:currentColor;border-radius:1px}.table-foot{border-top:1px solid var(--line);padding:13px 19px;color:#95a08b;font-size:10px;display:flex;justify-content:space-between}.schedule-strip{margin-top:22px;background:#edeedb;border:1px solid #dedfc8;border-radius:9px;padding:17px 19px;display:flex;gap:13px;align-items:center}.schedule-strip>.icon{color:#989c68}.schedule-strip strong{font-size:11px}.schedule-strip p{font-size:10px;color:#969d7d;margin-top:5px}.schedule-strip button{margin-left:auto;font-size:10px;text-decoration:underline;white-space:nowrap}.footer{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.3px;color:#99a28d;margin-top:32px}.footer .icon{width:11px;height:11px;margin-right:4px}.page-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.empty{text-align:center;padding:38px 20px;color:#879881;font-size:12px;line-height:1.8}.empty .icon{width:28px;height:28px;margin-bottom:10px}.form-grid{display:grid;gap:17px}.form-grid label{display:grid;gap:7px;font-size:12px;color:#4a6253}.form-grid input,.form-grid select,.form-grid textarea{border:1px solid #dce3d5;border-radius:7px;padding:11px 12px;color:#294838;background:#fcfdf9;min-width:0;width:100%}.form-grid textarea{min-height:95px;resize:vertical}.form-grid .pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .hint{font-size:10px;color:#8d9786;line-height:1.6}.form-grid .check{display:flex;align-items:center;gap:8px}.form-grid .check input{width:auto;accent-color:#37694f}.checks{display:grid;gap:9px;max-height:200px;overflow:auto}.color-options{display:flex;gap:10px}.color-options label{display:flex;align-items:center}.notice{padding:13px 16px;background:#f4f2df;color:#91854c;border:1px solid #e9e2bc;border-radius:8px;font-size:11px;line-height:1.7;margin:14px 0}.notice.good{background:#eaf2e5;color:#628159;border-color:#d9e5cf}.price{font-family:Manrope;font-size:52px;letter-spacing:-2px;font-weight:600;margin:20px 0}.price small{font:12px 'DM Sans',sans-serif;letter-spacing:0;color:#8b9980}.bill-line{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}.bill-line.total{font-weight:700;font-size:15px;border:0}.big-slider{accent-color:#427858;width:100%;margin:25px 0}.timeline{display:grid;gap:12px}.shift{display:grid;grid-template-columns:80px 1fr auto;gap:15px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:9px;background:white}.shift-time{font-size:11px;font-weight:700}.shift h3{font-size:12px}.shift p{font-size:10px;color:#8a9880;margin-top:6px}.announcement{padding:19px;border-bottom:1px solid var(--line)}.announcement:last-child{border:0}.announcement h3{margin:8px 0}.announcement p{font-size:12px;color:#7d8f73;line-height:1.7}.announcement footer{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:10px;color:#92a286}.announcement audio{width:100%;height:35px;margin:12px 0}.connection{display:flex;justify-content:space-between;align-items:center;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px}.connection span{display:flex;gap:9px;align-items:center}.meter{height:7px;background:#edf1e6;border-radius:10px;overflow:hidden;margin-top:7px}.meter i{height:100%;display:block;background:#9bb58c}.pill-radio{display:flex;gap:8px;flex-wrap:wrap}.pill-radio button{border:1px solid var(--line);padding:7px 11px;border-radius:6px;font-size:11px}.pill-radio button.active{background:#e6eedb;border-color:#b3c39e}.mobile-toggle{display:none}dialog{border:1px solid #d8e0cf;border-radius:15px;box-shadow:0 24px 110px #10261d50;max-width:540px;width:calc(100% - 30px);max-height:90vh;padding:27px;color:var(--ink);background:#fff}dialog::backdrop{background:#13251d75;backdrop-filter:blur(3px)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.modal-head button{font-size:22px;color:#92a18a}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.error{color:#b45640;background:#fbeee9;padding:10px;border-radius:6px;font-size:12px}.hidden{display:none!important}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:14px 20px;background:#173f30;color:#fff;border-radius:9px;box-shadow:0 8px 30px #0003;font-size:12px;z-index:200;max-width:90vw;display:none}#toast.show{display:block}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.15fr 1fr}.login-art{background:#133b2e;color:#edf3e9;padding:55px;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-art:after{content:'';position:absolute;width:850px;height:850px;border:1px solid #61846266;border-radius:50%;left:-190px;bottom:-580px;box-shadow:0 0 0 75px #51734818,0 0 0 150px #51734818}.login-art h1{font-size:59px;max-width:520px;margin-top:auto;letter-spacing:-2.5px;position:relative;z-index:1}.login-art h1 span{color:#bad0a6}.login-art p{font-size:14px;color:#91b095;line-height:1.8;max-width:380px;margin-top:24px;margin-bottom:auto;padding-bottom:70px}.login-art .eyebrow{margin-top:60px;color:#809e7d;font-size:9px}.login-form{align-self:center;max-width:400px;margin:40px auto;padding:30px;width:100%}.login-form h2{font-size:27px}.login-form>p{font-size:12px;color:#87977e;line-height:1.7;margin:12px 0 30px}.login-form .brand{color:#28573e;margin-bottom:32px}.login-form .btn{width:100%;margin-top:8px}.divider{text-align:center;font-size:10px;color:#99a68d;margin:20px 0;display:flex;align-items:center;gap:10px}.divider:before,.divider:after{content:'';height:1px;flex:1;background:var(--line)}.demo-banner{font-size:10px;color:#8a987e;line-height:1.6;margin-top:12px}.week{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin-bottom:22px}.day{border:1px solid var(--line);border-radius:8px;padding:12px 6px;text-align:center;font-size:10px;background:#fff}.day b{display:block;font-family:Manrope;font-size:21px;margin-top:6px}.day.active{background:#1e5745;color:#fff;border-color:#1e5745}.kbd{font-size:10px;padding:4px;border:1px solid var(--line);border-radius:4px;color:#819377}.search-wrap{display:flex;align-items:center;gap:10px}.search-wrap .icon{width:15px;color:#9aa68d}button:focus-visible,a:focus-visible{outline:2px solid #75a982}.refresh-age{font-size:10px;color:#8c9985}
@media(min-width:1550px){.content{padding-top:44px}.group-card{padding:24px}.dashboard-columns{grid-template-columns:minmax(0,1fr) 345px}.group-card h3{font-size:16px}.group-card p{font-size:12px}.group-grid{gap:18px}}
@media(max-width:1180px){.shell{grid-template-columns:205px 1fr}.sidebar{width:205px;padding:28px 14px}.content{padding:27px 24px}.topbar{padding:0 24px}.ticker{padding-left:24px;padding-right:24px}.dashboard-columns{grid-template-columns:1fr}.right-rail{display:grid;grid-template-columns:1fr 1fr;gap:16px}.right-rail>.surface:last-child{grid-column:1 / -1}.alerts{margin:0}.heading h1{font-size:29px}.top-right>span:first-child{display:none}.stat{padding:16px}.page-grid{grid-template-columns:1fr}}
@media(max-width:760px){.shell{display:block}.sidebar{transform:translateX(-100%);transition:transform .2s;width:238px;box-shadow:10px 0 50px #102c2730}.sidebar.open{transform:translateX(0)}.main{width:100%}.mobile-toggle{display:block}.topbar{height:62px;padding:0 16px}.top-right{gap:8px}.crumb{gap:7px;font-size:10px}.ticker{padding:8px 16px}.ticker-label{font-size:8px}.content{padding:25px 16px}.heading{display:block;margin-bottom:22px}.heading .actions{margin-top:18px}.heading h1{font-size:28px}.stats{grid-template-columns:1fr 1fr;gap:10px}.stat-value{font-size:28px}.stat-label{font-size:10px}.group-grid{gap:10px}.group-card{padding:15px}.group-card h3{font-size:13px}.group-footer{font-size:9px}.right-rail{display:block}.right-rail>*{margin-bottom:16px}.schedule-strip{flex-wrap:wrap}.schedule-strip button{margin-left:32px}.footer{gap:20px;font-size:8px}.login-shell{display:block}.login-art{padding:30px;min-height:300px}.login-art h1{font-size:38px;margin:35px 0 0}.login-art p{padding:0;font-size:12px}.login-art .eyebrow{display:none}.login-form{margin:15px auto}.form-grid .pair{grid-template-columns:1fr}.table-toolbar{flex-wrap:wrap}.shift{grid-template-columns:65px 1fr}.shift .actions{grid-column:2}.mode-pill{font-size:9px}.refresh-age{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Warm mineral surfaces complement the original forest-green navigation. */
:root{background:#f5f1eb;--line:#e7dfd3;--cream:#faf7f2;--orange:#b57851}body{background:#f5f1eb}.topbar{background:#fcfaf6}.ticker{background:#eadfcf;color:#73573c}.ticker-label{border-color:#d6bca0}.stat,.surface,.group-card{background:#fffdf9}.stat-label,.muted{color:#887f70}.group-footer{border-color:#eee5d8}.schedule-strip{background:#eee0d0;border-color:#dfc6ad}.schedule-strip strong{color:#806046}.schedule-strip p{color:#95785d}th{background:#faf6ef}td{border-color:#f0e9de}nav button.active{background:#dcbf9d;color:#223d30}.group-hours{display:flex;align-items:center;gap:5px;font-size:9px;color:#9c8165;margin-top:12px}.group-hours .icon{width:12px;height:12px}.radio-screen{background:#173e32;color:#e8efdf;border-radius:11px;padding:22px}.radio-screen-head{display:flex;justify-content:space-between;align-items:center;color:#d5bb96}.radio-screen h2{font-size:23px;margin-top:15px;line-height:1.3}.radio-screen select{background:#244b3c;color:#e5ddcd;border:1px solid #56735b;border-radius:6px;padding:10px 8px;width:100%;font-size:11px;margin-top:17px}.radio-feed{margin-top:15px;max-height:285px;overflow:auto}.radio-feed article{border-left:2px solid #c7a67e;padding:10px 12px;background:#ffffff07;margin-bottom:10px}.radio-feed article>span{display:flex;gap:6px;align-items:center;font-size:9px;color:#bda584}.radio-feed .icon{width:12px;height:12px}.radio-feed strong{display:block;font-size:12px;margin-top:8px}.radio-feed p{font-size:11px;color:#adbfab;line-height:1.65;margin-top:6px}.radio-feed small{display:block;font-size:9px;color:#c9b794;margin-top:9px}.radio-footnote{font-size:9px;color:#9aaf98;line-height:1.7;margin-top:15px}.icon-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;max-height:230px;overflow:auto}.icon-picker label{position:relative;cursor:pointer}.icon-picker input{position:absolute;opacity:0;width:1px;height:1px}.icon-picker span{display:flex;flex-direction:column;align-items:center;gap:7px;border:1px solid var(--line);border-radius:8px;padding:10px 4px;color:#8e785e}.icon-picker small{font-size:8px}.icon-picker input:checked+span{background:#efe0ce;border-color:#b58a61;color:#63462d}.icon-picker input:focus-visible+span{outline:2px solid #456d50}.schedule-fields{border:1px solid #e7d7c1;border-radius:9px;padding:15px;background:#fcf7ef;margin:5px 0}.schedule-fields legend{font-size:12px;color:#9b7651;padding:0 6px}.schedule-fields .pair{margin:14px 0}.days-picker{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0}.schedule-fields .hint{margin-top:10px;line-height:1.6}.language-picker select{background:transparent;border:1px solid #ddd3c4;border-radius:6px;padding:7px 8px;color:#5e6858;font-size:10px;max-width:175px}.language-setting{margin-top:20px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.announcement-status{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:15px 0}.announcement-status small{font-size:10px;color:#9c8568}.delivery-steps{display:flex;flex-wrap:wrap;gap:10px;color:#81684e;font-size:10px;padding:12px 0;border-top:1px dashed #deceba}.sync-list{font-size:12px;color:#897762;line-height:1.8;padding-left:20px;margin:18px 0}.sync-list li{margin-bottom:10px}.hint{font-size:10px;color:#97846e;line-height:1.7}.radio-screen .empty{color:#9cae94}.top-right{gap:10px}.footer{color:#988c79}@media(max-width:760px){.top-right .mode-pill{display:none}.language-picker select{max-width:138px;font-size:9px}.icon-picker{grid-template-columns:repeat(4,1fr)}}
/* Updated direction: midnight blue, warm white and copper. */
:root{--ink:#27364c;--green:#385a82;color:#26354a;--muted:#858799}.sidebar{background:#14263d;color:#b6c2d1}.brand-mark i{background:#d6b48d}.brand-sub{color:#8395ae}.property{border-color:#34475f}.property strong{color:#e4e9f0}.property small,.side-label{color:#8195af}nav button:hover{background:#263c57}nav button.active{background:#dbb996;color:#203047}nav .count{background:#3d526b}.help{border-color:#34475f}.profile small{color:#8195af}.topbar{background:#fcfaf7}.crumb strong{color:#4e6076}.btn.primary{background:#28496e;border-color:#28496e}.btn.primary:hover{background:#1d3757}.btn.soft{background:#e3eaf1;color:#526f91}.connect-card,.radio-screen{background:#172e4b;color:#e9edf5}.connect-card:before,.connect-card:after{border-color:#446080}.connect-card .eyebrow,.radio-screen-head{color:#d6b58f}.connect-card p{color:#a6b6cb}.connect-card button{color:#dcc3a5}.radio-screen select{background:#243f5f;border-color:#49627e;color:#e1e8f0}.radio-feed p{color:#afc0d3}.radio-feed article{background:#ffffff06;border-color:#c69a6c}.radio-feed small{color:#ccb18f}.radio-footnote,.radio-screen .empty{color:#94a8c1}.group-icon{color:var(--accent)}.tag.green,.live-pill{background:#e8eef5;color:#6382a6}.stat-note.green{color:#5a7ba4}.signal-dot{background:#7596bb}.battery{color:#6686aa}.meter i{background:#8ba4c0}.notice.good{background:#eaf0f6;color:#5d7795;border-color:#d2ddea}.day.active{background:#2c4b71;border-color:#2c4b71}.pill-radio button.active{background:#e3eaf3;border-color:#acbfd6}.form-grid input,.form-grid select,.form-grid textarea{color:#344b66}.form-grid .check input{accent-color:#40658f}.big-slider{accent-color:#55769a}.login-art{background:#162c47}.login-art h1 span{color:#d4b08a}.login-art p{color:#9fb3cc}.login-art:after{border-color:#627e9e66;box-shadow:0 0 0 75px #51739718,0 0 0 150px #51739718}.login-art .eyebrow{color:#92a7c3}.login-form .brand{color:#284768}.profile .avatar{color:#31445d}.help p{color:#9bacbf!important}.language-picker select{color:#55657a}#toast{background:#223f62}button:focus-visible,a:focus-visible{outline-color:#83a4cd}.icon-picker input:focus-visible+span{outline-color:#7897be}
/* Elevation without moving the clickable area. Mouse hover never gates a tap. */
button,[role="button"],.group-check,.icon-picker label{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button .icon,button .icon *{pointer-events:none}
.btn,nav button,.group-card,.stat,.surface,.radio-screen,.shift,.group-check,.icon-picker span{transition:box-shadow 170ms ease,border-color 170ms ease,background-color 170ms ease}
.group-card:hover{transform:none;border-color:var(--line)}
button:focus-visible,.group-check:has(input:focus-visible){outline:3px solid #96afcf;outline-offset:3px}
@media(hover:hover) and (pointer:fine){
 .group-card:hover{border-color:#b99372;box-shadow:0 12px 26px -14px #14263d80,0 0 0 1px #ddc4aa}
 .btn:not(:disabled):hover{box-shadow:0 9px 18px -10px #14263d99,0 0 0 1px #d6b48d;border-color:#b99372}
 nav button:hover{box-shadow:0 7px 18px -10px #0009,inset 3px 0 #d6b48d}
 .stat:hover,.surface:hover,.shift:hover{box-shadow:0 10px 24px -17px #243c5f80;border-color:#cfb79d}
 .radio-screen:hover{box-shadow:0 13px 26px -13px #14263d99}
 .icon-picker label:hover span,.group-check:hover{box-shadow:0 7px 15px -10px #243c5f99;border-color:#b99372;background:#fff8ee}
 .section-head button:hover,.table-foot button:hover,.audience-toolbar button:hover,.ticker button:hover{color:#a16e46;text-decoration:underline;text-underline-offset:4px}
}
.btn:not(:disabled):active,.group-card:active{box-shadow:inset 0 2px 5px #14263d20}
.audience-fields{min-width:0;border:1px solid var(--line);border-radius:10px;padding:15px;background:#fcfaf6}
.audience-fields legend{padding:0 7px;font-size:12px;font-weight:650;color:#506985}
.audience-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 10px;font-size:11px;color:#537298}
.audience-toolbar button{padding:5px 0;text-decoration:underline;text-underline-offset:3px}
#group-selection-count{margin-left:auto;font-size:10px;color:#8b7761}
.group-checks{display:grid;gap:8px;max-height:270px;overflow:auto;padding:2px}
.form-grid .group-check{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #e3ded6;border-radius:8px;background:#fff;cursor:pointer}
.form-grid .group-check input{flex:0 0 auto;width:18px;height:18px;padding:0;accent-color:#345a85}
.group-check:has(input:checked){background:#eaf0f7;border-color:#7c9bbc;box-shadow:inset 3px 0 #3b608d}
.group-check .group-icon{width:32px;height:32px;flex:0 0 auto}
.group-check strong{display:block;font-size:12px;color:#314d6e}
.group-check small{display:block;font-size:10px;color:#918579;margin-top:4px}
.speaker-policy{display:flex;gap:12px;padding:13px 14px;background:#eaf0f7;border:1px solid #c9d7e7;border-radius:9px;margin-top:12px;color:#3d5d83}
.speaker-policy strong{font-size:12px}.speaker-policy p{font-size:11px;line-height:1.65;margin-top:5px}.speaker-policy>.icon{margin-top:2px}
.speaker-tag{font-size:10px;color:#567397;margin-top:12px}
.icon-picker{grid-template-columns:repeat(4,minmax(0,1fr));max-height:320px;overscroll-behavior:contain}
.icon-picker span{min-height:73px;text-align:center}.icon-picker small{font-size:9px;line-height:1.3;overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Business login: Internet and nearby direct radio connections. */
.login-art{padding:44px clamp(24px,4vw,64px);isolation:isolate;background:radial-gradient(ellipse at 35% 35%,#234464 0%,#14283f 60%,#112033 100%)}
.login-art:after{z-index:-1;opacity:.4}.login-art .brand{margin-bottom:56px}.login-art h1{font-size:clamp(36px,4.3vw,64px);line-height:1.08;max-width:540px;margin:0;letter-spacing:-2px}
.login-art>p{position:relative;z-index:1;max-width:500px;padding:0;margin:26px 0 0;font-size:14px;line-height:1.8;color:#b7c9dd}.login-art>.eyebrow{margin-top:auto;padding-top:40px;letter-spacing:1.6px;line-height:1.7}
@media(max-width:1000px) and (min-width:761px){.login-shell{grid-template-columns:1.2fr 1fr}.login-art{padding:35px 24px}.login-form{padding:24px}}
@media(max-width:760px){.login-art{padding:30px 24px 32px}.login-art h1{font-size:42px;max-width:360px}.login-art>p{font-size:12px;margin-top:20px}.login-form{max-width:460px;padding:25px;margin:0 auto}.login-art>.eyebrow{display:none}}
/* Login worksite illustration: phones and network paths, with no people. */
.login-art .brand{margin-bottom:38px}
.worksite-network{position:relative;z-index:1;margin:30px 0 0;max-width:700px;width:100%;padding:17px 10px 16px;border:1px solid #9aafc22b;border-radius:20px;background:linear-gradient(135deg,#b3c6d508,#ffffff02)}
.worksite-network figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 11px 4px}
.worksite-kicker{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#adbdcd}
.worksite-live{display:flex;align-items:center;gap:4px;height:15px;color:#9eb8a7}
.worksite-live i{display:block;width:3px;height:5px;border-radius:2px;background:currentColor;animation:work-live 3.2s ease-in-out infinite}
.worksite-live i:nth-child(2){height:11px;animation-delay:-.6s}.worksite-live i:nth-child(3){height:7px;animation-delay:-1.2s}
.worksite-map{width:100%;height:auto;display:block;overflow:visible;color:#c0d1df}
.worksite-map text{font-family:inherit}
.work-zone-label{font-size:14px;fill:#9db1c4;letter-spacing:.8px}
.work-node-label{font-size:17px;font-weight:500;fill:#c0d1df}
.work-phone-number{font-size:9px;fill:#8ea3b8;letter-spacing:1.5px}
.work-field-note{font-size:15px;fill:#9eb8a7}
.work-link,.work-flow{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.work-link{stroke-width:1;opacity:.35;stroke-dasharray:2 5}
.work-flow{stroke-width:2;stroke-dasharray:3 97;animation:work-packet 3.8s linear infinite}
.work-wave,.work-phone-pulse{animation:work-live 3.2s ease-in-out infinite}
.work-phone:nth-of-type(even) .work-phone-pulse{animation-delay:-1.6s}
.work-halo{transform-box:fill-box;transform-origin:center;animation:work-halo 3.8s ease-out infinite}
.worksite-legend{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;padding:12px 8px 0;font-size:10px;line-height:1.6;color:#b4c3d1}
.worksite-legend>span{display:inline-flex;align-items:center;gap:7px}
.worksite-legend i{width:6px;height:6px;border-radius:50%;flex:0 0 6px}.work-key-server{background:#90b1cb}.work-key-local{background:#c5ae94}
.login-note{font-size:12px;line-height:1.7;color:var(--muted);margin:22px 0 0}
@keyframes work-packet{to{stroke-dashoffset:-100}}
@keyframes work-live{0%,100%{opacity:.9}50%{opacity:.4}}
@keyframes work-halo{0%{transform:scale(.7);opacity:.7}100%{transform:scale(1.35);opacity:0}}
@media(max-width:1000px) and (min-width:761px){.worksite-network{padding:15px 5px}.worksite-kicker{font-size:9px;letter-spacing:1px}.worksite-legend{font-size:9px;gap:7px 12px}}
@media(max-width:760px){.login-art .brand{margin-bottom:28px}.worksite-network{margin-top:24px;max-width:560px;align-self:center}.worksite-kicker{font-size:9px;letter-spacing:1px}.worksite-legend{font-size:10px}.login-note{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.work-flow{display:none}.worksite-live i,.work-wave,.work-phone-pulse,.work-halo{animation:none}.work-halo{opacity:.35}}


.user-groups{border:1px solid var(--line);border-radius:9px;padding:14px}.user-groups legend{padding:0 5px;font-size:12px}.user-groups .hint{margin-bottom:14px}.user-groups .check{padding:8px;border-radius:6px;background:#f4f6f9;cursor:pointer}.user-groups .check input{flex:0 0 auto}.user-groups .check .icon{flex:0 0 18px;width:18px;height:18px;color:#527599}.user-groups .check span{overflow-wrap:anywhere}.user-groups .checks{max-height:230px}

.user-groups .all-user-groups{margin-bottom:10px;background:#e7edf4;border:1px solid #ccd8e5}.user-groups .all-user-groups strong{font-size:12px;font-weight:600}

/* Banner appearance v2 */
.banner-style-fields{min-width:0;margin:0;padding:18px;border:1px solid #d7dfe7;border-radius:16px;background:#f7f9fc;display:block}
.banner-style-fields legend{padding:0 8px;font-weight:650}
.banner-style-fields input[type=color]{width:100%;height:44px;padding:5px;cursor:pointer}
.banner-preview-label{font-size:12px;font-weight:650;text-transform:uppercase;letter-spacing:.08em;color:#536479}
.banner-surface{--banner-color:#f8fafc;--banner-bg:#162b31;min-width:0;padding:10px 16px;border-radius:12px;background:var(--banner-bg);overflow:hidden}
.banner-surface .banner-letter{color:var(--banner-color);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:30px;font-weight:600;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}
.banner-surface[data-effect=shadow] .banner-letter{text-shadow:2px 3px 2px #000d}
.banner-surface[data-effect=glow] .banner-letter{text-shadow:0 0 5px var(--banner-color)}
.banner-surface[data-effect=outline] .banner-letter{text-shadow:1px 0 #000,-1px 0 #000,0 1px #000,0 -1px #000}
.banner-scroll .banner-track{display:flex;align-items:center;gap:40px;width:max-content;min-height:50px}
.banner-scroll .banner-letter{display:block;flex-shrink:0;white-space:pre}
.banner-scroll.is-scrolling .banner-track{animation:banner-travel var(--banner-duration) linear 1.5s infinite}
.banner-scroll:hover .banner-track{animation-play-state:paused}
@keyframes banner-travel{from{transform:translateX(0)}to{transform:translateX(var(--banner-travel))}}
.announcement>.banner-surface{margin:14px 0}.announcement footer{gap:10px;flex-wrap:wrap}.announcement footer .btn{font-size:12px}
.radio-feed .banner-surface{margin:10px 0;padding:8px 12px}
@media(prefers-reduced-motion:reduce){.banner-scroll .banner-track{animation:none!important;width:auto}.banner-scroll .banner-letter{white-space:pre-wrap}.banner-scroll [data-copy]{display:none}}

.ticker .ticker-copy{white-space:normal;min-width:0;padding:0}.ticker .banner-surface{border-radius:8px}.ticker{min-height:78px;height:auto}.ticker-paused .banner-track{animation-play-state:paused!important}

/* Keep the moving line out of the form's intrinsic width calculation.
   Safari fieldsets have special layout behavior, so the grid lives in a div. */
#modal {overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
#modal .form-grid {min-width:0;grid-template-columns:minmax(0,1fr)}
#modal .form-grid > *, #modal .form-grid label, #modal .form-grid .pair > * {min-width:0;max-width:100%}
#modal fieldset {min-inline-size:0;width:100%;max-width:100%;margin-inline:0}
#modal .form-grid .pair {min-width:0;width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
#modal .banner-style-content {min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
#banner-preview {min-width:0;width:100%;max-width:100%;overflow:hidden;contain:inline-size}
.banner-scroll {width:100%;max-width:100%;contain:inline-size}
#modal .form-grid select {min-height:42px}
#modal .modal-head h2 {min-width:0;overflow-wrap:anywhere}
#modal .modal-head button {flex-shrink:0}
#modal .modal-actions {flex-wrap:wrap}
@media(max-width:600px){
 #modal {padding:20px;width:calc(100% - 24px)}
 #modal .form-grid .pair {grid-template-columns:minmax(0,1fr)}
 #modal .banner-style-fields {padding:14px}
}

.announcement-recorder{min-width:0;border:1px solid #cbd7e4;border-radius:14px;background:#f0f5fa;padding:16px;margin-bottom:20px}
.announcement-recorder [hidden]{display:none!important}
.recorder-buttons{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0}
.recorder-buttons .btn{justify-content:center}.recorder-time{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap}
.announcement-recorder progress{width:100%;height:7px;accent-color:#b63a46;display:block}
.recorder-status{font-size:12px;line-height:1.5;min-height:18px;margin:10px 0;color:#45617e}
.announcement-recorder[data-recording=true]{border-color:#d5707c}.announcement-recorder[data-recording=true] .recorder-status{color:#ab2336;font-weight:650}
.announcement-recorder audio{display:block;width:100%;max-width:100%;margin-bottom:12px}

#modal .form-grid .banner-speed-slider{padding:0;border:0;min-height:30px;height:30px;accent-color:#40658f;background:transparent;cursor:pointer}
.banner-speed-ends{display:flex;justify-content:space-between;color:#536479;font-size:11px}

/* Independent text/background effects; never more than one blink per 2.4 seconds. */
.banner-surface{position:relative;isolation:isolate}
.banner-surface::before{content:"";position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;border-radius:inherit;z-index:-1}
.banner-surface[data-effect=blink] .banner-letter{animation:banner-blink 2.4s step-end infinite}
.banner-surface[data-effect=pulse] .banner-letter{animation:banner-pulse 2.4s ease-in-out infinite}
.banner-surface[data-effect=rainbow] .banner-letter{background:linear-gradient(90deg,#f472b6,#fb923c,#fde047,#6ee7b7,#67e8f9,#c084fc);background-clip:text;-webkit-background-clip:text;color:transparent}
.banner-surface[data-background-effect=blink]::before{animation:banner-background-blink 2.4s step-end infinite}
.banner-surface[data-background-effect=pulse]::before{animation:banner-background-pulse 2.4s ease-in-out infinite}
@keyframes banner-blink{0%,100%{opacity:1}65%{opacity:.3}}
@keyframes banner-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes banner-background-blink{0%,100%{opacity:0}65%{opacity:.3}}
@keyframes banner-background-pulse{0%,100%{opacity:0}50%{opacity:.3}}
.banner-symbols{min-width:0;border:1px solid #d7dfe7;border-radius:12px;padding:12px 14px;background:#f7f9fc}
.banner-symbols summary{cursor:pointer;font-weight:650;min-height:24px}
.symbol-category{margin-top:12px}.symbol-category strong{font-size:12px;color:#536479}
.symbol-buttons{display:flex;flex-wrap:wrap;gap:7px;margin-top:7px}
.symbol-buttons button{min-width:40px;min-height:40px;padding:5px 10px;border:1px solid #d4dde8;border-radius:9px;background:white;color:#243f59;font-size:21px;line-height:1.2;cursor:pointer}
.symbol-buttons button:hover{background:#e3edf7;transform:translateY(-2px)}
.symbol-buttons button:focus-visible{outline:2px solid #40658f;outline-offset:2px}
@media(prefers-reduced-motion:reduce){
 .banner-surface .banner-letter,.banner-surface::before{animation:none!important}
 .symbol-buttons button:hover{transform:none}
}

.existing-announcement-audio{display:grid;gap:10px;margin-bottom:16px}.existing-announcement-audio audio{width:100%;max-width:100%}
.announcement footer{flex-wrap:wrap;gap:10px}

.radio-access {display:grid;gap:12px}.radio-access .checks {max-height:200px;overflow:auto}.radio-access .check span {overflow-wrap:anywhere;min-width:0}

/* Login: compact desktop layout with the app identity beside the form. */
#app .login-shell{min-height:calc(100dvh - 52px);grid-template-columns:1.15fr 1fr}
#app .login-art{align-items:center;justify-content:center;text-align:center;padding:26px clamp(24px,3.5vw,56px);min-width:0}
#app .login-art h1{font-size:clamp(34px,3.6vw,50px);max-width:560px;line-height:1.08;margin:0;letter-spacing:-1.8px;text-wrap:balance}
#app .login-art .worksite-network{width:100%;max-width:570px;margin:18px 0 0;padding:12px 10px;border-radius:16px;text-align:left}
#app .login-art .worksite-map{height:clamp(190px,calc(100dvh - 350px),490px);width:100%;object-fit:contain}
#app .login-art .worksite-legend{padding-top:8px;gap:7px 16px}
#app .login-art .work-flow-in{animation-direction:reverse;stroke-dasharray:2 98;opacity:.8}
#app .login-art .work-offline-label,#app .login-art .work-offline-note{fill:#d8ad78}
#app .login-art .work-offline-note{font-size:13px;font-weight:500}
#app .login-art .work-cross-note{font-size:12px;fill:#b8ccda;letter-spacing:.6px}
#app .login-art .work-key-offline{background:#d8ad78}
#app .login-art .work-simulation-kicker{font-size:11px;fill:#91a8bd;letter-spacing:1.5px;text-transform:uppercase}
#app .login-art .work-simulation-heading{font-size:17px;font-weight:600;fill:#c7d6dd}
#app .login-art .work-simulation-failed{fill:#e3938d}
#app .login-art .work-simulation-copy{font-size:13px;fill:#a9bfce}
#app .login-art .work-simulation-local{font-size:12px;fill:#a8c5b2}
#app .login-art .work-sim-up,#app .login-art .work-server-dependent{animation:work-server-up 18s linear infinite both;animation-delay:var(--work-cycle-offset,0s)}
#app .login-art .work-sim-down{opacity:0;animation:work-server-down 18s linear infinite both;animation-delay:var(--work-cycle-offset,0s)}
#app .login-art .work-server-disc{animation:work-server-color 18s linear infinite both;animation-delay:var(--work-cycle-offset,0s)}
#app .login-art .work-phone--wifi .phone-transport,#app .login-art .work-lan-symbol{animation:work-wifi-color 18s linear infinite both;animation-delay:var(--work-cycle-offset,0s)}
@keyframes work-server-up{0%,32%,78%,100%{opacity:1}36%,72%{opacity:0}}
@keyframes work-server-down{0%,32%,78%,100%{opacity:0}36%,72%{opacity:1}}
@keyframes work-server-color{0%,32%,78%,100%{fill:#263d54;stroke:#9cb4c9}36%,72%{fill:#512c37;stroke:#e3938d}}
@keyframes work-wifi-color{0%,32%,78%,100%{stroke:#90b1cb}36%,72%{stroke:#e0b078}}
#app .login-art>p{font-size:13px;line-height:1.65;margin:16px 0 0;padding:0;max-width:470px}
#app .login-art>.eyebrow{margin:16px 0 0;padding:0;font-size:8px;line-height:1.6;max-width:470px;letter-spacing:1.3px}
#app .login-form{width:100%;max-width:480px;margin:0 auto;padding:26px clamp(24px,3vw,42px);align-self:center;min-width:0}
#app .login-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:26px}
#app .login-brand{display:flex;align-items:center;gap:12px;font-family:Manrope,system-ui,sans-serif;font-weight:800;letter-spacing:-1.3px;font-size:29px;color:#26354a;white-space:nowrap}
#app .login-brand img{display:block;width:48px;height:48px;object-fit:contain;border-radius:11px;flex-shrink:0}
#app .login-header .language-picker{flex-shrink:1;min-width:0}
#app .login-header .language-picker select{max-width:150px;min-width:0;width:100%;font-size:10px}
#app .login-form>.eyebrow{margin-top:0!important;font-size:9px;letter-spacing:1.7px}
#app .login-form>h2{margin-top:11px!important;font-size:27px;line-height:1.2}
#app .login-form>p{margin:10px 0 22px;font-size:12px;line-height:1.6}
#app .login-form .form-grid{gap:15px}
#app .login-form .login-note{margin:16px 0 0;font-size:11px;line-height:1.6}
@media(min-width:761px) and (max-height:650px){
  #app .login-art{padding-block:20px}
  #app .login-art h1{font-size:34px}
  #app .login-art .worksite-network{margin-top:13px;padding:9px 8px}
  #app .login-art>p{font-size:12px;margin-top:12px}
  #app .login-art>.eyebrow{margin-top:12px}
  #app .login-form{padding-block:18px}
  #app .login-header{margin-bottom:18px}
  #app .login-form .form-grid{gap:12px}
}
@media(min-width:761px) and (max-width:1050px){
  #app .login-form{padding-inline:24px}
  #app .login-header{gap:12px;flex-wrap:wrap}
  #app .login-brand{font-size:27px}
}
@media(max-width:760px){
  #app .login-shell{display:flex;flex-direction:column}
  #app .login-form{order:0;max-width:480px;padding:24px}
  #app .login-header{gap:12px;margin-bottom:22px;flex-wrap:wrap}
  #app .login-brand{font-size:27px}
  #app .login-brand img{width:44px;height:44px;border-radius:10px}
  #app .login-art{order:1;min-height:0;padding:26px 24px}
  #app .login-art h1{font-size:34px}
  #app .login-art .worksite-network{max-width:480px}
  #app .login-art .worksite-map{height:350px}
  #app .login-art>p{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  #app .login-art .work-sim-up,#app .login-art .work-server-dependent{animation:none;opacity:1}
  #app .login-art .work-sim-down{animation:none;opacity:0}
  #app .login-art .work-server-disc,#app .login-art .work-phone--wifi .phone-transport,#app .login-art .work-lan-symbol{animation:none}
}