/* HealingMart Weather LIVE concept v1
   Existing approved layout is preserved. These rules only add experience modes. */

#app.app-v1520 .hm-experience-tabs{overflow-x:auto;scrollbar-width:none}
#app.app-v1520 .hm-experience-tabs::-webkit-scrollbar{display:none}
#app.app-v1520 .hm-experience-tabs button{white-space:nowrap}
#app.app-v1520 .hm-experience-tabs #nationwide-button{min-width:112px}
#app.app-v1520 .hm-experience-tabs #world-live-button{min-width:86px}
#app.app-v1520 .hm-experience-tabs #sky-live-button{min-width:98px}

#app.app-v1520[data-experience="world"] .map-canvas>#map,
#app.app-v1520[data-experience="sky"] .map-canvas>#map{visibility:hidden;pointer-events:none}
#app.app-v1520[data-experience="world"] .map-context,
#app.app-v1520[data-experience="world"] .map-hint,
#app.app-v1520[data-experience="world"] .map-error,
#app.app-v1520[data-experience="sky"] .map-context,
#app.app-v1520[data-experience="sky"] .map-hint,
#app.app-v1520[data-experience="sky"] .map-error{display:none!important}

#app.app-v1520 .hm-experience-view{
  position:absolute;inset:0;z-index:8;overflow:auto;padding:22px;background:#f6fafb;color:#1f3239;
}
#app.app-v1520 .hm-experience-view[hidden]{display:none!important}
#app.app-v1520 .hm-experience-loading{min-height:100%;display:grid;place-items:center;align-content:center;gap:10px;text-align:center;color:#60757d}
#app.app-v1520 .hm-experience-loading span{width:38px;height:38px;border:3px solid #d8e6e8;border-top-color:#0baca3;border-radius:50%;animation:hmLiveSpin .85s linear infinite}
#app.app-v1520 .hm-experience-loading strong{font-size:16px;color:#263a41}
#app.app-v1520 .hm-experience-loading small{font-size:12px}
@keyframes hmLiveSpin{to{transform:rotate(360deg)}}

#app.app-v1520 .hm-live-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
#app.app-v1520 .hm-live-title small{display:block;margin-bottom:5px;color:#0a9e96;font-size:11px;font-weight:950;letter-spacing:.08em}
#app.app-v1520 .hm-live-title h2{margin:0;color:#172b33;font-size:25px;line-height:1.15;font-weight:950;letter-spacing:-.045em}
#app.app-v1520 .hm-live-title p{margin:7px 0 0;color:#657980;font-size:12px;font-weight:700}
#app.app-v1520 .hm-live-source{display:flex;align-items:center;gap:7px;min-height:32px;padding:0 11px;border:1px solid #dbe7e9;border-radius:999px;background:#fff;color:#64777e;font-size:10px;font-weight:850;white-space:nowrap}
#app.app-v1520 .hm-live-source:before{content:"";width:7px;height:7px;border-radius:50%;background:#16b3aa;box-shadow:0 0 0 4px rgba(22,179,170,.12)}

#app.app-v1520 .hm-world-spotlights{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
#app.app-v1520 .hm-world-spotlight{min-width:0;padding:15px 15px 14px;border:1px solid #dde9eb;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(33,62,72,.035)}
#app.app-v1520 .hm-world-spotlight .hm-spot-icon{display:grid;width:32px;height:32px;place-items:center;margin-bottom:10px;border-radius:10px;background:#f0f7f8;font-size:17px}
#app.app-v1520 .hm-world-spotlight small{display:block;color:#75878d;font-size:10px;font-weight:850}
#app.app-v1520 .hm-world-spotlight strong{display:block;margin-top:4px;overflow:hidden;color:#193039;font-size:19px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#app.app-v1520 .hm-world-spotlight b{display:block;margin-top:2px;color:#435a62;font-size:11px;font-weight:850}

#app.app-v1520 .hm-rank-shell{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);gap:12px}
#app.app-v1520 .hm-rank-panel,#app.app-v1520 .hm-earth-panel{min-width:0;border:1px solid #dde8ea;border-radius:17px;background:#fff;overflow:hidden}
#app.app-v1520 .hm-rank-tabs{display:flex;gap:4px;padding:10px;border-bottom:1px solid #e8eff0;overflow-x:auto;scrollbar-width:none}
#app.app-v1520 .hm-rank-tabs::-webkit-scrollbar{display:none}
#app.app-v1520 .hm-rank-tabs button{height:31px;padding:0 10px;border:0;border-radius:9px;background:transparent;color:#63767d;font-size:10px;font-weight:900;white-space:nowrap;cursor:pointer}
#app.app-v1520 .hm-rank-tabs button.is-active{background:#e9f8f7;color:#068f88}
#app.app-v1520 .hm-rank-list{list-style:none;margin:0;padding:6px 12px 10px}
#app.app-v1520 .hm-rank-list li{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:45px;border-bottom:1px solid #edf2f3}
#app.app-v1520 .hm-rank-list li:last-child{border-bottom:0}
#app.app-v1520 .hm-rank-list .rank-no{display:grid;width:22px;height:22px;place-items:center;border-radius:7px;background:#eef5f6;color:#63757c;font-size:10px;font-weight:950}
#app.app-v1520 .hm-rank-list li:nth-child(1) .rank-no{background:#fff0df;color:#e97400}
#app.app-v1520 .hm-rank-list .rank-city{min-width:0}
#app.app-v1520 .hm-rank-list .rank-city strong{display:block;overflow:hidden;color:#24383f;font-size:12px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#app.app-v1520 .hm-rank-list .rank-city small{display:block;margin-top:2px;color:#849399;font-size:9px;font-weight:750}
#app.app-v1520 .hm-rank-list .rank-value{color:#152c35;font-size:14px;font-weight:950;white-space:nowrap}

#app.app-v1520 .hm-earth-panel{position:relative;min-height:332px;padding:18px;background:linear-gradient(180deg,#f9fcfd,#eef6f7)}
#app.app-v1520 .hm-earth-orb{position:absolute;right:-64px;bottom:-112px;width:330px;height:330px;border:1px solid #cee2e5;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.98),rgba(217,237,239,.86) 43%,rgba(188,221,225,.7) 70%,rgba(151,199,205,.35));box-shadow:inset -35px -30px 70px rgba(80,151,159,.12)}
#app.app-v1520 .hm-earth-orb:before,#app.app-v1520 .hm-earth-orb:after{content:"";position:absolute;border:1px solid rgba(89,158,166,.17);border-radius:50%}
#app.app-v1520 .hm-earth-orb:before{inset:28px 70px}
#app.app-v1520 .hm-earth-orb:after{inset:92px 18px}
#app.app-v1520 .hm-earth-copy{position:relative;z-index:2;max-width:260px}
#app.app-v1520 .hm-earth-copy small{color:#6d8188;font-size:10px;font-weight:850}
#app.app-v1520 .hm-earth-copy h3{margin:5px 0 0;color:#1f343c;font-size:18px;font-weight:950;letter-spacing:-.035em}
#app.app-v1520 .hm-earth-copy p{margin:8px 0 14px;color:#6a7c83;font-size:11px;line-height:1.55;font-weight:700}
#app.app-v1520 .hm-earth-facts{display:grid;gap:8px}
#app.app-v1520 .hm-earth-fact{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;padding:0 11px;border:1px solid rgba(211,227,230,.95);border-radius:11px;background:rgba(255,255,255,.78);backdrop-filter:blur(8px)}
#app.app-v1520 .hm-earth-fact span{color:#5e737b;font-size:10px;font-weight:850}
#app.app-v1520 .hm-earth-fact strong{color:#1d343c;font-size:11px;font-weight:950;text-align:right}

#app.app-v1520 .hm-national-live-overlay{position:absolute;left:14px;right:14px;bottom:14px;z-index:7;max-width:880px;margin:auto;border:1px solid rgba(210,226,229,.94);border-radius:16px;background:rgba(255,255,255,.94);box-shadow:0 12px 30px rgba(35,67,77,.13);backdrop-filter:blur(13px);overflow:hidden}
#app.app-v1520 .hm-national-live-overlay[hidden]{display:none!important}
#app.app-v1520 .hm-national-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 13px 8px}
#app.app-v1520 .hm-national-head strong{font-size:12px;font-weight:950;color:#20363e}
#app.app-v1520 .hm-national-head small{font-size:9px;font-weight:850;color:#819096}
#app.app-v1520 .hm-national-pulse{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:0 10px 10px}
#app.app-v1520 .hm-national-card{min-width:0;padding:9px 10px;border:1px solid #e3ecee;border-radius:11px;background:#fff}
#app.app-v1520 .hm-national-card span{display:block;margin-bottom:4px;color:#74868c;font-size:9px;font-weight:850}
#app.app-v1520 .hm-national-card strong{display:block;overflow:hidden;color:#1d333b;font-size:12px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#app.app-v1520 .hm-national-card small{display:block;margin-top:2px;color:#6f838a;font-size:9px;font-weight:800}

#app.app-v1520 .hm-sky-view{background:linear-gradient(180deg,#071522 0%,#102939 52%,#eef7f8 52%,#f7fbfc 100%)}
#app.app-v1520 .hm-sky-view .hm-live-title h2,#app.app-v1520 .hm-sky-view .hm-live-title p{color:#fff}
#app.app-v1520 .hm-sky-view .hm-live-title p{opacity:.7}
#app.app-v1520 .hm-sky-view .hm-live-source{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:rgba(255,255,255,.8)}
#app.app-v1520 .hm-sky-hero{position:relative;min-height:210px;margin-bottom:14px;border:1px solid rgba(255,255,255,.13);border-radius:20px;overflow:hidden;background:radial-gradient(circle at 77% 30%,rgba(255,235,178,.13),transparent 18%),radial-gradient(circle at 25% 20%,rgba(102,188,255,.09),transparent 21%),linear-gradient(180deg,#0b2032,#132f42)}
#app.app-v1520 .hm-sky-stars{position:absolute;inset:0;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.3px),radial-gradient(circle,#bfe4ff 0 1px,transparent 1.4px);background-size:53px 47px,83px 71px;background-position:10px 4px,33px 19px;opacity:.55}
#app.app-v1520 .hm-sky-moon{position:absolute;right:11%;top:26px;width:72px;height:72px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fffef1,#e6dfc7 70%,#c9bea2);box-shadow:0 0 42px rgba(255,246,203,.3)}
#app.app-v1520 .hm-sky-horizon{position:absolute;left:0;right:0;bottom:-58px;height:120px;border-radius:50% 50% 0 0;background:linear-gradient(180deg,#1d5264,#143d4d)}
#app.app-v1520 .hm-sky-center{position:relative;z-index:2;max-width:60%;padding:32px;color:#fff}
#app.app-v1520 .hm-sky-center small{font-size:11px;font-weight:850;opacity:.7}
#app.app-v1520 .hm-sky-center strong{display:block;margin:7px 0 5px;font-size:27px;font-weight:950;letter-spacing:-.04em}
#app.app-v1520 .hm-sky-center p{margin:0;font-size:12px;line-height:1.55;font-weight:700;opacity:.78}
#app.app-v1520 .hm-sky-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
#app.app-v1520 .hm-sky-card{min-width:0;padding:13px;border:1px solid #dce9eb;border-radius:14px;background:#fff}
#app.app-v1520 .hm-sky-card small{display:block;color:#778a91;font-size:9px;font-weight:850}
#app.app-v1520 .hm-sky-card strong{display:block;margin-top:5px;color:#1b323a;font-size:17px;font-weight:950}
#app.app-v1520 .hm-sky-card span{display:block;margin-top:3px;color:#71858c;font-size:9px;font-weight:750}
#app.app-v1520 .hm-sky-actions{display:flex;gap:8px;margin-top:10px}
#app.app-v1520 .hm-sky-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 13px;border-radius:10px;background:#0aaaa1;color:#fff;text-decoration:none;font-size:10px;font-weight:900}

#app.app-v1520 .hm-live-error{min-height:100%;display:grid;place-items:center;text-align:center;padding:28px}
#app.app-v1520 .hm-live-error div{max-width:380px;padding:20px;border:1px solid #dce8ea;border-radius:16px;background:#fff}
#app.app-v1520 .hm-live-error strong{display:block;color:#253940;font-size:15px;font-weight:950}
#app.app-v1520 .hm-live-error p{margin:7px 0 0;color:#71848b;font-size:11px;line-height:1.55;font-weight:700}

@media (max-width:980px){
  #app.app-v1520 .hm-experience-view{padding:16px}
  #app.app-v1520 .hm-world-spotlights{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app.app-v1520 .hm-rank-shell{grid-template-columns:1fr}
  #app.app-v1520 .hm-earth-panel{min-height:230px}
  #app.app-v1520 .hm-national-pulse{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app.app-v1520 .hm-sky-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:680px){
  #app.app-v1520 .hm-experience-tabs{width:100%;padding-right:4px}
  #app.app-v1520 .hm-experience-tabs button{min-width:max-content!important;height:33px!important;padding:0 11px!important;font-size:10px!important}
  #app.app-v1520 .map-view-meta{display:none!important}
  #app.app-v1520 .hm-experience-view{padding:13px}
  #app.app-v1520 .hm-live-head{gap:10px;margin-bottom:13px}
  #app.app-v1520 .hm-live-title h2{font-size:20px}
  #app.app-v1520 .hm-live-source{display:none}
  #app.app-v1520 .hm-world-spotlights{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  #app.app-v1520 .hm-world-spotlight{padding:11px}
  #app.app-v1520 .hm-world-spotlight strong{font-size:16px}
  #app.app-v1520 .hm-rank-list li{min-height:42px}
  #app.app-v1520 .hm-national-live-overlay{left:8px;right:8px;bottom:8px}
  #app.app-v1520 .hm-national-pulse{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:0 7px 7px}
  #app.app-v1520 .hm-national-card{padding:7px 8px}
  #app.app-v1520 .hm-national-card strong{font-size:11px}
  #app.app-v1520 .hm-sky-center{max-width:72%;padding:24px 20px}
  #app.app-v1520 .hm-sky-center strong{font-size:22px}
  #app.app-v1520 .hm-sky-moon{right:8%;width:58px;height:58px}
  #app.app-v1520 .hm-sky-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
}

#app.app-v1520 .hm-mobile-experience-nav{display:none}
@media (max-width:760px){
  #app.app-v1520 .hm-mobile-experience-nav{
    order:2;display:flex;gap:6px;margin:0 8px;padding:6px;border:1px solid #dbe7e9;border-radius:14px;background:#fff;overflow-x:auto;scrollbar-width:none;box-shadow:0 4px 12px rgba(28,58,68,.035)
  }
  #app.app-v1520 .hm-mobile-experience-nav::-webkit-scrollbar{display:none}
  #app.app-v1520 .hm-mobile-experience-nav button{flex:0 0 auto;height:32px;padding:0 11px;border:0;border-radius:9px;background:transparent;color:#546970;font-size:10px;font-weight:900;white-space:nowrap}
  #app.app-v1520 .hm-mobile-experience-nav button.is-active{background:#0db2a8;color:#fff}
  #app.app-v1520 .map-stage{order:3}
  #app.app-v1520 .weather-dock{order:4}
}

/* Moon phase is derived only from the official moon-age value returned by KASI. */
#app.app-v1520 .hm-sky-moon{overflow:hidden}
#app.app-v1520 .hm-sky-moon:after{content:"";position:absolute;inset:-2px;border-radius:50%;background:#10293a;transition:transform .25s ease,opacity .25s ease}
#app.app-v1520 .hm-sky-moon.phase-full:after{opacity:0}
#app.app-v1520 .hm-sky-moon.phase-new:after{opacity:.94}
#app.app-v1520 .hm-sky-moon.phase-first-quarter:after{transform:translateX(-50%)}
#app.app-v1520 .hm-sky-moon.phase-last-quarter:after{transform:translateX(50%)}
#app.app-v1520 .hm-sky-moon.phase-waxing-crescent:after{transform:translateX(-20%)}
#app.app-v1520 .hm-sky-moon.phase-waning-crescent:after{transform:translateX(20%)}
#app.app-v1520 .hm-sky-moon.phase-waxing-gibbous:after{transform:translateX(-78%)}
#app.app-v1520 .hm-sky-moon.phase-waning-gibbous:after{transform:translateX(78%)}
#app.app-v1520 .hm-sky-moon.phase-unknown:after{opacity:.3}

/* LIVE v2: national observation board */
#app.app-v1520 .hm-live-mini{display:inline-grid;place-items:center;margin-left:4px;padding:2px 5px;border-radius:999px;background:#eaf8f7;color:#079b93;font-size:8px;font-style:normal;font-weight:950;vertical-align:2px}
#app.app-v1520 .hm-legacy-rank-buttons{display:none!important}
#app.app-v1520[data-experience="national"] .map-context,
#app.app-v1520[data-experience="national"] .map-hint{display:none!important}
#app.app-v1520 .hm-national-live-overlay{left:18px;right:18px;bottom:18px;max-width:980px;border-radius:20px;background:rgba(250,253,253,.96)}
#app.app-v1520 .hm-national-head{padding:11px 14px;border-bottom:1px solid #e6edef}
#app.app-v1520 .hm-national-head strong{display:flex;align-items:center;gap:7px;font-size:13px}
#app.app-v1520 .hm-national-head strong i{width:8px;height:8px;border-radius:50%;background:#ff4d4f;box-shadow:0 0 0 5px rgba(255,77,79,.10);animation:hmLivePulse 1.6s ease-in-out infinite}
@keyframes hmLivePulse{50%{opacity:.45;transform:scale(.85)}}
#app.app-v1520 .hm-national-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(290px,.92fr);gap:0}
#app.app-v1520 .hm-national-now{padding:14px;border-right:1px solid #e6edef}
#app.app-v1520 .hm-national-now>small{display:block;color:#71848b;font-size:9px;font-weight:900}
#app.app-v1520 .hm-national-lead{display:flex;align-items:center;gap:10px;margin:5px 0 3px}
#app.app-v1520 .hm-national-lead>span{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:#fff3e9;font-size:22px}
#app.app-v1520 .hm-national-lead div{display:flex;align-items:baseline;gap:8px;min-width:0}
#app.app-v1520 .hm-national-lead strong{color:#172d35;font-size:22px;font-weight:950;letter-spacing:-.04em}
#app.app-v1520 .hm-national-lead b{color:#f07113;font-size:17px;font-weight:950}
#app.app-v1520 .hm-national-now>p{margin:3px 0 11px;color:#6d8087;font-size:10px;font-weight:750}
#app.app-v1520 .hm-national-pulse{grid-template-columns:repeat(4,minmax(0,1fr));padding:0;gap:6px}
#app.app-v1520 .hm-national-card{padding:8px 9px;background:#fff}
#app.app-v1520 .hm-national-rankbox{min-width:0;background:#fff}
#app.app-v1520 .hm-national-ranktabs{display:flex;gap:4px;padding:9px;border-bottom:1px solid #edf1f2;overflow-x:auto;scrollbar-width:none}
#app.app-v1520 .hm-national-ranktabs::-webkit-scrollbar{display:none}
#app.app-v1520 .hm-national-ranktabs button{height:29px;padding:0 9px;border:0;border-radius:8px;background:transparent;color:#64777e;font-size:9px;font-weight:900;white-space:nowrap}
#app.app-v1520 .hm-national-ranktabs button.is-active{background:#e9f8f7;color:#078f88}
#app.app-v1520 .hm-national-ranklist{list-style:none;margin:0;padding:5px 11px 8px;max-height:164px;overflow:auto}
#app.app-v1520 .hm-national-ranklist li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:31px;border-bottom:1px solid #f0f3f4}
#app.app-v1520 .hm-national-ranklist li:last-child{border-bottom:0}
#app.app-v1520 .hm-national-ranklist li>b{display:grid;width:19px;height:19px;place-items:center;border-radius:6px;background:#eef5f6;color:#61767d;font-size:8px;font-weight:950}
#app.app-v1520 .hm-national-ranklist li:first-child>b{background:#fff0df;color:#ea7200}
#app.app-v1520 .hm-national-ranklist li>span{min-width:0}
#app.app-v1520 .hm-national-ranklist li>span strong{display:block;overflow:hidden;color:#263a41;font-size:10px;font-weight:950;text-overflow:ellipsis;white-space:nowrap}
#app.app-v1520 .hm-national-ranklist li>span small{display:block;overflow:hidden;margin-top:1px;color:#87979d;font-size:8px;font-weight:750;text-overflow:ellipsis;white-space:nowrap}
#app.app-v1520 .hm-national-ranklist li>em{color:#173039;font-size:11px;font-style:normal;font-weight:950;white-space:nowrap}
#app.app-v1520 .hm-national-ranklist .hm-national-empty{display:block;padding:12px;color:#73868d;font-size:10px}
@media(max-width:820px){
  #app.app-v1520 .hm-national-live-overlay{left:8px;right:8px;bottom:8px;max-height:72%;overflow:auto;border-radius:16px}
  #app.app-v1520 .hm-national-layout{grid-template-columns:1fr}
  #app.app-v1520 .hm-national-now{border-right:0;border-bottom:1px solid #e6edef;padding:11px}
  #app.app-v1520 .hm-national-head{padding:9px 11px}
  #app.app-v1520 .hm-national-head small{display:none}
  #app.app-v1520 .hm-national-lead strong{font-size:18px}
  #app.app-v1520 .hm-national-pulse{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app.app-v1520 .hm-national-ranklist{max-height:140px}
}