/* 飛行機と電気のルール — 朝の空と旅じたくの色。外部フォント・外部画像は使わない */
:root{
  --bg:#fbf7f1;--surface:#ffffff;--text:#1f2a37;--muted:#5d6673;--line:#e6ded2;--accent:#1f6fb2;
  --sky1:#8fd0f5;--sky2:#cfeaf8;--sky3:#fde6cc;--sun:#ffc766;--cloud:#ffffff;--ink:#16324f;--coral:#d9603d;--coral-bg:#fdeee8;
  --ok:#1e7a3c;--ok-bg:#e6f4ea;--cond:#8a5a00;--cond-bg:#fdf1d6;--ng:#b3261e;--ng-bg:#fbe7e4;--check:#4a4a8a;--check-bg:#ebebf8;
  --shadow:0 1px 2px rgba(31,42,55,.06),0 4px 14px rgba(31,42,55,.06);
}
@media (prefers-color-scheme:dark){:root{
  --bg:#10151d;--surface:#1a212c;--text:#e8edf3;--muted:#a3adb9;--line:#2c3542;--accent:#8cc3f2;
  --sky1:#0d2340;--sky2:#1d3a63;--sky3:#3b3f6b;--sun:#f5e6b0;--cloud:#8fa3bd;--ink:#eaf2fb;--coral:#f39a7f;--coral-bg:#35211c;
  --ok:#81c995;--ok-bg:#1b2b21;--cond:#f2c26b;--cond-bg:#2e2615;--ng:#f28b82;--ng-bg:#321c1a;--check:#b4b4f0;--check-bg:#23233a;
  --shadow:0 1px 2px rgba(0,0,0,.3);
}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.75 -apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;padding-bottom:72px}
a{color:var(--accent)}
main,footer{max-width:720px;margin:0 auto;padding:0 16px}
h1{font-size:26px;line-height:1.35;margin:.3em 0 .3em;letter-spacing:.02em}
h2{font-size:19px;margin:0 0 .6em;display:flex;align-items:center;gap:.5em}
h3{font-size:17px;margin:0 0 .5em;display:flex;align-items:center;gap:.4em;flex-wrap:wrap}
h4{font-size:15px;margin:.8em 0 .3em;display:flex;align-items:center;gap:.4em;flex-wrap:wrap}
.h-sub{font-size:15px;margin:1em 0 .2em}
.lead{margin:0 0 .6em}
.muted{color:var(--muted);font-size:14px}

/* ---- 空のヘッダー ---- */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 60%,var(--sky3) 100%);color:var(--ink);margin-bottom:20px}
.hero-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-inner{position:relative;max-width:720px;margin:0 auto;padding:14px 16px 28px}
.hero.slim .hero-inner{padding-bottom:16px}
.hero.slim h1{font-size:22px;margin-top:.6em}
.kicker{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--coral);background:var(--surface);border-radius:999px;padding:.15em .8em;margin-top:14px;box-shadow:var(--shadow)}
.topnav{display:flex;justify-content:space-between;align-items:center;gap:1em;flex-wrap:wrap;font-size:14px}
.site{color:var(--ink);text-decoration:none;font-weight:700;display:inline-flex;align-items:center;gap:.45em}
.site img{width:22px;height:22px;border-radius:6px}
.topnav span a{margin-left:1em;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:.2em 0 0;padding:0;list-style:none}
.chips li{font-size:13px;background:rgba(255,255,255,.8);color:#16324f;border-radius:999px;padding:.2em .8em}
@media (prefers-color-scheme:dark){.chips li{background:rgba(26,33,44,.75);color:var(--ink)}}
.privacy{font-size:14px;background:var(--ok-bg);color:var(--text);border-radius:12px;padding:.6em .8em;margin:0 0 16px}

/* ---- 入力のパネル ---- */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px;margin:0 0 16px;box-shadow:var(--shadow)}
.step{flex:none;display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--coral-bg);color:var(--coral)}
.step svg{width:20px;height:20px}
.step-title small{display:block;font-size:11px;font-weight:700;color:var(--coral);letter-spacing:.1em;line-height:1.1}
.field{display:block;margin:.5em 0}
.field>span{display:block;font-size:14px;color:var(--muted);margin-bottom:.2em}
select,input[type=number]{width:100%;font-size:16px;padding:.6em .7em;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text)}
select:focus,input:focus{outline:2px solid var(--accent);outline-offset:1px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.grid3 .field{margin:.2em 0}
.inline{display:flex;align-items:center;gap:6px}
.inline input{width:6em}
.check{display:flex;align-items:flex-start;gap:.5em;margin:.5em 0}
.check input{width:1.2em;height:1.2em;margin-top:.25em;flex:none;accent-color:var(--coral)}
.item{border-top:1px dashed var(--line);padding:10px 0}
.item:first-child{border-top:0}
.item-head{display:flex;justify-content:space-between;align-items:center}
button{font-size:15px;padding:.55em 1em;border-radius:999px;border:1px solid var(--accent);background:transparent;color:var(--accent)}
button.link{border:0;padding:.2em;text-decoration:underline;font-size:14px;border-radius:4px}

/* ---- 判定 ---- */
.result-head{margin:28px 0 12px}
.ready{display:flex;align-items:center;gap:.7em;background:var(--ok-bg);color:var(--ok);border-radius:14px;padding:12px 14px;margin:0 0 14px;font-weight:700}
.ready svg{flex:none;width:30px;height:30px}
.card{background:var(--surface);border:1px solid var(--line);border-left:6px solid var(--line);border-radius:14px;padding:14px 16px;margin:0 0 14px;box-shadow:var(--shadow)}
.card.ok{border-left-color:var(--ok)}.card.cond{border-left-color:var(--cond)}.card.ng{border-left-color:var(--ng)}.card.check{border-left-color:var(--check)}
.card ul{margin:.3em 0;padding-left:1.2em}
.card li{margin:.25em 0}
.sub{border-top:1px solid var(--line);margin-top:8px}
.sub:first-child{border-top:0;margin-top:0}
.badge{display:inline-block;font-size:13px;font-weight:700;padding:.1em .7em;border-radius:999px}
.badge.ok{color:var(--ok);background:var(--ok-bg)}.badge.cond{color:var(--cond);background:var(--cond-bg)}
.badge.ng{color:var(--ng);background:var(--ng-bg)}.badge.check{color:var(--check);background:var(--check-bg)}
details.src{margin-top:.6em;font-size:14px}
details.src summary{cursor:pointer;color:var(--muted)}
details.src li{margin:.4em 0}
.note{margin-top:1em}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{border:1px solid var(--line);padding:.4em .5em;text-align:left;vertical-align:top}
th{background:var(--bg)}

/* ---- 下の要約バー ---- */
.summary{position:fixed;left:0;right:0;bottom:0;z-index:10;background:var(--surface);border-top:3px solid var(--line);box-shadow:0 -2px 10px rgba(0,0,0,.1)}
.summary.ok{border-top-color:var(--ok)}.summary.cond{border-top-color:var(--cond)}.summary.ng{border-top-color:var(--ng)}.summary.check{border-top-color:var(--check)}
.summary a{display:flex;align-items:center;gap:.8em;max-width:720px;margin:0 auto;padding:10px 16px calc(10px + env(safe-area-inset-bottom));color:var(--text);text-decoration:none;font-size:14px;line-height:1.4}
.summary-text{flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.summary-go{flex:none;color:var(--accent);font-weight:700}

/* ---- 足もと ---- */
.horizon{display:block;width:100%;height:56px;margin-top:28px}
footer{padding:20px 16px 40px;font-size:14px;color:var(--muted)}
footer nav a{margin-right:1em;display:inline-block}
@media (max-width:420px){.grid3{grid-template-columns:1fr 1fr}.grid3 .field:last-child{grid-column:1/-1}h1{font-size:23px}}
@media (prefers-color-scheme:dark){.hero-art ellipse{opacity:.35}}
/* 飛行機: 左下から右上へ前進だけ（直線の航路の上を飛び、右上へ抜けたら左下から戻る） */
.hero-trail{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-trail line{stroke:var(--ink);stroke-width:1.6;stroke-dasharray:3 9;stroke-linecap:round;opacity:.28}
.flyer{position:absolute;left:78%;top:32.1%;width:30px;height:30px;pointer-events:none;transform:translate(-50%,-50%) rotate(var(--fly-rot,62deg));opacity:.95}
.flyer svg{display:block;width:100%;height:100%;fill:#fff;filter:drop-shadow(0 1px 1.5px rgba(22,50,79,.55))}
@media (min-width:720px){.flyer{width:38px;height:38px}}
@media (prefers-reduced-motion:no-preference){.flyer{animation:fly 16s linear infinite}}
@keyframes fly{0%{left:-10%;top:82%;opacity:0}6%{opacity:.95}94%{opacity:.95}100%{left:110%;top:14%;opacity:0}}
/* 見出しまわりの文字に、空の色になじむ縁取り（飛行機・雲と重なっても読めるように） */
.hero-inner h1,.hero-inner .lead{text-shadow:0 0 2px var(--sky2),0 0 6px var(--sky2),0 0 12px var(--sky2)}
@media (prefers-color-scheme:dark){.flyer svg{fill:var(--coral);filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.6))}}
/* 問い合わせフォーム */
textarea{width:100%;font:inherit;font-size:16px;padding:.6em .7em;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);resize:vertical}
input[type=email]{width:100%;font-size:16px;padding:.6em .7em;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text)}
button.primary{background:var(--coral);border-color:var(--coral);color:#fff;font-weight:700;padding:.7em 1.6em;margin-top:.6em}
.notice{background:var(--cond-bg);border-radius:10px;padding:.6em .8em}
.form-error{background:var(--ng-bg);color:var(--ng);border-radius:10px;padding:.6em .8em;font-weight:700}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cf-turnstile{margin:.6em 0}