:root {
  --ink:#243240; --sub:#5b6b7a; --accent:#2a6fb0;
  --warm:#ef7c3e;      
  --warm-btn:#ef7c3e;  
  --r-sm:6px; --r-md:12px; --r-card:20px; --r-pill:999px;
  --tap:44px;          
  --sat:env(safe-area-inset-top, 0px);
}
* { box-sizing: border-box; }
body {
  margin:0; padding:0; color:var(--ink); min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;
  overflow-wrap:anywhere;
}

#sky { position:fixed; inset:0; z-index:0; overflow:hidden; background:linear-gradient(180deg,#6ea8d8,#a9cfe9 60%,#cfe3f0);
       --wind-scale:1; --wind-tilt:0deg; --wind-drift:0vw; }
#sky > div { position:absolute; }
.sun, .moon, .fog, .clouds, .rain, .splash, .snow, .stars, .flash, .bolt { display:none; }
.clouds, .rain, .snow, .stars, .fog, .flash { inset:0; }
.sun  { top:44px; right:46px; width:72px; height:72px; border-radius:50%; background:#ffe28a; box-shadow:0 0 0 0 rgba(255,226,138,.5); animation:sunpulse 4.5s ease-in-out infinite; transition:top .6s ease, background .6s ease; }
.moon { top:46px; right:50px; width:54px; height:54px; border-radius:50%; background:#eef1d8; box-shadow:0 0 26px 6px rgba(238,241,216,.35); }

.fog  { z-index:2; animation:fogbreathe 23s ease-in-out infinite;
        background:linear-gradient(180deg,rgba(255,255,255,.03) 0%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.3) 100%); }
.fog-band { position:absolute; left:-30%; width:160%; border-radius:50%; opacity:var(--op);
  background:radial-gradient(ellipse 55% 100% at 22% 50%, rgba(255,255,255,.9), transparent 72%),
             radial-gradient(ellipse 70% 100% at 62% 50%, rgba(255,255,255,.6), transparent 70%),
             radial-gradient(ellipse 45% 100% at 92% 50%, rgba(255,255,255,.8), transparent 74%); }
.fog-band { animation-duration:calc(var(--dur) / var(--wind-scale)), var(--pulse); }
.fog-band:nth-child(1) { --op:.12; --dur:128s; --pulse:23s; top:8%;  height:10vh; filter:blur(22px); animation-name:fogflow, fogpulse; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate, normal; }
.fog-band:nth-child(2) { --op:.14; --dur:96s;  --pulse:19s; top:26%; height:7vh;  filter:blur(18px); animation-name:fogflow, fogpulse; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate-reverse, normal; }
.fog-band:nth-child(3) { --op:.13; --dur:112s; --pulse:27s; top:44%; height:12vh; filter:blur(24px); animation-name:fogflow, fogpulse; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate, normal; }
.fog-band:nth-child(4) { --op:.18; --dur:74s;  --pulse:15s; top:64%; height:8vh;  filter:blur(16px); animation-name:fogflow, fogpulse; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate-reverse, normal; }
.fog-band:nth-child(5) { --op:.24; --dur:58s;  --pulse:11s; top:82%; height:13vh; filter:blur(18px); animation-name:fogflow, fogpulse; animation-timing-function:ease-in-out; animation-iteration-count:infinite; animation-direction:alternate, normal; }

.motes { position:absolute; inset:0; }
.mote { position:absolute; border-radius:50%; opacity:var(--op);
  background:radial-gradient(circle at 44% 42%, rgba(255,255,255,.9), rgba(255,255,255,.36) 44%, transparent 70%);
  animation:motedrift calc(var(--dur) / var(--wind-scale)) ease-in-out infinite alternate, motepuff var(--puff) ease-in-out infinite; }

.fog::after { content:""; position:absolute; inset:-14%; pointer-events:none; opacity:.5; mix-blend-mode:screen;
  background-size:200px 200px; animation:grain 34s ease-in-out infinite alternate;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='0.32'/></svg>"); }

.cloud { position:absolute; animation:drift linear infinite; animation-duration:calc(var(--dur) / var(--wind-scale)); }
.cloud[data-depth="back"]  { opacity:.42; filter:blur(7px); }
.cloud[data-depth="mid"]   { opacity:.70; filter:blur(5px); }
.cloud[data-depth="front"] { opacity:.88; filter:blur(3px); }
.cloud span { position:absolute; background:#fff; border-radius:50%; }

.drop  { position:absolute; top:-30px; width:2px; height:16px; border-radius:2px; background:rgba(226,237,247,.8);
         transform:rotate(var(--wind-tilt)); animation:fall linear infinite; }
.splash { left:0; right:0; bottom:0; height:74px; }
.splash i { position:absolute; bottom:6px; width:14px; height:4px; border-radius:50%;
            border:1px solid rgba(230,240,250,.75); border-top-color:transparent; opacity:0;
            animation:splash 1.1s linear infinite; }

.flake { position:absolute; top:-14px; width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.92);
         animation:snowfall linear infinite, sway ease-in-out infinite alternate;
         animation-duration:calc(var(--fall,6s) * var(--k,1)), calc(var(--sway,3s) * var(--k,1));
         animation-delay:calc(var(--fall,6s) * var(--k,1) * var(--ph,0) * -1),
                         calc(var(--sway,3s) * var(--k,1) * var(--phs,0) * -1); }
.star  { position:absolute; width:3px; height:3px; border-radius:50%; background:#fff; animation:twinkle ease-in-out infinite; }

.flash { background:#fff; opacity:0; animation:flash 3.5s infinite; }
.bolt  { position:absolute; inset:0; width:100%; height:38vh; }
.bolt polygon { fill:#fff8dc; opacity:0; filter:drop-shadow(0 0 7px rgba(255,248,220,.85)); }
.bolt .bolt-a { animation:boltflicker 7s infinite; }
.bolt .bolt-b { animation:boltflicker 7s infinite; animation-delay:3.5s; }

@keyframes drift    { from { transform:translateX(-140px); } to { transform:translateX(105vw); } }
@keyframes fall     { to { transform:rotate(var(--wind-tilt)) translateY(112vh); } }
@keyframes snowfall { from { translate:0 0; } to { translate:var(--wind-drift) 112vh; } }
@keyframes sway     { from { transform:translateX(-7px); } to { transform:translateX(7px); } }
@keyframes twinkle  { 50% { opacity:.15; } }
@keyframes sunpulse { 50% { box-shadow:0 0 40px 16px rgba(255,226,138,.45); } }
@keyframes fogflow  { from { transform:translate(-13%,2.5vh); } to { transform:translate(13%,-2.5vh); } }
@keyframes motedrift { from { transform:translate(var(--dx1),var(--dy1)) scale(.88); }
                       to   { transform:translate(var(--dx2),var(--dy2)) scale(1.16); } }
@keyframes motepuff  { 0%,100% { opacity:calc(var(--op) * .5); } 50% { opacity:var(--op); } }
@keyframes grain    { from { transform:translate(0,0) scale(1); } to { transform:translate(-26px,18px) scale(1.06); } }
@keyframes fogpulse { 50% { opacity:calc(var(--op) * .45); } }   
@keyframes fogbreathe { 0%,100% { opacity:.85; } 50% { opacity:1; } }
@keyframes splash   { 0% { opacity:0; transform:scale(.3); } 12% { opacity:.9; transform:scale(.6); }
                      55% { opacity:0; transform:scale(1.6); } 100% { opacity:0; transform:scale(1.6); } }
@keyframes flash    { 0%,8%,100% { opacity:0; } 10% { opacity:.14; } 12% { opacity:0; }
                      18% { opacity:.46; } 21% { opacity:.04; } 24% { opacity:.26; } 28% { opacity:0; } }
@keyframes boltflicker { 0%,8.5%,100% { opacity:0; } 9% { opacity:1; } 10.5% { opacity:.1; }
                      12% { opacity:.85; } 13.5% { opacity:0; } }
#sky-next { position:fixed; inset:0; z-index:0; overflow:hidden; display:none; }
html { background:#6ea8d8; }
#sky-next.sliding { display:block; animation:sky-slideup .6s cubic-bezier(.2,.7,.2,1) both; }
@keyframes sky-slideup { from { transform:translateY(100%); } to { transform:translateY(0); } }

#sky.scene-clear-day,   #sky-next.scene-clear-day   { background:linear-gradient(180deg,#3f8ed6,#8ec6ee 55%,#d3e9f8); }
#sky.scene-clear-night, #sky-next.scene-clear-night { background:linear-gradient(180deg,#111938,#25305b 60%,#3d4a86); }
#sky.scene-cloudy,      #sky-next.scene-cloudy      { background:linear-gradient(180deg,#7d94a8,#a7bacb 60%,#cdd8e0); }
#sky.scene-rain,        #sky-next.scene-rain        { background:linear-gradient(180deg,#465666,#6a7a8b 60%,#8b98a5); }
#sky.scene-thunder,     #sky-next.scene-thunder     { background:linear-gradient(180deg,#3a4550,#55606d 60%,#727d88); }
#sky.scene-snow,        #sky-next.scene-snow        { background:linear-gradient(180deg,#77879a,#98a7b6 60%,#b7c2cd); }
#sky.scene-fog,         #sky-next.scene-fog         { background:linear-gradient(180deg,#8d959b,#a7aeb3 48%,#c4c9cb); }

#sky.scene-default .clouds, #sky.scene-clear-day .clouds, #sky.scene-cloudy .clouds { display:block; }
#sky.scene-rain::before, #sky.scene-thunder::before, #sky.scene-snow::before,
#sky-next.scene-rain::before, #sky-next.scene-thunder::before, #sky-next.scene-snow::before {
  content:""; position:absolute; left:-20%; right:-20%; top:-16vh; height:56vh;
  filter:blur(30px); animation:overcast 46s ease-in-out infinite alternate;
  background:radial-gradient(ellipse 60% 100% at 18% 62%, var(--oc1), transparent 70%),
             radial-gradient(ellipse 72% 100% at 60% 44%, var(--oc2), transparent 72%),
             radial-gradient(ellipse 50% 100% at 92% 66%, var(--oc1), transparent 70%);
}
#sky.scene-rain,    #sky-next.scene-rain    { --oc1:rgba(28,36,46,.5);  --oc2:rgba(34,42,52,.4); }
#sky.scene-thunder, #sky-next.scene-thunder { --oc1:rgba(16,21,28,.62); --oc2:rgba(22,28,36,.52); }
#sky.scene-snow,    #sky-next.scene-snow    { --oc1:rgba(96,106,118,.3); --oc2:rgba(108,118,130,.24); }   
@keyframes overcast { from { transform:translateX(-4%); } to { transform:translateX(4%); } }
#sky.scene-clear-day .sun { display:block; }
#sky.scene-clear-night .moon, #sky.scene-clear-night .stars { display:block; }
#sky.scene-rain .rain, #sky.scene-thunder .rain, #sky.scene-thunder .flash, #sky.scene-thunder .bolt { display:block; }
#sky.scene-snow .snow { display:block; }
#sky.scene-fog .fog { display:block; }
#sky.scene-cloudy .cloud span { background:#e7edf2; }

#sky[data-rain] .splash { display:none; }
#sky.scene-rain[data-rain="moderate"] .splash, #sky.scene-rain[data-rain="heavy"] .splash,
#sky.scene-thunder .splash { display:block; }
#sky[data-rain="light"] .drop:nth-child(n+15) { display:none; }
#sky[data-rain="light"] .drop { opacity:.5; }
#sky[data-rain="moderate"] .drop:nth-child(n+27) { display:none; }
#sky[data-rain="heavy"] .drop { height:24px; width:2.5px; animation-duration:.42s !important; }
#sky.scene-thunder .drop { display:block !important; height:24px; }

#sky[data-snow="light"] .flake:nth-child(n+13) { display:none; }
#sky[data-snow="light"] .flake { width:6px; height:6px; opacity:.62 !important; }
#sky[data-snow="moderate"] .flake:nth-child(n+23) { display:none; }
#sky[data-snow="heavy"] .flake { width:9px; height:9px; --k:.45; }

#sky.scene-clear-day[data-tod="dawn"], #sky-next.scene-clear-day[data-tod="dawn"] { background:linear-gradient(180deg,#2f4b7a,#c47a86 52%,#f0b96b); }
#sky.scene-clear-day[data-tod="dusk"], #sky-next.scene-clear-day[data-tod="dusk"] { background:linear-gradient(180deg,#25376b,#a85f5f 48%,#c9552f); }
#sky.scene-cloudy[data-tod="dawn"],    #sky-next.scene-cloudy[data-tod="dawn"]    { background:linear-gradient(180deg,#54617f,#9d8390 55%,#c8a184); }
#sky.scene-cloudy[data-tod="dusk"],    #sky-next.scene-cloudy[data-tod="dusk"]    { background:linear-gradient(180deg,#4a5674,#94737b 55%,#bd8a6d); }
#sky.scene-fog[data-tod="dawn"],       #sky-next.scene-fog[data-tod="dawn"]       { background:linear-gradient(180deg,#6d7387,#a08f92 60%,#c3ab9c); }
#sky.scene-fog[data-tod="dusk"],       #sky-next.scene-fog[data-tod="dusk"]       { background:linear-gradient(180deg,#616a83,#98868a 60%,#b99b8b); }
#sky.scene-rain[data-tod="dusk"],  #sky-next.scene-rain[data-tod="dusk"]  { background:linear-gradient(180deg,#3d4759,#6b6b78 60%,#93857f); }
#sky.scene-rain[data-tod="dawn"],  #sky-next.scene-rain[data-tod="dawn"]  { background:linear-gradient(180deg,#3f4a5c,#6d6d7a 60%,#948a83); }
#sky.scene-snow[data-tod="dusk"],  #sky-next.scene-snow[data-tod="dusk"]  { background:linear-gradient(180deg,#6a7488,#9b96a0 60%,#bfb0ae); }
#sky.scene-snow[data-tod="dawn"],  #sky-next.scene-snow[data-tod="dawn"]  { background:linear-gradient(180deg,#6d778a,#a09aa2 60%,#c4b5b0); }
#sky.scene-thunder[data-tod="dawn"], #sky-next.scene-thunder[data-tod="dawn"] { background:linear-gradient(180deg,#333d4c,#5a5764 60%,#7d7169); }
#sky.scene-thunder[data-tod="dusk"], #sky-next.scene-thunder[data-tod="dusk"] { background:linear-gradient(180deg,#2f3846,#54505d 60%,#786a61); }

#sky.scene-cloudy[data-tod="night"],  #sky-next.scene-cloudy[data-tod="night"]  { background:linear-gradient(180deg,#1c2333,#2c3547 60%,#3d4657); }
#sky.scene-rain[data-tod="night"],    #sky-next.scene-rain[data-tod="night"]    { background:linear-gradient(180deg,#151b26,#232c39 60%,#333c49); }
#sky.scene-thunder[data-tod="night"], #sky-next.scene-thunder[data-tod="night"] { background:linear-gradient(180deg,#0f141c,#1b222c 60%,#2a313b); }
#sky.scene-snow[data-tod="night"],    #sky-next.scene-snow[data-tod="night"]    { background:linear-gradient(180deg,#2b3244,#3b4457 60%,#525c6e); }
#sky.scene-fog[data-tod="night"],     #sky-next.scene-fog[data-tod="night"]     { background:linear-gradient(180deg,#2a2f36,#3b4149 60%,#525860); }
#sky[data-tod="night"] .drop  { background:rgba(200,214,230,.62); }
#sky[data-tod="night"] .flake { background:rgba(238,244,250,.78); }
#sky[data-tod="dawn"] .sun, #sky[data-tod="dusk"] .sun { top:38vh; background:#ffb066; }
#sky[data-tod="dawn"] .sun, #sky[data-tod="dusk"] .sun { animation-name:sunpulse-low; }
#sky[data-tod="day"] .sun { top:44px; background:#ffe28a; animation-name:sunpulse; }
@keyframes sunpulse-low { 0%,100% { box-shadow:0 0 18px 6px rgba(255,176,102,.35); } 50% { box-shadow:0 0 44px 18px rgba(255,176,102,.5); } }

.content { position:relative; z-index:1; max-width:30rem; margin-inline:auto;
  padding:calc(1.375rem + var(--sat)) 1rem 1.5rem; }

.page-head { margin:0 0 1.125rem; padding:0.125rem 0.125rem 0.25rem; }
h1 { font-size:1.375rem; margin:0.125rem 0 0.1875rem; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }
h1 img { display:block; width:min(58vw, 16rem); height:auto;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.28)); }
.logo-home { display:inline-block; }
.page-head h1 { margin:-0.75rem 0 0.625rem; }
.lead { color:#fff; font-size:0.875rem; margin:0; line-height:1.65; text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }

.form-card {
  background:rgba(255,255,255,.86); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-radius:var(--r-card); padding:0.25rem 0.875rem 1.125rem; box-shadow:0 6px 22px rgba(0,0,0,.12);
}
.form-card .seg { background:#e9eef4; border-color:#d5dde6; -webkit-backdrop-filter:none; backdrop-filter:none; }
.form-card input, .form-card select,
.form-card .dt-presets button, .form-card .chip {
  background:#fff; border-color:#cfd8e2; -webkit-backdrop-filter:none; backdrop-filter:none;
}
.form-card .check-return .cbox { border-color:#b6c1cc; background:#fff; }

.seg button { min-height:var(--tap); padding:0; }
.dt-presets button { min-height:2.25rem; padding:0 1rem; position:relative; }
.chip { min-height:2.25rem; }
.chip-pick { position:relative; }
.dt-presets button::after, .chip-pick::after {
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:100%; height:var(--tap);
}
.chip-del { min-height:0; }
.clear-btn { min-height:0; }
.suggest li { min-height:var(--tap); display:flex; flex-direction:column; justify-content:center; }
.chip-del { position:relative; }
.chip-del::after, .clear-btn::after {
  content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:2.125rem; height:var(--tap);
}
.clear-btn::after { width:var(--tap); }

.seg-label, .hint, .note, label { color:var(--ink); text-shadow:none; }
.seg-label { font-size:0.9375rem; font-weight:600; margin:1rem 0.125rem 0.3125rem; }
.hint { font-size:0.8125rem; margin:0.3125rem 0.125rem 0; line-height:1.6; color:var(--sub); }
.note { font-size:0.8125rem; margin:0.875rem 0.125rem 0; line-height:1.6; color:var(--sub); }
label { display:block; font-size:0.9375rem; font-weight:600; margin:1rem 0 0.3125rem; }
label[for="dest"] { margin-top:0.5rem; }

input, select {
  width:100%; padding:0.75rem; font-size:1rem; color:var(--ink);
  font-family:inherit;
  border:1px solid rgba(255,255,255,.55); border-radius:var(--r-md);
  background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.row { display:flex; gap:0.5rem; align-items:center; }
.row #date, .row #return-date { flex:1; height:3.125rem; }
.row #hour, .row #return-hour {
  flex:0 0 auto; width:6.5rem; padding-right:2.125rem; height:3.125rem;
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23667' stroke-width='1.6' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center;
}
.row .suffix { flex:0 0 auto; font-size:0.9375rem; color:var(--ink); }
@media (pointer:coarse) {
  .row #date, .row #return-date { -webkit-appearance:none; appearance:none; }
}
button {
  width:100%; margin-top:1rem; padding:0.875rem; font-size:1rem; font-weight:700;
  color:#fff; background:var(--warm-btn); border:0; border-radius:var(--r-md); cursor:pointer;
}
#go { min-height:var(--tap); box-shadow:0 3px 12px rgba(0,0,0,.18); }
button:active { opacity:.85; }

.field-wrap { position:relative; }
.field-wrap input { padding-right:2.5rem; }
.clear-btn {
  position:absolute; top:50%; right:0.5rem; transform:translateY(-50%);
  width:1.625rem; height:1.625rem; margin:0; padding:0; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.125rem; line-height:1; font-weight:400;
  color:#5b6b7a; background:rgba(0,0,0,.07); border:0; cursor:pointer;
}
.clear-btn:hover { background:rgba(0,0,0,.13); }
.clear-btn[hidden] { display:none; }

.suggest { list-style:none; margin:0.375rem 0 0; padding:0; border:1px solid rgba(255,255,255,.6); border-radius:var(--r-md); max-height:13.75rem; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; display:none; background:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.suggest.show { display:block; }
.suggest li { padding:0.5625rem 0.75rem; font-size:0.875rem; border-top:1px solid #e6ebf0; cursor:pointer; color:var(--ink); display:flex; flex-direction:column; gap:0.0625rem; }
.suggest li:first-child { border-top:0; }
.suggest li:hover, .suggest li:active, .suggest li.active { background:#eef5fc; }
.suggest li .s-title { line-height:1.3; }
.suggest li .s-area { font-size:0.71875rem; color:#8a94a0; line-height:1.2; }
.suggest li.suggest-loading, .suggest li.suggest-empty { cursor:default; color:#8a94a0; }
.suggest li.suggest-loading:hover, .suggest li.suggest-empty:hover { background:transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline:2px solid #2b6cb0; outline-offset:2px; border-radius:var(--r-sm); }

.seg { position:relative; display:flex; padding:0.1875rem; border:1px solid rgba(255,255,255,.5); border-radius:var(--r-pill); background:rgba(255,255,255,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.seg::before {
  content:""; position:absolute; z-index:0; top:0.1875rem; bottom:0.1875rem; left:0.1875rem; width:calc(50% - 0.1875rem);
  border-radius:var(--r-pill); background:rgba(255,255,255,.97);
  transition:transform .25s cubic-bezier(.4,0,.2,1);
}
.seg:has(button:last-child.on)::before { transform:translateX(100%); }
.seg button {
  position:relative; z-index:1; flex:1; margin:0; width:auto; padding:0.5625rem 0; font-size:0.875rem; font-weight:600;
  color:#33475a; background:transparent; border:0; border-radius:var(--r-pill); transition:color .2s;
}
.seg button.on { background:transparent; color:var(--accent); }

.zip-fold { margin:0.5rem 0 0; }
.zip-fold > summary {
  display:flex; align-items:center; min-height:var(--tap); cursor:pointer;
  font-size:0.9375rem; font-weight:600; color:var(--ink); text-shadow:none;
  list-style:none;   
}
.zip-fold > summary::-webkit-details-marker { display:none; }
.zip-fold .fold-mark { margin-left:0.25em; color:var(--sub); transition:transform .2s; }
.zip-fold[open] .fold-mark { transform:rotate(180deg); }
.zip-fold .hint { margin-bottom:0; }

#recent { margin:0.5rem 0 0.25rem; }
#recent .chips-head { font-size:0.75rem; color:var(--sub); margin:0 0.125rem 0.1875rem; }
.chips { display:flex; gap:0.375rem; overflow-x:auto; padding-bottom:0.25rem; -webkit-overflow-scrolling:touch; }
.chips.has-more {
  -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 2rem), transparent);
  mask-image:linear-gradient(to right, #000 calc(100% - 2rem), transparent);
}
.chips.has-prev {
  -webkit-mask-image:linear-gradient(to left, #000 calc(100% - 2rem), transparent);
  mask-image:linear-gradient(to left, #000 calc(100% - 2rem), transparent);
}
.chips.has-prev.has-more {
  -webkit-mask-image:linear-gradient(to right, transparent, #000 2rem, #000 calc(100% - 2rem), transparent);
  mask-image:linear-gradient(to right, transparent, #000 2rem, #000 calc(100% - 2rem), transparent);
}
.chip {
  flex:0 0 auto;   
  display:inline-flex; align-items:center; gap:0.0625rem; padding:0 0.3125rem 0 0;
  background:rgba(255,255,255,.88); border:1px solid rgba(255,255,255,.6); border-radius:var(--r-pill);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.chip-pick {
  width:auto; margin:0; padding:0.4375rem 0.25rem 0.4375rem 0.8125rem; font-size:0.8125rem; font-weight:600;
  color:var(--accent); background:transparent; border:0; border-radius:var(--r-pill); cursor:pointer;
}
.chip-pick:active { opacity:.85; }
.chip-del {
  width:1.25rem; height:1.25rem; margin:0; padding:0; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:0.9375rem; line-height:1; font-weight:400;
  color:#8a94a0; background:rgba(0,0,0,.06); border:0; border-radius:50%; cursor:pointer;
}
.chip-del:hover { background:rgba(0,0,0,.13); color:#5b6b7a; }

.dt-presets { display:flex; flex-wrap:wrap; gap:0.375rem; margin:0.5rem 0.125rem 0; }
.dt-presets button {
  width:auto; margin:0; padding:0.375rem 0.8125rem; font-size:0.8125rem; font-weight:600;
  color:var(--accent); background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.6); border-radius:var(--r-pill); cursor:pointer;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.dt-presets button.on { background:var(--accent); color:#fff; border-color:var(--accent); }
.dt-presets button:active { opacity:.85; }
.check-return { display:inline-flex; align-items:center; gap:0.4em; margin:0.75rem 0.125rem 0; min-height:var(--tap); font-size:0.875rem; color:var(--ink); cursor:pointer; -webkit-user-select:none; user-select:none; }
.check-return input { position:absolute; opacity:0; width:0; height:0; }
.check-return .cbox { flex:0 0 auto; box-sizing:border-box; position:relative; width:1.375rem; height:1.375rem; border-radius:var(--r-sm); border:1.5px solid rgba(255,255,255,.75); background:rgba(255,255,255,.18); transition:background .12s, border-color .12s; }
.check-return .cbox .ic { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:0.9375rem; height:0.9375rem; color:#fff; opacity:0; display:block; vertical-align:0; transition:opacity .12s; }
.check-return input:checked + .cbox { background:var(--accent); border-color:var(--accent); }
.check-return input:checked + .cbox .ic { opacity:1; }
.check-return input:focus-visible + .cbox { outline:2px solid #fff; outline-offset:2px; }

#result { margin-top:1.25rem; scroll-margin-top:1.25rem; }
#result:empty { margin-top:0; }   
#result.result-done { padding-top:1.125rem; }
.card {
  padding:0.875rem 1rem; border-radius:var(--r-card); background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.6);
}
.card + .card { margin-top:0.75rem; }
.warn-card { padding:0.75rem 1rem; border-radius:var(--r-card); margin-bottom:0.75rem;
  background:rgba(255,243,232,.95); border:1px solid rgba(190,90,30,.4); color:#8a3d0c; }
.warn-card.lv-advisory { background:rgba(255,247,224,.95); border-color:rgba(170,120,10,.45); color:#6f4a00; }
.warn-card.lv-warning { background:rgba(253,235,235,.95); border-color:rgba(185,45,45,.45); color:#8e1f1f; }
.warn-card.lv-emergency { background:rgba(245,235,251,.95); border-color:rgba(110,40,150,.5); color:#5a1c7a; }
.warn-head { display:flex; align-items:flex-start; gap:0.2em; margin:0 0 0.375rem;
  font-size:0.9375rem; font-weight:700; line-height:1.4; }
.warn-head .ic { width:1.15em; height:1.15em; flex:0 0 auto; margin-top:0.125em; }
.warn-line { margin:0; font-size:0.8125rem; line-height:1.5; }
.warn-line + .warn-line { margin-top:0.125rem; }
.warn-foot { margin:0.4375rem 0 0; font-size:0.75rem; opacity:.85; }
.warn-foot a { color:inherit; text-decoration:underline; }
.spinner { flex:0 0 auto; width:1.375rem; height:1.375rem; border-radius:50%; border:3px solid rgba(0,0,0,.12); border-top-color:var(--accent); animation:spin .8s linear infinite; }
#go .spinner { display:inline-block; vertical-align:-0.3em; margin-right:0.2em; width:1.125rem; height:1.125rem; border-color:rgba(255,255,255,.5); border-top-color:#fff; }
#go:disabled { opacity:1; cursor:default; }   
@keyframes spin { to { transform:rotate(360deg); } }
.form-error { margin:0.625rem 0 0; color:#b3261e; font-size:0.8125rem; line-height:1.6; text-align:center; }
.form-error:empty { display:none; }   
.retry-btn { width:auto; margin:0.75rem 0 0; padding:0.5rem 1.125rem; font-size:0.875rem; font-weight:700; background:var(--accent); color:#fff; }

.hero { --tk-w:min(30vw, 132px); --tk-h:calc(var(--tk-w) / 1.3952);
        position:relative; isolation:isolate; z-index:2; padding:0.125rem 0.25rem 0.625rem; color:#fff;
        text-shadow:0 1px 5px rgba(0,0,0,.5), 0 0 16px rgba(0,0,0,.32); }
.hero .rh-place { font-size:1.4375rem; font-weight:700; line-height:1.3; margin:0; word-break:keep-all; }
.hero .rh-place::before { content:""; float:right; width:max(0px, min(92px, 332px - 50vw)); height:1px; }
.hero { --tk-name-h:1.625rem; }
.hero .tk { position:absolute; right:-0.75rem; bottom:calc(-1rem + var(--tk-name-h)); z-index:-1;
  width:var(--tk-w); aspect-ratio:499.65 / 358.13; pointer-events:none; }
.hero .tk-name { position:absolute; right:-0.75rem; bottom:-1rem; z-index:-1;
  width:var(--tk-w); text-align:center; pointer-events:none; }
.hero .tk-name span { display:inline-block; padding:0.1875rem 0.625rem; border-radius:999px;
  background:var(--tk-ribbon, #2a6fb0); color:var(--tk-name-ink, #fff);
  font-size:0.6875rem; font-weight:700; letter-spacing:.04em; white-space:nowrap; line-height:1.35;
  text-shadow:none; box-shadow:0 2px 8px rgba(0,0,0,.18); }
.hero .tk-svg { display:block; width:100%; height:100%; color:var(--tk-body, #fff);
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.18));
  animation:tk-float 3.5s ease-in-out infinite; transform-origin:50% 90%; }
@keyframes tk-float {
  0%, 100% { transform:translateY(0) rotate(0deg) scale(1); }
  25%      { transform:translateY(-3px) rotate(-1.2deg) scale(1.008); }
  50%      { transform:translateY(-4px) rotate(0deg) scale(1.01); }
  75%      { transform:translateY(-2px) rotate(1.2deg) scale(1.004); }
}
@keyframes tk-float-y {
  0%, 100% { transform:translateY(0); }
  25%      { transform:translateY(-3px); }
  50%      { transform:translateY(-4px); }
  75%      { transform:translateY(-2px); }
}
.hero .tk-talk, .hero .tk-name { animation:tk-float-y 3.5s ease-in-out infinite; }
.hero #tk-wing-l, .hero #tk-wing-r { transform-box:fill-box; }
.hero #tk-wing-l { transform-origin:0% 55%; animation:tk-flap-l 1.6s ease-in-out infinite; }
.hero #tk-wing-r { transform-origin:100% 55%; animation:tk-flap-r 1.6s ease-in-out infinite; }
@keyframes tk-flap-l { 0%, 100% { transform:rotate(0deg); } 50% { transform:rotate(-9deg); } }
@keyframes tk-flap-r { 0%, 100% { transform:rotate(0deg); } 50% { transform:rotate(9deg); } }
.hero #tk-eye-l, .hero #tk-eye-r {
  transform-box:fill-box; transform-origin:50% 50%;
  animation:tk-blink 5.2s linear infinite;
}
@keyframes tk-blink {
  0%, 94%, 100% { transform:scaleY(1); }
  96%           { transform:scaleY(0.1); }
  98%           { transform:scaleY(1); }
}

.hero .tk-c-shade  { fill:var(--tk-shade,  #e6e6e6); }
.hero .tk-c-ribbon { fill:var(--tk-ribbon, #2a6fb0); }
.hero .tk-c-rim    { fill:var(--tk-rim,    #ef7c3e); }
.hero .tk-c-dial   { fill:var(--tk-dial,   #fae2d4); }
.hero .tk-motif, .hero .tk-motif * { fill:var(--tk-motif, currentColor); }
.hero .tk-motif { display:none; }
body[data-scene] .hero #tk-compass3,
body[data-scene] .hero #tk-compass4,
body[data-scene] .hero #tk-compass5,
body[data-scene] .hero #tk-compass6 { display:none; }

body[data-scene="clear-day"]   { --tk-body:#fffaf0; --tk-shade:#e2dfda; --tk-ribbon:#2a6fb0; --tk-motif:#ef7c3e; --tk-rim:#ef7c3e; --tk-dial:#fae2d4;  --tk-name-ink:#ffffff;}
body[data-scene="clear-night"] { --tk-body:#acaeb4; --tk-shade:#85868a; --tk-ribbon:#1c2026; --tk-motif:#e8db64; --tk-rim:#2e3556; --tk-dial:#727688;  --tk-name-ink:#ffffff;}
body[data-scene="cloudy"]      { --tk-body:#e6e9eb; --tk-shade:#cbcccd; --tk-ribbon:#58656f; --tk-motif:#e6e9eb; --tk-rim:#5c6f7a; --tk-dial:#95a6b1;  --tk-name-ink:#ffffff;}
body[data-scene="rain"]        { --tk-body:#e5f4ff; --tk-shade:#c3cdd5; --tk-ribbon:#2176a1; --tk-motif:#2ea7e0; --tk-rim:#1f6091; --tk-dial:#dceefa;  --tk-name-ink:#ffffff;}
body[data-scene="thunder"]     { --tk-body:#fff5d6; --tk-shade:#c9c1ab; --tk-ribbon:#97942b; --tk-motif:#ffeb0a; --tk-rim:#5c6f7a; --tk-dial:#95a6b1;  --tk-name-ink:#ffffff; }
body[data-scene="snow"]        { --tk-body:#ffffff; --tk-shade:#dde8f0; --tk-ribbon:#b4d8ee; --tk-motif:#ffffff; --tk-rim:#5a98bf; --tk-dial:#8abddb;  --tk-name-ink:#243240;}
body[data-scene="fog"]         { --tk-body:#f5f6f7; --tk-shade:#dcdfe1; --tk-ribbon:#646f78; --tk-motif:#ffffff; --tk-rim:#6b7f8e; --tk-dial:#a7aeb3;  --tk-name-ink:#ffffff;}

body[data-scene="clear-day"]   .hero .tk-motif-clear-day,
body[data-scene="clear-night"] .hero .tk-motif-clear-night,
body[data-scene="cloudy"]      .hero .tk-motif-cloudy,
body[data-scene="rain"]        .hero .tk-motif-rain,
body[data-scene="thunder"]     .hero .tk-motif-thunder,
body[data-scene="snow"]        .hero .tk-motif-snow,
body[data-scene="fog"]         .hero .tk-motif-fog { display:block; }

.hero .rh-when { font-size:0.875rem; margin-top:0.125rem; opacity:.92; }
.hero-weather { display:flex; align-items:center; gap:0.2em; margin-top:0.5rem; }
.hero-weather .w-temp { font-size:3rem; font-weight:700; line-height:1; }
.hero-weather .w-desc { font-size:1.1875rem; font-weight:600; margin-left:0.375rem; }
.hero .cloth { display:flex; align-items:center; gap:0.2em; font-size:0.875rem; margin-top:0.5rem; opacity:.96; }
.hero .cloth .ic { width:1.15em; height:1.15em; }
.hero .tempdiff { display:flex; align-items:center; gap:0.2em; font-size:0.875rem; margin-top:0.375rem; opacity:.96; }
.hero .tempdiff:empty { display:none; }
.hero .tempdiff .ic { width:1.15em; height:1.15em; }
.hero .tempdiff-btn { display:inline-flex; width:auto; margin:0; align-items:center; gap:0.2em; font-size:0.8125rem; color:inherit; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.5); border-radius:var(--r-pill); padding:0.25rem 0.75rem; cursor:pointer; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.hero .tempdiff-btn .ic { width:1.1em; height:1.1em; }
.hero .hero-meta { display:flex; flex-direction:column; gap:0.125rem; font-size:0.84375rem; margin-top:0.3125rem; opacity:.92; }
.hero .hero-meta .m-sub { font-size:0.75rem; }
.hero .tk-talk { position:absolute; z-index:-1; right:-0.75rem; width:var(--tk-w);
  bottom:calc(var(--tk-h) + var(--tk-name-h)); }
.hero .tk-bubble { position:relative; width:100%; aspect-ratio:1.4; border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:0.5rem clamp(0.375rem, 2vw, 0.625rem);
  background:rgba(255,255,255,.96); text-shadow:none; box-shadow:0 2px 10px rgba(0,0,0,.14); }
.hero .tk-bubble[data-lines="1"] { aspect-ratio:1.9; }
.hero .tk-bubble[data-lines="2"] { aspect-ratio:1.6; }
.hero .tk-bubble::after { content:""; position:absolute; left:50%; bottom:-0.4375rem;
  margin-left:-0.375rem; width:0; height:0;
  border-left:0.375rem solid transparent; border-right:0.375rem solid transparent;
  border-top:0.5625rem solid rgba(255,255,255,.96); }
@media (max-width:359px) {
  .hero .tk-name span { font-size:0.625rem; padding:0.125rem 0.5rem; letter-spacing:.02em; }
}
.hero .bub-line { margin:0; font-size:clamp(0.6875rem, 3.4vw, 0.75rem); font-weight:700; line-height:1.35; }
.hero .bub-line + .bub-line { margin-top:0.1875rem; }
.hero .bub-when { display:block; font-size:0.9em; font-weight:600; }
.t-rain  { color:#1f5e9e; }   
.t-maybe { color:#2a6fb0; }   
.t-no    { color:#4a6b80; }   
.t-snow  { color:#2a6fb0; }
.t-heat  { color:#c0392b; }   
.t-cold  { color:#16407a; }   
.t-wind  { color:#17706b; }   
.trend { display:flex; gap:0.25rem; margin-top:0.5625rem; }
.trend-item { flex:1; display:flex; flex-direction:column; align-items:center; gap:0.1875rem; padding:0.375rem 0.125rem; border-radius:var(--r-md); color:var(--sub); }
.trend-item .tr-h { font-size:0.6875rem; }
.trend-item .tr-ic { width:1.375rem; height:1.375rem; color:var(--accent); }
.trend-item .tr-t { font-size:0.8125rem; font-weight:700; color:var(--ink); }
.trend-now { background:rgba(42,111,176,.1); }
.trend-now .tr-h { color:var(--accent); font-weight:700; }

.meta { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem 0.875rem; font-size:0.875rem; margin-top:0.5625rem; color:var(--ink); }
.meta span { display:inline-block; min-width:4.5rem; color:var(--sub); }
.return-strip { display:flex; flex-wrap:wrap; align-items:center; gap:0.25rem 0.625rem; margin-top:0.625rem; padding:0.5rem 0.75rem; border-radius:var(--r-md); background:rgba(42,111,176,.07); font-size:0.84375rem; color:var(--ink); }
.return-strip .rs-when { display:inline-flex; align-items:center; gap:0.2em; font-weight:700; }
.return-strip .rs-when .ic { width:1.1em; height:1.1em; color:var(--accent); }
.return-strip .rs-w { color:var(--sub); }
.forecast-note { margin:0.625rem 0.125rem 0; font-size:0.75rem; color:var(--sub); line-height:1.5; }
.age-note { margin-top:0.375rem; opacity:.75; }

.items { margin-top:0; }
.items-head, .trend-head { display:flex; align-items:center; gap:0.2em; font-weight:700; }
.items-head { margin:0 0 0.5rem; font-size:1.0625rem; color:var(--ink); }
.trend-head { margin:0; font-size:0.9375rem; color:var(--sub); }
.disclosure { margin-top:0.75rem; padding:0.625rem 0.75rem 0.375rem; background:#fff; border-radius:var(--r-md); }
.items-ad-note { display:flex; flex-direction:column; align-items:flex-start; gap:0.25rem; margin:0; font-size:0.75rem; color:var(--ink); }
.pr-tag { display:inline-block; padding:0.0625rem 0.4375rem; border:1px solid #c8d2dc; border-radius:var(--r-sm); background:#fff; color:var(--ink); font-size:0.6875rem; font-weight:700; letter-spacing:.02em; white-space:nowrap; }
.item-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0.75rem 0.625rem; margin-top:0.25rem; }
.items-sub { margin:1rem 0 0; padding-top:0.75rem; border-top:1px solid rgba(36,50,64,.10);
  font-size:0.8125rem; font-weight:700; color:var(--sub); }
.item-group { min-width:0; padding:0; }
.item-head { margin-bottom:0.375rem; }
.item-grid .item-head a { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.item-head a { font-size:0.875rem; color:var(--warm); text-decoration:none; font-weight:700; }
.item-head a:hover { text-decoration:underline; }
.product-row { display:flex; gap:0.625rem; overflow-x:auto; padding-bottom:0.25rem; -webkit-overflow-scrolling:touch; }
.ptile { flex:0 0 calc((100% - 1.25rem - 1rem) / 2); min-width:0; text-decoration:none; color:var(--ink); }
.ptile:only-child { flex-basis:4.375rem; }
.pthumb { display:block; width:100%; aspect-ratio:1/1; border-radius:var(--r-md); border:1px solid rgba(0,0,0,.07); background:#f2f4f7 no-repeat center/cover; }
.pthumb-ph { display:flex; align-items:center; justify-content:center; font-size:0.75rem; color:var(--warm); font-weight:700; background:#fff4ea; }
.pname { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:0.75rem; line-height:1.4; margin-top:0.3125rem; }
.pprice { display:block; font-size:0.75rem; font-weight:700; color:#bf4040; }
.rakuten-credit { margin:0.1rem 0 0; }
.src-note { margin:0.75rem 0; padding:0.625rem 0.75rem; font-size:0.75rem; line-height:1.6; text-align:left;
  color:#fff; background:rgba(0,0,0,.55); border-radius:var(--r-md); }
.src-note a { color:#fff; text-decoration:underline; }
.src-note span { display:block; padding-left:1em; text-indent:-1em; }
.src-note span + span { margin-top:0.25rem; }

.help-btn { position:fixed; top:calc(0.75rem + var(--sat)); right:0.75rem; z-index:40; width:auto; margin:0; min-height:var(--tap);
  display:inline-flex; align-items:center; padding:0.4rem 0.85rem; font-size:0.8125rem; font-weight:700;
  color:var(--accent); background:rgba(255,255,255,.9); border:1px solid rgba(42,111,176,.28); border-radius:var(--r-pill);
  box-shadow:0 3px 12px rgba(0,0,0,.18); cursor:pointer; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.help-btn .ic { margin-right:0.2em; }
.help-btn:active { opacity:.85; }
.help-btn .help-btn-label { max-width:5em; overflow:hidden; white-space:nowrap;
  transition:max-width .2s, margin-left .2s, opacity .2s; }
.help-btn.compact { padding:0; width:var(--tap); justify-content:center; }
.help-btn.compact .ic { margin-right:0; }
.help-btn.compact .help-btn-label { max-width:0; opacity:0; }

.help-overlay { position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center;
  padding:1rem; overflow:auto; overscroll-behavior:contain;
  background:rgba(20,28,36,.55); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.help-overlay[hidden] { display:none; }
.help-dialog { position:relative; width:100%; max-width:26rem; max-height:85vh; overflow-y:auto;
  overscroll-behavior:contain;
  background:#fff; color:var(--ink); border-radius:var(--r-card); padding:1.25rem 1.25rem 1.375rem;
  box-shadow:0 12px 40px rgba(0,0,0,.3); text-align:left; line-height:1.75; }
.help-dialog:focus { outline:none; }
.help-dialog h2 { font-size:1.125rem; margin:0 0 0.5rem; color:var(--accent); }
.help-dialog h3 { font-size:0.9375rem; margin:1rem 0 0.35rem; color:var(--accent); }
.help-dialog p { font-size:0.875rem; margin:0 0 0.25rem; }
.help-dialog li { font-size:0.875rem; }
.help-dialog ul { list-style:none; margin:0.5rem 0 0; margin-left:0; padding-left:0; }
.help-dialog ul li { position:relative; padding-left:1em; }
.help-dialog ul li + li { margin-top:0.3rem; }
.help-dialog ul li::before { content:""; position:absolute; left:0; top:calc(0.875em - 0.21875em);
  width:0.4375em; height:0.4375em; border-radius:50%; background:var(--accent); }
.help-dialog ul li ul { margin:0.35rem 0; }
.help-dialog ul li li { padding-left:1.1em; }
.help-dialog ul li li::before { content:"–"; width:auto; height:auto; background:none; border-radius:0;
  top:0; left:0; color:#9aa6b2; }
.help-dialog a { color:var(--accent); }
.help-close { position:sticky; float:right; top:-1rem; z-index:1;
  width:var(--tap); height:var(--tap); margin:-1rem -1rem 0 0; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--sub); background:#fff; border:none; border-radius:50%; box-shadow:none; cursor:pointer; }
.help-close .ic { width:1.75em; height:1.75em; stroke-width:2.5; }
.help-close:active { opacity:.6; }
.help-start { display:block; width:100%; margin:1.125rem 0 0; padding:0.75rem; font-size:1rem; font-weight:700;
  color:#fff; background:var(--warm-btn); border:none; border-radius:var(--r-md); min-height:var(--tap); cursor:pointer; }
.help-start:active { opacity:.85; }


.hm-tk { flex:0 0 auto; width:4.25rem; aspect-ratio:499.65 / 358.13; }
.hm-tk .tk-svg { display:block; width:100%; height:100%; color:#fff;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.18));
  animation:tk-float 3.5s ease-in-out infinite; transform-origin:50% 90%; }

.hm-tk [data-tkp="tk-wing-l"], .hm-tk [data-tkp="tk-wing-r"] { transform-box:fill-box; }
.hm-tk [data-tkp="tk-wing-l"] { transform-origin:0% 55%; animation:tk-flap-l 1.6s ease-in-out infinite; }
.hm-tk [data-tkp="tk-wing-r"] { transform-origin:100% 55%; animation:tk-flap-r 1.6s ease-in-out infinite; }
.hm-tk [data-tkp="tk-eye-l"], .hm-tk [data-tkp="tk-eye-r"] {
  transform-box:fill-box; transform-origin:50% 50%; animation:tk-blink 5.2s linear infinite; }

.hm-hello, .hm-note { display:flex; align-items:center; gap:0.625rem; margin:0.75rem 0 0; }
.hm-note { margin-top:1.125rem; }
.hm-bubble { position:relative; flex:1 1 auto; margin:0 !important; padding:0.5rem 0.75rem;
  font-size:0.8125rem !important; font-weight:700; line-height:1.5; color:var(--accent);
  background:#eef4fa; border-radius:var(--r-md); }
.hm-bubble::before { content:""; position:absolute; left:-0.375rem; top:50%; margin-top:-0.375rem;
  width:0; height:0; border-top:0.375rem solid transparent; border-bottom:0.375rem solid transparent;
  border-right:0.4375rem solid #eef4fa; }

.hm-steps { list-style:none; margin:1rem 0 0; padding:0; }
.hm-step + .hm-step { margin-top:0.875rem; }
.hm-step h3 { display:flex; align-items:center; gap:0.25rem; margin:0 0 0.25rem !important; }
.hm-num { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  width:1.25rem; height:1.25rem; font-size:0.75rem; font-weight:700;
  color:#fff; background:var(--warm); border-radius:50%; }
.hm-step p { margin:0 0 0.4375rem !important; color:var(--sub); }

.hm-shot { padding:0.625rem; background:#f7f9fb; border:1px solid rgba(42,111,176,.16);
  border-radius:var(--r-md); font-size:0.8125rem; }
.hm-shot .ic { flex:0 0 auto; width:1.0625rem; height:1.0625rem; }

.hm-field { display:flex; align-items:center; gap:0.375rem; padding:0.375rem 0.5rem;
  color:var(--ink); background:#fff; border:1px solid rgba(42,111,176,.2); border-radius:var(--r-sm); }
.hm-field + .hm-field { margin-top:0.3125rem; }
.hm-field .ic { color:var(--accent); }
.hm-go { margin-top:0.4375rem; padding:0.3125rem; text-align:center; font-weight:700;
  color:#fff; background:var(--warm-btn); border-radius:var(--r-sm); }

.hm-shot-sky { position:relative; overflow:hidden; border-color:rgba(0,0,0,.18);
  background:linear-gradient(180deg,#465666,#6a7a8b 60%,#8b98a5); }
.hm-shot-sky::before { content:""; position:absolute; inset:0;
  pointer-events:none; filter:blur(18px);
  background:radial-gradient(ellipse 60% 100% at 18% 62%, rgba(28,36,46,.5), transparent 70%),
             radial-gradient(ellipse 72% 100% at 60% 44%, rgba(34,42,52,.4), transparent 72%),
             radial-gradient(ellipse 50% 100% at 92% 66%, rgba(28,36,46,.5), transparent 70%); }
.hm-shot-sky .hm-hero { position:relative; z-index:1; }

.hm-hero { display:flex; align-items:center; justify-content:space-between; gap:0.5rem; flex-wrap:wrap; }
.hm-hero-main { display:flex; align-items:center; gap:0.375rem;
  color:#fff; text-shadow:0 1px 5px rgba(0,0,0,.5), 0 0 16px rgba(0,0,0,.32); }
.hm-hero-main .ic { width:1.5rem; height:1.5rem; }
.hm-temp { font-size:1.25rem; font-weight:700; }
.hm-desc { color:rgba(255,255,255,.92); }
.hm-say { position:relative; padding:0.25rem 0.5rem; font-weight:700; color:#1f5e9e;
  background:rgba(255,255,255,.96); border-radius:var(--r-pill); box-shadow:0 1px 3px rgba(0,0,0,.12); }

.hm-items { display:flex; flex-direction:column; gap:0.3125rem; }
.hm-item { display:flex; align-items:center; gap:0.375rem; padding:0.3125rem 0.5rem;
  color:var(--ink); background:#fff; border-radius:var(--r-sm); }
.hm-item .ic { color:var(--warm); }

.hm-caveat { margin:0.5rem 0 0 !important; font-size:0.75rem !important; line-height:1.7; color:var(--sub); }

.hm-install { margin-top:1.125rem; padding-top:1rem; border-top:1px solid rgba(42,111,176,.16); }
.hm-install-lead { margin:0 0 0.5rem !important; font-size:0.8125rem !important; line-height:1.5;
  color:var(--sub); text-align:center; }
.hm-install-btn { display:flex; align-items:center; justify-content:center; gap:0.2em;
  margin-top:0; padding:0.625rem 0.75rem; font-size:0.9375rem; min-height:var(--tap);
  color:var(--accent); background:#fff; border:1px solid rgba(42,111,176,.35); border-radius:var(--r-md); }
.hm-install-btn[hidden] { display:none; }
.hm-install-note { margin:0.5rem 0 0 !important; font-size:0.8125rem !important; line-height:1.8; color:var(--sub); }
.hm-install-note .ic { width:1.05em; height:1.05em; vertical-align:-0.18em; color:var(--accent); }

@media (max-width: 359px) {
  .hm-tk { width:3.5rem; }
}

.feedback-block { margin-top:0.75rem; padding:0.75rem 0.875rem; background:rgba(255,255,255,.82);
  border-radius:var(--r-card); text-align:center; }
.feedback-block .fb-q { font-size:0.8125rem; font-weight:700; color:var(--ink); margin:0 0 0.25rem; }
.feedback-block .fb-hint { font-size:0.75rem; color:var(--sub); margin:0 0 0.5rem; line-height:1.45; }
.feedback-block .fb-q2 { font-size:0.75rem; color:var(--sub); margin:0.625rem 0 0.4rem; }
.feedback-block .fb-row, .feedback-block .fb-drow { display:grid; gap:0.5rem; justify-content:center; }
.feedback-block .fb-row { grid-template-columns:repeat(2, max-content); justify-items:center; }
.feedback-block .fb-drow { grid-template-columns:repeat(2, 1fr); width:fit-content; margin-inline:auto; }
.feedback-block .fb-btn { width:auto; margin:0; padding:0.4rem 0.9rem; font-size:0.8125rem; font-weight:700;
  color:var(--accent); background:#fff; border:1px solid rgba(42,111,176,.4); border-radius:var(--r-pill);
  min-height:auto; box-shadow:none; cursor:pointer; }
.feedback-block .fb-btn:active { opacity:.85; }
.feedback-block { --fb-hit:#0c8546; --fb-miss:#9a6a00; --fb-pill-w:6.25rem; }
.feedback-block .fb-row .fb-btn, .feedback-block .fb-send { min-width:var(--fb-pill-w); }
.feedback-block .fb-btn[data-fb="hit"]  { color:var(--fb-hit);  border-color:rgba(12,133,70,.5); }
.feedback-block .fb-btn[data-fb="miss"] { color:var(--fb-miss); border-color:rgba(154,106,0,.5); }
.feedback-block .fb-btn[data-fb="hit"].is-picked  { color:#fff; background:var(--fb-hit);  border-color:var(--fb-hit); }
.feedback-block .fb-btn[data-fb="miss"].is-picked { color:#fff; background:var(--fb-miss); border-color:var(--fb-miss); }
.feedback-block .fb-btn[data-fb]:disabled { cursor:default; }
.feedback-block .fb-btn[data-fb]:disabled:not(.is-picked) { opacity:.4; }
.feedback-block .fb-drow .fb-btn { color:var(--fb-miss); border-color:rgba(154,106,0,.5); }
.feedback-block .fb-drow .fb-btn.is-picked { color:#fff; background:var(--fb-miss); border-color:var(--fb-miss); }
.feedback-block .fb-drow .fb-btn:disabled { cursor:default; }
.feedback-block .fb-drow .fb-btn:disabled:not(.is-picked) { opacity:.4; }
.feedback-block .fb-btn .ic { width:1em; height:1em; margin-right:0.2em; vertical-align:-0.12em; }
.feedback-block .fb-note { margin-top:0.5rem; display:flex; flex-direction:column; align-items:center; gap:0.4rem; }
.feedback-block .fb-note[hidden] { display:none; }
.feedback-block .fb-note-caution { margin:0; font-size:0.75rem; color:var(--sub); line-height:1.45; text-align:left; width:100%; }
.feedback-block .fb-note textarea { width:100%; font:inherit; font-size:0.875rem; color:var(--ink);
  padding:0.5rem 0.625rem; border:1px solid #cfd8e0; border-radius:var(--r-sm); min-height:4.5rem; resize:vertical;
  display:block; }
.feedback-block .fb-send { color:#fff; background:var(--fb-miss); border-color:var(--fb-miss); }
.feedback-block .fb-lead, .feedback-block .fb-was {
  font-size:0.8125rem; font-weight:700; color:var(--sub); line-height:1.45; margin:0; }
.feedback-block .fb-lead { word-break:keep-all; }
.feedback-block .fb-when { display:block; white-space:nowrap; }
.feedback-block .fb-was { margin-bottom:0.4375rem; }
.feedback-block .fb-skip { margin:0.625rem 0 0; }
.feedback-block .fb-skipbtn { width:auto; min-height:auto; margin:0; padding:0.25rem 0.5rem; box-shadow:none;
  font:inherit; font-size:0.75rem; color:var(--sub); background:none; border:0;
  text-decoration:underline; cursor:pointer; }
.feedback-block .fb-skipbtn:disabled { cursor:default; opacity:.4; }
.feedback-block .fb-thanks { font-size:0.75rem; color:var(--sub); line-height:1.45; margin:0.625rem 0 0; }

.share-block { margin-top:0.75rem; margin-bottom:-0.625rem; text-align:center; }
.share-block .share-label { font-size:0.8125rem; color:#fff; margin:0 0 0.35rem;
  text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }
.share-row { display:flex; gap:0.75rem; justify-content:center; flex-wrap:wrap; }
.share-ico {
  width:2.75rem; height:2.75rem; min-height:var(--tap); border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  color:#fff; background:#5b6b7a; border:none; cursor:pointer; padding:0;
  margin:0;
  transition:transform .1s ease, filter .1s ease;
}
.share-ico:hover { filter:brightness(1.08); }
.share-ico:active { transform:scale(.92); }
.share-ico:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.share-ico .ic { width:1.4em; height:1.4em; }
.share-ico--brand .ic { fill:currentColor; stroke:none; }
.share-ico.is-x { background:#000; }
.share-ico.is-threads { background:#000; }
.share-ico.is-x:hover, .share-ico.is-threads:hover { background:#262626; }
.share-ico.is-line { background:#06c755; }
.share-ico.is-copy { background:var(--accent); }        
.share-ico.is-native { background:var(--warm); }        
.share-ico.is-copy.copied { background:#0ea5e9; }
.share-ico.is-copy.copied:hover { filter:none; }
.share-copied-toast { font-size:0.75rem; color:#fff; margin:0.4rem 0 0; min-height:1em; opacity:0; transition:opacity .15s;
  text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }
.share-copied-toast.show { opacity:1; }

.to-top {
  position:fixed; right:1rem; bottom:calc(1rem + env(safe-area-inset-bottom, 0px)); z-index:5;
  width:var(--tap); height:var(--tap); margin-top:0; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:var(--r-pill); color:var(--accent); background:rgba(255,255,255,.9);
  border:1px solid rgba(42,111,176,.28); box-shadow:0 3px 12px rgba(0,0,0,.18);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  opacity:0; visibility:hidden; transform:translateY(0.5rem);
  transition:opacity .2s, transform .2s, visibility .2s;
}
.to-top.show { opacity:1; visibility:visible; transform:none; }
.to-top .ic { width:1.25em; height:1.25em; }

.install-foot {
  margin:0 calc(var(--tap) + 0.5rem) 0 0; padding:0.375rem 0.625rem; text-align:center;
  background:rgba(255,255,255,.92); border-radius:var(--r-card); }
.install-foot-row { display:flex; flex-wrap:nowrap; align-items:center; justify-content:center; gap:0.5rem; }
.install-foot-row[hidden] { display:none; }   
@media (min-width:600px) { .install-foot { margin-right:0; } }
.install-foot-row p { flex:0 0 auto; margin:0; font-size:0.75rem; line-height:1.4; color:var(--sub);
  overflow-wrap:normal; word-break:keep-all; }
.install-foot-note { margin:0 !important; font-size:0.75rem; line-height:1.6; color:var(--sub); text-align:left; }
body.has-install-steps .install-foot { padding:0.625rem 0.75rem; }
.install-foot-note .ic { width:1.05em; height:1.05em; vertical-align:-0.18em; color:var(--accent); }
#install-foot-go { display:inline-flex; align-items:center; justify-content:center; gap:0.2em;
  width:auto; flex:0 0 auto; margin-top:0; padding:0.25rem 0.625rem; font-size:0.75rem; min-height:2.375rem;
  color:var(--accent); background:#fff; border:1px solid rgba(42,111,176,.35); border-radius:var(--r-pill); }
#install-foot-go[hidden] { display:none; }   
@media (max-width:359px) { #install-foot-go { font-size:0.6875rem; padding:0.25rem 0.5rem; } }

footer { color:#fff; margin-top:1.5rem; padding:0.75rem 0.875rem; font-size:0.75rem; line-height:1.7;
  background:rgba(0,0,0,.55); border-radius:var(--r-md); }
footer a { color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; opacity:.85; }
footer p { margin:0; }
footer p + p { margin-top:0.5rem; }
.foot-head { font-weight:700; margin-right:0.4em; }
.page-links { margin:0.875rem 0 calc(var(--tap) + 0.5rem + env(safe-area-inset-bottom, 0px));
  text-align:center; font-size:0.75rem; line-height:1.6; }
body.has-install-card .page-links { margin-bottom:0.875rem; }
body.has-install-card .content { padding-bottom:calc(var(--install-pb, 1rem) + env(safe-area-inset-bottom, 0px)); }
.page-links a { color:#fff; text-decoration:none; opacity:1; text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }
.page-links-sep { color:#fff; opacity:1; margin:0 0.6em; text-shadow:0 1px 4px rgba(0,0,0,.45), 0 0 14px rgba(0,0,0,.3); }

.ic { width:1.3em; height:1.3em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vertical-align:-0.24em; flex:0 0 auto; }
.seg-label .ic, .chips-head .ic, label .ic { margin-right:0.2em; }
.ic-postmark { margin-right:0.2em; font-weight:700; }
.seg button .ic { margin-right:0.2em; }
#go .ic { margin-right:0.2em; vertical-align:-0.3em; }
.items-head .ic, .trend-head .ic { width:1.15em; height:1.15em; }
.items-head .ic { color:var(--warm); }
.trend-head .ic { color:currentColor; }
.item-head a .ic { margin-right:0.2em; }
.ic-weather { width:2.875rem; height:2.875rem; stroke-width:1.5; color:#fff; }

@media (prefers-reduced-motion: reduce) {
  .cloud, .drop, .flake, .star, .sun, .flash, .fog, .fog::after, .fog-band, .mote,
  .splash i, .bolt polygon, #sky::before { animation:none !important; }
  .flake { translate:none; }
  .bolt polygon { opacity:.55; }   
  .seg::before { transition:none; }
  .to-top { transition:none; }
  .hero .tk-svg, .hero #tk-wing-l, .hero #tk-wing-r,
  .hero #tk-eye-l, .hero #tk-eye-r,
  .hero .tk-talk, .hero .tk-name { animation:none !important; }
  .hm-tk .tk-svg, .hm-tk [data-tkp] { animation:none !important; }
}