:root{
  --card:#0d1724cc;
  --text:#d7f6ff;
  --muted:#8b949e;
  --green:#22c55e;
  --orange:#f59e0b;
  --blue:#38bdf8;
  --red:#ef4444;
  --gray:#94a3b8;
  --line:#1d3347;
  --input-bg:#080e14;
  --input-border:#29445f;
  --panel-bg:#0a121b;
  --panel-bg-alt:#08111acc;
  --card-border:#1a3044;
}

*{box-sizing:border-box}
html,body{min-height:100%;margin:0;padding:0}
body{
      background: #0e1826;
  color:var(--muted);
  font:16px/1.45 monospace;
  position:relative;
  overflow-x:hidden;
}

h1,h2,h3,h4{margin:0 0 10px}
h1{color:var(--muted);font-weight:400}

.container,
.card{
  background:var(--card);
  backdrop-filter:blur(10px);
  /*border:1px solid var(--card-border);
  border-radius:5px;*/
}
.container{
  max-width:1450px;
  margin:0 auto 16px;
  padding:3px;
}
.card{padding:16px;margin-bottom:16px}

.row,
.tabs,
.subtabs,
.status-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
}
.tabs,.subtabs{gap:10px}
.status-row{gap:8px;margin-bottom:12px}

.muted{color:var(--muted)}
.empty{padding:10px 0;color:#7fa4b4}
.error{border-color:#5b2020;color:#ffd7d7;background:#261112}
.hidden,
.hidden-by-filter,
.day-panel,
.subpanel,
.line-body{display:none!important}
.day-panel.active,
.subpanel.active,
.line.open>.line-body{display:block!important}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: var(--accent);
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.button:hover {
    background: var(--accent-dark);
}

.button-secondary {
    background: #e5e7eb;
    color: var(--text);
}

.button-secondary:hover {
    background: #d1d5db;
}

.button-small {
    min-height: 32px;
    padding: 0 12px;
    font-size: 13px;
}



button,
.btn-file{
  display:inline-block;
    padding: 5px 5px;
  border:0;
  border-radius:4px;
  background:#8b949e;
  color:#000;
  font:600 16px/1 monospace;
  cursor:pointer;
  transition:all .2s ease;
  box-shadow:none;
  text-decoration:none;
}
button:active,
.btn-file:active{transform:translateY(0)}
button:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:#8b949e;color:#000}
.btn-file:hover,
.btn-primary:hover{background:#9ca3af;transform:translateY(-1px)}
.copy-notes-btn{font-size:14px}
.copy-green{background:#16a34a;color:#fff;border-color:#15803d}
.copy-green:hover{filter:brightness(.95)}
button.copy-btn.copy-notes-btn{background:red;padding: 5px 5px;}

input[type="number"],
input[type="text"],
textarea{
  background:var(--input-bg);
  border:1px solid var(--input-border);
  color:var(--text);
  border-radius:4px;
  padding:10px 12px;
  outline:none;
  
}
input[type="file"]{max-width:440px}
input:focus,
textarea:focus{border-color:#67e8f9;box-shadow:0 0 0 3px rgba(103,232,249,.12)}

#app{padding:0px}


.tab,
.subtab{
  margin:5px 0;
  padding:5px;
  border:1px solid #27455f;
  border-radius:4px;
  background:#0b1621;
  color:#9fdfff;
  cursor:pointer;
}
.tab.active, .subtab.active {
    background: #19375d;
}

.badge,
.status-chip{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  font-size:12px;
}
.badge{
  padding:4px 9px;
  background:#0d2232;
  border:1px solid #27445e;
}
.status-chip{
  gap:6px;
  padding:4px 10px;
  border:1px solid color-mix(in srgb,var(--status-color) 55%,#0b1621);
  background:color-mix(in srgb,var(--status-color) 16%,#0b1621);
  color:#fff;
  line-height:1;
  text-shadow:#000 0 0 2px;
}

.day-layout{display:flex;/*align-items:flex-start;*/gap:20px}
.stats-col{flex:1 1 auto;min-width:0}
.notes-col{flex:0 0 30%;max-width:30%;min-width:280px}
.notes-card{position:sticky;top:16px}
.notes-area{
  width:100%;
  min-height:70vh;
  padding:12px;
  border:1px solid #d1d5db;
  border-radius:10px;
  font:inherit;
  font-size:11px;
  line-height:1.45;
  resize:vertical;
}

.search-box{margin-bottom:12px}
.line,
.cidr-line{
  overflow:hidden;
  border:1px solid #1f3346;
  border-radius:5px;
  background:var(--panel-bg);
  margin-bottom:12px;
}
.line-head,.cidr-head{padding:5px 15px;cursor:pointer}
.line-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.title-with-copy{display:inline-flex;align-items:center;flex-wrap:wrap;gap:8px}
.title-text{
  color:#fff;
  font-size:20px;
  font-weight:400;
  word-break:break-word;
  text-shadow:#000 0 0 7px;
}
.line-meta{
  margin-top:8px;
  color:#eefcff;
  font-size:15px;
  text-align:right;
  text-shadow:#000 0 0 2px;
}
.line-meta span{padding-left:15px}
.line-body{padding:14px;background:var(--panel-bg-alt);border-top:1px solid var(--line)}
.list{display:grid;gap:7px;list-style:none;margin:0;padding:0}
.list li{
  display:grid;
  grid-template-columns:70px 1fr;
  gap:10px;
  align-items:start;
  padding:6px 0;
  border-bottom:1px dashed #183047;
}
.list li:last-child{border-bottom:0}

.cidr-activity-card{position:relative;padding:5px 15px}
.cidr-activity-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.cidr-activity-title{font-weight:600}
.cidr-activity-note,
.cidr-activity-axis,
.cidr-activity-xlab{color:#6b7280}
.cidr-activity-note{font-size:12px;white-space:nowrap}
.cidr-activity-legend,
.cidr-activity-axis{display:flex;gap:8px 12px;font-size:11px}
.cidr-activity-legend{flex-wrap:wrap;margin:4px 0 8px;color:#4b5563}
.cidr-activity-axis{justify-content:space-between;margin-top:6px}
.cidr-activity-legend-item{display:inline-flex;align-items:center;gap:6px}
.cidr-activity-legend-swatch{display:inline-block;width:10px;height:2px;border-radius:999px}
.cidr-activity-chart-wrap,
.cidr-activity-chart{position:relative}
.cidr-activity-chart{
  display:flex;
  align-items:flex-end;
  width:100%;
  height:100px;
  gap:2px;
  padding:0 25px 15px;
  overflow:hidden;
}
.cidr-activity-grid-line{position:absolute;left:8px;right:8px;background:#e5e7eb}
.cidr-activity-col{
  position:relative;
  display:flex;
  flex:1 1 0;
  align-items:flex-end;
  justify-content:center;
  min-width:8px;
  height:100%;
  cursor:crosshair;
}
.cidr-activity-col:hover{background:rgba(148,163,184,.08)}
.cidr-activity-stack{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  width:min(24px,100%);
  height:100%;
  overflow:hidden;
  border-radius:6px 6px 0 0;
}
.cidr-activity-stack-empty{opacity:.35}
.cidr-activity-bar{display:block;width:100%}
.cidr-activity-xlab{
  position:absolute;
  left:50%;
  bottom:-14px;
  transform:translateX(-50%);
  font-size:10px;
  line-height:1;
  white-space:nowrap;
}
.cidr-activity-tooltip{
  position:absolute;
  z-index:5;
  display:none;
  min-width:180px;
  max-width:240px;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(17,24,39,.94);
  color:#fff;
  font-size:12px;
  line-height:1.35;
  pointer-events:none;
  box-shadow:0 10px 30px rgba(0,0,0,.22);
}
.cidr-activity-tooltip-title{font-weight:700;margin-bottom:4px}
.cidr-activity-tooltip-row{display:flex;justify-content:space-between;gap:12px}
.cidr-activity-tooltip-dot{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:999px}
.cidr-activity-legend-s200,.cidr-activity-tooltip-dot-s200,.cidr-activity-bar-s200{background:var(--green)}
.cidr-activity-legend-s301,.cidr-activity-tooltip-dot-s301,.cidr-activity-bar-s301{background:var(--orange)}
.cidr-activity-legend-s403,.cidr-activity-tooltip-dot-s403,.cidr-activity-bar-s403{background:var(--red)}
.cidr-activity-legend-s404,.cidr-activity-tooltip-dot-s404,.cidr-activity-bar-s404{background:var(--blue)}
.cidr-activity-legend-sother,.cidr-activity-tooltip-dot-sother,.cidr-activity-bar-sother{background:var(--gray)}

@media (max-width:900px){
  .day-layout{flex-direction:column}
  .notes-col{flex:1 1 auto;max-width:none;min-width:0;width:100%}
  .notes-card{position:static}
  .notes-area{min-height:240px}
}


.topbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    background: var(--card);
    border: none;
    border-radius: 4px;
    padding: 5px 10px;
    margin-bottom: 18px;
}

.topbar-left,
.topbar-nav,
.user-box {
    display: flex;
    align-items: center;
    gap: 12px;
}

.brand {
    font-size: 25px;
    font-weight: 700;
    color: var(--text);
    text-decoration: none;
}

.topbar-nav a {
    color: var(--accent);
    text-decoration: none;
    font-weight: 600;
}

.user-box {
    margin-left: auto;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
        background: #152234;
}

.user-box-text {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.25;
}

.user-box-text span {
    color: var(--muted);
    font-size: 13px;
}

.card,
.hero-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 18px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
}

.narrow-card {
    max-width: 560px;
    margin: 0 auto;
    padding: 40px;
}

.hero-card {
   /* max-width: 720px;*/
    text-align: center;
    margin: 20px auto 20px;
}

.topbar-left.main .brand {
    font-size: 70px;
}


.hero-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
	
    margin-bottom: 50px;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: var(--accent);
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.button:hover {
    background: var(--accent-dark);
}

.button-secondary {
       background: #0d1724cc;
    color: var(--text);
}

.button-secondary:hover {
       background: #606a77bf;
}

.button-small {
    min-height: 32px;
    padding: 0 12px;
    font-size: 13px;
}

.form-grid,
.invite-form {
    display: grid;
    gap: 14px;
}

label span {
    display: block;
    font-weight: 700;
    margin-bottom: 6px;
}

input,
select,
textarea {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #080e14;
    color: var(--text);
}

small,
.note,
.form-link {
    color: var(--muted);
}

.form-link {
    margin-top: 14px;
}

.flash {
    margin-bottom: 18px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid transparent;
}

.flash-success {
    background: #3e9763;
    border-color: #3e9763;
    color: #fff;
}

.flash-error {
    background: #fef2f2;
    border-color: #fecaca;
    color: var(--danger);
}

.script-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
}

.script-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: #152234;
    color: var(--text);
    text-decoration: none;
}

.script-card span {
    color: var(--muted);
}

.table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 14px;
}

.table th,
.table td {
    border-bottom: 1px solid var(--line);
    padding: 10px 8px;
    text-align: left;
    vertical-align: top;
}

.inline-form {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.badge {
    display: inline-block;
    padding: 5px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
}

.badge-admin {
    background: #ede9fe;
    color: #6d28d9;
}

.badge-green {
    background: #dcfce7;
    color: #166534;
}

.badge-red {
    background: #fee2e2;
    color: #991b1b;
}

.badge-gray {
    background: #e5e7eb;
    color: #374151;
}

.code-block {
    overflow-x: auto;
    background: #0f172a;
    color: #e2e8f0;
    padding: 16px;
    border-radius: 12px;
}

code {
    font-family: Consolas, Monaco, monospace;
}

@media (max-width: 820px) {
    .topbar {
        align-items: stretch;
    }

    .topbar-nav,
    .user-box {
        width: 100%;
        justify-content: space-between;
    }

    .user-box-text {
        align-items: flex-start;
    }

    .table,
    .table thead,
    .table tbody,
    .table tr,
    .table th,
    .table td {
        display: block;
    }

    .table thead {
        display: none;
    }

    .table tr {
        border: 1px solid var(--line);
        border-radius: 12px;
        margin-bottom: 10px;
        padding: 10px;
    }

    .table td {
        border-bottom: 0;
        padding: 6px 0;
    }
}


button.button {
    background: #17304f;
}

a {
    color: #ddd;
}

.flash-error {
    background: #e73131;
    border-color: #650808;
    color: #000;
}

span#progressStatus {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
}

input#topAsn {
    width: 100px;
}

input#tailLines {
    width: 170px;
}

input#logFormat {
    width: 650px;
}

.row.top.format .muted {
    font-size: 13px;
}

.row.top.format {
    background: #000000;
    padding: 12px;
    border-radius: 4px;
    margin-bottom: 15px;
}

.row.top {
    padding-bottom: 20px;
}

.btn-primary {
    background: #99c9ff;
    color: #000;
}

#uploadBtn {
    background: #99c9ff;
    color: #000;
    padding: 10px;
}

label.btn-file {
    padding: 10px;
}

tbody.admtab select {
    width: 170px;
}


a.btn-primary.saved-open-link {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    padding: 5px;
    border-radius: 4px;
}


.muted.mini {
    font-size: 11px;
}



label.mutedmini input[type="checkbox"] {
    width: auto;
	    min-height: auto;
}


.three-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

/* адаптив */
@media (max-width: 1000px) {
    .three-columns {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .three-columns {
        grid-template-columns: 1fr;
    }
}


textarea#whitelist, textarea#blacklist, textarea#result {
    height: 500px;
}

        .stat .label { font-size: 12px; color: #9ca3af; margin-bottom: 6px; }
        .stat .value { font-size: 18px; font-weight: 700; color: #f3f4f6; }
        .progress-wrap { margin: 12px 0 18px; background: #252a31; border: 1px solid #32363c; border-radius: 999px; height: 20px; overflow: hidden; }
        .progress-bar { height: 100%; width: 0%; background: linear-gradient(90deg, #6b7280, #9ca3af); transition: width .2s ease; }
        .progress-text { margin-top: 8px; font-size: 14px; color: #cbd5e1; }
		
		
		
		
        .stats { display: flex; gap: 10px; flex-wrap: wrap; margin: 8px 0 16px; }
        .stat {
    background: #1c2127;
    border: 1px solid #32363c;
    border-radius: 10px;
    padding: 10px 14px;
    min-width: 180px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
}

label.mutedmini.lr input#prefixAllow {
margin: 0px 30px 0px 0px;
}

button.btn-primary {
    padding: 10px;
    border-radius: 4px;
}

.hero-actions .button {
    background: #173b51;
}

header.topbar.main {
    display: block;
    text-align: center;
}

.topbar-left.main {
    display: block;
}


header.topbar.main {
    padding-top: 20px;
}


span.fir {
    color: #c92727;
}

span.dou {
    color: #bbbbbb;
}