.brand{display:inline-flex;align-items:center;flex-wrap:nowrap;gap:7px;min-width:0;white-space:nowrap}
.brand .kickflip-mark-logo{display:block;flex:0 0 auto;width:52px;height:44px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(17,17,17,.09))}
.brand .kickflip-brand-name{display:inline-flex;align-items:baseline;font-size:22px;font-weight:950;font-style:italic;letter-spacing:-.045em;line-height:1;color:#111}
.brand .kickflip-brand-name>span{display:inline-block}
.brand .kickflip-brand-i{position:relative}
.brand .kickflip-brand-i>img{position:absolute;z-index:1;left:58%;top:-.46em;width:.72em;height:.72em;object-fit:contain;transform:translateX(-50%) rotate(7deg);transform-origin:50% 100%;filter:drop-shadow(0 2px 2px rgba(17,17,17,.16));pointer-events:none}
.kickflip-section-identity{display:flex;align-items:center;gap:14px}
.kickflip-section-identity>img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 5px 10px rgba(17,17,17,.1))}
.kickflip-section-identity .eyebrow{margin-top:0}
.production-signature{display:flex;align-items:center;justify-content:flex-end;gap:11px;text-align:right;min-width:max-content}
.production-signature img{width:54px;height:52px;object-fit:cover;border-radius:10px;box-shadow:0 5px 14px rgba(17,17,17,.14);flex:0 0 auto}
.production-signature>span{display:flex;align-items:center;gap:10px;white-space:nowrap;min-width:max-content}
.production-signature small{display:inline-block;color:#777;font-size:10px;font-weight:850;letter-spacing:.12em;white-space:nowrap}
.footer-left{display:grid;gap:8px;min-width:0}
.footer-policy-links{display:flex;flex-wrap:wrap;gap:6px 12px}
.footer-policy-links a{color:#666;font-size:10px;font-weight:800;text-decoration:none}
.footer-policy-links a:hover,.footer-policy-links a:focus-visible{color:#111;text-decoration:underline;text-underline-offset:3px}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden}

/* Account panels must stay above every customer interaction layer. This prevents
   transparent fixed UI from swallowing taps while the account menu is open. */
.account-panel:not([hidden]){z-index:5000!important;pointer-events:auto!important;touch-action:pan-y;isolation:isolate}
.account-panel:not([hidden]) *{pointer-events:auto}

@media(min-width:901px){
  .topbar{display:flex!important;align-items:center;gap:clamp(14px,1.8vw,28px)}
  .topbar .brand{flex:0 0 auto;max-width:none;position:relative;z-index:2}
  .topbar .nav{display:flex;flex:1 1 auto;justify-content:center;min-width:0;gap:clamp(10px,1.25vw,20px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
  .topbar .nav::-webkit-scrollbar{display:none}
  .topbar .nav a{flex:0 0 auto;white-space:nowrap;font-size:clamp(10px,.82vw,12px)}
  .topbar .top-actions{flex:0 0 auto;margin-left:auto;justify-self:auto}
}

@media(min-width:901px) and (max-width:1180px){
  .topbar{gap:12px}
  .brand{gap:5px}
  .brand .kickflip-mark-logo{width:42px;height:36px}
  .brand .kickflip-brand-name{font-size:17px}
  .topbar .nav{justify-content:flex-start;gap:11px}
  .topbar .nav a{font-size:10px}
  .topbar .profile-btn{display:inline-flex;align-items:center;justify-content:center;min-width:36px;width:36px;height:36px;padding:0;border-radius:999px;font-size:0}
  .topbar .profile-btn::before{content:'👤';font-size:17px;line-height:1}
}

@media(max-width:900px){
  .preview-banner{display:flex;align-items:center;justify-content:center;min-height:29px;max-height:29px;padding:0 10px;overflow:hidden;white-space:nowrap}
  .topbar{display:flex!important;align-items:center;justify-content:space-between;gap:10px;min-height:60px;padding:10px 0!important}
  .topbar .nav{display:none!important}
  .topbar .brand{flex:0 1 auto;max-width:calc(100% - 96px);overflow:visible}
  .topbar .top-actions{display:flex;flex:0 0 auto;grid-column:auto;grid-row:auto;min-width:82px;gap:6px}
  .topbar .mode-badge{display:none!important}
  .topbar .profile-btn{display:inline-flex!important;align-items:center;justify-content:center;min-width:36px;width:36px;height:36px;padding:0;border-radius:999px;font-size:0}
  .topbar .profile-btn::before{content:'👤';font-size:17px;line-height:1}
}

@media(max-width:620px){
  .brand{gap:5px}
  .brand .kickflip-mark-logo{width:42px;height:35px}
  .brand .kickflip-brand-name{font-size:18px}
  .brand .kickflip-brand-i>img{width:.7em;height:.7em;top:-.44em}
  .kickflip-section-identity{gap:10px}
  .kickflip-section-identity>img{width:46px;height:46px}
  footer{align-items:center;gap:18px}
  .production-signature{gap:8px;min-width:0;text-align:left}
  .production-signature img{width:45px;height:44px;border-radius:9px}
  .production-signature>span{gap:7px;min-width:0;white-space:nowrap}
  .production-signature small{font-size:9px;letter-spacing:.08em;white-space:nowrap}
  .footer-left{gap:7px}
  .footer-policy-links{gap:5px 9px}
  .footer-policy-links a{font-size:9px}
  .account-panel:not([hidden]){transform:translateZ(0);-webkit-overflow-scrolling:touch}
}

@media(max-width:380px){
  .brand .kickflip-mark-logo{width:38px;height:32px}
  .brand .kickflip-brand-name{font-size:16px}
}
.account-delete-warning{margin:12px 0 16px;padding:14px;border:1px solid #e2c9c9;border-radius:13px;background:#fff8f8}
.account-delete-warning strong{display:block;color:#8f2525;font-size:13px}
.account-delete-warning p{margin:6px 0 0;color:#666;font-size:11px;line-height:1.5}
.account-delete-confirm{display:flex!important;align-items:flex-start;gap:9px}
.account-delete-confirm input{width:auto!important;margin-top:3px}
#accountDeleteSubmit{background:#8f2525;border-color:#8f2525}

.footer-brand-block{display:grid;gap:7px}.footer-copyright{color:#777;font-size:10px}.footer-resources{margin-left:auto}.footer-resources summary{list-style:none;cursor:pointer;font-size:11px;font-weight:900;text-decoration:underline;text-underline-offset:3px}.footer-resources summary::-webkit-details-marker{display:none}.footer-resources[open] summary{margin-bottom:10px}.footer-resources .footer-policy-links{justify-content:flex-end;max-width:520px}
@media(min-width:621px){.footer-resources{max-width:560px}.footer-resources>summary{display:none}.footer-resources .footer-policy-links{display:flex}}
@media(max-width:620px){footer{display:grid!important;grid-template-columns:1fr;align-items:start!important;padding:22px 0 96px!important;gap:14px!important}.footer-brand-block{gap:8px}.production-signature{justify-content:flex-start!important}.production-signature>span{display:grid!important;gap:2px!important;white-space:normal!important}.production-signature small{white-space:normal!important}.footer-resources{margin:0;width:100%;border-top:1px solid rgba(17,17,17,.1);padding-top:12px}.footer-resources .footer-policy-links{display:none;grid-template-columns:1fr 1fr;gap:8px 14px;justify-content:start}.footer-resources[open] .footer-policy-links{display:grid}.footer-policy-links a{font-size:10px!important}.footer-copyright{font-size:9px}}

/* Final approved 456 KICKFLIP master branding */
.kickflip-final-logo{width:auto!important;max-width:min(300px,48vw)!important;height:64px!important;object-fit:contain!important;display:block!important}
@media(max-width:700px){.kickflip-final-logo{height:48px!important;max-width:46vw!important}}


/* Unified footer: the About Us action matches the canonical policy links. */
.footer-policy-links button[data-legal] {
  display: inline-block;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: #666;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.footer-policy-links button[data-legal]:hover,
.footer-policy-links button[data-legal]:focus-visible {
  color: #111;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width: 620px) {
  .footer-policy-links button[data-legal] { font-size: 9px; }
}