ltcai 4.0.0 → 4.0.1

package/static/css/reference/admin.css

@@ -1,610 +0,0 @@
-/* Lattice AI — admin page (admin.html, body.lattice-ref-admin). Token-native. */
-/* ============================================================
-   ADMIN PAGE  (admin.html)
-   ============================================================ */
-
-        body.lattice-ref-admin {
-            --radius: 8px;
-            --radius-sm: 8px;
-        }
-
-        * { box-sizing: border-box; }
-        html, body.lattice-ref-admin { height: 100%; }
-        body.lattice-ref-admin {
-            margin: 0;
-            font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
-            color: var(--text);
-            background: var(--app-bg);
-        }
-
-        body::before {
-            content: "";
-            position: fixed;
-            inset: 0;
-            pointer-events: none;
-            background:
-                radial-gradient(circle, rgba(111,66,232,0.18) 1px, transparent 1.9px);
-            background-size: 32px 32px;
-            background-position: 10px 10px;
-            mask-image: linear-gradient(180deg, rgba(0,0,0,0.3), rgba(0,0,0,0.06));
-        }
-
-        .page {
-            position: relative;
-            z-index: 1;
-            min-height: 100%;
-            display: flex;
-            flex-direction: column;
-        }
-
-        .topbar {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            gap: 16px;
-            padding: 22px 28px;
-            border-bottom: 1px solid rgba(111,66,232,0.10);
-            background: var(--sidebar);
-            backdrop-filter: none; /* glass removed v3.5.0 */
-            position: sticky;
-            top: 0;
-            z-index: 2;
-        }
-
-        .brand {
-            display: flex;
-            align-items: center;
-            gap: 12px;
-            min-width: 0;
-        }
-
-        .brand-mark {
-            width: 42px;
-            height: 42px;
-            border-radius: 12px;
-            background: radial-gradient(circle at 35% 30%, #ffffff 0 16%, #a77cff 17% 62%, #5b6cff 100%);
-            color: #171926;
-            display: grid;
-            place-items: center;
-            font-size: 20px;
-            font-weight: 800;
-            box-shadow: 0 12px 30px rgba(0,0,0,0.25);
-            flex: 0 0 auto;
-        }
-
-        .brand h1 {
-            margin: 0;
-            font-size: 18px;
-            line-height: 1.15;
-            letter-spacing: 0;
-        }
-
-        .brand p {
-            margin: 4px 0 0;
-            color: var(--muted);
-            font-size: 12px;
-        }
-
-        .top-actions {
-            display: flex;
-            gap: 8px;
-            flex-wrap: wrap;
-            justify-content: flex-end;
-        }
-
-        .btn {
-            border: 1px solid var(--border);
-            background: var(--surface-2);
-            color: var(--text);
-            border-radius: 8px;
-            padding: 10px 14px;
-            font: inherit;
-            font-size: 13px;
-            font-weight: 700;
-            cursor: pointer;
-            display: inline-flex;
-            align-items: center;
-            gap: 8px;
-            transition: all .15s ease;
-            text-decoration: none;
-        }
-
-        .btn:hover {
-            border-color: rgba(111,66,232,0.32);
-            background: rgba(111,66,232,0.10);
-            color: var(--accent);
-        }
-
-        .btn.primary {
-            background: var(--accent-soft);
-            border-color: rgba(111,66,232,0.28);
-        }
-
-        .btn.danger:hover {
-            background: rgba(229,57,53,0.08);
-            border-color: rgba(229,57,53,0.22);
-            color: var(--danger);
-        }
-
-        .content {
-            width: min(1440px, calc(100vw - 32px));
-            margin: 0 auto;
-            padding: 22px 0 28px;
-            display: flex;
-            flex-direction: column;
-            gap: 18px;
-        }
-
-        .hero {
-            border: 1px solid var(--border);
-            border-radius: calc(var(--radius) + 2px);
-            background:
-                linear-gradient(135deg, rgba(111,66,232,0.10), rgba(248,243,255,0.92));
-            box-shadow: var(--shadow);
-            padding: 20px 22px;
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            gap: 14px;
-            flex-wrap: wrap;
-        }
-
-        .hero h2 {
-            margin: 0 0 6px;
-            font-size: 26px;
-            line-height: 1.15;
-        }
-
-        .hero p {
-            margin: 0;
-            color: var(--muted);
-            font-size: 13px;
-            line-height: 1.5;
-            max-width: 760px;
-        }
-
-        .session-card {
-            border: 1px solid rgba(111,66,232,0.18);
-            background: rgba(111,66,232,0.08);
-            color: var(--text);
-            border-radius: 12px;
-            padding: 12px 14px;
-            min-width: 280px;
-        }
-
-        .session-card .label {
-            font-size: 11px;
-            text-transform: uppercase;
-            letter-spacing: 0.08em;
-            color: var(--faint);
-            margin-bottom: 6px;
-        }
-
-        .session-card .value {
-            font-size: 13px;
-            font-weight: 700;
-            word-break: break-all;
-        }
-
-        .notice {
-            border: 1px solid rgba(111,66,232,0.18);
-            background: rgba(111,66,232,0.07);
-            color: var(--muted);
-            border-radius: 12px;
-            padding: 12px 14px;
-            font-size: 13px;
-            line-height: 1.5;
-        }
-
-        .summary-grid {
-            display: grid;
-            grid-template-columns: repeat(4, minmax(0, 1fr));
-            gap: 12px;
-        }
-
-        .summary-card {
-            border: 1px solid var(--border);
-            border-radius: var(--radius);
-            background: var(--card);
-            box-shadow: 0 8px 28px rgba(88,72,150,0.10);
-            padding: 16px 16px 15px;
-            min-width: 0;
-        }
-
-        .summary-card .label {
-            color: var(--faint);
-            font-size: 11px;
-            font-weight: 700;
-            letter-spacing: 0.08em;
-            text-transform: uppercase;
-            margin-bottom: 8px;
-        }
-
-        .summary-card .value {
-            font-size: 28px;
-            font-weight: 800;
-            line-height: 1;
-        }
-
-        .summary-card .meta {
-            margin-top: 8px;
-            color: var(--muted);
-            font-size: 12px;
-            line-height: 1.45;
-            min-height: 2.7em;
-        }
-
-        .panel-grid {
-            display: grid;
-            grid-template-columns: 1.1fr 0.9fr;
-            gap: 18px;
-        }
-
-        .panel {
-            border: 1px solid var(--border);
-            border-radius: var(--radius);
-            background: var(--card);
-            box-shadow: 0 8px 28px rgba(88,72,150,0.10);
-            overflow: hidden;
-            min-width: 0;
-        }
-
-        .panel-header {
-            padding: 16px 18px;
-            border-bottom: 1px solid var(--border);
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            gap: 12px;
-        }
-
-        .panel-header h3 {
-            margin: 0;
-            font-size: 15px;
-        }
-
-        .panel-header p {
-            margin: 4px 0 0;
-            color: var(--muted);
-            font-size: 12px;
-            line-height: 1.45;
-        }
-
-        .lattice-ref-admin .panel-body {
-            padding: 16px 18px 18px;
-        }
-
-        .lattice-ref-admin .chart-body {
-            padding: 16px 20px;
-        }
-
-        .form-grid {
-            display: grid;
-            grid-template-columns: repeat(2, minmax(0, 1fr));
-            gap: 10px;
-        }
-
-        .field {
-            display: flex;
-            flex-direction: column;
-            gap: 6px;
-        }
-
-        .field.full { grid-column: 1 / -1; }
-
-        label {
-            color: var(--muted);
-            font-size: 12px;
-            font-weight: 700;
-        }
-
-        input, textarea {
-            width: 100%;
-            border: 1px solid var(--border);
-            background: var(--input);
-            color: var(--text);
-            border-radius: 8px;
-            padding: 10px 12px;
-            font: inherit;
-            font-size: 13px;
-            outline: none;
-        }
-
-        textarea {
-            min-height: 80px;
-            resize: vertical;
-        }
-
-        input:focus, textarea:focus {
-            border-color: rgba(111,66,232,0.44);
-            box-shadow: 0 0 0 3px rgba(111,66,232,0.08);
-        }
-
-        .toolbar {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            gap: 12px;
-            margin-top: 12px;
-            flex-wrap: wrap;
-        }
-
-        .status-copy {
-            color: var(--muted);
-            font-size: 12px;
-        }
-
-        .tag-row {
-            display: flex;
-            flex-wrap: wrap;
-            gap: 8px;
-        }
-
-        .panel-tools {
-            display: flex;
-            align-items: flex-end;
-            justify-content: flex-end;
-            gap: 10px;
-            flex-wrap: wrap;
-            min-width: 260px;
-        }
-
-        .export-control {
-            display: flex;
-            align-items: center;
-            justify-content: flex-end;
-            gap: 8px;
-            flex-wrap: wrap;
-        }
-
-        .export-options {
-            display: none;
-            align-items: center;
-            gap: 6px;
-            flex-wrap: wrap;
-        }
-
-        .export-options.open {
-            display: flex;
-        }
-
-        .export-options .table-btn {
-            background: var(--surface-2);
-            white-space: nowrap;
-        }
-
-        .tag {
-            display: inline-flex;
-            align-items: center;
-            gap: 6px;
-            padding: 5px 9px;
-            border-radius: 999px;
-            border: 1px solid var(--border);
-            background: var(--surface-2);
-            color: var(--muted);
-            font-size: 12px;
-            font-weight: 600;
-        }
-
-        .tag.high { border-color: rgba(229,57,53,0.32); color: var(--danger); background: rgba(229,57,53,0.07); }
-        .tag.medium { border-color: rgba(216,165,74,0.34); color: #b07a00; background: rgba(216,165,74,0.08); }
-        .tag.low { border-color: rgba(34,196,160,0.34); color: #0d8f72; background: rgba(34,196,160,0.08); }
-
-        .two-col {
-            display: grid;
-            grid-template-columns: repeat(2, minmax(0, 1fr));
-            gap: 12px;
-        }
-
-        .audit-grid {
-            display: grid;
-            grid-template-columns: repeat(5, minmax(0, 1fr));
-            gap: 10px;
-            margin-bottom: 14px;
-        }
-
-        .audit-metric {
-            border: 1px solid var(--border);
-            border-radius: 12px;
-            background: var(--surface);
-            padding: 12px;
-            min-width: 0;
-        }
-
-        .audit-metric .label {
-            color: var(--faint);
-            font-size: 11px;
-            font-weight: 800;
-            letter-spacing: 0.06em;
-            text-transform: uppercase;
-            margin-bottom: 8px;
-        }
-
-        .audit-metric .value {
-            font-size: 24px;
-            font-weight: 800;
-            line-height: 1;
-        }
-
-        .audit-metric .meta {
-            color: var(--muted);
-            font-size: 12px;
-            margin-top: 7px;
-            line-height: 1.4;
-        }
-
-        .subpanel {
-            border: 1px solid var(--border);
-            border-radius: 12px;
-            background: var(--card);
-            padding: 14px;
-            min-width: 0;
-        }
-
-        .subpanel h4 {
-            margin: 0 0 10px;
-            font-size: 13px;
-            display: flex;
-            align-items: center;
-            gap: 7px;
-        }
-
-        .list {
-            display: flex;
-            flex-direction: column;
-            gap: 8px;
-            max-height: 320px;
-            overflow: auto;
-        }
-
-        .item {
-            border: 1px solid var(--border);
-            border-radius: 10px;
-            background: var(--surface-2);
-            padding: 10px 11px;
-        }
-
-        .item-meta {
-            display: flex;
-            flex-wrap: wrap;
-            gap: 6px;
-            margin-bottom: 6px;
-        }
-
-        .preview {
-            color: var(--muted);
-            font-size: 12px;
-            line-height: 1.5;
-            word-break: break-word;
-        }
-
-        .table-wrap {
-            overflow: auto;
-            border: 1px solid var(--border);
-            border-radius: 12px;
-        }
-
-        table {
-            width: 100%;
-            border-collapse: collapse;
-            min-width: 820px;
-            background: transparent;
-        }
-
-        th, td {
-            padding: 11px 10px;
-            border-bottom: 1px solid var(--border);
-            text-align: left;
-            vertical-align: middle;
-            font-size: 13px;
-            color: var(--text);
-        }
-
-        th {
-            color: var(--muted);
-            background: rgba(111,66,232,0.05);
-            font-size: 12px;
-            letter-spacing: 0.02em;
-        }
-
-        td .actions {
-            display: flex;
-            gap: 6px;
-            flex-wrap: wrap;
-        }
-
-        .table-btn {
-            border: 1px solid rgba(111,66,232,0.15);
-            background: var(--surface-2);
-            color: var(--text);
-            border-radius: 8px;
-            padding: 7px 9px;
-            cursor: pointer;
-            font-size: 12px;
-            font-weight: 600;
-        }
-
-        .table-btn:hover {
-            border-color: rgba(111,66,232,0.32);
-            background: rgba(111,66,232,0.08);
-            color: var(--accent);
-        }
-
-        .table-btn.danger:hover {
-            border-color: rgba(229,57,53,0.24);
-            background: rgba(229,57,53,0.08);
-            color: var(--danger);
-        }
-
-        .role {
-            display: inline-flex;
-            align-items: center;
-            padding: 4px 8px;
-            border-radius: 999px;
-            border: 1px solid var(--border);
-            color: var(--muted);
-            font-size: 12px;
-            font-weight: 700;
-        }
-
-        .footer-space { height: 8px; }
-
-        .muted {
-            color: var(--muted);
-        }
-
-        .error {
-            color: var(--danger);
-        }
-
-        @media (max-width: 1100px) {
-            .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-            .audit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-            .panel-grid { grid-template-columns: 1fr; }
-        }
-
-        @media (max-width: 760px) {
-            .topbar, .content { width: auto; }
-            .topbar {
-                padding: 16px;
-                align-items: flex-start;
-                flex-direction: column;
-            }
-            .content { padding: 16px; gap: 14px; }
-            .hero h2 { font-size: 22px; }
-            .summary-grid { grid-template-columns: 1fr; }
-            .audit-grid { grid-template-columns: 1fr; }
-            .two-col, .form-grid { grid-template-columns: 1fr; }
-            .field.full { grid-column: auto; }
-            .panel-header { align-items: stretch; flex-direction: column; }
-            .panel-tools,
-            .export-control { align-items: stretch; justify-content: flex-start; min-width: 0; }
-            .lattice-ref-admin .inline-control,
-            .lattice-ref-admin .button-row { align-items: stretch; flex-direction: column; }
-        }
-
-        .lang-picker { position: relative; }
-        .lang-picker-menu {
-            display: none;
-            position: absolute;
-            top: calc(100% + 6px);
-            right: 0;
-            background: var(--surface-elevated);
-            border: 1px solid var(--border);
-            border-radius: 8px;
-            padding: 4px;
-            min-width: 130px;
-            z-index: 100;
-            box-shadow: 0 8px 24px rgba(88,72,150,0.16);
-        }
-        .lang-picker-menu.open { display: block; }
-        .lang-option {
-            padding: 7px 10px;
-            border-radius: 7px;
-            cursor: pointer;
-            font-size: 13px;
-            color: var(--text);
-        }
-        .lang-option:hover { background: rgba(111,66,232,0.07); color: var(--text); }
-        .lang-option.active { color: var(--accent); font-weight: 600; }
-