﻿.vocation-guide-panel{--vg-accent:#f0b429;--vg-bg:#070b17;--vg-surface:#0d1324;--vg-surface2:#11192d;--vg-line:#252f49;--vg-text:#eef2fb;--vg-muted:#8e99b2;display:none;min-height:calc(100vh - 80px);padding:20px 20px 44px;background:radial-gradient(900px 420px at 40% -120px,color-mix(in srgb,var(--vg-accent) 13%,transparent),transparent 65%),#070b17;color:var(--vg-text)}
.vocation-guide-panel.is-visible{display:block}.vg-shell{max-width:1540px;margin:0 auto}.vg-topbar{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:16px 4px 20px;border-bottom:1px solid var(--vg-line)}.vg-kicker,.vg-card-head span,.vg-modal-head span{display:block;color:var(--vg-accent);font:800 .68rem 'Sora',sans-serif;letter-spacing:.14em;text-transform:uppercase}.vg-topbar h1{margin:4px 0 4px;font:900 clamp(1.35rem,2vw,2rem) 'League Spartan','Sora',sans-serif;letter-spacing:.01em}.vg-topbar p{margin:0;color:var(--vg-muted);font-size:.86rem}.vg-top-actions{display:flex;gap:9px;flex:0 0 auto}.vg-top-actions button,.vg-admin-toggle,.vg-inline-admin button,.vg-copy-preset,.vg-more-weapons{border:1px solid var(--vg-line);background:#10172a;color:#dce3f3;border-radius:10px;padding:9px 13px;font:800 .76rem 'Sora',sans-serif;cursor:pointer;transition:.18s}.vg-top-actions button:hover,.vg-inline-admin button:hover,.vg-copy-preset:hover,.vg-more-weapons:hover{border-color:color-mix(in srgb,var(--vg-accent) 60%,#334);color:#fff}.vg-admin-toggle.active{background:color-mix(in srgb,var(--vg-accent) 13%,#10172a)!important;border-color:color-mix(in srgb,var(--vg-accent) 55%,#334)!important;color:var(--vg-accent)!important}.vg-demo-banner{margin:14px 0 0;padding:10px 13px;border:1px dashed color-mix(in srgb,var(--vg-accent) 40%,#334);border-radius:10px;background:color-mix(in srgb,var(--vg-accent) 7%,#0b1120);color:#abb4c8;font-size:.76rem}.vg-demo-banner b{color:var(--vg-accent);margin-right:7px}.vg-layout{display:block;padding-top:16px}.vg-sidebar{position:sticky;top:78px;align-self:start;display:grid;gap:12px}.vg-filter-box,.vg-builds,.vg-sidebar-help{background:linear-gradient(160deg,#101728,#090f1e);border:1px solid var(--vg-line);border-radius:14px;padding:13px}.vg-filter-box>label,.vg-builds>label{display:block;margin-bottom:9px;color:#aab4ca;font:800 .69rem 'Sora',sans-serif;text-transform:uppercase;letter-spacing:.08em}.vg-vocations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.vg-vocations button{min-width:0;min-height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:10px;border:1px solid #29314a;background:#090e1a;color:#b1bbd0;font:800 .67rem 'Sora',sans-serif;cursor:pointer;transition:.18s}.vg-vocations button:last-child:nth-child(odd){grid-column:1/-1}.vg-vocations button img{width:43px;height:43px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5));transition:.18s}.vg-vocations button:hover{border-color:#46516f;color:#fff}.vg-vocations button.active{border-color:var(--vg-accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--vg-accent) 25%,transparent),0 0 18px color-mix(in srgb,var(--vg-accent) 8%,transparent);color:#fff;background:color-mix(in srgb,var(--vg-accent) 8%,#090e1a)}.vg-vocations button.active img{transform:scale(1.06)}.vg-level-box>div{display:grid;grid-template-columns:1fr auto;gap:7px}.vg-level-box input{width:100%;min-width:0;border:1px solid #2a3450;background:#070c17;color:var(--vg-accent);border-radius:9px;padding:9px 10px;font:900 1rem 'Sora',sans-serif;text-align:center;outline:none}.vg-level-box input:focus{border-color:var(--vg-accent)}.vg-level-box button{border:1px solid color-mix(in srgb,var(--vg-accent) 55%,#334);background:color-mix(in srgb,var(--vg-accent) 11%,#0a1020);color:var(--vg-accent);border-radius:9px;padding:0 10px;font:800 .64rem 'Sora',sans-serif;text-transform:uppercase;cursor:pointer}.vg-level-box small{display:block;margin-top:7px;color:#737f9a;font-size:.68rem}.vg-level-box small b{color:#d4dbeb}.vg-builds{display:grid;gap:7px}.vg-builds>label{margin-bottom:2px}.vg-builds button{border:1px solid #2a334c;background:#0b1120;color:#aeb8cd;border-radius:9px;padding:10px 11px;text-align:left;font:800 .72rem 'Sora',sans-serif;cursor:pointer}.vg-builds button.active{border-color:var(--vg-accent);background:color-mix(in srgb,var(--vg-accent) 13%,#0b1120);color:#fff}.vg-sidebar-help strong{font-size:.76rem;color:#d8dfed}.vg-sidebar-help p{margin:5px 0 0;color:#7f8aa2;font-size:.68rem;line-height:1.55}.vg-content{min-width:0}.vg-tab-pane{display:none}.vg-tab-pane.is-active{display:block}.vg-card{min-width:0;background:linear-gradient(160deg,rgba(16,23,40,.98),rgba(7,12,23,.99));border:1px solid var(--vg-line);border-radius:15px;padding:13px;box-shadow:0 16px 36px rgba(0,0,0,.18)}.vg-card-head{display:flex;align-items:end;justify-content:space-between;gap:8px;margin-bottom:11px}.vg-card-head h2{margin:2px 0 0;font:900 1rem 'League Spartan','Sora',sans-serif;text-transform:uppercase}.vg-card-head small{color:#77849d;font-size:.65rem}.vg-inline-admin{margin-top:10px;padding-top:10px;border-top:1px solid #202941}.vg-inline-admin button{width:100%;color:var(--vg-accent)}.vg-empty-card,.vg-empty-inline{color:#7e899f;font-size:.73rem;line-height:1.5}.vg-empty-card{padding:25px 10px;text-align:center;border:1px dashed #29334d;border-radius:10px}
/* Equipamentos */
.vg-eq-grid{display:grid;grid-template-columns:repeat(3,76px);grid-template-rows:repeat(4,76px);justify-content:center;gap:9px}.vg-eq-slot{position:relative;width:72px;height:72px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--vg-accent) 25%,#2a2530);border-radius:10px;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--vg-accent) 5%,#171016),#07090f 68%);cursor:default;color:#fff}.vg-eq-slot:nth-child(3),.vg-eq-slot:nth-child(6){margin-left:0}.vg-eq-slot:hover{z-index:8;border-color:color-mix(in srgb,var(--vg-accent) 65%,#563);box-shadow:0 0 18px color-mix(in srgb,var(--vg-accent) 8%,transparent)}.vg-slot-label{position:absolute;left:4px;top:3px;color:#5e687d;font-size:.48rem;text-transform:uppercase;letter-spacing:.04em;opacity:0;transition:.15s}.vg-eq-slot:hover .vg-slot-label{opacity:1}.vg-eq-sprite{display:block;width:42px;height:42px;background-image:url('/assets/vocation-guide/equipment/icons.webp');background-repeat:no-repeat;background-position:var(--vg-atlas-x) var(--vg-atlas-y);background-size:var(--vg-atlas-w) auto;image-rendering:pixelated;transform:scale(1.16);transform-origin:center;filter:drop-shadow(0 3px 5px rgba(0,0,0,.45))}.vg-eq-empty{display:grid;place-items:center;width:34px;height:34px;border:1px dashed #35405b;border-radius:8px;color:#536078}.vg-slot-none{font-size:.54rem;color:#56627b}.vg-item-tip{position:absolute;z-index:50;left:calc(100% + 7px);top:4px;width:190px;padding:9px 10px;background:#11151f;border:1px solid #3d4558;border-radius:7px;box-shadow:0 14px 34px rgba(0,0,0,.5);text-align:left;pointer-events:none;opacity:0;visibility:hidden;transform:translateX(-4px);transition:.14s}.vg-eq-slot:hover .vg-item-tip,.vg-picker-results button:hover .vg-item-tip{opacity:1;visibility:visible;transform:none}.vg-item-tip strong{display:block;color:#f3cc4c;font-size:.72rem}.vg-item-tip>small{display:block;margin:2px 0 7px;color:#808a9d;font-size:.57rem}.vg-item-tip span{display:flex;gap:5px;flex-wrap:wrap;margin-top:3px;color:#aeb6c5;font-size:.58rem}.vg-item-tip span b{color:#737e95;font-weight:700}.vg-more-weapons{width:100%;margin-top:10px;display:flex;justify-content:center;gap:8px;color:#d9dfeb}.vg-more-weapons span{display:inline-grid;place-items:center;min-width:20px;height:20px;border-radius:20px;background:var(--vg-accent);color:#090d16;font-size:.65rem}
/* Wheel */
.vg-wheel-wrap{display:grid;grid-template-columns:minmax(0,1fr) 236px;gap:9px}.vg-wheel-stage{position:relative;width:100%;aspect-ratio:1/1;max-width:860px;margin:0 auto;isolation:isolate}.vg-wheel-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.vg-wheel-base{z-index:0}.vg-wheel-vocation{z-index:1}.vg-wheel-color{z-index:2}.vg-wheel-svg{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.vg-wheel-slice{pointer-events:auto;cursor:default}.vg-wheel-slice:hover .vg-wheel-hover-path{fill:rgba(255,255,255,.2)}.vg-wheel-vocation-front{z-index:4;pointer-events:none}.vg-wheel-node{position:absolute;z-index:4;left:calc(var(--x) / 522 * 100%);top:calc(var(--y) / 522 * 100%);width:6.8%;aspect-ratio:1/1;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;cursor:default}.vg-wheel-node img{width:100%;height:100%;object-fit:contain;image-rendering:crisp-edges}
.vg-wheel-corner{position:absolute;width:34.1%;aspect-ratio:1/1;z-index:1;pointer-events:none}
.vg-wheel-corner-TL{top:0;left:0}.vg-wheel-corner-TR{top:0;right:0}.vg-wheel-corner-BL{bottom:0;left:0}.vg-wheel-corner-BR{bottom:0;right:0}
.vg-wheel-corner-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.vg-wheel-corner-icon{position:absolute;width:30%;aspect-ratio:1/1;transform:translate(-50%,-50%);object-fit:contain;image-rendering:crisp-edges}.vg-wheel-node.is-active{filter:none;opacity:1;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--vg-accent) 45%,transparent))}.vg-wheel-node span{position:absolute;right:-9px;bottom:-6px;min-width:19px;padding:1px 3px;border-radius:5px;background:#080b11;border:1px solid #495267;color:#e7ecf5;font:800 8px 'Sora',sans-serif}.vg-wheel-node span:empty{display:none}.vg-wheel-summary{align-self:start;display:grid;gap:6px;padding:9px;border:1px solid #252e43;border-radius:9px;background:#070c15}.vg-wheel-summary>strong{font-size:.68rem;color:#d8deeb}.vg-wheel-summary span{display:flex;justify-content:space-between;gap:6px;color:#7f8ba3;font-size:.58rem}.vg-wheel-summary b{color:#dce2ed}.vg-wheel-card>.vg-empty-inline{margin-top:8px}
/* RTC fiel ao painel de referÃªncia, com campos atuais adicionais */
.vg-rtc-shell{display:grid;gap:11px}.vg-rtc-box{position:relative;border:8px solid transparent;border-image:url('/assets/vocation-guide/rtc/frame.png') 5 fill repeat;padding:8px 8px 7px;background:#454545;color:#d1d1d1;font:11px Arial,sans-serif;text-shadow:0 1px #222;overflow:hidden}.vg-rtc-tab{height:29px;background-repeat:no-repeat;background-size:auto 29px;margin-bottom:5px}.vg-rtc-tab.shooter{background-image:url('/assets/vocation-guide/rtc/tab_shooter.png')}.vg-rtc-tab.healing{background-image:url('/assets/vocation-guide/rtc/tab_healing.png')}.vg-rtc-shooter-grid{display:grid;grid-template-columns:minmax(225px,1fr) 2px minmax(155px,.75fr);gap:9px}.vg-rtc-divider{width:2px;min-height:100%;background:url('/assets/vocation-guide/rtc/sep_v.png') repeat-y center/2px auto}.vg-rtc-columns,.vg-rtc-row{display:grid;grid-template-columns:36px 53px 65px 58px;align-items:center;gap:3px}.vg-rtc-columns{height:18px;color:#e3e3e3;font-weight:bold;font-size:10px}.vg-rtc-row{min-height:38px}.vg-rtc-icon-slot{position:relative;width:34px;height:34px;border:0;background:url('/assets/vocation-guide/rtc/actionbarslot.png') center/34px 34px no-repeat;padding:1px;display:grid;place-items:center;cursor:default}.vg-rtc-icon-slot[data-action]{cursor:pointer}.vg-rtc-spell-icon{width:32px;height:32px;background-image:url('/assets/vocation-guide/rtc/spell-icons-32x32.png');background-repeat:no-repeat;background-position:calc(var(--icon) * -32px) 0}.vg-rtc-potion{width:30px;height:30px;object-fit:contain}.vg-rtc-empty-icon{width:20px;height:7px;border-top:2px dotted #6a6a6a;border-bottom:2px dotted #6a6a6a}.vg-rtc-step,.vg-rtc-priority{height:24px;display:flex;align-items:center;justify-content:center;border:1px solid #5b5b5b;background:linear-gradient(#5b5b5b,#3d3d3d);box-shadow:inset 0 0 0 1px #2b2b2b;color:#efefef;font-weight:bold}.vg-rtc-step input,.vg-rtc-priority input{width:100%;height:100%;border:0;background:transparent;color:#fff;text-align:center;font:700 10px Arial;outline:none}.vg-rtc-side{min-width:0}.vg-rtc-side-top{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.vg-rtc-side-top b,.vg-rtc-rune-title b{display:block;margin-bottom:4px;font-size:10px}.vg-rtc-mini-icons{display:flex;gap:4px}.vg-rtc-rune-title{display:grid;grid-template-columns:40px 1fr 1fr;gap:3px;align-items:end;font-size:9px}.vg-rtc-side .vg-rtc-row{grid-template-columns:36px 0 55px 50px;gap:3px}.vg-rtc-side .vg-rtc-row>.vg-rtc-step:nth-child(2){display:none}.vg-rtc-toggles{display:grid;gap:2px;margin-top:5px}.vg-rtc-check{display:flex;align-items:center;min-height:16px;gap:4px;color:#dedede;font-size:10px;white-space:nowrap}.vg-rtc-check>input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.vg-rtc-check>span{width:12px;height:12px;background-image:url('/assets/vocation-guide/rtc/checkbox.png');background-size:12px 36px;background-position:0 0;flex:0 0 12px}.vg-rtc-check>input:checked+span{background-position:0 -24px}.vg-rtc-check>input:disabled+span{opacity:.8}.vg-rtc-check select,.vg-rtc-key{height:18px;margin-left:3px;border:1px solid #626262;background:#444;color:#eee;font:9px Arial}.vg-rtc-key{width:34px}.vg-rtc-check em{font-style:normal;border:1px solid #626262;padding:1px 4px;background:#444}.vg-heal-grid{display:grid;grid-template-columns:1fr 2px 1fr;gap:8px}.vg-heal-grid h4{margin:0 0 5px;font-size:10px}.vg-heal-row{display:flex;align-items:center;gap:5px;margin:3px 0}.vg-heal-row>span,.vg-heal-row>input{width:48px;height:24px;display:grid;place-items:center;border:1px solid #5b5b5b;background:linear-gradient(#5b5b5b,#3d3d3d);color:#eee;text-align:center;font:bold 10px Arial}.vg-copy-preset{display:block;margin:10px auto 0;background:var(--vg-accent);color:#111;border-color:transparent;text-transform:uppercase}.vg-loading{min-height:420px;display:grid;place-items:center;align-content:center;gap:10px;color:#8994ab}.vg-loading span{width:28px;height:28px;border:3px solid #27314b;border-top-color:#f0b429;border-radius:50%;animation:vgSpin .8s linear infinite}@keyframes vgSpin{to{transform:rotate(360deg)}}
/* Modal / Admin */
.vg-modal-backdrop{position:fixed;z-index:9999;inset:0;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.73);backdrop-filter:blur(5px)}.vg-modal{width:min(760px,96vw);max-height:91vh;overflow:auto;background:#0b1120;border:1px solid #313b57;border-radius:16px;padding:16px;color:#eaf0fb;box-shadow:0 30px 80px rgba(0,0,0,.62)}.vg-modal-wide{width:min(1240px,97vw)}.vg-modal-head{display:flex;justify-content:space-between;gap:15px;align-items:start;padding-bottom:12px;border-bottom:1px solid #263049}.vg-modal-head h3{margin:3px 0 2px;font:900 1.15rem 'League Spartan','Sora',sans-serif}.vg-modal-head p{margin:0;color:#8995ad;font-size:.7rem;line-height:1.5}.vg-modal-head>button{width:32px;height:32px;border:1px solid #39435d;border-radius:8px;background:#11192a;color:#afb8ca;font-size:1.2rem;cursor:pointer}.vg-editor-note{margin:12px 0;padding:9px 11px;border:1px solid color-mix(in srgb,var(--vg-accent) 30%,#334);border-radius:9px;background:color-mix(in srgb,var(--vg-accent) 6%,#0b1120);color:#a4aec3;font-size:.7rem}.vg-editor-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.vg-editor-slots>button{min-width:0;min-height:92px;display:flex;align-items:center;gap:8px;border:1px solid #2a3450;background:#080d19;color:#d9e0ed;border-radius:10px;padding:8px;text-align:left;cursor:pointer}.vg-editor-slots>button:hover,.vg-editor-slots>button.focus{border-color:var(--vg-accent)}.vg-editor-slots small{position:absolute;opacity:0}.vg-editor-slots b{font-size:.67rem;overflow:hidden;text-overflow:ellipsis}.vg-editor-section-title{display:flex;justify-content:space-between;align-items:center;margin:15px 0 8px}.vg-editor-section-title b{font-size:.76rem}.vg-editor-section-title button{border:1px solid #34415e;background:#121b2f;color:#dbe2ee;border-radius:7px;padding:6px 9px;cursor:pointer}.vg-weapon-edit-row{display:grid;grid-template-columns:90px 90px minmax(150px,1fr) 32px;gap:6px;margin-top:6px}.vg-weapon-edit-row select,.vg-weapon-edit-row>button{min-width:0;border:1px solid #303b57;background:#090f1d;color:#d8dfec;border-radius:8px;padding:6px}.vg-weapon-edit-row [data-weapon-item]{display:flex;align-items:center;gap:7px;cursor:pointer;text-align:left}.vg-weapon-edit-row .vg-eq-sprite{transform:scale(.85);flex:0 0 42px}.vg-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #252f48}.vg-modal-actions button{border:1px solid #34405d;background:#11192b;color:#dce3ef;border-radius:9px;padding:9px 12px;font:800 .7rem 'Sora',sans-serif;cursor:pointer}.vg-modal-actions .primary{background:var(--vg-accent);border-color:var(--vg-accent);color:#090d15}.danger{color:#ff8989!important;border-color:rgba(255,100,100,.3)!important}.vg-picker-search{width:100%;margin:12px 0 9px;border:1px solid #32405f;background:#080e1b;color:#edf2fb;border-radius:9px;padding:10px 12px;outline:none}.vg-picker-search:focus{border-color:var(--vg-accent)}.vg-picker-results,.vg-rtc-picker-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.vg-picker-results>button,.vg-rtc-picker-list>button{position:relative;min-width:0;display:flex;align-items:center;gap:8px;border:1px solid #263149;background:#080e1a;color:#dfe6f2;border-radius:9px;padding:7px;text-align:left;cursor:pointer}.vg-picker-results>button:hover,.vg-rtc-picker-list>button:hover{border-color:var(--vg-accent)}.vg-picker-results .vg-eq-sprite{flex:0 0 42px;transform:scale(.9)}.vg-picker-results b,.vg-rtc-picker-list b{display:block;font-size:.68rem}.vg-picker-results small,.vg-rtc-picker-list small{display:block;color:#7f8aa0;font-size:.58rem;margin-top:2px}.vg-picker-results .vg-item-tip{left:10px;top:calc(100% + 4px)}.vg-wheel-editor-layout{display:grid;grid-template-columns:minmax(420px,560px) 1fr;gap:14px;margin-top:13px}.vg-wheel-editor-stage .vg-wheel-node{cursor:pointer}.vg-wheel-order{min-width:0;border:1px solid #27324c;border-radius:10px;padding:10px;background:#080e1b}.vg-wheel-order-row{display:grid;grid-template-columns:23px 30px minmax(62px,1fr) 64px 42px 27px 27px 27px;gap:4px;align-items:center;margin:4px 0}.vg-wheel-order-row img{width:28px;height:28px}.vg-wheel-order-row b{font-size:.61rem}.vg-wheel-order-row input{width:100%;border:1px solid #34405c;background:#0e1628;color:#fff;border-radius:6px;padding:5px;text-align:center}.vg-wheel-order-row button{height:27px;border:1px solid #34405c;background:#111a2d;color:#cbd4e6;border-radius:6px;cursor:pointer}.vg-order-num{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--vg-accent);color:#0b0f18;font:900 .6rem 'Sora'}.vg-modal .vg-rtc-shell{margin-top:12px}.vg-modal .vg-rtc-box{max-width:820px;margin:0 auto}.vg-toast{position:fixed;z-index:12000;left:50%;bottom:24px;transform:translate(-50%,15px);padding:10px 15px;border:1px solid #405071;border-radius:10px;background:#10182a;color:#eaf0fb;box-shadow:0 15px 36px rgba(0,0,0,.45);font:700 .72rem 'Sora';opacity:0;pointer-events:none;transition:.2s}.vg-toast.show{opacity:1;transform:translate(-50%,0)}.vg-weapon-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.vg-weapon-options>div{display:flex;align-items:center;gap:10px;border:1px solid #29344f;border-radius:10px;padding:8px;background:#080e1a}.vg-weapon-options b,.vg-weapon-options small{display:block}.vg-weapon-options b{font-size:.7rem}.vg-weapon-options small{color:#7e899f;font-size:.6rem}
@media(max-width:1320px){.vg-content{grid-template-columns:minmax(250px,.8fr) minmax(400px,1.2fr)}.vg-rtc-card{grid-column:1/-1}.vg-rtc-shell{grid-template-columns:1.45fr .8fr}.vg-sidebar{top:70px}}
@media(max-width:980px){.vocation-guide-panel{padding:14px 12px 34px}.vg-layout{grid-template-columns:1fr}.vg-sidebar{position:static;grid-template-columns:1fr 1fr 1fr;align-items:start}.vg-sidebar-help{display:none}.vg-vocations{grid-template-columns:repeat(5,1fr)}.vg-vocations button:last-child:nth-child(odd){grid-column:auto}.vg-content{grid-template-columns:1fr}.vg-rtc-card{grid-column:auto}.vg-rtc-shell{grid-template-columns:1fr}.vg-wheel-wrap{grid-template-columns:1fr}.vg-wheel-summary{grid-template-columns:repeat(4,1fr)}.vg-wheel-summary>strong{grid-column:1/-1}.vg-wheel-editor-layout{grid-template-columns:1fr}.vg-wheel-editor-stage{max-width:560px;margin:auto}}
@media(max-width:700px){.vg-topbar{align-items:start;flex-direction:column}.vg-top-actions{width:100%}.vg-top-actions button{flex:1}.vg-sidebar{grid-template-columns:1fr}.vg-vocations{grid-template-columns:repeat(5,1fr)}.vg-vocations button{min-height:65px}.vg-vocations button img{width:34px;height:34px}.vg-vocations button strong{font-size:.55rem}.vg-eq-grid{grid-template-columns:repeat(3,66px)}.vg-eq-slot{width:66px;height:66px}.vg-rtc-box{font-size:9px;overflow-x:auto}.vg-rtc-shooter-grid{min-width:520px}.vg-heal-grid{min-width:300px}.vg-editor-slots{grid-template-columns:1fr 1fr}.vg-picker-results,.vg-rtc-picker-list{grid-template-columns:1fr}.vg-weapon-edit-row{grid-template-columns:1fr 1fr}.vg-weapon-edit-row [data-weapon-item]{grid-column:1/-1}.vg-wheel-editor-layout{display:block}.vg-wheel-order-row{grid-template-columns:22px 28px 1fr 58px 35px 26px 26px 26px}.vg-modal-backdrop{padding:8px}.vg-modal{padding:12px}.vg-wheel-summary{display:none}}
@media(prefers-reduced-motion:reduce){.vg-loading span{animation:none}.vg-vocations button img,.vg-item-tip,.vg-toast{transition:none}}
/* Hub de Guias: reaproveita a linguagem visual compacta do hub de Ferramentas. */
.vg-guide-hub{max-width:1180px;margin:18px auto 50px;padding:0 20px}.vg-guide-hub[hidden]{display:none}.vg-guide-hub-box{padding:22px;border:1px solid var(--border,#232c52);border-radius:16px;background:linear-gradient(160deg,#10172b,#080d1b);text-align:center}.vg-guide-hub-icon{width:44px;height:44px;margin:0 auto 9px;display:grid;place-items:center;border:1px solid rgba(240,180,41,.3);border-radius:11px;background:rgba(240,180,41,.07);color:#f0b429}.vg-guide-hub-icon svg{width:25px;height:25px}.vg-guide-hub h2{margin:0;font:900 1.35rem 'League Spartan','Sora',sans-serif;color:#f0f3f9}.vg-guide-hub-box>p{max-width:680px;margin:5px auto 0;color:#8995ae;font-size:.78rem}.vg-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px;text-align:left}.vg-guide-entry{min-height:160px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:18px;border:1px solid rgba(118,132,174,.24);border-radius:15px;background:linear-gradient(160deg,rgba(17,24,48,.96),rgba(8,13,29,.98));text-decoration:none;transition:.18s}.vg-guide-entry:hover{transform:translateY(-2px);border-color:rgba(240,180,41,.58);box-shadow:0 14px 34px rgba(0,0,0,.25)}.vg-guide-entry-icon{width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(240,180,41,.28);border-radius:11px;background:rgba(240,180,41,.07);color:#f4c64c}.vg-guide-entry-icon svg{width:25px;height:25px}.vg-guide-entry strong{display:block;color:#f2f4fb;font:800 .93rem 'Sora',sans-serif}.vg-guide-entry small{display:block;margin-top:6px;color:#8f9ab6;font-size:.72rem;line-height:1.45}.vg-guide-entry .vg-guide-arrow{margin-top:auto;color:#f0b429;font-size:.7rem;font-weight:800}@media(max-width:680px){.vg-guide-grid{grid-template-columns:1fr}.vg-guide-hub{padding:0 12px}.vg-guide-hub-box{padding:17px 13px}}

/* Guia de VocaÃ§Ãµes â€” detalhes fiÃ©is dos editores nativos. */
.vg-rtc-icon-slot{overflow:visible}
.vg-rtc-badge{position:absolute;z-index:3;display:grid;place-items:center;min-width:11px;height:11px;padding:0 2px;border:1px solid #181818;border-radius:2px;background:#c9c9c9;color:#181818;font:bold 8px Arial;text-shadow:none;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,.6)}
.vg-rtc-badge.cast{right:-2px;top:-2px}.vg-rtc-badge.combo{right:-2px;bottom:-2px;background:#353535;color:#eee;border-color:#151515}.vg-rtc-badge[data-action]{cursor:pointer}
.vg-rtc-quiver-slots{display:flex;align-items:center;gap:2px;flex-wrap:wrap;max-width:105px}.vg-rtc-quiver-slots>span{width:22px;height:22px;background:url('/assets/vocation-guide/rtc/actionbarslot.png') center/22px 22px no-repeat;opacity:.75}.vg-rtc-quiver-slots .vg-rtc-check{flex-basis:100%;margin-top:1px}
.vg-rtc-info,.vg-potion-kind{display:inline-grid;place-items:center;width:13px;height:13px;border:1px solid #232323;border-radius:50%;background:#989898;color:#252525;text-shadow:none;font:bold 8px Arial;line-height:1;flex:0 0 13px}
.vg-rtc-setkey{height:18px;margin-left:2px;padding:0 5px;border:1px solid #666;background:linear-gradient(#606060,#3f3f3f);color:#ddd;font:8px Arial;box-shadow:inset 0 0 0 1px #303030;cursor:pointer}
.vg-potion-kind{border:1px solid #222;background:#a43333;color:#f1b2b2;cursor:default}.vg-potion-kind.mana{background:#276c87;color:#b9ebff}.vg-potion-kind[data-potion-kind]{cursor:pointer}
.vg-wheel-node.is-locked{opacity:.28;filter:grayscale(.85)}.vg-wheel-node.is-available:not(.is-active){opacity:.82;box-shadow:0 0 0 1px rgba(255,255,255,.08)}.vg-wheel-node.is-available:not(.is-active):hover{opacity:1;filter:drop-shadow(0 0 7px var(--vg-accent))}

/* Admin Wheel: marco explÃ­cito para a progressÃ£o, separado do level de visualizaÃ§Ã£o. */
.vg-wheel-milestone-field{display:grid;grid-template-columns:max-content minmax(100px,140px) 1fr;align-items:center;gap:10px 14px;margin:0 0 16px;padding:12px 14px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(0,0,0,.16)}
.vg-wheel-milestone-field label{font-weight:800;color:#f0f2f8}
.vg-wheel-milestone-field input{width:100%;padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:#0c101a;color:#fff;font:700 .88rem inherit;outline:none}
.vg-wheel-milestone-field input:focus{border-color:var(--vg-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--vg-accent) 22%,transparent)}
.vg-wheel-milestone-field small{color:#9ba4b7;font-size:.72rem;line-height:1.4}
@media(max-width:720px){.vg-wheel-milestone-field{grid-template-columns:1fr}.vg-wheel-milestone-field input{max-width:150px}}

.vg-level-row{display:grid;grid-template-columns:1fr auto;gap:7px;align-items:center}
.vg-level-steps{display:flex;gap:4px}
.vg-level-steps button{min-width:38px;padding:0 7px;height:34px;font:800 .62rem 'Sora',sans-serif}
.vg-level-steps button:hover{background:color-mix(in srgb,var(--vg-accent) 22%,#0a1020)}
.vg-level-steps button:active{transform:translateY(1px)}
@media(max-width:420px){.vg-level-row{grid-template-columns:1fr}.vg-level-steps{justify-content:stretch}.vg-level-steps button{flex:1}}

.vg-wheel-side{display:grid;gap:9px;align-self:start}
.dim{color:#5c6883;font-size:.6rem}
.vg-perks-summary{display:grid;gap:8px;padding:10px;border:1px solid #252e43;border-radius:9px;background:#070c15}
.vg-perks-title{font-size:.68rem;color:#d8deeb}
.vg-perks-section{display:grid;gap:3px;padding-top:7px;border-top:1px solid #1c2338}
.vg-perks-section:first-of-type{padding-top:0;border-top:0}
.vg-perks-section>b{font-size:.58rem;letter-spacing:.03em;text-transform:uppercase;color:var(--vg-accent)}
.vg-perks-row{display:flex;justify-content:space-between;gap:6px;color:#9aa5bd;font-size:.6rem;line-height:1.4}
.vg-perks-row span:last-child{color:#dce2ed;font-weight:700;white-space:nowrap}
.vg-perks-vessel{color:#dce2ed;font-size:.62rem}
.vg-perks-revelation-row{cursor:help}
.vg-perks-revelation-row.is-locked span:last-child{color:#5c6883;font-weight:400}
.vg-perks-vessel-row{cursor:help}

.vg-vessels-editor{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:10px;margin-top:8px}
.vg-vessel-editor-block{display:grid;gap:6px;padding:10px;border:1px solid #27324c;border-radius:10px;background:#080e1b}
.vg-vessel-editor-block>b{font-size:.72rem;color:#f0f2f8}
.vg-vessel-editor-block>small{color:#8995ad;font-size:.62rem;margin-top:-4px}
.vg-vessel-editor-block label{display:grid;gap:3px;font-size:.62rem;color:#9aa5bd}
.vg-vessel-editor-block select{min-width:0;border:1px solid #303b57;background:#090f1d;color:#d8dfec;border-radius:8px;padding:6px;font-size:.68rem}
.vg-vessel-editor-block select:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:640px){.vg-vessels-editor{grid-template-columns:1fr}}
@media(max-width:980px){.vg-wheel-side{grid-template-columns:1fr}}

.vg-perks-edit-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.vg-perks-edit-grid label{display:grid;gap:4px;font-size:.68rem;color:#9aa5bd}
.vg-perks-edit-grid input{border:1px solid #303b57;background:#090f1d;color:#d8dfec;border-radius:8px;padding:6px}
.vg-perks-edit-row{display:grid;grid-template-columns:minmax(160px,1fr) 130px 32px;gap:6px;margin-top:6px}
.vg-perks-edit-row select,.vg-perks-edit-row input,.vg-perks-edit-row>button{min-width:0;border:1px solid #303b57;background:#090f1d;color:#d8dfec;border-radius:8px;padding:6px}
[data-vessel-tier]{width:100%;border:1px solid #303b57;background:#090f1d;color:#d8dfec;border-radius:8px;padding:7px;margin-top:6px}
@media(max-width:560px){.vg-perks-edit-row{grid-template-columns:1fr}}

/* Defesa contra CSS global do site vazando pro botao/imagem do no da wheel
   (ex: hover:scale genérico de botoes) — sem isso o transform:scale()
   substitui nosso translate(-50%,-50%) de posicionamento e o no "voa" pra
   fora do lugar. */
.vg-wheel-node,.vg-wheel-node:hover,.vg-wheel-node:focus,.vg-wheel-node:active{transform:translate(-50%,-50%) !important}
.vg-wheel-node img,.vg-wheel-node:hover img,.vg-wheel-node img:hover{transform:none !important;max-width:100%;max-height:100%}
.vg-wheel-node:hover{z-index:5}

/* Roda (Teste) -- implementação isolada, independente da Roda "oficial"
   acima (ver comentário em vocation-guide.js). Classes prefixadas wheel2/
   vg-wheel2 de propósito, pra não colidir/misturar com nada da outra. */
.vg-wheel2-note{font-size:.68rem;color:#8995ad;margin:8px 0;line-height:1.4}
.vg-wheel2-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.vg-wheel2-vocs{display:flex;gap:4px;flex-wrap:wrap}
.vg-wheel2-vocs button{border:1px solid #34405d;background:#121b2f;color:#cbd4e6;border-radius:7px;padding:5px 9px;font-size:.65rem;cursor:pointer}
.vg-wheel2-vocs button.active{background:var(--vg-accent);color:#0b0f18;border-color:var(--vg-accent)}
.vg-wheel2-level{display:flex;align-items:center;gap:5px;font-size:.65rem;color:#9aa5bd}
.vg-wheel2-level input{width:70px;border:1px solid #34405d;background:#0e1628;color:#fff;border-radius:6px;padding:4px}
.vg-wheel2-controls>button[data-wheel2-reset]{border:1px solid #34405d;background:#121b2f;color:#cbd4e6;border-radius:7px;padding:5px 9px;font-size:.65rem;cursor:pointer}
.vg-wheel2-points{font-size:.65rem;color:#8995ad;margin-left:auto}
.vg-wheel2-wrap{display:flex;justify-content:center}
.vg-wheel2-stage{position:relative;width:100%;max-width:600px;aspect-ratio:1/1}
.vg-wheel2-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transition:transform .25s}
.vg-wheel2-svg{position:absolute;inset:0;width:100%;height:100%}
.wheel2-slice{cursor:pointer}
.wheel2-slice path{mix-blend-mode:screen;stroke:transparent;stroke-width:0}
.wheel2-slice .wheel2-outer{opacity:.35}
.wheel2-slice .wheel2-inner{opacity:.85}
.wheel2-slice:hover .wheel2-hover-path{fill:rgba(255,255,255,.2)}
.wheel2-slice.wheel2-selected .wheel2-hover-path{stroke:#fff;stroke-width:6}
.wheel2-slice.wheel2-locked{cursor:not-allowed}

.vg-milestone-manager{display:grid;gap:8px}
.vg-milestone-manager>b{font-size:.68rem;color:#d8deeb}
.vg-milestone-list{display:grid;gap:6px}
.vg-milestone-row{display:grid;grid-template-columns:110px 1fr auto auto;gap:8px;align-items:center;padding:7px 9px;border:1px solid #252e43;border-radius:8px;background:#070c15}
.vg-milestone-range{font-weight:800;color:var(--vg-accent);font-size:.66rem}
.vg-milestone-summary{color:#9aa5bd;font-size:.62rem}
.vg-milestone-row button{border:1px solid #34415e;background:#121b2f;color:#dbe2ee;border-radius:7px;padding:5px 9px;font-size:.6rem;cursor:pointer}
.vg-milestone-row button.danger{border-color:#5a2b34;background:#2a1218;color:#f2b8bf}
.vg-milestone-add{border:1px dashed #34415e;background:transparent;color:#9aa5bd;border-radius:8px;padding:8px;cursor:pointer;font-size:.64rem}
.vg-milestone-add:hover{border-color:var(--vg-accent);color:var(--vg-accent)}
@media(max-width:640px){.vg-milestone-row{grid-template-columns:1fr;gap:4px}}

/* Toolbar horizontal: Vocacao + Level + Build numa unica linha no topo,
   substituindo a sidebar vertical antiga — da mais largura pro conteudo
   (principalmente a Wheel) abaixo. */
.vg-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:stretch;margin-bottom:16px}
.vg-toolbar .vg-filter-box,.vg-toolbar .vg-builds{margin:0}
.vg-filter-voc{flex:1 1 360px;min-width:280px}
.vg-filter-voc .vg-vocations{grid-template-columns:repeat(5,minmax(0,1fr))}
.vg-filter-voc .vg-vocations button{min-height:86px;aspect-ratio:1/1;padding:6px 4px}
.vg-filter-voc .vg-vocations button img{width:46px;height:46px}
.vg-filter-voc .vg-vocations button:last-child:nth-child(odd){grid-column:auto}
.vg-toolbar .vg-level-box{flex:0 0 260px}
.vg-toolbar .vg-builds{flex:1 1 320px;min-width:260px}
.vg-builds-row{display:flex;flex-wrap:wrap;gap:7px}
.vg-builds-row button{flex:1 1 130px}
@media(max-width:980px){.vg-toolbar{flex-direction:column}.vg-filter-voc,.vg-toolbar .vg-level-box,.vg-toolbar .vg-builds{flex:1 1 auto}}

/* Abas Equipamentos / Roda / RTC — mostram um painel por vez, ocupando a
   largura toda do card ativo, em vez das 3 colunas simultaneas de antes. */
.vg-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.vg-tabs button{border:1px solid var(--vg-line);background:#0d1322;color:#aab4ca;border-radius:10px;padding:10px 16px;font:800 .78rem 'Sora',sans-serif;cursor:pointer;transition:.16s}
.vg-tabs button:hover{border-color:color-mix(in srgb,var(--vg-accent) 45%,#334);color:#fff}
.vg-tabs button.active{background:color-mix(in srgb,var(--vg-accent) 16%,#0d1322);border-color:var(--vg-accent);color:#fff}

/* Boneco de equipamento + painel de perks da arma lado a lado */
.vg-eq-layout{display:flex;flex-wrap:wrap;gap:22px;justify-content:center}
.vg-eq-doll{display:grid;gap:14px;justify-items:center}
.vg-eq-extras{display:flex;gap:9px}
.vg-eq-slot-extra{width:60px !important;height:60px !important}
.vg-eq-perks-panel{flex:1 1 280px;min-width:240px;max-width:420px;background:linear-gradient(160deg,#101728,#090f1e);border:1px solid var(--vg-line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}
.vg-eq-perks-panel>b{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:#aab4ca}
.vg-eq-weapon-picker{display:flex;gap:6px;flex-wrap:wrap}
.vg-eq-weapon-picker button{border:1px solid #29314a;background:#090e1a;border-radius:8px;padding:4px;cursor:pointer}
.vg-eq-weapon-picker button.active{border-color:var(--vg-accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--vg-accent) 35%,transparent)}
.vg-eq-perks-image{flex:1;min-height:220px;display:grid;place-items:center;border:1px dashed #29334d;border-radius:10px;background:#070b14;padding:8px}
.vg-eq-perks-image img{max-width:100%;max-height:340px;border-radius:6px}
@media(max-width:720px){.vg-eq-layout{flex-direction:column;align-items:center}.vg-eq-perks-panel{max-width:100%;width:100%}}

