.kn-bp-official{--bw0:#160505;--bw1:#281d1c;--bw1_2:rgba(40,29,28,0.2);--bw1_5:rgba(40,29,28,0.5);--bw6:#fff;--b_1:#594c5d;--a_1:#934444;--a_3:#a46e6e}
              .kn-bp-official *{margin:0;padding:0;box-sizing:unset}
              .kn-bp-official{min-width:320px;min-height:98vh;background-color:#281d1c;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
              .kn-bp-official,.kn-bp-official{font-family:'Special Elite',system-ui;margin:0;padding:0}
              .kn-bp-official img{max-width:none;border:none;display:block;-webkit-user-select:none;user-select:none}
              .kn-bp-official a{text-decoration:none}
              .kn-bp-official .main{display:grid;position:relative;z-index:1;opacity:0}
              .kn-bp-official .menuBar{top:0;left:0;right:0;margin:0 auto;padding:0 40px;position:fixed;z-index:98}
              .kn-bp-official .menuBar .logo .txt{line-height:0.8;color:var(--bw6)}
              .kn-bp-official .display{display:flex;flex-wrap:wrap}
              .kn-bp-official .alignCenter{align-items:center}
              .kn-bp-official .alignStart{align-items:flex-start}
              .kn-bp-official .justifyDetween{justify-content:space-between}
              .kn-bp-official .justifyEnd{justify-content:flex-end}
              .kn-bp-official .flexColumn{flex-direction:column}
              .kn-bp-official .cursor-clickable{cursor:pointer}
              .kn-bp-official .flex_G1{flex:1}
              .kn-bp-official .radius15PX{border-radius:15px}
              .kn-bp-official .radius500PX{border-radius:500px}
              .kn-bp-official .p20{padding:20px}
              .kn-bp-official .p_lr20{padding-left:20px;padding-right:20px}
              .kn-bp-official .toggle_sideMenu{width:30px;height:30px;margin:0 auto}
              .kn-bp-official .toggle_sideMenu .line{height:3px;width:100%;margin:0 0 5px 0;background:var(--bw6);transition:all 300ms cubic-bezier(0.175,0.885,0.32,1.275)}
              .kn-bp-official .toggle_sideMenu .line:nth-child(2){margin:0 0 5px 10px}
              .kn-bp-official .toggle_sideMenu .line:nth-child(3){margin:0 0 0 15px}
              .kn-bp-official .bg_01:after{content:' ';top:0;bottom:0;left:0;right:0;background-color:var(--bw1);position:fixed;z-index:-1}
              .kn-bp-official .ease{-webkit-transition:all 0.4s ease-in;transition:all 0.4s ease-in}
              @media(max-width:950px){.kn-bp-official .menuBar{padding:0 20px!important}}
            

  
  .kn-bp-official {
    --bg: #160505; --bg2: #1e1210; --bg3: #2e1c18; --border: rgba(147,100,85,.25);
    --gold: #f59e0b; --gold2: #d97706; --orange: #e88a3a; --red: #c0392b;
    --purple: #9b59b6; --blue: #3498db; --green: #27ae60; --cyan: #1abc9c;
    --text: #f0ebe5; --text2: #c4b8ad; --text3: #8a7d73;
    --glow-gold: 0 0 24px rgba(245,158,11,.12);
  }
  .kn-bp-official *{ margin: 0; padding: 0; box-sizing: border-box; }
  .kn-bp-official { scroll-behavior: smooth; }
  .kn-bp-official { font-family: 'Special Elite', system-ui, sans-serif; background: var(--bg); color: var(--text); line-height: 1.7; }

  
  .kn-bp-official ::selection{ background: rgba(245,158,11,.25); color: #fff; }

  
  .kn-bp-official .hero{ text-align: center; padding: 100px 24px 70px; background: linear-gradient(180deg, #2e1812 0%, var(--bg) 100%); border-bottom: 1px solid var(--border); position: relative; overflow: hidden; }
  .kn-bp-official .hero::before{ content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(circle at 50% 60%, rgba(245,158,11,.06) 0%, transparent 50%); pointer-events: none; }
  .kn-bp-official .hero-badge{ display: inline-block !important; padding: 6px 20px; border: 1px solid rgba(217,119,6,.5); color: var(--gold); border-radius: 20px; font-size: 13px; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 28px; backdrop-filter: blur(4px); }
  .kn-bp-official .hero h1{ font-family: 'Metal Mania', cursive; font-size: clamp(32px,5vw,56px); background: linear-gradient(135deg, var(--gold), var(--orange)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 16px; font-weight: 800; text-shadow: 0 0 40px rgba(240,209,61,.2); }
  .kn-bp-official .hero h2{ font-size: clamp(16px,2.5vw,22px); color: var(--text2); font-weight: 400; letter-spacing: 1px; }
  .kn-bp-official .hero-ver{ margin-top: 24px; color: var(--text3); font-size: 13px; }

  .kn-bp-official .container{ max-width: 960px; margin: 0 auto; padding: 0 24px; }

  
  .kn-bp-official .arch{ margin: 48px auto; max-width: 700px; display: flex; flex-direction: column; }
  .kn-bp-official .arch-phase{ display: flex; }
  .kn-bp-official .arch-left{ width: 130px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; }
  .kn-bp-official .arch-dot{ width: 20px; height: 20px; border-radius: 50%; border: 3px solid var(--gold); background: #1e1210; z-index: 2; margin-top: 20px; box-shadow: var(--glow-gold); transition: transform .2s; }
  .kn-bp-official .arch-phase:hover .arch-dot{ transform: scale(1.3); }
  .kn-bp-official .arch-line{ flex: 1; width: 2px; background: linear-gradient(180deg, var(--border), rgba(80,55,45,.3)); }
  .kn-bp-official .arch-label{ font-size: 11px; color: var(--gold); letter-spacing: 1px; text-transform: uppercase; margin-top: 8px; text-align: center; }
  .kn-bp-official .arch-right{ flex: 1; padding: 16px 0 32px 24px; }
  .kn-bp-official .arch-right h4{ color: var(--text); font-size: 16px; margin-bottom: 4px; }
  .kn-bp-official .arch-right p{ color: var(--text2); font-size: 14px; }

  
  .kn-bp-official section{ padding: 64px 0; border-bottom: 1px solid rgba(147,100,85,.18); }
  .kn-bp-official section:last-child{ border-bottom: none; }
  .kn-bp-official .tag{ display: inline-block; padding: 6px 18px; border-radius: 6px; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 700; margin-bottom: 16px; transition: box-shadow .2s; }
  .kn-bp-official .tag:hover{ box-shadow: 0 0 16px rgba(245,200,160,.06); }
  .kn-bp-official .t1{ background: rgba(52,152,219,.15); color: var(--blue); border: 1px solid rgba(52,152,219,.3); }
  .kn-bp-official .t2{ background: rgba(155,89,182,.15); color: var(--purple); border: 1px solid rgba(155,89,182,.3); }
  .kn-bp-official .t3{ background: rgba(245,158,11,.15); color: var(--gold); border: 1px solid rgba(240,209,61,.3); }
  .kn-bp-official .t4{ background: rgba(231,76,60,.15); color: var(--red); border: 1px solid rgba(231,76,60,.3); }
  .kn-bp-official h3{ font-family: 'Metal Mania', cursive; font-size: 28px; margin-bottom: 24px; letter-spacing: 0.5px; }
  .kn-bp-official h4{ font-size: 18px; margin: 36px 0 12px; color: var(--gold); }
  .kn-bp-official h4:first-child{ margin-top: 0; }
  .kn-bp-official p, .kn-bp-official li{ color: var(--text2); font-size: 15px; }
  .kn-bp-official ul{ padding-left: 20px; margin: 8px 0 16px; }
  .kn-bp-official li{ margin-bottom: 6px; }

  
  .kn-bp-official table{ width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 14px; }
  .kn-bp-official thead th{ background: #2e1c18; color: var(--gold); padding: 11px 12px; text-align: left; font-weight: 600; font-size: 12px; letter-spacing: .5px; text-transform: uppercase; border-bottom: 2px solid rgba(245,158,11,.25); }
  .kn-bp-official tbody td{ padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--text2); transition: background .15s; }
  .kn-bp-official tbody tr:hover{ background: rgba(245,158,11,.04); }
  .kn-bp-official td:first-child{ color: var(--text); font-weight: 500; }
  .kn-bp-official .q-c{ color: #aaa; } .kn-bp-official .q-u{ color: #2ecc71; } .kn-bp-official .q-r{ color: #3498db; } .kn-bp-official .q-e{ color: #9b59b6; } .kn-bp-official .q-l{ color: #e67e22; }

  
  .kn-bp-official pre{ background: rgba(18,10,8,.9); border: 1px solid rgba(147,100,85,.2); border-radius: 10px; padding: 20px; overflow-x: auto; margin: 16px 0 24px; font-size: 13px; line-height: 1.6; }
  .kn-bp-official code{ font-family: 'JetBrains Mono','Fira Code','Consolas', monospace; color: var(--cyan); }
  .kn-bp-official pre code{ color: var(--text2); }
  .kn-bp-official .hk{ color: var(--blue); } .kn-bp-official .hs{ color: var(--green); } .kn-bp-official .hn{ color: var(--orange); } .kn-bp-official .hc{ color: var(--text3); font-style: italic; }

  
  .kn-bp-official .fg{ display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 16px 0 24px; }
  .kn-bp-official .fg-3col{ grid-template-columns: repeat(3, 1fr); }
  .kn-bp-official .fc{ background: rgba(30,18,16,.8); border: 1px solid rgba(147,100,85,.2); border-radius: 10px; padding: 16px; text-align: center; transition: border-color .2s, box-shadow .2s, background .2s; }
  .kn-bp-official .fc:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .fc h5{ font-size: 15px; color: var(--text); margin-bottom: 4px; }
  .kn-bp-official .fc .role{ font-size: 12px; color: var(--gold); margin-bottom: 8px; }
  .kn-bp-official .fc .st{ font-size: 12px; color: var(--text3); line-height: 1.5; }

  
  .kn-bp-official .p1-layer{ color: var(--text3); letter-spacing: 2px; font-size: 12px; text-transform: uppercase; margin: 32px 0 8px; border-top: 1px solid var(--border); padding-top: 24px; font-weight: 700; }

  
  .kn-bp-official .stat-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0 24px; }
  .kn-bp-official .stat-card{ background: rgba(30,18,16,.8); border: 1px solid var(--border); border-radius: 10px; padding: 16px; display: flex; gap: 12px; align-items: flex-start; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .stat-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .stat-card .sc-abbr{ width: 42px; height: 42px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; flex-shrink: 0; letter-spacing: .5px; }
  .kn-bp-official .stat-card .sc-body{ flex: 1; min-width: 0; }
  .kn-bp-official .stat-card .sc-name{ font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 3px; }
  .kn-bp-official .stat-card .sc-desc{ font-size: 11px; color: var(--text3); line-height: 1.5; }

  
  .kn-bp-official .quality-table tbody tr td:first-child{ border-left: 3px solid transparent; padding-left: 9px; }
  .kn-bp-official .quality-table tbody tr:nth-child(1) td:first-child{ border-left-color: #aaa; }
  .kn-bp-official .quality-table tbody tr:nth-child(2) td:first-child{ border-left-color: #2ecc71; }
  .kn-bp-official .quality-table tbody tr:nth-child(3) td:first-child{ border-left-color: #3498db; }
  .kn-bp-official .quality-table tbody tr:nth-child(4) td:first-child{ border-left-color: #9b59b6; }
  .kn-bp-official .quality-table tbody tr:nth-child(5) td:first-child{ border-left-color: #e67e22; }

  
  .kn-bp-official .prob-bar{ display: inline-block; height: 4px; border-radius: 2px; vertical-align: middle; margin-left: 6px; }

  
  .kn-bp-official .fc-game{ border-top: 2px solid var(--blue); }
  .kn-bp-official .fc-tech{ border-top: 2px solid var(--cyan); }
  .kn-bp-official .fc-deploy{ border-top: 2px solid var(--purple); }

  
  .kn-bp-official .p1-spacer{ height: 1px; background: linear-gradient(90deg, transparent, var(--border), transparent); margin: 32px 0 8px; }

  
  .kn-bp-official .faction-table-wrap{ overflow-x: auto; margin: 16px 0 8px; border: 1px solid var(--border); border-radius: 10px; }
  .kn-bp-official .faction-table{ font-size: 11px; text-align: center; white-space: nowrap; margin: 0; border-radius: 10px; }
  .kn-bp-official .faction-table thead th{ position: sticky; top: 0; z-index: 1; }
  .kn-bp-official .faction-table td[style*="text-align:left"]{ font-weight: 600; }
  .kn-bp-official .faction-table tbody tr:hover{ background: rgba(245,158,11,.05); }

  
  .kn-bp-official .seed-algo{ margin: 16px 0 24px; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
  .kn-bp-official .seed-algo .sa-header{ padding: 14px 18px; background: #2e1c18; border-bottom: 1px solid var(--border); font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--cyan); }
  .kn-bp-official .seed-algo .sa-group{ border-bottom: 1px solid var(--border); }
  .kn-bp-official .seed-algo .sa-group:last-child{ border-bottom: none; }
  .kn-bp-official .seed-algo .sa-group-label{ padding: 8px 18px; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--text3); background: rgba(245,200,160,.02); border-bottom: 1px solid rgba(80,55,45,.4); }
  .kn-bp-official .seed-algo .sa-row{ display: flex; align-items: baseline; padding: 7px 18px; border-bottom: 1px solid rgba(80,55,45,.3); font-size: 13px; line-height: 1.6; gap: 10px; transition: background .15s; }
  .kn-bp-official .seed-algo .sa-row:last-child{ border-bottom: none; }
  .kn-bp-official .seed-algo .sa-row:hover{ background: rgba(245,158,11,.04); }
  .kn-bp-official .seed-algo .sa-byte{ display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 20px; border-radius: 4px; font-family: 'JetBrains Mono', monospace; font-size: 10px; font-weight: 700; flex-shrink: 0; letter-spacing: .5px; }
  .kn-bp-official .seed-algo .sa-attr{ font-weight: 600; color: var(--text); min-width: 90px; flex-shrink: 0; }
  .kn-bp-official .seed-algo .sa-formula{ font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--text2); flex: 1; min-width: 0; }
  .kn-bp-official .seed-algo .sa-note{ font-size: 11px; color: var(--text3); font-style: italic; margin-left: auto; flex-shrink: 0; white-space: nowrap; }

  @media (max-width: 640px) {
    .kn-bp-official .seed-algo .sa-row{ flex-wrap: wrap; }
    .kn-bp-official .seed-algo .sa-note{ margin-left: 38px; width: 100%; }
  }

  
  .kn-bp-official .fg-sublabel{ grid-column: 1 / -1; font-size: 10px; color: var(--text3); letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; padding: 12px 0 0; margin-top: 4px; border-top: 1px solid rgba(80,55,45,.4); display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .fg-sublabel::after{ content: ''; flex: 1; height: 1px; background: rgba(80,55,45,.2); }

  
  .kn-bp-official .affix-groups{ display: flex; flex-direction: column; gap: 14px; margin: 16px 0 24px; }
  .kn-bp-official .affix-group{ background: rgba(30,18,16,.8); border: 1px solid var(--border); border-left: 3px solid var(--border); border-radius: 0 10px 10px 0; overflow: hidden; }
  .kn-bp-official .affix-group.ag-off{ border-left-color: var(--red); }
  .kn-bp-official .affix-group.ag-def{ border-left-color: var(--green); }
  .kn-bp-official .affix-group.ag-util{ border-left-color: var(--cyan); }
  .kn-bp-official .affix-group .ag-header{ padding: 10px 16px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; border-bottom: 1px solid var(--border); }
  .kn-bp-official .ag-off .ag-header{ color: var(--red); background: rgba(192,57,43,.04); }
  .kn-bp-official .ag-def .ag-header{ color: var(--green); background: rgba(39,174,96,.04); }
  .kn-bp-official .ag-util .ag-header{ color: var(--cyan); background: rgba(26,188,156,.04); }
  .kn-bp-official .ag-item{ padding: 10px 16px; border-bottom: 1px solid rgba(80,55,45,.3); display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
  .kn-bp-official .ag-item:last-child{ border-bottom: none; }
  .kn-bp-official .ag-name{ font-size: 13px; color: var(--text); font-weight: 500; }
  .kn-bp-official .ag-range{ font-size: 12px; color: var(--gold); font-family: 'JetBrains Mono', monospace; white-space: nowrap; }
  .kn-bp-official .ag-stat{ font-size: 10px; color: var(--text3); margin-left: 4px; }

  
  .kn-bp-official .bonus-grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin: 16px 0 20px; }
  .kn-bp-official .bonus-card{ background: rgba(30,18,16,.8); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .bonus-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .bonus-card .bc-bar{ height: 3px; }
  .kn-bp-official .bonus-card.bc-light .bc-bar{ background: linear-gradient(90deg, var(--gold), var(--orange)); }
  .kn-bp-official .bonus-card.bc-dark .bc-bar{ background: linear-gradient(90deg, var(--purple), #e74c3c); }
  .kn-bp-official .bonus-card.bc-neutral .bc-bar{ background: linear-gradient(90deg, var(--cyan), var(--blue)); }
  .kn-bp-official .bonus-card .bc-body{ padding: 14px 16px; }
  .kn-bp-official .bonus-card .bc-top{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
  .kn-bp-official .bonus-card .bc-faction{ font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
  .kn-bp-official .bc-light .bc-faction{ color: var(--gold); }
  .kn-bp-official .bc-dark .bc-faction{ color: var(--purple); }
  .kn-bp-official .bc-neutral .bc-faction{ color: var(--cyan); }
  .kn-bp-official .bonus-card .bc-pattern{ font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--orange); background: rgba(232,138,58,.08); padding: 2px 8px; border-radius: 4px; }
  .kn-bp-official .bonus-card .bc-name{ font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 2px; }
  .kn-bp-official .bonus-card .bc-trigger{ font-size: 11px; color: var(--text3); margin-bottom: 10px; }
  .kn-bp-official .bonus-card .bc-effect{ font-size: 12px; color: var(--text2); line-height: 1.6; padding-top: 10px; border-top: 1px solid var(--border); }

  
  .kn-bp-official .p1-details{ margin: 12px 0; }
  .kn-bp-official .p1-details summary{ cursor: pointer; padding: 10px 16px; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--text2); list-style: none; display: flex; align-items: center; gap: 8px; transition: border-color .2s; }
  .kn-bp-official .p1-details summary::-webkit-details-marker{ display: none; }
  .kn-bp-official .p1-details summary::before{ content: '\25B6'; font-size: 10px; color: var(--gold); transition: transform .2s; }
  .kn-bp-official .p1-details[open] summary::before{ transform: rotate(90deg); }
  .kn-bp-official .p1-details[open] summary{ border-radius: 8px 8px 0 0; border-bottom-color: transparent; background: var(--bg3); }
  .kn-bp-official .p1-details summary:hover{ border-color: var(--gold2); }
  .kn-bp-official .p1-details .p1-detail-body{ border: 1px solid var(--border); border-top: none; border-radius: 0 0 8px 8px; overflow: hidden; }
  .kn-bp-official .p1-details .p1-detail-body > pre{ margin: 0; border: none; border-radius: 0; }

  @media (max-width: 640px) {
    .kn-bp-official .stat-cards{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official .bonus-grid{ grid-template-columns: 1fr; }
  }

  
  .kn-bp-official .fb{ background: var(--bg2); border-left: 3px solid var(--gold); padding: 18px 22px; border-radius: 0 10px 10px 0; margin: 16px 0 24px; font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--text2); background: rgba(18,10,8,.6); line-height: 1.8; }

  
  .kn-bp-official .rm{ display: flex; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--border); transition: background .2s; }
  .kn-bp-official .rm:hover{ background: rgba(255,255,255,.01); }
  .kn-bp-official .rm:last-child{ border-bottom: none; }
  .kn-bp-official .rm-p{ width: 90px; flex-shrink: 0; font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding-top: 2px; }
  .kn-bp-official .rm-b h5{ font-size: 16px; color: var(--text); margin-bottom: 4px; }
  .kn-bp-official .rm-b p{ font-size: 13px; color: var(--text3); }

  
  .kn-bp-official .back-top{ position: fixed; bottom: 24px; right: 24px; width: 40px; height: 40px; border-radius: 50%; background: rgba(61,51,48,.9); border: 1px solid var(--border); color: var(--gold); font-size: 18px; cursor: pointer; display: none; align-items: center; justify-content: center; z-index: 98; transition: opacity .2s, transform .2s; box-shadow: 0 4px 12px rgba(0,0,0,.4); }
  .kn-bp-official .back-top:hover{ transform: translateY(-2px); background: var(--gold); color: #000; }

  @media (max-width: 640px) {
    .kn-bp-official .fg{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official .fg-3col{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official table{ font-size: 12px; }
    .kn-bp-official thead th, .kn-bp-official tbody td{ padding: 6px 8px; }
    .kn-bp-official .rm{ flex-direction: column; gap: 4px; }
    .kn-bp-official .rm-p{ width: auto; }
    .kn-bp-official .hero{ padding: 70px 20px 50px; }
  }
  .kn-bp-official ::-webkit-scrollbar{ width: 6px; height: 6px; }
  .kn-bp-official ::-webkit-scrollbar-track{ background: #1a0c0a; }
  .kn-bp-official ::-webkit-scrollbar-thumb{ background: var(--border); border-radius: 3px; }
  .kn-bp-official ::-webkit-scrollbar-thumb:hover{ background: var(--gold2); }

  
  .kn-bp-official .page-layout{ display: flex; gap: 0; max-width: 1200px; margin: 0 auto; }

  
  .kn-bp-official .toc{ position: sticky; top: 24px; align-self: flex-start; width: 220px; min-width: 220px; padding: 20px 16px; background: rgba(22,5,5,.95); border: 1px solid var(--border); border-radius: 12px; margin: 24px 0 24px 24px; max-height: calc(100vh - 48px); overflow-y: auto; }
  .kn-bp-official .toc::-webkit-scrollbar{ width: 3px; }
  .kn-bp-official .toc::-webkit-scrollbar-thumb{ background: var(--border); border-radius: 2px; }
  .kn-bp-official .toc-title{ font-size: 11px; color: var(--text3); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; font-weight: 600; }
  .kn-bp-official .toc a{ display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(80,55,45,.3); color: var(--text2); text-decoration: none; font-size: 13px; transition: color .2s, padding-left .2s; }
  .kn-bp-official .toc a:last-child{ border-bottom: none; }
  .kn-bp-official .toc a:hover{ color: var(--gold); padding-left: 4px; background: rgba(245,158,11,.04); border-radius: 4px; }
  .kn-bp-official .toc .toc-phase{ font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; min-width: 50px; }
  .kn-bp-official .toc .toc-label{ flex: 1; }
  .kn-bp-official .toc .toc-subs{ padding: 0 0 4px 58px; }
  .kn-bp-official .toc .toc-subs a{ font-size: 11px; color: var(--text3); padding: 3px 0; border-bottom: none; display: block; }
  .kn-bp-official .toc .toc-subs a:hover{ color: var(--blue); padding-left: 4px; }
  .kn-bp-official .toc .toc-subs .toc-layer{ font-size: 9px; color: var(--text2); font-weight: 600; letter-spacing: 1.5px; margin-top: 8px; padding: 0; cursor: default; }
  .kn-bp-official .toc .toc-subs .toc-layer:hover{ color: var(--text2); padding-left: 0; }
  .kn-bp-official .toc .toc-subs .toc-item{ padding-left: 10px; }
  .kn-bp-official .toc-toggle{ display: none; }
  .kn-bp-official .main-content{ flex: 1; min-width: 0; }

  @media (max-width: 900px) {
    .kn-bp-official .page-layout{ flex-direction: column; }
    .kn-bp-official .toc{ position: static; width: 100%; min-width: 0; margin: 12px 24px; max-height: none; }
    .kn-bp-official .main-content{ width: 100%; }
  }

  
  .kn-bp-official .example-nft{ background: rgba(22,8,6,.85); border: 1px solid rgba(147,100,85,.2); border-radius: 12px; padding: 24px; margin: 14px 0 20px; }
  .kn-bp-official .example-nft .title{ font-size: 18px; color: var(--text); font-weight: 700; margin-bottom: 12px; }
  .kn-bp-official .example-nft .quality{ display: inline-block; padding: 3px 12px; border-radius: 4px; font-size: 12px; font-weight: 700; letter-spacing: 1px; }
  .kn-bp-official .example-nft .stats{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 0; }
  .kn-bp-official .example-nft .stat{ background: #2e1c18; border-radius: 6px; padding: 8px 12px; text-align: center; }
  .kn-bp-official .example-nft .stat .label{ font-size: 10px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; }
  .kn-bp-official .example-nft .stat .val{ font-size: 20px; font-weight: 700; margin-top: 2px; }

  
  .kn-bp-official .fusion-flow{ display: flex; align-items: stretch; gap: 0; margin: 24px 0; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
  .kn-bp-official .fusion-step{ flex: 1; text-align: center; padding: 22px 16px; position: relative; }
  .kn-bp-official .fusion-step:not(:last-child)::after{ content: ''; position: absolute; right: -1px; top: 20%; height: 60%; width: 2px; background: var(--border); }
  .kn-bp-official .fusion-step .f-icon{ font-size: 32px; line-height: 1; margin-bottom: 10px; }
  .kn-bp-official .fusion-step .f-label{ font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
  .kn-bp-official .fusion-step .f-desc{ font-size: 11px; color: var(--text3); line-height: 1.6; }
  .kn-bp-official .fusion-arrow{ display: flex; align-items: center; justify-content: center; width: 44px; flex-shrink: 0; font-size: 20px; color: var(--gold); background: rgba(240,209,61,.05); }

  
  .kn-bp-official .salvage-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 16px 0 24px; }
  .kn-bp-official .s-card{ background: rgba(30,18,16,.8); border: 1px solid var(--border); border-radius: 10px; padding: 20px 16px; text-align: center; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .s-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .s-card .s-name{ font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 2px; }
  .kn-bp-official .s-card .s-name-zh{ font-size: 11px; color: var(--text3); margin-bottom: 10px; }
  .kn-bp-official .s-card .s-cost{ font-size: 28px; font-weight: 800; color: var(--gold); line-height: 1; }
  .kn-bp-official .s-card .s-cost-label{ font-size: 10px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 10px; }
  .kn-bp-official .s-card .s-output{ font-size: 12px; color: var(--text2); line-height: 1.6; padding-top: 10px; border-top: 1px solid var(--border); }
  .kn-bp-official .s-card .s-tag{ display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 600; letter-spacing: .5px; margin-top: 8px; }

  
  .kn-bp-official .set-group{ margin: 16px 0 28px; border-left: 3px solid rgba(147,100,85,.35); padding-left: 12px; border-radius: 0; }
  .kn-bp-official .set-group.sg-light{ border-left-color: var(--gold); }
  .kn-bp-official .set-group.sg-dark{ border-left-color: var(--purple); }
  .kn-bp-official .set-group.sg-neutral{ border-left-color: var(--cyan); }
  .kn-bp-official .set-group table{ margin: 4px 0 12px; }

  
  
  .kn-bp-official td.stat-hi{ background: rgba(245,158,11,.06); }
  
  .kn-bp-official .p2-layer{ color: var(--text3); letter-spacing: 2px; font-size: 12px; text-transform: uppercase; margin: 40px 0 12px; border-top: 1px solid var(--border); padding-top: 20px; font-weight: 700; }

  @media (max-width: 640px) {
    .kn-bp-official .fusion-flow{ flex-direction: column; }
    .kn-bp-official .fusion-arrow{ width: auto; height: 32px; transform: rotate(90deg); }
    .kn-bp-official .fusion-step:not(:last-child)::after{ display: none; }
    .kn-bp-official .salvage-cards{ grid-template-columns: 1fr; }
    .kn-bp-official .p2-formula-grid{ grid-template-columns: 1fr !important; }
    .kn-bp-official .p2-compare-grid{ grid-template-columns: 1fr !important; }
  }

  
  .kn-bp-official .hp-flow .fusion-step .f-icon{
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(240,209,61,.1); border: 2px solid var(--gold2);
    color: var(--gold); font-size: 16px; font-weight: 800; margin-bottom: 10px;
  }

  
  .kn-bp-official .battle-scenario{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 16px 0 24px; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
  .kn-bp-official .bs-setup{ grid-column: 1 / -1; padding: 18px 22px; border-bottom: 1px solid var(--border); font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--text2); line-height: 1.8; }
  .kn-bp-official .bs-setup .bs-title{ font-size: 14px; font-weight: 700; color: var(--text); font-family: 'Segoe UI', system-ui, sans-serif; margin-bottom: 10px; }
  .kn-bp-official .bs-setup .bs-note{ font-size: 11px; color: var(--text3); font-style: italic; margin-top: 8px; }
  .kn-bp-official .bs-col{ padding: 18px 22px; font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--text2); line-height: 2; }
  .kn-bp-official .bs-col:first-of-type{ border-right: 1px solid var(--border); }
  .kn-bp-official .bs-col .bs-header{ font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 10px; font-family: 'Segoe UI', system-ui, sans-serif; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .bs-col.bs-win .bs-header{ color: var(--green); }
  .kn-bp-official .bs-col.bs-lose .bs-header{ color: var(--red); }
  .kn-bp-official .bs-col .bs-result{ display: inline-block; padding: 3px 10px; border-radius: 4px; font-size: 11px; font-weight: 700; margin-top: 6px; font-family: 'Segoe UI', system-ui, sans-serif; }
  .kn-bp-official .bs-win .bs-result{ background: rgba(39,174,96,.12); color: var(--green); }
  .kn-bp-official .bs-lose .bs-result{ background: rgba(192,57,43,.12); color: var(--red); }

  
  .kn-bp-official .enhance-row{ position: relative; flex-wrap: wrap; }
  .kn-bp-official .enhance-row::after{ content: ''; display: block; width: 100%; height: 3px; background: var(--bg3); position: absolute; bottom: 0; left: 0; border-radius: 0 0 10px 10px; }
  .kn-bp-official .enhance-row::before{ content: ''; display: block; height: 3px; position: absolute; bottom: 0; left: 0; z-index: 1; border-radius: 0 0 10px 10px; transition: width .4s ease; }
  .kn-bp-official .er-safe::before{ width: 100%; background: var(--green); }
  .kn-bp-official .er-risky::before{ width: 80%; background: var(--blue); }
  .kn-bp-official .er-danger::before{ width: 50%; background: var(--orange); }
  .kn-bp-official .er-extreme::before{ width: 30%; background: var(--red); }

  
  .kn-bp-official .awaken-card .ac-bar{ height: 4px; }
  .kn-bp-official .awaken-card .ac-skill-name{ font-weight: 700; }
  .kn-bp-official .ac-light .ac-skill-name{ color: var(--gold); }
  .kn-bp-official .ac-dark .ac-skill-name{ color: var(--purple); }
  .kn-bp-official .ac-neutral .ac-skill-name{ color: var(--cyan); }

  
  .kn-bp-official .p3-spacer{ height: 1px; background: linear-gradient(90deg, transparent, var(--border), transparent); margin: 40px 0 8px; }

  
  .kn-bp-official .p3-pillars{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 20px 0 8px; }
  .kn-bp-official .p3-pill{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; padding: 18px 14px; text-align: center; transition: border-color .2s, box-shadow .2s; position: relative; overflow: hidden; }
  .kn-bp-official .p3-pill:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .p3-pill .pp-icon{ font-size: 24px; line-height: 1; margin-bottom: 8px; }
  .kn-bp-official .p3-pill .pp-title{ font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
  .kn-bp-official .p3-pill .pp-desc{ font-size: 11px; color: var(--text3); line-height: 1.5; }

  
  .kn-bp-official .tc-dsg .tc-tag{ background: rgba(245,158,11,.06); border-color: rgba(240,209,61,.2); color: var(--gold2); }
  .kn-bp-official .tc-hp .tc-tag{ background: rgba(192,57,43,.06); border-color: rgba(192,57,43,.2); color: var(--red); }

  
  .kn-bp-official .bs-header::before{ content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
  .kn-bp-official .bs-win .bs-header::before{ background: var(--green); box-shadow: 0 0 6px rgba(39,174,96,.4); }
  .kn-bp-official .bs-lose .bs-header::before{ background: var(--red); box-shadow: 0 0 6px rgba(192,57,43,.4); }

  
  .kn-bp-official .enhance-summary{ display: flex; align-items: center; justify-content: center; gap: 24px; padding: 14px 20px; background: linear-gradient(135deg, rgba(245,158,11,.06), rgba(192,57,43,.04)); border: 1px solid var(--border); border-radius: 10px; margin-top: 10px; }
  .kn-bp-official .enhance-summary .esum-item{ text-align: center; }
  .kn-bp-official .enhance-summary .esum-label{ font-size: 9px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 2px; }
  .kn-bp-official .enhance-summary .esum-value{ font-size: 18px; font-weight: 800; color: var(--gold); }
  .kn-bp-official .enhance-summary .esum-sep{ width: 1px; height: 28px; background: var(--border); }

  
  .kn-bp-official .awaken-grid-single{ display: grid; grid-template-columns: minmax(280px, 480px); gap: 12px; margin: 16px 0 24px; }

  
  .kn-bp-official .circ-item .ci-arrow{ font-size: 11px; color: var(--text3); flex-shrink: 0; }
  .kn-bp-official .circ-earn .ci-arrow{ color: rgba(39,174,96,.5); margin-left: auto; padding-left: 8px; }
  .kn-bp-official .circ-burn .ci-arrow{ color: rgba(192,57,43,.5); margin-right: 4px; order: -1; }

  @media (max-width: 640px) {
    .kn-bp-official .battle-scenario{ grid-template-columns: 1fr; }
    .kn-bp-official .bs-col:first-of-type{ border-right: none; border-bottom: 1px solid var(--border); }
    .kn-bp-official .p3-pillars{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official .enhance-summary{ flex-wrap: wrap; gap: 12px; }
    .kn-bp-official .awaken-grid-single{ grid-template-columns: 1fr; }
  }

  
  .kn-bp-official .token-cards{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 20px 0 28px; }
  .kn-bp-official .token-card{ background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 24px; position: relative; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .token-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .token-card::before{ content: ''; position: absolute; top: 0; right: 0; width: 120px; height: 120px; border-radius: 50%; filter: blur(60px); opacity: .08; pointer-events: none; }
  .kn-bp-official .token-card.tc-dsg::before{ background: var(--gold); }
  .kn-bp-official .token-card.tc-hp::before{ background: var(--red); }
  .kn-bp-official .token-card .tc-header{ display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
  .kn-bp-official .token-card .tc-icon{ width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 800; flex-shrink: 0; }
  .kn-bp-official .tc-dsg .tc-icon{ background: rgba(245,158,11,.15); border: 2px solid var(--gold2); color: var(--gold); }
  .kn-bp-official .tc-hp .tc-icon{ background: rgba(192,57,43,.15); border: 2px solid var(--red); color: var(--red); }
  .kn-bp-official .token-card .tc-name{ font-size: 18px; font-weight: 700; color: var(--text); }
  .kn-bp-official .token-card .tc-type{ font-size: 11px; color: var(--text3); letter-spacing: 1.5px; text-transform: uppercase; margin-top: 2px; }
  .kn-bp-official .token-card .tc-desc{ font-size: 14px; color: var(--text2); line-height: 1.7; }
  .kn-bp-official .token-card .tc-tags{ display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
  .kn-bp-official .token-card .tc-tag{ display: inline-block; padding: 3px 10px; border-radius: 4px; font-size: 10px; font-weight: 600; letter-spacing: .5px; background: rgba(255,255,255,.04); border: 1px solid var(--border); color: var(--text3); }

  
  .kn-bp-official .enhance-grid{ display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0 24px; }
  .kn-bp-official .enhance-row{ display: flex; align-items: stretch; background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .enhance-row:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .enhance-tier{ width: 100px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 14px 8px; border-right: 1px solid var(--border); }
  .kn-bp-official .enhance-tier .et-level{ font-size: 18px; font-weight: 800; line-height: 1.1; }
  .kn-bp-official .enhance-tier .et-zone{ font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; margin-top: 4px; }
  .kn-bp-official .enhance-body{ flex: 1; display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; }
  .kn-bp-official .enhance-stat{ display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 14px 8px; border-right: 1px solid rgba(80,55,45,.3); }
  .kn-bp-official .enhance-stat:last-child{ border-right: none; }
  .kn-bp-official .enhance-stat .es-label{ font-size: 9px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 4px; }
  .kn-bp-official .enhance-stat .es-value{ font-size: 16px; font-weight: 700; }
  .kn-bp-official .er-safe .enhance-tier{ background: rgba(39,174,96,.08); }
  .kn-bp-official .er-safe .et-level, .kn-bp-official .er-safe .et-zone{ color: var(--green); }
  .kn-bp-official .er-safe .es-value{ color: var(--green); }
  .kn-bp-official .er-risky .enhance-tier{ background: rgba(52,152,219,.08); }
  .kn-bp-official .er-risky .et-level, .kn-bp-official .er-risky .et-zone{ color: var(--blue); }
  .kn-bp-official .er-risky .es-value{ color: var(--blue); }
  .kn-bp-official .er-danger .enhance-tier{ background: rgba(230,126,34,.08); }
  .kn-bp-official .er-danger .et-level, .kn-bp-official .er-danger .et-zone{ color: var(--orange); }
  .kn-bp-official .er-danger .es-value{ color: var(--orange); }
  .kn-bp-official .er-extreme .enhance-tier{ background: rgba(192,57,43,.08); }
  .kn-bp-official .er-extreme .et-level, .kn-bp-official .er-extreme .et-zone{ color: var(--red); }
  .kn-bp-official .er-extreme .es-value{ color: var(--red); }

  
  .kn-bp-official .awaken-grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin: 16px 0 24px; }
  .kn-bp-official .awaken-card{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .awaken-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .awaken-card .ac-bar{ height: 3px; }
  .kn-bp-official .awaken-card.ac-light .ac-bar{ background: linear-gradient(90deg, var(--gold), var(--orange)); }
  .kn-bp-official .awaken-card.ac-dark .ac-bar{ background: linear-gradient(90deg, var(--purple), #e74c3c); }
  .kn-bp-official .awaken-card.ac-neutral .ac-bar{ background: linear-gradient(90deg, var(--cyan), var(--blue)); }
  .kn-bp-official .awaken-card .ac-body{ padding: 16px; }
  .kn-bp-official .awaken-card .ac-faction{ font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 6px; }
  .kn-bp-official .ac-light .ac-faction{ color: var(--gold); }
  .kn-bp-official .ac-dark .ac-faction{ color: var(--purple); }
  .kn-bp-official .ac-neutral .ac-faction{ color: var(--cyan); }
  .kn-bp-official .awaken-card .ac-form{ font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
  .kn-bp-official .awaken-card .ac-arrow{ color: var(--text3); font-size: 12px; margin: 0 6px; }
  .kn-bp-official .awaken-card .ac-skill{ font-size: 13px; color: var(--text2); line-height: 1.6; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }

  
  .kn-bp-official .circ-flow{ display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; margin: 16px 0 24px; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
  .kn-bp-official .circ-col{ padding: 20px; }
  .kn-bp-official .circ-col h5{ font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .circ-earn h5{ color: var(--green); }
  .kn-bp-official .circ-burn h5{ color: var(--red); }
  .kn-bp-official .circ-divider{ width: 1px; background: var(--border); position: relative; }
  .kn-bp-official .circ-divider::after{ content: 'DSG'; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background: var(--bg3); color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: 1px; padding: 8px 6px; border-radius: 6px; border: 1px solid var(--border); }
  .kn-bp-official .circ-item{ display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 13px; color: var(--text2); }
  .kn-bp-official .circ-item .ci-dot{ width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
  .kn-bp-official .circ-earn .ci-dot{ background: var(--green); }
  .kn-bp-official .circ-burn .ci-dot{ background: var(--red); }

  
  .kn-bp-official .strategy-callout{ background: linear-gradient(135deg, rgba(245,158,11,.05), rgba(155,89,182,.04)); border: 1px solid var(--border); border-radius: 10px; padding: 20px 22px; margin: 20px 0 24px; position: relative; }
  .kn-bp-official .strategy-callout::before{ content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; border-radius: 10px 0 0 10px; background: linear-gradient(180deg, var(--gold), var(--purple)); }
  .kn-bp-official .strategy-callout .sc-title{ font-size: 14px; font-weight: 700; color: var(--gold); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .strategy-callout p{ font-size: 14px; color: var(--text2); line-height: 1.7; margin: 0; }

  
  .kn-bp-official .awaken-section{ margin: 20px 0 10px; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; display: flex; align-items: center; gap: 10px; }
  .kn-bp-official .awaken-section::after{ content: ''; flex: 1; height: 1px; background: var(--border); }
  .kn-bp-official .awaken-section.as-light{ color: var(--gold); }
  .kn-bp-official .awaken-section.as-dark{ color: var(--purple); }
  .kn-bp-official .awaken-section.as-neutral{ color: var(--cyan); }

  @media (max-width: 640px) {
    .kn-bp-official .token-cards{ grid-template-columns: 1fr; }
    .kn-bp-official .enhance-body{ grid-template-columns: repeat(2, 1fr); }
    .kn-bp-official .enhance-tier{ width: 80px; }
    .kn-bp-official .awaken-grid{ grid-template-columns: 1fr; }
    .kn-bp-official .circ-flow{ grid-template-columns: 1fr; }
    .kn-bp-official .circ-divider{ width: auto; height: 1px; }
    .kn-bp-official .circ-divider::after{ top: 50%; left: 24px; transform: translateY(-50%); }
  }

  
  .kn-bp-official .fairness-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 20px 0 28px; }
  .kn-bp-official .fair-card{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; padding: 18px; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .fair-card:hover{ border-color: rgba(52,152,219,.4); box-shadow: 0 0 16px rgba(52,152,219,.06); }
  .kn-bp-official .fair-card .fair-num{ display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; background: rgba(52,152,219,.12); color: var(--blue); font-weight: 800; font-size: 11px; margin-bottom: 10px; }
  .kn-bp-official .fair-card .fair-title{ font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
  .kn-bp-official .fair-card .fair-desc{ font-size: 12px; color: var(--text3); line-height: 1.6; }

  
  .kn-bp-official .counter-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 20px 0 24px; }
  .kn-bp-official .cc-role{ background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 22px 18px; text-align: center; transition: border-color .2s, box-shadow .2s; }
  .kn-bp-official .cc-role:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); }
  .kn-bp-official .cc-role .cc-name{ font-size: 17px; font-weight: 800; color: var(--text); margin-bottom: 2px; }
  .kn-bp-official .cc-role .cc-factions{ font-size: 12px; color: var(--text3); margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
  .kn-bp-official .cc-role .cc-line{ font-size: 12px; line-height: 2.2; }
  .kn-bp-official .cc-role .cc-wins{ color: var(--green); font-weight: 600; }
  .kn-bp-official .cc-role .cc-loses{ color: var(--red); font-weight: 600; }
  .kn-bp-official .cc-healer{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; padding: 14px 20px; text-align: center; font-size: 13px; color: var(--text2); margin-top: 12px; }
  .kn-bp-official .cc-healer strong{ color: var(--cyan); font-weight: 700; }

  
  .kn-bp-official .p4-divider{ display: flex; align-items: center; gap: 14px; margin: 48px 0 28px; }
  .kn-bp-official .p4-divider::before, .kn-bp-official .p4-divider::after{ content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--border), transparent); }
  .kn-bp-official .p4-divider span{ font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--red); white-space: nowrap; }

  
  .kn-bp-official .gameplay-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 24px 0; }
  .kn-bp-official .gm-card{ background: var(--bg2); border: 1px solid var(--border); border-radius: 14px; padding: 26px 22px; transition: border-color .3s, box-shadow .3s, transform .2s; position: relative; overflow: hidden; }
  .kn-bp-official .gm-card::before{ content: ''; position: absolute; top: 0; right: 0; width: 100px; height: 100px; border-radius: 50%; filter: blur(50px); opacity: .06; pointer-events: none; }
  .kn-bp-official .gm-card:hover{ border-color: var(--gold2); box-shadow: var(--glow-gold); transform: translateY(-2px); }
  .kn-bp-official .gm-card .gm-badge{ display: inline-block; padding: 4px 12px; border-radius: 4px; font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 14px; }
  .kn-bp-official .gm-card h5{ font-size: 17px; color: var(--text); margin-bottom: 14px; font-weight: 700; }
  .kn-bp-official .gm-card ul{ padding-left: 16px; margin: 0; }
  .kn-bp-official .gm-card li{ font-size: 13px; color: var(--text2); margin-bottom: 8px; line-height: 1.6; }
  .kn-bp-official .gm-card li:last-child{ margin-bottom: 0; }
  .kn-bp-official .gm-pve{ border-top: 3px solid var(--green); }
  .kn-bp-official .gm-pve::before{ background: var(--green); }
  .kn-bp-official .gm-pvp{ border-top: 3px solid var(--orange); }
  .kn-bp-official .gm-pvp::before{ background: var(--orange); }
  .kn-bp-official .gm-gvg{ border-top: 3px solid var(--purple); }
  .kn-bp-official .gm-gvg::before{ background: var(--purple); }
  .kn-bp-official .gm-pve .gm-badge{ background: rgba(39,174,96,.12); color: var(--green); border: 1px solid rgba(39,174,96,.25); }
  .kn-bp-official .gm-pvp .gm-badge{ background: rgba(232,138,58,.12); color: var(--orange); border: 1px solid rgba(232,138,58,.25); }
  .kn-bp-official .gm-gvg .gm-badge{ background: rgba(155,89,182,.12); color: var(--purple); border: 1px solid rgba(155,89,182,.25); }

  
  .kn-bp-official .vs-card{ display: flex; align-items: stretch; margin: 20px 0 16px; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
  .kn-bp-official .vs-fighter{ flex: 1; padding: 20px; text-align: center; }
  .kn-bp-official .vs-fighter:first-child{ border-right: none; }
  .kn-bp-official .vs-fighter .vf-name{ font-size: 18px; font-weight: 800; color: var(--text); margin-bottom: 2px; }
  .kn-bp-official .vs-fighter .vf-role{ font-size: 11px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 12px; }
  .kn-bp-official .vs-fighter .vf-stats{ font-family: 'JetBrains Mono','Fira Code','Consolas', monospace; font-size: 11px; color: var(--text2); line-height: 1.8; text-align: left; display: inline-block; }
  .kn-bp-official .vs-fighter .vf-result{ margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 12px; font-weight: 700; }
  .kn-bp-official .vs-divider{ display: flex; align-items: center; justify-content: center; width: 56px; flex-shrink: 0; background: rgba(192,57,43,.06); border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
  .kn-bp-official .vs-divider span{ font-size: 16px; font-weight: 900; color: var(--red); letter-spacing: 2px; }

  
  .kn-bp-official .bal-cell{ display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .bal-bar{ height: 8px; border-radius: 4px; min-width: 4px; transition: width .4s; }
  .kn-bp-official .bal-light{ background: linear-gradient(90deg, var(--blue), #5dade2); }
  .kn-bp-official .bal-dark{ background: linear-gradient(90deg, var(--purple), #bb8fce); }

  
  .kn-bp-official .p4-sub{ display: flex; align-items: center; gap: 12px; margin: 44px 0 20px; }
  .kn-bp-official .p4-sub::after{ content: ''; flex: 1; height: 1px; background: var(--border); }
  .kn-bp-official .p4-sub span{ font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--text3); white-space: nowrap; }

  
  .kn-bp-official .char-showcase{ background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin: 16px 0 24px; transition: border-color .2s; }
  .kn-bp-official .char-showcase:hover{ border-color: var(--gold2); }
  .kn-bp-official .char-showcase .cs-header{ display: flex; align-items: center; gap: 14px; padding: 16px 20px; border-bottom: 1px solid var(--border); background: rgba(245,158,11,.04); }
  .kn-bp-official .char-showcase .cs-name{ font-size: 18px; font-weight: 800; color: var(--text); }
  .kn-bp-official .char-showcase .cs-label{ font-size: 11px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; }
  .kn-bp-official .char-showcase .cs-stats{ display: grid; grid-template-columns: repeat(7, 1fr); gap: 0; padding: 0; }
  .kn-bp-official .char-showcase .cs-stat{ padding: 14px 16px; border-right: 1px solid var(--border); text-align: center; }
  .kn-bp-official .char-showcase .cs-stat:last-child{ border-right: none; }
  .kn-bp-official .char-showcase .cs-stat .csv{ font-family: "JetBrains Mono","Consolas", monospace; font-size: 20px; font-weight: 800; color: var(--gold); line-height: 1; }
  .kn-bp-official .char-showcase .cs-stat .csl{ font-size: 10px; color: var(--text3); letter-spacing: 1px; text-transform: uppercase; margin-top: 4px; }
  .kn-bp-official .char-showcase .cs-note{ padding: 14px 20px; font-size: 13px; color: var(--text2); line-height: 1.6; }

  
  .kn-bp-official .p4-callout{ background: linear-gradient(135deg, rgba(245,158,11,.04), rgba(155,89,182,.03)); border: 1px solid var(--border); border-radius: 10px; padding: 18px 22px; margin: 16px 0 24px; position: relative; }
  .kn-bp-official .p4-callout::before{ content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; border-radius: 10px 0 0 10px; }
  .kn-bp-official .p4-callout.pc-gold::before{ background: var(--gold); }
  .kn-bp-official .p4-callout.pc-blue::before{ background: var(--blue); }
  .kn-bp-official .p4-callout .pc-title{ font-size: 13px; font-weight: 700; margin-bottom: 6px; }
  .kn-bp-official .p4-callout.pc-gold .pc-title{ color: var(--gold); }
  .kn-bp-official .p4-callout.pc-blue .pc-title{ color: var(--blue); }
  .kn-bp-official .p4-callout p{ font-size: 14px; color: var(--text2); line-height: 1.7; margin: 0; }


  
  .kn-bp-official .battle-setup{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 16px 0; }
  .kn-bp-official .bs-card{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
  .kn-bp-official .bs-card .bs-label{ font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--text3); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .bs-card .bs-label::after{ content: ''; flex: 1; height: 1px; background: var(--border); }
  .kn-bp-official .bs-card .bs-code{ font-family: "JetBrains Mono","Fira Code","Consolas", monospace; font-size: 12px; color: var(--text2); line-height: 1.8; }
  .kn-bp-official .bs-card .bs-code strong{ color: var(--text); }
  .kn-bp-official .bs-card.bs-tx .bs-label{ color: var(--orange); }
  .kn-bp-official .bs-card.bs-seed .bs-label{ color: var(--cyan); }
  .kn-bp-official .battle-info{ display: flex; gap: 12px; margin: 0 0 16px; flex-wrap: wrap; }
  .kn-bp-official .bi-tag{ display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--bg2); border: 1px solid var(--border); border-radius: 6px; font-size: 12px; color: var(--text2); }
  .kn-bp-official .bi-tag .bi-val{ font-weight: 700; color: var(--text); font-family: "JetBrains Mono","Consolas", monospace; }
  
  .kn-bp-official .combat-panels{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 16px 0 24px; background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
  .kn-bp-official .combat-panel{ padding: 18px 20px; font-family: "JetBrains Mono","Fira Code","Consolas", monospace; font-size: 13px; line-height: 1.8; color: var(--text2); }
  .kn-bp-official .combat-panel:first-child{ border-right: 1px solid var(--border); }
  .kn-bp-official .combat-panel .cp-label{ font-family: 'Segoe UI', system-ui, sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .combat-panel .cp-label::after{ content: ''; flex: 1; height: 1px; background: var(--border); }
  .kn-bp-official .cp-primary .cp-label{ color: var(--gold); }
  .kn-bp-official .cp-secondary .cp-label{ color: var(--cyan); }

  
  .kn-bp-official .pvp-flow{ display: flex; gap: 0; margin: 24px 0; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
  .kn-bp-official .pvp-step{ flex: 1; padding: 22px 18px; position: relative; }
  .kn-bp-official .pvp-step:not(:last-child){ border-right: 1px solid var(--border); }
  .kn-bp-official .pvp-step .ps-head{ display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
  .kn-bp-official .pvp-step .ps-num{ display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--gold); color: #000; font-weight: 800; font-size: 13px; flex-shrink: 0; }
  .kn-bp-official .pvp-step .ps-title{ font-size: 14px; font-weight: 700; color: var(--text); }
  .kn-bp-official .pvp-step .ps-desc{ font-size: 12px; color: var(--text3); line-height: 1.6; margin-bottom: 10px; }
  .kn-bp-official .pvp-step .ps-code{ font-family: "JetBrains Mono","Fira Code","Consolas", monospace; font-size: 11px; color: var(--cyan); background: var(--bg); padding: 8px 10px; border-radius: 6px; border: 1px solid var(--border); line-height: 1.6; overflow-x: auto; }
  .kn-bp-official .pvp-step .ps-state{ margin-top: 8px; font-size: 11px; font-weight: 600; letter-spacing: .5px; }

  
  .kn-bp-official .stat-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 16px 0 24px; }
  .kn-bp-official .stat-item{ background: var(--bg2); border: 1px solid var(--border); border-radius: 10px; padding: 16px; transition: border-color .2s; }
  .kn-bp-official .stat-item:hover{ border-color: var(--gold2); }
  .kn-bp-official .stat-item .si-formula{ font-family: "JetBrains Mono","Fira Code","Consolas", monospace; font-size: 12px; color: var(--cyan); margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
  .kn-bp-official .stat-item .si-name{ font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
  .kn-bp-official .stat-item .si-desc{ font-size: 12px; color: var(--text3); line-height: 1.6; }

  
  .kn-bp-official .sec-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0 24px; }
  .kn-bp-official .sec-item{ background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 14px; transition: border-color .2s; }
  .kn-bp-official .sec-item:hover{ border-color: var(--gold2); }
  .kn-bp-official .sec-item .se-name{ font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 2px; }
  .kn-bp-official .sec-item .se-formula{ font-family: "JetBrains Mono","Fira Code","Consolas", monospace; font-size: 11px; color: var(--cyan); margin-bottom: 6px; }
  .kn-bp-official .sec-item .se-desc{ font-size: 11px; color: var(--text3); line-height: 1.5; }

  
  .kn-bp-official .battle-details{ margin: 12px 0; }
  .kn-bp-official .battle-details summary{ cursor: pointer; padding: 12px 16px; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--text2); transition: border-color .2s, background .2s; list-style: none; display: flex; align-items: center; gap: 8px; }
  .kn-bp-official .battle-details summary::-webkit-details-marker{ display: none; }
  .kn-bp-official .battle-details summary::before{ content: "▶"; font-size: 10px; color: var(--gold); transition: transform .2s; }
  .kn-bp-official .battle-details[open] summary::before{ transform: rotate(90deg); }
  .kn-bp-official .battle-details[open] summary{ border-radius: 8px 8px 0 0; border-bottom-color: transparent; background: var(--bg3); }
  .kn-bp-official .battle-details summary:hover{ border-color: var(--gold2); }
  .kn-bp-official .battle-details .bd-content{ border: 1px solid var(--border); border-top: none; border-radius: 0 0 8px 8px; padding: 0; }

  @media (max-width: 640px) {
    .kn-bp-official .vs-card{ flex-direction: column; }
    .kn-bp-official .vs-divider{ width: auto; height: 40px; border-left: none; border-right: none; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
    .kn-bp-official .char-showcase .cs-stats{ grid-template-columns: repeat(4, 1fr); }
    .kn-bp-official .pvp-flow{ flex-direction: column; }
    .kn-bp-official .pvp-step:not(:last-child){ border-right: none; border-bottom: 1px solid var(--border); }
    .kn-bp-official .stat-grid{ grid-template-columns: 1fr; }
    .kn-bp-official .sec-grid{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official .combat-panels{ grid-template-columns: 1fr; }
    .kn-bp-official .battle-setup{ grid-template-columns: 1fr; }
    .kn-bp-official .combat-panel:first-child{ border-right: none; border-bottom: 1px solid var(--border); }
    .kn-bp-official .fairness-grid{ grid-template-columns: 1fr; }
    .kn-bp-official .counter-cards{ grid-template-columns: 1fr; }
    .kn-bp-official .gameplay-cards{ grid-template-columns: 1fr; }
  }

  
  @media (max-width: 900px) {
    .kn-bp-official .page-layout{ width: 100%; }
    .kn-bp-official .toc{ width: auto; max-width: calc(100% - 32px); margin: 12px auto 4px; border-radius: 10px; }
    .kn-bp-official .hero h1, .kn-bp-official .hero h2{ max-width: 100%; overflow-wrap: anywhere; }
    .kn-bp-official .hero h2{ max-width: 320px; margin-left: auto; margin-right: auto; }
  }

  @media (max-width: 640px) {
    .kn-bp-official { line-height: 1.62; overflow-x: hidden; }
    .kn-bp-official.blueprint-page-active .menuBar,
    .kn-bp-official:has(.blueprint-wrapper) .menuBar {
      width: 100vw;
      max-width: 100vw;
      padding: 0 16px !important;
      box-sizing: border-box;
      overflow: hidden;
    }
    .kn-bp-official.blueprint-page-active .menuBar .logo,
    .kn-bp-official:has(.blueprint-wrapper) .menuBar .logo {
      min-width: 0;
      flex-shrink: 1;
    }
    .kn-bp-official.blueprint-page-active .menuBar .logo .txt,
    .kn-bp-official:has(.blueprint-wrapper) .menuBar .logo .txt {
      font-size: 18px !important;
    }
    .kn-bp-official.blueprint-page-active .menuBar > button[aria-label="Connect wallet"],
    .kn-bp-official.blueprint-page-active .menuBar .wallet-connected-group,
    .kn-bp-official:has(.blueprint-wrapper) .menuBar > button[aria-label="Connect wallet"],
    .kn-bp-official:has(.blueprint-wrapper) .menuBar .wallet-connected-group {
      display: none !important;
    }
    .kn-bp-official.blueprint-page-active .blueprint-wrapper,
    .kn-bp-official:has(.blueprint-wrapper) .blueprint-wrapper {
      width: 100%;
      max-width: 100vw;
      overflow-x: hidden;
    }

    .kn-bp-official .hero{ padding: 56px 16px 38px; }
    .kn-bp-official .hero-badge{ max-width: 100%; padding: 5px 14px; font-size: 11px; letter-spacing: 2px; white-space: normal; }
    .kn-bp-official .hero h1{ font-size: 34px; line-height: 1.05; margin-bottom: 12px; }
    .kn-bp-official .hero h2{ max-width: 320px; margin: 0 auto; font-size: 15px; line-height: 1.5; }
    .kn-bp-official .hero-ver{ margin-top: 16px; font-size: 12px; }

    .kn-bp-official .container{ width: 100%; max-width: 100%; padding: 0 16px; }
    .kn-bp-official .page-layout, .kn-bp-official .main-content{ width: 100%; max-width: 100vw; overflow-x: hidden; }
    .kn-bp-official section{ padding: 42px 0; }
    .kn-bp-official h3{ font-size: 25px; line-height: 1.15; margin-bottom: 18px; }
    .kn-bp-official h4{ font-size: 16px; line-height: 1.35; margin: 28px 0 10px; }
    .kn-bp-official p, .kn-bp-official li{ font-size: 14px; }

    .kn-bp-official .toc{
      position: fixed;
      top: auto;
      right: 14px;
      bottom: calc(14px + env(safe-area-inset-bottom));
      left: auto;
      z-index: 150;
      width: 132px;
      max-width: calc(100vw - 28px);
      margin: 0;
      padding: 8px;
      max-height: 58px;
      overflow: hidden;
      border-radius: 14px;
      box-shadow: 0 16px 40px rgba(0,0,0,.45);
      transition: max-height .2s ease, width .2s ease, background .2s ease;
    }
    .kn-bp-official .toc.toc-open{
      width: min(340px, calc(100vw - 28px));
      max-height: min(72vh, 620px);
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }
    .kn-bp-official .toc-title{ display: none; }
    .kn-bp-official .toc-toggle{
      display: flex;
      width: 100%;
      min-height: 42px;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      border: 0;
      border-radius: 10px;
      padding: 0 10px;
      background: rgba(245,158,11,.12);
      color: var(--gold);
      font: inherit;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      cursor: pointer;
    }
    .kn-bp-official .toc-toggle::after{ content: "Open"; color: var(--text2); font-size: 10px; letter-spacing: 1px; }
    .kn-bp-official .toc.toc-open .toc-toggle{ margin-bottom: 8px; }
    .kn-bp-official .toc.toc-open .toc-toggle::after{ content: "Close"; }
    .kn-bp-official .toc:not(.toc-open) .toc-links{ display: none; }
    .kn-bp-official .toc-links > a{ display: flex; }
    .kn-bp-official .toc a{ gap: 6px; padding: 8px 0; font-size: 12px; }
    .kn-bp-official .toc .toc-phase{ min-width: 36px; }
    .kn-bp-official .toc .toc-subs{ padding-left: 42px; }
    .kn-bp-official .toc .toc-subs a{ font-size: 10px; line-height: 1.45; }
    .kn-bp-official .toc .toc-subs .toc-item{ padding-left: 0; }

    .kn-bp-official .arch{ margin: 32px auto; }
    .kn-bp-official .arch-left{ width: 78px; }
    .kn-bp-official .arch-right{ padding: 14px 0 28px 14px; }
    .kn-bp-official .arch-label{ font-size: 9px; letter-spacing: .5px; }
    .kn-bp-official .arch-right h4{ font-size: 15px; }
    .kn-bp-official .arch-right p{ font-size: 13px; }

    .kn-bp-official table{ display: block; max-width: 100%; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
    .kn-bp-official thead th, .kn-bp-official tbody td{ padding: 8px 9px; }
    .kn-bp-official pre, .kn-bp-official .fb, .kn-bp-official .seed-algo, .kn-bp-official .example-nft, .kn-bp-official .fusion-flow, .kn-bp-official .battle-scenario, .kn-bp-official .token-card, .kn-bp-official .vs-card, .kn-bp-official .char-showcase, .kn-bp-official .combat-panels, .kn-bp-official .pvp-flow{
      max-width: 100%;
    }
    .kn-bp-official pre{ padding: 14px; border-radius: 8px; font-size: 11px; line-height: 1.55; -webkit-overflow-scrolling: touch; }
    .kn-bp-official code{ word-break: break-word; }

    .kn-bp-official .fg, .kn-bp-official .fg-3col, .kn-bp-official .stat-cards, .kn-bp-official .bonus-grid, .kn-bp-official .salvage-cards, .kn-bp-official .p3-pillars, .kn-bp-official .token-cards, .kn-bp-official .fairness-grid, .kn-bp-official .counter-cards, .kn-bp-official .gameplay-cards, .kn-bp-official .stat-grid, .kn-bp-official .sec-grid{
      grid-template-columns: 1fr;
    }
    .kn-bp-official .fc, .kn-bp-official .stat-card, .kn-bp-official .bonus-card .bc-body, .kn-bp-official .s-card, .kn-bp-official .fair-card, .kn-bp-official .gm-card, .kn-bp-official .token-card, .kn-bp-official .strategy-callout, .kn-bp-official .p4-callout{
      padding: 14px;
    }
    .kn-bp-official .stat-card{ align-items: center; }
    .kn-bp-official .stat-card .sc-abbr{ width: 38px; height: 38px; }

    .kn-bp-official .example-nft{ padding: 16px; }
    .kn-bp-official .example-nft .stats{ grid-template-columns: 1fr 1fr !important; }
    .kn-bp-official .example-nft .stat{ padding: 8px; }
    .kn-bp-official .example-nft .stat .val{ font-size: 16px; overflow-wrap: anywhere; }

    .kn-bp-official .seed-algo .sa-header{ padding: 12px 14px; font-size: 11px; overflow-x: auto; }
    .kn-bp-official .seed-algo .sa-group-label{ padding: 8px 14px; }
    .kn-bp-official .seed-algo .sa-row{ padding: 8px 14px; gap: 8px; }
    .kn-bp-official .seed-algo .sa-attr{ min-width: 72px; }
    .kn-bp-official .seed-algo .sa-formula{ font-size: 11px; overflow-wrap: anywhere; }
    .kn-bp-official .seed-algo .sa-note{ margin-left: 0; }

    .kn-bp-official .enhance-row{ flex-direction: column; }
    .kn-bp-official .enhance-tier{ width: 100%; border-right: none; border-bottom: 1px solid var(--border); }
    .kn-bp-official .enhance-body{ grid-template-columns: 1fr 1fr; }
    .kn-bp-official .enhance-stat{ min-height: 66px; }

    .kn-bp-official .char-showcase .cs-header{ padding: 14px; align-items: flex-start; }
    .kn-bp-official .char-showcase .cs-stats{ grid-template-columns: repeat(2, 1fr); }
    .kn-bp-official .char-showcase .cs-stat{ padding: 12px 8px; }

    .kn-bp-official .vs-fighter, .kn-bp-official .bs-setup, .kn-bp-official .bs-col, .kn-bp-official .combat-panel, .kn-bp-official .pvp-step, .kn-bp-official .circ-col{ padding: 16px 14px; }
    .kn-bp-official .p4-divider, .kn-bp-official .p4-sub, .kn-bp-official .awaken-section{ gap: 8px; }
    .kn-bp-official .p4-divider span, .kn-bp-official .p4-sub span, .kn-bp-official .awaken-section{ letter-spacing: 1px; white-space: normal; }

    .kn-bp-official [style*="display:flex"]{ min-width: 0; }
    .kn-bp-official [style*="grid-template-columns:1fr 1fr"],
    .kn-bp-official [style*="grid-template-columns: 1fr 1fr"],
    .kn-bp-official [style*="grid-template-columns:repeat(3,.kn-bp-official 1fr)"],
    .kn-bp-official [style*="grid-template-columns: repeat(3,.kn-bp-official 1fr)"]{
      grid-template-columns: 1fr !important;
    }
  }