/* One row at a time: large choices, countable pictures and short steps. */
#tips-collection .row-tricks-invite {margin:16px 16px 12px;color:#3e614f;font-weight:600;line-height:1.5;}
#tips-collection .row-tricks-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 12px 14px;align-items:start;}
#tips-collection .row-trick {min-width:0;margin:0;border:1px solid #cbded4;border-radius:16px;background:#fff;overflow-wrap:anywhere;}
#tips-collection .row-trick>summary {display:grid;grid-template-columns:44px minmax(0,1fr) 16px;align-items:center;gap:10px;min-height:100px;padding:14px 12px;list-style:none;cursor:pointer;border-radius:15px;background:#f4faf6;}
#tips-collection .row-trick>summary::-webkit-details-marker {display:none;}
#tips-collection .row-trick>summary::marker {content:'';}
#tips-collection .row-trick>summary:focus-visible {outline:3px solid #077ea4;outline-offset:3px;}
#tips-collection .row-trick-number {display:grid;place-items:center;width:44px;height:48px;border-radius:12px;background:#e0f0e5;color:#205b40;font-size:28px;font-weight:700;line-height:1;}
#tips-collection .row-trick-title {display:flex;flex-direction:column;gap:4px;min-width:0;line-height:1.35;}
#tips-collection .row-trick-title strong {font-size:18px;color:#17324d;}
#tips-collection .row-trick-title>span {font-size:15px;color:#3e614f;}
#tips-collection .row-trick-arrow {width:16px;height:20px;fill:none;stroke:#426482;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
#tips-collection .row-trick[open] {grid-column:1/-1;border:2px solid #6aab87;}
#tips-collection .row-trick[open]>summary {min-height:82px;background:#edf7ef;border-radius:14px 14px 0 0;}
#tips-collection .row-trick[open] .row-trick-arrow {transform:rotate(90deg);}
#tips-collection .row-trick-body {padding:4px 20px 20px;}
#tips-collection .row-trick-body h4 {margin:14px 0 16px;font-size:26px;line-height:1.3;}
#tips-collection .row-trick-demo {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:center;}
#tips-collection .row-trick-picture {min-width:0;margin:0;padding:16px 12px;border:1px solid #d4e5db;border-radius:14px;background:#fff;}
#tips-collection .row-trick-picture>svg {display:block;width:100%;max-width:300px;height:auto;margin:auto;}
#tips-collection .row-dot-first {fill:#28765c;}
#tips-collection .row-dot-second {fill:#1757a5;}
#tips-collection .row-dot-away {fill:#edf0ed;stroke:#9ba99e;stroke-width:1;}
#tips-collection .row-dot-cross {fill:none;stroke:#ad4d38;stroke-width:2;stroke-linecap:round;}
#tips-collection .row-trick-picture figcaption {margin-top:14px;font-size:16px;font-weight:600;line-height:1.45;text-align:center;}
#tips-collection .row-trick-key {display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin-top:10px;font-size:15px;line-height:1.5;}
#tips-collection .row-trick-key>span {display:inline-flex;align-items:center;gap:6px;}
#tips-collection .row-trick-key i {width:10px;height:10px;border-radius:50%;flex:none;}
#tips-collection .row-key-first {background:#28765c;}
#tips-collection .row-key-second {background:#1757a5;}
#tips-collection .row-key-away {background:#edf0ed;border:1px solid #9ba99e;}
#tips-collection .row-trick-steps {display:grid;gap:16px;margin:0;padding:0;list-style:none;}
#tips-collection .row-trick-steps li {display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;}
#tips-collection .row-trick-steps li>span {display:grid;place-items:center;min-height:28px;border-radius:50%;background:#fff1d2;color:#85560e;font-size:16px;font-weight:700;}
#tips-collection .row-trick-steps p {margin:0;font-size:18px;line-height:1.5;}
#tips-collection .row-trick-steps strong {display:block;margin-top:5px;color:#204e7c;font-size:22px;line-height:1.4;}
#tips-collection .row-trick-answer {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 12px;margin:20px 0 0;padding:14px;border-radius:12px;background:#e6f3e9;color:#205b40;line-height:1.35;}
#tips-collection .row-trick-answer>span {font-size:17px;}
#tips-collection .row-trick-answer strong {font-size:28px;font-variant-numeric:tabular-nums;}
@media(max-width:850px) {
  #tips-collection .row-tricks-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:600px) {
  #tips-collection .row-trick-demo {grid-template-columns:minmax(0,1fr);gap:18px;}
  #tips-collection .row-trick-body {padding:0 14px 16px;}
  #tips-collection .row-trick-body h4 {font-size:24px;}
}
@media(max-width:450px) {
  #tips-collection .row-tricks-grid {gap:8px;padding:0 8px 10px;}
  #tips-collection .row-tricks-invite {margin:14px 10px 10px;font-size:17px;}
  #tips-collection .row-trick:not([open])>summary {grid-template-columns:minmax(0,1fr) 12px;gap:8px;min-height:148px;padding:12px 10px;align-items:start;}
  #tips-collection .row-trick:not([open]) .row-trick-title {grid-column:1/-1;}
  #tips-collection .row-trick:not([open]) .row-trick-arrow {grid-row:1;grid-column:2;align-self:center;width:12px;}
  #tips-collection .row-trick-title strong {font-size:16px;}
  #tips-collection .row-trick-title>span {font-size:14px;}
  #tips-collection .row-trick[open]>summary {gap:8px;padding:12px 10px;}
  #tips-collection .row-trick-steps p {font-size:17px;}
  #tips-collection .row-trick-steps strong {font-size:20px;}
}

/* Keep the familiar 9er place-value pattern beside the point-picture trick. */
#tips-collection .nine-place-trick .tips-note {font-size:16px;line-height:1.5;color:var(--muted);}
#tips-collection .nine-other-way {margin-top:20px;padding-top:8px;border-top:1px solid #d5e4df;}
#tips-collection .nine-other-way>summary {min-height:48px;padding:10px 0;font-weight:600;color:#205b40;}

/* Each sum has its own grouping picture: four pairs, or two groups of four. */
#tips-collection .pair-outline {fill:none;stroke:currentColor;stroke-width:1.5;}
#tips-collection .pairs-other-way {margin-top:20px;padding-top:8px;border-top:1px solid var(--line);}
#tips-collection .pairs-other-way>summary {min-height:48px;padding:10px 0;font-weight:600;color:var(--ink);}
#tips-collection .pairs-other-way>p {font-size:18px;line-height:1.5;}
#tips-collection .doubling-picture {max-width:300px;margin:16px auto;padding:12px;border:2px solid #506780;border-radius:14px;background:#fff;color:var(--ink);}
#tips-collection .doubling-picture>svg {display:block;width:100%;height:auto;}
#tips-collection .doubling-picture figcaption {margin-top:10px;font-size:16px;font-weight:600;line-height:1.45;text-align:center;}
#tips-collection .pairs-other-way .doubling-sum {margin:12px 0 0;text-align:center;font-size:24px;font-weight:700;color:var(--ink);}

/* The exchanged grouping also names its multiplication. */
#tips-collection .pairs-other-way .doubling-sum {font-size:20px;}
#tips-collection .doubling-product {margin:8px 0 0;text-align:center;font-size:28px;font-weight:700;line-height:1.4;}