
.skpt-wrap{
    --skpt-a:#19b4bf;
    --skpt-b:#098ebc;
    --skpt-light:#ffffff;
    --skpt-soft:rgba(165,246,247,.62);
    position:relative;
    max-width:820px;
    margin:24px auto;
    overflow:hidden;
    border-radius:28px;
    background:linear-gradient(180deg,var(--skpt-a),var(--skpt-b));
    color:var(--skpt-light);
    font-family:Arial,Helvetica,sans-serif;
    box-shadow:0 18px 50px rgba(0,0,0,.15);
}
.skpt-pattern{
    position:absolute;
    inset:0 0 auto 0;
    height:230px;
    background:
      linear-gradient(rgba(245,250,252,.93),rgba(245,250,252,.93)),
      repeating-linear-gradient(45deg, transparent 0 32px, rgba(255,255,255,.7) 32px 34px);
    opacity:.98;
}
.skpt-dome{
    position:relative;
    z-index:2;
    width:360px;
    height:210px;
    margin:0 auto;
    background:linear-gradient(180deg,#159eb0,#1eb5bf);
    border-radius:180px 180px 0 0;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 10px 22px rgba(0,0,0,.16);
}
.skpt-dome:before{
    content:"";
    position:absolute;
    top:-23px;
    left:50%;
    transform:translateX(-50%);
    width:150px;
    height:65px;
    border-radius:50% 50% 30% 30%;
    background:#159eb0;
}
.skpt-title{
    position:relative;
    z-index:2;
    font-size:58px;
    font-weight:300;
    letter-spacing:3px;
    margin-top:14px;
}
.skpt-card{
    position:relative;
    z-index:3;
    padding:38px 80px 48px;
    min-height:690px;
}
.skpt-status{
    display:none;
    text-align:center;
    font-size:14px;
    margin-bottom:10px;
    opacity:.75;
}
.skpt-status.skpt-error{
    display:block;
    background:rgba(255,255,255,.12);
    padding:8px 12px;
    border-radius:10px;
}
.skpt-times{
    max-width:520px;
    margin:0 auto;
}
.skpt-row{
    display:grid;
    grid-template-columns:1.35fr .85fr;
    align-items:center;
    gap:28px;
    padding:12px 0;
    font-size:36px;
    font-weight:300;
    line-height:1.15;
}
.skpt-name{text-align:right;letter-spacing:.5px}
.skpt-time{font-size:40px;white-space:nowrap}
.skpt-muted{color:var(--skpt-soft)}
.skpt-row.skpt-next{
    color:#fff;
    text-shadow:0 0 18px rgba(255,255,255,.35);
}
.skpt-row.skpt-next .skpt-name{
    font-weight:600;
}
.skpt-bottom{
    margin:72px auto 0;
    max-width:520px;
}
.skpt-location{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    font-size:31px;
    letter-spacing:.5px;
    text-align:center;
}
.skpt-locate{
    width:38px;
    height:38px;
    border:2px solid rgba(255,255,255,.9);
    border-radius:50%;
    background:transparent;
    color:#fff;
    font-size:25px;
    line-height:32px;
    cursor:pointer;
    padding:0;
}
.skpt-locate:hover{background:rgba(255,255,255,.12)}
.skpt-divider{
    height:1px;
    margin:17px 0 15px;
    background:rgba(255,255,255,.65);
}
.skpt-method{
    text-align:center;
    color:rgba(148,244,245,.72);
    font-size:17px;
}
.skpt-method-name{color:rgba(255,255,255,.93);margin-left:7px}

@media(max-width:700px){
    .skpt-wrap{border-radius:20px;margin:14px auto}
    .skpt-pattern{height:155px}
    .skpt-dome{width:250px;height:145px;border-radius:125px 125px 0 0}
    .skpt-dome:before{top:-17px;width:105px;height:46px}
    .skpt-title{font-size:40px}
    .skpt-card{padding:28px 24px 34px;min-height:auto}
    .skpt-row{grid-template-columns:1.25fr .95fr;gap:18px;font-size:25px;padding:10px 0}
    .skpt-time{font-size:28px}
    .skpt-bottom{margin-top:48px}
    .skpt-location{font-size:22px}
}
