
/* Oceanic UI layer: visual-only overrides; original API/JS remains untouched. */
:root{--oceanic-blue:#2563eb;--oceanic-blue-dark:#1d4ed8;--oceanic-blue-soft:#eff6ff;--oceanic-border:#e7edf7;--oceanic-bg:#f6f8fc}
html,body,#root{background:var(--oceanic-bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
button,.ant-btn{border-radius:12px!important;transition:all .2s ease}
.ant-btn-primary{background:var(--oceanic-blue)!important;border-color:var(--oceanic-blue)!important;box-shadow:0 5px 16px rgba(37,99,235,.18)}
.ant-btn-primary:hover{background:var(--oceanic-blue-dark)!important;border-color:var(--oceanic-blue-dark)!important}
.ant-input,.ant-input-affix-wrapper,.ant-select-selector,.ant-picker,.ant-input-number{border-radius:12px!important;border-color:var(--oceanic-border)!important;min-height:44px}
.ant-input:focus,.ant-input-affix-wrapper-focused,.ant-select-focused .ant-select-selector{border-color:var(--oceanic-blue)!important;box-shadow:0 0 0 3px rgba(37,99,235,.10)!important}
.ant-card,.ant-modal-content,.ant-popover-inner,.ant-dropdown-menu{border:1px solid var(--oceanic-border)!important;border-radius:18px!important;box-shadow:0 10px 30px rgba(31,55,90,.07)!important}
.ant-table{border-radius:14px;overflow:hidden}
.ant-table-thead>tr>th{background:#f8faff!important}
.ant-tag{border-radius:999px!important}
.styles_J2CiH{background:rgba(255,255,255,.94)!important;border-bottom:1px solid var(--oceanic-border);backdrop-filter:blur(14px)}
.styles_EGZ2t{color:#172033}
.styles_sew6T{background:rgba(255,255,255,.96)!important;border-bottom:1px solid var(--oceanic-border)}
.styles_nc5o2 a{border-radius:12px!important;margin:6px 0!important;padding:11px 16px!important}
.styles_nc5o2 a:hover,.styles_yxmig a:hover{background:var(--oceanic-blue-soft)!important;color:var(--oceanic-blue)!important}
.styles_nc5o2 .styles_l3g-F[style*="background"]{background:var(--oceanic-blue)!important;color:#fff!important;box-shadow:0 6px 16px rgba(37,99,235,.18)}
.styles_nc5o2 .styles_l3g-F[style*="background"] svg{color:#fff!important}
.styles_RlG3W{background:#fff;border-right:1px solid var(--oceanic-border)}
.styles_6Kq-F{background:#fff!important}
.styles_qrUYZ{background:#fff!important;border-bottom:1px solid var(--oceanic-border)}
.styles_55LaC{padding-left:8px;padding-right:8px}
.styles_LiftA,.styles_hX1su .styles_-0DSw,.styles_hX1su .styles_2lu1I{border:1px solid var(--oceanic-border)!important;border-radius:18px!important;background:#fff!important;box-shadow:0 8px 24px rgba(31,55,90,.05)}
.styles_mICH9{background:#f8faff!important;border:1px solid var(--oceanic-border);border-radius:14px!important}
.styles_hX1su .styles_-0DSw{padding:22px!important}
.styles_hX1su .styles_-0DSw .styles_Jwe4P .styles_FdW3j{color:#172033}
.styles_svCqL{max-width:440px!important;padding:34px 32px!important;border:1px solid var(--oceanic-border);border-radius:26px;background:#fff;box-shadow:0 18px 50px rgba(31,55,90,.09)}
.styles_svCqL .styles_jtj4j .styles_jy-13{font-size:30px!important;color:#172033}
.styles_svCqL .styles_jtj4j .styles_FsgMa{color:#7b8495}
.styles_C6Q6h{background:linear-gradient(180deg,#f8faff 0%,#f2f6fc 100%);padding-top:90px!important}
a{color:var(--oceanic-blue)}
@media(max-width:780px){
  html,body,#root{min-width:0;overflow-x:hidden}
  .styles_C6Q6h{height:auto;min-height:100vh;padding:76px 14px 34px!important}
  .styles_svCqL{max-width:none!important;width:100%!important;padding:28px 20px!important;border-radius:22px!important}
  .styles_svCqL .styles_jtj4j{margin-bottom:24px}
  .styles_svCqL .styles_jtj4j .styles_jy-13{font-size:26px!important}
  .styles_BThpo{width:100%!important;max-width:none!important}
  .styles_J2CiH{padding:12px 14px!important;min-height:58px}
  .styles_EGZ2t{font-size:17px!important}
  .styles_nc5o2{padding:70px 12px 26px!important}
  .styles_nc5o2 a{min-height:44px!important;padding:11px 14px!important}
  .styles_55LaC{padding:0 4px 70px!important}
  .styles_LiftA{height:auto!important;min-height:170px!important;padding:16px!important}
  .styles_hX1su .styles_-0DSw,.styles_hX1su .styles_2lu1I{padding:16px!important}
  .ant-card{margin-bottom:12px}
  .ant-modal{max-width:calc(100vw - 24px)!important;margin:12px auto!important}
  .ant-modal-content{border-radius:18px!important}
  .ant-table-wrapper{max-width:100%;overflow-x:auto}
  .ant-table{min-width:620px}
  .ant-btn{min-height:42px}
  .ant-input,.ant-input-affix-wrapper,.ant-select-selector{min-height:46px!important}
}
@media(min-width:781px){
  .styles_Csf-O{background:var(--oceanic-bg)}
}
/* ===== Safe node status alignment: compact single-row card ===== */
.styles_LiftA.oceanic-node-card{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  padding:12px 14px!important;
  margin-bottom:8px!important;
  overflow:hidden!important;
}
.styles_LiftA.oceanic-node-card .styles_WebSX{
  width:auto!important;
  flex:1 1 auto!important;
  min-width:0!important;
  background:transparent!important;
  padding:0!important;
  opacity:1!important;
  display:flex!important;
  align-items:center!important;
}
.styles_LiftA.oceanic-node-card .oceanic-node-name{
  font-size:14px!important;
  font-weight:600!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.styles_LiftA.oceanic-node-card .styles_s97Of{
  width:auto!important;
  flex:0 0 auto!important;
  order:2!important;
  white-space:nowrap!important;
}
.styles_LiftA.oceanic-node-card .oceanic-node-online{
  white-space:nowrap!important;
  font-size:12px!important;
}
.styles_LiftA.oceanic-node-card .oceanic-node-latency{
  order:3!important;
  flex:0 0 auto!important;
  margin-left:4px!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
  font-size:12px!important;
  color:#687284!important;
}
.styles_LiftA.oceanic-node-card .oceanic-node-latency::after{
  content:none!important;
}

/* ===== Mobile bottom quick navigation ===== */
.oceanic-bottom-nav{display:none}
@media(max-width:780px){
  .oceanic-bottom-nav{
    position:fixed;left:0;right:0;bottom:0;z-index:99999;
    display:grid;grid-template-columns:repeat(5,1fr);
    height:70px;padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    box-sizing:content-box;background:rgba(255,255,255,.98);
    border-top:1px solid rgba(31,55,90,.10);
    box-shadow:0 -6px 24px rgba(31,55,90,.08);
    backdrop-filter:blur(16px);
  }
  .oceanic-bottom-item{
    min-width:0;border:0!important;background:transparent!important;
    color:#687284!important;text-decoration:none!important;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:4px;padding:3px 2px!important;border-radius:12px!important;
    font-size:11px!important;font-weight:500!important;line-height:1.1!important;
    box-shadow:none!important;
  }
  .oceanic-bottom-item svg{width:23px;height:23px;stroke:currentColor;fill:none}
  .oceanic-bottom-item.is-active{color:#2563eb!important;font-weight:600!important}
  .oceanic-bottom-icon{font-size:22px;line-height:23px;height:23px}
  body.oceanic-has-bottom-nav{padding-bottom:calc(82px + env(safe-area-inset-bottom))!important}
  body.oceanic-has-bottom-nav #root{padding-bottom:12px}
}
