@font-face{
  font-family:Figtree;
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(/assets/fonts/figtree-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:Figtree;
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(/assets/fonts/figtree-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Figtree Echo";
  src:local("Helvetica Neue"),local("Arial"),local("Liberation Sans");
  size-adjust:97%;
  ascent-override:96%;
  descent-override:24%;
  line-gap-override:0%;
}

:root{
  --surface:#fff;
  --ink:#0b0d10;
  --mark:#0095f6;
  --hair:#e4e7ea;
  --quiet-ink:#5f666e;
  --tint:#f4f6f8;
  --dim:#cfd6dd;
  --hold:1080px;
  --corner:20px 4px 20px 4px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--surface);
  color:var(--ink);
  font-family:Figtree,"Figtree Echo",system-ui,sans-serif;
  font-size:16px;
  line-height:1.62;
  font-weight:400;
  letter-spacing:-.005em;
  overflow-wrap:break-word;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.028em;line-height:1.1}
p{margin:0}
:focus-visible{outline:3px solid var(--mark);outline-offset:3px;border-radius:2px}

.q3-hold{width:100%;max-width:var(--hold);margin-inline:auto;padding-inline:clamp(20px,5vw,40px)}
.q3-sprite{position:absolute;width:0;height:0;overflow:hidden}
.q3-away{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.q3-jump{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45em;
  min-height:48px;
  padding:12px 24px;
  border:0;
  border-radius:var(--corner);
  background:var(--tint);
  color:var(--ink);
  font:inherit;
  font-size:.9375rem;
  font-weight:800;
  letter-spacing:-.012em;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.q3-jump--wide{background:var(--mark);color:var(--ink)}
.q3-jump--quiet{background:var(--surface);box-shadow:inset 0 0 0 2px var(--mark)}
.q3-jump:hover{transform:translateY(-2px)}
.q3-jump--wide:hover{box-shadow:0 6px 0 -2px rgba(0,149,246,.32)}
.q3-jump--quiet:hover{background:var(--tint)}
.q3-jump:active{transform:translateY(1px)}
.q3-jump--lift{
  position:fixed;
  right:clamp(14px,4vw,28px);
  bottom:clamp(14px,4vw,28px);
  width:52px;
  height:52px;
  min-height:52px;
  padding:0;
  background:var(--ink);
  color:#fff;
  opacity:0;
  visibility:hidden;
  z-index:6;
}
.q3-jump--lift.is-on{opacity:1;visibility:visible}
.q3-jump--lift svg{width:20px;height:20px}

.q3-rate{display:inline-flex;align-items:center;gap:9px;font-size:.875rem;font-weight:600;color:var(--quiet-ink)}
.q3-rate__stack{position:relative;display:block;width:96px;height:18px;flex:none}
.q3-rate__stack svg{width:96px;height:18px;display:block}
.q3-rate__base{color:var(--dim)}
.q3-rate__on{position:absolute;top:0;left:0;height:18px;overflow:hidden;color:var(--mark)}
.q3-rate b{color:var(--ink);font-weight:800}

.q3-sheet{width:100%;overflow-x:auto}
.q3-sheet table{width:100%;min-width:820px;border-collapse:collapse;font-size:.9375rem}
.q3-sheet caption{
  caption-side:top;
  text-align:left;
  padding:0 0 18px;
  font-size:.875rem;
  font-weight:600;
  color:var(--quiet-ink);
}
.q3-sheet thead th{
  padding:0 16px 12px;
  text-align:left;
  vertical-align:bottom;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--quiet-ink);
  border-bottom:1px solid var(--hair);
}
.q3-sheet tbody th{
  padding:18px 16px;
  text-align:left;
  vertical-align:top;
  font-weight:800;
  font-size:1rem;
}
.q3-sheet td{padding:18px 16px;vertical-align:top;color:var(--quiet-ink)}
.q3-sheet tbody tr:nth-child(odd){background:var(--tint)}
.q3-sheet__name{display:flex;align-items:center;gap:12px}
.q3-sheet__name img{width:40px;height:40px;border-radius:10px;flex:none}
.q3-sheet__flag{display:inline-flex;align-items:flex-start;gap:8px}
.q3-sheet__flag svg{width:17px;height:17px;margin-top:3px;flex:none;color:var(--mark)}

.q3-item{display:flex;flex-direction:column}
.q3-item__thumb{
  display:block;
  overflow:hidden;
  border-radius:16px;
  background:var(--tint);
  aspect-ratio:16/9;
}
.q3-item__thumb img{width:100%;height:100%;object-fit:cover}
.q3-item__head{display:flex;align-items:center;gap:14px;margin-top:18px}
.q3-item__head img{width:56px;height:56px;border-radius:14px;flex:none}
.q3-item h3{font-size:1.1875rem}
.q3-item__by{margin-top:3px;font-size:.8125rem;font-weight:600;color:var(--quiet-ink)}
.q3-item__note{margin-top:12px;color:var(--quiet-ink)}
.q3-item__foot{margin-top:auto;padding-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.q3-item--quiet{
  background:var(--tint);
  border-radius:18px;
  padding:18px;
  flex-direction:row;
  gap:18px;
  align-items:flex-start;
}
.q3-item--quiet .q3-item__thumb{width:38%;max-width:210px;flex:none;background:var(--surface);border-radius:12px}
.q3-item--quiet .q3-item__body{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.q3-item--quiet .q3-item__head{margin-top:0;gap:12px}
.q3-item--quiet .q3-item__head img{width:44px;height:44px;border-radius:11px}
.q3-item--quiet h3{font-size:1.0625rem}
.q3-item--quiet .q3-item__note{margin-top:10px;font-size:.9375rem}
.q3-item--quiet .q3-item__foot{padding-top:14px}

.q3-tag{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 16px 8px 8px;
  border-radius:var(--corner);
  background:var(--tint);
  font-size:.875rem;
  font-weight:600;
}
.q3-tag img{width:32px;height:32px;border-radius:9px;flex:none}

.q3-feed{padding-block:56px}
.q3-feed__lead{max-width:36em;color:var(--quiet-ink);font-size:1.0625rem}
.q3-feed__note{color:var(--quiet-ink);font-size:.875rem;font-weight:600}
.q3-feed__net{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.q3-feed--wide{padding-block:64px 76px;text-align:center}
.q3-feed--wide h1{font-size:clamp(2.05rem,7vw,3.15rem)}
.q3-feed--wide .q3-feed__lead{margin-inline:auto;margin-top:20px;color:var(--ink)}
.q3-feed--wide .q3-feed__note{margin-top:22px}
.q3-feed--wide .q3-feed__row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:28px}
.q3-feed--wide .q3-feed__strip{
  list-style:none;
  margin:44px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
}
.q3-feed--quiet{padding-block:12px 64px}
.q3-feed--quiet h2{font-size:clamp(1.45rem,4vw,1.9rem)}
.q3-feed--quiet .q3-feed__lead{margin-top:16px}
.q3-feed--quiet .q3-feed__net{margin-top:36px}
.q3-feed--sheet{padding-block:24px 84px}
.q3-feed--sheet h2{font-size:clamp(1.45rem,4vw,1.9rem)}
.q3-feed--sheet .q3-sheet{margin-top:26px}
.q3-feed--sheet .q3-feed__note{margin-top:24px;max-width:44em;line-height:1.6}

.q3-mark{color:var(--mark)}

.q3-top{padding-block:26px 18px}
.q3-top__bar{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.q3-top__logo{
  font-size:clamp(1.4rem,4.4vw,1.65rem);
  font-weight:800;
  letter-spacing:-.035em;
  text-decoration:none;
}
.q3-top__note{font-size:.8125rem;font-weight:600;color:var(--quiet-ink)}

.q3-menu{padding-bottom:8px}
.q3-menu__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 22px}
.q3-menu__link{
  display:inline-flex;
  align-items:center;
  min-height:48px;
  padding:2px 0;
  font-size:.9375rem;
  font-weight:600;
  text-decoration:none;
  text-decoration-color:var(--mark);
  text-underline-offset:6px;
}
.q3-menu__link:hover{text-decoration:underline 2px}

.q3-end{padding-block:36px 56px}
.q3-end__box{max-width:44em}
.q3-end__box h2{font-size:1.35rem}
.q3-end__lead{margin-top:14px;color:var(--quiet-ink)}
.q3-end__mail{
  display:inline-flex;
  align-items:center;
  min-height:48px;
  margin-top:8px;
  font-weight:800;
  text-decoration:underline 2px;
  text-decoration-color:var(--mark);
  text-underline-offset:5px;
}
.q3-end__note{margin-top:10px;font-size:.875rem;color:var(--quiet-ink)}
.q3-end__links{margin-top:36px}
.q3-end__links ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 24px}
.q3-end__links a{
  display:inline-flex;
  align-items:center;
  min-height:48px;
  font-size:.9375rem;
  font-weight:600;
  text-decoration:none;
}
.q3-end__links a:hover{text-decoration:underline 2px;text-decoration-color:var(--mark);text-underline-offset:5px}
.q3-end__sign{margin-top:14px;font-size:.8125rem;font-weight:600;color:var(--quiet-ink)}

.q3-notice{
  position:fixed;
  left:clamp(12px,4vw,28px);
  right:clamp(12px,4vw,28px);
  bottom:clamp(12px,4vw,28px);
  z-index:8;
  max-width:44em;
  padding:20px;
  border-radius:18px;
  background:var(--surface);
  box-shadow:0 10px 34px rgba(11,13,16,.16);
}
.q3-notice[hidden]{display:none}
.q3-notice__text{font-size:.875rem;color:var(--quiet-ink)}
.q3-notice__text a{font-weight:700;color:var(--ink);text-decoration:underline 2px;text-decoration-color:var(--mark);text-underline-offset:4px}
.q3-notice__row{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.q3-notice__row .q3-jump{padding-inline:20px}

.q3-page{padding-block:20px 64px}
.q3-page h1{font-size:clamp(1.75rem,5.4vw,2.5rem)}
.q3-page__stamp{margin-top:14px;font-size:.875rem;font-weight:600;color:var(--quiet-ink)}
.q3-page__intro{margin-top:22px;max-width:44em;color:var(--quiet-ink)}
.q3-page section{margin-top:40px;max-width:44em}
.q3-page h2{font-size:1.25rem;margin-bottom:14px}
.q3-page h3{font-size:1rem;margin:22px 0 10px}
.q3-page p{margin-top:12px;color:var(--quiet-ink)}
.q3-page ul,.q3-page ol{margin:12px 0 0;padding-left:22px;color:var(--quiet-ink)}
.q3-page li{margin-top:9px}
.q3-page li::marker{color:var(--mark)}
.q3-page code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;background:var(--tint);padding:1px 6px;border-radius:6px}
.q3-page strong{color:var(--ink);font-weight:800}
.q3-page a{font-weight:600;text-decoration:underline 2px;text-decoration-color:var(--mark);text-underline-offset:4px}
.q3-page .q3-sheet{margin-top:20px;max-width:none}
.q3-page .q3-sheet table{min-width:640px}
.q3-page__back{margin-top:44px}

.q3-lost{padding-block:64px 96px;text-align:center}
.q3-lost h1{font-size:clamp(1.9rem,6vw,2.7rem)}
.q3-lost p{margin:18px auto 0;max-width:32em;color:var(--quiet-ink)}
.q3-lost__row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:28px}

@media (min-width:760px){
  .q3-feed__net{grid-template-columns:repeat(2,1fr)}
  .q3-feed--wide{padding-block:76px 92px}
  .q3-feed--quiet{padding-block:16px 80px}
  .q3-feed--sheet{padding-block:28px 104px}
  .q3-top{padding-block:34px 20px}
  .q3-end{padding-block:44px 72px}
  .q3-item--quiet{padding:22px}
  .q3-notice{padding:24px 26px}
}

@media (max-width:459px){
  .q3-item--quiet{flex-direction:column}
  .q3-item--quiet .q3-item__thumb{width:100%;max-width:none}
  .q3-rate__stack,.q3-rate__stack svg{width:84px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .q3-jump{transition:none}
  .q3-jump:hover,.q3-jump:active{transform:none}
}
