body.np-body { background:#d9b96f url('../img/invocacoes-2026/cenario.png') center top/cover fixed no-repeat !important; }
.ip-page { position:relative; width:calc(100% - 40px); max-width:1320px; margin:24px auto 36px; padding:42px 65px 48px; color:#273844; font-family:Georgia,serif; background:url('../img/invocacoes-2026/pergaminho.png') center/100% 100% no-repeat; }
.ip-header { display:flex; align-items:center; gap:20px; padding:13px 20px; background:linear-gradient(110deg,#183a50,#0a2034); border:3px double #b99750; color:#edd39a; }
.ip-header h1 { margin:0; font:bold 30px Georgia,serif; }.ip-header p { margin:0; font:italic 13px Georgia,serif; }
.ip-main { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(330px,1fr); gap:18px; align-items:stretch; padding:16px 0; }
.ip-art { margin:0; display:flex; align-items:center; justify-content:center; min-width:0; position:relative; }
.ip-art img { display:block; width:100%; height:540px; object-fit:contain; filter:drop-shadow(0 8px 8px #60422130); }
.ip-details { padding:18px; border:3px double #ac873e; background:#fff0cdc9; min-width:0; }
.ip-detail-head { display:flex; gap:12px; align-items:center; }.ip-detail-head h2 { font:bold 26px Georgia,serif; margin:0 0 5px; }.ip-detail-head small { font-size:12px; color:#675537; }
.ip-rank { display:grid; place-items:center; flex-shrink:0; width:48px; height:48px; border-radius:50%; background:#14364b; color:#ebcc80; border:3px double #bb9240; font-weight:bold; }
.ip-description { font:13px/1.6 Georgia,serif; margin:14px 0; }.ip-level { display:flex; justify-content:space-between; gap:8px; font-size:13px; }.ip-level span { font-size:11px; }
.ip-details progress { width:100%; height:12px; appearance:none; display:block; margin:8px 0 16px; border:1px solid #8b723d; border-radius:8px; overflow:hidden; background:#d3c4a0; }.ip-details progress::-webkit-progress-bar { background:#d3c4a0; }.ip-details progress::-webkit-progress-value { background:linear-gradient(#57b7e5,#1e567d); }.ip-details progress::-moz-progress-bar { background:#267da7; }
.ip-details h3,.ip-roster-title { margin:0; padding:7px 10px; font:bold 13px Georgia,serif; color:#efdaad; background:#14364b; border-bottom:2px solid #b89446; }
.ip-bonuses { margin:7px 0; }.ip-bonuses div { display:flex; justify-content:space-between; padding:5px 8px; border-bottom:1px solid #b999522e; font-size:13px; }.ip-bonuses dd { margin:0; color:#235438; font-weight:bold; }
.ip-note { font:italic 11px/1.5 Georgia,serif; color:#65583e; margin:9px 0; }.ip-training p { font:12px/1.4 Georgia,serif; margin:8px 0; }
.ip-actions { display:flex; gap:10px; margin-top:12px; }.ip-actions button { flex:1; min-width:0; padding:11px 8px; border:3px double #b5903b; color:#f9e3ac; font:bold 15px Georgia,serif; background:linear-gradient(#923a27,#662317); cursor:pointer; }.ip-actions .ip-train { background:linear-gradient(#235777,#102f46); }.ip-actions button:disabled { opacity:.6; cursor:not-allowed; }
.ip-message { font:bold 13px/1.5 Georgia,serif; color:#573619; }.ip-message:not(:empty) { padding:10px; background:#f6e6bb; border:1px solid #b59147; margin-top:10px; }
.ip-roster-title { display:flex; justify-content:space-between; }.ip-roster-title span { font:italic 11px Georgia,serif; }
.ip-roster { position:relative; display:flex; gap:8px; overflow-x:auto; padding:12px 3px; scrollbar-color:#b2924d #decda7; }
.ip-summon { flex:0 0 112px; min-width:0; padding:5px; background:#172c36; border:3px double #b39043; color:#f4dfb6; cursor:pointer; border-radius:2px; }.ip-summon.selected { border-color:#f3bd3e; box-shadow:0 0 0 2px #8e641e; background:#2e493e; }.ip-summon img { width:96px; height:86px; object-fit:contain; display:block; background:#ddcda5; }.ip-summon strong { font:700 12px Georgia,serif; display:block; margin:5px 0; }.ip-summon small { font:10px Georgia,serif; display:block; }
.ip-page button:focus-visible { outline:3px solid #398ac0; outline-offset:2px; }
.ip-quantity { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin:10px 0; font:12px Georgia,serif; }
.ip-quantity input { width:65px; padding:7px; color:#213b4a; background:#fff8e9; border:1px solid #9f803f; border-radius:3px; }
.ip-quantity button { padding:7px 9px; background:#17394f; color:#f5dfae; border:1px solid #a98b46; border-radius:3px; cursor:pointer; }.ip-quantity :disabled { opacity:.6; cursor:not-allowed; }
@media(max-width:950px) { .ip-page { padding:32px 38px; }.ip-main { grid-template-columns:minmax(0,1fr) minmax(300px,1fr); }.ip-art img { height:440px; }.ip-header h1 { font-size:26px; } }
@media(max-width:700px) { .ip-page { width:calc(100% - 12px); padding:28px 24px; }.ip-main { grid-template-columns:1fr; gap:8px; }.ip-art img { height:310px; }.ip-header { display:block; padding:12px; }.ip-header p { margin-top:6px; }.ip-details { padding:12px; }.ip-roster-title span { display:none; }.ip-detail-head h2 { font-size:23px; } }
