/* SAFE TOOLS の土台のリセットと、アイコンの寸法など少しの部品クラス。
 *
 * 以前は Tailwind の実行版（assets/vendor/tailwindcss、約400KB）を読み込み、ページを開くたびに
 * ブラウザの中でこの CSS を組み立てていた。実際に使っていたのは下の Preflight と数個の
 * クラスだけだったので、Tailwind が組み立てた結果をそのまま書き写して置き換えた。
 *
 * 読み込む位置は head の末尾（ページの <style> より後ろ）。Tailwind も組み立てた <style> を
 * そこへ差し込んでいたので、ページの要素セレクタ（button {...} など）との優先の関係が変わらない。
 * QR Palette は先に Tailwind を外して自前のリセットに移っているので、これは読まない。
 *
 * 部品クラスを増やすときは、ここに足す（Tailwind の値の刻みに合わせる必要はない）。
 */

/* ---- Preflight（tailwindcss v3.4.17 | MIT License | https://tailwindcss.com） ---- */
*, ::after, ::before { box-sizing: border-box; border-width: 0; border-style: solid; border-color: #e5e7eb; }
:host, html {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  tab-size: 4;
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
}
body { margin: 0; line-height: inherit; }
hr { height: 0; color: inherit; border-top-width: 1px; }
abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: bolder; }
code, kbd, pre, samp {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-feature-settings: normal;
  font-variation-settings: normal;
  font-size: 1em;
}
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -.25em; }
sup { top: -.5em; }
table { text-indent: 0; border-color: inherit; border-collapse: collapse; }
button, input, optgroup, select, textarea {
  font-family: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-size: 100%;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}
button, select { text-transform: none; }
button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) {
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none;
}
:-moz-focusring { outline: auto; }
:-moz-ui-invalid { box-shadow: none; }
progress { vertical-align: baseline; }
::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }
[type=search] { -webkit-appearance: textfield; outline-offset: -2px; }
::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
summary { display: list-item; }
blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre { margin: 0; }
fieldset { margin: 0; padding: 0; }
legend { padding: 0; }
menu, ol, ul { list-style: none; margin: 0; padding: 0; }
dialog { padding: 0; }
textarea { resize: vertical; }
input::placeholder, textarea::placeholder { opacity: 1; color: #9ca3af; }
[role=button], button { cursor: pointer; }
:disabled { cursor: default; }
audio, canvas, embed, iframe, img, object, svg, video { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
[hidden]:where(:not([hidden=until-found])) { display: none; }

/* ---- 部品クラス ----
 * トーストの translate-y-20 / opacity-0 は tools-ui.css の #toast が受け持つので、ここには置かない。
 * .flex と .hidden が同じ要素に付いたら .hidden が勝つよう、この順に並べる */
.flex { display: flex; }
.hidden { display: none; }
.items-center { align-items: center; }
.gap-1 { gap: 0.25rem; }
.w-3\.5 { width: 0.875rem; }
.h-3\.5 { height: 0.875rem; }
.w-4 { width: 1rem; }
.h-4 { height: 1rem; }
.w-5 { width: 1.25rem; }
.h-5 { height: 1.25rem; }
.w-9 { width: 2.25rem; }
.h-9 { height: 2.25rem; }