/* HW_CLAN_REFERENCE_V5. Isolated rebuilt layout; no game or server rules. */
#modePanel:has(.rf5-ui)>.mode-paper{width:calc(100% - 24px)!important;height:calc(100% - 24px)!important;max-width:1760px!important;max-height:1020px!important;min-width:0!important;min-height:0!important;padding:10px!important;box-sizing:border-box!important;overflow:hidden!important;container-type:size!important;background:linear-gradient(140deg,#ffe38b,#ffbd32 56%,#d88612)!important;border:3px solid #ffe6a1!important;box-shadow:inset 0 0 0 3px #bd6b12,0 4px 0 #8a4a10,0 12px 38px #160a07b0!important}
#modePanel:has(.rf5-ui)>.mode-paper>#modePanelClose{top:12px!important;right:12px!important;z-index:1000!important}
#modePanel #modePanelBody:has(>.rf5-ui){width:100%!important;height:100%!important;padding:0!important;min-height:0!important;overflow:hidden!important}
#modePanel #modePanelBody>.hwc-root.rf5-ui{--rf-brown:#612e0d;--rf-gold:#dc8611;display:grid!important;grid-template-rows:minmax(130px,18%) minmax(0,1fr)!important;gap:11px!important;height:100%!important;width:100%!important;overflow:hidden!important;padding:0!important;margin:0!important;min-width:0!important;min-height:0!important;transform:none!important;zoom:1!important;filter:none!important;background:transparent!important;font-family:'Trebuchet MS',Arial,sans-serif!important;color:var(--rf-brown)!important;container-type:size!important;container-name:hw-clan-screen!important}
#modePanel #modePanelBody .rf5-ui *{box-sizing:border-box}
#modePanel #modePanelBody .rf5-ui button{cursor:pointer;font:inherit}
#modePanel #modePanelBody .rf5-ui button:focus-visible,#modePanel #modePanelBody .rf5-ui [role=button]:focus-visible{outline:3px solid #20adf5!important;outline-offset:-3px!important}
#modePanel #modePanelBody .rf5-ui .rf5-header{display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,2.07fr);gap:11px;min-height:0;min-width:0;padding-bottom:3px}
#modePanel #modePanelBody .rf5-ui .rf5-identity,#modePanel #modePanelBody .rf5-ui .rf5-panel{position:relative;min-height:0;min-width:0;border:2px solid #d7810d;border-radius:20px;background:linear-gradient(155deg,#fff5c9,#ffe597 64%,#ffce62);box-shadow:inset 0 0 0 3px #fff4bf,0 4px 0 #a85c0e;overflow:hidden}
#modePanel #modePanelBody .rf5-ui .rf5-identity{display:flex;align-items:center;gap:12px;padding:10px 14px}
#modePanel #modePanelBody .rf5-ui .rf5-identity-crest{position:relative;width:clamp(72px,8cqw,115px)!important;height:clamp(72px,8cqw,115px)!important;flex:0 0 clamp(72px,8cqw,115px)!important;filter:drop-shadow(0 4px 4px #56270a44)}
#modePanel #modePanelBody .rf5-ui .rf5-identity-copy{flex:1;min-width:0}
#modePanel #modePanelBody .rf5-ui .rf5-identity h2{font-size:clamp(19px,1.66cqw,28px);font-weight:1000;margin:0;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#582600}
#modePanel #modePanelBody .rf5-ui .rf5-identity h2 small{font-size:.65em}
#modePanel #modePanelBody .rf5-ui .rf5-identity p{margin:5px 0 10px;font-size:clamp(12px,1cqw,16px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#modePanel #modePanelBody .rf5-ui .rf5-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
#modePanel #modePanelBody .rf5-ui .rf5-meta>span{display:inline-flex;align-items:center;gap:4px;background:#fff4cf;border-radius:13px;padding:5px 7px;white-space:nowrap;font-size:clamp(12px,1.15cqw,18px)}
#modePanel #modePanelBody .rf5-ui .rf5-meta img{width:24px;height:24px;object-fit:contain}
#modePanel #modePanelBody .rf5-ui .rf5-road{background:linear-gradient(150deg,#142337,#101726 64%,#122637);border:2px solid #637283;border-radius:19px;box-shadow:inset 0 0 0 1px #c5d5db40,0 4px 0 #805018;min-width:0;min-height:0;padding:5px 48px 3px 9px;overflow:hidden;display:flex;flex-direction:column}
#modePanel #modePanelBody .rf5-ui .rf5-road-title{display:flex;align-items:center;gap:15px;white-space:nowrap;min-height:26px;padding-left:8px}
#modePanel #modePanelBody .rf5-ui .rf5-road-title>b{font-size:clamp(19px,1.8cqw,29px);color:#ffdf53;font-weight:1000;text-shadow:0 2px 1px #000}
#modePanel #modePanelBody .rf5-ui .rf5-road-title>span{color:#65deed;font-size:clamp(10px,1.1cqw,17px);overflow:hidden;text-overflow:ellipsis}
#modePanel #modePanelBody .rf5-ui .rf5-road-rail{flex:1;min-height:0;display:flex;align-items:center;gap:2px}
#modePanel #modePanelBody .rf5-ui .rf5-road-items.l2-road-items{display:flex!important;position:relative!important;min-width:0!important;gap:2px!important;flex:1!important;align-items:stretch!important;height:100%!important;overflow-x:auto!important;scrollbar-width:none!important;scroll-behavior:smooth}
#modePanel #modePanelBody .rf5-ui .rf5-road-items::-webkit-scrollbar{display:none}
#modePanel #modePanelBody .rf5-ui .rf5-nav{width:19px!important;min-width:19px!important;height:37px;border:0;border-radius:8px;background:#ffffff0c;color:#e9bf59;font-size:28px;padding:0}
#modePanel #modePanelBody .rf5-ui .rf5-step{position:relative;display:flex;flex:1 0 83px;min-width:83px;flex-direction:column;justify-content:center;align-items:center;gap:1px;max-height:100%;border:0!important;background:none!important;padding:2px 5px 5px;box-shadow:none!important;color:#ebedf4;font-weight:1000}
#modePanel #modePanelBody .rf5-ui .rf5-step:not(:last-child)::after{content:'\203a';color:#ffd46b;font-size:24px;position:absolute;right:-6px;top:39%;text-shadow:0 0 6px #ffd36c77}
#modePanel #modePanelBody .rf5-ui .rf5-badge{display:block;object-fit:contain;background:transparent;border:0;box-shadow:none;flex:none}
#modePanel #modePanelBody .rf5-ui .rf5-step>.rf5-badge{height:clamp(67px,11.4cqh,111px);width:100%;max-width:105px;min-height:0;filter:drop-shadow(0 3px 2px #0008)}
#modePanel #modePanelBody .rf5-ui .rf5-step>b{display:block;font-size:clamp(10px,.88cqw,15px);line-height:1.1;white-space:nowrap;border-radius:10px;padding:4px 3px;max-width:100%;letter-spacing:-.25px}
#modePanel #modePanelBody .rf5-ui .rf5-step.is-current>.rf5-badge{filter:drop-shadow(0 0 8px #ffbb32) drop-shadow(0 3px 3px #0008)}
#modePanel #modePanelBody .rf5-ui .rf5-step.is-current>b{background:linear-gradient(#fffbe3,#ffd978);box-shadow:0 0 9px #ffc74c88;color:#653000}
#modePanel #modePanelBody .rf5-ui .rf5-step:hover>.rf5-badge{transform:translateY(-2px)}
#modePanel #modePanelBody .rf5-ui .rf5-main{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.04fr) minmax(0,1.10fr);gap:10px;min-height:0;min-width:0;padding-bottom:5px;overflow:hidden}
#modePanel #modePanelBody .rf5-ui .rf5-panel{display:flex;flex-direction:column}
#modePanel #modePanelBody .rf5-ui .rf5-tabs{display:flex;flex:none;gap:6px;min-height:50px;height:clamp(44px,6.5cqh,60px);padding:6px 6px 7px;background:linear-gradient(#fff5c8,#ffd268);border-bottom:1px solid #da9329}
#modePanel #modePanelBody .rf5-ui .rf5-tabs button{flex:1;min-width:0;border:2px solid #d78715;border-radius:14px;background:linear-gradient(#fff8d1,#ffdf7d);box-shadow:inset 0 0 0 2px #fff9df,0 3px 0 #9a520c;font-size:clamp(13px,1.18cqw,19px);font-weight:900;color:#74360e;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-tabs button.active{background:linear-gradient(#ffb924,#ff8705 68%,#f07400);color:white;box-shadow:inset 0 0 0 2px #ffe98c,0 4px 0 #994400;text-shadow:0 1px #a74500}
#modePanel #modePanelBody .rf5-ui .rf5-tabs button:hover{filter:brightness(1.04)}
#modePanel #modePanelBody .rf5-ui .rf5-roster{background-color:#ffdc77;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='110'%3E%3Cpath d='M29 74L20 36L44 50L65 24L85 50L109 36L100 74Z' fill='%23efb62f' opacity='.19'/%3E%3C/svg%3E"),linear-gradient(#fff0ac,#ffd153)}
#modePanel #modePanelBody .rf5-ui .rf5-roster-sub{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:15px 13px;color:#76400f;font-size:clamp(13px,1.2cqw,19px);font-weight:700;flex:none}
#modePanel #modePanelBody .rf5-ui .rf5-member-wrap.hwc-roster{min-height:0!important;min-width:0!important;flex:1 1 0!important;display:block!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;overflow:auto!important;scrollbar-width:thin}
#modePanel #modePanelBody .rf5-ui .rf5-member-wrap>.hwc-members{padding:7px 10px!important;overflow:visible!important;background:transparent!important;min-width:0!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member{display:grid!important;grid-template-columns:44px minmax(0,1fr) max-content 34px!important;grid-auto-flow:row!important;gap:7px!important;align-items:center!important;position:relative!important;min-width:0!important;min-height:74px!important;height:auto!important;padding:9px 8px!important;margin:0 0 9px!important;border:1px solid #a2c875!important;border-radius:13px!important;background:linear-gradient(110deg,#edffd8,#ccecdf)!important;box-shadow:0 2px 0 #d1ad44!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-player-profile-avatar{grid-column:1!important;grid-row:1!important;position:static!important;inset:auto!important;margin:0!important;padding:0!important;transform:none!important;width:42px!important;height:42px!important;min-width:42px!important;border:0!important;border-radius:50%!important;background:none!important;box-shadow:none!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-player-profile-avatar>img{width:42px!important;height:42px!important;display:block!important;object-fit:cover!important;border-radius:50%!important;border:2px solid #fff!important;box-shadow:0 1px 2px #15343c55}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-main{grid-column:2!important;grid-row:1!important;min-width:0!important;width:100%!important;padding:0!important;margin:0!important;position:static!important;height:auto!important;border:0!important;box-shadow:none!important;background:none!important;transform:none!important;overflow:hidden!important;text-align:left!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-topline{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:4px!important;flex-wrap:wrap!important;min-width:0!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-topline>b{font-size:clamp(14px,1.12cqw,18px)!important;min-width:0!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-topline small{font-size:11px!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-role-badge{font-size:9px!important;padding:2px 6px!important;max-width:100%!important;flex:none!important;white-space:nowrap!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-presence{font-size:12px!important;line-height:1.2!important;margin-top:4px!important;display:block!important;white-space:nowrap!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stats{grid-column:3!important;grid-row:1!important;justify-self:end!important;position:static!important;inset:auto!important;transform:none!important;display:flex!important;gap:6px!important;width:max-content!important;min-width:0!important;max-width:none!important;padding:0!important;margin:0!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stat{display:flex!important;align-items:center!important;gap:2px!important;padding:0!important;white-space:nowrap!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stat img{width:21px!important;height:21px!important;min-width:21px!important;object-fit:contain!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stat b{font-size:clamp(12px,1cqw,16px)!important;font-variant-numeric:tabular-nums!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-tools{grid-column:4!important;grid-row:1!important;position:static!important;inset:auto!important;transform:none!important;width:34px!important;min-width:34px!important;margin:0!important;display:flex!important;flex-direction:column!important;gap:3px!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-tools button{width:34px!important;height:34px!important;min-width:34px!important;font-size:18px!important;padding:0!important;margin:0!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-menu{grid-column:1/-1!important;grid-row:auto!important;position:relative!important;inset:auto!important;min-width:0!important;width:100%!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-menu button{white-space:normal!important;min-height:32px!important}
#modePanel #modePanelBody .rf5-ui .rf5-roster-foot{flex:none;padding:9px 12px 12px}
#modePanel #modePanelBody .rf5-ui .rf5-invite{display:flex;justify-content:center;align-items:center;gap:13px;width:100%;height:clamp(49px,7cqh,68px);background:linear-gradient(#69eb24,#1cbd07 55%,#079b06);border:3px solid #309216;border-radius:17px;color:white;font-size:clamp(13px,1.2cqw,20px);font-weight:1000;box-shadow:inset 0 0 0 2px #d5ffae,0 4px 0 #196614;text-shadow:0 2px #137c0c}
#modePanel #modePanelBody .rf5-ui .rf5-invite>b{font-size:38px;line-height:1}
#modePanel #modePanelBody .rf5-ui .rf5-invite>span{font-size:26px;color:#bfffa1}
#modePanel #modePanelBody .rf5-ui .rf5-invite-box input{width:100%;font-size:13px!important}
#modePanel #modePanelBody .rf5-ui .rf5-invite-box button{padding:8px!important;font-size:12px!important}
#modePanel #modePanelBody .rf5-ui .rf5-center-content.l2-center-content{min-height:0!important;flex:1 1 0!important;overflow:auto!important;overscroll-behavior:contain;scrollbar-width:thin;padding:0!important;container-type:normal!important}
#modePanel #modePanelBody .rf5-ui .rf5-battle{display:grid;grid-template-rows:minmax(235px,1fr) clamp(54px,7cqh,71px) clamp(163px,21cqh,204px);height:100%;min-height:480px;overflow:hidden;background:#ffdc86}
#modePanel #modePanelBody .rf5-ui .rf5-field{position:relative;min-height:0;overflow:hidden;background:#589fe0 url('/assets/clan-reference-v5/arena.webp') center bottom/cover no-repeat}
#modePanel #modePanelBody .rf5-ui .rf5-field::before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(#0057b99c,transparent 35%,transparent 73%,#391c0f55)}
#modePanel #modePanelBody .rf5-ui .rf5-field-title{position:relative;z-index:2;text-align:center;padding:8px 10px 0;color:#fff;text-shadow:0 2px 2px #0f4f89}
#modePanel #modePanelBody .rf5-ui .rf5-field-title h3{display:flex;align-items:center;justify-content:center;gap:6px;font-size:clamp(20px,1.85cqw,30px);line-height:1.1;margin:0 0 5px;color:#ffe965;font-weight:1000}
#modePanel #modePanelBody .rf5-ui .rf5-field-title h3 img{width:42px;height:42px;object-fit:contain}
#modePanel #modePanelBody .rf5-ui .rf5-field-title>b{font-size:clamp(15px,1.18cqw,20px);font-weight:900}
#modePanel #modePanelBody .rf5-ui .rf5-field-title>p{font-size:clamp(11px,.87cqw,14px);margin:4px 0 0}
#modePanel #modePanelBody .rf5-ui .rf5-field-league{position:absolute;left:50%;transform:translateX(-50%);top:24%;width:clamp(88px,7.5cqw,122px);height:clamp(96px,14cqh,134px);z-index:1;filter:drop-shadow(0 4px 4px #14294188)}
#modePanel #modePanelBody .rf5-ui .rf5-pair{position:absolute;bottom:3px;left:12px;right:12px;display:flex;justify-content:space-between;gap:30px;z-index:3}
#modePanel #modePanelBody .rf5-ui .rf5-side{position:relative;width:43%;min-width:0;text-align:center;background:linear-gradient(#1c334bf0,#101c2aef);color:#fff5c6;border:1px solid #6c8ea7;border-radius:11px;box-shadow:0 3px 1px #162b3e77;padding:15px 7px 7px}
#modePanel #modePanelBody .rf5-ui .rf5-duel-crest{position:absolute!important;top:-48px!important;left:50%!important;transform:translateX(-50%)!important;width:70px!important;height:70px!important;min-width:70px!important;filter:drop-shadow(0 3px 3px #121111aa);z-index:1}
#modePanel #modePanelBody .rf5-ui .rf5-side-copy>strong{display:block;font-size:clamp(16px,1.18cqw,21px);line-height:1.15;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-side-copy>small{display:block;font-size:clamp(11px,.9cqw,15px);color:#fffcdf;margin:3px 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-kills{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;font-size:clamp(12px,1cqw,17px);font-weight:700;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-kills img{width:26px;height:26px;object-fit:contain}
#modePanel #modePanelBody .rf5-ui .rf5-kills>b{font-size:clamp(19px,1.8cqw,29px);font-variant-numeric:tabular-nums;color:#72fa23;overflow:hidden;text-overflow:ellipsis}
#modePanel #modePanelBody .rf5-ui .rf5-side.opponent .rf5-kills>b{color:#ff7243}
#modePanel #modePanelBody .rf5-ui .rf5-question{display:grid!important;place-items:center!important;background:#243747;border:2px solid #b4cad2;border-radius:50%;font-size:30px;color:white}
#modePanel #modePanelBody .rf5-ui .rf5-reset{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:2px 8px 3px;padding:4px;border:2px solid #b16c20;border-radius:13px;background:linear-gradient(115deg,#ffedb9,#fff4d1 55%,#ffd779);box-shadow:inset 0 0 0 2px #fff8d1,0 3px #9b5718;color:#633407}
#modePanel #modePanelBody .rf5-ui .rf5-reset::before,#modePanel #modePanelBody .rf5-ui .rf5-reset::after{content:'';position:absolute;top:7px;width:6px;height:6px;border:1px solid #a65f17;border-radius:50%;background:#ffd36e}
#modePanel #modePanelBody .rf5-ui .rf5-reset::before{left:7px}#modePanel #modePanelBody .rf5-ui .rf5-reset::after{right:7px}
#modePanel #modePanelBody .rf5-ui .rf5-reset>span{font-size:clamp(13px,1.1cqw,18px);line-height:1.2;font-weight:800}
#modePanel #modePanelBody .rf5-ui .rf5-reset>strong{font-size:clamp(22px,2.1cqw,34px);line-height:1.15;font-variant-numeric:tabular-nums}
#modePanel #modePanelBody .rf5-ui .rf5-chests{display:flex;min-height:0;flex-direction:column;padding:7px 8px 5px;border-top:1px solid #d39936;background:linear-gradient(#fff5c9,#ffecb1)}
#modePanel #modePanelBody .rf5-ui .rf5-chests h4{flex:none;text-align:center;margin:0 0 5px;color:#168622;font-size:clamp(11px,.92cqw,15px);line-height:1.1;font-weight:1000}
#modePanel #modePanelBody .rf5-ui .rf5-chest-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
#modePanel #modePanelBody .rf5-ui .rf5-chest{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:0;border-radius:12px;padding:4px;background:linear-gradient(135deg,#fff3c955,#ffe28b55)}
#modePanel #modePanelBody .rf5-ui .rf5-chest>b{font-size:clamp(12px,1cqw,17px);line-height:1;flex:none;white-space:nowrap;color:#332107}
#modePanel #modePanelBody .rf5-ui .rf5-chest-img{width:100%;height:calc(100% - 40px);min-height:50px;max-height:125px;object-fit:contain;flex:1;filter:drop-shadow(0 3px 2px #8d5a2555)}
#modePanel #modePanelBody .rf5-ui .rf5-chest.small .rf5-chest-img{width:86%}
#modePanel #modePanelBody .rf5-ui .rf5-chest.medium .rf5-chest-img{width:93%}
#modePanel #modePanelBody .rf5-ui .rf5-rating{font-size:clamp(14px,1.1cqw,18px);color:#6640aa;font-weight:900;flex:none;display:flex;align-items:center;gap:3px;height:22px}
#modePanel #modePanelBody .rf5-ui .rf5-rating>img{width:20px;height:20px;object-fit:contain}
#modePanel #modePanelBody .rf5-ui .rf5-loss{display:flex;align-items:center;justify-content:center;gap:5px;flex:none;margin:4px 0 0;font-size:clamp(9px,.7cqw,12px);line-height:1.1;color:#744511;text-align:center}
#modePanel #modePanelBody .rf5-ui .rf5-loss>span{display:inline-grid;place-items:center;width:20px;height:20px;flex:none;border-radius:50%;background:#ff900f;color:white;border:1px solid white;font-weight:1000;font-size:17px}
#modePanel #modePanelBody .rf5-ui .rf5-board{padding:9px 10px 10px;background:linear-gradient(#fff3c0,#ffe7a1)}
#modePanel #modePanelBody .rf5-ui .rf5-board-head{display:flex;align-items:center;gap:12px;position:relative;flex:0 0 clamp(111px,14cqh,138px);padding:0 3px 8px;min-width:0}
#modePanel #modePanelBody .rf5-ui .rf5-board-head>.rf5-badge{width:clamp(72px,6.8cqw,106px);height:clamp(88px,12cqh,118px);filter:drop-shadow(0 3px 3px #71451944)}
#modePanel #modePanelBody .rf5-ui .rf5-board-title{flex:1;min-width:0}
#modePanel #modePanelBody .rf5-ui .rf5-board-title h3{padding-right:20px;margin:0 0 8px;color:#5d2b06;font-size:clamp(18px,1.5cqw,25px);font-weight:1000;line-height:1.1}
#modePanel #modePanelBody .rf5-ui .rf5-board-title>p{display:flex;justify-content:space-between;gap:8px;margin:0 6px 7px 0;font-size:clamp(11px,.98cqw,16px)}
#modePanel #modePanelBody .rf5-ui .rf5-board-title>p span:last-child{font-size:.8em}
#modePanel #modePanelBody .rf5-ui .rf5-season-time{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;border-radius:13px;background:#fff8dd;padding:4px 9px}
#modePanel #modePanelBody .rf5-ui .rf5-season-time small{font-size:clamp(9px,.72cqw,12px)}
#modePanel #modePanelBody .rf5-ui .rf5-season-time strong{font-size:clamp(16px,1.3cqw,22px);font-variant-numeric:tabular-nums;color:#153764;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-info{position:absolute;right:1px;top:0;width:32px;height:38px;display:grid;place-items:center;padding:0;border:2px solid #e7ffff;border-radius:10px;background:linear-gradient(#29e0ff,#0079d4);color:#fff;font-family:Arial;font-size:27px;font-weight:1000;box-shadow:0 3px #126ca4}
#modePanel #modePanelBody .rf5-ui .rf5-board-scroll.l2-board-scroll{flex:1!important;min-height:0!important;overflow:auto!important;padding:0!important;margin:0!important;scrollbar-width:thin;overscroll-behavior:contain}
#modePanel #modePanelBody .rf5-ui .rf5-zone{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:clamp(62px,8cqh,83px);padding:7px 8px;border-radius:14px 14px 0 0;margin-top:6px;background:#119c11;color:white;border:1px solid #83e157;box-shadow:inset 0 2px #b7ff6a88}
#modePanel #modePanelBody .rf5-ui .rf5-zone.stay{background:linear-gradient(#d5f0ff,#aecbef);color:#0e356c;border:1px solid #98caff;box-shadow:inset 0 2px #fff9}
#modePanel #modePanelBody .rf5-ui .rf5-zone.relegate{background:linear-gradient(#ffc0b9,#ffcbbd);color:#a10d1c;border:1px solid #ed988c;box-shadow:inset 0 2px #ffffff55}
#modePanel #modePanelBody .rf5-ui .rf5-zone-title{min-width:0;flex:1}
#modePanel #modePanelBody .rf5-ui .rf5-zone-title>b{display:flex;align-items:center;gap:5px;font-weight:1000;font-size:clamp(13px,1.12cqw,19px);line-height:1.15}
#modePanel #modePanelBody .rf5-ui .rf5-zone-title i{font-style:normal;font-size:21px}
#modePanel #modePanelBody .rf5-ui .rf5-zone-title>small{display:block;font-size:clamp(10px,.8cqw,13px);margin:4px 0 0 23px;line-height:1.15}
#modePanel #modePanelBody .rf5-ui .rf5-zone-award{min-width:0;flex:0 0 auto;text-align:center;border-radius:10px;background:#fff4;border:1px solid #fffffa66;overflow:hidden}
#modePanel #modePanelBody .rf5-ui .rf5-zone-award>small{display:block;font-size:clamp(8px,.63cqw,11px);font-weight:900;white-space:nowrap;padding:3px 4px}
#modePanel #modePanelBody .rf5-ui .rf5-zone.stay .rf5-zone-award>small{background:#2369c8;color:white}
#modePanel #modePanelBody .rf5-ui .rf5-rewards{display:flex;align-items:center;justify-content:center;gap:0;background:#fff5d3;border-radius:6px;color:#512703;padding:3px}
#modePanel #modePanelBody .rf5-ui .rf5-rewards>span{display:inline-flex;align-items:center;gap:3px;padding:1px 4px;white-space:nowrap;font-size:clamp(13px,1.1cqw,19px);font-weight:900}
#modePanel #modePanelBody .rf5-ui .rf5-rewards>span+span{border-left:1px solid #d6b77b}
#modePanel #modePanelBody .rf5-ui .rf5-rewards img{width:clamp(21px,1.7cqw,29px);height:clamp(21px,1.7cqw,29px);object-fit:contain}
#modePanel #modePanelBody .rf5-ui .rf5-no-prize{display:block;font-size:clamp(11px,.96cqw,16px);padding:6px 14px;white-space:nowrap;color:#1e5792;background:#e8f4ff}
#modePanel #modePanelBody .rf5-ui .rf5-zone.relegate .rf5-no-prize{color:#a11613;background:transparent}
#modePanel #modePanelBody .rf5-ui .rf5-table-head{display:grid;grid-template-columns:26px minmax(0,1fr) 72px 121px;gap:5px;padding:8px 10px;background:#ffe399;font-size:clamp(10px,.83cqw,14px);font-weight:900}
#modePanel #modePanelBody .rf5-ui .rf5-table-head span:last-child{text-align:center}
#modePanel #modePanelBody .rf5-ui .rf5-rank-row{position:relative;display:grid;grid-template-columns:23px 45px minmax(0,1fr) 60px minmax(45px,max-content) 40px;gap:5px;align-items:center;min-width:0;min-height:clamp(54px,7.4cqh,75px);padding:4px 7px;background:linear-gradient(#fff8db,#ffeebb);border:1px solid #e9bd64;border-top:0;border-radius:0 0 7px 7px;cursor:pointer;color:#612900}
#modePanel #modePanelBody .rf5-ui .rf5-rank-row.stay{background:linear-gradient(#fff6e4,#e8eef1)}
#modePanel #modePanelBody .rf5-ui .rf5-rank-row.relegate{background:linear-gradient(#ffece3,#ffcfc5)}
#modePanel #modePanelBody .rf5-ui .rf5-rank-row.is-mine{background:linear-gradient(#fff1fb,#f0ddff);border:2px solid #c574fb;border-radius:13px;color:#6b238e}
#modePanel #modePanelBody .rf5-ui .rf5-rank{font-size:clamp(14px,1.1cqw,18px);text-align:center}
#modePanel #modePanelBody .rf5-ui .rf5-row-crest{display:block;position:relative;width:45px!important;height:45px!important;min-width:45px!important;filter:drop-shadow(0 2px 2px #6d420c44)}
#modePanel #modePanelBody .rf5-ui .rf5-row-name{min-width:0}
#modePanel #modePanelBody .rf5-ui .rf5-row-name>b{display:block;font-size:clamp(14px,1.1cqw,19px);font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-row-name>small{display:block;margin-top:3px;font-size:clamp(9px,.72cqw,12px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#modePanel #modePanelBody .rf5-ui .rf5-row-members{font-size:clamp(12px,1cqw,17px);text-align:center;white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-row-kills{font-size:clamp(15px,1.3cqw,22px);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:0}
#modePanel #modePanelBody .rf5-ui .rf5-mine{font-size:clamp(9px,.75cqw,12px);font-weight:900;text-align:center;color:white}
#modePanel #modePanelBody .rf5-ui .rf5-mine:not(:empty){background:linear-gradient(#b256ff,#7f1ce1);border:1px solid #d1b1ff;border-radius:11px;box-shadow:inset 0 1px 2px white,0 3px #56149a;padding:8px 4px}
#modePanel #modePanelBody .rf5-ui .rf5-rank-row:hover{filter:brightness(1.02)}
#modePanel #modePanelBody .rf5-ui .rf5-first-league{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 9px;margin-top:9px;min-height:49px;border-radius:14px;background:linear-gradient(#ffcfbf,#ffc0b6);color:#a11c1c}
#modePanel #modePanelBody .rf5-ui .rf5-first-league>b{font-size:clamp(12px,1cqw,17px);white-space:nowrap}
#modePanel #modePanelBody .rf5-ui .rf5-first-league>span{font-size:clamp(9px,.7cqw,12px);line-height:1.2}
#modePanel #modePanelBody .rf5-ui .rf5-first-league>strong{font-size:24px}
#modePanel #modePanelBody .rf5-ui .rf5-note{display:flex;gap:8px;align-items:flex-start;border:1px solid #ecbe63;border-radius:12px;background:#fff5d5;margin-top:9px;padding:10px 8px;line-height:1.3}
#modePanel #modePanelBody .rf5-ui .rf5-note>b{display:grid;place-items:center;background:linear-gradient(#64eaff,#0093ed);border:1px solid #fff;width:26px;height:26px;border-radius:50%;color:white;font-size:21px;font-family:Arial;flex:none}
#modePanel #modePanelBody .rf5-ui .rf5-note>p{font-size:clamp(11px,.87cqw,15px);margin:0}
#modePanel #modePanelBody .rf5-ui .rf5-empty{padding:30px 16px;margin:auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:17px}
#modePanel #modePanelBody .rf5-ui .rf5-empty img{width:100px;height:115px}
#modePanel #modePanelBody .rf5-ui .rf5-empty-zone{padding:12px;background:#fff0b9;font-size:12px}
#modePanel #modePanelBody .rf5-ui .rf5-help{padding:16px;font-size:15px;line-height:1.4}
#modePanel #modePanelBody .rf5-ui .rf5-help-row{display:grid;grid-template-columns:55px 1fr;gap:7px;padding:10px;border:1px solid #dfaf50;border-radius:12px;margin:6px 0;background:#fff5d2;align-items:center}
#modePanel #modePanelBody .rf5-ui .rf5-help-row>.rf5-badge{width:55px;height:65px}
#modePanel #modePanelBody .rf5-ui .rf5-help-row>div{grid-column:2}
#modePanel #modePanelBody .rf5-ui .rf5-help-row small{font-size:11px}
#modePanel #modePanelBody .rf5-ui .rf5-help button{background:#ffcf65;border:1px solid #cd8b1b;border-radius:9px;padding:10px}
#modePanel #modePanelBody .rf5-ui .rf5-center-content .hwc-info{min-height:0!important;height:auto!important;overflow:visible!important;padding:12px!important;font-size:14px!important}
#modePanel #modePanelBody .rf5-ui .rf5-center-content .hwc-info h3{font-size:19px!important}
#modePanel #modePanelBody .rf5-ui .rf5-center-content .hwc-info .hwc-form-row{display:flex!important;flex-wrap:wrap!important}
#modePanel #modePanelBody .rf5-ui .rf5-center-content .hwc-info .hwc-form-row label{flex:1!important;min-width:90px!important}
@container hw-clan-screen (max-width:1200px){
 #modePanel #modePanelBody .rf5-ui .rf5-road-title>span{display:none}
 #modePanel #modePanelBody .rf5-ui .rf5-header{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
 #modePanel #modePanelBody .rf5-ui .rf5-main{grid-template-columns:minmax(0,.85fr) minmax(0,1.02fr) minmax(0,1.13fr)}
 #modePanel #modePanelBody .rf5-ui .rf5-identity{padding:9px;gap:7px}
 #modePanel #modePanelBody .rf5-ui .rf5-identity-crest{width:68px!important;height:68px!important;flex-basis:68px!important}
 #modePanel #modePanelBody .rf5-ui .rf5-meta>span{font-size:11px;padding:3px 4px}
 #modePanel #modePanelBody .rf5-ui .rf5-meta img{width:17px;height:17px}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member{grid-template-columns:38px minmax(0,1fr) 32px!important}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-player-profile-avatar{grid-row:1/3!important}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stats{grid-column:2!important;grid-row:2!important;justify-self:start!important}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-tools{grid-column:3!important;grid-row:1/3!important}
 #modePanel #modePanelBody .rf5-ui .rf5-zone{flex-wrap:wrap}
 #modePanel #modePanelBody .rf5-ui .rf5-zone-award{margin-left:auto}
 #modePanel #modePanelBody .rf5-ui .rf5-rank-row{grid-template-columns:20px 38px minmax(0,1fr) 40px minmax(30px,max-content) 32px;gap:3px}
 #modePanel #modePanelBody .rf5-ui .rf5-row-crest{width:36px!important;height:36px!important;min-width:36px!important}
 #modePanel #modePanelBody .rf5-ui .rf5-table-head{grid-template-columns:23px minmax(0,1fr) 51px 90px;padding-left:6px;font-size:10px}
 #modePanel #modePanelBody .rf5-ui .rf5-board-head{gap:5px}
 #modePanel #modePanelBody .rf5-ui .rf5-board-head>.rf5-badge{width:62px;height:83px}
 #modePanel #modePanelBody .rf5-ui .rf5-board-title h3{font-size:17px}
 #modePanel #modePanelBody .rf5-ui .rf5-invite>span{display:none}
}
@container hw-clan-screen (max-height:680px){
 #modePanel #modePanelBody .rf5-ui .rf5-battle{min-height:430px;grid-template-rows:minmax(205px,1fr) 54px 162px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-title h3{font-size:22px;margin-bottom:2px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-title h3 img{width:30px;height:30px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-title>b{font-size:14px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-title>p{font-size:10px;margin:2px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-league{top:27%;height:81px;width:78px}
 #modePanel #modePanelBody .rf5-ui .rf5-duel-crest{width:51px!important;height:51px!important;min-width:51px!important;top:-36px!important}
 #modePanel #modePanelBody .rf5-ui .rf5-side{padding:12px 5px 4px}
 #modePanel #modePanelBody .rf5-ui .rf5-side-copy>strong{font-size:15px}
 #modePanel #modePanelBody .rf5-ui .rf5-side-copy>small{font-size:10px;margin:2px}
 #modePanel #modePanelBody .rf5-ui .rf5-kills{font-size:11px;gap:3px}
 #modePanel #modePanelBody .rf5-ui .rf5-kills>b{font-size:19px}
 #modePanel #modePanelBody .rf5-ui .rf5-kills img{width:21px;height:21px}
 #modePanel #modePanelBody .rf5-ui .rf5-note>p{font-size:11px}
 #modePanel #modePanelBody .rf5-ui .rf5-note{padding:7px}
}
@container hw-clan-screen (max-width:850px){
 #modePanel #modePanelBody .rf5-ui .rf5-header{grid-template-columns:1fr}
 #modePanel #modePanelBody .rf5-ui .rf5-identity{display:none}
 #modePanel #modePanelBody .rf5-ui .rf5-main{display:flex;flex-direction:column;overflow:auto;gap:10px}
 #modePanel #modePanelBody .rf5-ui .rf5-roster{min-height:220px;max-height:330px;flex:none}
 #modePanel #modePanelBody .rf5-ui .rf5-center{min-height:690px;flex:none}
 #modePanel #modePanelBody .rf5-ui .rf5-board{min-height:620px;flex:none}
 #modePanel #modePanelBody .rf5-ui .rf5-field-title h3{font-size:25px}
 #modePanel #modePanelBody .rf5-ui .rf5-field-league{height:105px;width:100px}
 #modePanel #modePanelBody .rf5-ui .rf5-chests h4{font-size:13px}
 #modePanel #modePanelBody .rf5-ui .rf5-step{flex-basis:80px}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member{grid-template-columns:42px minmax(0,1fr) max-content 34px!important}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-stats{grid-column:3!important;grid-row:1!important;justify-self:end!important}
 #modePanel #modePanelBody .rf5-ui .rf5-roster .hwc-member-tools{grid-column:4!important;grid-row:1!important}
}
@media(prefers-reduced-motion:reduce){#modePanel #modePanelBody .rf5-ui *{scroll-behavior:auto!important;transition:none!important}}

/* Final composition pass: one continuous arena, no repeated castle horizon. */
#modePanel #modePanelBody .rf5-ui .rf5-step{justify-content:space-between;padding-top:2px;padding-bottom:3px}
#modePanel #modePanelBody .rf5-ui .rf5-step>.rf5-badge{height:calc(100% - 27px);max-height:102px;flex:1 1 auto;min-height:0}
#modePanel #modePanelBody .rf5-ui .rf5-step>b{flex:none;font-size:clamp(10px,.86cqw,14px)}
#modePanel #modePanelBody .rf5-ui .rf5-field{background:linear-gradient(#329ce5,#785144)}
#modePanel #modePanelBody .rf5-ui .rf5-field::before{inset:0 0 60px;background:linear-gradient(#1268b478,transparent 33%),url('/assets/clan-reference-v5/arena-plain.webp') center/cover no-repeat}
#modePanel #modePanelBody .rf5-ui .rf5-side{background:linear-gradient(#24394a,#121e2a)}
#modePanel #modePanelBody .rf5-ui .rf5-kills>b{min-width:0}

/* HW_CLAN_ARENA_BALLS_V6_BEGIN */
/* V6: one complete arena image. No extra center league badge or CSS/SVG VS overlay. */
#modePanel #modePanelBody .rf5-ui .rf5-field{
  background-color:#6ab7ef !important;
  background-image:url('/assets/clan-reference-v5/arena-battle-v6.png') !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center center !important;
}
#modePanel #modePanelBody .rf5-ui .rf5-field::before{
  content:'' !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:linear-gradient(180deg,rgba(1,56,119,.18) 0%,rgba(1,56,119,0) 31%,rgba(61,20,0,0) 78%,rgba(61,20,0,.10) 100%) !important;
}
/* The league icon already exists in the league road and the right board. */
#modePanel #modePanelBody .rf5-ui .rf5-field-league{
  display:none !important;
  visibility:hidden !important;
}
/* Kill every VS overlay from older patches. VS is already baked into arena-battle-v6.png. */
#modePanel #modePanelBody .rf5-ui .rf5-field::after{
  content:none !important;
  display:none !important;
  background:none !important;
  filter:none !important;
}
#modePanel #modePanelBody .rf5-ui .rf5-field-title{
  z-index:7 !important;
}
#modePanel #modePanelBody .rf5-ui .rf5-pair{
  z-index:8 !important;
}
@media(max-width:1100px){
  #modePanel #modePanelBody .rf5-ui .rf5-field{
    background-position:center center !important;
  }
}
@media(max-width:760px){
  #modePanel #modePanelBody .rf5-ui .rf5-field{
    background-position:center center !important;
  }
}
/* HW_CLAN_ARENA_BALLS_V6_END */

/* HW_CLAN_DAILY_BATTLE_V1 */
#modePanel #modePanelBody .rf5-match-claim{padding:8px 12px 10px!important}
#modePanel #modePanelBody .rf5-match-claim>h4{margin:0 0 5px!important;color:#208326!important;font-size:14px!important}
#modePanel #modePanelBody .rf5-match-won{display:flex!important;align-items:center!important;justify-content:center!important;gap:14px!important;min-height:118px!important;padding:6px 12px!important;border:2px solid #d49313!important;border-radius:15px!important;background:linear-gradient(180deg,#fff8d1,#ffd45e)!important;box-shadow:inset 0 1px #fff,0 4px 0 #b8730b55!important}
#modePanel #modePanelBody .rf5-match-won>img{width:118px!important;height:92px!important;object-fit:contain!important;filter:drop-shadow(0 7px 4px #74400b55)!important}
#modePanel #modePanelBody .rf5-match-won>div{display:flex!important;flex-direction:column!important;align-items:center!important;gap:2px!important;color:#633606!important;text-align:center!important}
#modePanel #modePanelBody .rf5-match-won b{font-size:15px!important}
#modePanel #modePanelBody .rf5-match-won span{font-size:14px!important;font-weight:1000!important}
#modePanel #modePanelBody .rf5-match-won small{font-size:10px!important;font-weight:900!important}
#modePanel #modePanelBody .rf5-match-won button{margin-top:5px!important;min-width:170px!important;height:32px!important;border:2px solid #177517!important;border-radius:10px!important;background:linear-gradient(#5ddf2b,#22a415)!important;color:white!important;font:1000 12px Arial,sans-serif!important;box-shadow:inset 0 1px #b6ff92,0 3px 0 #126812!important;cursor:pointer!important}
#modePanel #modePanelBody .rf5-match-won button:disabled{filter:grayscale(.5)!important;opacity:.7!important}
#modePanel #modePanelBody .rf5-match-hint{margin:5px 0 0!important;text-align:center!important;font-size:9px!important;color:#87520f!important;font-weight:800!important}

/* HW_CLAN_MEMBER_CHEST_ZONES_V1 */
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-large{
  background:linear-gradient(90deg,#f0d9ff 0%,#f9e7ff 48%,#fff0bd 100%)!important;
  border-color:#a346dc!important;
  box-shadow:inset 5px 0 0 #8b2fd1,0 2px 0 rgba(112,42,154,.18)!important;
}
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-medium{
  background:linear-gradient(90deg,#d9f3ff 0%,#d9e9ff 55%,#f6f3cf 100%)!important;
  border-color:#318bd2!important;
  box-shadow:inset 5px 0 0 #247dcc,0 2px 0 rgba(34,112,178,.18)!important;
}
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-small{
  background:linear-gradient(90deg,#ffe1cf 0%,#ffebc8 55%,#fff5c9 100%)!important;
  border-color:#e4772d!important;
  box-shadow:inset 5px 0 0 #d85b22,0 2px 0 rgba(174,79,24,.18)!important;
}
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-large.me{outline:2px solid #8e2fd4!important;outline-offset:1px!important}
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-medium.me{outline:2px solid #287ed0!important;outline-offset:1px!important}
#modePanel #modePanelBody .rf5-ui .hwc-member.chest-small.me{outline:2px solid #d96223!important;outline-offset:1px!important}