.kw .hero{gap:10px;max-width:760px;padding-block:40px 20px;display:grid}.kw h1{font-size:clamp(1.7rem,4vw,2.4rem)}.kw .lead{font-size:1.02rem}.kw .tabs{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.kw .tabs .chip{padding:6px 16px;font-size:.9rem}.kw .box{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);overflow:hidden}.kw .pane{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);min-height:560px;display:grid}.kw .pane[hidden]{display:none}.kw #tab-similar{grid-template-columns:minmax(0,1fr)}.kw .stage{border-inline-end:1px solid var(--line);min-height:560px;position:relative}.kw .stage canvas{cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}.kw .tip{pointer-events:none;background:var(--raise);border:1px solid var(--line);white-space:nowrap;border-radius:8px;padding:4px 10px;font-size:.8rem;position:absolute;transform:translate(-50%,-140%)}.kw .reset{top:12px;background:var(--surface);font-size:.8rem;position:absolute;inset-inline-end:12px}.kw .side{align-content:start;gap:12px;min-width:0;max-height:720px;padding:18px;display:grid;overflow-y:auto}.kw .list-side{border-inline-end:1px solid var(--line)}.kw .detail{align-content:start;gap:14px;min-width:0;max-height:820px;padding:18px;display:grid;overflow-y:auto}.kw .h{color:var(--muted);margin-top:6px;font-size:.85rem;font-weight:400}.kw .small{font-size:.8rem}.kw .pad{padding:10px 4px}.kw ol{gap:4px;margin:0;padding:0;list-style:none;display:grid}.kw .rowbtn{text-align:start;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;width:100%;padding:6px 10px;display:grid}.kw .rowbtn:hover{background:var(--raise)}.kw .rowbtn[aria-pressed=true]{border-color:var(--gold)}.kw .lem{font-size:1.25rem;line-height:1.7}.kw .lem.big{color:var(--gold);font-size:2.4rem;line-height:1.5}.kw .root{letter-spacing:.3em;color:var(--fg)}.kw .rhead{justify-items:start;gap:4px;display:grid}.kw .ph{font-size:1.2rem;line-height:1.9}.kw .ph.big{color:var(--gold);font-size:1.9rem}.kw .field{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex}.kw .field:focus-within{border-color:var(--gold)}.kw .field input{background:0 0;border:0;outline:none;flex:1;min-width:0;font-size:1rem}.kw .visually-hidden{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.kw .filter{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;font-size:.85rem;display:flex}.kw .plist{max-height:620px;overflow-y:auto}.kw .phead{grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:16px;display:grid}.kw .mini{cursor:grab;width:200px;height:200px;display:block}.kw .cards{gap:10px}.kw .cards.grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.kw .card .ayah{text-align:start;cursor:pointer;background:var(--bg);border:1px solid var(--line);border-radius:12px;align-content:start;gap:6px;width:100%;height:100%;padding:12px 14px;display:grid}.kw .card .ayah:hover{border-color:var(--muted)}.kw .t{font-size:1.3rem;line-height:2.1;display:block}.kw .end{color:var(--muted);font-size:.8rem;font-family:var(--f-ui)}.kw .m{color:var(--muted);flex-wrap:wrap;gap:10px;font-size:.76rem;display:flex}.kw .m b{color:var(--gold);font-weight:400}.kw .track{background:var(--line);border-radius:2px;height:4px;display:block;overflow:hidden}.kw .fill{background:var(--gold);height:100%;display:block}.kw .pick{flex-wrap:wrap;align-items:center;gap:12px;padding:18px 18px 0;display:flex}.kw .pick label{align-items:center;gap:8px;font-size:.9rem;display:flex}.kw .pick select,.kw .pick input{font:inherit;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:6px 10px}.kw .pick input{width:6em}.kw .source{border-bottom:1px solid var(--line);gap:6px;padding-bottom:14px;display:grid}.kw .source .t{font-size:1.6rem}.kw .method{margin-block:8px 40px}@media (width<=900px){.kw .pane{grid-template-columns:minmax(0,1fr)}.kw .stage{aspect-ratio:1;border-inline-end:0;border-bottom:1px solid var(--line);min-height:0}.kw .list-side{border-inline-end:0;border-bottom:1px solid var(--line)}.kw .plist{max-height:300px}.kw .side,.kw .detail{max-height:none}.kw .phead{grid-template-columns:minmax(0,1fr) 140px}.kw .mini{width:140px;height:140px}.kw .cards.grid{grid-template-columns:minmax(0,1fr)}}
