.meditation-tools {
  flex:1 0 100%;
  padding-block-start:7px;
  border-block-start:1px solid #9e79534d;
}
.meditation-tools-head {display:flex;justify-content:space-between;align-items:center;gap:10px;margin-block-end:5px}
.meditation-tools-head strong {font:700 15px var(--serif);color:#f7deb9}
.meditation-tools-head button {color:#f2c991;background:transparent;border:0;padding:4px 3px;text-decoration:underline;text-underline-offset:3px}
.meditation-tool-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.meditation-tool {
  display:flex;align-items:center;gap:8px;text-align:start;padding:5px 9px;
  min-width:0;min-height:62px;border:1px solid #ac80556e;border-radius:6px;color:#f4dfc4;
  background:linear-gradient(140deg,#503628,#31231b);touch-action:manipulation;
}
.meditation-tool:hover {border-color:#e6b679;background:#503526}
.meditation-tool:focus-visible,.meditation-tools-head button:focus-visible {outline:2px solid #ffd598;outline-offset:2px}
.meditation-tool>span {display:flex;flex-wrap:wrap;gap:1px 10px;align-items:center;min-width:0}
.meditation-tool strong {font-size:.83rem;flex-basis:100%;line-height:1.1}
.meditation-tool>span>span,.meditation-tool output {font-size:.73rem;color:#f3cb95}
.meditation-tool output {font-weight:700;font-variant-numeric:tabular-nums}
.meditation-tool kbd {display:inline-block;min-width:15px;text-align:center;border:1px solid #98714e;border-radius:3px;padding:0 2px;font-size:.66rem}
.meditation-tool svg {width:47px;height:43px;flex:none;direction:ltr}
.practice-beads circle {fill:#bd714b;stroke:#ecb785;stroke-width:.65}
.practice-beads .bead-selected {fill:#fff1bb;stroke:#fff4c9;filter:drop-shadow(0 0 3px #ffba67)}
.practice-wheel-drum {transform-origin:32px 22px}
.practice-wheel-spin {animation:practice-spin .52s ease-out}
@keyframes practice-spin { to {transform:rotateY(360deg)} }
.ritual-body .meditation-tool-hint {margin:4px 0 0;color:#e1c39b;font-size:.7rem;line-height:1.3}

.practice-records {width:min(600px,calc(100vw - 28px))}
.practice-records .co-close {inset-inline: auto 16px;right:auto}
.practice-records h2 {margin:.22em 40px .48em 0;margin-inline:0 40px}
.practice-records h3 {font:700 1.05rem var(--co-serif);margin:0 0 7px}
.practice-summary {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.practice-summary>div {min-width:0;padding:9px;border:1px solid var(--co-line);border-radius:5px;background:#fcf7ec}
.practice-summary>div>strong {display:block;color:var(--co-red);font-size:.88rem;margin-block-end:5px}
.practice-summary>div>div {display:flex;justify-content:space-between;align-items:baseline;gap:3px;flex-wrap:wrap;font-size:.76rem;color:var(--co-muted)}
.practice-summary b {color:var(--co-ink);font-variant-numeric:tabular-nums}
.practice-day,.practice-board-scope,.practice-board-status {font-size:.78rem;line-height:1.4;color:var(--co-muted);margin:8px 0}
.practice-board-status:empty {display:none}
.practice-guest,.practice-board {margin-block-start:15px;border-block-start:1px solid var(--co-line);padding-block-start:12px}
.practice-guest p {color:var(--co-muted);font-size:.88rem;margin:0 0 6px}
.practice-guest .co-primary {margin-block-start:6px}
.practice-board-heading,.practice-filters {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}
.practice-board-heading h3 {margin:0}
.practice-filters {margin-block-start:7px}
.practice-filters .co-tabs {flex-wrap:wrap}
.practice-filters .co-tabs button {font-size:.78rem;padding:5px 8px;min-height:33px}
.practice-rank-head,.practice-rank-list li {display:grid;grid-template-columns:minmax(50px,auto) minmax(0,1fr) minmax(45px,auto);gap:8px;align-items:center;padding:7px 8px;font-size:.85rem}
.practice-rank-head[hidden] {display:none}
.practice-rank-head {color:var(--co-muted);font-size:.74rem;border-block-end:1px solid var(--co-line)}
.practice-rank-list {list-style:none;padding:0;margin:0}
.practice-rank-list li {border-block-end:1px solid #ddcfb690}
.practice-rank-list li:nth-child(even) {background:#efe4cf55}
.practice-rank-list li.practice-rank-self {background:#ecdab9}
.practice-rank-list bdi {overflow-wrap:anywhere}
.practice-rank-list small {color:var(--co-red);font-size:.7rem}
.practice-rank-list strong,.practice-rank-head span:last-child {text-align:end;font-variant-numeric:tabular-nums}
@media(max-width:540px) {
  .meditation-tool {gap:4px;padding:4px 5px;min-height:55px}
  .meditation-tool svg {width:35px;height:37px}
  .practice-summary {gap:4px}
  .practice-summary>div {padding:6px}
}
@media(prefers-reduced-motion:reduce) {.practice-wheel-spin {animation:none}}
