/* dragon-seal.css
 *
 * Procedural Dragon Seal — all tier palettes + animations + copy-protection.
 * Spec: ~/Documents/ASI_Investment_Framework/DragonSeal/2026-05-09_DragonSeal_Visual_Spec_v2.md
 *
 * Self-contained: no Tailwind, no CSS modules, no build step required.
 * Drop into any page via <link rel="stylesheet" href="dragon-seal.css">.
 */

/* ─── Container + copy-protection ─────────────────────────────────────────── */

.dragon-seal-frame {
  display: inline-block;
  position: relative;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  cursor: default;
}

.dragon-seal-frame svg {
  display: block;
  pointer-events: auto;
  user-select: none;
}

.dragon-seal-frame text {
  user-select: none;
  -webkit-user-select: none;
  pointer-events: none;
}

/* ─── Default tier palette (STANDARD) ─────────────────────────────────────── */

.dragon-seal[data-tier="standard"] {
  --seal-bg:        #0a0a0a;
  --seal-primary:   #c9a14d;
  --seal-text:      #e8e4d8;
  --seal-text-dim:  #a89976;
  --seal-accent:    #00d4d4;
  --seal-aurora-1:  #c9a14d;
  --seal-aurora-2:  #e8e4d8;
  --seal-aurora-3:  #00d4d4;
}

/* PLATFORM (Trade Proto Inc. itself) */
.dragon-seal[data-tier="platform"] {
  --seal-bg:        #050505;
  --seal-primary:   #f4d77f;
  --seal-text:      #fafaf6;
  --seal-text-dim:  #c0b78a;
  --seal-accent:    #00d4d4;
  --seal-aurora-1:  #f4d77f;
  --seal-aurora-2:  #fafaf6;
  --seal-aurora-3:  #00d4d4;
}

/* NOTARY (RON-attested — bronze) */
.dragon-seal[data-tier="notary"] {
  --seal-bg:        #0a0a0a;
  --seal-primary:   #b08850;
  --seal-text:      #e8d4b0;
  --seal-text-dim:  #a08854;
  --seal-accent:    #d4af37;
  --seal-aurora-1:  #b08850;
  --seal-aurora-2:  #e8d4b0;
  --seal-aurora-3:  #d4af37;
}

/* SGS / COA (cargo inspection — silver) */
.dragon-seal[data-tier="sgs"] {
  --seal-bg:        #0a0a0a;
  --seal-primary:   #c0c0c0;
  --seal-text:      #f0f0f0;
  --seal-text-dim:  #a0a0a0;
  --seal-accent:    #00d4d4;
  --seal-aurora-1:  #c0c0c0;
  --seal-aurora-2:  #f0f0f0;
  --seal-aurora-3:  #80a0c0;
}

/* ACCREDITED (Reg D 506(c) — white-gold + diamond) */
.dragon-seal[data-tier="accredited"] {
  --seal-bg:        #0a0a0a;
  --seal-primary:   #e8d77a;
  --seal-text:      #ffffff;
  --seal-text-dim:  #b8b8b8;
  --seal-accent:    #d4af37;
  --seal-aurora-1:  #e8d77a;
  --seal-aurora-2:  #ffffff;
  --seal-aurora-3:  #d4af37;
}

/* BANK (ABEKS / Vantage — deep gold + cyan) */
.dragon-seal[data-tier="bank"] {
  --seal-bg:        #050505;
  --seal-primary:   #d4af37;
  --seal-text:      #f4e4a0;
  --seal-text-dim:  #a89055;
  --seal-accent:    #00d4d4;
  --seal-aurora-1:  #d4af37;
  --seal-aurora-2:  #f4e4a0;
  --seal-aurora-3:  #00d4d4;
}

/* ─── Layer fills/strokes (read from CSS vars above) ──────────────────────── */

.dragon-seal .seal-disc-fill   { fill:   var(--seal-bg); }
.dragon-seal .seal-disc-stroke { stroke: var(--seal-primary); }

.dragon-seal text { fill: var(--seal-text); font-family: 'Cinzel', 'Marcellus', 'Trajan Pro', Georgia, serif; }
.dragon-seal .seal-entity-name   { font-size: 13px; font-weight: 600; letter-spacing: 0.18em; fill: var(--seal-text); }
.dragon-seal .seal-jurisdiction  { font-size: 10px; font-weight: 500; letter-spacing: 0.20em; fill: var(--seal-text); }
.dragon-seal .seal-registration  { font-size:  9px; font-weight: 400; letter-spacing: 0.15em; fill: var(--seal-text-dim); }
.dragon-seal .seal-date          { font-size: 10px; font-weight: 400; letter-spacing: 0.25em; fill: var(--seal-text-dim); }
.dragon-seal .seal-context-label { font-size:  8px; font-weight: 600; letter-spacing: 0.30em; fill: var(--seal-accent); }
.dragon-seal .seal-commodity-text { font-size: 11px; font-weight: 500; letter-spacing: 0.20em; fill: var(--seal-primary); }

.dragon-seal .seal-sha {
  font-family: 'JetBrains Mono', 'SF Mono', 'Berkeley Mono', 'Menlo', monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.05em;
  fill: var(--seal-accent);
  font-variant-numeric: tabular-nums;
}
.dragon-seal .seal-tenant-code {
  font-family: 'JetBrains Mono', 'SF Mono', 'Menlo', monospace;
  font-size: 7px;
  font-weight: 400;
  letter-spacing: 0.10em;
  fill: var(--seal-text-dim);
  font-variant-numeric: tabular-nums;
}

.dragon-seal .seal-dot { fill: var(--seal-primary); }

.dragon-seal .seal-badge-bg     { fill: var(--seal-bg);      stroke: var(--seal-primary); stroke-width: 1; }
.dragon-seal .seal-badge-active { fill: var(--seal-primary); stroke: var(--seal-primary); }
.dragon-seal .seal-badge-icon   { fill: var(--seal-bg);      stroke: var(--seal-text);    stroke-width: 1.2; }
.dragon-seal .seal-badge-empty  { fill: none;                stroke: var(--seal-text-dim); stroke-width: 0.8; stroke-dasharray: 1.5 2; opacity: 0.5; }

.dragon-seal .seal-sigil-stroke { stroke: var(--seal-primary); fill: none; stroke-width: 1.5; }
.dragon-seal .seal-sigil-accent { stroke: var(--seal-accent);  fill: none; stroke-width: 1; }
.dragon-seal .seal-sigil-fill   { fill:   var(--seal-bg); }

/* ─── Animations ──────────────────────────────────────────────────────────── */

.dragon-seal[data-animate="true"] .seal-layer-5 {
  transform-origin: 240px 240px;
  animation: seal-rotate-ccw 120s linear infinite;
  will-change: transform;
}
.dragon-seal[data-animate="true"] .seal-layer-4 {
  transform-origin: 240px 240px;
  animation: seal-rotate-cw 60s linear infinite;
  will-change: transform;
}
.dragon-seal[data-animate="true"] .seal-layer-3-aurora {
  animation: seal-aurora-flow 8s ease-in-out infinite;
  will-change: stroke-dashoffset;
}

@keyframes seal-rotate-cw  { from { transform: rotate(   0deg); } to { transform: rotate( 360deg); } }
@keyframes seal-rotate-ccw { from { transform: rotate(   0deg); } to { transform: rotate(-360deg); } }
@keyframes seal-aurora-flow {
  0%   { stroke-dashoffset:    0; }
  50%  { stroke-dashoffset: -565; }
  100% { stroke-dashoffset:-1130; }
}

/* Mouse-parallax layers transition smoothly back when cursor leaves */
.dragon-seal .seal-mouse-reactive {
  transform-origin: 240px 240px;
  transition: transform 350ms cubic-bezier(0.2, 0.9, 0.3, 1);
  will-change: transform;
}

/* ─── Accessibility: respect reduced-motion ───────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .dragon-seal .seal-layer-5,
  .dragon-seal .seal-layer-4,
  .dragon-seal .seal-layer-3-aurora { animation: none !important; }
  .dragon-seal .seal-mouse-reactive { transform: none !important; }
}

/* ─── Print: freeze + add static-render watermark ─────────────────────────── */

@media print {
  .dragon-seal .seal-layer-5,
  .dragon-seal .seal-layer-4,
  .dragon-seal .seal-layer-3-aurora { animation: none !important; }
  .dragon-seal .seal-mouse-reactive { transform: none !important; }
  .dragon-seal-frame::after {
    content: "PROOF · STATIC RENDER";
    display: block;
    text-align: center;
    font: 7px/1 'JetBrains Mono', 'Menlo', monospace;
    letter-spacing: 0.2em;
    color: #888;
    margin-top: 4px;
  }
}
