/* おきなわデイリー：今日の沖縄占い */
.okd-uranai{
	--okd-ink:#33302c;
	--okd-sub:#7a736a;
	--okd-line:#ece5da;
	--okd-card:#fffdf9;
	--okd-accent:#e5893c;      /* 温かいオレンジ（蛍光色は不使用） */
	--okd-accent2:#2f8ba0;     /* 海のティール */
	--okd-gold:#d9a441;
	--okd-silver:#a7adb2;
	--okd-bronze:#b57a45;
	--okd-star:#e5a93c;
	max-width:720px;margin:0 auto;color:var(--okd-ink);
	font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
	font-size:1.06rem;
	line-height:1.85;
}
.okd-uranai .okd-btn,.okd-uranai .okd-chip,.okd-uranai #okd-year{font-family:inherit;}
.okd-uranai *{box-sizing:border-box;}

/* ヘッダ */
.okd-head{text-align:center;margin:0 0 1.1em;}
.okd-title{font-size:1.5rem;font-weight:800;margin:0;letter-spacing:.02em;}
.okd-emoji{font-size:1.2em;}
.okd-date{font-size:1.4rem;color:var(--okd-accent2);font-weight:900;margin:.2em 0 0;letter-spacing:.02em;}
.okd-note{font-size:.85rem;color:var(--okd-sub);margin:.4em 0 0;text-align:center;}

/* ごーやー君＋吹き出し */
.okd-hero{display:flex;align-items:center;justify-content:center;gap:.6em;margin:.6em 0 .2em;flex-direction:row-reverse;}
.okd-kun{width:110px;height:auto;flex:0 0 auto;filter:drop-shadow(0 3px 4px rgba(60,80,30,.18));animation:okd-bob 3s ease-in-out infinite;}
.okd-bubble{position:relative;background:#eef7ec;border:1px solid #cfe6c8;border-radius:16px;padding:.85em 1.05em;font-size:1.08rem;font-weight:700;color:#2f6b34;width:fit-content;max-width:17em;overflow-wrap:anywhere;}
.okd-bubble::before{content:"";position:absolute;right:-9px;top:50%;transform:translateY(-50%);border-style:solid;border-width:8px 0 8px 9px;border-color:transparent transparent transparent #cfe6c8;}
.okd-bubble::after{content:"";position:absolute;right:-7px;top:50%;transform:translateY(-50%);border-style:solid;border-width:7px 0 7px 8px;border-color:transparent transparent transparent #eef7ec;}
@keyframes okd-bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
@media(max-width:480px){
	.okd-hero{gap:.3em;}
	.okd-kun{width:80px;}
	.okd-bubble{font-size:.85rem;padding:.7em .8em;}
}

/* 生まれ年ファインダー */
.okd-finder{background:#fbf5ec;border:1px solid var(--okd-line);border-radius:16px;padding:.9em 1em;margin:0 0 1em;text-align:center;}
.okd-finder label{display:block;font-size:1.05rem;font-weight:700;margin-bottom:.5em;}
.okd-finder-row{display:inline-flex;gap:.5em;align-items:center;}
#okd-year{width:8em;padding:.55em .7em;border:1px solid #d9cfbf;border-radius:10px;font-size:1.05rem;text-align:center;}
.okd-btn{background:var(--okd-accent);color:#fff;border:0;border-radius:10px;padding:.6em 1.2em;font-size:1.05rem;font-weight:700;cursor:pointer;}
.okd-btn:hover{filter:brightness(.96);}
.okd-mine{margin:.7em 0 0;font-weight:700;font-size:1.05rem;color:var(--okd-accent);}

/* 干支チップ（4×3のバランスグリッド） */
.okd-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:.5em;margin:0 0 1.2em;}
.okd-chip{background:#fff;border:1px solid var(--okd-line);border-radius:12px;padding:.5em .3em;font-size:.98rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.3em;color:var(--okd-ink);width:100%;white-space:nowrap;}
.okd-chip-emoji{font-size:1.15em;}
.okd-chip:hover{border-color:var(--okd-accent);}
.okd-chip.okd-active{background:var(--okd-accent);color:#fff;border-color:var(--okd-accent);}
@media(max-width:480px){.okd-picker{grid-template-columns:repeat(3,1fr);}}

/* ランキング */
.okd-rank{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7em;}
.okd-card{background:var(--okd-card);border:1px solid var(--okd-line);border-radius:16px;padding:.85em 1em;box-shadow:0 2px 6px rgba(80,60,30,.05);transition:box-shadow .2s,transform .2s,border-color .2s;}
.okd-card.okd-highlight{border-color:var(--okd-accent);box-shadow:0 4px 16px rgba(229,137,60,.25);transform:translateY(-1px);}
.okd-card-head{display:flex;align-items:center;gap:.7em;}
.okd-badge{flex:0 0 auto;min-width:2.4em;height:2.4em;border-radius:12px;background:#f0ebe2;color:var(--okd-ink);font-weight:800;font-size:1.15rem;display:inline-flex;align-items:baseline;justify-content:center;gap:.05em;padding:.35em .2em 0;}
.okd-badge small{font-size:.6em;font-weight:700;}
.okd-medal-gold .okd-badge{background:linear-gradient(145deg,#f4d47a,var(--okd-gold));color:#5c4310;}
.okd-medal-silver .okd-badge{background:linear-gradient(145deg,#dfe3e6,var(--okd-silver));color:#3f4650;}
.okd-medal-bronze .okd-badge{background:linear-gradient(145deg,#dda877,var(--okd-bronze));color:#4d2f14;}
.okd-medal-gold{border-color:#e7c877;}
.okd-medal-silver{border-color:#c4c9ce;}
.okd-medal-bronze{border-color:#d0a279;}
.okd-eto{flex:1 1 auto;display:flex;align-items:center;gap:.4em;min-width:0;}
.okd-eto-emoji{font-size:1.5em;}
.okd-eto-name{font-weight:800;font-size:1.2rem;}
.okd-eto-name small{font-size:.72em;color:var(--okd-sub);font-weight:600;}
.okd-overall{flex:0 0 auto;}
.okd-stars{color:var(--okd-star);letter-spacing:.05em;font-size:1.18rem;white-space:nowrap;}
.okd-star-empty{color:#dcd4c7;}
.okd-msg{margin:.6em 0 0;font-size:1.05rem;}

/* 詳細 */
.okd-details{margin:.6em 0 0;}
.okd-details summary{cursor:pointer;color:var(--okd-accent2);font-size:.98rem;font-weight:700;list-style:none;display:inline-flex;align-items:center;gap:.3em;}
.okd-details summary::-webkit-details-marker{display:none;}
.okd-details summary::before{content:"▾";display:inline-block;transition:transform .2s;}
.okd-details[open] summary::before{transform:rotate(180deg);}
.okd-detail-grid{display:flex;flex-wrap:wrap;gap:.4em 1.2em;margin:.6em 0 0;}
.okd-sub{display:flex;align-items:center;gap:.4em;font-size:1rem;}
.okd-sub span{color:var(--okd-sub);font-size:.9rem;}
.okd-lucky{list-style:none;margin:.6em 0 0;padding:.8em 1em;background:#faf6ef;border-radius:12px;display:grid;grid-template-columns:1fr 1fr;gap:.5em .8em;}
.okd-lucky li{font-size:.98rem;display:flex;flex-direction:column;}
.okd-lucky li span{color:var(--okd-sub);font-size:.8rem;}
.okd-advice{margin:.6em 0 0;font-size:.98rem;background:#fff4e8;border-left:3px solid var(--okd-accent);border-radius:0 8px 8px 0;padding:.6em .8em;}

/* フッタ導線 */
.okd-foot{display:flex;flex-wrap:wrap;gap:.6em;justify-content:center;margin:1.3em 0 0;}
.okd-link{flex:1 1 auto;text-align:center;min-width:12em;background:#fff;border:1px solid var(--okd-line);border-radius:12px;padding:.8em 1em;font-size:1.05rem;font-weight:700;text-decoration:none;color:var(--okd-ink);}
.okd-link:hover{border-color:var(--okd-accent2);color:var(--okd-accent2);}
.okd-note-foot{text-align:center;margin-top:1em;}

@media(max-width:480px){
	.okd-lucky{grid-template-columns:1fr;}
	.okd-eto-name{font-size:1rem;}
	.okd-overall{font-size:.9rem;}
}
@media(prefers-reduced-motion:reduce){
	.okd-card,.okd-details summary::before{transition:none;}
	.okd-kun{animation:none;}
}

/* ===== 今日の天気 ===== */
.okd-tenki{max-width:560px;}
.okd-tenki-card{background:var(--okd-card);border:1px solid var(--okd-line);border-radius:18px;padding:1.1em 1.2em;box-shadow:0 2px 8px rgba(80,60,30,.06);}
.okd-tenki-main{display:flex;align-items:center;gap:.9em;}
.okd-tenki-emoji{font-size:3.4rem;line-height:1;flex:0 0 auto;}
.okd-tenki-body{flex:1 1 auto;min-width:0;}
.okd-tenki-area{margin:0;font-size:.9rem;color:var(--okd-sub);font-weight:700;}
.okd-tenki-w{margin:.15em 0 .35em;font-size:1.22rem;font-weight:800;color:var(--okd-ink);line-height:1.5;}
.okd-tenki-nums{display:flex;flex-wrap:wrap;gap:.4em 1.1em;font-size:1.05rem;}
.okd-tenki-nums b{color:var(--okd-accent);font-size:1.15em;}
.okd-tenki-say{display:flex;align-items:center;gap:.6em;background:#eef7ec;border:1px solid #cfe6c8;border-radius:14px;padding:.7em .9em;margin:1em 0 .9em;}
.okd-kun-sm{width:56px;height:auto;flex:0 0 auto;filter:drop-shadow(0 2px 3px rgba(60,80,30,.18));}
.okd-tenki-comment{margin:0;font-size:1.04rem;font-weight:700;color:#2f6b34;flex:1 1 auto;line-height:1.6;}
.okd-tenki .okd-link{display:block;}
@media(max-width:480px){
	.okd-tenki-emoji{font-size:2.8rem;}
	.okd-tenki-w{font-size:1.1rem;}
}

/* ===== 天気マップ（Leaflet + OpenStreetMap） ===== */
.okd-hidden{display:none!important;}
.okd-tenki{max-width:600px;}
.okd-typhoon{display:block;background:#fff3ec;border:1.5px solid #f0a878;border-radius:12px;padding:.7em 1em;margin:0 0 .8em;font-size:.98rem;font-weight:800;color:#b5531d;text-decoration:none;line-height:1.5;}
.okd-typhoon:hover{background:#ffe9db;}
.okd-tenki-lead{text-align:center;font-size:.95rem;color:var(--okd-sub);font-weight:700;margin:0 0 .7em;}
.okd-wxmap{width:100%;height:360px;border-radius:14px;border:1px solid #b6dbe4;margin:0 0 1.1em;z-index:0;}
.okd-wxmap .leaflet-container{font-family:inherit;border-radius:14px;}
.okd-wxpin-wrap{background:none!important;border:none!important;}
.okd-wxpin{background:rgba(255,255,255,.96);border:1.5px solid #cbdfe4;border-radius:9px;padding:.15em .35em;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.08;box-shadow:0 1px 5px rgba(20,50,70,.3);width:58px;height:46px;box-sizing:border-box;cursor:pointer;}
.okd-wxpin.okd-active{background:var(--okd-accent2);border-color:var(--okd-accent2);box-shadow:0 3px 10px rgba(47,139,160,.5);}
.okd-wxpin.okd-active .okd-wxpin-n,.okd-wxpin.okd-active .okd-wxpin-t{color:#fff;}
.okd-wxpin-n{font-size:.64rem;font-weight:800;color:var(--okd-ink);white-space:nowrap;}
.okd-wxpin-b{display:flex;align-items:center;gap:.1em;}
.okd-wxpin-e{font-size:1rem;}
.okd-wxpin-t{font-size:.64rem;font-weight:800;color:var(--okd-accent);}

/* 詳細：今日・明日 */
.okd-tenki-area{margin:0 0 .5em;font-size:1.15rem;font-weight:800;color:var(--okd-ink);}
.okd-tenki-days{display:flex;flex-direction:column;gap:.5em;margin:0 0 .8em;}
.okd-tday{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:.5em;background:#faf6ef;border-radius:10px;padding:.5em .7em;}
.okd-tday-h{font-weight:800;color:var(--okd-accent2);font-size:.95rem;}
.okd-tday-e{font-size:1.5rem;}
.okd-tday-w{font-size:.92rem;font-weight:700;line-height:1.4;}
.okd-tday-n{white-space:nowrap;font-size:.9rem;text-align:right;}
.okd-tday-n b{color:var(--okd-accent);font-size:1.05em;}
.okd-tp{color:var(--okd-accent2);margin-left:.35em;font-weight:800;}

/* 6時間ごと降水確率 */
.okd-pop6{margin:0 0 .9em;}
.okd-pop6-t{font-size:.85rem;color:var(--okd-sub);font-weight:700;margin:0 0 .35em;}
.okd-pop6-row{display:grid;grid-template-columns:repeat(6,1fr);gap:.3em;}
.okd-pop6-cell{background:#f1f6f1;border-radius:8px;padding:.45em .1em;text-align:center;display:flex;flex-direction:column;gap:.15em;}
.okd-pop6-l{font-size:.66rem;color:var(--okd-sub);line-height:1.15;}
.okd-pop6-v{font-size:.92rem;font-weight:800;color:var(--okd-ink);}
.okd-pop-mid{background:#e7f0f8;}.okd-pop-mid .okd-pop6-v{color:#2f6fa0;}
.okd-pop-hi{background:#d7e7f6;}.okd-pop-hi .okd-pop6-v{color:#1f5fa0;}

@media(max-width:480px){
	.okd-wxmap{height:300px;}
	.okd-pop6-l{font-size:.6rem;}
	.okd-tday-w{font-size:.85rem;}
}
