ltcai 4.0.0 → 4.1.0

package/static/css/reference/account.css

@@ -1,439 +0,0 @@
-/* Lattice AI — account / auth page (account.html, body.lattice-ref-auth). Token-native. */
-/* ============================================================
-   ACCOUNT / AUTH PAGE  (account.html)
-   Token-native product entry surface — unified with chat/graph/admin pages.
-   ============================================================ */
-
-        * { box-sizing: border-box; margin: 0; padding: 0; }
-        html, body.lattice-ref-auth { height: 100%; }
-        body.lattice-ref-auth {
-            font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
-            color: var(--text);
-            background: var(--app-bg);
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            min-height: 100vh;
-            padding: 24px;
-            overflow: hidden;
-            position: relative;
-        }
-
-        body::before {
-            content: '';
-            position: fixed;
-            inset: 0;
-            background:
-                radial-gradient(circle, rgba(123,109,255,0.28) 1px, transparent 1.8px),
-                linear-gradient(rgba(123,109,255,0.08) 1px, transparent 1px),
-                linear-gradient(90deg, rgba(123,109,255,0.06) 1px, transparent 1px);
-            background-size: 82px 82px, 46px 46px, 46px 46px;
-            background-position: 16px 18px, 0 0, 0 0;
-            mask-image: linear-gradient(180deg, rgba(0,0,0,0.18), rgba(0,0,0,0.02));
-            pointer-events: none;
-        }
-
-        body::after {
-            content: '';
-            position: fixed;
-            inset: 0;
-            background:
-                radial-gradient(ellipse at 8% 78%, rgba(142,111,255,0.24), transparent 34%),
-                linear-gradient(115deg, transparent 0 35%, rgba(111,75,246,0.09) 35.2%, transparent 35.6% 100%);
-            pointer-events: none;
-        }
-
-        .orb {
-            display: none;
-        }
-
-        .login-shell {
-            width: min(920px, 100%);
-            display: grid;
-            grid-template-columns: minmax(280px, 400px) minmax(220px, 1fr);
-            align-items: center;
-            gap: 46px;
-            position: relative;
-            z-index: 1;
-        }
-
-        .brand-preview {
-            min-height: 360px;
-            border-radius: 34px;
-            background:
-                radial-gradient(circle at 54% 45%, rgba(111,75,246,0.24), transparent 18%),
-                linear-gradient(145deg, rgba(255,255,255,0.68), rgba(244,239,255,0.32));
-            border: 1px solid rgba(111,75,246,0.12);
-            box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
-            position: relative;
-            overflow: hidden;
-        }
-        .brand-preview::before {
-            content: '';
-            position: absolute;
-            inset: auto -12% 0 -8%;
-            height: 46%;
-            background: linear-gradient(135deg, rgba(111,75,246,0.24), rgba(255,255,255,0.12));
-            clip-path: polygon(0 62%, 18% 42%, 36% 54%, 55% 26%, 76% 44%, 100% 20%, 100% 100%, 0 100%);
-            filter: blur(1px);
-        }
-        .preview-node {
-            position: absolute;
-            width: 52px;
-            height: 52px;
-            border-radius: 17px;
-            background: var(--surface-2);
-            border: 1px solid rgba(111,75,246,0.18);
-            box-shadow: 0 18px 40px rgba(111,75,246,0.16);
-        }
-        .preview-node::after {
-            content: '';
-            position: absolute;
-            inset: 14px;
-            border-radius: 10px;
-            background: linear-gradient(135deg, #6f4bf6, #9f8cff);
-        }
-        .preview-node.n1 { top: 52px; left: 58px; }
-        .preview-node.n2 { top: 112px; right: 64px; }
-        .preview-node.n3 { left: 120px; bottom: 92px; }
-        .preview-node.n4 { right: 120px; bottom: 58px; }
-        .preview-line {
-            position: absolute;
-            height: 2px;
-            width: 150px;
-            background: linear-gradient(90deg, transparent, rgba(111,75,246,0.45), transparent);
-            transform-origin: left center;
-        }
-        .preview-line.l1 { top: 108px; left: 112px; transform: rotate(18deg); }
-        .preview-line.l2 { top: 186px; left: 176px; transform: rotate(112deg); }
-        .preview-line.l3 { bottom: 112px; left: 172px; transform: rotate(-13deg); }
-
-        .card {
-            width: min(400px, 100%);
-            background: var(--card);
-            border: 1px solid rgba(111,75,246,0.13);
-            border-radius: 14px;
-            padding: 38px 34px;
-            box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,0.9);
-            position: relative;
-            z-index: 1;
-            backdrop-filter: none; /* glass removed v3.5.0 */
-        }
-
-        .card::before {
-            content: '';
-            position: absolute;
-            top: 0; left: 50%;
-            transform: translateX(-50%);
-            width: 55%; height: 1px;
-            background: linear-gradient(90deg, transparent, rgba(111,75,246,0.65), rgba(123,109,255,0.45), transparent);
-        }
-
-        .logo {
-            width: 54px; height: 54px;
-            background: linear-gradient(135deg, #6f4bf6 0%, #8d7aff 100%);
-            border-radius: 10px;
-            display: flex; align-items: center; justify-content: center;
-            font-size: 26px; color: #fff;
-            margin: 0 auto 18px;
-            box-shadow: 0 16px 34px rgba(111,75,246,0.28);
-        }
-
-        .title {
-            text-align: center;
-            font-size: 23px;
-            font-weight: 800;
-            margin-bottom: 6px;
-            background: linear-gradient(135deg, #1f2140 35%, #6f4bf6 82%);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            background-clip: text;
-        }
-
-        .subtitle {
-            text-align: center;
-            color: var(--muted);
-            font-size: 12.5px;
-            margin-bottom: 26px;
-            line-height: 1.5;
-        }
-
-        .input {
-            width: 100%;
-            padding: 12px 14px;
-            margin-bottom: 10px;
-            background: var(--surface);
-            border: 1px solid rgba(111,75,246,0.16);
-            color: var(--text);
-            border-radius: 8px;
-            outline: none;
-            font-size: 14px;
-            font-family: inherit;
-            transition: border-color .15s, box-shadow .15s;
-        }
-        .input:focus {
-            border-color: rgba(111,75,246,0.52);
-            box-shadow: 0 0 0 4px rgba(111,75,246,0.10);
-        }
-        .input::placeholder { color: var(--faint); }
-
-        .submit {
-            width: 100%;
-            padding: 13px;
-            background: linear-gradient(135deg, #6f4bf6, #7b6dff);
-            color: #fff;
-            border: none;
-            border-radius: 8px;
-            cursor: pointer;
-            font-weight: 800;
-            font-size: 14px;
-            font-family: inherit;
-            box-shadow: 0 14px 30px rgba(111,75,246,0.24);
-            transition: all .18s;
-            margin-top: 4px;
-        }
-        .submit:hover {
-            background: linear-gradient(135deg, #5f3ee6, #705fff);
-            box-shadow: 0 18px 38px rgba(111,75,246,0.30);
-            transform: translateY(-1px);
-        }
-        .submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
-
-        .switch {
-            margin-top: 18px;
-            text-align: center;
-            font-size: 12.5px;
-            color: var(--faint);
-        }
-        .switch a { color: #6f4bf6; text-decoration: none; font-weight: 700; }
-        .switch a:hover { text-decoration: underline; }
-
-        .sso-divider {
-            display: flex; align-items: center; gap: 10px;
-            margin: 14px 0 10px;
-            color: var(--faint); font-size: 11.5px;
-        }
-        .sso-divider::before, .sso-divider::after {
-            content: ''; flex: 1;
-            height: 1px; background: rgba(111,75,246,0.12);
-        }
-        .sso-btn {
-            width: 100%;
-            padding: 12px;
-            background: var(--surface-2);
-            border: 1px solid rgba(111,75,246,0.15);
-            color: var(--text);
-            border-radius: 8px;
-            cursor: pointer;
-            font-weight: 600;
-            font-size: 13.5px;
-            font-family: inherit;
-            display: flex; align-items: center; justify-content: center; gap: 8px;
-            transition: all .18s;
-        }
-        .sso-btn:hover {
-            background: var(--surface);
-            border-color: rgba(111,75,246,0.34);
-        }
-
-        .msg {
-            font-size: 12px;
-            min-height: 18px;
-            margin-bottom: 6px;
-            text-align: center;
-            color: #d44f5c;
-        }
-        .msg.ok { color: var(--success); }
-
-        /* Lang picker */
-        .lang-wrap {
-            position: absolute;
-            top: 12px;
-            right: 12px;
-            z-index: 10;
-        }
-        .lang-btn {
-            background: var(--surface-2);
-            border: 1px solid rgba(111,75,246,0.18);
-            color: var(--text);
-            border-radius: 8px;
-            padding: 7px 12px;
-            font-size: 13px;
-            font-family: inherit;
-            cursor: pointer;
-            transition: background .15s;
-            box-shadow: 0 10px 28px rgba(86,70,160,0.12);
-        }
-        .lang-btn:hover { background: rgba(111,75,246,0.08); }
-        .lang-menu {
-            display: none;
-            position: absolute;
-            top: calc(100% + 6px);
-            right: 0;
-            background: var(--surface-elevated);
-            border: 1px solid rgba(111,75,246,0.15);
-            border-radius: 8px;
-            padding: 4px;
-            min-width: 130px;
-            box-shadow: 0 18px 44px rgba(86,70,160,0.16);
-        }
-        .lang-menu.open { display: block; }
-        .lang-opt {
-            padding: 7px 10px;
-            border-radius: 7px;
-            cursor: pointer;
-            font-size: 13px;
-            color: var(--muted);
-        }
-        .lang-opt:hover { background: rgba(111,75,246,0.07); color: var(--text); }
-        .lang-opt.active { color: var(--accent); font-weight: 700; }
-
-        @media (max-width: 760px) {
-            .login-shell { display: block; }
-            .brand-preview { display: none; }
-        }
-
-:root[data-lt-theme="dark"] body.lattice-ref-auth .title,
-:root[data-lt-theme="dark"] body.lattice-ref-auth #register-section .title {
-    background: none;
-    -webkit-background-clip: border-box;
-    background-clip: border-box;
-    -webkit-text-fill-color: currentColor;
-    color: var(--text);
-}
-
-/* Product-grade auth surface — functional entry point, token-native. */
-.lattice-ref-auth {
-  background: var(--app-bg);
-}
-
-.lattice-ref-auth::before {
-  background:
-    linear-gradient(90deg, rgba(12, 92, 115, 0.05) 1px, transparent 1px),
-    linear-gradient(180deg, rgba(12, 92, 115, 0.05) 1px, transparent 1px);
-  background-size: 42px 42px;
-  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.32), transparent 76%);
-}
-
-.lattice-ref-auth::after,
-.lattice-ref-auth .orb,
-.auth-wave,
-.auth-network {
-  display: none;
-}
-
-.auth-titlebar {
-  background: var(--surface-elevated);
-  border-bottom-color: var(--line);
-  color: var(--text);
-}
-
-.auth-window-brand i,
-.lattice-ref-auth .hero-logo-mark {
-  color: var(--accent);
-}
-
-.auth-window-controls span::before,
-.auth-window-controls span::after {
-  background: var(--text);
-  border-color: var(--text);
-}
-
-.lattice-ref-auth .login-shell {
-  width: min(980px, calc(100vw - 36px));
-  grid-template-columns: minmax(300px, 430px) minmax(280px, 1fr);
-}
-
-.lattice-ref-auth .brand-preview {
-  display: block;
-  border-radius: 8px;
-  background:
-    linear-gradient(135deg, var(--accent-soft), transparent 58%),
-    var(--surface);
-  border-color: var(--line);
-  box-shadow: none;
-}
-
-.lattice-ref-auth .preview-node {
-  border-radius: 8px;
-  background: var(--surface-2);
-  border-color: var(--line);
-  box-shadow: none;
-}
-
-.lattice-ref-auth .preview-node::after {
-  background: linear-gradient(135deg, var(--accent), var(--accent-2));
-  border-radius: 8px;
-}
-
-.lattice-ref-auth .preview-line {
-  background: linear-gradient(90deg, transparent, var(--accent-2), transparent);
-}
-
-.lattice-ref-auth .card {
-  border-radius: 8px;
-  background: var(--surface-elevated);
-  border-color: var(--line);
-  box-shadow: var(--shadow);
-}
-
-.lattice-ref-auth .card::before {
-  background: linear-gradient(90deg, transparent, var(--accent), var(--accent-2), transparent);
-}
-
-.lattice-ref-auth .title {
-  background: none;
-  color: var(--text);
-  -webkit-text-fill-color: currentColor;
-}
-
-.lattice-ref-auth .subtitle {
-  color: var(--muted);
-  font-weight: 700;
-}
-
-.lattice-ref-auth .input,
-.lattice-ref-auth .auth-field,
-.lattice-ref-auth .sso-btn {
-  background: var(--input);
-  border-color: var(--line);
-  color: var(--text);
-}
-
-.lattice-ref-auth .input:focus,
-.lattice-ref-auth .auth-field:focus-within {
-  border-color: var(--accent);
-  box-shadow: 0 0 0 3px var(--accent-soft);
-}
-
-.lattice-ref-auth .submit {
-  background: var(--accent);
-  box-shadow: none;
-}
-
-.lattice-ref-auth .submit:hover {
-  background: var(--accent-deep);
-  box-shadow: none;
-}
-
-.lattice-ref-auth .local-start,
-.lattice-ref-auth .register-cta,
-.lattice-ref-auth .switch a {
-  color: var(--accent);
-}
-
-.lattice-ref-auth .lang-btn,
-.lattice-ref-auth .lang-menu {
-  border-color: var(--line);
-  box-shadow: none;
-}
-
-@media (max-width: 760px) {
-  .lattice-ref-auth .login-shell {
-    grid-template-columns: 1fr;
-  }
-
-  .lattice-ref-auth .brand-preview {
-    display: none;
-  }
-}