.mythic-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:20px; justify-content:space-between; padding:20px 23px; border:1px solid #ba80664a; border-radius:11px; background:linear-gradient(120deg,#40202e2b,#11151f); margin-bottom:22px; }.mythic-metrics { display:flex; flex-wrap:wrap; gap:35px; }.mythic-metrics>div { display:flex; flex-direction:column; gap:9px; }.mythic-metrics span { color:#bba3b8; font-size:.64rem; }.mythic-metrics strong { color:#ecc695; font-size:.96rem; font-weight:500; }.mythic-preview-label { display:flex; align-items:center; gap:10px; color:#bba5ba; font-size:.64rem; }.mythic-preview-label select { padding:10px; border:1px solid #b57c634d; border-radius:6px; background:#0e141d; color:#e0c09f; font:inherit; font-size:.71rem; }
.mythic-layout { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:20px; align-items:start; }.mythic-viewport { min-width:0; overflow:auto; border:1px solid #ae7d6542; border-radius:12px; background:radial-gradient(ellipse at 5% 50%,#55776a26,transparent 38%),linear-gradient(140deg,#162028,#10141f); scrollbar-width:thin; scrollbar-color:#73505f #10151f; }.mythic-board { position:relative; width:100%; min-width:1050px; aspect-ratio:1180/790; background:radial-gradient(ellipse at 95% 15%,#794b9a0d,transparent 35%),radial-gradient(ellipse at 95% 85%,#794b9a0d,transparent 35%); }.mythic-connections { position:absolute; width:100%; height:100%; inset:0; }
.mythic-core { position:absolute; left:8.475%; top:50%; width:15%; aspect-ratio:1; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; border:1px solid #799d8a5e; border-radius:50%; background:radial-gradient(circle,#73562c22 20%,#34635e22 50%,#101925 69%); box-shadow:0 0 0 8px #7b9a8610,0 0 0 15px #94ab8b08,inset 0 0 0 6px #cad2a20a; }.mythic-core>span { color:#d7c0a3; font-size:.74rem; }.mythic-rank-emblem { width:50px; height:50px; object-fit:contain; }.mythic-core>strong { font-size:.78rem; color:#e3bb7b; font-variant-numeric:tabular-nums; font-weight:500; }.mythic-core>small { color:#9d9aa8; font-size:.45rem; letter-spacing:1px; }
.loyalty-profile .mythic-node { position:absolute; display:grid; place-items:center; width:2.7%; height:4.03%; transform:translate(-50%,-50%); padding:0; border-radius:50%; border:1px solid #8798a478; background:radial-gradient(circle at 35% 30%,#29333d,#0b151d 75%); box-shadow:0 0 0 2px #0b111b,inset 0 0 0 2px #8a9b9e2b; }.loyalty-profile .mythic-node.is-filled { border-color:#d0ad78; background:radial-gradient(circle,#5a3c354a,#111822); box-shadow:0 0 0 2px #0c1520,0 0 8px #c7985b22; }.loyalty-profile .mythic-node.is-terminal { width:4%; height:5.97%; border:2px solid #a76bb8; box-shadow:0 0 0 3px #27182c,0 0 0 4px #b183bf66,0 0 25px #9b4cc44d; }.loyalty-profile .mythic-node[aria-pressed=true] { border-color:#f7c59a; box-shadow:0 0 0 3px #d9878273,0 0 18px #d9878240; }.mythic-node-icon { position:relative; display:block; width:70%; height:70%; border-radius:50%; overflow:hidden; }.mythic-node-icon img { position:absolute; top:0; left:0; width:160%; height:160%; max-width:none; object-fit:fill; }
.mythic-aside { display:grid; gap:15px; }.mythic-card { padding:20px 17px; border:1px solid #b27a6540; border-radius:10px; background:radial-gradient(ellipse at top left,#a13a4d15,transparent 70%),#11151f; }.mythic-kicker { display:block; color:#ca97a5; font-size:.5rem; letter-spacing:1.1px; line-height:1.8; margin-bottom:12px; }.mythic-card h4 { color:#e8c8a5; font-size:.89rem; font-weight:500; margin:0 0 15px; }.mythic-note { color:#b7a4bb; font-size:.7rem; line-height:1.9; }.mythic-card dl>div { border-top:1px solid #a5746028; padding:12px 0; }.mythic-card dt { color:#b69aae; font-size:.62rem; margin-bottom:7px; }.mythic-card dd { margin:0; color:#e0b991; font-size:.76rem; line-height:1.8; }.mythic-attribute-icon { position:relative; width:36px; height:36px; display:block; overflow:hidden; border-radius:6px; border:1px solid #c39a6059; margin-bottom:15px; }.mythic-attribute-icon img { position:absolute; top:0; left:0; width:160%; height:160%; max-width:none; object-fit:fill; }.mythic-detail-title { display:block; color:#e9c7a3; font-size:.81rem; line-height:1.8; margin-bottom:10px; }.mythic-level { color:#cda9bd; font-size:.73rem; margin:12px 0; }.mythic-system>.mythic-note { margin:17px 0; }.mythic-demo { border-left:2px solid #b65d72; padding-left:12px; color:#b59cb5; font-size:.67rem; line-height:1.9; }
.mythic-viewport:focus-visible { outline:2px solid #dda18b; outline-offset:3px; }
@media(max-width:1050px) { .mythic-layout { grid-template-columns:1fr; }.mythic-aside { grid-template-columns:repeat(3,minmax(0,1fr)); }.mythic-metrics { gap:22px; } }
@media(max-width:650px) { .mythic-aside { grid-template-columns:1fr; }.mythic-toolbar { padding:18px; }.mythic-metrics { gap:18px; }.mythic-metrics>div { min-width:120px; } }
@media(prefers-reduced-motion:reduce) { .mythic-system * { animation:none!important; transition:none!important; } }

/* Serafim: emblema central maior, luz contida e an?is orbitais. */
.mythic-core { gap:7px; isolation:isolate; background:radial-gradient(circle at 50% 45%,#a97c3f30 0%,#385c5033 47%,#101925 72%); box-shadow:0 0 0 6px #b9955410,0 0 26px #ba92421c,inset 0 0 22px #5c9e8d24; }
.mythic-core::before,.mythic-core::after { content:""; position:absolute; pointer-events:none; border-radius:50%; z-index:-1; }
.mythic-core::before { inset:5px; border:1px solid #c0a86b32; border-top-color:#f0d59cba; border-bottom-color:#76bdac70; box-shadow:inset 0 0 7px #dbc18c10; animation:mythic-orbit 18s linear infinite; }
.mythic-core::after { inset:14px; border:1px dashed #b4bb8a2e; background:radial-gradient(circle,#e4b86716,transparent 68%); animation:mythic-halo 4.8s ease-in-out infinite; }
.mythic-core>span { color:#f0d9b6; letter-spacing:.07em; text-shadow:0 1px 8px #d1a66533; }
.mythic-rank-emblem { width:68px; height:68px; flex-shrink:0; filter:drop-shadow(0 0 7px #e2ad554f); animation:mythic-emblem-light 4.8s ease-in-out infinite; }
.mythic-core>strong { color:#f5d28e; }
.mythic-core>small { color:#bfb5aa; }
.loyalty-profile .mythic-effects { border:1px solid #bd98724d; border-radius:6px; padding:10px 13px; background:#171b25; color:#d9c3a2; font:inherit; font-size:.66rem; cursor:pointer; transition:border-color .2s,background .2s; }
.loyalty-profile .mythic-effects:hover { border-color:#cda66b; background:#27222a; }
.loyalty-profile .mythic-effects:focus-visible { outline:2px solid #e9be7b; outline-offset:3px; }
.mythic-system.is-motion-paused .mythic-core::before,.mythic-system.is-motion-paused .mythic-core::after,.mythic-system.is-motion-paused .mythic-rank-emblem { animation-play-state:paused; }
@keyframes mythic-orbit { to { transform:rotate(360deg); } }
@keyframes mythic-halo { 0%,100% { opacity:.45; transform:scale(.97); } 50% { opacity:1; transform:scale(1.03); } }
@keyframes mythic-emblem-light { 0%,100% { filter:drop-shadow(0 0 5px #e2ad5540); } 50% { filter:drop-shadow(0 0 11px #f0ba6475); } }
@media(prefers-reduced-motion:reduce) { .mythic-core::before,.mythic-core::after,.mythic-rank-emblem { animation:none!important; } }