.tpds-widget {
    --tpds-widget-dark:#0b1f3a;
    --tpds-widget-blue:#57c4e5;
    --tpds-widget-green:#16a085;
    --tpds-widget-red:#b91c1c;
    --tpds-widget-border:#dbe5ee;
    box-sizing:border-box;
    width:100%;
    color:#172033;
    background:#fff;
    border:1px solid var(--tpds-widget-border);
    border-top:4px solid var(--tpds-widget-blue);
    font-family:inherit;
}

.tpds-widget *,
.tpds-widget *::before,
.tpds-widget *::after {
    box-sizing:border-box;
}

.tpds-widget-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:17px 18px 14px;
    border-bottom:1px solid #e7edf3;
}

.tpds-widget-head span {
    display:block;
    color:#4a647e;
    font-size:10px;
    font-weight:900;
    letter-spacing:.55px;
}

.tpds-widget-head h3 {
    margin:3px 0 0;
    color:var(--tpds-widget-dark);
    font-size:20px;
    line-height:1.2;
    font-weight:900;
}

.tpds-widget-live {
    display:flex !important;
    align-items:center;
    gap:6px;
    color:#047857 !important;
    white-space:nowrap;
}

.tpds-widget-live i {
    width:8px;
    height:8px;
    display:inline-block;
    border-radius:50%;
    background:#10b981;
    box-shadow:0 0 0 4px rgba(16,185,129,.12);
}

.tpds-earthquake-widget-list {
    display:flex;
    flex-direction:column;
}

.tpds-earthquake-widget-item {
    display:grid;
    grid-template-columns:58px minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    min-height:72px;
    padding:11px 15px;
    color:inherit;
    border-bottom:1px solid #edf1f5;
    text-decoration:none;
    transition:background .18s ease,border-color .18s ease;
}

.tpds-earthquake-widget-item:hover {
    background:#f6fbfd;
}

.tpds-earthquake-widget-item.is-critical {
    border-left:4px solid var(--tpds-widget-red);
    background:#fff8f8;
}

.tpds-earthquake-widget-mag {
    min-height:48px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
    background:var(--tpds-widget-dark);
    font-size:21px;
    line-height:1;
    font-weight:900;
}

.tpds-earthquake-widget-item.is-critical .tpds-earthquake-widget-mag {
    background:var(--tpds-widget-red);
}

.tpds-earthquake-widget-mag small {
    margin-top:3px;
    font-size:8px;
    font-weight:800;
}

.tpds-earthquake-widget-copy {
    min-width:0;
}

.tpds-earthquake-widget-copy b,
.tpds-earthquake-widget-copy small {
    display:block;
}

.tpds-earthquake-widget-copy b {
    overflow:hidden;
    color:#0b1f3a;
    font-size:13px;
    line-height:1.35;
    font-weight:900;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.tpds-earthquake-widget-copy small {
    margin-top:4px;
    color:#64748b;
    font-size:10px;
    line-height:1.4;
}

.tpds-earthquake-widget-item time {
    color:#64748b;
    font-size:9px;
    font-weight:700;
    white-space:nowrap;
}

.tpds-widget-footer-link {
    min-height:43px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 16px;
    color:#fff !important;
    background:var(--tpds-widget-dark);
    text-decoration:none;
    font-size:11px;
    font-weight:900;
}

.tpds-widget-footer-link span {
    font-size:18px;
}

.tpds-widget-empty {
    padding:24px 18px;
    color:#64748b;
    font-size:12px;
    line-height:1.6;
}

.tpds-earthquake-widget.is-wide .tpds-earthquake-widget-list {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1px;
    background:#e7edf3;
}

.tpds-earthquake-widget.is-wide .tpds-earthquake-widget-item {
    grid-template-columns:58px minmax(0,1fr);
    background:#fff;
    border:0;
}

.tpds-earthquake-widget.is-wide .tpds-earthquake-widget-item time {
    grid-column:2;
}

.tpds-guide-widget {
    position:relative;
    overflow:hidden;
    color:#fff;
    background:linear-gradient(135deg,#0b1f3a 0%,#123c63 65%,#0a6a75 100%);
    border-color:#17486d;
}

.tpds-guide-widget-content {
    position:relative;
    z-index:2;
    padding:22px;
}

.tpds-guide-widget-kicker {
    display:block;
    color:#76d6f1;
    font-size:9px;
    font-weight:900;
    letter-spacing:.7px;
}

.tpds-guide-widget h3 {
    margin:7px 0 8px;
    color:#fff;
    font-size:25px;
    line-height:1.15;
    font-weight:900;
}

.tpds-guide-widget p {
    max-width:630px;
    margin:0;
    color:rgba(255,255,255,.78);
    font-size:12px;
    line-height:1.65;
}

.tpds-guide-widget-shortcuts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:15px;
}

.tpds-guide-widget-shortcuts a {
    min-height:62px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:5px;
    padding:9px 10px;
    color:#fff !important;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.14);
    text-decoration:none;
    font-size:9px;
    font-weight:800;
}

.tpds-guide-widget-shortcuts svg {
    width:18px;
    height:18px;
    color:#76d6f1;
}

.tpds-guide-widget-button {
    min-height:42px;
    display:inline-flex;
    align-items:center;
    gap:14px;
    margin-top:16px;
    padding:10px 15px;
    color:#0b1f3a !important;
    background:#fff;
    text-decoration:none;
    font-size:11px;
    font-weight:900;
}

.tpds-guide-widget-button span {
    font-size:18px;
}

.tpds-guide-widget-art {
    position:absolute;
    right:-20px;
    top:0;
    width:185px;
    height:100%;
    opacity:.17;
    pointer-events:none;
}

.tpds-guide-widget-house {
    position:absolute;
    right:28px;
    bottom:20px;
    width:92px;
    height:70px;
    background:#fff;
}

.tpds-guide-widget-house::before {
    content:"";
    position:absolute;
    left:-14px;
    top:-39px;
    border-left:60px solid transparent;
    border-right:60px solid transparent;
    border-bottom:48px solid #fff;
}

.tpds-guide-widget-shield {
    position:absolute;
    right:5px;
    top:28px;
    width:60px;
    height:68px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#57c4e5;
    clip-path:polygon(50% 0,100% 18%,88% 78%,50% 100%,12% 78%,0 18%);
    color:#fff;
    font-size:28px;
    font-weight:900;
}

.tpds-guide-widget-wave {
    position:absolute;
    left:0;
    top:32px;
    width:135px;
    height:45px;
    border-top:3px dashed #fff;
    transform:rotate(-8deg);
}

.tpds-guide-widget.is-wide {
    min-height:250px;
}

.tpds-guide-widget.is-wide .tpds-guide-widget-content {
    padding:32px;
}

.tpds-guide-widget.is-wide h3 {
    font-size:34px;
}

.tpds-guide-widget.is-wide .tpds-guide-widget-art {
    width:310px;
    opacity:.24;
}

@media (max-width:900px) {
    .tpds-earthquake-widget.is-wide .tpds-earthquake-widget-list {
        grid-template-columns:1fr;
    }
}

@media (max-width:520px) {
    .tpds-earthquake-widget-item {
        grid-template-columns:52px minmax(0,1fr);
    }

    .tpds-earthquake-widget-item time {
        grid-column:2;
    }

    .tpds-guide-widget-shortcuts {
        grid-template-columns:1fr;
    }

    .tpds-guide-widget-shortcuts a {
        min-height:48px;
        flex-direction:row;
        align-items:center;
    }

    .tpds-guide-widget-art {
        opacity:.09;
    }
}