/* SighNet theme for copyparty — files.sighnet.org
   tokens lifted from sighnet.org production CSS:
   bg #0f172a, cards #1e293b/#334155/.75rem, btn-primary #00e5ff on #0f172a,
   badges radius-full, Orbitron display headings, orange->amber brand gradient */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Orbitron:wght@600;700;800&display=swap');

/* ===== palette (copyparty vars <- SighNet tokens) ===== */
:root, html, html.a, html.az, html.ay, html.b, html.bz, html.by {
	--fg: #E2E8F0;
	--fg-max: #F8FAFC;
	--fg-weak: #94A3B8;

	--bg: #0f172a;
	--bgg: #0f172a;
	--bg-u1: #131d33;
	--bg-u2: #1e293b;
	--bg-u3: #24334c;
	--bg-u4: #2b3d59;
	--bg-u5: #334155;
	--bg-u6: #3b4d68;
	--bg-d1: #0b1322;
	--bg-d2: #091020;
	--bg-d3: #060c18;
	--bg-max: #04080f;
	--row-alt: #131d33;

	--a: #00e5ff;
	--a-b: #06b6d4;
	--a-hil: #7deeff;
	--a-dark: #06b6d4;
	--a-gray: #64748B;

	--tab-alt: #ff6b35;
	--scroll: #ff6b35;
	--sel-fg: #0f172a;
	--sel-bg: #00e5ff;

	--btn-fg: #7deeff;
	--btn-bg: rgba(0, 229, 255, 0.08);
	--btn-h-fg: #B0F1FF;
	--btn-h-bg: rgba(0, 229, 255, 0.16);
	--btn-1-fg: #0f172a;
	--btn-1-bg: #00e5ff;
	--btn-1h-fg: #0f172a;
	--btn-1h-bg: #06b6d4;

	--chk-fg: #00e5ff;

	--u2-tab-1-fg: #B0F1FF;
	--u2-tab-1-bg: linear-gradient(to bottom, #0e4a5c, var(--bg) 80%);
	--u2-tab-1-b1: #00e5ff;
	--u2-tab-1-b2: #06b6d4;
	--u2-tab-1-sh: rgba(0, 229, 255, 0.15);
	--u2-b1-bg: #ff6b35;
	--u2-b2-bg: #f7931e;
	--u2-inf-bg: #0369a1;
	--u2-inf-b1: #00e5ff;
	--u2-ok-bg: #065f46;
	--u2-ok-b1: #10b981;
	--u2-err-bg: #991b1b;
	--u2-err-b1: #ef4444;
	--u2-btn-b1: #334155;
	--u2-sbtn-b1: #00e5ff;
	--u2-txt-bg: #1e293b;

	--sort-1: #ff6b35;
	--sort-2: #f7931e;
	--sz-k: #00e5ff;
	--sz-m: #00e5ff;
	--sz-g: #7deeff;
	--sz-t: #7deeff;
	--f-play-bg: #00e5ff;
	--f-sel-sh: #00e5ff;
	--tree-bg: #131d33;
	--err-bg: #7f1d1d;
	--err-b1: #ef4444;
	--g-bg: #1e293b;
	--g-b1: #1e293b;
	--g-b2: #334155;
	--g-g1: #1e293b;
	--g-sh: rgba(0, 0, 0, 0);
}

html {
	font-family: 'Inter', -apple-system, sans-serif;
	background: var(--bg);
}

h1, h2, #acc_info {
	font-family: 'Orbitron', 'Courier New', monospace;
	letter-spacing: -0.02em;
}

/* ===== declutter ===== */
#tree,
#path,
#widget,
#repl,
#wfp,
#u2ts,
#ops a[data-dest="search"],
#ops a[data-dest="player"],
#ops a[data-dest="msg"],
#ops a[data-dest="cfg"],
#ops a[data-dest="bup"],
#ops a[data-dest="mkdir"],
#ops a[data-dest="new_md"],
#ops a[data-dest="unpost"] {
	display: none !important;
}

/* ===== page frame ===== */
#wrap {
	max-width: 78rem;
	margin-left: auto !important;
	margin-right: auto !important;
	overflow-x: clip;
}

/* top bar — SighNet navbar (translucent slate + blur) */
#ops {
	background: rgba(15, 23, 42, 0.92);
	backdrop-filter: blur(24px);
	border-bottom: 1px solid #1e293b;
}
#ops a[data-dest="up2k"] {
	font-size: 0 !important;
}
#ops a[data-dest="up2k"]::after {
	content: "UPLOAD";
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}
#acc_info {
	font-size: 0.8rem;
	color: #94A3B8;
}
#acc_info #blogout {
	background: transparent;
	border: 1px solid #334155;
	border-radius: 0.375rem;
	color: #E2E8F0;
	font-family: 'Inter', sans-serif;
	font-size: 0.8rem;
	font-weight: 500;
	padding: 0.35rem 0.9rem;
}
#acc_info #blogout:hover {
	border-color: #00e5ff;
	color: #00e5ff;
}

/* ===== uploader widget = SighNet .card ===== */
#u2conf {
	position: relative;
	margin: 1.5rem auto 0 auto !important;
	background: #1e293b !important;
	border: 1px solid #334155;
	border-radius: 0.75rem;
	padding: 1.25rem 1.5rem;
	overflow: visible;
}
#u2conf:before {
	content: "";
	position: absolute;
	top: -1px;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, #00e5ff, #6366f1);
	opacity: 0;
	transition: opacity 0.2s ease;
	border-radius: 0.75rem 0.75rem 0 0;
}
#u2conf:hover:before {
	opacity: 1;
}
#u2conf td {
	padding: 0.35rem 0.5rem;
	white-space: nowrap;
}
#u2conf.ww {
	width: 100%;
	max-width: 62rem;
}
#u2conf.w {
	width: 100%;
	max-width: 42rem;
}
#u2etaw {
	margin: 1rem auto;
}
#u2etaw.w {
	text-align: center;
	margin: -1rem auto 2rem auto;
}
#u2etaw.w #u2etas {
	margin-right: -37em;
}
#u2etaw.ww {
	margin: -0.5rem auto;
}
#u2etaw.ww #u2etas {
	padding-left: 4em;
}
#u2etas {
	background: none !important;
	border: none !important;
	color: #94A3B8;
	font-size: 0.85rem;
}
#u2etas span {
	color: #E2E8F0;
}

/* ===== toggle chips = SighNet segmented tabs ===== */
#u2conf label[for="multitask"],
#u2conf label[for="potato"],
#u2conf label[for="u2rand"],
#u2conf label[for="u2ow"],
#u2conf label[for="fsearch"] {
	font-size: 0 !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 2.1rem;
	padding: 0 0.85rem;
	margin: 0.1rem;
	background: #0f172a;
	border: 1px solid #334155;
	border-radius: 0.375rem;
	color: #94A3B8;
	cursor: pointer;
	transition: all 0.15s ease;
}

#u2conf label[for="multitask"]::after {
	content: "Multitask";
	font-size: 0.78rem;
	font-weight: 500;
}
#u2conf label[for="potato"]::after {
	content: "Lite mode";
	font-size: 0.78rem;
	font-weight: 500;
}
#u2conf label[for="u2rand"]::after {
	content: "Random name";
	font-size: 0.78rem;
	font-weight: 500;
}
#u2conf label[for="u2ow"]::after {
	content: "Overwrite";
	font-size: 0.78rem;
	font-weight: 500;
}
#u2conf label[for="fsearch"]::after {
	content: "Search";
	font-size: 0.78rem;
	font-weight: 500;
}

#u2conf label:hover {
	border-color: #00e5ff;
	color: #B0F1FF;
}
#u2conf input:checked + label {
	border-color: #00e5ff;
	background: rgba(0, 229, 255, 0.10);
	color: #00e5ff;
	font-weight: 600;
}

/* parallel-uploads stepper (admin view) */
#nthread {
	background: #0f172a !important;
	border: 1px solid #334155 !important;
	border-radius: 0.375rem;
	color: #E2E8F0 !important;
	text-align: center;
	width: 3.5em;
}
#nthread_sub, #nthread_add {
	color: #00e5ff !important;
	font-weight: 700;
	padding: 0.2em 0.55em;
}

/* ===== the drop target = .btn.btn-primary ===== */
#u2btn_ct {
	text-align: center;
	margin: 1.1rem 0 0.4rem 0;
}
html #u2btn {
	display: inline-block;
	padding: 0.85rem 2.2rem;
	border: 1px solid #00e5ff;
	border-radius: 0.375rem;
	background-color: #00e5ff;
	color: #0f172a;
	font-family: 'Inter', sans-serif;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.45;
	letter-spacing: 0;
	cursor: pointer;
	transition: all 0.15s ease;
	outline: none;
	box-shadow: 0 0 20px rgba(0, 229, 255, 0.15);
}
html #u2btn:hover, html #u2btn:focus {
	background-color: #06b6d4;
	border-color: #06b6d4;
	color: #0f172a;
	box-shadow: 0 0 30px rgba(0, 229, 255, 0.25);
}
#u2bm {
	display: none;
}

/* ===== status cards = SighNet .badge pills ===== */
#u2cards {
	display: flex;
	gap: 0.5rem;
	justify-content: center;
	margin: 0.9rem 0;
}
#u2cards a {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 0.25rem 0.8rem;
	border-radius: 9999px;
	border: 1px solid #334155;
	background: #16213a;
	color: #94A3B8;
	font-size: 0.78rem;
	font-weight: 500;
	transition: all 0.15s ease;
}
#u2cards a span {
	color: #E2E8F0;
	font-weight: 600;
}
#u2cards a[act="ok"] {
	background: rgba(16, 185, 129, 0.12);
	border-color: rgba(16, 185, 129, 0.4);
	color: #34d399;
}
#u2cards a[act="ok"] span {
	color: #34d399;
}
#u2cards a[act="ng"] {
	background: rgba(239, 68, 68, 0.12);
	border-color: rgba(239, 68, 68, 0.4);
	color: #f87171;
}
#u2cards a[act="ng"] span {
	color: #f87171;
}
#u2cards a[act="bz"] {
	background: rgba(255, 107, 53, 0.12);
	border-color: rgba(255, 107, 53, 0.45);
	color: #ff8a5c;
}
#u2cards a[act="bz"] span {
	color: #ff8a5c;
}
#u2cards a.act {
	border-color: #00e5ff;
	box-shadow: 0 0 10px rgba(0, 229, 255, 0.15);
}
#u2cards a.act span {
	color: #00e5ff;
}

/* ===== upload progress table ===== */
#u2tabw {
	max-width: 62rem;
	margin: 1rem auto;
}
#u2tab td, #u2tab th {
	padding: 0.45rem 0.6rem;
}
#u2tab td {
	border-bottom: 1px solid #1e293b;
}

/* ===== file browser table (admin) — centred, Hub-card framing ===== */
#files {
	width: fit-content;
	max-width: 100%;
	margin: 1.5rem auto 0 auto;
}
#files th {
	font-family: 'Orbitron', 'Courier New', monospace;
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	color: #94A3B8;
	border-bottom: 1px solid #334155;
}
#files tbody tr:hover td {
	background: rgba(0, 229, 255, 0.05);
}

/* ===== prologue hero ===== */
.logue h1 {
	font-family: 'Orbitron', 'Courier New', monospace;
	font-weight: 800;
	font-size: 2.2em;
	background: linear-gradient(135deg, #ff6b35 0%, #f7931e 55%, #00e5ff 130%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	text-align: center;
	text-shadow: none;
	margin: 0.5em 0 0.25em 0;
}

.logue p {
	text-align: center;
	color: #94A3B8;
	max-width: 38em;
	margin: 0.3em auto;
	font-size: 0.95rem;
}

/* ===== final overrides: beat copyparty's native #u2conf rules ===== */

/* slim rectangle drop button (native sets width 12em, font 1.25em, margins) */
#u2conf #u2btn {
	font-size: 0.95rem !important;
	line-height: 1.45 !important;
	padding: 0.7rem 1.9rem !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 auto !important;
	border: 1px solid #00e5ff !important;
	border-radius: 0.375rem !important;
	background-color: #00e5ff !important;
	background: #00e5ff !important;
	color: #0f172a !important;
	box-shadow: 0 0 20px rgba(0, 229, 255, 0.15) !important;
}
html.a #u2conf #u2btn,
html.az #u2conf #u2btn,
html #u2conf #u2btn {
	background: #00e5ff !important;
	color: #0f172a !important;
}
#u2conf #u2btn:hover,
html.a #u2conf #u2btn:hover {
	background-color: #06b6d4 !important;
	background: #06b6d4 !important;
	color: #0f172a !important;
	border-color: #06b6d4 !important;
	box-shadow: 0 0 30px rgba(0, 229, 255, 0.25) !important;
}

/* toggle chips: defeat native .c label sizing (2em squares) and checked styling */
#u2conf td.c {
	width: auto !important;
}
#u2conf .c label[for] {
	display: inline-flex !important;
	width: auto !important;
	min-width: 6.8em !important;
	height: 2.1rem !important;
	padding: 0 0.85rem !important;
	margin: 0.1rem !important;
	font-size: 0 !important;
	line-height: 1.4 !important;
	background: #0f172a !important;
	border: 1px solid #334155 !important;
	border-radius: 0.375rem !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #94A3B8 !important;
	white-space: nowrap;
}
#u2conf .c label[for]::after {
	font-family: 'Inter', sans-serif;
	font-size: 0.78rem;
	font-weight: 500;
}
#u2conf .c label[for]:hover {
	border-color: #00e5ff !important;
	background: #0f172a !important;
	color: #B0F1FF !important;
}
#u2conf input[type="checkbox"] {
	position: absolute !important;
	opacity: 0 !important;
	top: 0 !important;
	width: 1px;
	height: 1px;
}
#u2conf input[type="checkbox"]:checked + label[for] {
	background: rgba(0, 229, 255, 0.10) !important;
	border-color: #00e5ff !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #00e5ff !important;
}
#u2conf input[type="checkbox"]:checked + label[for]::after {
	font-weight: 600;
}

/* stepper -/+ : ghost buttons instead of orange squares */
#u2conf a.b {
	background: transparent !important;
	border: 1px solid #334155 !important;
	border-radius: 0.375rem !important;
	color: #00e5ff !important;
	font-size: 1rem !important;
	width: 2em !important;
	height: 1.7em !important;
	line-height: 1.5em !important;
	padding: 0 !important;
	margin: 0 0.15rem !important;
	bottom: 0 !important;
	position: relative !important;
	text-shadow: none !important;
	transition: all 0.15s ease;
}
#u2conf a.b:hover {
	background: rgba(0, 229, 255, 0.10) !important;
	border-color: #00e5ff !important;
	color: #B0F1FF !important;
}
#u2conf input + a.b {
	background: transparent !important;
}