:root {
            --bg:#07080a;
            --surface:#0d0f12;
            --surface2:#111419;
            --surface3:#171b21;
            --border:#20242b;
            --border2:#2a3039;
            --text:#f4f5f7;
            --muted:#8c929c;
            --muted2:#616873;
            --green:#91e4b0;
            --yellow:#e6cf88;
            --red:#ff9292;
            --white:#fff;
        }

        * { box-sizing:border-box; }

        html,body { min-height:100%; }

        body {
            margin:0;
            min-height:100vh;
            background:
                radial-gradient(900px 520px at 12% 8%, rgba(105,135,190,.10), transparent 68%),
                radial-gradient(760px 520px at 88% 78%, rgba(126,104,175,.075), transparent 70%),
                radial-gradient(850px 380px at 50% -170px, rgba(255,255,255,.055), transparent 72%),
                var(--bg);
            background-size:135% 135%, 145% 145%, 100% 100%, auto;
            background-position:0% 0%, 100% 100%, 50% 0%, 0 0;
            color:var(--text);
            font-family:Arial, Helvetica, sans-serif;
            -webkit-font-smoothing:antialiased;
            animation:donatfunBackgroundDrift 22s ease-in-out infinite alternate;
        }

        button,input,textarea { font:inherit; }
        a { color:inherit; text-decoration:none; }

        .center-shell {
            min-height:100vh;
            display:flex;
            flex-direction:column;
            align-items:center;
            justify-content:center;
            gap:14px;
            padding:26px 18px;
        }

        .customer-nav {
            width:min(100%,620px);
            display:flex;
            gap:6px;
            padding:5px;
            border:1px solid var(--border);
            border-radius:14px;
            background:#0b0d10;
        }

        .customer-nav a {
            flex:1;
            padding:10px;
            border-radius:10px;
            color:var(--muted);
            text-align:center;
            font-size:13px;
            font-weight:700;
        }

        .customer-nav a.active {
            background:#191d23;
            color:var(--text);
        }

        .card,.support-box,.panel,.stat-card,.order-admin,.product-row {
            border:1px solid var(--border);
            background:rgba(13,15,18,.97);
        }

        .card {
            width:min(100%,500px);
            padding:36px 32px 30px;
            border-radius:21px;
            box-shadow:0 30px 90px rgba(0,0,0,.35);
        }

        .brand {
            display:flex;
            align-items:center;
            gap:9px;
            margin-bottom:30px;
        }

        .brand-icon {
            width:34px;
            height:34px;
            display:grid;
            place-items:center;
            border-radius:10px;
            background:#f6f7f9;
            color:#08090b;
            font-weight:900;
            font-size:16px;
        }

        .brand-logo {
            width:32px;
            height:32px;
            flex:0 0 32px;
            display:block;
            object-fit:contain;
            border-radius:50%;
        }


        .brand-name {
            font-size:16px;
            font-weight:800;
            letter-spacing:-.02em;
        }

        .eyebrow {
            margin-bottom:9px;
            color:#666d77;
            font-size:10px;
            font-weight:800;
            letter-spacing:.14em;
            text-transform:uppercase;
        }

        h1,h2,h3,p { margin-top:0; }

        h1 {
            margin-bottom:12px;
            font-size:36px;
            line-height:1.05;
            letter-spacing:-.035em;
        }

        h2 {
            margin:0;
            font-size:26px;
            letter-spacing:-.025em;
        }

        h3 {
            margin:0;
            font-size:17px;
            line-height:1.35;
        }

        .muted {
            color:var(--muted);
            font-size:14px;
            line-height:1.58;
        }

        .strong-note {
            margin:18px 0 0;
            padding:13px 14px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#0a0c0f;
            color:#b9bec6;
            font-size:13px;
            line-height:1.55;
        }

        .strong-note.warning {
            border-color:rgba(230,207,136,.22);
            color:#e7dba9;
        }

        .stack { display:grid; gap:11px; }

        input,textarea,select {
            width:100%;
            border:1px solid var(--border2);
            background:#090b0e;
            color:var(--text);
            outline:none;
        }

        input:focus,textarea:focus,select:focus {
            border-color:#4a525f;
            background:#0b0e12;
        }

        .text-input,.code-input {
            height:56px;
            padding:0 16px;
            border-radius:13px;
        }

        .code-input {
            text-transform:uppercase;
            font-weight:700;
            letter-spacing:.035em;
        }

        textarea {
            min-height:118px;
            padding:14px;
            border-radius:13px;
            resize:vertical;
            line-height:1.5;
        }

        .primary-button,.secondary-button,.ghost-button,.danger-button,.contact-button,.copy-button {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            border:0;
            cursor:pointer;
            font-weight:700;
            transition:.14s ease;
        }

        .primary-button {
            width:100%;
            min-height:54px;
            border-radius:13px;
            background:#f4f5f7;
            color:#08090b;
        }

        .primary-button:hover { background:#fff; transform:translateY(-1px); }

        .secondary-button {
            min-height:44px;
            padding:0 16px;
            border-radius:11px;
            background:#20252c;
            color:var(--text);
        }

        .secondary-button:hover { background:#292f38; }

        .ghost-button {
            min-height:40px;
            padding:0 14px;
            border:1px solid var(--border2);
            border-radius:10px;
            background:transparent;
            color:#c3c8cf;
        }

        .ghost-button:hover { background:#15191e; }

        .danger-button {
            min-height:38px;
            padding:0 12px;
            border:1px solid rgba(255,146,146,.18);
            border-radius:10px;
            background:rgba(255,146,146,.06);
            color:#ffabab;
        }

        .compact { width:auto; min-height:42px; }
        .small { min-height:34px; padding:0 10px; font-size:12px; }

        .alert {
            margin:15px 0;
            padding:12px 14px;
            border:1px solid var(--border);
            border-radius:11px;
            background:var(--surface2);
            color:#d9dde2;
            font-size:13px;
            line-height:1.45;
        }

        .alert.error {
            border-color:rgba(255,146,146,.2);
            color:#ffb0b0;
        }

        .alert.success {
            border-color:rgba(145,228,176,.18);
            color:#b9efcb;
        }


        .support-page-card {
            width:min(100%,620px);
        }

        .support-page-grid {
            display:grid;
            gap:14px;
            margin-top:18px;
        }

        .support-info-card {
            padding:16px;
            border:1px solid var(--border);
            border-radius:15px;
            background:rgba(9,11,14,.74);
        }

        .support-info-card h3 {
            margin:0 0 9px;
            font-size:16px;
        }

        .support-info-card p,
        .support-info-card li {
            margin-top:0;
            color:var(--muted);
            font-size:13px;
            line-height:1.65;
        }

        .support-info-card p:last-child {
            margin-bottom:0;
        }

        .support-info-card ul {
            margin:0;
            padding-left:18px;
        }

        .support-contact-list {
            display:grid;
            gap:9px;
        }

        .support-contact-item {
            padding:13px 14px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#090b0e;
        }

        .support-contact-item strong {
            display:block;
            margin-bottom:5px;
            font-size:13px;
        }

        .support-contact-item p {
            margin:0;
        }

        .support-link {
            color:var(--text);
            text-decoration:none;
            overflow-wrap:anywhere;
            border-bottom:1px dashed rgba(255,255,255,.24);
        }

        .support-link:hover {
            border-bottom-color:rgba(255,255,255,.55);
        }

        

        

        @media (max-width:640px) {
            .customer-nav a {
                font-size:12px;
                padding:10px 6px;
            }

            .support-page-card {
                width:min(100%,500px);
            }
        }

        .support-box {
            width:min(100%,500px);
            padding:17px;
            border-radius:15px;
        }

        .support-title {
            margin-bottom:4px;
            font-size:13px;
            font-weight:700;
            color:#d0d4da;
        }

        .support-text {
            margin-bottom:12px;
            color:#707781;
            font-size:12px;
            line-height:1.5;
        }

        .support-actions {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:8px;
        }

        .contact-button {
            min-height:42px;
            border:1px solid var(--border2);
            border-radius:10px;
            background:#15191e;
            color:#d9dde2;
            font-size:12px;
        }

        .contact-button:hover { background:#1c2128; }
        .contact-button.disabled { opacity:.35; cursor:default; }

        .status-pill {
            display:inline-flex;
            align-items:center;
            gap:7px;
            margin-bottom:18px;
            padding:6px 9px;
            border:1px solid var(--border);
            border-radius:999px;
            font-size:11px;
            font-weight:800;
        }

        .status-dot {
            width:6px;
            height:6px;
            border-radius:50%;
            background:currentColor;
        }

        .processing { color:var(--yellow); }
        .completed { color:var(--green); }
        .cancelled { color:var(--red); }

        .timer-box {
            margin:22px 0 12px;
            padding:16px;
            border:1px solid var(--border);
            border-radius:13px;
            background:#090b0e;
        }

        .timer-label {
            color:#646b75;
            font-size:10px;
            font-weight:800;
            letter-spacing:.12em;
            text-transform:uppercase;
        }

        .timer {
            margin-top:7px;
            font-size:28px;
            font-weight:800;
            letter-spacing:.03em;
            font-variant-numeric:tabular-nums;
        }

        .order-code {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:10px;
            margin:15px 0 0;
            padding:12px 13px;
            border:1px solid var(--border);
            border-radius:11px;
            background:#0a0c0f;
        }

        .order-code span:first-child {
            color:#757c86;
            font-size:11px;
        }

        .order-code strong {
            margin-left:auto;
            overflow-wrap:anywhere;
            font-size:12px;
        }

        .copy-button {
            min-height:31px;
            padding:0 9px;
            border:1px solid var(--border2);
            border-radius:8px;
            background:#171b21;
            color:#d2d6dc;
            font-size:11px;
        }

        .progress {
            display:grid;
            grid-template-columns:1fr 1fr 1fr;
            gap:7px;
            margin:24px 0 20px;
        }

        .step {
            height:4px;
            border-radius:999px;
            background:#1d2127;
        }

        .step.done { background:#d8dce2; }
        .step.current { background:#777f8a; }

        .result-section { margin-top:20px; }

        .result-label {
            margin:0 0 7px 2px;
            color:#6c737d;
            font-size:10px;
            font-weight:800;
            letter-spacing:.12em;
            text-transform:uppercase;
        }

        .result-box {
            padding:16px;
            border:1px solid var(--border2);
            border-radius:13px;
            background:#090b0e;
        }

        .result-box pre {
            margin:0;
            white-space:pre-wrap;
            overflow-wrap:anywhere;
            font-family:Arial,Helvetica,sans-serif;
            font-size:14px;
            line-height:1.6;
        }

        .order-meta {
            margin-top:22px;
            padding-top:17px;
            border-top:1px solid var(--border);
            color:#606771;
            font-size:11px;
            line-height:1.6;
        }

        .login-warning {
            margin:18px 0;
            padding:14px;
            border:1px solid rgba(230,207,136,.18);
            border-radius:12px;
            background:rgba(230,207,136,.035);
            color:#cfc6a3;
            font-size:13px;
            line-height:1.58;
        }

        .hidden { display:none !important; }

        /* ADMIN */
        .admin-shell {
            width:min(1420px,calc(100% - 34px));
            margin:0 auto;
            padding:28px 0 70px;
        }

        .admin-header {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:16px;
            margin-bottom:18px;
        }

        .admin-header h1 { margin:0; font-size:31px; }

        .admin-nav {
            display:flex;
            gap:7px;
            margin-bottom:25px;
            padding-bottom:15px;
            border-bottom:1px solid var(--border);
        }

        .admin-nav a {
            padding:9px 13px;
            border-radius:9px;
            color:var(--muted);
            font-size:13px;
            font-weight:700;
        }

        .admin-nav a.active {
            background:#191d23;
            color:var(--text);
        }

        .stats-grid {
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:12px;
            margin-bottom:28px;
        }

        .stat-card {
            padding:18px;
            border-radius:15px;
        }

        .stat-card span { color:var(--muted); font-size:12px; }
        .stat-card strong { display:block; margin-top:6px; font-size:27px; }

        .section-heading {
            display:flex;
            align-items:end;
            justify-content:space-between;
            gap:15px;
            margin:30px 0 13px;
        }

        .order-list { display:grid; gap:12px; }

        .order-admin {
            padding:18px;
            border-radius:15px;
        }

        .order-admin.overdue {
            border-color:rgba(230,207,136,.25);
        }

        .order-admin-head {
            display:flex;
            align-items:start;
            justify-content:space-between;
            gap:16px;
            margin-bottom:16px;
        }

        .order-title { display:grid; gap:6px; }
        .order-sub { color:#747b85; font-size:12px; }

        .admin-timer {
            min-width:130px;
            padding:9px 11px;
            border:1px solid var(--border);
            border-radius:10px;
            background:#090b0e;
            text-align:right;
        }

        .admin-timer small {
            display:block;
            color:#646b75;
            font-size:9px;
            text-transform:uppercase;
            letter-spacing:.08em;
        }

        .admin-timer strong {
            display:block;
            margin-top:4px;
            font-size:16px;
            font-variant-numeric:tabular-nums;
        }

        .customer-data {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:9px;
            margin-bottom:13px;
        }

        .data-box {
            padding:11px 12px;
            border:1px solid var(--border);
            border-radius:10px;
            background:#0a0c0f;
        }

        .data-box span {
            display:block;
            margin-bottom:4px;
            color:#646b75;
            font-size:10px;
        }

        .data-box strong {
            display:block;
            overflow-wrap:anywhere;
            font-size:13px;
        }

        .fulfillment-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:12px;
        }

        .field-label {
            display:block;
            margin:0 0 7px 2px;
            color:#707781;
            font-size:11px;
            font-weight:700;
        }

        .form-actions {
            display:flex;
            gap:8px;
            margin-top:11px;
        }

        .form-actions .secondary-button { flex:1; }

        .panel { border-radius:15px; }

        .table-wrap { overflow-x:auto; }

        table {
            width:100%;
            border-collapse:collapse;
        }

        th,td {
            padding:13px 14px;
            border-bottom:1px solid var(--border);
            text-align:left;
            vertical-align:top;
            font-size:12px;
        }

        th {
            color:#686f79;
            font-size:10px;
            letter-spacing:.08em;
            text-transform:uppercase;
        }

        tr:last-child td { border-bottom:0; }

        .table-status {
            display:inline-flex;
            padding:5px 8px;
            border-radius:999px;
            font-size:11px;
            font-weight:700;
        }

        .table-status.free { color:var(--green); background:rgba(145,228,176,.06); }
        .table-status.processing { color:var(--yellow); background:rgba(230,207,136,.06); }
        .table-status.completed { color:var(--green); background:rgba(145,228,176,.06); }
        .table-status.used { color:#9399a2; background:rgba(255,255,255,.04); }

        .product-list { display:grid; gap:10px; }

        .product-row {
            display:grid;
            grid-template-columns:minmax(240px,1.7fr) repeat(4,minmax(80px,.45fr)) auto;
            align-items:center;
            gap:12px;
            padding:16px;
            border-radius:14px;
        }

        .product-main { display:grid; gap:6px; }

        .badges { display:flex; flex-wrap:wrap; gap:5px; }

        .badge {
            width:fit-content;
            padding:4px 7px;
            border-radius:999px;
            background:rgba(255,255,255,.045);
            color:#a4aab3;
            font-size:10px;
            font-weight:800;
        }

        .badge.on {
            color:var(--green);
            background:rgba(145,228,176,.06);
        }

        .badge.login {
            color:#c7cbe2;
            background:rgba(151,160,220,.07);
        }

        .metric span {
            display:block;
            margin-bottom:4px;
            color:#616873;
            font-size:10px;
        }

        .metric strong { font-size:16px; }

        .create-bar {
            display:grid;
            grid-template-columns:1fr auto auto;
            align-items:center;
            gap:10px;
            padding:12px;
            margin-bottom:14px;
        }

        .check {
            display:flex;
            align-items:center;
            gap:8px;
            white-space:nowrap;
            color:#aeb3ba;
            font-size:12px;
        }

        .check input {
            width:16px;
            height:16px;
            accent-color:#fff;
        }

        .product-detail-head {
            display:flex;
            align-items:start;
            justify-content:space-between;
            gap:16px;
            margin-bottom:18px;
        }

        .detail-stats {
            display:flex;
            gap:8px;
            margin-top:14px;
        }

        .detail-stat {
            min-width:105px;
            padding:10px 12px;
            border:1px solid var(--border);
            border-radius:10px;
            background:#0a0c0f;
        }

        .detail-stat span { display:block; color:#626974; font-size:10px; }
        .detail-stat strong { display:block; margin-top:3px; font-size:17px; }

        .settings-box {
            padding:15px;
            margin-bottom:13px;
        }

        .settings-row {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
        }

        .settings-copy p {
            margin:4px 0 0;
            color:#6f7680;
            font-size:12px;
        }

        .codes-tools {
            display:grid;
            grid-template-columns:1fr auto;
            gap:9px;
            margin-bottom:12px;
        }

        .empty-state {
            padding:25px;
            color:var(--muted);
            text-align:center;
        }

        @media (max-width:900px) {
            .product-row { grid-template-columns:1fr 1fr; }
            .product-main { grid-column:1/-1; }
            .create-bar { grid-template-columns:1fr; }
        }

        @media (max-width:720px) {
            .card { padding:29px 20px 25px; }
            .support-actions { grid-template-columns:1fr; }
            .admin-shell { width:min(100% - 20px,1420px); padding-top:18px; }
            .admin-header { align-items:flex-start; }
            .stats-grid { grid-template-columns:1fr; }
            .fulfillment-grid,.customer-data { grid-template-columns:1fr; }
            .order-admin-head { flex-direction:column; }
            .admin-timer { width:100%; text-align:left; }
            .product-row { grid-template-columns:1fr 1fr; }
            .product-main { grid-column:1/-1; }
            .codes-tools { grid-template-columns:1fr; }
            .product-detail-head { flex-direction:column; }
        }
    
        /* v6 refinements */
        body {
            background:
                radial-gradient(720px 360px at 50% -130px, rgba(255,255,255,.06), transparent 72%),
                linear-gradient(180deg, #08090b 0%, #060709 100%);
        }

        .card {
            border-color: #242932;
            background: linear-gradient(180deg, rgba(15,17,21,.985), rgba(11,13,16,.985));
            box-shadow:
                0 32px 90px rgba(0,0,0,.42),
                inset 0 1px 0 rgba(255,255,255,.025);
        }

        .brand {
            margin-bottom: 27px;
        }

        .brand-icon {
            width: 36px;
            height: 36px;
            border-radius: 11px;
            font-size: 17px;
        }

        .brand-name {
            font-size: 17px;
            letter-spacing: -.035em;
        }

        .customer-nav {
            border-color: #20252d;
            background: rgba(11,13,16,.92);
            box-shadow: 0 10px 30px rgba(0,0,0,.15);
        }

        .customer-nav a {
            transition: background .14s ease, color .14s ease;
        }

        .customer-nav a:hover {
            color: #cdd2d9;
        }

        .customer-nav a.active {
            background: #1a1f26;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
        }

        .flow {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 7px;
            margin: 24px 0 20px;
        }

        .flow-item {
            position: relative;
            padding-top: 11px;
            border-top: 3px solid #20242a;
            color: #555d68;
            font-size: 10px;
            font-weight: 700;
        }

        .flow-item.done {
            border-top-color: #d8dce2;
            color: #aeb4bc;
        }

        .flow-item.current {
            border-top-color: #818995;
            color: #d1d5db;
        }

        .timer-box {
            border-color: #252b34;
            background: linear-gradient(180deg, #0a0c0f, #090b0d);
        }

        .timer {
            font-size: 31px;
            letter-spacing: .045em;
        }

        .order-code {
            border-color: #242a32;
            background: #0a0c0f;
        }

        .support-box {
            border-color: #20252c;
            background: rgba(11,13,16,.94);
        }

        .contact-button {
            min-height: 44px;
            background: #14181d;
        }

        .result-box {
            border-color: #262c35;
            background: #080a0c;
            box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
        }

        .result-section {
            margin-top: 22px;
        }

        .result-label {
            color: #737b86;
        }

        .result-toolbar {
            display:flex;
            justify-content:flex-end;
            margin-top:8px;
        }

        .result-toolbar .copy-button {
            min-height: 34px;
            padding: 0 11px;
        }

        .customer-code-footer {
            margin-top: 24px;
            padding-top: 17px;
            border-top: 1px solid var(--border);
            color: #656d77;
            font-size: 11px;
            line-height: 1.55;
        }

        .customer-code-footer strong {
            color: #a6acb4;
            font-weight: 700;
        }

        .edit-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:12px;
        }

        .edit-preview {
            margin-bottom:16px;
            padding:14px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#0a0c0f;
        }

        .edit-preview-row {
            display:grid;
            grid-template-columns: 150px 1fr;
            gap:12px;
            padding:7px 0;
            border-bottom:1px solid rgba(255,255,255,.045);
            font-size:12px;
        }

        .edit-preview-row:last-child { border-bottom:0; }

        .edit-preview-row span { color:#68707b; }
        .edit-preview-row strong { overflow-wrap:anywhere; }

        .admin-actions {
            display:flex;
            gap:7px;
            flex-wrap:wrap;
        }

        .link-button {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:36px;
            padding:0 11px;
            border:1px solid var(--border2);
            border-radius:9px;
            background:#171b20;
            color:#d5d9df;
            font-size:11px;
            font-weight:700;
        }

        .link-button:hover { background:#1e232a; }

        @media (max-width:720px) {
            .flow-item { font-size:9px; }
            .edit-grid { grid-template-columns:1fr; }
            .edit-preview-row { grid-template-columns:1fr; gap:3px; }
        }

    
        /* v6.2 readability */
        .muted { font-size:15px; }
        .support-title { font-size:14px; }
        .support-text { font-size:13px; }
        .contact-button { font-size:13px; }
        .order-code span:first-child { font-size:12px; }
        .order-code strong { font-size:13px; }
        .customer-code-footer { font-size:12px; }
        th { font-size:11px; }
        td { font-size:13px; }
        .order-sub { font-size:13px; }
        .field-label { font-size:12px; }
        .data-box span { font-size:11px; }
        .data-box strong { font-size:14px; }

        .issued-details {
            margin-top: 30px;
            border: 1px solid var(--border);
            border-radius: 15px;
            background: var(--surface);
            overflow: hidden;
        }

        .issued-details > summary {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
            padding:16px 18px;
            cursor:pointer;
            list-style:none;
            user-select:none;
            font-weight:700;
            font-size:15px;
        }

        .issued-details > summary::-webkit-details-marker { display:none; }

        .issued-details > summary::after {
            content:"Раскрыть";
            color:#7a828d;
            font-size:11px;
            font-weight:700;
        }

        .issued-details[open] > summary::after { content:"Скрыть"; }

        .issued-details .issued-inner {
            border-top:1px solid var(--border);
        }

        .danger-link-button {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:36px;
            padding:0 11px;
            border:1px solid rgba(255,146,146,.20);
            border-radius:9px;
            background:rgba(255,146,146,.055);
            color:#ffadad;
            font-size:11px;
            font-weight:700;
            cursor:pointer;
        }

    
        /* v6.3 readability + issued spoiler */
        body { font-size:15px; }

        .customer-nav a { font-size:14px; }
        .muted { font-size:16px; line-height:1.62; }
        .strong-note, .login-warning { font-size:14px; }
        .support-title { font-size:15px; }
        .support-text { font-size:14px; }
        .contact-button { font-size:14px; }
        .order-code span:first-child { font-size:13px; }
        .order-code strong { font-size:14px; }
        .copy-button { font-size:12px; }
        .customer-code-footer { font-size:13px; }
        .result-label { font-size:12px; }
        .result-box pre { font-size:15px; }

        .admin-nav a { font-size:14px; }
        .stat-card span { font-size:13px; }
        .order-sub { font-size:13px; }
        .field-label { font-size:13px; }
        .data-box span { font-size:12px; }
        .data-box strong { font-size:15px; }
        th { font-size:12px; }
        td { font-size:14px; }
        .link-button, .danger-link-button { font-size:12px; }
        .secondary-button, .ghost-button, .danger-button { font-size:13px; }

        .issued-details {
            margin-top:30px;
            border:1px solid #29303a;
            border-radius:16px;
            background:linear-gradient(180deg,#0f1216,#0c0e11);
            overflow:hidden;
            box-shadow:0 14px 42px rgba(0,0,0,.18);
        }

        .issued-details > summary {
            min-height:66px;
            display:grid;
            grid-template-columns:auto 1fr auto;
            align-items:center;
            gap:12px;
            padding:15px 18px;
            cursor:pointer;
            list-style:none;
            user-select:none;
        }

        .issued-details > summary::-webkit-details-marker { display:none; }

        .issued-chevron {
            width:30px;
            height:30px;
            display:grid;
            place-items:center;
            border:1px solid var(--border2);
            border-radius:9px;
            background:#15191e;
            color:#9ba2ac;
            font-size:16px;
            transition:transform .16s ease;
        }

        .issued-details[open] .issued-chevron { transform:rotate(90deg); }

        .issued-summary-title {
            display:grid;
            gap:4px;
        }

        .issued-summary-title strong {
            font-size:16px;
            color:#eef0f3;
        }

        .issued-summary-title span {
            color:#737b86;
            font-size:12px;
            font-weight:400;
        }

        .issued-count {
            min-width:38px;
            padding:6px 9px;
            border:1px solid var(--border2);
            border-radius:999px;
            background:#15191e;
            color:#c3c8cf;
            text-align:center;
            font-size:12px;
            font-weight:800;
        }

        .issued-details .issued-inner {
            border-top:1px solid var(--border);
        }

        .issued-details .table-wrap {
            border:0;
            border-radius:0;
        }

        .admin-actions form { margin:0; }

        @media (max-width:720px) {
            .muted { font-size:15px; }
            td { font-size:13px; }
            .issued-details > summary {
                grid-template-columns:auto 1fr auto;
                padding:14px;
            }
        }

    
        /* v6.4 animated ambient background */
        body {
            position: relative;
            overflow-x: hidden;
            isolation: isolate;
        }

        body::before,
        body::after {
            content: "";
            position: fixed;
            z-index: -1;
            pointer-events: none;
            border-radius: 999px;
            filter: blur(90px);
            will-change: transform, opacity;
        }

        body::before {
            width: min(70vw, 900px);
            height: min(70vw, 900px);
            left: -22vw;
            top: -28vw;
            background: rgba(255,255,255,.055);
            opacity: .75;
            animation: donatfunGlowOne 18s ease-in-out infinite alternate;
        }

        body::after {
            width: min(58vw, 760px);
            height: min(58vw, 760px);
            right: -20vw;
            bottom: -30vw;
            background: rgba(111,126,150,.055);
            opacity: .55;
            animation: donatfunGlowTwo 23s ease-in-out infinite alternate;
        }

        @keyframes donatfunGlowOne {
            0% {
                transform: translate3d(0,0,0) scale(1);
                opacity: .56;
            }
            50% {
                transform: translate3d(9vw,8vh,0) scale(1.08);
                opacity: .76;
            }
            100% {
                transform: translate3d(17vw,3vh,0) scale(.96);
                opacity: .62;
            }
        }

        @keyframes donatfunGlowTwo {
            0% {
                transform: translate3d(0,0,0) scale(.96);
                opacity: .42;
            }
            50% {
                transform: translate3d(-10vw,-9vh,0) scale(1.10);
                opacity: .62;
            }
            100% {
                transform: translate3d(-17vw,-3vh,0) scale(1.02);
                opacity: .50;
            }
        }

        @keyframes donatfunBackgroundDrift {
            0% {
                background-position:0% 0%, 100% 100%, 50% 0%, 0 0;
            }
            50% {
                background-position:28% 16%, 72% 82%, 48% 3%, 0 0;
            }
            100% {
                background-position:18% 30%, 82% 62%, 52% 0%, 0 0;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            body,
            body::before,
            body::after {
                animation: none !important;
            }
        }

    
        /* v7 theme switch */
        html[data-theme="dark"] { color-scheme: dark; }

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        
        

        
        
        

        .integration-status {
            width:fit-content;
            display:flex;
            align-items:center;
            gap:7px;
            margin:-12px 0 18px;
            padding:7px 10px;
            border:1px solid var(--border);
            border-radius:999px;
            color:#777f89;
            font-size:12px;
            font-weight:700;
        }

        .integration-status .status-dot {
            background:#7d848d;
        }

        .integration-status.connected {
            color:var(--green);
        }

        .integration-status.connected .status-dot {
            background:var(--green);
        }

        .form-hint {
            margin-top:6px;
            color:var(--muted2);
            font-size:12px;
            line-height:1.45;
        }

        .danger-zone {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
            padding:17px;
            margin:14px 0;
            border-color:rgba(255,146,146,.22);
        }

        @media (max-width:720px) {
            

            
            .center-shell { padding-top:62px; }
            .admin-shell { padding-top:64px; }
            .danger-zone { align-items:flex-start; flex-direction:column; }
        }

    
        /* v7.2: stronger contrast, support button, richer motion */
        .support-actions {
            grid-template-columns: 1fr;
        }

        .telegram-support-button {
            width:100%;
            min-height:46px;
            border:1px solid #2ebd6b;
            background:#24a85d;
            color:#ffffff;
            box-shadow:0 10px 28px rgba(36,168,93,.16);
        }

        .telegram-support-button:hover {
            background:#20b461;
            border-color:#38c978;
            transform:translateY(-1px);
            box-shadow:0 14px 34px rgba(36,168,93,.22);
        }

        .telegram-support-button.disabled {
            opacity:.5;
            color:#ffffff;
            cursor:default;
            transform:none;
        }

        .ambient-bg {
            position:fixed;
            inset:0;
            z-index:-2;
            overflow:hidden;
            pointer-events:none;
        }

        .ambient-orb {
            position:absolute;
            border-radius:50%;
            filter:blur(82px);
            will-change:transform,opacity;
        }

        .ambient-orb.one {
            width:42vw;
            height:42vw;
            min-width:430px;
            min-height:430px;
            left:-14vw;
            top:8vh;
            background:rgba(120,139,174,.10);
            animation:ambientOrbitOne 19s ease-in-out infinite alternate;
        }

        .ambient-orb.two {
            width:36vw;
            height:36vw;
            min-width:360px;
            min-height:360px;
            right:-10vw;
            top:18vh;
            background:rgba(255,255,255,.07);
            animation:ambientOrbitTwo 24s ease-in-out infinite alternate;
        }

        .ambient-orb.three {
            width:34vw;
            height:34vw;
            min-width:340px;
            min-height:340px;
            left:32vw;
            bottom:-20vw;
            background:rgba(92,112,148,.07);
            animation:ambientOrbitThree 21s ease-in-out infinite alternate;
        }

        .ambient-grid {
            position:absolute;
            inset:-18%;
            opacity:.12;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size:52px 52px;
            mask-image:radial-gradient(circle at 50% 45%, #000 0%, transparent 70%);
            animation:ambientGridDrift 28s linear infinite, ambientGridPulse 9s ease-in-out infinite alternate;
        }

        @keyframes ambientOrbitOne {
            from { transform:translate3d(0,0,0) scale(.94); opacity:.52; }
            to   { transform:translate3d(24vw,-5vh,0) scale(1.12); opacity:.92; }
        }

        @keyframes ambientOrbitTwo {
            0%   { transform:translate3d(0,0,0) scale(1); opacity:.46; }
            55%  { transform:translate3d(-19vw,16vh,0) scale(1.13); opacity:.80; }
            100% { transform:translate3d(-9vw,-8vh,0) scale(.96); opacity:.57; }
        }

        @keyframes ambientOrbitThree {
            from { transform:translate3d(0,0,0) scale(.9); opacity:.35; }
            to   { transform:translate3d(12vw,-22vh,0) scale(1.16); opacity:.70; }
        }

        @keyframes ambientGridDrift {
            from { transform:translate3d(0,0,0) rotate(.001deg); }
            to   { transform:translate3d(52px,52px,0) rotate(.001deg); }
        }

        @keyframes ambientGridPulse {
            from { opacity:.08; }
            to   { opacity:.18; }
        }

        .card,
        .support-box,
        .customer-nav {
            animation:surfaceArrive .45s ease-out both;
        }

        .support-box { animation-delay:.06s; }

        @keyframes surfaceArrive {
            from { opacity:0; transform:translateY(8px); }
            to   { opacity:1; transform:translateY(0); }
        }

        

        

        

        

        

        

        
        
        

        
        
        
        

        

        

        @media (prefers-reduced-motion: reduce) {
            .ambient-orb,
            .ambient-grid,
            .card,
            .support-box,
            .customer-nav {
                animation:none !important;
            }
        }

    
        /* v8 additions */
        .create-product-grid {
            padding:14px;
            display:grid;
            grid-template-columns:minmax(220px,1.3fr) minmax(180px,1fr) minmax(180px,1fr) auto;
            gap:9px;
            margin-bottom:18px;
            align-items:center;
        }

        .customer-fields-admin,
        .codes-add-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:12px;
        }

        .codes-add-grid { margin-bottom:14px; }

        .file-input {
            width:100%;
            min-height:46px;
            padding:10px 12px;
            border:1px solid var(--border2);
            border-radius:10px;
            background:var(--surface2);
            color:var(--text);
            font:600 13px Arial,Helvetica,sans-serif;
        }

        .low-stock-badge {
            color:#ffcc66 !important;
            border-color:rgba(255,184,77,.28) !important;
            background:rgba(255,184,77,.08) !important;
        }

        .statistics-grid {
            display:grid;
            grid-template-columns:repeat(4,minmax(0,1fr));
            gap:10px;
            margin-bottom:24px;
        }

        .small-stat { font-size:22px !important; }

        

        

        @media (max-width:900px) {
            .create-product-grid { grid-template-columns:1fr 1fr; }
            .statistics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
        }

        @media (max-width:620px) {
            .create-product-grid,
            .customer-fields-admin,
            .codes-add-grid,
            .statistics-grid {
                grid-template-columns:1fr;
            }
        }

    
        /* v8.2 fixed buyer fields */
        .simple-product-create {
            grid-template-columns:minmax(240px,1fr) auto !important;
        }

        .admin-customer-fields-note {
            padding:13px 15px;
            margin:-8px 0 18px;
            color:var(--muted);
            font-size:13px;
            line-height:1.55;
        }

        .fixed-fields-preview .data-box {
            min-height:72px;
        }

        

        @media (max-width:620px) {
            .simple-product-create {
                grid-template-columns:1fr !important;
            }
        }

    
        /* v8.3 product "Данные" checkbox */
        .product-create-with-data {
            grid-template-columns:minmax(240px,1fr) minmax(245px,.8fr) auto !important;
        }

        .data-checkbox {
            min-height:48px;
            display:flex;
            align-items:center;
            gap:11px;
            padding:9px 12px;
            border:1px solid var(--border2);
            border-radius:11px;
            background:var(--surface2);
            color:var(--text);
            cursor:pointer;
            user-select:none;
        }

        .data-checkbox input {
            position:absolute;
            opacity:0;
            pointer-events:none;
        }

        .data-checkbox-box {
            width:21px;
            height:21px;
            flex:0 0 21px;
            border:1px solid var(--border2);
            border-radius:6px;
            background:var(--surface);
            position:relative;
        }

        .data-checkbox input:checked + .data-checkbox-box {
            background:var(--text);
            border-color:var(--text);
        }

        .data-checkbox input:checked + .data-checkbox-box::after {
            content:"";
            position:absolute;
            width:8px;
            height:4px;
            left:5px;
            top:6px;
            border-left:2px solid var(--bg);
            border-bottom:2px solid var(--bg);
            transform:rotate(-45deg);
        }

        .data-checkbox strong {
            display:block;
            font-size:13px;
            line-height:1.2;
        }

        .data-checkbox small {
            display:block;
            margin-top:3px;
            color:var(--muted);
            font-size:11px;
            line-height:1.25;
        }

        .settings-data-checkbox {
            min-width:190px;
        }

        .fields-disabled {
            opacity:.52;
        }

        

        

        

        

        @media (max-width:720px) {
            .product-create-with-data {
                grid-template-columns:1fr !important;
            }

            .settings-data-checkbox {
                width:100%;
                min-width:0;
            }
        }

    
        /* v9.0 — unified customer layout */
        :root {
            --muted:#a3a9b2;
            --muted2:#777f8a;
        }

        

        .center-shell {
            width:100%;
            padding:56px 24px 48px;
            gap:16px;
        }

        .customer-nav,
        .card,
        .support-box,
        .support-page-card {
            width:min(100%,620px);
        }

        .card {
            padding:42px 36px 36px;
        }

        .brand {
            margin-bottom:32px;
        }

        .brand-name {
            font-family:Arial,Helvetica,sans-serif;
            font-size:18px;
        }

        .eyebrow {
            color:#808894;
            font-family:Arial,Helvetica,sans-serif;
            font-size:11px;
        }

        h1 {
            font-family:Arial,Helvetica,sans-serif;
            font-size:40px;
            line-height:1.06;
        }

        h2,
        h3,
        p,
        .muted,
        .support-text,
        .support-title,
        .customer-nav a,
        .contact-button {
            font-family:Arial,Helvetica,sans-serif;
        }

        .muted {
            color:var(--muted);
            font-size:15px;
            line-height:1.68;
        }

        .support-box {
            padding:20px;
        }

        .support-title {
            font-size:14px;
            color:#d9dde3;
        }

        .support-text {
            color:#949ba5;
            font-size:13px;
            line-height:1.6;
        }

        

        

        .customer-nav {
            position:relative;
            align-items:center;
        }

        .customer-nav a {
            min-height:42px;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:13px;
        }

        /* Compact sun/moon control. JS moves it inside customer navigation. */
        

        

        

        

        

        

        

        .support-page-grid {
            gap:16px;
        }

        .support-info-card {
            padding:18px;
        }

        .support-info-card p,
        .support-info-card li {
            color:var(--muted);
            font-size:14px;
            line-height:1.7;
        }

        @media (max-width:720px) {
            .center-shell {
                padding:24px 16px 34px;
            }

            .card {
                padding:32px 22px 28px;
            }

            h1 {
                font-size:34px;
            }

            .customer-nav a {
                font-size:12px;
                padding:9px 5px;
            }

            
        }

    
        /* v10.0 — fulfillment queue, clarifications and product pause */
        .fulfillment-filters {
            display:flex;
            gap:8px;
            flex-wrap:wrap;
            margin:18px 0;
        }

        .fulfillment-filters a {
            display:inline-flex;
            align-items:center;
            gap:8px;
            min-height:40px;
            padding:0 13px;
            border:1px solid var(--border);
            border-radius:11px;
            background:rgba(13,15,18,.72);
            color:var(--muted);
            font:700 12px Arial,Helvetica,sans-serif;
        }

        .fulfillment-filters a strong {
            color:var(--text);
        }

        .fulfillment-filters a.active {
            background:var(--surface3);
            border-color:var(--border2);
            color:var(--text);
        }

        .fulfillment-workspace {
            display:grid;
            grid-template-columns:minmax(280px,340px) minmax(0,1fr);
            gap:14px;
            align-items:start;
        }

        .fulfillment-queue,
        .fulfillment-detail {
            border:1px solid var(--border);
            border-radius:18px;
            background:rgba(13,15,18,.95);
        }

        .fulfillment-queue {
            position:sticky;
            top:18px;
            max-height:calc(100vh - 36px);
            overflow:hidden;
        }

        .fulfillment-queue-head {
            padding:16px 16px 12px;
            border-bottom:1px solid var(--border);
        }

        .fulfillment-queue-head h3 {
            margin:0;
        }

        .fulfillment-queue-list {
            max-height:calc(100vh - 120px);
            overflow:auto;
            padding:8px;
        }

        .fulfillment-queue-item {
            display:block;
            padding:13px;
            border:1px solid transparent;
            border-radius:12px;
            color:var(--text);
        }

        .fulfillment-queue-item + .fulfillment-queue-item {
            margin-top:5px;
        }

        .fulfillment-queue-item:hover {
            background:rgba(255,255,255,.035);
        }

        .fulfillment-queue-item.selected {
            background:var(--surface3);
            border-color:var(--border2);
        }

        .queue-item-top {
            display:flex;
            justify-content:space-between;
            gap:8px;
            align-items:flex-start;
            font:700 13px Arial,Helvetica,sans-serif;
        }

        .queue-code {
            margin-top:7px;
            color:#dfe3e8;
            font:800 13px Arial,Helvetica,sans-serif;
            letter-spacing:.02em;
        }

        .queue-meta {
            display:flex;
            flex-wrap:wrap;
            gap:5px;
            margin-top:6px;
            color:var(--muted);
            font:600 11px Arial,Helvetica,sans-serif;
        }

        .queue-badge {
            flex:0 0 auto;
            padding:4px 7px;
            border:1px solid var(--border);
            border-radius:999px;
            font:800 9px Arial,Helvetica,sans-serif;
        }

        .queue-badge.processing { color:var(--yellow); }
        .queue-badge.waiting { color:#8fb9ff; }
        .queue-badge.overdue {
            color:#ff9d9d;
            border-color:rgba(255,146,146,.30);
            background:rgba(255,146,146,.07);
        }

        .fulfillment-detail {
            min-height:560px;
            padding:24px;
        }

        .fulfillment-detail-head {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:20px;
            padding-bottom:18px;
            border-bottom:1px solid var(--border);
        }

        .fulfillment-detail-head h2 {
            margin-top:10px;
        }

        .fulfillment-time-box {
            min-width:132px;
            padding:11px 13px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#090b0e;
            text-align:right;
        }

        .fulfillment-time-box small,
        .fulfillment-time-box strong {
            display:block;
        }

        .fulfillment-time-box small {
            color:var(--muted);
            font:700 10px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.07em;
        }

        .fulfillment-time-box strong {
            margin-top:4px;
            font:800 16px Arial,Helvetica,sans-serif;
        }

        .fulfillment-data-grid {
            display:grid;
            grid-template-columns:repeat(3,minmax(0,1fr));
            gap:10px;
            margin:18px 0;
        }

        .clarification-limits {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:10px;
            margin:0 0 18px;
        }

        .clarification-limits > div {
            padding:12px 13px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#090b0e;
        }

        .clarification-limits span,
        .clarification-limits strong {
            display:block;
            font-family:Arial,Helvetica,sans-serif;
        }

        .clarification-limits span {
            color:var(--muted);
            font-size:11px;
        }

        .clarification-limits strong {
            margin-top:4px;
            font-size:12px;
        }

        .attention-box,
        .admin-clarification-box {
            margin:16px 0;
            padding:15px;
            border:1px solid var(--border);
            border-radius:13px;
            background:#0a0c0f;
        }

        .attention-box.warning {
            border-color:rgba(230,207,136,.28);
            background:rgba(230,207,136,.045);
        }

        .attention-box p {
            margin:7px 0 0;
            color:var(--muted);
            font:500 13px/1.6 Arial,Helvetica,sans-serif;
        }

        .admin-clarification-box summary,
        .customer-clarification-box summary {
            cursor:pointer;
            color:var(--text);
            font:800 13px Arial,Helvetica,sans-serif;
        }

        .admin-clarification-box form {
            margin-top:14px;
        }

        .fulfillment-fields {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:12px;
            margin:16px 0 12px;
        }

        .fulfillment-fields textarea {
            min-height:180px;
        }

        .clarification-history {
            margin-top:24px;
            padding-top:20px;
            border-top:1px solid var(--border);
        }

        .clarification-history-item {
            padding:13px 0;
            border-bottom:1px solid var(--border);
        }

        .clarification-history-head {
            display:flex;
            justify-content:space-between;
            gap:12px;
            font:700 12px Arial,Helvetica,sans-serif;
        }

        .clarification-history-head span {
            color:var(--muted);
            font-weight:500;
        }

        .clarification-history-item p {
            margin:7px 0 0;
            color:var(--muted);
            font:500 12px/1.55 Arial,Helvetica,sans-serif;
        }

        .change-line {
            display:grid;
            grid-template-columns:70px 1fr 1fr;
            gap:8px;
            align-items:center;
            margin-top:8px;
            font:600 11px Arial,Helvetica,sans-serif;
        }

        .change-line span { color:var(--muted); }
        .change-line del { color:#ff9d9d; overflow-wrap:anywhere; }
        .change-line strong { color:#9de9b8; overflow-wrap:anywhere; }

        .fulfillment-footer-actions {
            margin-top:18px;
            display:flex;
            justify-content:flex-end;
        }

        .fulfillment-empty {
            display:grid;
            min-height:510px;
            place-items:center;
        }

        .customer-clarification-box {
            margin:14px 0;
            padding:14px;
            border:1px solid var(--border);
            border-radius:13px;
            background:#0a0c0f;
        }

        .customer-clarification-box[open] summary {
            margin-bottom:12px;
        }

        .clarification-intro {
            margin-bottom:13px;
            color:var(--muted);
            font:500 13px/1.6 Arial,Helvetica,sans-serif;
        }

        .operator-request-box {
            margin:18px 0;
            padding:15px;
            border:1px solid rgba(143,185,255,.26);
            border-radius:13px;
            background:rgba(100,145,220,.055);
        }

        .operator-request-box span,
        .operator-request-box strong {
            display:block;
            font-family:Arial,Helvetica,sans-serif;
        }

        .operator-request-box span {
            color:#8fb9ff;
            font-size:11px;
            font-weight:800;
            text-transform:uppercase;
            letter-spacing:.08em;
        }

        .operator-request-box strong {
            margin-top:7px;
            font-size:14px;
            line-height:1.55;
        }

        .overdue-customer-box {
            margin-top:18px;
            padding:16px;
            border:1px solid rgba(255,166,83,.36);
            border-radius:14px;
            background:rgba(255,153,64,.075);
        }

        .overdue-customer-title {
            font:800 14px Arial,Helvetica,sans-serif;
            color:#ffc078;
        }

        .overdue-customer-box p {
            margin:8px 0 14px;
            color:#c9b49f;
            font:500 13px/1.6 Arial,Helvetica,sans-serif;
        }

        .warning-pill {
            color:#ffc078;
        }

        .product-pause-panel {
            display:grid;
            grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);
            gap:22px;
            align-items:start;
            padding:20px;
            margin-bottom:18px;
        }

        .product-pause-copy p {
            margin-bottom:0;
        }

        .product-pause-form {
            display:grid;
            gap:10px;
        }

        .product-pause-form textarea {
            min-height:100px;
        }

        .admin-search-row {
            padding:12px;
            display:grid;
            grid-template-columns:1fr auto;
            gap:8px;
            margin-bottom:18px;
        }

        .admin-overview-stats {
            grid-template-columns:repeat(5,minmax(0,1fr));
        }

        .admin-overview-callout {
            display:flex;
            justify-content:space-between;
            align-items:center;
            gap:22px;
            margin:22px 0 28px;
            padding:18px;
            border:1px solid var(--border);
            border-radius:15px;
            background:rgba(13,15,18,.88);
        }

        .admin-overview-callout h2 {
            font-size:22px;
        }

        .admin-overview-callout p {
            margin:7px 0 0;
            color:var(--muted);
            font:500 13px/1.55 Arial,Helvetica,sans-serif;
        }

        

        

        

        

        @media (max-width:1100px) {
            .fulfillment-workspace {
                grid-template-columns:300px minmax(0,1fr);
            }

            .fulfillment-data-grid {
                grid-template-columns:1fr 1fr;
            }

            .admin-overview-stats {
                grid-template-columns:repeat(3,minmax(0,1fr));
            }
        }

        @media (max-width:820px) {
            .fulfillment-workspace {
                grid-template-columns:1fr;
            }

            .fulfillment-queue {
                position:static;
                max-height:none;
            }

            .fulfillment-queue-list {
                max-height:360px;
            }

            .fulfillment-fields,
            .clarification-limits,
            .product-pause-panel {
                grid-template-columns:1fr;
            }

            .fulfillment-data-grid {
                grid-template-columns:1fr;
            }

            .admin-overview-stats {
                grid-template-columns:1fr 1fr;
            }

            .admin-overview-callout {
                align-items:flex-start;
                flex-direction:column;
            }
        }

        @media (max-width:560px) {
            .admin-overview-stats {
                grid-template-columns:1fr;
            }

            .admin-search-row {
                grid-template-columns:1fr;
            }

            .fulfillment-detail {
                padding:18px;
            }

            .fulfillment-detail-head {
                flex-direction:column;
            }

            .fulfillment-time-box {
                width:100%;
                text-align:left;
            }

            .change-line {
                grid-template-columns:1fr;
            }
        }

    
        /* v10.1 — customer visual refinement */
        :root {
            --accent:#2f6df6;
            --accent-hover:#3f7cff;
            --accent-soft:rgba(47,109,246,.12);
            --accent-border:rgba(87,139,255,.34);
        }

        .customer-card {
            border-color:#252b34;
            background:
                linear-gradient(180deg, rgba(15,17,21,.985), rgba(10,12,15,.985));
        }

        .customer-card h1 {
            max-width:560px;
            margin-bottom:12px;
            font-size:42px;
            letter-spacing:-.04em;
        }

        .customer-card > .muted,
        .customer-card > div > .muted {
            max-width:560px;
        }

        .customer-form {
            margin-top:22px;
        }

        .field-group {
            display:grid;
            gap:7px;
        }

        .text-input,
        .code-input,
        textarea,
        select {
            transition:
                border-color .16s ease,
                box-shadow .16s ease,
                background .16s ease;
        }

        .text-input:focus,
        .code-input:focus,
        textarea:focus,
        select:focus {
            border-color:var(--accent) !important;
            background:#0a0d12;
            box-shadow:0 0 0 3px rgba(47,109,246,.12);
        }

        .field-error-input {
            border-color:rgba(239,104,112,.72) !important;
            box-shadow:0 0 0 3px rgba(239,104,112,.08);
        }

        .field-error {
            color:#ef8a90;
            font:600 12px/1.4 Arial,Helvetica,sans-serif;
        }

        .primary-button {
            border-color:var(--accent) !important;
            background:var(--accent) !important;
            color:#fff !important;
            box-shadow:0 10px 28px rgba(47,109,246,.18);
            transition:
                transform .16s ease,
                background .16s ease,
                border-color .16s ease,
                box-shadow .16s ease;
        }

        .primary-button:hover {
            background:var(--accent-hover) !important;
            border-color:var(--accent-hover) !important;
            color:#fff !important;
            transform:translateY(-1px);
            box-shadow:0 14px 34px rgba(47,109,246,.24);
        }

        .primary-button:focus-visible,
        .secondary-button:focus-visible,
        .contact-button:focus-visible,
        .copy-button:focus-visible,
        .customer-nav a:focus-visible{
            outline:none;
            box-shadow:0 0 0 3px rgba(47,109,246,.20);
        }

        .secondary-button,
        .contact-button,
        .copy-button {
            transition:
                transform .16s ease,
                background .16s ease,
                border-color .16s ease,
                color .16s ease;
        }

        .customer-nav {
            padding:4px;
            border-radius:13px;
            background:rgba(10,12,15,.88);
        }

        .customer-nav a {
            min-height:40px;
            border-radius:9px;
            color:#8e96a1;
        }

        .customer-nav a:hover {
            color:#d6dbe2;
            background:rgba(255,255,255,.025);
        }

        .customer-nav a.active {
            background:var(--accent-soft);
            color:#dce7ff;
            box-shadow:inset 0 0 0 1px var(--accent-border);
        }

        

        

        .compact-alert {
            margin:16px 0;
            padding:10px 12px;
            border-radius:10px;
            font:600 12px/1.5 Arial,Helvetica,sans-serif;
        }

        .compact-alert.error {
            border-color:rgba(239,104,112,.24);
            background:rgba(239,104,112,.055);
            color:#eaa1a6;
        }

        .compact-alert.success {
            border-color:rgba(99,190,136,.24);
            background:rgba(99,190,136,.055);
            color:#9bd8b3;
        }

        .info-strip,
        .subtle-note,
        .order-info {
            margin:18px 0;
            padding:14px 0;
            border-top:1px solid var(--border);
            color:#aab1bb;
            font:500 13px/1.65 Arial,Helvetica,sans-serif;
        }

        .subtle-note {
            margin:12px 0;
            padding:11px 0;
            color:#8f98a4;
            font-size:12px;
        }

        .order-info {
            display:grid;
            gap:8px;
        }

        .order-info p {
            margin:0;
            color:#9ca4ae;
            font:500 13px/1.62 Arial,Helvetica,sans-serif;
        }

        .prominent-code {
            border-color:var(--accent-border) !important;
            background:
                linear-gradient(180deg, rgba(47,109,246,.075), rgba(9,12,17,.92)) !important;
            box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
        }

        .prominent-code span {
            color:#8ea7d9 !important;
        }

        .prominent-code strong {
            font-size:18px !important;
            letter-spacing:.045em;
            color:#f2f6ff;
            overflow-wrap:anywhere;
        }

        .standalone-code {
            display:grid;
            grid-template-columns:1fr auto;
            align-items:center;
            gap:10px;
            margin:20px 0 12px;
            padding:15px 16px;
            border:1px solid var(--accent-border);
            border-radius:13px;
        }

        .standalone-code span {
            color:#8ea7d9;
            font:700 11px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.08em;
        }

        .standalone-code strong {
            font:800 17px Arial,Helvetica,sans-serif;
            letter-spacing:.04em;
        }

        .small-muted {
            font-size:13px !important;
            line-height:1.6 !important;
        }

        .button-row {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:9px;
            margin-top:20px;
        }

        /* Order progress: one calm line with three points. */
        .flow {
            display:grid;
            grid-template-columns:repeat(3,1fr);
            gap:0;
            margin:28px 0 24px;
        }

        .flow-item {
            position:relative;
            padding:24px 6px 0;
            border-top:0 !important;
            color:#606975;
            text-align:center;
            font:700 10px/1.35 Arial,Helvetica,sans-serif;
        }

        .flow-item::before {
            content:"";
            position:absolute;
            z-index:2;
            top:0;
            left:50%;
            width:11px;
            height:11px;
            border:2px solid #3b434e;
            border-radius:50%;
            background:#111419;
            transform:translateX(-50%);
        }

        .flow-item:not(:last-child)::after {
            content:"";
            position:absolute;
            z-index:1;
            top:5px;
            left:50%;
            width:100%;
            height:2px;
            background:#252b33;
        }

        .flow-item.done {
            color:#b7bec7;
        }

        .flow-item.done::before {
            border-color:#b8c0ca;
            background:#b8c0ca;
        }

        .flow-item.done:not(:last-child)::after {
            background:#56606d;
        }

        .flow-item.current,
        .flow-item.current-final {
            color:#8fb1ff;
        }

        .flow-item.current::before,
        .flow-item.current-final::before {
            border-color:var(--accent);
            background:var(--accent);
            box-shadow:0 0 0 4px rgba(47,109,246,.12);
        }

        .calm-timer {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
            padding:15px 17px;
            border-color:#242a33;
            background:#0a0c0f;
        }

        .timer-copy {
            display:grid;
            gap:4px;
        }

        .timer-label {
            color:#c8ced6;
            font:700 12px/1.4 Arial,Helvetica,sans-serif;
        }

        .timer-hint {
            color:#6f7884;
            font:600 10px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.07em;
        }

        .calm-timer .timer {
            flex:0 0 auto;
            font-size:21px;
            letter-spacing:.035em;
            color:#dce2ea;
        }

        .customer-data-row {
            padding:12px 14px;
            border-color:#1f252d;
            background:transparent;
        }

        .customer-data-row strong {
            font-size:13px !important;
            color:#c4cad2;
        }

        .customer-clarification-box {
            margin:16px 0;
            padding:0;
            border:0;
            background:transparent;
        }

        .customer-clarification-box summary {
            display:inline-flex;
            min-height:38px;
            align-items:center;
            padding:0 12px;
            border:1px solid var(--border2);
            border-radius:10px;
            background:#12161b;
            color:#cbd1d9;
            list-style:none;
            transition:background .16s ease,border-color .16s ease,color .16s ease;
        }

        .customer-clarification-box summary::-webkit-details-marker {
            display:none;
        }

        .customer-clarification-box summary:hover {
            border-color:#394352;
            background:#171c22;
            color:#fff;
        }

        .customer-clarification-box[open] {
            padding:14px;
            border:1px solid var(--border);
            border-radius:13px;
            background:#0a0c0f;
        }

        .customer-clarification-box[open] summary {
            margin-bottom:12px;
        }

        .operator-request-box {
            border-color:var(--accent-border);
            background:rgba(47,109,246,.055);
        }

        .operator-request-box span {
            color:#87aaff;
        }

        .info-pill {
            color:#87aaff;
        }

        .neutral-pill {
            color:#9ba3ad;
        }

        .overdue-customer-box {
            border-color:rgba(224,168,94,.30);
            background:rgba(224,168,94,.055);
        }

        .overdue-customer-title {
            color:#e8bd7f;
            font-size:14px;
        }

        .overdue-customer-box p {
            color:#bba88e;
            margin:7px 0 12px;
        }

        .telegram-support-button {
            border-color:var(--accent) !important;
            background:var(--accent) !important;
            color:#fff !important;
            box-shadow:0 10px 28px rgba(47,109,246,.16);
        }

        .telegram-support-button:hover {
            background:var(--accent-hover) !important;
            border-color:var(--accent-hover) !important;
            box-shadow:0 14px 32px rgba(47,109,246,.22);
        }

        .ready-mark {
            width:42px;
            height:42px;
            display:grid;
            place-items:center;
            margin-bottom:14px;
            border:1px solid var(--accent-border);
            border-radius:50%;
            background:var(--accent-soft);
            color:#a9c1ff;
            font:900 20px Arial,Helvetica,sans-serif;
        }

        .result-section-primary {
            margin-top:26px;
        }

        .result-box-primary {
            border-color:var(--accent-border);
            background:linear-gradient(180deg, rgba(47,109,246,.06), #080a0d);
        }

        .copy-button-accent {
            border-color:var(--accent-border);
            background:var(--accent-soft);
            color:#cfe0ff;
        }

        .copy-button-accent:hover {
            border-color:var(--accent);
            background:rgba(47,109,246,.18);
            color:#fff;
        }

        .secondary-result-section {
            opacity:.82;
        }

        .copy-feedback {
            color:#8e98a4;
            font-size:12px;
        }

        .customer-code-footer {
            margin-top:26px;
            padding-top:16px;
            border-top:1px solid var(--border);
            color:#727b86;
            font:500 11px/1.6 Arial,Helvetica,sans-serif;
        }

        .customer-code-footer strong {
            color:#9ba4af;
        }

        .compact-support {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
            padding:15px 16px;
            background:rgba(10,12,15,.78);
        }

        .compact-support .support-title {
            margin-bottom:4px;
        }

        .compact-support .support-text {
            margin:0;
            max-width:440px;
        }

        .compact-support .contact-button {
            flex:0 0 auto;
            min-width:112px;
        }

        /* Simplified support page */
        .support-simple-list {
            display:grid;
            gap:0;
            margin-top:28px;
            border-top:1px solid var(--border);
        }

        .support-simple-row {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:20px;
            padding:17px 2px;
            border-bottom:1px solid var(--border);
            color:var(--text);
        }

        .support-simple-row:last-child {
            border-bottom:0;
        }

        .support-simple-row strong {
            display:block;
            margin-bottom:5px;
            font:800 14px Arial,Helvetica,sans-serif;
        }

        .support-simple-row p {
            margin:0;
            color:var(--muted);
            font:500 13px/1.55 Arial,Helvetica,sans-serif;
        }

        .support-simple-link {
            text-decoration:none;
        }

        .support-simple-link:hover {
            background:rgba(255,255,255,.018);
        }

        .support-row-badge,
        .support-row-action {
            flex:0 0 auto;
            color:#8faeff;
            font:700 12px Arial,Helvetica,sans-serif;
            overflow-wrap:anywhere;
            text-align:right;
        }

        .support-hours {
            margin-top:24px;
            padding-top:0;
            border-top:0;
        }

        .support-market-note {
            margin-top:24px;
            padding-top:18px;
            border-top:1px solid var(--border);
        }

        .support-hours strong,
        .support-market-note strong {
            display:block;
            margin-bottom:6px;
            font:800 13px Arial,Helvetica,sans-serif;
        }

        .support-hours p,
        .support-market-note p {
            margin:0;
            color:var(--muted);
            font:500 13px/1.62 Arial,Helvetica,sans-serif;
        }

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        

        @media (max-width:720px) {
            .customer-card h1 {
                font-size:34px;
            }

            .compact-support {
                align-items:stretch;
                flex-direction:column;
                gap:12px;
            }

            .compact-support .contact-button {
                width:100%;
            }

            .calm-timer {
                align-items:flex-start;
                flex-direction:column;
                gap:10px;
            }

            .calm-timer .timer {
                font-size:20px;
            }

            .button-row {
                grid-template-columns:1fr;
            }

            .support-simple-row {
                align-items:flex-start;
                flex-direction:column;
                gap:9px;
            }

            .support-row-action {
                text-align:left;
            }

            .prominent-code {
                grid-template-columns:1fr auto;
            }
        }

        @media (max-width:480px) {
            .center-shell {
                padding-left:14px;
                padding-right:14px;
            }

            .card {
                padding:28px 19px 24px;
            }

            .customer-nav a {
                font-size:11px;
                padding-left:4px;
                padding-right:4px;
            }

            .flow-item {
                padding-left:2px;
                padding-right:2px;
                font-size:9px;
            }

            .prominent-code strong {
                font-size:16px !important;
            }
        }

    
        /* v10.2 — preparation terminology and privacy page */
        .legal-footer {
            display:flex;
            justify-content:center;
            margin:16px auto 0;
            padding:0 8px 6px;
            width:min(100%,620px);
        }

        .legal-footer a {
            color:#69727e;
            font:600 11px/1.4 Arial,Helvetica,sans-serif;
            text-decoration:none;
            transition:color .16s ease;
        }

        .legal-footer a:hover {
            color:#aeb6c0;
        }

        .privacy-card {
            padding-bottom:30px;
        }

        .privacy-content {
            display:grid;
            gap:0;
            margin-top:26px;
            border-top:1px solid var(--border);
        }

        .privacy-content section {
            padding:19px 0;
            border-bottom:1px solid var(--border);
        }

        .privacy-content h2 {
            margin:0 0 9px;
            color:var(--text);
            font:800 15px/1.35 Arial,Helvetica,sans-serif;
            letter-spacing:-.01em;
        }

        .privacy-content p,
        .privacy-content li {
            color:var(--muted);
            font:500 13px/1.65 Arial,Helvetica,sans-serif;
        }

        .privacy-content p {
            margin:0;
        }

        .privacy-content p + p {
            margin-top:9px;
        }

        .privacy-content ul {
            margin:9px 0;
            padding-left:20px;
        }

        .privacy-content li + li {
            margin-top:5px;
        }

        .support-market-note a {
            color:#8faeff;
            text-decoration:none;
        }

        .support-market-note a:hover {
            text-decoration:underline;
        }

        

        

        @media (max-width:480px) {
            .privacy-content section {
                padding:17px 0;
            }

            .privacy-content h2 {
                font-size:14px;
            }

            .privacy-content p,
            .privacy-content li {
                font-size:12px;
            }
        }

    
        /* v10.3 — templates, tickets, CSV export and manual backup */
        .nav-count {
            display:inline-grid;
            place-items:center;
            min-width:18px;
            height:18px;
            margin-left:6px;
            padding:0 5px;
            border-radius:999px;
            background:rgba(47,109,246,.18);
            color:#9ab8ff;
            font:800 10px Arial,Helvetica,sans-serif;
        }

        .create-template-details {
            grid-column:1 / -1;
            border:1px solid var(--border);
            border-radius:12px;
            background:#0b0d11;
        }

        .create-template-details > summary {
            cursor:pointer;
            padding:13px 14px;
            color:#c8ced7;
            font:800 12px Arial,Helvetica,sans-serif;
            list-style:none;
        }

        .create-template-details > summary::-webkit-details-marker { display:none; }

        .create-template-body {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:14px;
            padding:0 14px 14px;
        }

        .create-template-body > .data-checkbox,
        .create-template-body > .form-hint { grid-column:1 / -1; }

        .create-template-body textarea,
        .template-fields-grid textarea { min-height:120px; }

        .template-settings-row { margin-top:16px; }

        .template-fields-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:14px;
            margin-top:14px;
        }

        .template-variables {
            display:flex;
            align-items:center;
            flex-wrap:wrap;
            gap:7px;
            margin-top:10px;
            color:#6f7885;
            font:600 11px Arial,Helvetica,sans-serif;
        }

        .template-variables code {
            padding:5px 7px;
            border:1px solid var(--border);
            border-radius:7px;
            background:#0a0c0f;
            color:#91adf6;
            font:700 11px ui-monospace,SFMono-Regular,Consolas,monospace;
        }

        .template-badge { color:#90b0ff; }

        .template-applied-note {
            margin:10px 0 14px;
            padding:10px 12px;
            border:1px solid rgba(47,109,246,.22);
            border-radius:10px;
            background:rgba(47,109,246,.06);
            color:#91adf6;
            font:600 11px/1.5 Arial,Helvetica,sans-serif;
        }

        /* Customer ticket area */
        .customer-ticket-support {
            margin-top:30px;
            padding-top:24px;
            border-top:1px solid var(--border);
        }

        .ticket-support-head {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:16px;
        }

        .ticket-support-head h2 {
            margin:4px 0 7px;
            font-size:20px;
            letter-spacing:-.02em;
        }

        .ticket-support-head p {
            margin:0;
            color:var(--muted);
            font:500 13px/1.55 Arial,Helvetica,sans-serif;
        }

        .ticket-limit-badge {
            flex:0 0 auto;
            padding:5px 8px;
            border:1px solid var(--border);
            border-radius:999px;
            color:#78818d;
            font:700 10px Arial,Helvetica,sans-serif;
        }

        .customer-ticket-create {
            margin-top:16px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#0a0c0f;
        }

        .customer-ticket-create > summary,
        .customer-ticket-history > summary {
            cursor:pointer;
            list-style:none;
            padding:13px 14px;
            color:#cbd2db;
            font:800 12px Arial,Helvetica,sans-serif;
        }

        .customer-ticket-create > summary::-webkit-details-marker,
        .customer-ticket-history > summary::-webkit-details-marker { display:none; }

        .customer-ticket-form,
        .customer-ticket-reply { padding:0 14px 14px; }

        .customer-ticket-form select { min-height:46px; }

        .customer-ticket-active {
            margin-top:16px;
            padding:14px;
            border:1px solid rgba(47,109,246,.24);
            border-radius:13px;
            background:rgba(47,109,246,.035);
        }

        .customer-ticket-meta {
            display:flex;
            align-items:center;
            flex-wrap:wrap;
            gap:9px;
            margin-bottom:13px;
        }

        .customer-ticket-meta strong {
            font:800 12px Arial,Helvetica,sans-serif;
            color:#d6dce4;
        }

        .customer-ticket-thread,
        .ticket-thread {
            display:grid;
            gap:9px;
        }

        .customer-ticket-message {
            max-width:88%;
            padding:10px 12px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#0b0e12;
        }

        .customer-ticket-message.customer {
            justify-self:end;
            border-color:rgba(47,109,246,.23);
            background:rgba(47,109,246,.075);
        }

        .customer-ticket-message.admin { justify-self:start; }

        .customer-ticket-message span,
        .customer-ticket-message small {
            display:block;
            color:#6f7884;
            font:700 9px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.06em;
        }

        .customer-ticket-message p {
            margin:5px 0 6px;
            color:#d5dbe3;
            white-space:pre-wrap;
            overflow-wrap:anywhere;
            font:500 13px/1.5 Arial,Helvetica,sans-serif;
        }

        .customer-ticket-reply {
            margin-top:13px;
            padding:13px 0 0;
            border-top:1px solid var(--border);
        }

        .customer-ticket-history {
            margin-top:14px;
            border-top:1px solid var(--border);
        }

        .customer-ticket-history > summary { padding-left:0; padding-right:0; }

        .customer-ticket-history-item {
            padding:11px 0;
            border-top:1px solid var(--border);
        }

        .customer-ticket-history-head {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:12px;
            margin-bottom:10px;
        }

        .customer-ticket-history-item span {
            color:#74b58b;
            font-size:10px;
        }

        .customer-ticket-history-item p {
            margin:5px 0;
            color:#8f98a4;
            font:500 12px/1.5 Arial,Helvetica,sans-serif;
        }

        .ticket-status {
            display:inline-flex;
            align-items:center;
            min-height:22px;
            padding:0 8px;
            border:1px solid var(--border);
            border-radius:999px;
            color:#8d96a2;
            font:800 9px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.05em;
        }

        .ticket-status.new,
        .ticket-status.in_progress {
            border-color:rgba(47,109,246,.28);
            background:rgba(47,109,246,.08);
            color:#8eafff;
        }

        .ticket-status.awaiting_customer {
            border-color:rgba(224,168,94,.27);
            background:rgba(224,168,94,.06);
            color:#ddb77f;
        }

        .ticket-status.resolved {
            border-color:rgba(99,190,136,.25);
            background:rgba(99,190,136,.06);
            color:#8ecba5;
        }

        /* Admin tickets */
        .ticket-filters {
            display:flex;
            flex-wrap:wrap;
            gap:7px;
            margin:0 0 12px;
        }

        .ticket-filters a {
            display:inline-flex;
            align-items:center;
            gap:7px;
            min-height:35px;
            padding:0 10px;
            border:1px solid var(--border);
            border-radius:9px;
            background:#0d1014;
            color:#7d8692;
            text-decoration:none;
            font:700 11px Arial,Helvetica,sans-serif;
        }

        .ticket-filters a span { color:#59616c; }

        .ticket-filters a.active {
            border-color:rgba(47,109,246,.28);
            background:rgba(47,109,246,.075);
            color:#9bb7ff;
        }

        .tickets-workspace {
            display:grid;
            grid-template-columns:minmax(260px,340px) minmax(0,1fr);
            gap:12px;
            align-items:start;
        }

        .tickets-list {
            max-height:72vh;
            overflow:auto;
            padding:6px;
        }

        .ticket-list-item {
            display:block;
            padding:12px;
            border:1px solid transparent;
            border-radius:10px;
            color:inherit;
            text-decoration:none;
            transition:.15s ease;
        }

        .ticket-list-item + .ticket-list-item { margin-top:4px; }
        .ticket-list-item:hover { background:#101419; }

        .ticket-list-item.active {
            border-color:rgba(47,109,246,.25);
            background:rgba(47,109,246,.055);
        }

        .ticket-list-top {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:8px;
            margin-bottom:7px;
        }

        .ticket-unread-dot {
            width:8px;
            height:8px;
            border-radius:50%;
            background:#4f83ff;
            box-shadow:0 0 0 3px rgba(47,109,246,.11);
        }

        .ticket-list-item > strong {
            display:block;
            color:#d4dae2;
            font:800 13px Arial,Helvetica,sans-serif;
        }

        .ticket-list-code,
        .ticket-list-category {
            display:block;
            margin-top:4px;
            color:#717a86;
            font:600 10px/1.4 Arial,Helvetica,sans-serif;
        }

        .ticket-list-item p {
            display:-webkit-box;
            -webkit-line-clamp:2;
            -webkit-box-orient:vertical;
            overflow:hidden;
            margin:8px 0 5px;
            color:#8d96a2;
            font:500 11px/1.45 Arial,Helvetica,sans-serif;
        }

        .ticket-list-item small { color:#545c67; font-size:9px; }

        .ticket-detail { min-height:460px; padding:18px; }

        .ticket-detail-head {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:16px;
            padding-bottom:16px;
            border-bottom:1px solid var(--border);
        }

        .ticket-detail-head h2 { margin:9px 0 5px; }

        .ticket-meta-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:9px;
            margin:14px 0;
        }

        .ticket-thread {
            max-height:430px;
            overflow:auto;
            padding:12px;
            border:1px solid var(--border);
            border-radius:12px;
            background:#080a0d;
        }

        .ticket-message {
            max-width:80%;
            padding:10px 12px;
            border:1px solid var(--border);
            border-radius:11px;
            background:#0d1014;
        }

        .ticket-message.customer { justify-self:start; }
        .ticket-message.admin {
            justify-self:end;
            border-color:rgba(47,109,246,.24);
            background:rgba(47,109,246,.07);
        }

        .ticket-message-author,
        .ticket-message-time {
            color:#68717d;
            font:700 9px Arial,Helvetica,sans-serif;
            text-transform:uppercase;
            letter-spacing:.05em;
        }

        .ticket-message-body {
            margin:5px 0 7px;
            color:#d8dde5;
            white-space:pre-wrap;
            overflow-wrap:anywhere;
            font:500 13px/1.5 Arial,Helvetica,sans-serif;
        }

        .ticket-reply-form {
            margin-top:14px;
            padding-top:14px;
            border-top:1px solid var(--border);
        }

        .ticket-reply-form textarea { min-height:110px; }
        .ticket-actions-row { display:flex; justify-content:flex-end; margin-top:9px; }
        .ticket-resolve-form { margin-top:8px; text-align:right; }

        /* CSV + manual backup */
        .stats-export-panel { padding:16px; }

        .stats-export-form {
            display:grid;
            grid-template-columns:1.15fr 1fr 1fr 1.5fr 1.2fr auto;
            gap:10px;
            align-items:end;
        }

        .stats-export-form select,
        .stats-export-form input { width:100%; }

        .manual-backup-panel {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:24px;
            padding:18px;
        }

        .manual-backup-panel h3 { margin:0 0 6px; }
        .manual-backup-panel p { margin:4px 0; max-width:760px; }

        

        

        

        

        

        @media (max-width:1050px) {
            .stats-export-form { grid-template-columns:repeat(3,1fr); }
            .tickets-workspace { grid-template-columns:300px minmax(0,1fr); }
        }

        @media (max-width:820px) {
            .tickets-workspace { grid-template-columns:1fr; }
            .tickets-list { max-height:360px; }
            .template-fields-grid,
            .create-template-body { grid-template-columns:1fr; }
            .create-template-body > * { grid-column:1 !important; }
            .manual-backup-panel { align-items:stretch; flex-direction:column; }
            .manual-backup-panel form,
            .manual-backup-panel button { width:100%; }
        }

        @media (max-width:650px) {
            .stats-export-form { grid-template-columns:1fr 1fr; }
            .stats-export-form .primary-button { grid-column:1 / -1; }
            .ticket-meta-grid { grid-template-columns:1fr; }
            .ticket-detail-head { flex-direction:column; }
            .ticket-message { max-width:92%; }
            .ticket-support-head { flex-direction:column; }
            .customer-ticket-message { max-width:94%; }
        }


        /* auto delivery, ticket inbox, stock status, system journal */
        .auto-delivery-badge { border-color:rgba(126,176,255,.22)!important; color:#aecdff!important; background:rgba(91,143,220,.08)!important; }
        .stock-out-badge { border-color:rgba(255,146,146,.25)!important; color:#ffb0b0!important; background:rgba(255,146,146,.08)!important; }
        .stock-metric.low strong,.stock-stat.low strong { color:var(--yellow); }
        .stock-metric.out strong,.stock-stat.out strong { color:var(--red); }
        .stock-metric.ok strong,.stock-stat.ok strong { color:var(--green); }
        .warning-alert { border-color:rgba(230,207,136,.22); color:#e7dba9; }
        .auto-delivery-settings-row { border-top:1px solid var(--border); padding-top:18px; }
        .post-delivery-settings { display:grid; gap:14px; padding-top:18px; border-top:1px solid var(--border); }
        .post-delivery-fields { grid-template-columns:repeat(3,minmax(0,1fr)); }
        .auto-delivery-panel { padding:18px; margin-top:16px; }
        .auto-delivery-heading { align-items:flex-start; margin-bottom:16px; }
        .auto-delivery-heading .muted { max-width:680px; margin:8px 0 0; }
        .auto-stock-counters { display:flex; gap:8px; flex-wrap:wrap; }
        .auto-delivery-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
        .auto-delivery-form { padding:15px; border:1px solid var(--border); border-radius:14px; background:rgba(8,10,13,.55); }
        .auto-stock-list { margin-top:18px; display:grid; gap:7px; }
        .auto-stock-item { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid var(--border); border-radius:11px; background:#0a0d10; }
        .auto-stock-item > div { min-width:0; display:grid; gap:4px; }
        .auto-stock-item strong { overflow-wrap:anywhere; font-size:12px; }
        .auto-stock-item small { color:var(--muted); font-size:10px; }

        .quick-replies-manager { margin-bottom:14px; padding:0; overflow:hidden; }
        .quick-replies-manager > summary { cursor:pointer; padding:14px 16px; font-size:13px; font-weight:800; list-style:none; }
        .quick-replies-manager > summary::-webkit-details-marker { display:none; }
        .quick-replies-manager-body { padding:0 16px 16px; display:grid; gap:12px; border-top:1px solid var(--border); }
        .quick-reply-edit-grid { display:grid; grid-template-columns:minmax(180px,.6fr) 90px minmax(260px,1.5fr) auto; gap:8px; align-items:start; padding-top:12px; }
        .quick-reply-edit-grid textarea { min-height:56px; }
        .quick-reply-settings-list { display:grid; gap:8px; }
        .quick-reply-edit-grid.existing { padding:10px; border:1px solid var(--border); border-radius:11px; }
        .quick-reply-delete { text-align:right; margin-top:-4px; }
        .quick-reply-chips { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 9px; }
        .quick-reply-chip { border:1px solid var(--border2); border-radius:999px; background:#11151a; color:#c8cdd4; padding:7px 10px; font-size:10px; font-weight:700; cursor:pointer; }
        .quick-reply-chip:hover { background:#1b2027; color:var(--text); }

        .after-delivery-card { margin-top:20px; border:1px solid var(--border); border-radius:16px; background:rgba(10,12,15,.88); overflow:hidden; }
        .after-delivery-row { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px; }
        .after-delivery-row + .after-delivery-row { border-top:1px solid var(--border); }
        .after-delivery-row h2 { font-size:18px; margin:0 0 5px; }
        .after-delivery-row p { margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
        .after-delivery-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }

        .error-log-head { padding:18px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
        .error-log-head .muted { margin:8px 0 0; max-width:720px; }
        .error-log-counter { min-width:130px; padding:12px; border:1px solid var(--border); border-radius:12px; display:grid; gap:4px; text-align:center; }
        .error-log-counter span { color:var(--muted); font-size:10px; }
        .error-log-counter strong { font-size:24px; }
        .error-log-actions { display:flex; justify-content:flex-end; margin:10px 0; }
        .error-log-list { display:grid; gap:9px; }
        .error-log-item { padding:15px; }
        .error-log-item.resolved { opacity:.66; }
        .error-log-top { display:flex; justify-content:space-between; gap:12px; }
        .error-log-top h3 { margin-top:8px; overflow-wrap:anywhere; }
        .error-log-top small { color:var(--muted); }
        .error-log-message { margin-top:12px; padding:11px; border-radius:10px; background:#090b0e; white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; }
        .error-traceback { margin-top:10px; }
        .error-traceback summary { cursor:pointer; color:var(--muted); font-size:11px; }
        .error-traceback pre { overflow:auto; max-height:360px; padding:12px; border:1px solid var(--border); border-radius:10px; background:#07090b; font-size:10px; line-height:1.45; white-space:pre-wrap; }

        .confirm-modal { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:18px; background:rgba(0,0,0,.68); backdrop-filter:blur(7px); }
        .confirm-modal[hidden] { display:none; }
        .confirm-dialog { width:min(100%,470px); padding:20px; border:1px solid var(--border2); border-radius:18px; background:#0f1216; box-shadow:0 28px 90px rgba(0,0,0,.55); }
        .confirm-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:rgba(255,146,146,.09); color:#ffadad; font-size:21px; margin-bottom:14px; }
        .confirm-dialog h2 { margin-bottom:8px; font-size:20px; }
        .confirm-dialog p { color:var(--muted); font-size:13px; line-height:1.55; margin-bottom:18px; }
        .confirm-actions { display:flex; justify-content:flex-end; gap:8px; }

        .not-found-card { width:min(100%,620px); padding:34px; text-align:center; }
        .not-found-code { font-size:74px; line-height:.95; font-weight:900; letter-spacing:-.06em; color:#e9ebef; margin:8px 0 14px; }
        .not-found-actions { display:flex; gap:9px; justify-content:center; flex-wrap:wrap; margin-top:22px; }

        
        

        @media (max-width:760px) {
            .post-delivery-fields,.auto-delivery-grid { grid-template-columns:1fr; }
            .quick-reply-edit-grid { grid-template-columns:1fr; }
            .quick-reply-position { max-width:120px; }
            .after-delivery-row,.error-log-head,.error-log-top { flex-direction:column; align-items:stretch; }
            .after-delivery-actions { justify-content:stretch; }
            .after-delivery-actions a { width:100%; }
            .auto-stock-counters { width:100%; }
        }

    
        /* v10.8 product workspace */
        .product-workspace { padding-bottom:34px; }
        .back-link { color:#858c96; font-size:12px; text-decoration:none; }
        .back-link:hover { color:var(--text); }
        .product-detail-head-v2 { margin-bottom:14px; align-items:flex-end; }
        .product-detail-title h2 { margin:9px 0 7px; font-size:28px; }
        .product-state-line { display:flex; gap:7px; flex-wrap:wrap; }
        .status-mini { display:inline-flex; align-items:center; gap:6px; min-height:25px; padding:5px 9px; border:1px solid var(--border); border-radius:999px; font-size:10px; font-weight:700; color:var(--muted); background:rgba(9,11,14,.58); }
        .status-mini.ok { color:#9de0bd; border-color:rgba(88,199,141,.2); background:rgba(54,154,104,.07); }
        .status-mini.warning { color:#e8d99e; border-color:rgba(218,185,87,.24); background:rgba(181,139,22,.07); }
        .status-mini.accent { color:#b8d0ff; border-color:rgba(90,142,230,.26); background:rgba(62,111,202,.08); }
        .status-mini.off { color:#9da3ad; }
        .product-head-actions { flex-wrap:wrap; }

        .product-overview-strip { display:grid; grid-template-columns:repeat(4,minmax(110px,150px)) minmax(260px,1fr); gap:8px; align-items:stretch; margin:0 0 14px; }
        .overview-metric,.overview-stock-copy { border:1px solid var(--border); border-radius:13px; background:rgba(8,10,13,.72); padding:11px 13px; }
        .overview-metric span { display:block; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.04em; }
        .overview-metric strong { display:block; font-size:19px; margin-top:5px; }
        .overview-metric.stock-low strong { color:#e5d49a; }
        .overview-metric.stock-out strong { color:#ffaaaa; }
        .overview-stock-copy { display:flex; flex-direction:column; justify-content:center; gap:4px; }
        .overview-stock-copy small { color:var(--muted); line-height:1.35; }
        .stock-indicator { font-size:11px; font-weight:800; }
        .stock-indicator.ok { color:#8fdbb2; }
        .stock-indicator.low { color:#e4d08a; }
        .stock-indicator.out { color:#ff9f9f; }
        .product-stock-critical { margin:0 0 14px; }

        .product-tabs { position:sticky; top:10px; z-index:24; display:flex; gap:6px; padding:6px; margin:0 0 14px; border:1px solid var(--border); border-radius:15px; background:rgba(12,14,17,.91); backdrop-filter:blur(16px); box-shadow:0 10px 30px rgba(0,0,0,.18); overflow:auto; scrollbar-width:none; }
        .product-tabs::-webkit-scrollbar { display:none; }
        .product-tabs button { appearance:none; border:0; background:transparent; color:var(--muted); padding:10px 13px; border-radius:10px; font:inherit; font-size:12px; font-weight:750; white-space:nowrap; cursor:pointer; display:flex; align-items:center; gap:7px; }
        .product-tabs button:hover { color:var(--text); background:rgba(255,255,255,.035); }
        .product-tabs button.active { color:#fff; background:#222830; box-shadow:inset 0 0 0 1px rgba(255,255,255,.035); }
        .product-tabs .danger-tab.active { color:#ffb2b2; background:rgba(126,45,45,.16); }
        .tab-counter { min-width:20px; height:20px; padding:0 6px; display:inline-grid; place-items:center; border-radius:999px; background:rgba(255,255,255,.07); font-size:9px; }
        .product-tab-panel[hidden] { display:none!important; }
        .product-tab-panel { display:grid; gap:14px; }
        .workspace-card { padding:18px; margin:0; }
        .workspace-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:16px; }
        .workspace-card-head h2,.workspace-card-head h3 { margin:5px 0 5px; }
        .workspace-card-head .muted { margin:0; max-width:700px; }
        .workspace-card-head.compact-head { margin-bottom:13px; }
        .workspace-field { display:grid; gap:7px; }
        .mode-choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
        .mode-choice { position:relative; display:flex; align-items:flex-start; gap:12px; padding:15px; border:1px solid var(--border); border-radius:14px; background:rgba(8,10,13,.55); cursor:pointer; transition:.18s ease; }
        .mode-choice:hover { border-color:var(--border2); }
        .mode-choice.selected { border-color:rgba(90,143,235,.48); background:rgba(53,103,197,.09); box-shadow:inset 0 0 0 1px rgba(90,143,235,.07); }
        .mode-choice input { position:absolute; opacity:0; pointer-events:none; }
        .mode-choice-check { width:22px; height:22px; flex:0 0 22px; border:1px solid var(--border2); border-radius:7px; background:#0a0c0f; position:relative; }
        .mode-choice.selected .mode-choice-check { background:#edf2ff; border-color:#edf2ff; }
        .mode-choice.selected .mode-choice-check:after { content:"✓"; position:absolute; inset:0; display:grid; place-items:center; color:#111722; font-size:13px; font-weight:900; }
        .mode-choice strong { display:block; margin:1px 0 5px; font-size:14px; }
        .mode-choice small { display:block; color:var(--muted); line-height:1.45; }
        .inline-switch { display:flex; align-items:center; gap:8px; cursor:pointer; white-space:nowrap; color:var(--muted); font-size:11px; }
        .inline-switch input { position:absolute; opacity:0; }
        .inline-switch span { width:34px; height:20px; border-radius:999px; border:1px solid var(--border2); background:#11151a; position:relative; }
        .inline-switch span:after { content:""; position:absolute; width:14px; height:14px; border-radius:50%; top:2px; left:2px; background:#7b838f; transition:.18s ease; }
        .inline-switch input:checked + span { background:#e9eef8; }
        .inline-switch input:checked + span:after { left:16px; background:#111722; }
        .inline-switch b { color:var(--text); font-weight:700; }
        .pause-inline-form { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:end; }
        .pause-inline-form textarea { min-height:82px; }
        .pause-inline-form .strong-note { min-height:58px; }
        .product-save-dock { position:sticky; bottom:10px; z-index:20; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 12px; border:1px solid rgba(90,143,235,.3); border-radius:13px; background:rgba(19,24,32,.94); backdrop-filter:blur(14px); box-shadow:0 14px 40px rgba(0,0,0,.34); }
        .product-save-dock[hidden] { display:none; }
        .product-save-dock span { color:#b9c9e8; font-size:11px; font-weight:700; }
        .workspace-counters { display:flex; gap:8px; flex-wrap:wrap; }
        .workspace-counters span { border:1px solid var(--border); border-radius:10px; padding:8px 10px; color:var(--muted); font-size:10px; }
        .workspace-counters b { color:var(--text); font-size:14px; margin-left:5px; }
        .workspace-grid-gap { gap:12px; }
        .compact-stock-note { margin:10px 0 0; padding:10px 12px; border:1px solid var(--border); border-radius:11px; font-size:11px; }
        .compact-stock-note.low { color:#dfd09a; border-color:rgba(218,185,87,.22); background:rgba(181,139,22,.05); }
        .compact-stock-note.out { color:#ffaaaa; border-color:rgba(236,98,98,.22); background:rgba(183,48,48,.05); }
        .auto-stock-list-v2 { margin-top:0; }
        .masked-payload { min-width:0; display:grid; gap:4px; }
        .masked-payload strong { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.02em; }
        .masked-payload small { color:var(--muted); }
        .codes-tools-v2 { margin:0 0 12px; }
        .compact-table-wrap { margin:0; }
        .tiny { font-size:10px; }

        .sales-link-list { display:grid; gap:8px; }
        .sales-link-row { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(300px,1.3fr); gap:18px; align-items:center; padding:11px 0; border-top:1px solid var(--border); }
        .sales-link-row:first-child { border-top:0; }
        .sales-link-row b,.sales-link-row small { display:block; }
        .sales-link-row b { font-size:12px; margin-bottom:4px; }
        .sales-link-row small { color:var(--muted); line-height:1.4; }
        .sales-preview-card h3 { margin:5px 0 14px; }

        .danger-workspace-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
        .danger-card { padding:18px; display:grid; gap:26px; border-color:rgba(171,92,92,.24); }
        .danger-card.critical { border-color:rgba(215,77,77,.34); background:rgba(92,24,24,.055); }
        .danger-card h3 { margin:6px 0; }
        .danger-card-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:12px; border-top:1px solid var(--border); }
        .danger-card-footer>span { color:var(--muted); font-size:10px; }

        /* v10.8 post-delivery customer block */
        .after-delivery-showcase { margin-top:20px; border:1px solid var(--border); border-radius:20px; background:linear-gradient(145deg,rgba(12,15,19,.96),rgba(8,10,13,.96)); overflow:hidden; box-shadow:0 18px 50px rgba(0,0,0,.16); }
        .after-delivery-intro { display:flex; align-items:center; gap:14px; padding:18px 19px; border-bottom:1px solid var(--border); }
        .after-delivery-intro .completion-mark { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:13px; background:rgba(78,167,119,.11); border:1px solid rgba(91,194,139,.2); color:#98e2bb; font-size:19px; font-weight:900; }
        .after-delivery-intro h3 { margin:4px 0 3px; font-size:18px; }
        .after-delivery-intro p { margin:0; color:var(--muted); font-size:11px; line-height:1.45; }
        .after-delivery-options { display:grid; grid-template-columns:1fr 1fr; gap:0; }
        .after-delivery-options.single-option { grid-template-columns:1fr; }
        .after-delivery-options.single-option .after-delivery-option + .after-delivery-option { border-left:0; }
        .after-delivery-option { padding:18px; display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
        .after-delivery-option + .after-delivery-option { border-left:1px solid var(--border); }
        .after-delivery-option .option-kicker { color:#7f8998; text-transform:uppercase; letter-spacing:.12em; font-size:8px; font-weight:850; }
        .after-delivery-option h4 { margin:7px 0 6px; font-size:16px; }
        .after-delivery-option p { margin:0 0 14px; color:var(--muted); font-size:11px; line-height:1.5; flex:1; }
        .after-delivery-option>a { align-self:stretch; text-align:center; }
        .after-delivery-option.review-option { background:radial-gradient(circle at 10% 0%,rgba(50,106,217,.10),transparent 45%); }
        .after-delivery-option.buy-option { background:radial-gradient(circle at 100% 100%,rgba(105,120,146,.08),transparent 48%); }
        .after-delivery-actions-v2,.preview-actions { display:flex; gap:7px; flex-wrap:wrap; width:100%; }
        .after-delivery-actions-v2 a { flex:1 1 170px; text-align:center; }
        .preview-mode { margin-top:0; pointer-events:none; opacity:.92; }
        .preview-button { display:inline-flex; align-items:center; justify-content:center; }

        
        
        
        
        
        

        @media (max-width:980px) {
            .product-overview-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
            .overview-stock-copy { grid-column:1/-1; }
            .danger-workspace-grid { grid-template-columns:1fr; }
        }
        @media (max-width:760px) {
            .product-detail-head-v2 { align-items:stretch; }
            .product-head-actions { width:100%; }
            .product-head-actions form,.product-head-actions button { flex:1; }
            .product-overview-strip { grid-template-columns:1fr 1fr; }
            .product-tabs { top:6px; margin-left:-4px; margin-right:-4px; }
            .workspace-card { padding:15px; }
            .workspace-card-head { flex-direction:column; align-items:stretch; }
            .mode-choice-grid { grid-template-columns:1fr; }
            .pause-inline-form { grid-template-columns:1fr; }
            .sales-link-row { grid-template-columns:1fr; gap:8px; }
            .after-delivery-options { grid-template-columns:1fr; }
            .after-delivery-option + .after-delivery-option { border-left:0; border-top:1px solid var(--border); }
            .after-delivery-intro { align-items:flex-start; }
            .danger-card-footer { flex-direction:column; align-items:stretch; }
            .danger-card-footer form,.danger-card-footer button { width:100%; }
        }

    
        /* System center */
        .system-hero { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:20px; margin-bottom:14px; }
        .system-hero h2 { margin:0; }
        .system-status-title { display:flex; align-items:center; gap:10px; margin:6px 0 8px; }
        .system-state-dot { width:11px; height:11px; border-radius:50%; background:#75d7a1; box-shadow:0 0 0 5px rgba(87,196,136,.08); }
        .system-state-dot.degraded { background:#dfc36d; box-shadow:0 0 0 5px rgba(223,195,109,.08); }
        .system-state-dot.unhealthy { background:#ef8888; box-shadow:0 0 0 5px rgba(239,136,136,.08); }
        .system-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
        .system-card { padding:18px; min-width:0; }
        .system-card-head { display:flex; gap:12px; align-items:center; padding-bottom:13px; margin-bottom:4px; border-bottom:1px solid var(--border); }
        .system-card-head h3 { margin:0 0 3px; font-size:15px; }
        .system-card-head p { margin:0; color:var(--muted); font-size:10px; }
        .system-icon { width:38px; height:38px; flex:0 0 38px; border:1px solid var(--border2); border-radius:11px; display:grid; place-items:center; color:#aeb6c3; font-size:9px; font-weight:850; letter-spacing:.06em; background:#0b0e12; }
        .system-check-row { display:flex; justify-content:space-between; gap:14px; align-items:center; padding:11px 0; border-bottom:1px solid var(--border); font-size:11px; }
        .system-check-row:last-of-type { border-bottom:0; }
        .system-check { font-size:10px; border-radius:999px; padding:5px 8px; background:#15191e; }
        .system-check.ok { color:#9ee0bb; background:rgba(55,157,105,.10); }
        .system-check.warn { color:#e6d18a; background:rgba(181,139,22,.09); }
        .system-check.bad { color:#ffabab; background:rgba(183,48,48,.09); }
        .system-note { color:var(--muted); font-size:10px; line-height:1.45; margin-top:10px; }
        .system-note.bad { color:#e2b3b3; }
        .system-path { margin-top:10px; padding:8px 9px; border-radius:9px; background:#090b0e; color:#87909c; font:9px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }
        .system-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding-top:12px; }
        .system-metrics>div { padding:12px 10px; border:1px solid var(--border); border-radius:11px; background:#090b0e; display:grid; gap:5px; }
        .system-metrics span { color:var(--muted); font-size:9px; }
        .system-metrics strong { font-size:20px; }
        .system-log-head { margin-top:2px; }

        /* Ticket inbox */
        .inbox-page { max-width:1580px; }
        .inbox-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
        .inbox-filters { margin:0; flex:1; min-width:0; }
        .quick-replies-popover { position:relative; flex:0 0 auto; }
        .quick-replies-popover>summary { list-style:none; cursor:pointer; }
        .quick-replies-popover>summary::-webkit-details-marker { display:none; }
        .quick-replies-popover-card { position:absolute; z-index:60; right:0; top:calc(100% + 8px); width:min(760px,calc(100vw - 30px)); max-height:70vh; overflow:auto; padding:16px; box-shadow:0 22px 70px rgba(0,0,0,.42); }
        .quick-replies-popover-head { display:flex; justify-content:space-between; gap:12px; align-items:baseline; margin-bottom:8px; }
        .quick-replies-popover-head span { color:var(--muted); font-size:10px; }
        .quick-reply-setting-row { padding-top:8px; border-top:1px solid var(--border); }
        .quick-reply-setting-row>form:last-child { display:flex; justify-content:flex-end; margin-top:5px; }
        .inbox-workspace { display:grid; grid-template-columns:minmax(300px,360px) minmax(0,1fr); gap:12px; min-height:660px; height:calc(100vh - 205px); max-height:900px; }
        .inbox-list, .inbox-conversation { min-height:0; overflow:hidden; padding:0; }
        .inbox-list { display:flex; flex-direction:column; }
        .inbox-list-head { padding:14px 15px 11px; border-bottom:1px solid var(--border); }
        .inbox-list-head>div { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
        .inbox-list-head span { color:var(--muted); font-size:9px; }
        .inbox-list-scroll { overflow:auto; min-height:0; padding:6px; }
        .inbox-ticket { display:grid; gap:6px; padding:12px; border-radius:12px; text-decoration:none; color:inherit; border:1px solid transparent; transition:.15s ease; }
        .inbox-ticket:hover { background:rgba(255,255,255,.025); }
        .inbox-ticket.active { background:#151a20; border-color:var(--border2); }
        .inbox-ticket.unread:not(.active) { background:rgba(47,102,210,.055); }
        .inbox-ticket-top,.inbox-ticket-title { display:flex; align-items:center; justify-content:space-between; gap:8px; }
        .inbox-ticket-top time { color:var(--muted); font-size:9px; }
        .inbox-ticket-title strong { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        .inbox-ticket-category { color:#9ca5b2; font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        .inbox-ticket p { margin:0; color:var(--muted); font-size:10px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
        .inbox-ticket p b { color:#aeb6c2; font-weight:700; }
        .inbox-ticket>small { color:#69727e; font-size:9px; }
        .inbox-empty { margin:12px; }
        .inbox-conversation { display:flex; flex-direction:column; background:rgba(9,11,14,.78); }
        .inbox-conversation-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:15px 17px; border-bottom:1px solid var(--border); flex:0 0 auto; }
        .inbox-conversation-head h2 { margin:7px 0 3px; font-size:17px; }
        .inbox-order-meta { color:var(--muted); font-size:10px; }
        .inbox-thread { flex:1 1 auto; overflow:auto; min-height:0; padding:20px 18px 12px; display:flex; flex-direction:column; gap:10px; scroll-behavior:smooth; }
        .chat-row { display:flex; width:100%; }
        .chat-row.customer { justify-content:flex-start; }
        .chat-row.admin { justify-content:flex-end; }
        .chat-bubble { max-width:min(72%,680px); border:1px solid var(--border); border-radius:16px; padding:10px 12px; background:#11151a; box-shadow:0 4px 16px rgba(0,0,0,.08); }
        .chat-bubble.customer { border-bottom-left-radius:5px; }
        .chat-bubble.admin { border-bottom-right-radius:5px; background:linear-gradient(145deg,rgba(43,89,179,.18),rgba(25,45,82,.18)); border-color:rgba(86,128,214,.22); }
        .chat-bubble-head { display:flex; justify-content:space-between; gap:14px; margin-bottom:6px; font-size:9px; }
        .chat-bubble-head strong { color:#c9d0da; }
        .chat-bubble-head time { color:#68717d; white-space:nowrap; }
        .chat-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; line-height:1.5; }
        .inbox-composer { flex:0 0 auto; border-top:1px solid var(--border); background:rgba(10,12,15,.97); padding:10px 12px 9px; }
        .inbox-chips { margin:0 0 8px; flex-wrap:nowrap; overflow:auto; padding-bottom:2px; scrollbar-width:none; }
        .inbox-chips::-webkit-scrollbar { display:none; }
        .ticket-compose-form { display:grid; gap:7px; }
        .ticket-compose-form textarea { min-height:76px; max-height:190px; resize:vertical; padding:12px 13px; border-radius:13px; }
        .composer-bottom { display:flex; align-items:center; justify-content:space-between; gap:8px; }
        .inbox-resolve-row { display:flex; justify-content:flex-end; margin-top:6px; }
        .inbox-closed { margin:auto; display:grid; gap:5px; text-align:center; color:var(--muted); }
        .inbox-closed strong { color:var(--text); }
        .inbox-no-selection { margin:auto; display:grid; gap:5px; }
        .inbox-no-selection span { color:var(--muted); font-size:10px; }

        /* Customer ticket chat */
        .customer-support-card { margin-top:20px; border:1px solid var(--border); border-radius:18px; overflow:hidden; background:rgba(10,12,15,.66); }
        .customer-support-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:17px 18px; border-bottom:1px solid var(--border); }
        .customer-support-head h2 { margin:5px 0 4px; font-size:17px; }
        .customer-support-head p { margin:0; color:var(--muted); font-size:10px; line-height:1.5; max-width:480px; }
        .customer-chat { display:flex; flex-direction:column; }
        .customer-chat-topic { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:11px 14px; border-bottom:1px solid var(--border); background:rgba(255,255,255,.012); }
        .customer-chat-topic>div { display:flex; align-items:center; gap:8px; min-width:0; }
        .customer-chat-topic strong { font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        .customer-chat-topic small { color:var(--muted); font-size:9px; white-space:nowrap; }
        .customer-chat-thread { min-height:180px; max-height:520px; overflow:auto; padding:16px 13px; display:flex; flex-direction:column; gap:9px; }
        .customer-chat-row { display:flex; }
        .customer-chat-row.customer { justify-content:flex-end; }
        .customer-chat-row.admin { justify-content:flex-start; }
        .customer-chat-bubble { max-width:82%; padding:10px 11px; border-radius:15px; border:1px solid var(--border); background:#11151a; }
        .customer-chat-bubble.customer { border-bottom-right-radius:5px; background:linear-gradient(145deg,rgba(43,89,179,.20),rgba(25,45,82,.18)); border-color:rgba(86,128,214,.23); }
        .customer-chat-bubble.admin { border-bottom-left-radius:5px; }
        .customer-chat-bubble-head { display:flex; justify-content:space-between; gap:14px; margin-bottom:6px; }
        .customer-chat-bubble-head strong { font-size:9px; color:#cbd1da; }
        .customer-chat-bubble-head time { font-size:8px; color:#707985; white-space:nowrap; }
        .customer-chat-text { font-size:11px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
        .customer-chat-composer { padding:11px 12px 12px; border-top:1px solid var(--border); background:rgba(7,9,11,.72); }
        .customer-ticket-create-v2 { border:0; border-radius:0; }
        .customer-ticket-create-v2>summary { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px 17px; cursor:pointer; list-style:none; }
        .customer-ticket-create-v2>summary::-webkit-details-marker { display:none; }
        .customer-ticket-create-v2>summary span { font-size:12px; font-weight:800; }
        .customer-ticket-create-v2>summary small { color:var(--muted); font-size:9px; }
        .customer-ticket-create-v2 .customer-ticket-form { padding:0 17px 17px; }
        .customer-history-v2 { border-top:1px solid var(--border); }
        .customer-history-v2>summary { padding:13px 17px; }
        .customer-history-v2>summary span { display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:#191e24; margin-left:5px; }
        .customer-history-thread {
            display:flex;
            flex-direction:column;
            gap:9px;
            padding:2px 0 4px;
        }
        .customer-history-thread .customer-chat-row { width:100%; }
        .customer-history-thread .customer-chat-bubble { max-width:82%; }

        
        
        
        

        @media (max-width:900px) {
            .system-grid { grid-template-columns:1fr; }
            .inbox-workspace { grid-template-columns:300px minmax(0,1fr); }
            .chat-bubble { max-width:84%; }
        }
        @media (max-width:720px) {
            .system-hero,.inbox-toolbar { flex-direction:column; align-items:stretch; }
            .system-metrics { grid-template-columns:1fr 1fr 1fr; }
            .inbox-workspace { display:block; height:auto; max-height:none; }
            .inbox-list { max-height:340px; margin-bottom:10px; }
            .inbox-conversation { min-height:560px; }
            .inbox-conversation-head { flex-direction:column; }
            .chat-bubble { max-width:92%; }
            .quick-replies-popover-card { position:fixed; left:10px; right:10px; top:80px; width:auto; }
            .customer-support-head,.customer-chat-topic { align-items:flex-start; flex-direction:column; }
            .customer-chat-bubble { max-width:94%; }
            .customer-history-thread .customer-chat-bubble { max-width:90%; }
        }


        /* refined ambient geometry */
        .ambient-shape {
            position:absolute;
            pointer-events:none;
            opacity:.18;
            will-change:transform,opacity;
        }

        .ambient-ring {
            width:180px;
            height:180px;
            right:9vw;
            top:10vh;
            border:1px solid rgba(147,180,235,.28);
            border-radius:50%;
            box-shadow:inset 0 0 55px rgba(90,132,201,.035), 0 0 70px rgba(80,123,190,.035);
            animation:ambientRingFloat 34s ease-in-out infinite alternate;
        }

        .ambient-ring::after {
            content:"";
            position:absolute;
            inset:27px;
            border:1px solid rgba(255,255,255,.09);
            border-radius:50%;
        }

        .ambient-square {
            width:96px;
            height:96px;
            left:8vw;
            bottom:13vh;
            border:1px solid rgba(164,183,215,.22);
            border-radius:24px;
            transform:rotate(18deg);
            animation:ambientSquareFloat 29s ease-in-out infinite alternate;
        }

        .ambient-diamond {
            width:58px;
            height:58px;
            right:28vw;
            bottom:18vh;
            border:1px solid rgba(255,255,255,.13);
            border-radius:16px;
            transform:rotate(45deg);
            animation:ambientDiamondFloat 25s ease-in-out infinite alternate;
        }

        .ambient-line {
            width:210px;
            height:1px;
            left:23vw;
            top:15vh;
            background:linear-gradient(90deg,transparent,rgba(150,178,224,.24),transparent);
            transform:rotate(-24deg);
            animation:ambientLineFloat 31s ease-in-out infinite alternate;
        }

        @keyframes ambientRingFloat {
            from { transform:translate3d(0,0,0) rotate(0deg) scale(.96); opacity:.12; }
            to { transform:translate3d(-8vw,12vh,0) rotate(42deg) scale(1.08); opacity:.25; }
        }
        @keyframes ambientSquareFloat {
            from { transform:translate3d(0,0,0) rotate(18deg); opacity:.12; }
            to { transform:translate3d(11vw,-10vh,0) rotate(62deg); opacity:.23; }
        }
        @keyframes ambientDiamondFloat {
            from { transform:translate3d(0,0,0) rotate(45deg) scale(.9); opacity:.10; }
            to { transform:translate3d(-9vw,-11vh,0) rotate(105deg) scale(1.15); opacity:.22; }
        }
        @keyframes ambientLineFloat {
            from { transform:translate3d(0,0,0) rotate(-24deg); opacity:.08; }
            to { transform:translate3d(15vw,8vh,0) rotate(-10deg); opacity:.20; }
        }

        .customer-nav,
        .card,
        .support-box {
            backdrop-filter:blur(18px) saturate(112%);
            -webkit-backdrop-filter:blur(18px) saturate(112%);
        }

        .customer-nav {
            background:rgba(11,13,16,.78);
            box-shadow:0 16px 50px rgba(0,0,0,.16);
        }

        .card {
            background:linear-gradient(180deg,rgba(15,18,23,.94),rgba(10,12,15,.96));
            box-shadow:0 30px 90px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.025);
        }

        .support-box {
            background:rgba(12,15,19,.82);
        }

        .primary-button,
        .secondary-button,
        .ghost-button,
        .contact-button,
        .copy-button {
            transition:transform .14s ease, background-color .14s ease, border-color .14s ease, box-shadow .14s ease, color .14s ease;
        }

        .primary-button:active,
        .secondary-button:active,
        .ghost-button:active,
        .contact-button:active,
        .copy-button:active {
            transform:translateY(0) scale(.985);
        }

        .status-pill.processing .status-dot,
        .status-pill.info-pill .status-dot {
            animation:statusPulse 2.2s ease-in-out infinite;
        }
        @keyframes statusPulse {
            0%,100% { opacity:.45; box-shadow:0 0 0 0 currentColor; }
            50% { opacity:1; box-shadow:0 0 0 5px transparent; }
        }

        .after-delivery-showcase {
            position:relative;
            overflow:hidden;
            border-radius:20px;
        }
        .after-delivery-showcase::before {
            content:"";
            position:absolute;
            width:220px;
            height:220px;
            right:-120px;
            top:-130px;
            border:1px solid rgba(139,174,230,.13);
            border-radius:50%;
            pointer-events:none;
        }
        .after-delivery-option {
            transition:transform .16s ease,border-color .16s ease,background-color .16s ease;
        }
        .after-delivery-option:hover { transform:translateY(-2px); }

        
        
        
        
        

        body:has(.admin-shell) .ambient-orb { opacity:.22; filter:blur(105px); animation-duration:48s; }
        body:has(.admin-shell) .ambient-grid { opacity:.05; animation-duration:55s; }
        body:has(.admin-shell) .ambient-shape { opacity:.06; animation-duration:52s; }

        @media (max-width:720px) {
            .ambient-ring { width:120px; height:120px; right:-28px; top:15vh; }
            .ambient-square { width:68px; height:68px; left:-12px; bottom:17vh; }
            .ambient-diamond { width:42px; height:42px; right:18vw; bottom:10vh; }
            .ambient-line { width:140px; left:8vw; top:11vh; }
        }

        @media (prefers-reduced-motion: reduce) {
            .ambient-shape,
            .status-pill .status-dot { animation:none !important; }
        }



        /* v10.14 — customer visual polish / soft cyberpunk */
        :root {
            --cyber-blue:#377cff;
            --cyber-cyan:#4fd7ff;
            --cyber-violet:#8068ff;
            --cyber-line:rgba(74,133,255,.18);
            --cyber-glow:rgba(52,119,255,.13);
        }

        /* Slightly larger customer typography without changing page structure. */
        .customer-nav a { font-size:14px; }
        .customer-card .muted,
        .card .muted { font-size:16px; line-height:1.66; }
        .support-title { font-size:15px; }
        .support-text { font-size:14px; line-height:1.58; }
        .contact-button,
        .primary-button,
        .secondary-button { font-size:14px; }
        .text-input,
        .code-input,
        textarea { font-size:15px; }
        .order-info p { font-size:14px; }
        .result-box pre { font-size:15px; }
        .customer-code-footer { font-size:13px; line-height:1.65; }
        .customer-support-head h2 { font-size:19px; }
        .customer-support-head p { font-size:12px; }
        .customer-chat-text { font-size:13px; line-height:1.55; }
        .customer-chat-bubble-head strong { font-size:10px; }
        .customer-chat-bubble-head time { font-size:9px; }

        /* Deep digital background. All elements are CSS; no reference artwork is embedded. */
        html[data-theme="dark"] body {
            background:
                radial-gradient(860px 620px at 11% 9%, rgba(28,84,180,.15), transparent 70%),
                radial-gradient(820px 600px at 90% 73%, rgba(87,57,176,.10), transparent 72%),
                radial-gradient(760px 440px at 52% -150px, rgba(48,142,219,.08), transparent 72%),
                linear-gradient(180deg,#06080c 0%,#080b11 55%,#06080b 100%);
        }

        .ambient-network {
            position:absolute;
            inset:-8%;
            opacity:.32;
            background-image:
                linear-gradient(118deg, transparent 0 18%, rgba(67,126,231,.12) 18.08% 18.16%, transparent 18.25% 100%),
                linear-gradient(28deg, transparent 0 69%, rgba(101,92,226,.09) 69.08% 69.16%, transparent 69.25% 100%),
                radial-gradient(circle at 21% 25%, rgba(78,164,255,.42) 0 1.5px, transparent 2.5px),
                radial-gradient(circle at 73% 38%, rgba(115,101,255,.32) 0 1.5px, transparent 2.5px),
                radial-gradient(circle at 82% 77%, rgba(79,215,255,.30) 0 1.5px, transparent 2.5px);
            background-size:900px 700px,980px 720px,420px 360px,530px 420px,610px 460px;
            mask-image:radial-gradient(ellipse at center,#000 0 50%,transparent 84%);
            -webkit-mask-image:radial-gradient(ellipse at center,#000 0 50%,transparent 84%);
            animation:cyberNetworkDrift 42s linear infinite alternate;
            pointer-events:none;
        }

        .ambient-circuit {
            position:absolute;
            height:1px;
            opacity:.20;
            background:linear-gradient(90deg,transparent,rgba(69,133,255,.10),rgba(78,215,255,.65),rgba(123,90,255,.22),transparent);
            box-shadow:0 0 16px rgba(63,132,255,.12);
            transform-origin:left center;
            overflow:visible;
        }
        .ambient-circuit::after {
            content:"";
            position:absolute;
            top:50%;
            width:5px;
            height:5px;
            border-radius:50%;
            background:#73dfff;
            box-shadow:0 0 10px rgba(79,215,255,.75);
            transform:translate(-50%,-50%);
            animation:cyberSignal 7s ease-in-out infinite;
        }
        .circuit-one { width:31vw; min-width:260px; left:4vw; top:26vh; transform:rotate(12deg); }
        .circuit-two { width:28vw; min-width:240px; right:4vw; top:59vh; transform:rotate(-18deg); }
        .circuit-three { width:21vw; min-width:200px; left:34vw; bottom:11vh; transform:rotate(4deg); opacity:.12; }
        .circuit-two::after { animation-delay:-2.4s; }
        .circuit-three::after { animation-delay:-4.1s; }

        .ambient-node {
            position:absolute;
            width:5px;
            height:5px;
            border:1px solid rgba(102,184,255,.78);
            background:rgba(21,53,96,.8);
            box-shadow:0 0 13px rgba(68,139,255,.42);
            transform:rotate(45deg);
            animation:cyberNodePulse 4.8s ease-in-out infinite;
        }
        .node-one { left:15vw; top:18vh; }
        .node-two { right:17vw; top:34vh; animation-delay:-1.5s; }
        .node-three { right:29vw; bottom:16vh; animation-delay:-3s; }

        .ambient-cube {
            position:absolute;
            width:92px;
            height:92px;
            right:13vw;
            top:14vh;
            border:1px solid rgba(83,157,255,.22);
            border-radius:18px;
            transform:rotate(32deg) skew(-4deg,-4deg);
            box-shadow:inset 0 0 35px rgba(54,115,255,.035),0 0 44px rgba(42,111,255,.04);
            opacity:.24;
            animation:cyberCubeFloat 31s ease-in-out infinite alternate;
        }
        .ambient-cube::before,
        .ambient-cube::after {
            content:"";
            position:absolute;
            border:1px solid rgba(121,97,255,.16);
            border-radius:15px;
        }
        .ambient-cube::before { inset:17px -20px -17px 20px; }
        .ambient-cube::after { inset:-13px 13px 13px -13px; border-color:rgba(79,215,255,.13); }

        @keyframes cyberSignal {
            0%,100% { left:2%; opacity:.05; }
            18% { opacity:.9; }
            82% { opacity:.9; }
            100% { left:98%; opacity:.05; }
        }
        @keyframes cyberNetworkDrift {
            from { transform:translate3d(-16px,-8px,0) scale(1.01); }
            to { transform:translate3d(28px,18px,0) scale(1.025); }
        }
        @keyframes cyberNodePulse {
            0%,100% { opacity:.18; box-shadow:0 0 7px rgba(68,139,255,.24); }
            50% { opacity:.72; box-shadow:0 0 17px rgba(68,139,255,.55); }
        }
        @keyframes cyberCubeFloat {
            from { transform:translate3d(0,0,0) rotate(32deg) skew(-4deg,-4deg); opacity:.14; }
            to { transform:translate3d(-5vw,8vh,0) rotate(56deg) skew(-4deg,-4deg); opacity:.28; }
        }

        /* Customer surfaces: premium neon edge, still restrained. */
        .center-shell .customer-nav,
        .center-shell .card,
        .center-shell .support-box {
            border-color:rgba(81,125,192,.30);
            box-shadow:
                0 24px 74px rgba(0,0,0,.30),
                inset 0 1px 0 rgba(133,184,255,.04),
                0 0 0 1px rgba(54,116,219,.018);
        }
        .center-shell .card {
            background:
                radial-gradient(520px 260px at 100% 0%,rgba(43,103,216,.08),transparent 72%),
                linear-gradient(180deg,rgba(13,17,24,.95),rgba(8,11,16,.97));
        }
        .center-shell .support-box { background:rgba(10,14,20,.83); }
        .customer-nav a.active {
            box-shadow:inset 0 0 0 1px rgba(67,126,242,.44),0 0 22px rgba(51,113,239,.08);
        }
        .primary-button:hover { box-shadow:0 14px 36px rgba(47,109,246,.31),0 0 22px rgba(79,215,255,.07); }
        .secondary-button:hover,
        .contact-button:hover,
        .copy-button:hover { transform:translateY(-1px); border-color:rgba(83,139,239,.34); }

        /* Progress reads like a digital signal, without changing its semantics. */
        .flow-item.current::before,
        .flow-item.current-final::before {
            box-shadow:0 0 0 4px rgba(47,109,246,.11),0 0 17px rgba(57,126,255,.42);
            animation:cyberCurrentStep 2.4s ease-in-out infinite;
        }
        .flow-item.done:not(:last-child)::after {
            background:linear-gradient(90deg,rgba(117,151,208,.65),rgba(61,126,239,.80));
            box-shadow:0 0 9px rgba(47,109,246,.12);
        }
        @keyframes cyberCurrentStep {
            0%,100% { filter:brightness(.92); }
            50% { filter:brightness(1.18); }
        }

        /* Fully theme-aware customer ticket conversation. */
        .customer-support-card,
        .customer-chat,
        .customer-chat-thread,
        .customer-chat-topic,
        .customer-chat-composer {
            color:var(--text);
        }
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        

        /* Admin Inbox follows the same theme rules, but keeps a calmer background. */
        
        
        
        
        
        
        
        

        /* Light mode cyber accents are intentionally faint. */
        
        
        
        
        
        

        /* Admin ambient treatment stays intentionally weaker than customer pages. */
        body:has(.admin-shell) .ambient-network,
        body:has(.admin-shell) .ambient-circuit,
        body:has(.admin-shell) .ambient-node,
        body:has(.admin-shell) .ambient-cube { opacity:.035; animation-duration:65s; }

        @media (max-width:720px) {
            .customer-card .muted,
            .card .muted { font-size:15px; }
            .support-title { font-size:14px; }
            .support-text { font-size:13px; }
            .contact-button,.primary-button,.secondary-button { font-size:14px; }
            .customer-chat-text { font-size:13px; }
            .ambient-network { inset:-12%; opacity:.22; }
            .ambient-circuit { opacity:.12; }
            .circuit-one { width:58vw; left:-7vw; top:22vh; }
            .circuit-two { width:64vw; right:-17vw; top:68vh; }
            .circuit-three { display:none; }
            .ambient-cube { width:66px; height:66px; right:-7px; top:18vh; opacity:.15; }
            .node-three { display:none; }
            .customer-chat-composer { padding-bottom:max(12px, env(safe-area-inset-bottom)); }
        }

        @media (prefers-reduced-motion: reduce) {
            .ambient-network,
            .ambient-circuit::after,
            .ambient-node,
            .ambient-cube,
            .flow-item.current::before,
            .flow-item.current-final::before { animation:none !important; }
        }

        /* v10.15 stability fixes */
        .admin-nav {
            flex-wrap:nowrap;
            overflow-x:auto;
            overflow-y:hidden;
            scrollbar-width:none;
            -webkit-overflow-scrolling:touch;
        }
        .admin-nav::-webkit-scrollbar { display:none; }
        .admin-nav a { flex:0 0 auto; }

        .mode-choice input,
        .inline-switch input {
            position:absolute !important;
            width:1px !important;
            height:1px !important;
            margin:-1px !important;
            padding:0 !important;
            overflow:hidden !important;
            clip:rect(0 0 0 0) !important;
            clip-path:inset(50%) !important;
            white-space:nowrap !important;
            opacity:0 !important;
        }

        select {
            min-height:46px;
            color-scheme:dark;
            padding:0 42px 0 14px;
            border-radius:13px;
            appearance:none;
            -webkit-appearance:none;
            background:
                linear-gradient(45deg,transparent 50%,#7c8796 50%) calc(100% - 18px) 50%/5px 5px no-repeat,
                linear-gradient(135deg,#7c8796 50%,transparent 50%) calc(100% - 13px) 50%/5px 5px no-repeat,
                #090b0e;
            color:var(--text);
            font:inherit;
        }
        

        /* Typography: a small, consistent readability increase. */
        .primary-button { font-size:15px; }
        .support-text { font-size:15px; }
        .customer-chat-text { font-size:14px; }
        .customer-chat-bubble-head strong { font-size:11px; }
        .customer-chat-bubble-head time { font-size:10px; }

        /* Keep the cyberpunk atmosphere but reduce continuous GPU work. */
        .ambient-shape,
        .ambient-node,
        .ambient-grid,
        .ambient-orb { animation:none !important; }
        .circuit-three,
        .node-three { display:none !important; }
        body:has(.admin-shell),
        body:has(.admin-shell)::before,
        body:has(.admin-shell)::after,
        body:has(.admin-shell) .ambient-orb,
        body:has(.admin-shell) .ambient-network,
        body:has(.admin-shell) .ambient-circuit::after,
        body:has(.admin-shell) .ambient-cube { animation:none !important; }
        body:has(.admin-shell) .ambient-circuit,
        body:has(.admin-shell) .ambient-node,
        body:has(.admin-shell) .ambient-cube { opacity:.025; }

        @media (max-width:720px) {
            .customer-card .muted,
            .card .muted { font-size:16px; line-height:1.62; }
            .support-text { font-size:14px; }
            .primary-button { font-size:15px; }
            .text-input,
            .code-input,
            textarea,
            select { font-size:16px; }
        }

        /* Customer Telegram notification opt-in */
        .order-notification-card {
            display:grid;
            grid-template-columns:auto minmax(0,1fr) auto;
            gap:14px;
            align-items:center;
            margin-top:20px;
            padding:16px;
            border:1px solid rgba(63,126,255,.28);
            border-radius:16px;
            background:linear-gradient(135deg,rgba(28,59,122,.18),rgba(12,15,21,.82));
            box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
        }
        .order-notification-icon {
            width:40px;
            height:40px;
            display:grid;
            place-items:center;
            border:1px solid rgba(75,139,255,.34);
            border-radius:12px;
            background:rgba(44,105,230,.12);
            color:#8fb8ff;
            font-size:18px;
            font-weight:800;
        }
        .order-notification-copy { min-width:0; }
        .order-notification-copy .eyebrow { margin-bottom:4px; }
        .order-notification-copy h3 { margin:0 0 5px; font-size:17px; }
        .order-notification-copy p { margin:0; color:#aeb6c2; font-size:13px; line-height:1.55; }
        .order-notification-copy small { display:block; margin-top:6px; color:#747e8c; font-size:11px; line-height:1.5; }
        .order-notification-button { white-space:nowrap; text-decoration:none; }

        
        
        
        

        @media (max-width:720px) {
            .order-notification-card {
                grid-template-columns:auto minmax(0,1fr);
                padding:15px;
            }
            .order-notification-button {
                grid-column:1 / -1;
                width:100%;
            }
            .order-notification-copy h3 { font-size:16px; }
            .order-notification-copy p { font-size:13px; }
        }