/* Yukanau Public Launch Shell v1.0.0 */

/* 公開初期は検索・お気に入りへの入口をサイト全体から隠す。
   機能そのもの・検索URL・SEO設定は変更しない。 */
a[aria-label="検索"][href*="?s="],
a[aria-label="お気に入り"][href*="/favorites/"] {
  display: none !important;
}

body.error404 {
  margin: 0 !important;
  color: #29384c;
  background: #f7faf9;
  font-family: "Noto Sans JP", "Noto Sans CJK JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.error404 * { box-sizing: border-box; }
body.error404 a { color: inherit; }
body.error404 #yk404-shell {
  --ink: #29384c;
  --muted: #71808d;
  --hair: rgba(41,56,76,.11);
  --sky: #6f9fc1;
  --leaf: #5c9b78;
  --light: #dca64b;
  --serif: "Zen Old Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 88% 8%, rgba(255,226,158,.18), transparent 24rem),
    radial-gradient(circle at 10% 3%, rgba(168,207,226,.20), transparent 29rem),
    #f7faf9;
}

#yk404-shell .yk404-header {
  position: sticky;
  top: 0;
  z-index: 40;
  height: 86px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(45,61,78,.08);
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
body.admin-bar #yk404-shell .yk404-header { top: 32px; }

#yk404-shell .yk404-header-inner {
  width: 100%;
  padding: 0 clamp(28px,4.2vw,66px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

#yk404-shell .yk404-brand {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  text-decoration: none;
  color: var(--ink);
}
#yk404-shell .yk404-mark {
  position: relative;
  width: 28px;
  height: 28px;
  margin-top: 3px;
  flex: 0 0 auto;
}
#yk404-shell .yk404-mark i { position:absolute; width:5px; height:5px; border-radius:50%; opacity:.82; }
#yk404-shell .yk404-mark i:nth-child(1){left:12px;top:0;background:#e29a8f}
#yk404-shell .yk404-mark i:nth-child(2){left:4px;top:7px;background:#e4bf6c}
#yk404-shell .yk404-mark i:nth-child(3){left:20px;top:7px;background:#8eb4c7}
#yk404-shell .yk404-mark i:nth-child(4){left:0;top:16px;background:#a7c4ad}
#yk404-shell .yk404-mark i:nth-child(5){left:12px;top:13px;background:#c6a0c8}
#yk404-shell .yk404-mark i:nth-child(6){left:23px;top:17px;background:#e59d6f}
#yk404-shell .yk404-mark i:nth-child(7){left:6px;top:23px;background:#87b9c9}
#yk404-shell .yk404-mark i:nth-child(8){left:17px;top:23px;background:#d7b8a6}
#yk404-shell .yk404-brand-name {
  display:block;
  font-family: var(--serif);
  font-size: clamp(18px,1.35vw,21px);
  font-weight: 500;
  line-height: 1.22;
  letter-spacing: .15em;
  white-space: nowrap;
}
#yk404-shell .yk404-tagline {
  display:block;
  margin-top:7px;
  font-family:var(--serif);
  font-size:clamp(10px,.72vw,11.5px);
  font-weight:400;
  line-height:1.58;
  letter-spacing:.085em;
  color:#425269;
  white-space:nowrap;
}
#yk404-shell .yk404-tools { display:flex; align-items:center; gap:14px; }
#yk404-shell .yk404-current { font-size:11px; color:#64727d; white-space:nowrap; }
#yk404-shell .yk404-menu-open {
  width:38px; height:44px; padding:0; border:0; background:transparent; color:#26364b;
  display:grid; place-items:center; cursor:pointer;
}
#yk404-shell .yk404-menu-open svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; }
#yk404-shell .yk404-menu-open:focus-visible,
#yk404-shell .yk404-menu-close:focus-visible,
#yk404-shell a:focus-visible { outline:2px solid rgba(70,101,132,.65); outline-offset:4px; border-radius:7px; }

#yk404-shell .yk404-main {
  flex:1;
  width:min(980px,calc(100% - 64px));
  margin:0 auto;
  padding:clamp(70px,10vh,118px) 0 110px;
}
#yk404-shell .yk404-kicker {
  margin:0 0 13px;
  font-size:11px;
  letter-spacing:.12em;
  color:#7a8791;
}
#yk404-shell .yk404-title {
  max-width:780px;
  margin:0;
  font-family:var(--serif);
  font-size:clamp(32px,3vw,44px);
  font-weight:500;
  line-height:1.5;
  letter-spacing:.025em;
  color:#29384c;
}
#yk404-shell .yk404-rule {
  width:64px; height:2px; margin:24px 0 38px; border-radius:99px;
  background:linear-gradient(90deg,var(--sky),var(--leaf),var(--light));
}
#yk404-shell .yk404-lead {
  max-width:42em;
  margin:0;
  font-size:16px;
  line-height:2;
  color:#475968;
}
#yk404-shell .yk404-actions {
  margin-top:38px;
  display:flex;
  flex-wrap:wrap;
  gap:12px 18px;
}
#yk404-shell .yk404-action {
  min-height:46px;
  display:inline-flex;
  align-items:center;
  gap:11px;
  padding:10px 17px;
  border:1px solid rgba(41,56,76,.12);
  border-radius:999px;
  background:rgba(255,255,255,.70);
  text-decoration:none;
  color:#40586c;
  font-size:13px;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
#yk404-shell .yk404-action:hover { background:#fff; border-color:rgba(111,159,193,.34); transform:translateY(-1px); }
#yk404-shell .yk404-action span:last-child { color:#8396a4; }

#yk404-shell .yk404-footer {
  padding:30px 0 26px;
  border-top:1px solid var(--hair);
  background:rgba(255,255,255,.45);
  color:#70808b;
  font-size:11px;
}
#yk404-shell .yk404-footer-inner { width:min(980px,calc(100% - 64px)); margin:auto; }
#yk404-shell .yk404-footer-links { display:flex; justify-content:center; flex-wrap:wrap; gap:10px 24px; }
#yk404-shell .yk404-footer-links a { text-decoration:none; }
#yk404-shell .yk404-copyright { margin:13px 0 0; text-align:center; font-size:9.5px; letter-spacing:.07em; color:#8a959d; }

/* 全画面メニュー本体は header の外側。backdrop-filter の containing block に閉じ込めない。 */
#yk404-shell .yk404-menu {
  position:fixed;
  inset:0;
  z-index:99990;
  display:none;
  background:rgba(247,249,250,.96);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
#yk404-shell .yk404-menu[aria-hidden="false"] { display:block; }
body.admin-bar #yk404-shell .yk404-menu { top:32px; }
#yk404-shell .yk404-menu-inner { width:min(720px,calc(100% - 48px)); margin:14vh auto 0; padding:34px; }
#yk404-shell .yk404-menu-close {
  margin-left:auto; display:grid; place-items:center; width:42px; height:42px;
  border:1px solid rgba(48,65,84,.18); border-radius:50%; background:#fff; color:#26364b; cursor:pointer;
}
#yk404-shell .yk404-menu-close svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.5; }
#yk404-shell .yk404-menu nav { margin-top:38px; display:grid; border-top:1px solid rgba(48,65,84,.14); }
#yk404-shell .yk404-menu nav a {
  padding:18px 3px; border-bottom:1px solid rgba(48,65,84,.14); text-decoration:none;
  font-family:var(--serif); font-size:17px; letter-spacing:.05em;
}

@media (max-width:782px) {
  body.admin-bar #yk404-shell .yk404-header { top:46px; }
  body.admin-bar #yk404-shell .yk404-menu { top:46px; }
}
@media (max-width:900px) {
  #yk404-shell .yk404-header { height:78px; }
  #yk404-shell .yk404-header-inner { padding:0 22px; }
  #yk404-shell .yk404-brand { gap:9px; }
  #yk404-shell .yk404-brand-name { font-size:17px; }
  #yk404-shell .yk404-tagline { font-size:9.5px; }
  #yk404-shell .yk404-current { display:none; }
  #yk404-shell .yk404-main { width:min(100% - 40px,760px); padding-top:72px; }
  #yk404-shell .yk404-footer-inner { width:calc(100% - 40px); }
}
@media (max-width:540px) {
  #yk404-shell .yk404-header-inner { padding:0 16px; }
  #yk404-shell .yk404-brand { gap:8px; }
  #yk404-shell .yk404-mark { transform:scale(.90); transform-origin:left center; }
  #yk404-shell .yk404-main { width:calc(100% - 32px); padding:56px 0 74px; }
  #yk404-shell .yk404-title { font-size:28px; }
  #yk404-shell .yk404-lead { font-size:14.5px; }
  #yk404-shell .yk404-actions { display:grid; }
  #yk404-shell .yk404-action { width:100%; justify-content:space-between; border-radius:12px; }
  #yk404-shell .yk404-footer { padding:24px 0 18px; }
  #yk404-shell .yk404-footer-inner { width:calc(100% - 32px); }
  #yk404-shell .yk404-menu-inner { width:calc(100% - 28px); margin-top:8vh; padding:24px; }
  #yk404-shell .yk404-menu nav { margin-top:28px; }
  #yk404-shell .yk404-menu nav a { padding:18px 2px; font-size:16px; }
}
@media (prefers-reduced-motion:reduce) {
  #yk404-shell *, #yk404-shell *::before, #yk404-shell *::after { transition:none !important; }
}