.whh-page,.whh-toast{display:none}
.whh-desktop-fallback{padding:64px 16px;text-align:center}
.whh-desktop-fallback p{margin:12px 0 24px}

@media (min-width:0){
  html{background:#078efb}
  body.hp-page--warranty-history{margin:0;color:#17212f;background:#078efb;font-family:"Be Vietnam Pro",Arial,sans-serif}
  body.hp-page--warranty-history #main-navigation,
  body.hp-page--warranty-history .hp-header-spacer,
  body.hp-page--warranty-history .hp-footer,
  body.hp-page--warranty-history #chatbot-widget,
  body.hp-page--warranty-history .whh-desktop-fallback{display:none!important}
  body.hp-page--warranty-history #main-content{min-height:100dvh}
  .whh-page,.whh-page *{box-sizing:border-box}
  .whh-page{width:100%;min-height:100dvh;display:block;overflow:hidden;background:#f8fbff}
  .whh-page button,.whh-page input{font:inherit}
  .whh-page button{cursor:pointer}
  .whh-page a{color:inherit;text-decoration:none}
  .whh-page svg{width:1.35em;height:1.35em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .whh-sprite{position:absolute;width:0;height:0;overflow:hidden}

  .whh-hero{position:relative;height:calc(230px + env(safe-area-inset-top));overflow:hidden;padding:calc(25px + env(safe-area-inset-top)) 24px 25px;color:#fff;background:radial-gradient(circle at 80% 48%,#22d1ff66,transparent 28%),linear-gradient(145deg,#078efb,#0754db 75%)}
  .whh-hero:before{content:"";position:absolute;z-index:1;top:0;right:0;left:0;height:calc(48px + env(safe-area-inset-top));pointer-events:none;background:linear-gradient(to bottom,#078efb 0,#078efb 58%,rgba(7,142,251,0) 100%)}
  .whh-hero:after{content:"";position:absolute;z-index:1;right:-50px;top:55px;width:250px;height:125px;border:1px solid #ffffff33;border-radius:50%;transform:rotate(-8deg)}
  .whh-brand{position:relative;z-index:3;width:max-content;display:flex;align-items:center;gap:8px;line-height:1.05}
  .whh-brand>img{width:auto;max-width:145px;height:42px;object-fit:contain;filter:brightness(0) invert(1)}
  .whh-brand>span{width:34px;height:38px;display:grid;place-items:center}
  .whh-brand>span svg{width:33px;height:36px}
  .whh-brand b{font-size:14px}.whh-brand small{display:block;font-size:10px;letter-spacing:1.4px}
  .whh-bell{position:absolute;z-index:5;top:calc(25px + env(safe-area-inset-top));right:22px;color:#fff}.whh-bell svg{width:25px;height:25px}
  .whh-bell i{position:absolute;right:-1px;top:-3px;width:8px;height:8px;border:1px solid #fff;border-radius:50%;background:#f04438}
  .whh-hero-copy{position:relative;z-index:3;margin-top:30px}.whh-hero-copy p{margin:0 0 5px;font-size:12px}
  .whh-hero-copy h1{margin:0 0 7px;color:#fff;font-size:25px;letter-spacing:-.6px}.whh-hero-copy span{font-size:10px}
  .whh-hero-art{position:absolute;z-index:2;right:1px;bottom:-14px;width:195px;height:195px;pointer-events:none}
  .whh-hero-art img{width:100%;height:100%;object-fit:contain;filter:saturate(1.05) drop-shadow(0 12px 17px rgba(0,40,145,.24))}

  .whh-card{position:relative;z-index:5;min-height:calc(100dvh - 202px);margin-top:-28px;padding:18px 16px calc(94px + env(safe-area-inset-bottom));border-radius:27px 27px 0 0;background:linear-gradient(#fff,#f8fbff);box-shadow:0 -7px 24px #004fa51c}
  .whh-card h2{margin:0 0 12px;font-size:14px}
  .whh-search-row{display:grid;grid-template-columns:minmax(0,1fr) 84px;gap:8px}
  .whh-search-row label{height:43px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid #e2eaf3;border-radius:10px;background:#fff}
  .whh-search-row label svg{flex:0 0 19px;color:#728197}.whh-search-row input{min-width:0;width:100%;border:0;outline:0;background:transparent;font-size:9px}
  .whh-search-row button{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #dce7f3;border-radius:10px;color:#0874e9;background:#fff;font-size:8px}
  .whh-filters{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:9px}
  .whh-filters button{height:32px;border:1px solid #e0e8f1;border-radius:16px;color:#6d798b;background:#f9fbfd;font-size:8px}
  .whh-filters button.is-active{color:#fff;border-color:#0874eb;background:#0874eb;box-shadow:0 4px 9px #0874e933}
  .whh-group{margin-top:15px}.whh-group h3{margin:0 0 7px;font-size:9px;font-weight:500}
  .whh-list{display:flex;flex-direction:column;gap:8px}
  .whh-item{position:relative;min-height:79px;display:grid;grid-template-columns:54px minmax(0,1fr) 91px;gap:9px;align-items:center;padding:8px 20px 8px 9px;border:1px solid #e7edf4;border-radius:12px;background:#fff;box-shadow:0 5px 14px #1b4e7d0f}
  .whh-item:first-child{border-color:#8cbcf6}
  .whh-item__image{width:54px;height:62px;display:grid;place-items:center;overflow:hidden;border-radius:8px;background:linear-gradient(145deg,#e8f5ff,#f6fbff)}
  .whh-item__image img{width:60px;height:60px;object-fit:contain}
  .whh-item__body{min-width:0}.whh-item__body b{display:block;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9.5px}
  .whh-item__body small{display:block;margin-top:4px;overflow:hidden;color:#738094;text-overflow:ellipsis;white-space:nowrap;font-size:7px}
  .whh-item__body strong{color:#0871df;font-weight:500}
  .whh-item aside{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;text-align:right}
  .whh-item aside span{padding:5px 7px;border-radius:9px;font-size:6.5px;white-space:nowrap}
  .whh-item aside .active{color:#0ba65e;background:#e4f9ed}.whh-item aside .expired{color:#e34b32;background:#fff0eb}
  .whh-item aside small{color:#738094;font-size:6.5px;white-space:nowrap}
  .whh-item>i{position:absolute;right:7px;color:#73859b;font-size:18px;font-style:normal}
  .whh-empty{margin:18px 0 4px;padding:28px 20px;border:1px dashed #cbd9e8;border-radius:14px;text-align:center;background:#f8fbff}
  .whh-empty>span{width:42px;height:42px;margin:auto;display:grid;place-items:center;border-radius:50%;color:#0878f5;background:#e5f3ff}
  .whh-empty h3{margin:11px 0 5px;font-size:11px}.whh-empty p{max-width:260px;margin:auto;color:#738094;font-size:8px;line-height:1.55}
  .whh-actions{min-height:44px;display:flex;align-items:center;justify-content:space-between;padding:10px 5px;border-bottom:1px solid #e9eef5}
  .whh-actions button{display:flex;align-items:center;gap:6px;border:0;color:#f04438;background:transparent;font-size:8px}
  .whh-actions span{color:#738094;font-size:8px}
  .whh-utils{margin-top:14px}.whh-utils>div{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
  .whh-utils article{display:grid;grid-template-columns:29px 1fr;grid-template-rows:auto auto;min-width:0;padding:9px 6px;border-radius:10px;background:#fff;box-shadow:0 5px 14px #1c4f7d10}
  .whh-utils article>span{grid-row:1/3;align-self:center;width:27px;height:27px;display:grid;place-items:center;border-radius:50%}
  .whh-utils .blue{color:#087ff1;background:#e7f4ff}.whh-utils .green{color:#14bd72;background:#e6faef}.whh-utils .purple{color:#8c39e8;background:#f3eaff}
  .whh-utils article b{font-size:7px}.whh-utils article small{margin-top:3px;color:#7a8796;font-size:5.6px;line-height:1.4}
  .whh-search-again{height:46px;margin-top:14px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:11px;color:#fff!important;background:linear-gradient(90deg,#087af5,#075ade);box-shadow:0 8px 17px #0874e92d;font-size:12px}
  .whh-bottom-nav{position:fixed;z-index:20;right:0;bottom:0;left:0;height:calc(68px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,1fr);align-items:start;padding:8px 8px env(safe-area-inset-bottom);border-top:1px solid #e7edf4;background:#fff;box-shadow:0 -5px 15px #1f4e790d}
  .whh-bottom-nav>a:not(.whh-bottom-scan){display:flex;flex-direction:column;align-items:center;gap:4px;color:#5d6b7e;font-size:7px}.whh-bottom-nav>a.is-active{color:#0878f5}
  .whh-bottom-nav>a svg{width:19px;height:19px}.whh-bottom-nav .whh-bottom-scan{width:52px;height:52px;justify-self:center;display:grid;place-items:center;border:5px solid #e9f4ff;border-radius:50%;color:#fff;background:#0878f5;transform:translateY(-20px);box-shadow:0 7px 16px #0874e955}
  .whh-bottom-nav .whh-bottom-scan svg{width:26px;height:26px}
  .whh-toast{position:fixed;z-index:50;left:50%;bottom:84px;display:block;max-width:calc(100% - 32px);padding:10px 15px;border-radius:10px;color:#fff;background:#102a43;opacity:0;pointer-events:none;transform:translate(-50%,15px);transition:.25s;text-align:center;font-size:11px}
  .whh-toast.is-visible{opacity:1;transform:translate(-50%,0)}
}

@media (min-width:901px){
  body.hp-page--warranty-history{padding:24px 0}
  .whh-page{max-width:520px;margin:0 auto;box-shadow:0 18px 55px rgba(23,73,124,.2)}
  .whh-bottom-nav{width:520px;margin:0 auto}
}

@media (max-width:360px){
  .whh-card{padding-right:12px;padding-left:12px}
  .whh-item{grid-template-columns:48px minmax(0,1fr) 84px}
  .whh-item__image{width:48px}
}

@media (prefers-reduced-motion:reduce){
  .whh-page *{scroll-behavior:auto!important;transition-duration:.01ms!important}
}