:root{--bg: #f6f4ef;--card: #ffffff;--ink: #1b2233;--muted: #4a5266;--line: #cfccc2;--focus: #1d5fd1;--error: #a3221a;--cyclic: #e4e4e4;--cyclic-edge: #5d5d5d;--alternating: #fde0c4;--alternating-edge: #a35400;--classical: #cde2f7;--classical-edge: #1f5f99;--exceptional: #ddd3f4;--exceptional-edge: #5a3fa0;--tits: #f7d3e5;--tits-edge: #a3306a;--mathieu: #d3efd8;--mathieu-edge: #2c7a3f;--leech: #c6ebe6;--leech-edge: #0f6b62;--monster: #fbe6a6;--monster-edge: #846000;--pariah: #f7d0c7;--pariah-edge: #a33a22;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.5}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.page{max-width:1260px;margin:0 auto;padding:16px 14px 40px}h1{font-size:1.9rem;line-height:1.2;margin:6px 0 10px}h2{font-size:1.2rem;margin:0 0 10px}h3{font-size:.9rem;margin:0 0 6px}a{color:var(--focus)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}sub,sup{font-size:.72em;line-height:0}.muted{color:var(--muted)}.small{font-size:.85rem}.num{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.badge{display:inline-block;margin:0;padding:2px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-size:.85rem;color:var(--muted)}.intro p{max-width:76ch}.tools{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 20px;margin:18px 0 8px}.search{display:flex;flex-direction:column;gap:4px;flex:1 1 260px;max-width:420px}.search label{font-weight:600}input{font:inherit;min-height:44px;padding:6px 10px;border:2px solid #6d7385;border-radius:8px;background:var(--card);color:var(--ink);width:100%}input[aria-invalid=true]{border-color:var(--error)}.count{margin:0 0 10px;color:var(--muted)}.legend{list-style:none;padding:0;margin:10px 0 4px;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.88rem}.legend li{display:flex;align-items:center;gap:6px}.swatch{display:inline-block;width:20px;height:16px;border-radius:4px;border:2px solid}.legend-wrap .small{margin:4px 0 0;max-width:90ch}.block{margin-top:22px}.family-grid{display:grid;grid-template-columns:repeat(18,minmax(0,1fr));gap:5px}.col-head{font-size:.72rem;font-weight:600;color:var(--muted);border-bottom:2px solid var(--line);padding-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.span-1{grid-column:span 1}.span-6{grid-column:span 6}.span-10{grid-column:span 10}.tile{font:inherit;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;min-height:64px;overflow:hidden;padding:6px 2px;border:2px solid;border-radius:8px;cursor:pointer;text-align:center}.tile.twisted{border-style:dashed;border-width:3px}.tile.selected{box-shadow:0 0 0 3px var(--ink)}.tile-sym{font-size:1.02rem;font-weight:700;line-height:1.3;white-space:nowrap}.tile-cap{font-size:.66rem;line-height:1.1;color:var(--ink);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kind-cyclic{background:var(--cyclic);border-color:var(--cyclic-edge)}.kind-alternating{background:var(--alternating);border-color:var(--alternating-edge)}.kind-classical{background:var(--classical);border-color:var(--classical-edge)}.kind-exceptional{background:var(--exceptional);border-color:var(--exceptional-edge)}.kind-tits{background:var(--tits);border-color:var(--tits-edge)}.gen-mathieu{background:var(--mathieu);border-color:var(--mathieu-edge)}.gen-leech{background:var(--leech);border-color:var(--leech-edge)}.gen-monster{background:var(--monster);border-color:var(--monster-edge)}.gen-pariah{background:var(--pariah);border-color:var(--pariah-edge)}.swatch.twisted{border-style:dashed}.clusters{display:flex;flex-wrap:wrap;gap:14px 18px}.cluster{min-width:0;max-width:100%}.cluster-grid{display:grid;grid-template-columns:repeat(auto-fill,66px);gap:5px;max-width:100%}.cluster:nth-child(1) .cluster-grid{width:350px}.cluster:nth-child(2) .cluster-grid{width:492px}.cluster:nth-child(3) .cluster-grid{width:563px}.cluster:nth-child(4) .cluster-grid{width:421px}.cluster:nth-child(5) .cluster-grid{width:66px}.cluster .tile-sym{font-size:1.1rem}.empty{margin:16px 0;padding:12px 14px;border:1px dashed var(--line);border-radius:8px;background:var(--card)}.panel{margin-top:24px;padding:14px 16px 16px;border-radius:12px;border:3px solid var(--ink);background:var(--card);overflow-wrap:anywhere}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.panel h2{font-size:1.35rem;margin:0}.panel h2:focus{outline:none}.panel h2:focus-visible{outline:3px solid var(--focus)}.close{font:inherit;min-height:44px;min-width:72px;padding:6px 14px;border:2px solid var(--ink);border-radius:8px;background:var(--card);color:var(--ink);cursor:pointer}.kindline{margin:2px 0 10px;color:var(--muted)}.facts,.order{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 14px;margin:0 0 10px}.facts dt,.order dt{font-weight:600}.facts dd,.order dd{margin:0;min-width:0}.formula{font-size:.95rem}.picker{border:1px solid var(--line);border-radius:10px;padding:10px 12px 12px;margin:12px 0;min-width:0}.picker legend{font-weight:600;padding:0 4px}.fields{display:flex;flex-wrap:wrap;gap:10px 18px}.field{flex:0 1 220px;min-width:0}.field label{display:block;margin-bottom:2px}.param{font-weight:700;font-style:italic}.hint{color:var(--muted);font-size:.85rem;margin:2px 0 0}.error{color:var(--error);margin:4px 0 0;font-weight:600}.live{margin-top:10px}.member{font-weight:700;margin:0 0 6px}.cofactor{font-style:italic;color:var(--muted)}.note{margin:10px 0 0}.foot{margin-top:36px;padding-top:12px;border-top:1px solid var(--line);font-size:.9rem}.foot p{max-width:90ch}@media(max-width:1099px){.family-grid{grid-template-columns:repeat(9,minmax(0,1fr))}.col-head{display:none}}@media(max-width:640px){h1{font-size:1.5rem}.tile-sym,.cluster .tile-sym{font-size:.95rem}.family-grid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.clusters,.cluster{width:100%}.cluster:nth-child(n) .cluster-grid{width:auto;grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.facts,.order{grid-template-columns:minmax(0,1fr);gap:2px}.facts dd,.order dd{margin-bottom:6px}}@media(prefers-reduced-motion:no-preference){.tile{transition:transform .12s ease,box-shadow .12s ease}.tile:hover{transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
