body {
			background: #f8f9fa;
		}

		.navbar-custom {
			background: #fff;
			border-bottom: 1px solid #dee2e6;
		}

		.navbar-brand-custom {
			font-size: 1.35rem;
			font-weight: 700;
			color: #0d6efd !important;
			text-decoration: none;
		}

		.card-custom {
			background: #fff;
			border: 1px solid #dee2e6;
			border-radius: 10px;
			margin-bottom: 1.1rem;
		}

		.card-header-custom {
			background: #f1f3f5;
			border-bottom: 1px solid #dee2e6;
			border-radius: 10px 10px 0 0 !important;
			padding: .85rem 1.1rem;
			cursor: pointer;
			user-select: none;
		}

		.card-header-custom h6 {
			margin: 0;
			font-weight: 600;
			color: #212529;
			font-size: .92rem;
		}

		.card-header-custom i.si {
			color: #0d6efd;
			margin-right: 7px;
		}

		.card-body-custom {
			padding: 1.1rem;
		}

		.sc {
			background: #cfe2ff;
			color: #0d6efd;
			border-radius: 50%;
			width: 22px;
			height: 22px;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			font-size: .72rem;
			font-weight: 700;
			margin-right: 7px;
		}

		.fcc {
			display: flex;
			align-items: flex-start;
			padding: .45rem .65rem;
			border-radius: 6px;
			margin-bottom: .25rem;
			border: 1px solid transparent;
			transition: background .15s;
		}

		.fcc:hover {
			background: #f8f9fa;
			border-color: #dee2e6;
		}

		.fcc input[type=checkbox] {
			width: 17px;
			height: 17px;
			margin-right: 9px;
			margin-top: 2px;
			cursor: pointer;
			flex-shrink: 0;
		}

		.fcc label {
			cursor: pointer;
			font-size: .86rem;
			line-height: 1.4;
			color: #212529;
		}

		.pl {
			font-weight: 600;
			color: #212529;
		}

		.pd {
			font-size: .76rem;
			color: #6c757d;
			display: block;
			margin-top: 1px;
		}

		.pb {
			font-size: .7rem;
			padding: 2px 6px;
			border-radius: 4px;
			margin-left: 5px;
			font-family: monospace;
		}

		.tcp {
			background: #cfe2ff;
			color: #0d6efd;
			border: 1px solid #9ec5fe;
		}

		.udp {
			background: #d1e7dd;
			color: #146c43;
			border: 1px solid #a3cfbb;
		}

		.both {
			background: #fff3cd;
			color: #856404;
			border: 1px solid #ffe69c;
		}

		.ip-in {
			background: #fff;
			border: 1px solid #ced4da;
			color: #212529;
			border-radius: 5px;
			padding: 2px 7px;
			font-size: .76rem;
			width: 155px;
			margin-left: auto;
			height: 26px;
		}

		.ip-in:focus {
			outline: none;
			border-color: #0d6efd;
			box-shadow: 0 0 0 3px rgba(13, 110, 253, .15);
		}

		.ip-in::placeholder {
			color: #adb5bd;
		}

		.sel {
			background: #fff;
			border: 1px solid #ced4da;
			color: #212529;
			border-radius: 6px;
			padding: .38rem .75rem;
			font-size: .86rem;
			width: 100%;
		}

		.sel:focus {
			outline: none;
			border-color: #0d6efd;
			box-shadow: 0 0 0 3px rgba(13, 110, 253, .15);
		}

		.ta {
			background: #fff;
			border: 1px solid #ced4da;
			color: #212529;
			border-radius: 6px;
			font-family: monospace;
			font-size: .8rem;
			resize: vertical;
		}

		.ta:focus {
			background: #fff;
			border-color: #0d6efd;
			color: #212529;
			box-shadow: 0 0 0 3px rgba(13, 110, 253, .15);
		}

		.al-info {
			background: #cff4fc;
			border: 1px solid #9eeaf9;
			color: #055160;
			border-radius: 7px;
			font-size: .82rem;
		}

		.al-warn {
			background: #fff3cd;
			border: 1px solid #ffe69c;
			color: #856404;
			border-radius: 7px;
			font-size: .82rem;
		}

		.btn-gen {
			background: #0d6efd;
			border: none;
			color: #fff;
			font-weight: 700;
			padding: .75rem 2rem;
			border-radius: 8px;
			font-size: 1rem;
			transition: all .2s;
			width: 100%;
			cursor: pointer;
		}

		.btn-gen:hover {
			background: #0b5ed7;
			transform: translateY(-1px);
			box-shadow: 0 4px 12px rgba(13, 110, 253, .3);
		}

		.btn-copy {
			background: #0d6efd;
			border: none;
			color: #fff;
			font-weight: 600;
			padding: .45rem 1.1rem;
			border-radius: 6px;
			font-size: .84rem;
			transition: all .2s;
			cursor: pointer;
		}

		.btn-copy:hover {
			background: #0b5ed7;
		}

		.btn-copy.copied {
			background: #198754;
		}

		.btn-dl {
			background: transparent;
			border: 1px solid #ced4da;
			color: #0d6efd;
			font-size: .84rem;
			padding: .45rem 1rem;
			border-radius: 6px;
			transition: all .2s;
			cursor: pointer;
		}

		.btn-dl:hover {
			background: #e9ecef;
		}

		.btn-sel {
			font-size: .72rem;
			color: #0d6efd;
			background: none;
			border: 1px solid #9ec5fe;
			border-radius: 4px;
			padding: 1px 7px;
			cursor: pointer;
			transition: all .15s;
		}

		.btn-sel:hover {
			background: #cfe2ff;
		}

		/* Zone de sortie : on garde fond sombre uniquement pour le code */
		.out-area {
			background: #212529;
			border-radius: 0 0 10px 10px;
			color: #adb5bd;
			font-family: 'Courier New', Consolas, monospace;
			font-size: .8rem;
			line-height: 1.65;
			padding: 1.1rem;
			min-height: 300px;
			max-height: 68vh;
			overflow-y: auto;
			white-space: pre;
		}

		.out-area::-webkit-scrollbar {
			width: 5px;
		}

		.out-area::-webkit-scrollbar-track {
			background: #343a40;
		}

		.out-area::-webkit-scrollbar-thumb {
			background: #6c757d;
			border-radius: 3px;
		}

		.l-comment {
			color: #6c757d;
			font-style: italic;
		}

		.l-cmd {
			color: #adb5bd;
		}

		.l-shebang {
			color: #fd7e14;
		}

		.l-flag {
			color: #20c997;
		}

		.l-action {
			color: #dc3545;
			font-weight: 600;
		}

		.out-empty {
			min-height: 380px;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 0 0 10px 10px;
			background: #fff;
			border-top: none;
		}

		.out-empty-inner {
			text-align: center;
			color: #6c757d;
		}

		.out-empty-inner i {
			font-size: 2.8rem;
			opacity: .25;
			display: block;
			margin-bottom: .9rem;
		}

		.out-empty-inner span {
			font-size: .88rem;
		}

		.pgt {
			font-size: .7rem;
			text-transform: uppercase;
			letter-spacing: 1px;
			color: #6c757d;
			margin: .75rem 0 .25rem;
			padding-bottom: .25rem;
			border-bottom: 1px solid #dee2e6;
		}

		.ca {
			transition: transform .25s ease;
			color: #6c757d;
			font-size: .85rem;
		}

		.ca.closed {
			transform: rotate(-90deg);
		}

		.sticky-col {
			position: sticky;
			top: 16px;
		}

		.gen-card {
			background: #fff;
			border: 1px solid #dee2e6;
			border-radius: 10px;
			padding: 1rem;
			margin-bottom: 1.1rem;
		}

		.quick-out {
			background: #212529;
			color: #adb5bd;
			border-radius: 6px;
			font-family: monospace;
			font-size: .78rem;
			padding: .9rem;
			white-space: pre;
			overflow-x: auto;
		}