/* Event-only styles: the quest and other service pages keep their own layout. */
.pc-portals { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; padding: 0 12px; align-items: stretch; }
.pc-portals > * { min-width: 0; }
.pc-portals .tcq-slot { padding: 0; margin: 0 !important; }
.pc-portals .tcq-slot .tcq-portal { width: 100%; max-width: none; }
/* Quest sprite: 108×40 per frame; its card frames start at y=4 (y=3 is a small character detail). Match the visible frames, not the transparent canvas. */
.pc-entrance { position: relative; isolation: isolate; overflow: hidden; display: block; aspect-ratio: 108 / 36; margin-top: calc(100% * 4 / 108); align-self: start; box-sizing: border-box; border: 1px solid #edb95c; border-radius: 8px; background: radial-gradient(ellipse at 85% 80%, #ffb66b70, transparent 65%), linear-gradient(120deg, #a41236, #e6374f); color: #fff; text-decoration: none; container-type: inline-size; box-shadow: inset 0 0 0 2px #ffffff12; }
.pc-entrance::before { content: ""; position: absolute; z-index: -1; inset: 0; background: repeating-linear-gradient(125deg, transparent 0 30px, #ffffff08 30px 32px); }
.pc-entrance-copy { position: absolute; inset: 8% 25% 8% 7%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.pc-entrance-dates { color: #ffe9af; font-size: clamp(8px, 5cqi, 13px); font-weight: 700; line-height: 1.3; margin-bottom: 3%; }
.pc-entrance strong { font-size: clamp(12px, 8.6cqi, 25px); line-height: 1.12; letter-spacing: .015em; text-shadow: 0 2px 0 #711d32; }
.pc-entrance strong span { display: block; }
.pc-entrance strong span:first-child { color: #ffe9a8; }
.pc-entrance strong.pc-entrance-title { font-size: min(6.8cqi, 25px); line-height: 1.2; letter-spacing: 0; }
.pc-entrance-title span { white-space: nowrap; }
.pc-entrance-title span:first-child { font-size: .85em; }
.pc-entrance-art { position: absolute; width: 30%; height: auto; right: 0; top: 0; transform: rotate(8deg); filter: drop-shadow(0 3px 3px #65162f55); pointer-events: none; }
.pc-entrance-arrow { position: absolute; right: 5%; bottom: 8%; font-size: clamp(15px, 9cqi, 25px); line-height: 1; color: #ffe9ac; }
.pc-entrance:hover { filter: brightness(1.08); }
.pc-entrance:focus-visible { outline: 3px solid #de82a4; outline-offset: 3px; }
.pc-page { background: #241e2b; color: #f7f3eb; padding-bottom: 32px; }
.pc-header { position: relative; isolation: isolate; overflow: hidden; padding: 13px 24px 17px; background: linear-gradient(115deg, #c00b35, #f33e51); border-bottom: 2px solid #edc779; }
.pc-header::before { content: ""; position: absolute; z-index: -1; width: 240px; height: 240px; border: 30px solid #ffffff0b; border-radius: 50%; right: -135px; top: 60px; box-shadow: 0 0 0 24px #ffffff04; }
.pc-topline { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pc-back { color: #f9c6cb; font-size: 11px; }
.pc-status { display: inline-flex; align-items: center; gap: 6px; color: #ffe6ad; padding: 4px 0; font-size: 10px; font-weight: 700; }
.pc-status::before { content: ""; width: 5px; height: 5px; background: #ffdc8b; border-radius: 50%; }
.pc-hero-copy { padding-top: 12px; }
.pc-kicker { margin-bottom: 6px; font-size: 10px; color: #ffe6b3; font-weight: 700; letter-spacing: .1em; }
.pc-header h1 { position: relative; font-size: clamp(25px, 7vw, 40px); font-weight: 900; line-height: 1.2; letter-spacing: -.035em; text-shadow: 0 3px 0 #95113955; }
.pc-header h1 > span { display: inline; }
.pc-header h1 .pc-title-gold { color: #ffe3a2; }
.pc-description { margin-top: 7px; font-size: 11px; color: #ffe8e0; }
.pc-dates { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px; margin-top: 13px; padding-top: 10px; border-top: 1px solid #ffd3b84d; color: #fff4df; font-variant-numeric: tabular-nums; }
.pc-date-label { margin-right: 3px; font-size: 9px; letter-spacing: .08em; color: #efb7b6; }
.pc-dates strong { font: 700 20px/1.3 'REM', sans-serif; letter-spacing: -.04em; }
.pc-dates span:not(.pc-date-label) { font-size: 10px; }
.pc-date-arrow { padding: 0 9px; color: #f2bdb2; }
.pc-content { padding: 0 24px; }
.pc-mine { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 15px 0; border-bottom: 1px solid #ffffff17; }
.pc-mine-label { margin-right: auto; }
.pc-mine h2 { font-size: 11px; color: #bcb4b3; }
.pc-mine > strong { font: 700 23px/1.3 'REM', sans-serif; color: #f3cd83; }
.pc-mine > span { font-size: 16px; font-weight: 700; }
.pc-mine > p { font-size: 10px; color: #aba3a5; }
.pc-section-heading h2 { font-size: 19px; font-weight: 800; color: #faf4e9; letter-spacing: .02em; }
.pc-ranking { padding-top: 22px; }
.pc-ranking-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.pc-ranking-heading > div { display: flex; align-items: center; gap: 9px; }
.pc-ranking-limit { font-size: 9px; color: #aca5a5; border-left: 1px solid #575052; padding-left: 9px; }
.pc-login { font-size: 10px; color: #e7b8b8; }
.pc-prizes { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 7px; margin-top: 12px; font-size: 11px; color: #e8c997; }
.pc-prize-label { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.pc-update-info { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 10px; margin: 9px 0 12px; font-size: 10px; color: #b9acb7; }
.pc-updated { color: #b9acb7; }
.pc-ranking table { width: 100%; border-collapse: separate; border-spacing: 0 5px; font-variant-numeric: tabular-nums; }
.pc-ranking th, .pc-ranking td { padding: 14px 11px; text-align: left; overflow-wrap: anywhere; }
.pc-ranking th { padding-top: 0; padding-bottom: 3px; font-size: 9px; color: #8e888b; font-weight: 500; }
.pc-ranking td { font-size: 12px; background: #302936; color: #e2d9df; }
.pc-ranking td:first-child { white-space: nowrap; width: 65px; border-left: 3px solid transparent; border-radius: 12px 0 0 12px; }
.pc-ranking td:last-child { border-radius: 0 12px 12px 0; font: 600 14px/1.4 'REM', sans-serif; letter-spacing: -.03em; }
.pc-ranking td:last-child, .pc-ranking th:last-child { text-align: right; white-space: nowrap; }
.pc-position { display: inline-flex; width: 30px; height: 30px; border-radius: 50%; align-items: center; justify-content: center; font: 600 17px/1 'REM', sans-serif; color: #9a9297; }
.pc-prize-icon { display: inline-block; vertical-align: middle; width: 15px; height: 15px; margin-left: 2px; }
.pc-ranking .pc-winning td { background: #61384d; color: #fff2e9; }
.pc-ranking .pc-winning td:first-child { border-left-color: #eebc71; }
.pc-winning .pc-position { background: #ffd6e4; color: #8a3152; font-size: 18px; font-weight: 800; box-shadow: 0 2px 0 #0002; }
.pc-ranking .pc-place-1 td { background: #63502e; color: #fff2ce; }
.pc-ranking .pc-place-2 td { background: #3c516b; color: #ecf4ff; }
.pc-ranking .pc-place-3 td { background: #684538; color: #ffe9db; }
.pc-ranking .pc-place-2 td:first-child { border-left-color: #b5c7dc; }
.pc-ranking .pc-place-3 td:first-child { border-left-color: #d5a28b; }
.pc-place-1 .pc-position { background: #ffe18e; color: #76501b; }
.pc-place-2 .pc-position { background: #d2e6ff; color: #385b86; }
.pc-place-3 .pc-position { background: #ffd1ad; color: #8d4b2d; }
.pc-place-1 .pc-position, .pc-place-2 .pc-position, .pc-place-3 .pc-position { position: relative; border: 2px solid #fff5; box-shadow: inset 0 0 0 2px #ffffff26, 0 2px 0 #0003; }
.pc-place-1 .pc-position::after, .pc-place-2 .pc-position::after, .pc-place-3 .pc-position::after { content: ""; position: absolute; width: 16px; height: 9px; background: #d55c78; top: 25px; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 65%, 0 100%); }
.pc-ranking .pc-self td { outline: 1px solid #dc7190; outline-offset: -1px; }
.pc-empty { padding: 25px 16px; font-size: 12px; background: #242428; border-radius: 7px; text-align: center; color: #b8aeb4; }
.pc-rules { margin-top: 16px; border: 1px solid #ffffff25; border-radius: 12px; background: #302936; color: #e2d9df; font-size: 12px; line-height: 1.85; }
.pc-rules summary { position: relative; padding: 13px 36px 13px 14px; color: #fff0d2; font-weight: 700; cursor: pointer; list-style: none; }
.pc-rules summary::-webkit-details-marker { display: none; }
.pc-rules summary::after { content: "+"; position: absolute; top: 12px; right: 15px; font-size: 20px; color: #edbd87; }
.pc-rules[open] summary::after { content: "−"; }
.pc-rules summary:focus-visible { outline: 2px solid #edbd87; outline-offset: 2px; border-radius: 12px; }
.pc-rules-hint { display: block; color: #b9acb7; font-size: 10px; font-weight: 400; }
.pc-rules-content { border-top: 1px solid #ffffff17; padding: 0 14px 18px; }
.pc-rules h2 { margin-top: 17px; color: #ffe0a1; font-size: 12px; font-weight: 700; }
.pc-rules p { margin-top: 6px; }
.pc-rewards { max-width: 520px; margin: 0 auto; padding: 18px 0 0; scroll-margin-top: 70px; }
.pc-rewards-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pc-rewards h2 { font-size: 19px; font-weight: 800; }
.pc-rewards-jump { font-size: 11px; color: #f1bfd0; text-underline-offset: 4px; }
.pc-rewards-jump:hover { text-decoration: underline; }
.pc-rewards-lead { margin-top: 5px; font-size: 12px; color: #d7cbd3; }
/* The BOX itself is the main visual; rank colors are limited to badges. */
.pc-box-prizes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
.pc-box-prize { position: relative; min-width: 0; padding: 28px 10px 10px; border-radius: 12px; background: #fcf9f3; color: #382b30; text-align: center; }
.pc-box-rank { position: absolute; left: 9px; top: 9px; display: inline-flex; align-items: baseline; gap: 3px; padding: 4px 9px; border-radius: 6px; background: #e8c46c; color: #563b12; }
.pc-box-rank strong { font: 800 18px/1 'REM', sans-serif; }
.pc-box-rank span { font-size: 11px; font-weight: 700; }
.pc-box-place-2 .pc-box-rank { background: #dae5ee; color: #3d566c; }
.pc-box-place-3 .pc-box-rank { background: #eed6c5; color: #785138; }
.pc-box-art { width: 100%; height: 96px; display: flex; align-items: center; justify-content: center; }
.pc-box-art img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 7px 5px #30202a22); }
.pc-box-copy { min-width: 0; }
.pc-box-name { font-size: 13px; font-weight: 800; line-height: 1.5; word-break: keep-all; }
.pc-box-count { display: inline-block; margin-top: 4px; font: 700 11px/1.4 'REM', sans-serif; color: #786973; }
.pc-box-place-1 { grid-column: 1 / -1; display: grid; grid-template-columns: 46% 54%; align-items: center; padding: 12px 14px 8px; background: radial-gradient(ellipse at 25% 50%, #ffefb8, transparent 62%), #fffbef; border: 1px solid #e8c46c; }
.pc-box-place-1 .pc-box-art { height: 128px; }
.pc-box-place-1 .pc-box-copy { text-align: left; padding: 0 6px; }
.pc-box-place-1 .pc-box-name { font-size: 18px; }
.pc-box-place-1 .pc-box-count { font-size: 12px; color: #70562d; }
.pc-gp-prizes { margin-top: 10px; border: 1px solid #b56f8a77; border-radius: 14px; background: #3a283a; }
.pc-gp-prizes summary { position: relative; padding: 10px 35px 10px 13px; cursor: pointer; list-style: none; }
.pc-gp-prizes summary::-webkit-details-marker { display: none; }
.pc-gp-summary-copy { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px 12px; }
.pc-gp-summary-title { color: #fff0e8; font-size: 13px; font-weight: 700; }
.pc-gp-summary-hint { grid-column: 1 / -1; color: #d6bdca; font-size: 11px; }
.pc-gp-prizes summary::after { position: absolute; content: '+'; right: 12px; top: 12px; color: #f9c7db; font-size: 21px; }
.pc-gp-prizes[open] summary::after { content: '−'; }
.pc-gp-prizes summary:focus-visible, .pc-rewards-jump:focus-visible { outline: 2px solid #ffe3a7; outline-offset: 3px; border-radius: 10px; }
.pc-gp-content { padding: 10px 12px 13px; border-top: 1px solid #ffffff12; }
.pc-gp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.pc-gp-item { display: flex; align-items: baseline; justify-content: space-between; gap: 4px; border-radius: 8px; background: #ffffff09; padding: 8px 10px; }
.pc-gp-item dt { color: #e4d4df; font-size: 11px; white-space: nowrap; }
.pc-gp-item dd { color: #ffe3a7; white-space: nowrap; }
.pc-gp-item strong { font: 700 16px/1.3 'REM', sans-serif; }
.pc-gp-item dd span { font-size: 9px; margin-left: 3px; }
.pc-rewards-note { margin-top: 11px; color: #b9acb7; font-size: 10px; }
.pc-ranking { scroll-margin-top: 70px; }
.pc-row-reward { display: block; margin-top: 5px; font-size: 10px; line-height: 1.5; color: #ffe0a1; }
.pc-place-2 .pc-row-reward { color: #cfdef0; }
.pc-place-3 .pc-row-reward { color: #f0c8ae; }
@media (max-width: 420px) {
  .pc-header { padding-left: 22px; padding-right: 22px; }
  .pc-content { padding: 0 16px; }
  .pc-ranking th, .pc-ranking td { padding-left: 8px; padding-right: 8px; }
}

@media (max-width: 359px) {
  .pc-gp-summary-copy { grid-template-columns: 1fr; gap: 4px; }
  .pc-dates { gap: 4px; }
  .pc-date-label { flex-basis: 100%; }
}

/* Keep the event name intact; size the words to their actual heading column. */
.pc-header h1.pc-event-title { container-type: inline-size; line-height: 1.25; }
.pc-header h1.pc-event-title > span { display: inline-block; white-space: nowrap; font-size: clamp(18px, 5vw, 40px); font-size: clamp(18px, 10cqi, 40px); }
@media (max-width: 600px) {
  .pc-header h1.pc-event-title > span { display: block; }
}