.glass-card{position: relative;overflow: hidden;border: 1px solid var(--line);border-radius: 22px;background: linear-gradient(145deg, rgba(30, 41, 59, 0.58), rgba(15, 23, 42, 0.48));box-shadow: 0 18px 50px rgba(0, 0, 0, 0.16), 0 1px 0 rgba(255, 255, 255, 0.04) inset;backdrop-filter: blur(16px);}
.glass-card::before{position: absolute;top: 0;right: 0;left: 0;height: 1px;background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.45), transparent);content: '';opacity: 0.58;}
.card-label, .card-kicker, .badge, .stat-label, .code-label{color: var(--text-muted);font: 600 10px/1.3 var(--font-mono);letter-spacing: 0.09em;text-transform: uppercase;}
.card-label, .card-kicker{display: block;margin-bottom: 11px;}
.badge{display: inline-flex;align-items: center;min-height: 24px;padding: 5px 9px;border: 1px solid rgba(34, 211, 238, 0.28);border-radius: 999px;background: rgba(34, 211, 238, 0.08);color: var(--cyan);}
.badge.violet{border-color: rgba(139, 92, 246, 0.32);background: rgba(139, 92, 246, 0.1);color: #b49aff;}
.badge.green{border-color: rgba(34, 197, 94, 0.32);background: rgba(34, 197, 94, 0.1);color: #86efac;}
.badge.amber{border-color: rgba(245, 158, 11, 0.34);background: rgba(245, 158, 11, 0.1);color: #fcd34d;}
.icon-tile{display: grid;width: 48px;height: 48px;place-items: center;border: 1px solid rgba(34, 211, 238, 0.28);border-radius: 15px;background: linear-gradient(135deg, rgba(34, 211, 238, 0.15), rgba(59, 130, 246, 0.1));color: var(--cyan);font: 700 19px/1 var(--font-mono);}
.icon-tile.violet{border-color: rgba(139, 92, 246, 0.34);background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(59, 130, 246, 0.1));color: #b49aff;}
.icon-tile.amber{border-color: rgba(245, 158, 11, 0.36);background: linear-gradient(135deg, rgba(245, 158, 11, 0.17), rgba(239, 68, 68, 0.08));color: #fcd34d;}
.icon-tile.green{border-color: rgba(34, 197, 94, 0.36);background: linear-gradient(135deg, rgba(34, 197, 94, 0.17), rgba(6, 182, 212, 0.08));color: #86efac;}
.dot{display: inline-block;width: 7px;height: 7px;border-radius: 50%;background: currentColor;box-shadow: 0 0 13px currentColor;}
.dot.blue{color: var(--blue);}
.dot.cyan{color: var(--cyan);}
.dot.violet{color: var(--violet);}
.dot.green{color: var(--green);}
.dot.amber{color: var(--amber);}
.dot.red{color: var(--red);}
.list-clean{display: grid;gap: 12px;}
.list-clean li{position: relative;padding-right: 22px;color: var(--text-soft);font-size: clamp(13px, 1.05vw, 18px);line-height: 1.75;}
.list-clean li::before{position: absolute;top: 0.75em;right: 0;width: 7px;height: 7px;border: 1px solid var(--cyan);border-radius: 2px;box-shadow: 0 0 10px rgba(34, 211, 238, 0.52);content: '';transform: translateY(-50%) rotate(45deg);}
.stat-row{display: flex;flex-wrap: wrap;gap: 10px;}
.stat{display: grid;gap: 6px;min-width: 124px;padding: 13px 15px;border: 1px solid var(--line);border-radius: 14px;background: rgba(15, 23, 42, 0.42);}
.stat-value{color: var(--text);font: 700 clamp(17px, 1.55vw, 27px)/1.1 var(--font-mono);}
.stat-value.cyan{color: var(--cyan);}
.stat-value.violet{color: #b49aff;}
.stat-value.green{color: #86efac;}
.quote{position: relative;padding: 23px 28px 21px;border-right: 2px solid var(--cyan);border-radius: 0 18px 18px 0;background: linear-gradient(90deg, rgba(34, 211, 238, 0.05), transparent);color: var(--text);font-size: clamp(17px, 1.5vw, 27px);font-weight: 700;line-height: 1.75;}
.quote::before{position: absolute;top: -9px;right: 10px;color: rgba(34, 211, 238, 0.4);content: '“';font: 900 56px/1 Georgia, serif;}
.flow{display: flex;align-items: center;justify-content: center;gap: 11px;direction: ltr;}
.flow-node{display: flex;min-width: 110px;min-height: 54px;align-items: center;justify-content: center;padding: 11px 15px;border: 1px solid rgba(34, 211, 238, 0.3);border-radius: 13px;background: rgba(15, 23, 42, 0.76);color: var(--text-soft);font-size: 13px;font-weight: 700;text-align: center;}
.flow-node.active{border-color: rgba(34, 211, 238, 0.72);background: rgba(34, 211, 238, 0.1);color: var(--cyan);box-shadow: 0 0 24px rgba(34, 211, 238, 0.11);}
.flow-arrow{color: var(--text-muted);font: 18px/1 var(--font-mono);}
.mini-grid{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 13px;}
.mini-card{display: grid;grid-template-columns: auto 1fr;gap: 12px;align-items: center;padding: 17px;}
.mini-card h3{color: var(--text);font-size: clamp(14px, 1.1vw, 20px);font-weight: 700;}
.mini-card p{margin-top: 5px;color: var(--text-muted);font-size: clamp(11px, 0.84vw, 15px);line-height: 1.6;}
.node-graph{position: relative;display: grid;min-height: 340px;place-items: center;}
.node-graph::before, .node-graph::after{position: absolute;border: 1px solid rgba(34, 211, 238, 0.18);border-radius: 50%;content: '';}
.node-graph::before{width: 270px;height: 270px;box-shadow: 0 0 55px rgba(34, 211, 238, 0.08) inset;}
.node-graph::after{width: 430px;height: 430px;border-color: rgba(139, 92, 246, 0.14);}
.graph-lines{position: absolute;width: 430px;height: 430px;border: 1px dashed rgba(148, 163, 184, 0.15);border-radius: 50%;transform: rotate(-28deg) scaleY(0.42);}
.graph-core{position: relative;z-index: 2;display: grid;width: 118px;height: 118px;place-items: center;border: 1px solid rgba(34, 211, 238, 0.72);border-radius: 34px;background: radial-gradient(circle at 35% 25%, rgba(34, 211, 238, 0.28), rgba(15, 23, 42, 0.96) 64%);color: var(--cyan);font: 700 19px/1.2 var(--font-mono);text-align: center;box-shadow: 0 0 42px rgba(34, 211, 238, 0.2), 0 0 0 12px rgba(34, 211, 238, 0.04);}
.graph-node{position: absolute;z-index: 3;display: grid;min-width: 90px;gap: 4px;padding: 9px 12px;border: 1px solid var(--line);border-radius: 12px;background: rgba(15, 23, 42, 0.88);color: var(--text-soft);font: 600 11px/1.2 var(--font-mono);text-align: center;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);}
.graph-node small{color: var(--text-muted);font: 10px/1.2 var(--font-sans);}
.graph-node:nth-of-type(1){top: 5%;right: 18%;}
.graph-node:nth-of-type(2){top: 20%;left: 10%;}
.graph-node:nth-of-type(3){bottom: 15%;left: 19%;}
.graph-node:nth-of-type(4){right: 8%;bottom: 19%;}
.layer-stack{display: grid;gap: 8px;max-width: 620px;margin-inline: auto;}
.layer{display: flex;align-items: center;justify-content: space-between;min-height: 54px;padding: 11px 19px;border: 1px solid var(--line);border-radius: 13px;background: linear-gradient(90deg, rgba(34, 211, 238, 0.12), rgba(15, 23, 42, 0.72));}
.layer:nth-child(2){margin-inline: 7%;}
.layer:nth-child(3){margin-inline: 14%;}
.layer:nth-child(4){margin-inline: 21%;}
.layer strong{color: var(--text);font-size: clamp(13px, 1.1vw, 19px);}
.layer span{color: var(--text-muted);font: 10px var(--font-mono);}
.arrow-down{color: var(--cyan);font: 18px/1 var(--font-mono);text-align: center;}
.terminal{overflow: hidden;border: 1px solid rgba(148, 163, 184, 0.2);border-radius: 18px;background: #080d1a;box-shadow: 0 20px 55px rgba(0, 0, 0, 0.3);}
.terminal-bar{display: flex;height: 38px;align-items: center;justify-content: space-between;padding: 0 14px;border-bottom: 1px solid rgba(148, 163, 184, 0.12);background: rgba(30, 41, 59, 0.36);}
.terminal-dots{display: flex;gap: 6px;direction: ltr;}
.terminal-dots i{width: 7px;height: 7px;border-radius: 50%;background: #475569;}
.terminal-dots i:first-child{background: #f87171;}
.terminal-dots i:nth-child(2){background: #fbbf24;}
.terminal-dots i:last-child{background: #4ade80;}
.terminal-title{color: var(--text-muted);font: 10px var(--font-mono);}
.terminal-body{padding: 22px;color: #94a3b8;font: clamp(11px, 0.92vw, 16px)/2 var(--font-mono);direction: ltr;text-align: left;}
.terminal-line{display: block;}
.terminal-line .prompt{color: var(--cyan);}
.terminal-line .ok{color: #86efac;}
.terminal-line .warn{color: #fcd34d;}
.terminal-line .muted{color: #64748b;}
.code-block{padding: 19px 21px;border: 1px solid rgba(34, 211, 238, 0.2);border-radius: 16px;background: rgba(2, 6, 23, 0.65);color: var(--text-soft);font: clamp(11px, 0.86vw, 15px)/1.9 var(--font-mono);direction: ltr;text-align: left;}
.code-block .key{color: #93c5fd;}
.code-block .string{color: #86efac;}
.code-block .comment{color: #64748b;}
.prompt-card{padding: 21px 24px;border: 1px solid rgba(139, 92, 246, 0.3);border-radius: 17px;background: linear-gradient(135deg, rgba(139, 92, 246, 0.13), rgba(15, 23, 42, 0.62));}
.prompt-card p{margin-top: 12px;color: var(--text-soft);font-size: clamp(14px, 1.1vw, 19px);line-height: 1.9;}
.prompt-card .prompt-prefix{color: #c4b5fd;font: 600 12px var(--font-mono);}
.matrix{display: grid;overflow: hidden;border: 1px solid var(--line);border-radius: 18px;}
.matrix-row{display: grid;grid-template-columns: 1.05fr 1.7fr;border-bottom: 1px solid rgba(148, 163, 184, 0.11);}
.matrix-row:last-child{border-bottom: 0;}
.matrix-row > *{padding: 16px 19px;}
.matrix-row strong{color: var(--text);font-size: clamp(12px, 0.96vw, 17px);}
.matrix-row span{color: var(--text-soft);font-size: clamp(12px, 0.92vw, 16px);}
.matrix-head{background: rgba(34, 211, 238, 0.07);}
.matrix-head > *{color: var(--cyan) !important;font: 600 10px var(--font-mono);letter-spacing: 0.08em;text-transform: uppercase;}
.model-card{display: grid;gap: 15px;padding: 21px;}
.model-card h3{color: var(--text);font: 700 20px var(--font-mono);}
.model-card p{color: var(--text-muted);font-size: 13px;line-height: 1.7;}
.model-card .model-meta{display: flex;flex-wrap: wrap;gap: 7px;}
.model-bar{display: grid;gap: 7px;}
.model-bar-label{display: flex;justify-content: space-between;color: var(--text-muted);font-size: 11px;}
.model-bar-track{height: 5px;overflow: hidden;border-radius: 8px;background: rgba(100, 116, 139, 0.2);}
.model-bar-value{height: 100%;border-radius: inherit;background: linear-gradient(90deg, var(--cyan), var(--blue));}
.model-bar-value.violet{background: linear-gradient(90deg, var(--violet), #c4b5fd);}
.model-bar-value.green{background: linear-gradient(90deg, var(--green), var(--cyan));}
.flow-vertical{display: grid;max-width: 490px;gap: 8px;margin-inline: auto;}
.flow-step{display: grid;grid-template-columns: 35px 1fr auto;gap: 13px;align-items: center;padding: 12px 15px;border: 1px solid var(--line);border-radius: 13px;background: rgba(15, 23, 42, 0.64);}
.flow-step-index{display: grid;width: 28px;height: 28px;place-items: center;border: 1px solid rgba(34, 211, 238, 0.4);border-radius: 9px;color: var(--cyan);font: 600 11px var(--font-mono);}
.flow-step strong{color: var(--text);font-size: 13px;}
.flow-step small{color: var(--text-muted);font-size: 11px;}
.pill-row{display: flex;flex-wrap: wrap;gap: 9px;}
.pill{padding: 8px 12px;border: 1px solid rgba(148, 163, 184, 0.18);border-radius: 999px;background: rgba(15, 23, 42, 0.55);color: var(--text-soft);font-size: 12px;}
.pill.cyan{border-color: rgba(34, 211, 238, 0.32);color: var(--cyan);}
.pill.violet{border-color: rgba(139, 92, 246, 0.34);color: #c4b5fd;}
