@layer components{.ranking-tab--active{border-color:var(--color-netsuki-gold);background-color:var(--color-netsuki-gold);color:var(--color-netsuki-navy)}.ranking-tab--inactive{border-color:var(--color-netsuki-gray-border);background-color:var(--color-netsuki-white);color:var(--color-netsuki-gray-text)}.ranking-tab--inactive:hover{background-color:var(--color-netsuki-gray-light)}.ranking-row{--row-border: #e5e7eb;border-bottom:1px solid var(--row-border)}.ranking-row--top3{--top3-bg: #fefce8;background-color:var(--top3-bg)}.ranking-cell{padding-inline:var(--space-xs);padding-block:var(--space-xs);text-align:center}.ranking-cell--rank{--medal-gold: #eab308;--medal-silver: #9ca3af;--medal-bronze: #d97706;font-weight:700}.ranking-rank--1st{color:var(--medal-gold)}.ranking-rank--2nd{color:var(--medal-silver)}.ranking-rank--3rd{color:var(--medal-bronze)}.ranking-title{margin-bottom:var(--space-base);text-align:center;font-size:var(--font-size-md)}.ranking-tabs{margin-bottom:var(--space-base);display:flex;justify-content:center;gap:var(--space-xs)}.ranking-message{padding-block:var(--space-base);text-align:center;color:var(--color-netsuki-gray)}.ranking-table-container{overflow-x:auto}.ranking-table{width:100%;font-size:var(--font-size-base)}.ranking-header{background-color:color-mix(in srgb,var(--color-netsuki-gold) 30%,transparent)}.ranking-header-cell{padding-inline:var(--space-xs);padding-block:var(--space-xs);text-align:center}}@layer pages{.breakout-game:where(.astro-jeh5vkjj){padding:var(--space-sm)}.breakout-container:where(.astro-jeh5vkjj){display:flex;flex-direction:column;align-items:center}.breakout-controls:where(.astro-jeh5vkjj){margin-bottom:var(--space-xs);display:flex;align-items:center;gap:var(--space-base);font-size:var(--font-size-base)}.breakout-canvas-wrapper:where(.astro-jeh5vkjj){position:relative;width:100%;max-width:320px;margin-left:auto;margin-right:auto;touch-action:none;transform:translateZ(0)}.breakout-canvas:where(.astro-jeh5vkjj){display:block;width:100%;height:auto;aspect-ratio:320 / 480;border:2px solid #1f2937;background-color:#111827}.breakout-close-btn:where(.astro-jeh5vkjj){position:absolute;top:.5rem;right:.5rem;z-index:10;display:none;border-radius:.25rem;background-color:#374151;padding:var(--space-2xs) var(--space-sm);font-size:var(--font-size-base);color:var(--color-netsuki-white)}.breakout-close-btn:where(.astro-jeh5vkjj):hover{background-color:#4b5563}.breakout-intro:where(.astro-jeh5vkjj){margin-top:var(--space-sm);text-align:center;font-size:var(--font-size-sm);color:#4b5563}.breakout-warning:where(.astro-jeh5vkjj){margin-top:var(--space-2xs);text-align:center;font-size:var(--font-size-sm);color:var(--color-netsuki-red)}.breakout-howto:where(.astro-jeh5vkjj){background-color:color-mix(in srgb,var(--color-netsuki-gold) 30%,transparent)}.breakout-howto-content:where(.astro-jeh5vkjj){color:var(--color-netsuki-black);font-size:var(--font-size-sm)}.breakout-howto-content:where(.astro-jeh5vkjj)>:where(.astro-jeh5vkjj)+:where(.astro-jeh5vkjj){margin-top:var(--space-xs)}.breakout-attacks:where(.astro-jeh5vkjj){background-color:color-mix(in srgb,var(--color-netsuki-gold) 30%,transparent)}.breakout-attacks:where(.astro-jeh5vkjj) .section-title:where(.astro-jeh5vkjj){margin-bottom:var(--space-base)}.breakout-attacks-grid:where(.astro-jeh5vkjj){display:grid;grid-template-columns:1fr;gap:var(--space-sm)}@media(width>=640px){.breakout-attacks-grid:where(.astro-jeh5vkjj){grid-template-columns:repeat(2,1fr)}}.breakout-attack-item:where(.astro-jeh5vkjj){display:flex;align-items:center;gap:var(--space-sm);border-radius:.25rem;background-color:color-mix(in srgb,var(--color-netsuki-white) 50%,transparent);padding:var(--space-xs)}.breakout-attack-item--laser:where(.astro-jeh5vkjj){grid-column:1 / -1}@media(width>=640px){.breakout-attack-item--laser:where(.astro-jeh5vkjj){grid-column:span 2}}.breakout-attack-icon:where(.astro-jeh5vkjj){display:flex;align-items:center;justify-content:center;height:2rem;width:2rem}.breakout-attack-icon--rain:where(.astro-jeh5vkjj){flex-wrap:wrap;gap:.125rem}.breakout-bullet:where(.astro-jeh5vkjj){display:inline-block;border-radius:9999px}.breakout-bullet--normal:where(.astro-jeh5vkjj){height:1rem;width:1rem;background-color:var(--color-netsuki-red)}.breakout-bullet--spread:where(.astro-jeh5vkjj){height:.5rem;width:.5rem;background-color:var(--color-netsuki-red)}.breakout-bullet--spread-1:where(.astro-jeh5vkjj){transform:translateY(-.25rem) rotate(-45deg)}.breakout-bullet--spread-3:where(.astro-jeh5vkjj){transform:translateY(-.25rem) rotate(45deg)}.breakout-bullet--homing:where(.astro-jeh5vkjj){height:1.25rem;width:1.25rem;background-color:#d946ef;box-shadow:0 0 8px #d946ef99}.breakout-bullet--rain:where(.astro-jeh5vkjj){height:.5rem;width:.5rem;background-color:#f97316}.breakout-bullet--laser:where(.astro-jeh5vkjj){height:2rem;width:.5rem;background:linear-gradient(to bottom,#fde047,var(--color-netsuki-red),#fde047)}.breakout-attack-name:where(.astro-jeh5vkjj){color:var(--color-netsuki-navy);font-size:var(--font-size-base);font-weight:700}.breakout-attack-desc:where(.astro-jeh5vkjj){font-size:var(--font-size-sm);color:#4b5563}.breakout-blocks:where(.astro-jeh5vkjj){background-color:color-mix(in srgb,var(--color-netsuki-gold) 30%,transparent)}.breakout-blocks:where(.astro-jeh5vkjj) .section-title:where(.astro-jeh5vkjj){margin-bottom:var(--space-base)}.breakout-blocks-grid:where(.astro-jeh5vkjj){display:grid;grid-template-columns:1fr;gap:var(--space-sm)}@media(width>=640px){.breakout-blocks-grid:where(.astro-jeh5vkjj){grid-template-columns:repeat(3,1fr)}}.breakout-block-item:where(.astro-jeh5vkjj){display:flex;align-items:center;gap:var(--space-sm);border-radius:.25rem;background-color:color-mix(in srgb,var(--color-netsuki-white) 50%,transparent);padding:var(--space-xs)}.breakout-block-icon:where(.astro-jeh5vkjj){display:flex;align-items:center;justify-content:center;height:2rem;width:2rem}.breakout-block-icon--relative:where(.astro-jeh5vkjj){position:relative}.breakout-block:where(.astro-jeh5vkjj){display:inline-block;height:1rem;width:2rem;border-radius:.125rem}.breakout-block--normal:where(.astro-jeh5vkjj){background-color:#22d3ee}.breakout-block--bomb:where(.astro-jeh5vkjj){background-color:var(--color-netsuki-red)}.breakout-block--laser:where(.astro-jeh5vkjj){background-color:#d946ef}.breakout-block-marker:where(.astro-jeh5vkjj){position:absolute;font-size:var(--font-size-2xs);font-weight:700;color:var(--color-netsuki-white)}.breakout-block-name:where(.astro-jeh5vkjj){color:var(--color-netsuki-navy);font-size:var(--font-size-base);font-weight:700}.breakout-block-desc:where(.astro-jeh5vkjj){font-size:var(--font-size-sm);color:#4b5563}}