:root{--bg:#eef8ff;--card:#fff;--text:#16324f;--muted:#687f95;--blue:#3478e5;--yellow:#ffcb05;--line:#dce8f2;--shadow:0 14px 34px #315d8b22}
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,sans-serif;color:var(--text);background:radial-gradient(circle at 10% 0,#ffe88b66,transparent 25rem),linear-gradient(#fbfdff,var(--bg))}
button,input,select{font:inherit}a{text-decoration:none;color:inherit}header{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:24px;padding:14px max(18px,calc((100% - 1220px)/2));background:#ffffffeb;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:10px}.brand b{color:var(--yellow);font-size:1.25rem;-webkit-text-stroke:1px #285db5}.ball{width:42px;height:42px;border-radius:50%;background:linear-gradient(#ef5350 0 45%,#17324f 45% 55%,#fff 55%);box-shadow:inset 0 0 0 3px #17324f}
nav{display:flex;gap:5px;flex:1}nav a{padding:9px 11px;border-radius:10px;color:var(--muted);font-weight:750}nav a:hover{background:#eaf2ff;color:var(--blue)}button{border:0;border-radius:11px;padding:10px 13px;background:#eaf2ff;color:#285db5;font-weight:800;cursor:pointer}
main{min-height:72vh}.page{width:min(calc(100% - 28px),1220px);margin:auto;padding:48px 0 70px}.hero{display:grid;grid-template-columns:1.4fr .6fr;gap:28px;align-items:center}.hero h1,.heading h1{font-size:clamp(2.6rem,6vw,5rem);line-height:.98;letter-spacing:-.055em;margin:8px 0 15px}.hero p,.heading p,.card p{color:var(--muted);line-height:1.7}.eyebrow{color:var(--blue);font-size:.76rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.panel,.card,.pokemon-card,.controls{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}.panel{padding:20px}.stat{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line)}.stat:last-child{border:0}
.grid,.pokemon-grid,.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{padding:20px}.heading{margin-bottom:26px}.heading h1{font-size:clamp(2.5rem,5vw,4.6rem)}
.controls{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:10px;padding:12px;margin-bottom:20px}.controls input,.controls select{width:100%;padding:12px;border:1px solid var(--line);border-radius:11px;background:#f9fcff}
.pokemon-grid{grid-template-columns:repeat(4,1fr)}.pokemon-card{position:relative;padding:16px;cursor:pointer;transition:.2s}.pokemon-card:hover{transform:translateY(-4px)}.pokemon-card img{width:115px;height:115px;object-fit:contain;margin:auto}.pokemon-card h2{margin:5px 0}.number,.form{color:var(--muted);font-size:.78rem}.badges{display:flex;gap:6px;flex-wrap:wrap}.badge{padding:5px 8px;border-radius:999px;background:#eaf2ff;color:#285db5;font-size:.72rem;font-weight:800}.star{position:absolute;right:10px;top:10px;background:transparent;font-size:1.25rem}.star.active{color:#eab400}
dialog{width:min(1080px,calc(100% - 20px));max-height:90vh;border:0;border-radius:22px;padding:0}dialog::backdrop{background:#10263d99}#close{position:sticky;float:right;top:12px;right:12px;border-radius:50%;font-size:1.4rem}.detail{padding:30px}.detail-top{display:grid;grid-template-columns:240px 1fr;gap:25px;align-items:center}.detail-top img{width:220px;height:220px;object-fit:contain}.detail h2{font-size:3rem;margin:5px 0}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:20px}.section{border:1px solid var(--line);border-radius:16px;padding:17px}.chips{display:flex;gap:6px;flex-wrap:wrap}
.loading{text-align:center;padding:100px;color:var(--muted)}footer{padding:30px;text-align:center;border-top:1px solid var(--line);color:var(--muted)}
@media(max-width:900px){header{flex-wrap:wrap}nav{order:3;width:100%;overflow:auto}.hero,.detail-top,.detail-grid{grid-template-columns:1fr}.pokemon-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.controls{grid-template-columns:1fr}.grid,.type-grid{grid-template-columns:1fr}.pokemon-grid{grid-template-columns:repeat(2,1fr)}.pokemon-card{padding:11px}.pokemon-card img{width:90px;height:90px}.detail{padding:18px}}
.event-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 24px}
.event-summary-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#ffffffeb;box-shadow:var(--shadow)}
.event-summary-card span{color:var(--muted);font-weight:700}.event-summary-card strong{font-size:1.35rem}
.event-summary-card.active-summary{border-color:#36b37e66;background:linear-gradient(135deg,#ecfff6,#fff)}
.event-card{position:relative;overflow:hidden}
.event-card.active-event{border-color:#36b37e88;background:linear-gradient(145deg,#f0fff8,#fff 55%);box-shadow:0 18px 42px #2399692e}
.event-card.active-event:before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:linear-gradient(#39c98a,#1f9d69)}
.event-status{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.event-status.active{color:#126b48;background:#dff8ec}.event-status.active:before{content:"";width:8px;height:8px;border-radius:50%;background:#23b978;box-shadow:0 0 0 5px #23b97824}
.event-status.upcoming{color:#285db5;background:#eaf2ff}
.event-date{display:grid;gap:7px;margin-top:15px}.event-date span{display:flex;justify-content:space-between;gap:14px;padding:8px 10px;border-radius:10px;background:#f6f9fc;color:var(--muted)}
.event-card.active-event .event-date span{background:#dff8ecaa}
@media(max-width:760px){.event-summary{grid-template-columns:1fr}}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
nav a.active{background:#eaf2ff;color:var(--blue)}
.result-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px;color:var(--muted)}
.button-link{padding:8px 11px;border-radius:10px;background:#eaf2ff;color:#285db5;font-weight:800}
.sentinel{height:30px}.empty-state{grid-column:1/-1;padding:42px;text-align:center;border:1px dashed var(--line);border-radius:18px;color:var(--muted);background:#ffffffaa}
.event-category{display:block;margin-top:14px}.event-status.ended{color:#66788a;background:#edf1f4}.ended-event{opacity:.72;box-shadow:none}.ended-event:hover{opacity:1}
.pokemon-card:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #3478e566;outline-offset:3px}
.pokemon-card img[hidden],.detail-top img[hidden]{display:none}
@media(max-width:650px){.result-bar{align-items:flex-start;flex-direction:column}.event-date span{align-items:flex-start;flex-direction:column;gap:3px}}

.live-bonus-panel{
  margin:0 0 26px;
  padding:22px;
  border:1px solid rgba(54,179,126,.42);
  border-radius:22px;
  background:linear-gradient(135deg,#ecfff6 0%,#ffffff 62%,#eef7ff 100%);
  box-shadow:0 18px 44px rgba(35,153,105,.15);
}
.live-bonus-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:18px;
}
.live-bonus-header h2{margin:5px 0 7px;font-size:clamp(1.55rem,3vw,2.35rem)}
.live-bonus-header p{margin:0;color:var(--muted);line-height:1.55}
.live-indicator{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border-radius:999px;
  color:#116943;
  background:#dff8ec;
  font-weight:900;
  white-space:nowrap;
}
.live-indicator::before{
  content:"";
  width:9px;height:9px;border-radius:50%;
  background:#23b978;
  box-shadow:0 0 0 6px rgba(35,185,120,.14);
  animation:livePulse 1.8s ease-in-out infinite;
}
@keyframes livePulse{50%{box-shadow:0 0 0 10px rgba(35,185,120,0)}}
.bonus-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bonus-group{
  padding:16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.9);
}
.bonus-group h3{margin:0 0 11px;font-size:1rem}
.bonus-list{display:grid;gap:8px}
.bonus-item{
  width:100%;
  display:flex;
  align-items:flex-start;
  gap:9px;
  padding:9px 10px;
  text-align:left;
  border:1px solid transparent;
  border-radius:11px;
  background:#f6f9fc;
  color:var(--text);
  font-weight:700;
  line-height:1.38;
}
.bonus-item:hover,.bonus-item:focus-visible{
  border-color:rgba(59,130,246,.28);
  background:#edf5ff;
  outline:none;
}
.bonus-item-icon{font-size:1.05rem;line-height:1.25}
.no-active-bonuses{
  padding:24px;
  border:1px dashed rgba(54,179,126,.4);
  border-radius:16px;
  text-align:center;
  color:var(--muted);
  background:#ffffffb8;
}
.event-tools{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(170px,.4fr);
  gap:10px;
  margin:0 0 22px;
}
.event-tools input,.event-tools select{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 13px;
  background:#fff;
  color:var(--text);
}
.event-source-list{display:grid;gap:9px;margin-top:14px}
.event-source{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-radius:11px;
  background:#f5f9fd;
}
.event-source span{color:var(--muted)}
.home-live-bonuses{margin-top:24px}
.home-live-bonuses .bonus-groups{grid-template-columns:repeat(2,1fr)}
.home-live-bonuses .bonus-group:nth-child(n+5){display:none}
.event-card[hidden]{display:none}
@media(max-width:900px){
  .bonus-groups{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .live-bonus-header{flex-direction:column}
  .bonus-groups,.home-live-bonuses .bonus-groups{grid-template-columns:1fr}
  .event-tools{grid-template-columns:1fr}
}

.event-card{cursor:pointer}
.event-card:focus-visible{outline:3px solid #3478e566;outline-offset:3px}
.event-detail{padding:0}
.event-detail-hero{
  display:grid;grid-template-columns:220px 1fr;gap:26px;align-items:center;
  padding:30px;background:linear-gradient(135deg,#fff3cf,#eef7ff 62%,#effff7);
}
.event-detail-art{display:grid;place-items:center;min-height:210px}
.event-detail-art img{width:200px;height:200px;object-fit:contain;filter:drop-shadow(0 15px 13px #315d8b33)}
.event-detail-hero h2{font-size:clamp(2rem,5vw,3.6rem);line-height:1;margin:7px 0 10px;letter-spacing:-.05em}
.event-detail-hero p{color:var(--muted);line-height:1.6}
.event-detail-time{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.event-detail-time .badge{font-size:.78rem;padding:7px 10px}
.event-detail-body{padding:26px 30px 36px;display:grid;gap:20px}
.event-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.event-detail-section{border:1px solid var(--line);border-radius:18px;padding:19px;background:#fff}
.event-detail-section.full{grid-column:1/-1}
.event-detail-section h3{margin:0 0 13px;font-size:1.15rem}
.event-detail-section h4{margin:15px 0 8px}
.detail-featured{
  display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center;
  border-radius:15px;padding:14px;background:#f7fbff;
}
.detail-featured img{width:100px;height:100px;object-fit:contain}
.detail-featured ul,.event-detail-section ul{margin:8px 0;padding-left:20px;color:var(--muted);line-height:1.55}
.detail-bonus-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.detail-bonus{
  display:flex;align-items:flex-start;gap:9px;padding:11px;border-radius:12px;background:#f6f9fc;
}
.detail-bonus strong{display:block}.detail-bonus small{display:block;color:var(--muted);margin-top:3px}
.shiny-pair{display:flex;gap:18px;align-items:end;flex-wrap:wrap}
.shiny-mon{text-align:center}.shiny-mon img{width:120px;height:120px;object-fit:contain}
.move-card{padding:14px;border-radius:14px;background:#edf5ff}
.move-card strong{font-size:1.08rem}.move-card p{margin:6px 0;color:var(--muted)}
.research-task{padding:12px 0;border-bottom:1px solid var(--line)}.research-task:last-child{border-bottom:0}
.research-task p{margin:0 0 8px}.research-task .badges{gap:5px}
.pvp-box{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pvp-box div{padding:12px;border-radius:12px;background:#f6f9fc;text-align:center}
.pvp-box small{display:block;color:var(--muted);margin-bottom:4px}
.event-note{padding:11px 13px;border-radius:12px;background:#fff8da;color:#6c5700}
.event-card .card-click-hint{margin-top:14px;color:var(--blue);font-weight:850}
@media(max-width:760px){
  .event-detail-hero,.event-detail-grid{grid-template-columns:1fr}
  .event-detail-art{min-height:150px}.event-detail-art img{width:160px;height:160px}
  .detail-bonus-grid{grid-template-columns:1fr}
  .pvp-box{grid-template-columns:1fr}
  .event-detail-section.full{grid-column:auto}
}

/* v4.3.1 – Mobile Event Detail Optimization */
@media(max-width:760px){
  body:has(dialog[open]){
    overflow:hidden;
  }

  dialog#detail{
    width:100vw;
    max-width:none;
    height:100dvh;
    max-height:100dvh;
    margin:0;
    border-radius:0;
    overflow:hidden;
  }

  dialog#detail::backdrop{
    background:rgba(12,28,45,.72);
    backdrop-filter:blur(3px);
  }

  #detail{
    border-radius:0;
  }

  #detail > #close{
    position:fixed;
    top:calc(env(safe-area-inset-top, 0px) + 10px);
    right:12px;
    z-index:100;
    width:46px;
    height:46px;
    padding:0;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:rgba(255,255,255,.94);
    color:var(--text);
    box-shadow:0 8px 22px rgba(23,50,79,.18);
    font-size:1.65rem;
  }

  #detailContent{
    height:100%;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scroll-padding-top:68px;
    background:var(--bg);
  }

  .event-detail{
    min-height:100%;
    background:var(--bg);
  }

  .event-detail-hero{
    grid-template-columns:1fr;
    gap:10px;
    padding:
      calc(env(safe-area-inset-top, 0px) + 58px)
      18px
      22px;
    text-align:center;
    background:
      radial-gradient(circle at 50% 8%,rgba(255,203,5,.28),transparent 13rem),
      linear-gradient(180deg,#fff7d8 0%,#edf7ff 100%);
  }

  .event-detail-art{
    min-height:132px;
    margin-top:0;
  }

  .event-detail-art img{
    width:148px;
    height:148px;
    max-width:48vw;
    max-height:48vw;
  }

  .event-detail-hero .event-status,
  .event-detail-hero .eyebrow{
    display:inline-flex;
    margin-inline:3px;
  }

  .event-detail-hero h2{
    margin:10px auto 8px;
    max-width:92%;
    font-size:clamp(1.9rem,9vw,2.7rem);
    line-height:1.03;
  }

  .event-detail-hero p{
    margin:8px auto;
    max-width:92%;
    font-size:.96rem;
    line-height:1.55;
  }

  .event-detail-time{
    justify-content:center;
    gap:7px;
    margin-top:14px;
  }

  .event-detail-time .badge{
    padding:7px 9px;
    font-size:.72rem;
    line-height:1.25;
  }

  .event-detail-body{
    padding:16px 12px calc(28px + env(safe-area-inset-bottom, 0px));
    gap:14px;
  }

  .event-detail-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .event-detail-section,
  .event-detail-section.full{
    grid-column:auto;
    padding:16px;
    border-radius:16px;
    box-shadow:none;
  }

  .event-detail-section h3{
    font-size:1.05rem;
    margin-bottom:12px;
  }

  .detail-bonus-grid{
    grid-template-columns:1fr;
    gap:7px;
  }

  .detail-bonus{
    min-height:52px;
    padding:11px 12px;
    align-items:flex-start;
  }

  .bonus-item-icon{
    flex:0 0 auto;
    font-size:1.15rem;
  }

  .detail-featured{
    grid-template-columns:86px 1fr;
    gap:12px;
    padding:12px;
    text-align:left;
  }

  .detail-featured img{
    width:82px;
    height:82px;
  }

  .detail-featured ul{
    padding-left:18px;
    margin:6px 0 0;
    font-size:.9rem;
  }

  .shiny-pair{
    justify-content:center;
    gap:10px;
  }

  .shiny-mon{
    flex:1 1 120px;
    max-width:150px;
    padding:10px;
    border-radius:13px;
    background:#f7fbff;
  }

  .shiny-mon img{
    width:100%;
    height:105px;
  }

  .move-card{
    padding:13px;
  }

  .move-card p{
    font-size:.92rem;
    line-height:1.5;
  }

  .research-task{
    padding:12px 0;
  }

  .research-task .badges{
    gap:5px;
  }

  .research-task .badge{
    white-space:normal;
    line-height:1.3;
  }

  .pvp-box{
    grid-template-columns:repeat(3,1fr);
    gap:6px;
  }

  .pvp-box div{
    min-width:0;
    padding:10px 6px;
  }

  .pvp-box strong{
    font-size:.9rem;
    word-break:break-word;
  }

  .event-note{
    font-size:.9rem;
    line-height:1.5;
  }

  .event-detail-section .badges{
    gap:6px;
  }

  .event-detail-section .badge{
    white-space:normal;
    line-height:1.3;
  }

  .event-card{
    min-height:0;
  }

  .event-card .event-date span{
    display:grid;
    grid-template-columns:70px 1fr;
    align-items:start;
    gap:8px;
  }

  .event-card .event-date strong{
    text-align:right;
    overflow-wrap:anywhere;
  }
}

@media(max-width:420px){
  .event-detail-hero{
    padding-left:12px;
    padding-right:12px;
  }

  .event-detail-body{
    padding-left:8px;
    padding-right:8px;
  }

  .event-detail-section{
    padding:14px;
  }

  .event-detail-art img{
    width:132px;
    height:132px;
  }

  .detail-featured{
    grid-template-columns:72px 1fr;
  }

  .detail-featured img{
    width:68px;
    height:68px;
  }

  .pvp-box{
    grid-template-columns:1fr;
  }

  .pvp-box div{
    text-align:left;
    display:flex;
    justify-content:space-between;
    gap:12px;
  }

  .event-detail-time{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  .event-detail-time .badge{
    justify-content:center;
    width:100%;
  }
}

.event-card[data-event-detail]{cursor:pointer}
.event-card[data-event-detail]:hover{border-color:rgba(52,120,229,.32)}
.event-card[data-event-detail]:active{transform:translateY(-1px)}

/* v4.3.3 – robust detail modal for desktop and mobile */
.detail-modal[hidden]{display:none!important}
.detail-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:18px;
}
.detail-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(12,28,45,.68);
  backdrop-filter:blur(5px);
}
.detail-modal-panel{
  position:relative;
  z-index:1;
  width:min(1080px,100%);
  max-height:min(92dvh,920px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  border-radius:24px;
  background:var(--bg);
  box-shadow:0 30px 90px rgba(8,27,48,.38);
}
.detail-modal-panel #close{
  position:sticky;
  float:right;
  top:12px;
  right:12px;
  z-index:20;
  width:44px;
  height:44px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.96);
  color:var(--text);
  box-shadow:0 8px 22px rgba(23,50,79,.18);
  font-size:1.55rem;
}
body.detail-open{overflow:hidden}

@media(max-width:760px){
  .detail-modal{
    padding:0;
    place-items:stretch;
  }
  .detail-modal-panel{
    width:100%;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
    padding-top:env(safe-area-inset-top,0px);
  }
  .detail-modal-panel #close{
    position:fixed;
    top:calc(env(safe-area-inset-top,0px) + 10px);
    right:12px;
    width:48px;
    height:48px;
  }
  #detailContent{
    min-height:100%;
  }
  .event-detail-hero{
    padding-top:calc(env(safe-area-inset-top,0px) + 68px)!important;
  }
}

.event-subgroup{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.event-subgroup:first-of-type{margin-top:8px}
.event-subgroup h4{margin:0 0 7px;color:var(--text)}
.event-detail .form a{color:var(--blue);font-weight:850;text-decoration:underline;text-underline-offset:3px}

.official-import-wrapper{border-color:#3478e547;background:linear-gradient(135deg,#f4f9ff,#fff)}
.official-import-section{background:#f8fbff;box-shadow:none}
.official-import-section h3{color:#285db5}

.structured-auto-wrapper{border-color:rgba(71,132,255,.28);background:linear-gradient(135deg,#f8fbff,#f7fff9)}
.structured-auto-wrapper>h3{color:#234f9e}
