@charset "UTF-8";
/* 旧 AYAYA wiki（PukiWiki Plus! の skin/default.css）の見た目を、HTML5 で模したスタイル。
   旧版の規則のうち、このサイトで使う分（文字・リンク・見出し・リスト・表・pre・ヘッダ・左メニュー）だけを持つ。
   色と寸法は旧版のまま。旧版は table レイアウトだったので、ここでは flex で組む */

/* ---- 文字・リンク ---- */
html {
	color: black;
	background-color: white;
}
body {
	margin: 0;
	padding: 0;
	color: black;
	background-color: white;
	font-family: "MS PGothic", "ＭＳ Ｐゴシック", Osaka, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
	overflow-wrap: anywhere;
}
pre, dl, ol, p, blockquote {
	line-height: 130%;
}
p {
	margin: 0;
	padding: 0 0 10px 0;
}
blockquote {
	margin: .5em 0 .5em 32px;
	border: 1px solid #ffcc99;
}
blockquote p {
	margin: .5em 1em;
	padding: 0;
}
a:link {
	color: #215dc6;
	background-color: inherit;
	text-decoration: none;
}
a:visited {
	color: #a63d21;
	background-color: inherit;
	text-decoration: none;
}
a:active {
	color: #215dc6;
	background-color: #ccddee;
	text-decoration: none;
}
a:hover {
	color: #215dc6;
	background-color: #ccddee;
	text-decoration: underline;
}
img {
	border: none;
	vertical-align: middle;
	max-width: 100%;
	height: auto;
}
em {
	font-style: italic;
}
strong {
	font-weight: bold;
}

/* ---- 見出し ---- */
h1 {
	color: inherit;
	background-color: #dddddd;
	padding: 3px;
	border: 0;
	margin: 0 0 .5em 0;
	font-size: large;
}
h2 {
	color: inherit;
	background-color: #dddddd;
	padding: 2px;
	border: 0;
	margin: 1.2em 0 .5em 0;
	font-size: large;
}
h3 {
	border-bottom: 3px solid #dddddd;
	border-top: 1px solid #dddddd;
	border-left: 10px solid #dddddd;
	border-right: 5px solid #dddddd;
	color: inherit;
	background-color: #ffffff;
	padding: 1px;
	margin: 1.2em 0 .5em 0;
	font-size: 1.17em;
}
h4 {
	border-left: 18px solid #dddddd;
	color: inherit;
	background-color: #ffffff;
	padding: .3em;
	margin: 1.2em 0 .5em 0;
	font-size: 1em;
}
h5, h6 {
	color: inherit;
	background-color: #dddddd;
	padding: .3em;
	border: 0;
	margin: 0 0 .5em 0;
	font-size: 1em;
}
/* 見出しの末尾の † （旧 wiki の anchor_super。その見出しへのリンク） */
.anchor_super {
	font-size: xx-small;
	vertical-align: super;
	user-select: none;
}
h1 .anchor_super {
	display: none;
}

dt {
	font-weight: bold;
	margin-top: 1em;
	margin-left: 1em;
}
ul, ol {
	margin-top: .5em;
	margin-bottom: .5em;
	line-height: 130%;
}
ul {
	list-style-type: disc;
}
ul ul {
	list-style-type: circle;
}
ul ul ul {
	list-style-type: square;
}
hr {
	border-style: ridge;
	border-color: #333333;
	border-width: 1px 0;
}

/* ---- コード ---- */
pre {
	border-top: #ddddee 1px solid;
	border-bottom: #888899 1px solid;
	border-left: #ddddee 1px solid;
	border-right: #888899 1px solid;
	padding: .5em;
	margin: .5em 2em 1em 1em;
	white-space: pre;
	overflow-x: auto;
	color: black;
	background-color: #eeffff;
	line-height: 120%;
}
code, pre, kbd {
	font-family: Consolas, "MS Gothic", "ＭＳ ゴシック", monospace;
}
code {
	font-size: 95%;
}
pre code {
	font-size: inherit;
}
:not(pre) > code {
	padding: 0 .2em;
	background-color: #f0f4ff;
}

/* ---- 表（旧版の style_table / style_th / style_td） ---- */
table {
	padding: 0;
	border: 0;
	margin: .5em auto 1em 0;
	text-align: left;
	color: inherit;
	background-color: #ccd5dd;
	border-collapse: separate;
	border-spacing: 1px;
	max-width: 100%;
}
th {
	padding: 5px;
	margin: 1px;
	text-align: center;
	color: inherit;
	background-color: #eeeeee;
}
td {
	padding: 5px;
	margin: 1px;
	color: inherit;
	background-color: #eef5ff;
	vertical-align: top;
}
td p, th p {
	padding: 0;
}
/* body の overflow-wrap: anywhere は表の最小幅を 1 文字にしてしまうので、表のセルでは break-word（長い語だけ折る） */
th, td {
	overflow-wrap: break-word;
}

/* ---- 注（!!! note / warning）。旧 wiki の blockquote（橙の枠）と同じ配色 ---- */
.admonition {
	border: 1px solid #ffcc99;
	background-color: #fffaf3;
	margin: .5em 0 1em 0;
	padding: .3em 1em;
}
.admonition-title {
	margin: 0;
	padding: .2em 0;
	font-weight: bold;
}
.admonition.note {
	border-color: #ccd5dd;
	background-color: #f4f8ff;
}
.admonition.warning, .admonition.danger {
	border-color: #dd6666;
	background-color: #fff2f2;
}
.admonition p {
	margin: 0;
	padding: 0 0 .5em 0;
}

/* ---- ヘッダ（旧版: 左にタイトル画像、右の黒い帯にロゴとパンくず）。検索欄と翻訳ボタンは帯の右。
   スクロールしても上に残す（狭い画面を除く）。ロゴ画像の地色は #212121 ---- */
html {
	--side-w: 220px;           /* ヘッダ左のタイトル画像（skin/title.png）と、左のメニューの幅 */
	scroll-padding-top: 90px;   /* 固定のヘッダに、#アンカーの見出しが隠れないように */
}
#header {
	position: sticky;
	top: 0;
	z-index: 50;
	display: flex;
	align-items: stretch;
	height: 80px;
	box-sizing: border-box;
	background-color: #212121;
	border-bottom: 1px solid #dcdcdc;
}
#site-logo {
	flex: none;
	width: var(--side-w);
	height: 80px;
	background-color: #ffffff;
	line-height: 0;
}
#site-logo img {
	display: block;
}
#header1 {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5em 1.5em;
	padding: 0 16px 0 12px;
	min-width: 0;
	border-right: 1px solid #dcdcdc;
	background-color: #212121;
	color: #ffffff;
}
#site-title {
	min-width: 0;
}
#site-name {
	margin: 0;
	padding: 0;
	line-height: 0;
}
#site-name a:link, #site-name a:visited, #site-name a:hover {
	background-color: transparent;
	text-decoration: none;
}
#site-name img {
	display: block;
	max-width: 100%;
	height: auto;
}
/* 旧版の div#virtualdir（白い文字のパンくず） */
#breadcrumb ul {
	display: flex;
	flex-wrap: wrap;
	margin: 2px 0 0 4px;
	padding: 0;
	list-style: none;
	font-size: 90%;
	line-height: 1.3;
}
#breadcrumb li + li:before {
	content: " > ";
	white-space: pre;
}
#breadcrumb a:link {
	color: #ffffff;
	background-color: transparent;
}
#breadcrumb a:visited {
	color: #dddddd;
	background-color: transparent;
}
#breadcrumb a:hover {
	color: #ffffff;
	background-color: #555555;
	text-decoration: underline;
}

/* 検索欄: 「マニュアル内検索」の薄い文字と、右端の虫メガネ。右横に翻訳ボタン */
#search {
	position: relative;
	display: flex;
	align-items: center;
	gap: .3em;
	flex: 0 1 22em;
	min-width: 9em;
}
#search form {
	flex: 1 1 auto;
	margin: 0;
}
#search .search-field {
	position: relative;
}
#search input {
	box-sizing: border-box;
	width: 100%;
	padding: .25em 1.8em .25em .4em;
	font: inherit;
	font-size: 90%;
}
#search .search-icon {
	position: absolute;
	top: 50%;
	right: .4em;
	transform: translateY(-50%);
	font-size: 90%;
	line-height: 1;
	opacity: .35;
	pointer-events: none;
}
#search input::-webkit-search-cancel-button {
	margin-right: 1.2em;
}

/* ---- 左のメニュー（旧版の td#menubar）と本文（td#body） ---- */
#page {
	display: flex;
	align-items: flex-start;
	min-height: calc(100vh - 81px);
	/* 左のメニューの地色と枠線を、ページの高さいっぱいに伸ばす（旧版は table のセルだった） */
	background: linear-gradient(to right, #dcdcdc 0 1px, #f4f4f4 1px calc(var(--side-w) - 1px), #dcdcdc calc(var(--side-w) - 1px) var(--side-w), #ffffff var(--side-w));
}
#menubar {
	flex: none;
	box-sizing: border-box;
	width: var(--side-w);
	position: sticky;
	top: 81px;                       /* 固定のヘッダの下 */
	max-height: calc(100vh - 81px);
	overflow-y: auto;
	padding: 0 0 1em 0;
	border-right: 1px solid #dcdcdc;
	border-left: 1px solid #dcdcdc;
	font-size: 90%;
	word-break: break-all;
}
#menubar h5 {
	margin: 0 0 .5em 0;
}
#menubar ul {
	margin: 0 0 0 .5em;
	padding: 0 0 0 .5em;
}
#menubar > ul {
	margin-right: .3em;
}
#menubar li {
	margin-bottom: .2em;
	line-height: 110%;
}
#menubar ul ul {
	margin-top: .2em;
}
/* サイトの外へ飛ぶリンクの印（読み上げには出さない） */
#menubar a.external::after {
	content: "\2197";
	content: "\2197" / "";
	margin-left: .2em;
	font-size: 85%;
	color: #777;
}
#menubar a[aria-current="page"] {
	font-weight: bold;
	color: #a63d21;
}
#body {
	flex: 1 1 0;
	align-self: stretch;
	background-color: #ffffff;
	min-width: 0;
	box-sizing: border-box;
	padding: 0 10px 1em 10px;
	margin: 0;
}

/* トップページの「文法」以降の一覧: 3 列のグリッド。幅が狭くなると、列が減って 1 列になる */
ul.index-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(max(13em, calc((100% - 3em) / 3)), 1fr));
	gap: .3em 1.5em;
	margin: .5em 0 1em;
	padding-left: 1.5em;
}
ul.index-grid li {
	margin: 0;
	line-height: 130%;
}

/* ページ先頭の目次（旧版の div.contents） */
.contents {
	margin: 0 0 1em 0;
	padding: .3em .5em .3em 0;
	border: 1px solid #ccd5dd;
	background-color: #f9fbff;
	font-size: 90%;
}
.contents ul {
	margin: .2em 0;
}
.contents li {
	margin-bottom: .1em;
}

/* ---- 検索（search.js） ---- */
.site-search__dropdown {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 30;
	box-sizing: border-box;
	width: min(460px, calc(100vw - 1em));
	max-height: 70vh;
	overflow-y: auto;
	border: 1px solid #888899;
	background: #ffffff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
	color: #000000;
	font-size: 90%;
	line-height: 1.4;
	text-align: left;
}
.site-search__dropdown[hidden] {
	display: none;
}
.site-search__dropdown a,
.site-search__dropdown a:link,
.site-search__dropdown a:visited {
	color: inherit;
	text-decoration: none;
}
.site-search__item {
	display: block;
	padding: .4em .6em;
	border-bottom: 1px dotted #ccd5dd;
}
.site-search__all {
	display: block;
	padding: .5em;
	background: #eef5ff;
	text-align: center;
	color: #215dc6 !important;
}
.site-search__item.is-active,
.site-search__all.is-active {
	background: #ccddee;
}
.site-search__title {
	font-weight: bold;
	color: #215dc6;
}
.site-search__page {
	color: #666666;
	font-size: 90%;
}
.site-search__snippet {
	display: block;
	color: #555555;
}
.site-search__empty {
	margin: 0;
	padding: .5em;
	color: #666666;
}
.site-search__dropdown mark,
#search-results mark {
	background-color: #ffff66;
}
#search-results .search-page {
	color: #666666;
	font-size: 90%;
}
#search-results li {
	margin-bottom: .8em;
}

/* 翻訳版のページの頭に出す、機械翻訳の注記の帯（lang.js）。本文（#body）の上に置く */
.ukadoc-mt-notice {
	margin: 0 0 .8em;
	padding: .4em .8em;
	border: 1px solid #e0c870;
	background: #fff8dc;
	color: #5a4a00;
	font-size: 85%;
	line-height: 1.5;
}
.ukadoc-mt-notice a {
	color: #7a5c00;
}

/* 翻訳版で、その言語で書かれた原文そのもの（機械翻訳でない。i18n/originals.json に登録したもの）の項目の見出しに付ける印。
   scripts/prepare_site.py が、原文の言語の版の見出しに class orig-lang を付ける。印の字は html[lang] ごと */
.orig-lang::after {
	display: inline-block;
	margin-left: 0.8em;
	padding: 0 6px;
	border: 1px solid #4c8f3c;
	border-radius: 3px;
	background: #eaf7e5;
	color: #2f6b22;
	font-size: 11px;
	font-weight: normal;
	font-style: normal;
	line-height: 1.6;
	vertical-align: middle;
	white-space: nowrap;
}
html[lang="en"] .orig-lang::after { content: "Original"; }
html[lang="zh-Hant"] .orig-lang::after, html[lang="zh"] .orig-lang::after { content: "原文"; }

/* ---- 言語切替（lang.js）。検索欄の右横。翻訳版が 1 つも無ければ出ない ---- */
.ukadoc-translate {
	position: relative;
	flex: none;
}
.ukadoc-translate__button {
	width: 1.8em;
	height: 1.8em;
	padding: .15em;
	border: 1px solid #dcdcdc;
	background: #ffffff;
	color: #333333;
	cursor: pointer;
}
.ukadoc-translate__button svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: currentColor;
}
.ukadoc-translate__button--on {
	background: #ccddee;
}
.ukadoc-translate__menu {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 40;
	min-width: 13em;
	margin-top: 2px;
	padding: .2em 0;
	border: 1px solid #888899;
	background: #ffffff;
	color: #000000;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
}
.ukadoc-translate__menu[hidden] {
	display: none;
}
.ukadoc-translate__menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.ukadoc-translate__menu li button {
	display: block;
	width: 100%;
	padding: .35em .8em;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}
.ukadoc-translate__menu li button:hover,
.ukadoc-translate__menu li button:focus-visible {
	background: #ccddee;
}
.ukadoc-translate__menu li button[aria-pressed="true"] {
	font-weight: bold;
	color: #215dc6;
}
.ukadoc-translate__status {
	margin: .2em 0 0;
	padding: .3em .8em 0;
	border-top: 1px solid #dcdcdc;
	color: #666666;
	font-size: 90%;
}
.ukadoc-translate__status:empty {
	display: none;
}

/* ---- YAYA 6 の紹介ページ（other/yaya6-launch.md）の部品。配色は、ほかのページと同じ旧版の配色 ---- */
.y6-hero img {
	display: block;
	width: 100%;
	border-radius: 8px;
}
.y6-lead {
	max-width: 40em;
	margin: 1.6em auto 1em;
	text-align: center;
}
.y6-lead p:first-child strong {
	font-size: 1.3em;
}
.y6-cta p {
	display: flex;
	flex-wrap: wrap;
	gap: .8em;
	justify-content: center;
}
.y6-cta a {
	padding: .5em 1.2em;
	border: 1px solid #888899;
	background-color: #eef5ff;
	font-weight: bold;
}
.y6-cta a:first-child:link,
.y6-cta a:first-child:visited {
	border-color: #215dc6;
	background-color: #215dc6;
	color: #ffffff;
}
.y6-cta a:first-child:hover {
	background-color: #4a7fdc;
}
.y6-stats ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
	gap: .8em;
	margin: 1.5em 0;
	padding: 0;
	list-style: none;
}
.y6-stats li {
	margin: 0;
	padding: .8em .6em;
	border: 1px solid #ccd5dd;
	background-color: #eef5ff;
	font-size: .9em;
	text-align: center;
}
.y6-stats li strong {
	display: block;
	font-size: 2em;
	line-height: 1.2;
}
.y6-byline {
	margin-top: 2em;
	text-align: center;
}
.y6-byline strong {
	font-size: 1.2em;
}
.y6-card table {
	width: 100%;
	margin: 0;
}

/* ---- 幅が狭いとき: ヘッダ → 本文 → 目次の縦並びにする ---- */
@media (max-width: 800px) {
	/* 縦に狭いので、ヘッダは固定せず、縦に積む */
	html {
		scroll-padding-top: 0;
	}
	#header {
		position: static;
		flex-wrap: wrap;
		height: auto;
	}
	#site-logo {
		width: 120px;
		height: 56px;
		overflow: hidden;
	}
	#site-logo img {
		width: 120px;
		height: auto;
	}
	#header1 {
		flex-wrap: wrap;
		flex-basis: 0;
		padding: 6px 10px;
		border-right: 0;
	}
	#site-name img {
		width: 245px;
	}
	#search {
		flex: 1 1 100%;
	}
	#page {
		flex-direction: column;
		align-items: stretch;
		background: #ffffff;
	}
	#body {
		order: 1;
		overflow-wrap: anywhere;
	}
	/* 幅の広い表は、表の中だけを横にスクロールする */
	#body table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
	}
	#body pre {
		overflow-x: auto;
	}
	#menubar {
		order: 2;
		position: static;
		width: auto;
		max-height: none;
		overflow: visible;
		background: #f4f4f4;
		border-left: 0;
		border-right: 0;
		border-top: 1px solid #dcdcdc;
	}
}

/* ---- 幅が狭いとき: 左のメニュー（#menubar）を、検索欄の左のボタン（menu.js）で開閉する引き出しにする ----
   js-drawer は menu.js が <html> に付ける（JavaScript が動かなければ、メニューは上のとおり本文の下に出る）。
   引き出しと暗幕は、ヘッダの下（--drawer-top。menu.js が開くときに測る。ヘッダが画面の外なら画面の上）から */
.ukadoc-drawer-toggle,
.ukadoc-drawer-backdrop {
	display: none;
}
@media (max-width: 800px) {
	html.js-drawer .ukadoc-drawer-toggle {
		display: block;
		flex: none;
		box-sizing: border-box;
		width: 1.8em;
		height: 1.8em;
		padding: .15em;
		border: 1px solid #dcdcdc;
		background: #ffffff;
		color: #333333;
		cursor: pointer;
	}
	html.js-drawer .ukadoc-drawer-toggle svg {
		display: block;
		width: 100%;
		height: 100%;
		fill: currentColor;
	}
	html.js-drawer.drawer-open .ukadoc-drawer-toggle {
		background: #ccddee;
	}
	html.js-drawer #menubar {
		display: none;
	}
	html.js-drawer.drawer-open #menubar {
		display: block;
		position: fixed;
		top: var(--drawer-top, 0);
		bottom: 0;
		left: 0;
		z-index: 60;
		box-sizing: border-box;
		width: min(320px, 85vw);
		max-height: none;
		margin: 0;
		padding: 0 .3em 2em 0;
		overflow-y: auto;
		overscroll-behavior: contain;
		background: #f4f4f4;
		border: 0;
		border-right: 1px solid #dcdcdc;
		box-shadow: 2px 0 8px rgba(0, 0, 0, .4);
		outline: none;
	}
	html.js-drawer.drawer-open .ukadoc-drawer-backdrop {
		display: block;
		position: fixed;
		top: var(--drawer-top, 0);
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 55;
		background: rgba(0, 0, 0, .4);
	}
	html.js-drawer.drawer-open body {
		overflow: hidden;
	}
}

@media print {
	#menubar, #search, .ukadoc-translate, .ukadoc-mt-notice, .ukadoc-drawer-backdrop {
		display: none;
	}
}

/* 左のメニューの最上位の項目どうしは、旧版の MenuBar と同じく、間を空ける */
#menubar > ul > li {
	margin-bottom: .9em;
}