.team-planner-page {
    --planner-ink: #392334;
    --planner-muted: #8d6679;
    --planner-pink: #ef4f8b;
    --planner-pink-dark: #b92f64;
    --planner-yellow: #ffd65c;
    --planner-mint: #bdf2dc;
    --planner-blue: #c7e7ff;
    --planner-red: #e74c6b;
    --planner-shadow: 0 22px 60px rgba(116, 48, 83, 0.14);
}

.team-planner-page button,
.team-planner-page input,
.team-planner-page select,
.team-planner-page textarea {
    font: inherit;
}

.planner-main {
    padding-bottom: 4rem !important;
}

.planner-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: end;
    padding: 1.5rem 0 1.1rem;
}

.planner-kicker,
.eyebrow {
    margin: 0 0 0.35rem;
    color: var(--planner-pink-dark);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.planner-intro .lead {
    max-width: 760px;
    margin-bottom: 0;
}

.planner-intro-meta {
    display: grid;
    gap: 0.45rem;
    min-width: 210px;
}

.planner-intro-meta span {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--planner-muted);
    font-size: 0.84rem;
    font-weight: 800;
}

.planner-intro-meta span::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--planner-pink);
    box-shadow: 0 0 0 5px rgba(239, 79, 139, 0.12);
}

.planner-shell,
.analysis-section,
.planner-guide,
.planner-content-section,
.planner-faq {
    margin-bottom: 2rem;
    border: 1px solid rgba(239, 79, 139, 0.18);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--planner-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.planner-shell {
    overflow: hidden;
}

.planner-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(360px, 1.5fr) auto;
    gap: 1.25rem;
    align-items: end;
    padding: 1.35rem;
    border-bottom: 1px solid rgba(239, 79, 139, 0.14);
    background:
        linear-gradient(110deg, rgba(255, 240, 247, 0.96), rgba(255, 255, 255, 0.96)),
        radial-gradient(circle at right top, rgba(255, 214, 92, 0.22), transparent 38%);
}

.planner-toolbar-title h2,
.analysis-header h2,
.planner-guide h2,
.planner-content-section h2,
.planner-faq h2 {
    margin: 0;
    color: var(--planner-ink);
    font-size: clamp(1.3rem, 2.2vw, 1.8rem);
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.planner-status {
    margin: 0.45rem 0 0;
    color: var(--planner-muted);
    font-size: 0.82rem;
}

.planner-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.planner-filters label,
.slot-field,
.picker-search-label,
.team-text-label {
    display: grid;
    gap: 0.35rem;
}

.planner-filters label > span,
.slot-field > span,
.picker-search-label > span,
.team-text-label > span {
    color: var(--planner-muted);
    font-size: 0.71rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.planner-filters select,
.slot-field select,
.slot-field input,
.picker-search-label input,
.team-text-label textarea {
    width: 100%;
    border: 1px solid rgba(79, 42, 62, 0.13);
    border-radius: 12px;
    background: #fff;
    color: var(--planner-ink);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.planner-filters select,
.slot-field select,
.slot-field input,
.picker-search-label input {
    min-height: 42px;
    padding: 0.58rem 0.7rem;
}

.planner-filters select:focus,
.slot-field select:focus,
.slot-field input:focus,
.picker-search-label input:focus,
.team-text-label textarea:focus {
    border-color: rgba(239, 79, 139, 0.66);
    box-shadow: 0 0 0 4px rgba(239, 79, 139, 0.11);
}

.planner-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.planner-btn,
.icon-button,
.slot-action,
.pokemon-option {
    border: 0;
    cursor: pointer;
}

.planner-btn {
    min-height: 42px;
    padding: 0.58rem 0.9rem;
    border: 1px solid rgba(239, 79, 139, 0.18);
    border-radius: 12px;
    background: #fff;
    color: var(--planner-ink);
    font-size: 0.8rem;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(98, 43, 70, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.planner-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(98, 43, 70, 0.12);
}

.planner-btn-primary {
    border-color: transparent;
    background: linear-gradient(135deg, var(--planner-pink), #ff7bac);
    color: #fff;
}

.planner-btn-danger {
    color: #b83355;
    background: #fff5f7;
}

.slot-index {
    display: none;
    gap: 0.45rem;
    padding: 0.8rem 1rem 0;
    overflow-x: auto;
}

.slot-index button {
    flex: 0 0 auto;
    min-width: 48px;
    min-height: 38px;
    border: 1px solid rgba(239, 79, 139, 0.18);
    border-radius: 999px;
    background: #fff;
    color: var(--planner-muted);
    font-weight: 900;
}

.slot-index button.is-filled {
    background: #fff0f6;
    color: var(--planner-pink-dark);
}

.slot-index button.is-active {
    background: var(--planner-ink);
    color: #fff;
}

.team-slot-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 1rem;
    background:
        linear-gradient(rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.58)),
        radial-gradient(circle at 20% 20%, rgba(199, 231, 255, 0.3), transparent 30%),
        radial-gradient(circle at 80% 70%, rgba(189, 242, 220, 0.28), transparent 28%);
}

.team-slot-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(239, 79, 139, 0.16);
    border-radius: 23px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 14px 32px rgba(89, 42, 66, 0.09);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.team-slot-card:hover {
    transform: translateY(-2px);
    border-color: rgba(239, 79, 139, 0.34);
    box-shadow: 0 20px 42px rgba(89, 42, 66, 0.14);
}

.slot-card-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0.8rem 0;
}

.slot-label {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--planner-muted);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.slot-label::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--planner-yellow);
    box-shadow: 0 0 0 4px rgba(255, 214, 92, 0.2);
}

.slot-actions {
    display: flex;
    gap: 0.35rem;
}

.slot-action,
.icon-button {
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: #fff4f8;
    color: var(--planner-pink-dark);
    font-weight: 900;
}

.slot-action {
    min-height: 30px;
    padding: 0 0.55rem;
    font-size: 0.7rem;
}

.slot-action-danger {
    color: #b83355;
    background: #fff0f2;
}

.slot-identity {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 0.85rem;
    align-items: center;
    min-height: 142px;
    padding: 0.35rem 0.85rem 0.75rem;
}

.slot-art-frame {
    position: relative;
    display: grid;
    place-items: center;
    width: 104px;
    height: 104px;
    border-radius: 28px 18px 28px 18px;
    background:
        radial-gradient(circle at 36% 30%, #fff 0 16%, transparent 17%),
        linear-gradient(145deg, #ffe9f2, #fff8d8 56%, #e7f8ff);
    overflow: hidden;
}

.slot-art-frame::after {
    content: "";
    position: absolute;
    inset: 7px;
    border: 1px dashed rgba(239, 79, 139, 0.27);
    border-radius: 22px 14px 22px 14px;
}

.slot-art-frame img {
    position: relative;
    z-index: 1;
    width: 94px;
    height: 94px;
    object-fit: contain;
    filter: drop-shadow(0 10px 10px rgba(75, 38, 58, 0.15));
}

.slot-art-placeholder {
    position: relative;
    z-index: 1;
    color: var(--planner-pink-dark);
    font-size: 2.2rem;
    font-weight: 900;
}

.slot-name {
    margin: 0;
    color: var(--planner-ink);
    font-size: 1.3rem;
    line-height: 1.04;
    letter-spacing: -0.025em;
}

.slot-number {
    margin: 0.3rem 0 0;
    color: var(--planner-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.slot-type-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.6rem;
}

.slot-type-pill {
    padding: 0.24rem 0.55rem;
    border-radius: 999px;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 900;
    text-transform: uppercase;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.08);
}

.choose-pokemon-button {
    width: 100%;
    padding: 0.7rem;
    border: 1px dashed rgba(239, 79, 139, 0.4);
    border-radius: 14px;
    background: #fff7fb;
    color: var(--planner-pink-dark);
    font-weight: 900;
    cursor: pointer;
}

.choose-pokemon-button:hover {
    background: #fff0f6;
}

.slot-fields {
    display: grid;
    gap: 0.72rem;
    padding: 0.85rem;
    border-top: 1px solid rgba(239, 79, 139, 0.11);
    background: #fffafd;
}

.slot-fields[aria-disabled="true"] {
    opacity: 0.55;
    pointer-events: none;
}

.slot-fields-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
}

.move-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.move-input-wrap {
    position: relative;
}

.move-input-wrap::before {
    content: "";
    position: absolute;
    left: 0.55rem;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--planner-pink);
    transform: translateY(-50%);
}

.move-input-wrap input {
    padding-left: 1.25rem;
    font-size: 0.77rem;
}

.analysis-section {
    padding: 1.2rem;
}

.analysis-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 500px);
    gap: 1.5rem;
    align-items: end;
    padding: 0.25rem 0.15rem 1rem;
}

.analysis-header > p {
    margin: 0;
    color: var(--planner-muted);
    font-size: 0.84rem;
}

.analysis-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.analysis-panel {
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(72, 44, 58, 0.1);
    border-radius: 20px;
    background: #fff;
}

.analysis-panel-wide {
    grid-column: 1 / -1;
}

.panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.8rem;
}

.panel-heading > div {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.panel-heading h3 {
    margin: 0;
    color: var(--planner-ink);
    font-size: 1rem;
}

.panel-heading p {
    max-width: 430px;
    margin: 0;
    color: var(--planner-muted);
    font-size: 0.74rem;
    text-align: right;
}

.panel-number {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: var(--planner-ink);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 900;
}

.empty-analysis {
    min-height: 74px;
    display: grid;
    place-items: center;
    border: 1px dashed rgba(239, 79, 139, 0.24);
    border-radius: 14px;
    color: var(--planner-muted);
    font-size: 0.82rem;
    text-align: center;
}

.matchup-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.55rem;
}

.matchup-item {
    padding: 0.65rem;
    border-radius: 14px;
    background: #fff8fb;
    text-align: center;
}

.matchup-item.is-danger {
    background: #fff0f3;
    box-shadow: inset 0 0 0 1px rgba(231, 76, 107, 0.18);
}

.matchup-type {
    display: block;
    margin-bottom: 0.42rem;
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.matchup-counts {
    display: flex;
    justify-content: center;
    gap: 0.35rem;
    font-size: 0.65rem;
    font-weight: 900;
}

.matchup-counts .weak { color: #c83455; }
.matchup-counts .resist { color: #16845d; }
.matchup-counts .immune { color: #3776a6; }

.coverage-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.coverage-chip {
    padding: 0.48rem 0.68rem;
    border-radius: 12px;
    background: #f6f7fb;
    color: var(--planner-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.coverage-chip.is-covered {
    color: #17684c;
    background: #e8fbf3;
}

.coverage-chip.is-missing {
    color: #9a3a57;
    background: #fff1f5;
}

.role-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.48rem;
}

.role-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.58rem 0.65rem;
    border-radius: 12px;
    color: var(--planner-muted);
    background: #f8f7fa;
    font-size: 0.75rem;
    font-weight: 850;
}

.role-item::before {
    content: "×";
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: #a04b65;
    background: #ffe8ef;
    font-size: 0.72rem;
}

.role-item.is-ready {
    color: #17684c;
    background: #eafaf4;
}

.role-item.is-ready::before {
    content: "✓";
    color: #17684c;
    background: #c7f3df;
}

.optimizer-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.6rem;
}

.optimizer-card {
    padding: 0.75rem;
    border-radius: 15px;
    background: linear-gradient(145deg, #fff7fb, #fff);
    border: 1px solid rgba(239, 79, 139, 0.12);
}

.optimizer-card strong {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--planner-ink);
    font-size: 0.82rem;
}

.optimizer-card p {
    margin: 0.2rem 0;
    color: var(--planner-muted);
    font-size: 0.72rem;
}

.optimizer-card button {
    margin-top: 0.45rem;
    padding: 0.4rem 0.62rem;
    border: 0;
    border-radius: 9px;
    background: var(--planner-ink);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 900;
    cursor: pointer;
}

.planner-guide {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
    gap: 2rem;
    padding: 1.5rem;
}

.guide-copy p:not(.eyebrow) {
    color: var(--planner-muted);
    font-size: 0.9rem;
}

.guide-steps {
    display: grid;
    gap: 0.6rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guide-steps li {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 0.7rem;
    align-items: start;
    padding: 0.75rem;
    border-radius: 16px;
    background: #fff7fb;
}

.guide-steps li > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--planner-pink);
    color: #fff;
    font-weight: 900;
}

.guide-steps strong {
    color: var(--planner-ink);
    font-size: 0.86rem;
}

.guide-steps p {
    margin: 0.15rem 0 0;
    color: var(--planner-muted);
    font-size: 0.74rem;
}

.planner-content-section {
    padding: 1.5rem;
}

.content-section-heading {
    max-width: 820px;
    margin-bottom: 1rem;
}

.content-section-heading > p:not(.eyebrow),
.planner-method-copy p,
.planner-limit-note {
    color: var(--planner-muted);
    font-size: 0.9rem;
}

.content-section-heading > p:not(.eyebrow) {
    margin: 0.55rem 0 0;
}

.planner-copy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.planner-copy-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.planner-copy-card {
    padding: 1rem;
    border: 1px solid rgba(239, 79, 139, 0.13);
    border-radius: 18px;
    background: linear-gradient(145deg, #fff7fb, #fff);
}

.planner-copy-card h3 {
    margin: 0 0 0.45rem;
    color: var(--planner-ink);
    font-size: 0.98rem;
    line-height: 1.25;
}

.planner-copy-card p {
    margin: 0;
    color: var(--planner-muted);
    font-size: 0.82rem;
}

.planner-method-copy {
    display: grid;
    gap: 0.75rem;
}

.planner-method-copy p,
.planner-limit-note {
    margin: 0;
}

.planner-limit-note {
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border-left: 4px solid var(--planner-pink);
    border-radius: 0 14px 14px 0;
    background: #fff7fb;
}

.planner-faq {
    padding: 1.4rem;
}

.planner-faq h2 {
    margin-bottom: 0.8rem;
}

.planner-faq details {
    border-top: 1px solid rgba(239, 79, 139, 0.14);
    padding: 0.85rem 0;
}

.planner-faq summary {
    color: var(--planner-ink);
    font-weight: 900;
    cursor: pointer;
}

.planner-faq details p {
    margin-bottom: 0;
    color: var(--planner-muted);
}

.planner-dialog {
    width: min(960px, calc(100vw - 2rem));
    max-height: min(820px, calc(100vh - 2rem));
    padding: 0;
    border: 0;
    border-radius: 26px;
    color: var(--planner-ink);
    background: transparent;
    box-shadow: 0 30px 90px rgba(54, 27, 42, 0.35);
}

.planner-dialog::backdrop {
    background: rgba(45, 24, 36, 0.54);
    backdrop-filter: blur(7px);
}

.dialog-shell {
    max-height: min(820px, calc(100vh - 2rem));
    overflow: auto;
    padding: 1.2rem;
    border: 1px solid rgba(239, 79, 139, 0.2);
    border-radius: 26px;
    background: #fffafd;
}

.dialog-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.9rem;
}

.dialog-header h2 {
    margin: 0;
    color: var(--planner-ink);
}

.icon-button {
    width: 38px;
    height: 38px;
    font-size: 1.25rem;
}

.dialog-note {
    color: var(--planner-muted);
    font-size: 0.78rem;
}

.pokemon-picker-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.6rem;
}

.pokemon-option {
    display: grid;
    justify-items: center;
    gap: 0.35rem;
    min-width: 0;
    padding: 0.65rem;
    border: 1px solid rgba(239, 79, 139, 0.13);
    border-radius: 16px;
    background: #fff;
    color: var(--planner-ink);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.pokemon-option:hover {
    transform: translateY(-2px);
    border-color: rgba(239, 79, 139, 0.42);
    box-shadow: 0 12px 22px rgba(89, 42, 66, 0.1);
}

.pokemon-option img {
    width: 78px;
    height: 78px;
    object-fit: contain;
}

.pokemon-option strong {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
}

.pokemon-option small {
    color: var(--planner-muted);
    font-size: 0.62rem;
    text-transform: uppercase;
}

.team-text-label textarea {
    min-height: 360px;
    padding: 0.85rem;
    resize: vertical;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
    line-height: 1.55;
}

.dialog-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.planner-toast {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 3000;
    max-width: min(360px, calc(100vw - 2.5rem));
    padding: 0.75rem 0.95rem;
    border-radius: 14px;
    background: var(--planner-ink);
    color: #fff;
    box-shadow: 0 18px 42px rgba(54, 27, 42, 0.28);
    font-size: 0.8rem;
    font-weight: 800;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.planner-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 1060px) {
    .planner-toolbar {
        grid-template-columns: 1fr 1.4fr;
    }

    .planner-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .team-slot-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .matchup-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .optimizer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .site-header-unified .site-header-inner {
        border-radius: 22px;
    }

    body.rp-tool-page .site-header-unified .route-pills {
        display: none;
    }

    .planner-intro,
    .analysis-header,
    .planner-guide {
        grid-template-columns: 1fr;
    }

    .planner-intro {
        gap: 0.8rem;
    }

    .planner-intro-meta {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-width: 0;
    }

    .planner-intro-meta span {
        align-items: flex-start;
        font-size: 0.67rem;
    }

    .planner-toolbar {
        grid-template-columns: 1fr;
    }

    .planner-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .planner-actions {
        grid-column: auto;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .slot-index {
        display: flex;
    }

    .team-slot-grid {
        display: flex;
        gap: 0.75rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding: 0.8rem 1rem 1rem;
        scrollbar-width: thin;
    }

    .team-slot-card {
        flex: 0 0 calc(100vw - 4rem);
        max-width: 460px;
        scroll-snap-align: center;
    }

    .analysis-grid {
        grid-template-columns: 1fr;
    }

    .analysis-panel-wide {
        grid-column: auto;
    }

    .panel-heading {
        display: grid;
    }

    .panel-heading p {
        text-align: left;
    }

    .matchup-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .optimizer-grid,
    .pokemon-picker-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .planner-guide {
        gap: 1rem;
    }

    .planner-copy-grid,
    .planner-copy-grid-three {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 460px) {
    body.rp-tool-page .container {
        padding: 0 14px;
    }

    .planner-intro-meta {
        grid-template-columns: 1fr;
    }

    .planner-filters {
        grid-template-columns: 1fr;
    }

    .planner-actions {
        grid-template-columns: 1fr 1fr;
    }

    .team-slot-card {
        flex-basis: calc(100vw - 3.25rem);
    }

    .slot-identity {
        grid-template-columns: 88px minmax(0, 1fr);
    }

    .slot-art-frame {
        width: 88px;
        height: 88px;
    }

    .slot-art-frame img {
        width: 80px;
        height: 80px;
    }

    .slot-fields-row,
    .move-grid,
    .role-list {
        grid-template-columns: 1fr;
    }

    .matchup-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .optimizer-grid {
        grid-template-columns: 1fr;
    }

    .planner-dialog {
        width: calc(100vw - 1rem);
    }

    .dialog-shell {
        padding: 0.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .team-planner-page *,
    .team-planner-page *::before,
    .team-planner-page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}