/* AXION OS — console-specific styles */
.sysstat { display: flex; gap: 16px; align-items: center; font-size: 18px; flex-wrap: wrap; }
.sysstat b { font-weight: 400; color: var(--ink); }
.desk { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 18px; margin-top: 20px; margin-bottom: 40px; align-items: start; }
.dock { padding: 12px; position: sticky; top: 84px; }
.dock-title { margin: 2px 4px 10px; }
.dock nav { display: grid; gap: 6px; }
.dock a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; color: var(--ink); font-family: var(--f-pix); font-size: 12px; letter-spacing: .06em; background: var(--panel2); box-shadow: inset -3px -3px 0 rgba(0, 0, 0, .4); }
.dock a svg { width: 22px; height: 22px; flex: none; }
.dock a:hover { background: var(--faint); color: var(--ink); }
.dock a[aria-current='page'] { background: var(--cyan); color: #000; }
.dock-foot { margin-top: 12px; font-size: 16px; padding: 0 4px; }
.window { min-width: 0; padding: 0; }
.titlebar { display: flex; align-items: center; gap: 10px; background: linear-gradient(90deg, var(--cyan), #2a8fd0 60%, var(--mag)); color: #000; padding: 6px 10px; font-family: var(--f-pix); font-size: 13px; letter-spacing: .08em; }
.tb-ico svg { width: 18px; height: 18px; display: block; }
.tb-btns { margin-left: auto; display: flex; gap: 4px; }
.tb-btns i { font-style: normal; width: 22px; height: 20px; display: grid; place-items: center; background: var(--panel); color: var(--ink); font-size: 12px; box-shadow: inset -2px -2px 0 rgba(0, 0, 0, .5), inset 2px 2px 0 rgba(255, 255, 255, .12); }
.win-body { padding: 20px; min-height: 60vh; }
.win-body h2 { font-size: 24px; }
.win-body .lead { margin: 6px 0 18px; max-width: 78ch; font-size: 20px; }
.cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 18px; }
.box { background: var(--bg2); border: 3px solid var(--line); padding: 14px; min-width: 0; }
.box + .box { margin-top: 14px; }
.box h3 { font-size: 13px; color: var(--cyan); letter-spacing: .08em; margin-bottom: 10px; display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.step { display: flex; gap: 12px; align-items: baseline; margin: 6px 0 10px; }
.step b { font-family: var(--f-big); font-weight: 400; font-size: 14px; color: var(--mag); }
.step span { font-family: var(--f-pix); font-size: 13px; }
.field { display: grid; gap: 6px; margin-top: 12px; min-width: 0; }
.field label { font-family: var(--f-pix); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
.field input[type=text], .field input[type=email], .field input[type=number], .field select, .field textarea {
  background: #05060d; border: 3px solid var(--line); padding: 8px 10px; width: 100%; min-width: 0; font-size: 19px; color: var(--ink);
}
.field textarea { resize: vertical; min-height: 84px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--lime); }
input[type=range] { width: 100%; accent-color: var(--lime); }
.checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.checks label { display: flex; gap: 8px; align-items: center; font-size: 19px; }
.checks input { accent-color: var(--lime); width: 16px; height: 16px; }
.out { margin-top: 8px; background: #05060d; border: 2px dashed var(--faint); padding: 10px; font-size: 17px; word-break: break-all; max-height: 170px; overflow: auto; color: var(--dim); }
.out.ok { border-color: var(--lime); color: var(--lime); }
.out.bad { border-color: var(--red); color: var(--red); }
.outhead { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; }
.note { margin-top: 12px; font-size: 18px; color: var(--dim); border-left: 4px solid var(--amber); padding-left: 10px; }
.note.g { border-left-color: var(--lime); }
.note.r { border-left-color: var(--red); }
.readout { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.readout > div { background: #05060d; border: 2px solid var(--line); padding: 10px; min-width: 0; }
.readout b { display: block; font-family: var(--f-big); font-weight: 400; font-size: 15px; margin-top: 6px; overflow-wrap: anywhere; color: var(--ink); }
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.tile { background: var(--bg2); border: 3px solid var(--line); padding: 14px; }
.tile .k { font-family: var(--f-pix); font-size: 10px; letter-spacing: .1em; color: var(--dim); text-transform: uppercase; }
.tile .v { font-family: var(--f-big); font-size: 24px; margin-top: 10px; }
.tile .s { color: var(--dim); font-size: 17px; margin-top: 6px; }
.gauge { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 12px; }
.gauge i { height: 34px; background: var(--faint); display: grid; place-items: center; font-style: normal; font-family: var(--f-big); font-size: 12px; color: #000; box-shadow: inset -3px -3px 0 rgba(0, 0, 0, .35); }
.gauge i.on.l0 { background: var(--lime); } .gauge i.on.l1, .gauge i.on.l2 { background: var(--amber); } .gauge i.on.l3, .gauge i.on.l4 { background: var(--red); }
.progress { height: 14px; background: var(--faint); margin-top: 10px; box-shadow: 0 0 0 2px #000; }
.progress i { display: block; height: 100%; width: 0; background: repeating-linear-gradient(90deg, var(--lime) 0 8px, #4fae1f 8px 10px); }
.log { margin-top: 10px; background: #05060d; border: 2px solid var(--line); height: 150px; overflow: auto; padding: 8px 10px; font-size: 17px; }
.log div { white-space: pre-wrap; word-break: break-all; }
.log .ts { color: var(--faint); }
.src { margin: 0; padding: 14px; font-size: 17px; line-height: 1.3; white-space: pre; overflow: auto; max-height: 62vh; background: #05060d; border: 3px solid var(--line); }
.src .c { color: var(--faint); } .src .k { color: var(--mag); } .src .s { color: var(--lime); } .src .t { color: var(--cyan); }
.files { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 14px; }
.flist { display: grid; gap: 6px; align-content: start; }
.flist button { all: unset; cursor: pointer; padding: 8px 10px; background: var(--panel2); font-size: 18px; display: flex; justify-content: space-between; gap: 8px; }
.flist button span { color: var(--dim); font-size: 15px; }
.flist button[aria-pressed=true] { background: var(--cyan); color: #000; }
.flist button[aria-pressed=true] span { color: #000; }
.dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; font-size: 17px; }
.dl dt { color: var(--dim); }
.dl dd { margin: 0; word-break: break-all; color: var(--ink); }
.empty { color: var(--dim); text-align: center; padding: 24px; font-size: 19px; }
@media (max-width: 1100px) {
  .desk { grid-template-columns: minmax(0, 1fr); }
  .dock { position: static; }
  .dock nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cols, .files { grid-template-columns: minmax(0, 1fr); }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dock nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tiles, .readout, .checks { grid-template-columns: minmax(0, 1fr); }
  .hide-sm { display: none; }
  .win-body { padding: 14px; }
}