@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap";:root{--primary-color: #1e6de7;--accent-color: #e94d3a;--dark-bg: #121212;--card-bg: #181818;--text-light: #fff;--text-secondary: #ccc}body{background:var(--bg-darker);color:var(--text-primary);font-family:Poppins,Arial,sans-serif;margin:0;min-height:100vh;line-height:1.6}h1,h2,h3{font-family:Druk Wide,Arial Black,Arial,sans-serif;letter-spacing:1.5px;font-weight:700;margin-top:0}section{margin-bottom:3rem;padding:1rem}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;margin:2rem auto;max-width:1050px}.tab-btn{background:var(--overlay-dark);color:var(--text-primary);border:none;font-family:Druk Wide,Arial Black,Arial,sans-serif;font-size:1rem;padding:.8rem 1.5rem;cursor:pointer;transition:all .3s ease;border-radius:8px;position:relative;min-width:140px;font-weight:700;text-transform:uppercase;box-shadow:0 2px 10px var(--shadow-dark)}.tab-btn.active{color:var(--text-primary);background:var(--primary-color);box-shadow:0 4px 15px var(--shadow-primary)}.tab-btn:hover:not(.active){background:var(--bg-select-hover);transform:translateY(-2px)}@media (max-width: 768px){.container{padding:0 .5rem}.tabs{grid-template-columns:repeat(3,1fr);gap:.5rem;padding:0 .5rem;margin-top:1.5rem;margin-bottom:.5rem}.tab-btn{font-size:.9rem;padding:.6rem .8rem;min-width:100px;margin-bottom:.3rem}section{margin-bottom:2rem;padding:.8rem .5rem}}@media (max-width: 480px){.container{padding:0 .3rem}.tabs{grid-template-columns:repeat(2,1fr);gap:.4rem;padding:0 .3rem;margin-top:1rem}.tab-btn{min-width:auto;font-size:.8rem;padding:.5rem .3rem}section{margin-bottom:1.5rem;padding:.5rem .3rem}}.art-description{background:var(--overlay-dark);border-radius:8px;padding:1.5rem;margin:2rem auto;box-shadow:0 2px 10px var(--shadow-dark);max-width:1000px}.art-description h3{font-family:Druk Wide,Arial Black,Arial,sans-serif;color:var(--primary-color);font-size:1.3rem;letter-spacing:1.5px;margin-top:0;margin-bottom:.8rem}.art-description p{line-height:1.6;margin-bottom:0;color:var(--text-primary)}.light-theme .art-description{background:var(--overlay-light)}.hero{padding:5rem 1rem 4rem;background:linear-gradient(to bottom,#1e1e1e80,#181818b3),var(--bg-card);text-align:center;position:relative;overflow:hidden}.light-theme .hero{background:linear-gradient(to bottom,#fffc,#f5f5f5e6),var(--bg-card)}.hero:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url('data:image/svg+xml;utf8,<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><rect width="100" height="100" fill="none"/><rect width="1" height="1" fill="rgba(255,255,255,0.03)" x="0" y="0"/></svg>');opacity:.5}.hero-title{font-family:Druk Wide,Arial,sans-serif;font-size:3.5rem;color:var(--text-primary);margin-bottom:1.5rem;letter-spacing:2px;position:relative;text-transform:uppercase;text-shadow:0 2px 10px var(--shadow-darker)}.hero-title:after{content:"";display:block;width:80px;height:4px;background:var(--primary-color);margin:1rem auto 0;border-radius:2px}.hero-desc{font-family:Poppins,Arial,sans-serif;color:var(--text-secondary);font-size:1.4rem;max-width:700px;margin:0 auto;line-height:1.7;position:relative;font-weight:400}@media (max-width: 768px){.hero{padding:3rem 1rem 2.5rem}.hero-title{font-size:2.5rem;margin-bottom:1rem}.hero-title:after{width:60px;height:3px;margin:.7rem auto 0}.hero-desc{font-size:1.15rem;max-width:90%}}@media (max-width: 480px){.hero-title{font-size:2rem}.hero-desc{font-size:1rem}}.belt-colors{background:linear-gradient(to bottom,#1e1e1e80,#181818b3),var(--bg-card);padding:2rem 1rem;text-align:center;margin:0 auto;max-width:1000px;position:relative;border-radius:16px;box-shadow:0 10px 25px var(--shadow-darker)}.light-theme .belt-colors{background:linear-gradient(to bottom,#fffc,#f5f5f5e6),var(--bg-card);box-shadow:0 10px 25px #0000000d}.belt-colors h2{color:var(--text-primary);font-family:Druk Wide,Arial,sans-serif;margin-bottom:1.5rem;letter-spacing:1px}.belt-row{display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem;padding:0 1rem;margin-bottom:2rem;max-width:800px;margin-left:auto;margin-right:auto}.belt-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1.5rem}.belt-color{width:100%;height:80px;border-radius:10px;border:2px solid var(--border-dark);box-shadow:0 4px 12px var(--shadow-darker);transition:transform .2s,box-shadow .2s,border-color .2s;cursor:pointer}.belt-color:hover{transform:translateY(-5px);box-shadow:0 8px 20px var(--shadow-darkest);border-color:var(--primary-color)}.belt-color.selected{border-color:var(--accent-color);transform:translateY(-5px);box-shadow:0 8px 20px var(--shadow-accent)}.belt-label{display:flex;flex-direction:column;color:var(--text-primary);font-family:Poppins,Arial,sans-serif;font-size:.9rem;text-align:center;text-shadow:0 1px 4px var(--shadow-darkest);font-weight:500}.belt-sublabel{font-size:.75rem;color:var(--accent-color);margin-top:2px;font-weight:500}.light-theme .belt-sublabel{color:var(--primary-color)}.progression-select{background:#1e1e1e99;padding:1.5rem;border-radius:12px;max-width:500px;margin:0 auto 2rem;text-align:left;display:flex;flex-direction:column;gap:1rem;animation:fadeIn .3s ease-in-out;border:1px solid var(--border-white);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.light-theme .progression-select{background:#fffc;border:1px solid rgba(0,0,0,.05);box-shadow:0 8px 20px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.progression-select label{color:var(--text-primary);font-family:Poppins,Arial,sans-serif;font-size:1.1rem;font-weight:500;display:block;margin-bottom:.5rem}.progression-select select{display:block;width:100%;padding:.8rem 1rem;border-radius:8px;border:1px solid var(--border-light);background:var(--bg-select);color:var(--text-primary);font-family:Poppins,Arial,sans-serif;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:inset 0 1px 3px var(--shadow-inset);transition:all .3s ease;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;margin-top:.5rem}.light-theme .progression-select select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")}.progression-select select:hover,.progression-select select:focus{border-color:var(--primary-color);outline:none}.progression-button{padding:.9rem 2rem;background:var(--primary-color);color:var(--text-primary);border:none;border-radius:8px;font-family:Druk Wide,Arial,sans-serif;font-size:1rem;cursor:pointer;transition:all .3s ease;width:100%;text-transform:uppercase;letter-spacing:1px;font-weight:700;box-shadow:0 4px 15px var(--shadow-primary);margin-top:.5rem}.progression-button:hover{background:var(--accent-color);transform:translateY(-2px);box-shadow:0 6px 18px var(--shadow-accent)}.belt-color[style*="var(--belt-red)-var(--belt-white)"]{background:repeating-linear-gradient(0deg,var(--belt-red),var(--belt-red) 8px,var(--belt-white) 8px,var(--belt-white) 16px)!important;position:relative;overflow:hidden}.belt-description{max-width:700px;margin:0 auto 2rem;padding:1.2rem 1.5rem;background:#1e1e1e99;border-radius:12px;border:1px solid var(--border-white);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);animation:fadeIn .4s ease-in-out}.light-theme .belt-description{background:#fffc;border:1px solid rgba(0,0,0,.05);box-shadow:0 4px 15px #0000000d}.belt-description p{color:var(--text-primary);font-family:Poppins,Arial,sans-serif;font-size:1.1rem;line-height:1.6;margin:0;text-align:center;font-style:italic}@media (max-width: 768px){.belt-row{grid-template-columns:repeat(3,1fr)}.belt-colors h2{font-size:1.3rem}.belt-row{gap:1rem;padding:0 .5rem;max-width:600px}.belt-color{width:65px;height:65px}.belt-item{margin-bottom:1.2rem}.belt-label{font-size:.85rem}.belt-sublabel{font-size:.7rem}.progression-select{padding:1.2rem;gap:.8rem;max-width:90%}.progression-select label{font-size:1rem}.progression-select select,.progression-button{padding:.7rem 1rem;font-size:.95rem}.belt-description{max-width:90%;padding:1rem;margin-bottom:1.5rem}.belt-description p{font-size:.95rem;line-height:1.5}}@media (max-width: 480px){.belt-colors{padding:1.5rem .5rem}.belt-colors h2{font-size:1.1rem;margin-bottom:1.2rem}.belt-row{gap:.8rem;margin-bottom:1rem;max-width:300px}.belt-color{width:55px;height:55px}.belt-item{margin-bottom:1rem}.belt-label{font-size:.75rem}.belt-sublabel{font-size:.65rem;margin-top:1px}.progression-select{padding:1rem .8rem;gap:.6rem;max-width:95%;margin-bottom:1.5rem}.progression-select label{font-size:.9rem}.progression-select select,.progression-button{padding:.6rem .8rem;font-size:.9rem}.belt-description{padding:.8rem;margin-bottom:1.2rem}.belt-description p{font-size:.85rem;line-height:1.4}}.recommendations{background:linear-gradient(to bottom,#1e1e1e80,#181818b3),var(--bg-card);padding:2rem 1rem;margin:3rem auto 2rem;text-align:center;border-radius:16px;box-shadow:0 10px 30px var(--shadow-darker);max-width:1000px;transform:translateY(0);transition:transform .3s ease,box-shadow .3s ease;position:relative;overflow:hidden;border:1px solid var(--border-white)}.light-theme .recommendations{background:linear-gradient(to bottom,#fffc,#f5f5f5e6),var(--bg-card);box-shadow:0 10px 30px #0000000d;border:1px solid rgba(0,0,0,.05)}.recommendations:hover{transform:translateY(-5px);box-shadow:0 15px 40px var(--shadow-darkest)}.light-theme .recommendations:hover{box-shadow:0 15px 40px #0000001a}.recommendations h2{color:var(--text-primary);font-family:Druk Wide,Arial,sans-serif;margin-bottom:1.5rem;font-size:1.8rem;text-transform:uppercase;letter-spacing:1px;position:relative}.recommendations h2:after{content:"";display:block;width:60px;height:3px;background:var(--primary-color);margin:.8rem auto 0;border-radius:2px}.recommendations h3{color:var(--text-primary);font-family:Druk Wide,Arial,sans-serif;font-size:1.2rem;margin:1.5rem 0 .8rem;text-transform:uppercase;letter-spacing:.5px;position:relative}.recommendations .rec-meta{font-family:Poppins,Arial,sans-serif;color:var(--primary-color);font-size:1.2rem;margin-bottom:1.5rem;font-weight:600;display:inline-block;padding:.5rem 1.5rem;background:var(--overlay-primary);border-radius:50px}.rec-content{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin:2rem 0;text-align:left;align-items:stretch}.rec-section{background:#1e1e1e80;padding:1rem;border-radius:12px;box-shadow:0 4px 15px var(--shadow-dark);transition:transform .3s ease,box-shadow .3s ease}.light-theme .rec-section{background:#ffffffb3;box-shadow:0 4px 15px #0000000d}.rec-section:hover{transform:translateY(-3px);box-shadow:0 6px 20px var(--shadow-darker)}.light-theme .rec-section:hover{box-shadow:0 6px 20px #0000001a}.expert-advice{grid-column:1 / -1;background:#1e1e1e99;border:3px solid var(--border-white);min-height:100%;display:flex;flex-direction:column;justify-content:flex-start;padding:1rem}.light-theme .expert-advice{background:#fffc;box-shadow:0 4px 15px #e94d3a1a}.recommendations p{color:var(--text-primary);font-family:Poppins,Arial,sans-serif;font-size:1.1rem;line-height:1.7;margin:0}.techniques-list{list-style-type:none;padding:0;margin:.5rem 0}.techniques-list li{color:var(--text-primary);font-family:Poppins,Arial,sans-serif;font-size:1.05rem;padding:.5rem 0 .5rem 1.5rem;position:relative;line-height:1.5}.techniques-list li:before{content:"•";color:var(--primary-color);font-weight:700;font-size:1.2rem;position:absolute;left:0}@media (max-width: 700px){.recommendations{padding:1.2rem .5rem;max-width:95%;margin:2rem auto;border-radius:12px}.recommendations h2{font-size:1.5rem;margin-bottom:1rem}.recommendations h2:after{width:40px;margin:.5rem auto 0}.recommendations h3{font-size:1.1rem;margin:1rem 0 .6rem}.recommendations .rec-meta{font-size:1rem;margin-bottom:1rem;padding:.4rem 1.2rem}.rec-content{grid-template-columns:1fr;margin-top:1.5rem;gap:1rem;align-items:stretch}.rec-section,.expert-advice{min-height:unset;padding:.7rem}.recommendations p{font-size:.95rem}.techniques-list li{font-size:.95rem;padding:.4rem 0 .4rem 1.3rem}}@media (max-width: 480px){.recommendations{padding:.7rem .2rem;max-width:95%;border-radius:10px}.recommendations h2{font-size:1.3rem;margin-bottom:.8rem}.recommendations h2:after{width:35px;height:2px;margin:.4rem auto 0}.recommendations h3{font-size:1rem;margin:.8rem 0 .5rem}.recommendations .rec-meta{font-size:.9rem;padding:.3rem 1rem;margin-bottom:.8rem}.rec-content{margin-top:1.2rem;gap:.8rem}.rec-section,.expert-advice{padding:.5rem;border-radius:8px}.recommendations p{font-size:.9rem;line-height:1.5}.techniques-list li{font-size:.9rem;padding:.3rem 0 .3rem 1.1rem;line-height:1.4}.techniques-list li:before{font-size:1rem}}:root{--primary-color: #1e6de7;--accent-color: #e94d3a;--bg-darkest: #0a0a0a;--bg-darker: #121212;--bg-dark: #171717;--bg-card: #181818;--bg-card-hover: #1e1e1e;--bg-select: #222;--bg-select-hover: rgba(40, 40, 40, .8);--text-primary: #fff;--text-secondary: #eee;--text-muted: #ccc;--border-dark: #222;--border-light: #333;--border-white: rgba(255, 255, 255, .05);--shadow-primary: rgba(30, 109, 231, .3);--shadow-accent: rgba(233, 77, 58, .3);--shadow-dark: rgba(0, 0, 0, .2);--shadow-darker: rgba(0, 0, 0, .3);--shadow-darkest: rgba(0, 0, 0, .4);--shadow-inset: rgba(0, 0, 0, .1);--overlay-dark: rgba(30, 30, 30, .4);--overlay-darker: rgba(30, 30, 30, .5);--overlay-primary: rgba(30, 109, 231, .1);--overlay-accent: rgba(233, 77, 58, .15);--belt-white: #fff;--belt-yellow: #f7b32b;--belt-orange: #ff8c00;--belt-red: #e94d3a;--belt-green: #4caf50;--belt-blue: #1e6de7;--belt-purple: #9c27b0;--belt-brown: #795548;--belt-black: #222}.light-theme{--primary-color: #1e6de7;--accent-color: #e94d3a;--bg-darkest: #ffffff;--bg-darker: #f5f5f5;--bg-dark: #eeeeee;--bg-card: #ffffff;--bg-card-hover: #f8f8f8;--bg-select: #ffffff;--bg-select-hover: rgba(230, 230, 230, .8);--text-primary: #333333;--text-secondary: #555555;--text-muted: #777777;--border-dark: #dddddd;--border-light: #cccccc;--border-white: rgba(0, 0, 0, .05);--shadow-primary: rgba(30, 109, 231, .2);--shadow-accent: rgba(233, 77, 58, .2);--shadow-dark: rgba(0, 0, 0, .1);--shadow-darker: rgba(0, 0, 0, .15);--shadow-darkest: rgba(0, 0, 0, .2);--shadow-inset: rgba(0, 0, 0, .05);--overlay-dark: rgba(240, 240, 240, .7);--overlay-darker: rgba(230, 230, 230, .8);--overlay-primary: rgba(30, 109, 231, .08);--overlay-accent: rgba(233, 77, 58, .08)}.theme-toggle{position:fixed;top:20px;right:20px;width:44px;height:44px;border-radius:50%;background:var(--bg-card);color:var(--text-primary);border:2px solid var(--border-light);box-shadow:0 2px 10px var(--shadow-dark);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:100;transition:all .3s ease}.theme-toggle:hover{transform:rotate(15deg);box-shadow:0 4px 15px var(--shadow-primary);border-color:var(--primary-color)}@media (max-width: 768px){.theme-toggle{top:10px;right:10px;width:38px;height:38px}}@media (max-width: 480px){.theme-toggle{width:36px;height:36px}}