/* TXCyber Attacks. Builds on the theme tokens and .txa-* components. */

.atk-page{--c-deep:#b98cff;--c-shell:var(--alert,#ff4b3a);--c-web:var(--amber,#ffb000);--c-svc:var(--jade,#54d1a0);--c-scan:var(--paper,#e7ddcb)}
.atk-page .cat-shell{--c:var(--c-shell)}
.atk-page .cat-web{--c:var(--c-web)}
.atk-page .cat-svc{--c:var(--c-svc)}
.atk-page .cat-scan{--c:var(--c-scan)}
.atk-page .cat-deep{--c:var(--c-deep)}

/* status bar */
.atk-status{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin:30px 0 28px;padding:11px 16px;
  background:rgba(16,14,9,.86);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  border:1px solid var(--rule);font-family:var(--mono);font-size:12.5px;color:var(--muted);
  box-shadow:0 0 0 1px rgba(255,76,58,.06),0 18px 50px -36px rgba(255,76,58,.4)}
.atk-status>span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:0 14px;border-left:1px solid var(--rule)}
.atk-status>span:first-child{border-left:0}
.atk-status>span:first-child{padding-left:0}
.atk-status b{color:var(--paper);font-weight:500}
.atk-st-word{color:var(--jade);font-weight:700;letter-spacing:.04em}
.atk-st-word.is-stale{color:var(--amber)}
.atk-st-word.is-off{color:var(--muted)}
.atk-led{width:8px;height:8px;border-radius:50%;padding:0!important;border:0!important;flex:none}
.atk-led.is-live{background:var(--alert);box-shadow:0 0 10px var(--alert);animation:atkpulse 1.2s ease-in-out infinite}
.atk-led.is-stale{background:var(--amber)}
.atk-led.is-off{background:var(--muted)}
.atk-next{color:var(--amber-dim)}
.atk-status.is-busy .atk-led{animation-duration:.35s}

/* map */
.atk-map{margin:0 0 24px;overflow:hidden}
.atk-map::before,.atk-map::after{content:"";position:absolute;width:14px;height:14px;border:1px solid rgba(255,176,0,.7);pointer-events:none;z-index:2}
.atk-map::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.atk-map::after{right:-1px;bottom:-1px;border-left:0;border-top:0}
.atk-map-wrap{position:relative;padding:10px 12px 4px;background:radial-gradient(ellipse at 50% 60%,rgba(255,176,0,.05),transparent 70%)}
.atk-map-cv{display:block;width:100%;height:auto}
.atk-map-wrap::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.018) 0 1px,transparent 1px 3px)}
.atk-map-now{position:absolute;left:16px;bottom:10px;margin:0;max-width:calc(100% - 32px);padding:5px 10px;font-family:var(--mono);font-size:11.5px;color:var(--paper);
  background:rgba(8,7,5,.82);border:1px solid var(--rule);border-left:2px solid var(--alert);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .4s}
.atk-map-now.is-deep{border-left-color:var(--c-deep);color:var(--c-deep);box-shadow:0 0 18px -4px rgba(185,140,255,.6)}
.atk-map-now.is-on{opacity:1;animation:atkticker .5s ease-out}
.atk-map-now:empty,.atk-map-now-t:empty{display:none}
.atk-map-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin:0;padding:8px 16px 12px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.atk-map-legend span[class^="cat-"]::before{content:"";display:inline-block;width:14px;height:2px;margin-right:7px;background:var(--c);box-shadow:0 0 6px var(--c);vertical-align:3px}
.atk-map-fine{flex:1 1 320px;font-family:var(--sans);font-size:11.5px;text-align:right}
.atk-page .cat-scan{--c:var(--c-scan)}

/* first-load motion */
.atk-ready .atk-bar-f{animation:atkgrow .9s cubic-bezier(.2,.7,.2,1) both}
.atk-ready .atk-hr{animation:atkrise .8s cubic-bezier(.2,.7,.2,1) both}
.atk-ready .atk-hr:nth-child(4n+1){animation-delay:.05s}.atk-ready .atk-hr:nth-child(4n+2){animation-delay:.1s}.atk-ready .atk-hr:nth-child(4n+3){animation-delay:.15s}
.atk-ready .atk-ev{animation:atkin .45s ease-out both}
.atk-ready .atk-ev:nth-child(2){animation-delay:.04s}.atk-ready .atk-ev:nth-child(3){animation-delay:.08s}.atk-ready .atk-ev:nth-child(4){animation-delay:.12s}.atk-ready .atk-ev:nth-child(5){animation-delay:.16s}.atk-ready .atk-ev:nth-child(n+6){animation-delay:.2s}
.atk-ready .atk-ev.is-new{animation:atknew 2.6s ease-out 1 both}

/* interactive decoys */
.atk-ev.cat-deep{background:linear-gradient(90deg,rgba(185,140,255,.10),transparent 60%)}
.atk-ev.cat-deep .atk-svc{font-weight:700;text-shadow:0 0 8px rgba(185,140,255,.55)}
.atk-lab em.atk-tag-deep,.atk-tag-deep{color:var(--c-deep);border-color:rgba(185,140,255,.55)}
.atk-lab em.atk-tag-in,.atk-tag-in{font-style:normal;font-size:10.5px;padding:1px 6px;color:#080705;background:var(--alert,#ff4b3a);border:1px solid var(--alert,#ff4b3a);white-space:nowrap;animation:atkpulse 1.4s ease-in-out infinite}
.atk-st-deep b{color:var(--c-deep)!important}
.atk-deep{border-color:rgba(185,140,255,.35);box-shadow:0 0 0 1px rgba(185,140,255,.08),0 24px 60px -40px rgba(185,140,255,.5)}
.atk-deep h2{color:var(--c-deep)}
.atk-deep-sub{float:right;color:var(--muted);font-size:10.5px}
.atk-deep-what{margin:0;padding:8px 16px 0;font-size:11.5px;color:var(--muted);font-family:var(--sans)}
.atk-deep-list{list-style:none;margin:0;padding:6px 16px 10px;font-family:var(--mono);font-size:12px;max-height:260px;overflow:auto}
.atk-deep-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 10px;padding:6px 0 6px 10px;border-left:2px solid var(--c-deep);margin:4px 0;background:rgba(185,140,255,.05)}
.atk-deep-row time{color:var(--muted);font-size:11px}
.atk-deep-row .atk-ip{grid-column:2}
.atk-deep-row .atk-svc{grid-column:3;color:var(--c-deep);text-align:right}
.atk-deep-row .atk-loc{grid-column:1 / 3;font-size:11.5px}
.atk-deep-row .atk-tag-in{grid-column:3;justify-self:end}
.atk-deep-row.is-in{border-left-color:var(--alert)}
.atk-deep .atk-empty{padding:10px 0}

/* layout */
.atk-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(280px,1fr);gap:24px;align-items:stretch}
.atk-side{align-content:start}
/* log panel runs the full height of the right column and scrolls inside */
.atk-feed{display:flex;flex-direction:column}
.atk-log-box{position:relative;flex:1 1 auto;min-height:420px}
.atk-log-box .atk-log{position:absolute;inset:0;max-height:none}
.atk-side{display:grid;gap:24px;min-width:0}
.atk-panel{position:relative;min-width:0;background:rgba(16,14,9,.88);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  border:1px solid var(--rule);box-shadow:0 0 0 1px rgba(255,176,0,.04),0 24px 60px -40px rgba(255,176,0,.25)}
.atk-panel h2{margin:0;padding:10px 16px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:12px;font-weight:500;color:var(--amber);letter-spacing:.03em;overflow-wrap:anywhere}
.atk-feed::before,.atk-feed::after{content:"";position:absolute;width:14px;height:14px;border:1px solid rgba(255,76,58,.7);pointer-events:none}
.atk-feed::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.atk-feed::after{right:-1px;bottom:-1px;border-left:0;border-top:0}

/* live log */
.atk-cols,.atk-ev{display:grid;grid-template-columns:96px minmax(118px,1.1fr) minmax(90px,.9fr) minmax(80px,1fr) minmax(0,.9fr);gap:12px;align-items:baseline}
.atk-cols{padding:8px 16px;border-bottom:1px solid var(--rule);font-family:var(--mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.atk-log{list-style:none;margin:0;padding:4px 0;overflow:auto;overscroll-behavior:contain;font-family:var(--mono);font-size:12.5px;scrollbar-color:var(--rule) transparent}
.atk-ev{position:relative;padding:6px 16px 6px 13px;border-left:3px solid var(--c);color:var(--paper)}
.atk-ev+.atk-ev{border-top:1px solid rgba(44,37,23,.55)}
.atk-ev:hover{background:rgba(255,176,0,.05)}
.atk-t{color:var(--muted);white-space:nowrap}
.atk-ip{color:var(--paper);overflow-wrap:anywhere}
.atk-svc{color:var(--c);overflow-wrap:anywhere}
.atk-svc i{font-style:normal;color:var(--muted);white-space:nowrap}
.atk-ev.is-group .atk-svc i:first-of-type{color:var(--paper)}
.atk-svc i.atk-more{color:var(--amber-dim);font-size:11px}
.atk-ev.is-bump .atk-svc i:first-of-type{animation:atkbump 1.4s ease-out}
@keyframes atkbump{0%{color:var(--alert);text-shadow:0 0 8px rgba(255,76,58,.8)}100%{}}
.atk-loc{color:var(--muted);font-family:var(--sans);font-size:12px;overflow-wrap:anywhere}
.atk-lab{display:flex;flex-wrap:wrap;gap:4px}
.atk-lab em{font-style:normal;font-size:10.5px;padding:1px 6px;border:1px solid var(--rule);color:var(--amber-dim);white-space:nowrap}
.atk-empty{padding:18px 16px;color:var(--muted);font-family:var(--mono);font-size:12.5px;list-style:none}
.atk-ev.is-new{animation:atknew 2.6s ease-out 1 both}
.atk-ev.is-new::after{content:"new";position:absolute;right:10px;top:7px;font-size:9.5px;letter-spacing:.1em;color:var(--alert);text-transform:uppercase;animation:atkfade 6s ease-out 1 both}

/* hours */
.atk-hours{display:flex;align-items:flex-end;gap:2px;height:74px;padding:14px 16px 0}
.atk-hr{flex:1 1 0;height:var(--h);min-height:2px;background:linear-gradient(to top,rgba(255,76,58,.85),rgba(255,176,0,.75));opacity:.85;transition:height .5s ease}
.atk-hr.is-zero{background:var(--rule)}
.atk-hr:last-child{box-shadow:0 0 8px rgba(255,76,58,.6)}
.atk-axis{display:flex;justify-content:space-between;margin:0;padding:6px 16px 10px;font-family:var(--mono);font-size:10.5px;color:var(--muted)}

/* bars */
.atk-bars,.atk-top{list-style:none;margin:0;padding:8px 16px 12px;font-family:var(--mono);font-size:12px}
.atk-bar{position:relative;display:flex;justify-content:space-between;gap:10px;padding:5px 0 7px;color:var(--paper)}
.atk-bar-k{overflow-wrap:anywhere;min-width:0}
.atk-bar-n{color:var(--muted);flex:none;text-align:right}
.atk-bar-f{position:absolute;left:0;bottom:2px;height:2px;width:var(--w);background:var(--c,var(--amber-dim));opacity:.85;transition:width .5s ease}
.atk-bar.cat-shell .atk-bar-k,.atk-bar.cat-web .atk-bar-k,.atk-bar.cat-svc .atk-bar-k{color:var(--c)}
.atk-top li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 6ch;gap:10px;padding:5px 0;border-bottom:1px solid rgba(44,37,23,.55)}
.atk-top li:last-child{border-bottom:0}
.atk-top .atk-empty{display:block;padding:10px 0}
.atk-key{display:flex;flex-wrap:wrap;gap:4px 14px;margin:0;padding:0 16px 12px;font-family:var(--mono);font-size:10.5px;color:var(--muted)}
.atk-key span::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;background:var(--c);vertical-align:-1px}

.atk-note{margin:14px 0 0;font-family:var(--mono);font-size:11.5px;color:var(--muted);min-height:1em}
.atk-about{margin-top:34px;padding:18px 20px 6px;background:rgba(16,14,9,.86);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border:1px solid var(--rule)}
.atk-about h2{margin:0 0 12px;font-family:var(--mono);font-size:12.5px;font-weight:500;color:var(--amber)}
.atk-about ul{margin:0;padding:0 0 0 18px;color:var(--paper);font-size:14.5px;line-height:1.6}
.atk-about li{margin:0 0 10px}
.atk-about strong{color:var(--amber)}

@keyframes atkpulse{50%{opacity:.35}}
@keyframes atkgrow{from{width:0}}
@keyframes atkrise{from{height:0}}
@keyframes atkin{from{opacity:0;transform:translateX(-8px)}}
@keyframes atkticker{from{transform:translateY(6px);opacity:0}}
@keyframes atknew{0%{background:rgba(255,76,58,.28);box-shadow:inset 0 0 0 1px rgba(255,76,58,.5)}100%{background:transparent;box-shadow:none}}
@keyframes atkfade{0%,70%{opacity:1}100%{opacity:0}}

@media (max-width:1000px){
  .atk-grid{grid-template-columns:minmax(0,1fr)}
  .atk-log-box{min-height:560px}
  .atk-side{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .atk-map-wrap{padding:6px 4px 2px}
  .atk-map-now{position:static;margin:6px 8px 0;max-width:none;font-size:10.5px}
  .atk-map-fine{text-align:left}
  .atk-side{grid-template-columns:minmax(0,1fr)}
  .atk-cols{display:none}
  .atk-ev{grid-template-columns:auto minmax(0,1fr) auto;gap:2px 10px;padding:8px 12px 8px 10px}
  .atk-ev .atk-t{grid-column:1;font-size:11.5px}
  .atk-ev .atk-ip{grid-column:2}
  .atk-ev .atk-svc{grid-column:3;text-align:right}
  .atk-ev .atk-loc{grid-column:1 / 3;font-size:11.5px}
  .atk-ev .atk-lab{grid-column:3;justify-content:flex-end}
  .atk-log-box{min-height:520px}
  .atk-status>span{padding:0 10px}
  .atk-status>span:nth-child(n+2){border-left:0;padding-left:0;padding-right:14px}
  .atk-ev.is-new::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  .atk-ev.is-bump .atk-svc i,.atk-tag-in,.atk-led.is-live,.atk-ev.is-new,.atk-ev.is-new::after,.atk-ready .atk-bar-f,.atk-ready .atk-hr,.atk-ready .atk-ev,.atk-map-now.is-deep{border-left-color:var(--c-deep);color:var(--c-deep);box-shadow:0 0 18px -4px rgba(185,140,255,.6)}
.atk-map-now.is-on{animation:none}
  .atk-hr,.atk-bar-f{transition:none}
}