body{color:var(--main-text-color-light);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--main-interactive-color: #4ecdc4;--main-interactive-color-dark: #20b2aa;--main-text-color-light: #1a202c;--second-text-color-light: #4a5568;--main-text-color-dark: #ffffff;--main-background-color-light: #e2e8f0;--second-background-color-light: #f7fafc;--main-background-color-light-hover: rgba(0, 0, 0, .05);--main-background-color-dark: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 100%);--main-background-color-dark-hover: rgba(255, 255, 255, .08);--main-background-header-color: #1a1a2e;--second-background-color: rgba(255, 255, 255, .05);--alert-color: #990000;--detail-color-dark: #ff6b35;--detail-color-light: #e74c3c;--hover-color-light: rgba(32, 178, 170, .2);--hover-color-dark: rgba(78, 205, 196, .2);--glass-background-dark: rgba(255, 255, 255, .05);--glass-background-light: rgba(0, 0, 0, .03);--glass-border-dark: rgba(255, 255, 255, .1);--glass-border-light: rgba(0, 0, 0, .1);--sideBar-background-color-light: rgba(226, 232, 240, .95);--sideBar-background-color-dark: rgba(26, 26, 46, .9);--monster-accent-color: #ff6b35;--monster-accent-color-light: #e74c3c;--monster-secondary-color: #4ecdc4;--monster-secondary-color-light: #20b2aa;--monster-gold-color: #ffd700;--monster-gold-color-light: #f39c12}.app-container{overflow:hidden;display:grid;height:100svh;width:100%;grid-template-rows:10% 82% 8%;grid-template-areas:"Header" "MainContent" "Footer"}.main-container{grid-area:MainContent;overflow:scroll;scrollbar-width:none}h3{color:var(--alert-color)}@media (min-width:1010px){.app-container{width:100vw;height:100vh;grid-template-columns:20% 80%;grid-template-areas:"Header Header" "sideBar MainContent" "Footer Footer"}}.span-element-icon{display:inline-flex;align-items:center;gap:8px;margin:5px;padding:8px 12px;background:#ffffff0d;border-radius:20px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:13px;font-weight:500}.span-element-icon:hover{background:#ffffff1a}.span-element-icon img{width:24px;height:24px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.span-element-icon:hover img{transform:scale(1.1)}body.lightTheme .span-element-icon{background:#0000000d;border:1px solid rgba(0,0,0,.15);color:#333}body.lightTheme .span-element-icon:hover{background:#0000001a}header{overflow:hidden;grid-area:Header;display:flex;justify-content:space-between;align-items:center;background-color:var(--main-background-header-color);position:static;padding:.5rem 0}.header-title{color:var(--main-interactive-color);margin:0;text-align:center;font-size:clamp(1.2rem,3vw,1.8rem);font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3);background:linear-gradient(135deg,#4fd1c7,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.panel-btn{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:8px;position:relative;z-index:101}.panel-btn:hover{background:#4fd1c71a}.panel-btn:focus{outline:2px solid #4fd1c7;outline-offset:2px}.hamburger-box{width:24px;height:24px;display:inline-block;position:relative}.hamburger-inner{display:block;top:50%;margin-top:-2px;width:24px;height:3px;background-color:var(--main-interactive-color);border-radius:4px;position:absolute}.hamburger-inner:before,.hamburger-inner:after{content:"";width:24px;height:3px;background-color:var(--main-interactive-color);border-radius:4px;position:absolute}.hamburger-inner:before{top:-8px}.hamburger-inner:after{bottom:-8px}.hamburger--collapse.is-active .hamburger-inner{transform:rotate(45deg)}.hamburger--collapse.is-active .hamburger-inner:before{top:0;transform:rotate(-90deg);opacity:0}.hamburger--collapse.is-active .hamburger-inner:after{bottom:0;transform:rotate(-90deg)}.themeBtn{color:var(--main-interactive-color);border:2px solid transparent;border-radius:50%;padding:.75rem;font-size:1.2rem;background:#4fd1c71a;cursor:pointer;position:relative;overflow:hidden}.themeBtn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent,rgba(79,209,199,.2));opacity:0;z-index:-1}.themeBtn:hover{border-color:#4fd1c7;background:#4fd1c733}.themeBtn:hover:before{opacity:1}.themeBtn:focus{outline:2px solid #4fd1c7;outline-offset:2px}@media (min-width: 1010px){.panel-btn{display:none}header{padding:1rem 1rem 1rem 2rem}}@media (max-width: 1010px){.panel-btn{z-index:100}.header-title{font-size:clamp(1rem,4vw,1.4rem)}.themeBtn{padding:.5rem;font-size:1rem}}@media (max-width: 768px){header{padding:.5rem}.header-title{font-size:clamp(.9rem,5vw,1.2rem);margin:0 .5rem}.themeBtn{padding:.4rem;font-size:.9rem}}@media (max-width: 480px){.header-title{font-size:1rem;margin:0 .25rem}}body.darkTheme .header-title{background:linear-gradient(135deg,#4fd1c7,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}body.lightTheme .header-title{background:linear-gradient(135deg,#2c8a7a,#e6c200);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}.search-container{margin-right:1rem;top:50%;left:50%;transform:translate(0);transition:all 1s;width:50px;height:50px;background:#fff;box-sizing:border-box;border-radius:25px;border:4px solid white;padding:5px;margin-left:auto}.search-input{position:absolute;top:0;left:0;width:100%;height:42.5px;line-height:30px;outline:0;border:0;display:none;font-size:1em;border-radius:20px;padding:0 20px}.fa{box-sizing:border-box;padding:10px;width:42.5px;height:42.5px;position:absolute;top:0;right:0;border-radius:50%;color:#8c52ff;text-align:center;font-size:1.2em;transition:all 1s}.search-container:hover{width:300px;cursor:pointer}.search-container.search-notEmpty input{display:block}.search-container.search-notEmpty:hover .fa{background:#8c52ff;color:#fff}.search-container:hover input{display:block}.search-notEmpty{width:300px;cursor:pointer}.hide{display:none}body.lightTheme .main-container{background-color:var(--main-background-color-light);color:var(--main-text-color-light)}body.lightTheme .side-menu{background:var(--sideBar-background-color-light);color:var(--main-text-color-light)}body.lightTheme .side-menu.show{background:var(--sideBar-background-color-light)}body.lightTheme .monster-type-select{color:var(--main-interactive-color)}body.lightTheme .item-type-selected{background-color:var(--hover-color-light)}body.lightTheme .monsters-figure:hover{background-color:var(--second-background-color)}body.lightTheme .monster-description.show-description{background-color:#ddd}body.lightTheme .monster-drops-collapse:hover{background-color:var(--second-background-color)}body.lightTheme .fa-github{color:#2b3137}body.lightTheme .fa-envelope{color:#333}body.lightTheme .monsters-info-tag.key-quest{color:var(--detail-color-light)}body.darkTheme .main-container{color:var(--main-text-color-dark);background-image:var(--main-background-color-dark)}body.darkTheme .side-menu{background:var(--sideBar-background-color-dark);color:var(--main-text-color-dark)}body.darkTheme .side-menu.show{background:var(--sideBar-background-color-dark)}body.darkTheme .monster-type-select{color:var(--main-interactive-color)}body.darkTheme .item-type-selected{background-color:var(--hover-color-dark)}body.darkTheme .monsters-figure:hover{background-color:var(--main-background-color-dark-hover)}body.darkTheme .monster-drops-collapse:hover{background-color:var(--second-background-color)}body.darkTheme .fa-github,body.darkTheme .fa-envelope{color:var(--main-background-color-light)}body.darkTheme .monsters-info-tag.key-quest{color:var(--detail-color-dark)}footer{display:flex;flex-direction:column;width:100%;grid-area:Footer;background-color:var(--main-background-header-color);color:var(--main-interactive-color);border-top:1px solid rgba(79,209,199,.2);position:relative;z-index:1}.footer-content{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;height:100%}.footer-main{display:flex;align-items:center;gap:.5rem;font-size:.85rem;flex:1;justify-content:center}.footer-made-with{font-weight:500}.footer-separator{color:var(--main-interactive-color);opacity:.6}.footer-year{font-size:.75rem;opacity:.7}.footer-toggle{background:transparent;border:none;color:var(--main-interactive-color);cursor:pointer;padding:.3rem;border-radius:50%;opacity:.7}.footer-toggle:hover{opacity:1;background:#4fd1c71a}.footer-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:999;animation:fadeIn .3s ease-out}.footer-modal{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:90%;max-width:500px;background:var(--main-background-header-color);border:1px solid rgba(79,209,199,.3);border-bottom:none;border-radius:12px 12px 0 0;z-index:1000;animation:slideUp .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(100%)}to{opacity:1;transform:translate(-50%) translateY(0)}}.footer-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid rgba(79,209,199,.2)}.footer-modal-header h3{color:var(--main-interactive-color);margin:0;font-size:1.1rem}.footer-modal-close{background:transparent;border:none;color:var(--main-interactive-color);cursor:pointer;padding:.3rem;border-radius:50%;opacity:.7}.footer-modal-close:hover{opacity:1;background:#4fd1c71a}.footer-modal-content{padding:1.5rem}.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:1.5rem}.footer-links a{display:flex;align-items:center;gap:.5rem;color:var(--main-interactive-color);text-decoration:none;padding:.8rem;border-radius:8px;border:1px solid rgba(79,209,199,.2);transition:all .3s ease;background:#4fd1c70d}.footer-links a:hover{background:#4fd1c71a;border-color:#4fd1c766;transform:translateY(-2px)}.footer-links i{font-size:1.2rem;width:20px;text-align:center}.footer-info{text-align:center;color:var(--main-interactive-color);opacity:.8}.footer-info p{margin:.3rem 0;font-size:.9rem}.footer-info p:first-child{font-size:1rem;opacity:1}@media (max-width: 768px){.footer-content{padding:.4rem .8rem}.footer-main{font-size:.75rem;gap:.3rem}.footer-year{font-size:.65rem}.footer-modal{width:95%}.footer-modal-content{padding:1rem}.footer-links{grid-template-columns:1fr;gap:.8rem}}@media (max-width: 480px){.footer-main{flex-direction:column;gap:.2rem;font-size:.7rem}.footer-separator{display:none}.footer-modal-header{padding:.8rem 1rem}.footer-modal-header h3{font-size:1rem}}.side-menu{grid-area:sideBar;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:4px 0 20px #0003}.side-list{display:flex;flex-direction:column;padding:0;list-style:none;margin:0}.side-list-item{display:flex;align-items:center;margin:0;font-weight:700;padding:1rem 2rem;cursor:pointer;transition:all .3s ease;border-left:3px solid transparent;font-size:1.1rem;text-decoration:none;color:inherit}.side-list-item:hover{background:#4fd1c71a;border-left-color:#4fd1c7;transform:translate(5px)}.side-list-item.active{background:#4fd1c733;border-left-color:#4fd1c7;color:#4fd1c6d8}.side-list img{width:20px;height:20px;object-fit:contain;margin-right:.5rem}.sidebar-overlay{display:none}@media (max-width: 1010px){.sidebar-overlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;z-index:98}.sidebar-overlay.show{display:block}.side-menu{transition:transform .3s ease-in-out;transform:translate(-100%);position:fixed;top:0;left:0;height:100vh;width:40%;background:var(--sideBar-background-color-light);z-index:99;border:none;padding:4rem 0}.side-menu.show{transform:translate(0);transition:transform .3s ease-in-out}}.custom-loader{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--main-background-color-dark, linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%));color:var(--main-text-color-dark, #F8F8FF);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.loader-content{text-align:center}.spinner{display:inline-block;position:relative;width:64px;height:64px;margin-bottom:24px}.spinner div{position:absolute;top:27px;width:11px;height:11px;border-radius:50%;background:var(--main-interactive-color, #2a9d8f);animation:bounce 1.2s infinite ease-in-out;box-shadow:0 0 12px #2a9d8f66}.spinner div:nth-child(1){left:6px;animation-delay:-.24s}.spinner div:nth-child(2){left:26px;animation-delay:-.12s;background:var(--main-interactive-color-dark, #1194cc);box-shadow:0 0 12px #1194cc66}.spinner div:nth-child(3){left:46px;animation-delay:0s;background:var(--detail-color-dark, #e76f51);box-shadow:0 0 12px #e76f5166}.custom-loader p{font-size:1.1rem;font-weight:500;margin:0;opacity:.9;letter-spacing:.5px;color:var(--main-text-color-dark, #F8F8FF)}@keyframes bounce{0%,80%,to{transform:scale(0);opacity:.5}40%{transform:scale(1);opacity:1}}body.lightTheme .custom-loader{background:var(--main-background-color-light, #e8eaeb);color:var(--main-text-color-light, #2d3436)}body.lightTheme .custom-loader p{color:var(--main-text-color-light, #2d3436)}
