#operating-mode-panel{min-width:0;color:#ecf0f1;font-size:15px}
#operating-mode-panel .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mode-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.mode-heading h1{font-size:clamp(30px,3.2vw,44px);line-height:1.1;letter-spacing:-.055em;margin:8px 0}.mode-heading p:not(.lesson-kicker){color:#a3b5bf;margin:0}.mode-heading .lesson-kicker{font-size:12px;color:#d99870;letter-spacing:.15em;margin:0}
.mode-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:21px}.mode-overview>div{background:#19262d;border:1px solid #ffffff0d;border-radius:17px;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px}.mode-overview span{color:#a3b6c0;font-size:14px}.mode-overview strong{font-size:29px;letter-spacing:-.045em;font-weight:600;font-variant-numeric:tabular-nums}.mode-overview .mode-green{color:#75d6b0}
.mode-toolbar{display:flex;gap:12px;margin-bottom:14px}.mode-toolbar label:first-child{flex:1}.mode-toolbar input,.mode-toolbar select{width:100%;height:46px;background:#16232a;border:1px solid #ffffff16;border-radius:11px;color:#e9f0f2;font:inherit;padding:0 14px}.mode-toolbar select{min-width:165px}.mode-toolbar input::placeholder{color:#879aa5}.mode-toolbar button,.mode-error button{border:0;border-radius:11px;background:#b85b2e;color:white;min-height:46px;padding:0 19px;font:inherit;font-weight:600;cursor:pointer}
.mode-table-scroll{overflow-x:auto;border:1px solid #ffffff12;border-radius:17px;background:#17242b;scrollbar-color:#445862 #17242b}.mode-table{width:100%;border-collapse:collapse;min-width:900px;text-align:center;font-variant-numeric:tabular-nums}.mode-table th,.mode-table td{border-bottom:1px solid #ffffff0c}.mode-table thead th{font-weight:500;color:#a9bbc4}.mode-table .mode-groups th{background:#21333b;padding:15px 9px;font-size:13px}.mode-table .mode-groups th:not(:last-child){border-right:1px solid #ffffff0d}.mode-table .mode-groups th:first-child{min-width:190px;text-align:left;padding-left:19px}.mode-table .mode-labels th{background:#1b2b33;padding:12px 8px;font-size:12px;white-space:nowrap}.mode-table tbody th{font-weight:400;text-align:left;position:sticky;left:0;background:#17242b;z-index:1}.mode-table tbody tr:hover th,.mode-table tbody tr:hover td{background:#1d3038}.mode-table tbody th a{display:flex;align-items:center;gap:10px;color:#edf2f3;padding:12px 17px;min-height:54px}.mode-table tbody th strong{display:block;font-size:15px;white-space:nowrap}.mode-table tbody th small{display:block;color:#8ea5b0;font-size:12px;margin-top:3px;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mode-table tbody td{padding:9px 7px}.mode-store-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;background:#2b4047;color:#8fa9b3;border-radius:9px}.mode-store-icon.online{color:#76d2ad;background:#285545}.mode-store-icon svg{width:18px;height:18px;fill:currentColor}
.mode-indicator{display:inline-flex;align-items:center;justify-content:center;gap:3px;min-width:48px;height:32px;border-radius:9px;font-size:11px;font-weight:700;border:1px solid transparent}.mode-indicator svg{width:15px;height:15px;fill:currentColor}.mode-indicator b{font-size:12px}.mode-indicator.on{color:#75d6ae;background:#28504478;border-color:#6cbf9c28}.mode-indicator.off{color:#8499a3;background:#26363d;border-color:#ffffff0b}.mode-indicator.unknown{color:#b1a389;background:#463b2c70;border-color:#bea06b25}.mode-connection{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:7px 10px;border-radius:9px;font-size:12px}.mode-connection>span{width:7px;height:7px;border-radius:50%;background:currentColor}.mode-connection.online{background:#2c544273;color:#7bd4ae}.mode-connection.offline{background:#334047;color:#acbac2}.mode-connection.unknown{background:#3a3b3d;color:#a7a8a9}.mode-empty{text-align:center;color:#9fb2bd;padding:35px!important}
.mode-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 4px;color:#9eb0ba;font-size:13px}.mode-footer>div{display:flex;gap:8px}.mode-footer button{min-height:38px}.mode-note{display:flex;align-items:center;gap:8px;color:#9cacb5;font-size:12px;line-height:1.5;margin:0}.mode-note .mode-indicator{min-width:23px;width:23px;height:23px;font-size:12px}.mode-loading,.mode-error{background:#17242b;border:1px solid #ffffff0d;border-radius:17px;padding:30px;color:#a9bdc6}.mode-error h2{margin:0 0 8px;color:#eef2f3}.mode-error p{margin:0 0 18px}
@media(max-width:800px){.mode-overview{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mode-overview>div{display:block;padding:15px}.mode-overview strong{display:block;margin-top:8px;font-size:24px}.mode-toolbar{flex-wrap:wrap}.mode-toolbar label:first-child{width:100%;flex:none}.mode-toolbar label:nth-child(2){flex:1}.mode-heading{align-items:flex-start}.mode-heading .editor-secondary{white-space:nowrap}}
@media(max-width:540px){.mode-heading{flex-direction:column}.mode-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.mode-overview>div:first-child{grid-column:1/-1}.mode-overview>div:first-child{display:flex}.mode-overview>div:first-child strong{margin:0}.mode-toolbar button{width:100%}.mode-note{align-items:flex-start}.mode-footer{align-items:flex-start;flex-direction:column}}