*{box-sizing:border-box}

body{
margin:0;
height:100vh;
display:grid;
place-items:center;
background:#000000;
color:#ececec;
font-family:'IBM Plex Mono',monospace;
overflow:hidden;
}

.screen{
position:fixed;
inset:0;
pointer-events:none;
background:repeating-linear-gradient(
0deg,
rgba(255,255,255,.018),
rgba(255,255,255,.018) 1px,
transparent 1px,
transparent 4px
);
}

.terminal{
width:min(1180px,92vw);
height:min(760px,86vh);
display:grid;
grid-template-columns:340px 1fr;
border:1px solid #555;
background:#000000;
}

.terminal.dashboard-mode{
width:calc(100vw - 36px);
height:calc(100vh - 36px);
grid-template-columns:280px 1fr;
}

.left{
padding:48px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
border-right:1px solid #555;
}

.dashboard-mode .left{
display:none;
}

.logo{width:240px}

.tag{
margin-top:28px;
font-size:12px;
letter-spacing:.2em;
text-align:center;
color:#a1a1a1;
}

.right{
padding:60px;
display:flex;
flex-direction:column;
justify-content:center;
min-width:0;
}

.dashboard-mode .right{
padding:0;
justify-content:stretch;
}

.top{
border-bottom:1px solid #444;
padding-bottom:20px;
color:#aaa;
display:flex;
justify-content:space-between;
gap:24px;
font-size:14px;
}

.dashboard-mode .top{
display:none;
}

.boot{
margin-top:60px;
white-space:pre-line;
line-height:1.9;
}

.login{
width:520px;
margin:60px auto 0;
border:1px solid #555;
padding:34px;
}

.title{
margin-bottom:24px;
font-size:24px;
}

.menu{
display:flex;
gap:12px;
margin-bottom:28px;
}

.menu-item{
padding:8px 10px;
color:#888;
}

.selected{
color:#fff;
border-left:4px solid #8b1d26;
padding-left:14px;
font-weight:500;
}

input,button{
width:100%;
padding:14px;
margin-top:14px;
background:#000;
border:1px solid #444;
color:white;
font:inherit;
}

button{cursor:pointer}

.hidden{display:none}

.help{
margin-top:20px;
color:#888;
font-size:12px;
}

/* FULL DASHBOARD */

.app-view{
height:100%;
min-height:0;
}

.dashboard-shell{
height:100%;
display:grid;
grid-template-columns:300px 1fr;
background:#000000;
}

.side-nav{
border-right:1px solid #444;
padding:22px 18px;
display:flex;
flex-direction:column;
min-height:0;
}

.side-brand{
display:flex;
align-items:center;
gap:14px;
padding-bottom:22px;
border-bottom:1px solid #333;
}

.side-brand img{
width:34px;
height:auto;
}

.side-brand-text{
font-size:14px;
letter-spacing:.14em;
font-weight:500;
}

.operator-box{
padding:22px 0;
border-bottom:1px solid #333;
font-size:13px;
line-height:1.9;
color:#aaa;
}

.operator-box strong{
color:#fff;
font-weight:500;
}

.nav-list{
padding-top:22px;
display:flex;
flex-direction:column;
gap:8px;
}

.nav-item{
border:1px solid #2f2f2f;
padding:13px 14px;
color:#999;
font-size:13px;
letter-spacing:.08em;
}

.nav-item.active{
color:#fff;
border-color:#8b1d26;
border-left:4px solid #8b1d26;
padding-left:18px;
background:linear-gradient(90deg,rgba(139,29,38,.22),rgba(255,255,255,.02));
font-weight:500;
}

.nav-footer{
margin-top:auto;
border-top:1px solid #333;
padding-top:18px;
color:#777;
font-size:12px;
line-height:1.8;
}

.workspace{
padding:22px;
min-width:0;
display:grid;
grid-template-rows:auto 1fr;
gap:18px;
}

.workspace-top{
border:1px solid #444;
padding:16px 20px;
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
}

.workspace-title{
font-size:16px;
letter-spacing:.14em;
font-weight:500;
}

.workspace-meta{
color:#aaa;
font-size:13px;
display:flex;
gap:22px;
}

.workspace-main{
border:1px solid #444;
padding:22px;
min-height:0;
overflow:hidden;
}

.dashboard-grid{
height:100%;
display:grid;
grid-template-columns:1.1fr .9fr;
grid-template-rows:auto 1fr;
gap:18px;
}

.card{
border:1px solid #333;
padding:20px;
background:rgba(255,255,255,.015);
}

.card-title{
color:#aaa;
font-size:13px;
letter-spacing:.14em;
margin-bottom:16px;
}

.facility-state{
font-size:30px;
letter-spacing:.12em;
}

.bar{
height:8px;
border:1px solid #333;
margin:18px 0;
}

.bar-fill{
height:100%;
width:72%;
background:#8b1d26;
}

.notice{
color:#bbb;
font-size:13px;
line-height:1.8;
}

.news-box{
border:1px dashed #333;
padding:20px;
color:#aaa;
letter-spacing:.08em;
}

.telemetry{
height:100%;
overflow:auto;
font-size:13px;
line-height:1.9;
}

.telemetry-row{
display:grid;
grid-template-columns:58px 64px 1fr;
gap:12px;
border-bottom:1px solid rgba(255,255,255,.04);
padding:4px 0;
}

.code-red{color:#cf2a35}
.code-ok{color:#fff}
.code-dim{color:#888}

@media(max-width:900px){
body{
overflow:auto;
display:block;
}

.terminal,
.terminal.dashboard-mode{
width:calc(100vw - 32px);
height:auto;
min-height:calc(100vh - 32px);
margin:16px auto;
grid-template-columns:1fr;
}

.left{
border-right:none;
border-bottom:1px solid #555;
}

.right{padding:32px}

.login{width:100%}

.dashboard-shell{
grid-template-columns:1fr;
}

.side-nav{
border-right:none;
border-bottom:1px solid #444;
}

.dashboard-grid{
grid-template-columns:1fr;
}

.workspace{
padding:16px;
}
}


/* DASHBOARD LAYOUT FIX V2 */

.terminal.dashboard-mode{
  width:calc(100vw - 36px);
  height:calc(100vh - 36px);
  grid-template-columns:1fr;
}

.dashboard-mode .left{
  display:none;
}

.dashboard-mode .right{
  grid-column:1 / -1;
  width:100%;
  height:100%;
  min-width:0;
  padding:0;
  display:block;
}

.dashboard-mode .app-view{
  display:block;
  width:100%;
  height:100%;
  min-width:0;
}

.dashboard-shell{
  width:100%;
  height:100%;
  min-width:0;
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
}

.workspace{
  width:100%;
  min-width:0;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
}

.workspace-top{
  width:100%;
  min-width:0;
}

.workspace-main{
  width:100%;
  min-width:0;
  min-height:0;
  overflow:auto;
}

.dashboard-grid{
  width:100%;
  min-width:0;
  min-height:100%;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
}

.card{
  min-width:0;
}

.telemetry-row{
  min-width:0;
}

.telemetry-row span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media(max-width:900px){
  .terminal.dashboard-mode{
    width:calc(100vw - 32px);
    height:auto;
    min-height:calc(100vh - 32px);
  }

  .dashboard-shell{
    grid-template-columns:1fr;
  }
}


/* DASHBOARD FONT UPDATE */

.dashboard-shell,
.dashboard-shell *{
font-family:'Inter',sans-serif;
}

.workspace-title,
.module-title,
.facility-state{
font-weight:500;
letter-spacing:.08em;
}

.card-title,
.workspace-meta,
.operator-box,
.nav-item,
.notice,
.telemetry,
.news-box,
.nav-footer{
font-family:'Inter',sans-serif;
letter-spacing:.04em;
}

.side-brand-text{
font-weight:600;
letter-spacing:.16em;
}

.dashboard-shell .workspace-main{
line-height:1.45;
}

/* keep login mono */
.login,
.login *,
.boot,
.boot *,
.top{
font-family:'IBM Plex Mono',monospace !important;
}


/* DASHBOARD SIDEBAR LOGO UPDATE */

.side-logo-block{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:10px 0 28px;
  border-bottom:1px solid #333;
}

.side-logo-block img{
  width:170px;
  max-width:82%;
  height:auto;
  display:block;
}

.side-brand{
  display:none;
}

.operator-box{
  padding-top:22px;
}


/* CHAT DRAWER V1 */

.chat-toggle{
  position:fixed;
  right:28px;
  bottom:26px;
  z-index:40;
  width:auto;
  margin:0;
  padding:12px 18px;
  border:1px solid #8b1d26;
  background:#111;
  color:#fff;
  font-family:'Inter',sans-serif;
  font-size:12px;
  letter-spacing:.12em;
}

.chat-toggle:hover{
  background:rgba(139,29,38,.22);
}

.chat-drawer{
  position:fixed;
  top:18px;
  right:18px;
  bottom:18px;
  width:390px;
  z-index:50;
  border:1px solid #555;
  background:#000000;
  display:flex;
  flex-direction:column;
  transform:translateX(calc(100% + 28px));
  transition:transform .18s ease;
  box-shadow:-24px 0 80px rgba(0,0,0,.55);
}

.chat-drawer.open{
  transform:translateX(0);
}

.chat-head{
  border-bottom:1px solid #444;
  padding:16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:'Inter',sans-serif;
  letter-spacing:.12em;
  font-size:13px;
}

.chat-head button{
  width:auto;
  margin:0;
  padding:4px 10px;
  border:1px solid #444;
  background:#090909;
  color:#fff;
  font-size:18px;
  line-height:1;
}

.chat-log{
  flex:1;
  padding:16px;
  overflow:auto;
  font-family:'Inter',sans-serif;
  font-size:13px;
}

.chat-line{
  display:grid;
  grid-template-columns:48px 72px 1fr;
  gap:10px;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}

.chat-line span{
  color:#999;
}

.chat-line b{
  color:#cf2a35;
  font-weight:600;
}

.chat-line em{
  color:#ddd;
  font-style:normal;
  min-width:0;
  overflow-wrap:anywhere;
}

.chat-input-row{
  border-top:1px solid #444;
  padding:14px;
  display:grid;
  grid-template-columns:1fr 86px;
  gap:10px;
}

.chat-input-row input,
.chat-input-row button{
  margin:0;
  font-family:'Inter',sans-serif;
}

.chat-input-row button{
  border-color:#8b1d26;
}

@media(max-width:700px){
  .chat-drawer{
    width:auto;
    left:18px;
  }

  .chat-toggle{
    right:18px;
    bottom:18px;
  }
}


/* CHAT TOP BAR */

.chat-toggle{
display:none !important;
}

.workspace-meta{
display:flex;
align-items:center;
gap:16px;
}

.chat-top-button{
width:auto;
margin:0;
padding:8px 14px;
background:#000000;
border:1px solid #8b1d26;
color:#fff;
font-family:'Inter',sans-serif;
font-size:12px;
letter-spacing:.14em;
}

.chat-top-button:hover{
background:rgba(139,29,38,.18);
}

.chat-top-button::before{
content:'◻ ';
color:#cf2a35;
}


/* CHAT HANDLE V1 */

.chat-top-button{
  display:none !important;
}

.chat-drawer{
  overflow:visible;
}

.chat-drawer.hidden{
  display:flex !important;
}

.chat-handle{
  position:absolute;
  left:-46px;
  top:18px;
  width:46px;
  height:112px;
  margin:0;
  padding:0;
  border:1px solid #555;
  border-right:none;
  background:#000000;
  color:#fff;
  font-family:'Inter',sans-serif;
  font-size:11px;
  letter-spacing:.12em;
  writing-mode:vertical-rl;
  text-orientation:mixed;
  cursor:pointer;
}

.chat-handle:hover{
  border-color:#8b1d26;
  color:#fff;
  background:rgba(139,29,38,.18);
}

.chat-drawer.open .chat-handle{
  border-color:#8b1d26;
}

.chat-toggle{
  display:none !important;
}

@media(max-width:700px){
  .chat-handle{
    left:auto;
    right:12px;
    top:-44px;
    width:92px;
    height:44px;
    writing-mode:horizontal-tb;
    border:1px solid #555;
  }
}


/* CHAT HEADER CLEANUP */

.chat-head{
justify-content:flex-start !important;
padding-right:18px;
}


/* CHAT DATE SEPARATORS */

.chat-day{
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
gap:14px;
padding:18px 0 12px;
}

.chat-day span{
height:1px;
background:rgba(255,255,255,.08);
}

.chat-day label{
font-family:'Inter',sans-serif;
font-size:11px;
letter-spacing:.24em;
color:#777;
}

.chat-line{
padding-top:10px;
}


/* STRONG MODULE SCROLL FIX */

.dashboard-mode .right,
.dashboard-mode .app-view,
.dashboard-shell,
.workspace,
.workspace-main,
.module-mount{
  min-height:0 !important;
}

.workspace-main{
  overflow:hidden !important;
}

.module-mount{
  height:100% !important;
  overflow:hidden !important;
}


/* OLED BLACK */

html,
body{
  background:#000 !important;
}

body{
  color:#e6e6e6;
}

.dashboard-shell,
.workspace,
.workspace-main,
.side-nav,
.card,
.chat-drawer,
.module-mount{
  background:#000 !important;
}

.card{
  border-color:rgba(255,255,255,.08) !important;
}

input,
textarea,
select,
button{
  background:#000 !important;
}