.tlq98-qibla{background:linear-gradient(145deg,#0b382e,#0a7655);color:#fff;border-radius:26px;padding:clamp(20px,5vw,27px);margin:21px 0 100px;overflow:hidden;box-shadow:0 16px 32px #0d52351e}
.tlq98-qibla-heading{display:flex;gap:10px;align-items:flex-start}
.tlq98-qibla-heading>div{flex:1}
.tlq98-qibla-heading span:first-child{font-size:10px;color:#f5daa4;font-weight:900;letter-spacing:.12em}
.tlq98-qibla-heading h2{color:#fff;font-size:clamp(22px,5.5vw,30px);font-weight:950;line-height:1.25;letter-spacing:-.04em;margin:13px 0}
.tlq98-qibla-heading p{font-size:12px;color:#d9eee2;line-height:1.75}
.tlq98-qibla-icon{width:44px;height:44px;border:1px solid #ffffff55;display:grid;place-items:center;border-radius:13px;color:#e9d69c}
.tlq98-qibla-status{padding:12px 14px;background:#ffffff17;border:1px solid #ffffff30;border-radius:13px;font-size:12px;line-height:1.65;font-weight:850;text-align:center;margin:19px 0}
.tlq98-compass-wrap{display:grid;place-items:center;margin:23px 0}
.tlq98-compass{width:min(68vw,280px);aspect-ratio:1;border:2px solid #e2d69b9c;border-radius:50%;background:radial-gradient(circle at center,#ffffff26,#ffffff09 55%,#ffffff10);box-shadow:0 0 0 12px #ffffff08,0 14px 34px #002c2159,inset 0 0 0 10px #ffffff10;position:relative}
.tlq98-compass-disc{position:absolute;inset:10px;border:1px dashed #d8dbac80;border-radius:50%;color:#f4ecce}
.tlq98-compass-disc>span:not(.tlq98-compass-center){position:absolute;font-size:12px;font-weight:900}
.tlq98-n{top:8px;left:50%;transform:translateX(-50%)}
.tlq98-e{right:11px;top:50%;transform:translateY(-50%)}
.tlq98-s{bottom:9px;left:50%;transform:translateX(-50%)}
.tlq98-w{left:11px;top:50%;transform:translateY(-50%)}
.tlq98-compass-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:26px;color:#f8e6b1;opacity:.7}
.tlq98-qibla-needle{position:absolute;left:50%;top:50%;width:32px;height:78%;transform:translate(-50%,-50%) rotate(0deg);transform-origin:50% 50%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;transition:transform .23s ease-out;pointer-events:none}
.tlq98-qibla-head{font-size:29px;line-height:1;color:#ffdb75;text-shadow:0 0 15px #ffc65b91;margin-top:-3px}
.tlq98-qibla-line{height:47%;width:5px;border-radius:10px;background:linear-gradient(#f2e4a0,#f1e2a275);box-shadow:0 0 11px #fbd67575}
.tlq98-device-line{width:5px;height:15px;position:absolute;left:50%;top:-9px;transform:translateX(-50%);background:#fff;border-radius:5px;box-shadow:0 0 8px #fff8}
.tlq98-aligned .tlq98-compass{animation:tlq98-pulse 2.2s ease-in-out infinite}
@keyframes tlq98-pulse{50%{box-shadow:0 0 0 20px #f5d58515,0 14px 36px #002c214f,0 0 32px #f9dd6b41}}
.tlq98-qibla-readings{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.tlq98-qibla-readings>div{border:1px solid #ffffff30;background:#ffffff14;border-radius:13px;padding:13px}
.tlq98-qibla-readings small{display:block;color:#c7e3d4;font-size:10px;line-height:1.45}
.tlq98-qibla-readings strong{display:block;color:#fff;font-size:clamp(15px,4vw,20px);margin-top:8px}
.tlq98-qibla-hint{font-size:11px;line-height:1.7;color:#def0e3;margin:18px 0}
.tlq98-qibla-controls{display:grid;grid-template-columns:1.5fr 1fr;gap:10px}
.tlq98-qibla-controls button{border:1px solid #ffffff5e;border-radius:12px;background:#ffffff21;color:#fff;font-size:11px;min-height:46px;display:flex;align-items:center;justify-content:center;gap:6px;font-weight:900;padding:8px}
.tlq98-qibla-controls [data-tlq98-locate]{background:#f5dc9f;color:#1b4f3a;border:0}
.tlq98-qibla-manual{margin-top:20px;border-top:1px solid #ffffff27;padding-top:16px}
.tlq98-qibla-manual summary{font-size:11px;font-weight:900;color:#f3e5b7;cursor:pointer}
.tlq98-qibla-manual-inside{margin-top:15px;display:grid;gap:10px}
.tlq98-qibla-manual label{font-size:11px;color:#dfeee4}
.tlq98-qibla-manual select{display:block;width:100%;color:#18533d;background:#fff;border-radius:10px;padding:12px;margin-top:7px}
.tlq98-qibla-manual button{padding:12px;border:0;background:#d7ebd7;color:#1c6347;border-radius:10px;font-size:12px;font-weight:900}
.tlq98-qibla-manual small,.tlq98-qibla-note{font-size:10px;line-height:1.7;color:#bed9c9}
.tlq98-qibla-note{margin:22px 0 0}
@media(prefers-reduced-motion:reduce){.tlq98-qibla-needle{transition:none}.tlq98-aligned .tlq98-compass{animation:none}}