:root {
      --jade:       #3d7a5e;
      --jade-light: #6db89a;
      --crimson:    #7a1c2e;
      --sky:        #1e3a5f;
      --elem-mad:   #4a7c3f;
      --elem-fog:   #8b2020;
      --elem-ter:   #8b7020;
      --elem-met:   #5a5a6e;
      --elem-agu:   #1e4a6e;
    }
    .container-pagina { max-width: 960px; }

    /* ── Inputs ── */
    .campo-grimorio { display:flex; flex-direction:column; gap:8px; margin-bottom:18px; }
    .campo-grimorio label { font-family:'Cinzel',serif; font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); opacity:.85; }
    .campo-grimorio select, .campo-grimorio input {
      background:rgba(255,255,255,.04); border:1px solid rgba(201,168,76,.25);
      border-radius:6px; color:var(--parchment); font-family:'EB Garamond',serif;
      font-size:1.05rem; padding:10px 14px; outline:none; transition:border-color .3s; width:100%;
    }
    .campo-grimorio select:focus, .campo-grimorio input:focus {
      border-color:rgba(201,168,76,.6); box-shadow:0 0 0 3px rgba(201,168,76,.08);
    }
    .campo-grimorio select option { background:#1a1118; }
    .campos-grid  { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
    .campos-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    @media(max-width:600px){ .campos-grid{grid-template-columns:1fr 1fr;} .campos-grid2{grid-template-columns:1fr;} }

    /* ── Botões ── */
    .botao-grimorio {
      font-family:'Cinzel',serif; font-size:.74rem; letter-spacing:.25em; text-transform:uppercase;
      color:var(--ink); background:linear-gradient(135deg,var(--gold),var(--gold-light));
      border:none; border-radius:6px; padding:14px 32px; cursor:pointer;
      transition:opacity .3s,transform .2s,box-shadow .3s; width:100%;
      box-shadow:0 4px 20px rgba(201,168,76,.25);
    }
    .botao-grimorio:hover:not(:disabled){ opacity:.9; transform:translateY(-1px); box-shadow:0 6px 28px rgba(201,168,76,.4); }
    .botao-grimorio:disabled{ opacity:.38; cursor:not-allowed; }
    .botao-secundario {
      font-family:'Cinzel',serif; font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
      color:var(--gold); background:transparent; border:1px solid rgba(201,168,76,.4);
      border-radius:6px; padding:10px 24px; cursor:pointer; transition:all .3s;
    }
    .botao-secundario:hover{ background:rgba(201,168,76,.08); border-color:var(--gold); }

    /* ── Spinner ── */
    .spinner-grimorio { width:36px;height:36px; border:2px solid rgba(201,168,76,.2); border-top-color:var(--gold); border-radius:50%; animation:spin .9s linear infinite; margin:20px auto; }
    @keyframes spin{ to{transform:rotate(360deg);} }

    /* ── Divisor ── */
    .divisor{ display:flex; align-items:center; gap:14px; width:100%; max-width:280px; margin:0 auto; }
    .divisor-linha{ flex:1; height:1px; background:linear-gradient(to right,transparent,var(--gold),transparent); }
    .divisor-simbolo{ color:var(--gold-light); font-size:1.1rem; text-shadow:0 0 8px currentColor; }

    /* ── Secao titulo ── */
    .secao-titulo { font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold); opacity:.65; margin-bottom:8px; display:block; }

    /* ═══════════════════════════════
       OS QUATRO PILARES
    ═══════════════════════════════ */
    #area-resultado{ display:none; animation:fadeIn .6s ease; }

    .pilares-grid {
      display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:16px 0;
    }
    @media(max-width:580px){ .pilares-grid{grid-template-columns:repeat(2,1fr);} }

    .pilar-card {
      background:rgba(201,168,76,.04); border:1px solid rgba(201,168,76,.2);
      border-radius:10px; padding:16px 12px; text-align:center;
      display:flex; flex-direction:column; align-items:center; gap:6px;
      transition:all .3s; cursor:default;
    }
    .pilar-card:hover{ border-color:rgba(201,168,76,.45); background:rgba(201,168,76,.08); }
    .pilar-card.destaque-dia{ border-color:rgba(201,168,76,.55); background:rgba(201,168,76,.1); box-shadow:0 0 20px rgba(201,168,76,.12); }

    .pilar-label { font-family:'Cinzel',serif; font-size:.55rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); opacity:.6; }
    .pilar-chines-grande { font-size:2.2rem; line-height:1; color:var(--gold-light); text-shadow:0 0 14px rgba(201,168,76,.4); }
    .pilar-pinyin { font-family:'EB Garamond',serif; font-style:italic; font-size:.9rem; color:var(--mist); }
    .pilar-elemento { font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.12em; padding:2px 8px; border-radius:12px; }
    .pilar-animal { font-family:'EB Garamond',serif; font-size:.85rem; color:var(--parchment); opacity:.8; }
    .pilar-na-yin { font-family:'EB Garamond',serif; font-style:italic; font-size:.78rem; color:var(--mist); opacity:.65; }
    .pilar-deus { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.1em; color:var(--gold); opacity:.75; margin-top:2px; }

    /* separador tronco/ramo */
    .pilar-sep { width:40px; height:1px; background:rgba(201,168,76,.25); }

    /* ── Cores por elemento ── */
    .elem-Madeira { color:var(--elem-mad); border:1px solid rgba(74,124,63,.4); }
    .elem-Fogo    { color:var(--elem-fog); border:1px solid rgba(139,32,32,.4); }
    .elem-Terra   { color:var(--elem-ter); border:1px solid rgba(139,112,32,.4); }
    .elem-Metal   { color:var(--elem-met); border:1px solid rgba(90,90,110,.4); }
    .elem-Água    { color:var(--elem-agu); border:1px solid rgba(30,74,110,.4); }

    /* ═══════════════════════════════
       TRONCOS OCULTOS
    ═══════════════════════════════ */
    .ocultos-row { display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
    .oculto-tag  {
      font-family:'Cinzel',serif; font-size:.55rem; letter-spacing:.1em;
      color:var(--mist); border:1px solid rgba(200,191,176,.2);
      padding:2px 8px; border-radius:12px; opacity:.7;
    }

    /* ═══════════════════════════════
       MAPA DE ELEMENTOS
    ═══════════════════════════════ */
    .elementos-row { display:flex; gap:10px; flex-wrap:wrap; margin:12px 0; }
    .elemento-bar {
      flex:1; min-width:80px; background:rgba(255,255,255,.03);
      border:1px solid rgba(201,168,76,.15); border-radius:8px;
      padding:12px 10px; text-align:center;
    }
    .elem-barra-titulo { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; margin-bottom:6px; display:block; }
    .elem-barra-count  { font-family:'Cinzel Decorative',serif; font-size:1.4rem; color:var(--gold); }
    .elem-barra-fill   { height:4px; border-radius:2px; margin-top:6px; transition:width .8s ease; }

    /* ═══════════════════════════════
       DEZ DEUSES — TABELA
    ═══════════════════════════════ */
    .tabela-grimorio { width:100%; border-collapse:collapse; font-size:.95rem; margin-bottom:14px; }
    .tabela-grimorio th { font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); border-bottom:1px solid rgba(201,168,76,.3); padding:8px 10px; text-align:left; }
    .tabela-grimorio td { padding:8px 10px; border-bottom:1px solid rgba(255,255,255,.04); color:var(--parchment); line-height:1.5; }
    .tabela-grimorio tr:hover td { background:rgba(201,168,76,.04); }

    .cat-Irmão      { color:#a89060; }
    .cat-Filho      { color:var(--jade-light); }
    .cat-Tesouro    { color:var(--gold-light); }
    .cat-Autoridade { color:#c06060; }
    .cat-Recurso    { color:#80a0d0; }

    /* ═══════════════════════════════
       ESTRELAS ESPECIAIS
    ═══════════════════════════════ */
    .estrelas-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }
    .estrela-card {
      flex:1; min-width:180px; background:rgba(201,168,76,.05);
      border:1px solid rgba(201,168,76,.25); border-radius:8px; padding:14px 16px;
    }
    .estrela-nome   { font-family:'Cinzel',serif; font-size:.72rem; letter-spacing:.1em; color:var(--gold-light); margin-bottom:4px; display:block; }
    .estrela-efeito { font-family:'EB Garamond',serif; font-size:.9rem; color:var(--parchment); opacity:.8; line-height:1.5; }
    .estrela-tipo-badge {
      font-family:'Cinzel',serif; font-size:.5rem; letter-spacing:.12em; text-transform:uppercase;
      padding:2px 8px; border-radius:10px; margin-left:6px;
    }
    .tipo-Proteção  { color:var(--jade-light); border:1px solid rgba(109,184,154,.35); }
    .tipo-Romance   { color:#c08080; border:1px solid rgba(192,128,128,.35); }
    .tipo-Inteligência { color:#80a0d0; border:1px solid rgba(128,160,208,.35); }
    .tipo-Liderança    { color:var(--gold); border:1px solid rgba(201,168,76,.35); }
    .tipo-Isolamento   { color:var(--mist); border:1px solid rgba(200,191,176,.25); }
    .tipo-Obstáculo    { color:#c06060; border:1px solid rgba(192,96,96,.35); }

    .sem-estrelas { font-family:'EB Garamond',serif; font-style:italic; color:var(--mist); opacity:.65; font-size:1rem; }

    /* ── Cor do tronco no Mestre ── */
    .mestre-cor-dot { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; vertical-align:middle; box-shadow:0 0 8px currentColor; }

    /* ── Ramo: polaridade badge ── */
    .pilar-polaridade-ramo { font-family:'Cinzel',serif; font-size:.5rem; letter-spacing:.12em; color:var(--mist); opacity:.65; margin-top:1px; }
    .pilar-mes-hora { font-family:'EB Garamond',serif; font-style:italic; font-size:.72rem; color:var(--mist); opacity:.5; }

    /* ── Estrela: condicao colapsável ── */
    .estrela-condicao-toggle {
      font-family:'Cinzel',serif; font-size:.5rem; letter-spacing:.14em; text-transform:uppercase;
      color:var(--gold); opacity:.6; cursor:pointer; margin-top:8px; display:inline-block;
      background:none; border:none; padding:0; transition:opacity .2s;
    }
    .estrela-condicao-toggle:hover { opacity:1; }
    .estrela-condicao-box {
      display:none; margin-top:8px; padding:10px 12px;
      background:rgba(0,0,0,.25); border-left:2px solid rgba(201,168,76,.3);
      border-radius:0 6px 6px 0; font-family:'EB Garamond',serif;
      font-size:.85rem; line-height:1.6; color:var(--mist); opacity:.8;
    }
    .estrela-condicao-box.aberta { display:block; animation:fadeIn .3s ease; }

    /* ═══════════════════════════════
       CICLOS DE FORTUNA
    ═══════════════════════════════ */
    .ciclos-linha {
      display:flex; gap:0; overflow-x:auto; padding-bottom:8px;
      scrollbar-width:thin; scrollbar-color:rgba(201,168,76,.3) transparent;
    }
    .ciclo-bloco {
      min-width:90px; flex-shrink:0;
      border:1px solid rgba(201,168,76,.2); border-right:none;
      padding:12px 10px; text-align:center; transition:all .3s; cursor:default;
      background:rgba(255,255,255,.02);
    }
    .ciclo-bloco:last-child{ border-right:1px solid rgba(201,168,76,.2); border-radius:0 8px 8px 0; }
    .ciclo-bloco:first-child{ border-radius:8px 0 0 8px; }
    .ciclo-bloco:hover{ background:rgba(201,168,76,.07); border-color:rgba(201,168,76,.4); z-index:1; position:relative; }
    .ciclo-bloco.ativo{ background:rgba(201,168,76,.1); border-color:rgba(201,168,76,.55); box-shadow:0 0 16px rgba(201,168,76,.15); }

    .ciclo-idade   { font-family:'Cinzel',serif; font-size:.55rem; letter-spacing:.15em; color:var(--gold); opacity:.7; text-transform:uppercase; }
    .ciclo-chines  { font-size:1.5rem; color:var(--gold-light); text-shadow:0 0 10px rgba(201,168,76,.35); line-height:1.2; margin:4px 0; }
    .ciclo-pinyin  { font-family:'EB Garamond',serif; font-style:italic; font-size:.78rem; color:var(--mist); opacity:.8; }
    .ciclo-elem    { font-family:'Cinzel',serif; font-size:.5rem; letter-spacing:.1em; margin-top:4px; }

    /* ═══════════════════════════════
       BLOCO IA
    ═══════════════════════════════ */
    .bloco-ia { background:rgba(61,122,94,.06); border:1px solid rgba(61,122,94,.22); border-radius:8px; padding:20px; }
    .bloco-ia p { font-size:1.05rem; line-height:1.75; color:var(--parchment); margin-bottom:12px; }
    .bloco-ia p:last-child{ margin-bottom:0; }

    /* ═══════════════════════════════
       MESTRE DO DESTINO
    ═══════════════════════════════ */
    .mestre-banner {
      display:flex; align-items:center; gap:20px; flex-wrap:wrap;
      background:rgba(201,168,76,.05); border:1px solid rgba(201,168,76,.25);
      border-radius:10px; padding:18px 20px; margin-bottom:20px;
    }
    .mestre-chines-big { font-size:3.5rem; line-height:1; color:var(--gold); text-shadow:0 0 24px rgba(201,168,76,.5); }
    .mestre-info h3    { font-family:'Cinzel Decorative',serif; font-size:1.2rem; color:var(--gold-light); margin-bottom:4px; }
    .mestre-info p     { font-family:'EB Garamond',serif; font-size:1rem; color:var(--mist); margin:0; line-height:1.6; }
    .mestre-tags       { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
    .mestre-tag        { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.12em; color:var(--gold); border:1px solid rgba(201,168,76,.3); padding:3px 10px; border-radius:12px; }

    blockquote.citacao-grimorio { border-left:2px solid var(--gold); margin:0 0 14px 0; padding:10px 18px; font-style:italic; color:var(--mist); font-size:1.05rem; background:rgba(201,168,76,.04); border-radius:0 6px 6px 0; }
	
	/* ──═══════════════════════════════
	Ajustes de Hierarquia para a Tabela de Deuses 
	═══════════════════════════════── */

	.linha-tronco-visivel td { 
	  background: rgba(201,168,76,.08); 
	  font-weight: 500; 
	  border-top: 1px solid rgba(201,168,76,.3);
	}
	.linha-tronco-oculto td { 
	  padding-left: 20px; 
	  opacity: 0.85; 
	  border-bottom: 1px dashed rgba(255,255,255,.05); 
	}
	.linha-tronco-oculto td:first-child { 
	  color: var(--mist); 
	  font-size: 0.85rem; 
	  padding-left: 28px;
	}
	
	    /* ── Cursor piscante durante streaming ── */
    .cursor-bazi {
      display: inline-block;
      width: 2px;
      height: 1em;
      background: var(--gold);
      margin-left: 2px;
      vertical-align: text-bottom;
      animation: blink-cursor 0.8s step-end infinite;
    }
    @keyframes blink-cursor {
      0%, 100% { opacity: 1; }
      50%       { opacity: 0; }
    }