.garden-page { --g-card-paper:#d0cdb8; --g-card-ink:#202020; --g-card-edge:#ada698; --g-card-press:#5c574f; --g-binder:#2e2e2e; --g-card-numeral:'Bodoni MT Condensed','Bodoni MT','Didot','Times New Roman',serif; --g-card-title:'Noto Serif JP','Yu Mincho','Hiragino Mincho ProN','Noto Serif CJK JP',serif; }
.g-heading { margin-bottom:20px; }
.g-heading .m-page-title { margin-bottom:5px; }
.g-binder { position:relative; margin:0 0 24px; border:1px solid #595650; background:var(--g-binder); }
.g-search { position:relative; margin:16px 14px 0; }
.g-search[hidden],.g-no-match[hidden],.g-card-grid > li[hidden] { display:none; }
.g-search-input { width:100%; min-height:36px; padding:7px 10px; box-sizing:border-box; border:1px solid var(--rule); border-radius:0; background:#303030; color:var(--ink); font:12px var(--sans); }
.g-search-input::placeholder { color:var(--muted); }
.g-search-input:focus-visible { outline:2px solid var(--red); outline-offset:2px; }
.g-no-match { margin:0; padding:0 14px 22px; font:12px var(--sans); color:var(--muted); }
.g-card-grid { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 12px; list-style:none; margin:0; padding:18px 14px; }
.g-card-grid > li { min-width:0; }
.g-card-button { display:flex; flex-direction:column; position:relative; width:100%; padding:2.6%; border:1px solid var(--g-card-edge); border-radius:clamp(3px,1.15vw,6px); background:var(--g-card-ink); color:var(--g-card-ink); box-shadow:inset 0 0 0 1px var(--g-card-press); text-align:left; cursor:pointer; transition:transform .15s,border-color .15s; }
.g-card-button:hover { transform:translateY(-2px); border-color:#d4ccbb; outline:1px solid var(--red); }
.g-card-button[aria-expanded="true"] { outline:2px solid var(--red); outline-offset:3px; }
.g-card-head { position:relative; display:block; flex:none; width:100%; aspect-ratio:300 / 48; background:var(--g-card-ink); }
.g-head-frame { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.g-head-id,.g-head-title,.g-head-category { position:absolute; z-index:1; top:0; bottom:0; display:flex; align-items:center; justify-content:center; min-width:0; padding:0 2%; box-sizing:border-box; text-align:center; overflow:hidden; color:var(--g-card-ink); }
.g-head-id { left:0; width:28.5714286%; font:700 1px/1 var(--g-card-numeral); letter-spacing:-.02em; }
.g-head-title { left:28.5714286%; width:42.8571428%; padding-inline:3.2%; font:400 1px/1 var(--serif); }
.g-head-title:lang(ja) { font-family:var(--g-card-title); }
.g-head-category { left:71.4285714%; width:28.5714286%; font:400 1px/1 var(--g-card-numeral); }
.g-head-copy { display:block; flex:none; width:max-content; min-width:0; white-space:nowrap; line-height:1; }
.g-card-middle { position:relative; display:block; flex:none; width:100%; aspect-ratio:300 / 175.7; margin-top:2.6666667%; background:var(--g-card-paper); border:1px solid var(--g-card-ink); box-sizing:border-box; }
.g-card-art { position:absolute; top:6.83%; left:4%; width:92%; height:86.34%; box-sizing:border-box; border:1px solid var(--g-card-ink); overflow:hidden; }
.g-card-art svg { display:block; width:100%; height:100%; }
.g-card-art img { display:block; width:100%; height:100%; object-fit:cover; filter:none; }
.g-card-bottom { position:relative; display:flex; flex:none; width:100%; aspect-ratio:300 / 175.6; margin-top:2.6666667%; box-sizing:border-box; padding:5.33%; border:1px solid var(--g-card-ink); }
.g-camo { position:absolute; inset:0; width:100%; height:100%; }
.g-card-description-wrap { position:relative; display:flex; align-items:center; min-width:0; width:100%; padding:5px; border:1.5px solid var(--g-card-ink); background:#dedbd1; box-sizing:border-box; }
.g-card-description { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; margin:0; overflow:hidden; font:10.5px/1.4 var(--sans); color:var(--g-card-ink); overflow-wrap:anywhere; }
.g-dialog { width:min(420px,calc(100vw - 24px)); max-width:none; max-height:calc(100dvh - 24px); padding:0; border:0; background:transparent; color:var(--ink); overflow:auto; overscroll-behavior:contain; }
.g-dialog::backdrop { background:#141414cf; backdrop-filter:blur(2px); }
.g-dialog-shell { padding:13px 16px 16px; border:2px solid #625d56; background:#343434; box-sizing:border-box; }
.g-dialog-tools { display:flex; justify-content:flex-end; margin:0 0 10px; }
.g-close { display:grid; place-items:center; width:32px; height:32px; padding:5px; border:1px solid var(--rule); border-radius:0; background:#303030; color:var(--ink); cursor:pointer; }
.g-close svg { display:block; width:18px; height:18px; }
.g-close:hover { border-color:var(--red); }
.g-dialog-card { display:flex; flex-direction:column; padding:2.6%; border:1px solid var(--g-card-edge); border-radius:clamp(7px,2.55vw,12px); background:var(--g-card-ink); color:var(--g-card-ink); box-shadow:inset 0 0 0 1px var(--g-card-press); box-sizing:border-box; }
.g-dialog-card .g-card-description-wrap { padding:10px 11px; border-width:3px; }
.g-dialog-card .g-card-description { display:block; overflow:visible; font-size:16px; line-height:1.55; }
.g-open-card { display:flex; align-items:center; justify-content:center; gap:10px; min-height:44px; margin-top:14px; padding:7px 12px; box-sizing:border-box; border:2px solid var(--red); color:#fff; background:var(--red); text-decoration:none; font:14px var(--sans); }
.g-open-card:hover { background:#bd0010; border-color:#bd0010; }
.g-open-card span { font-size:20px; }
.g-open-card svg { display:block; width:24px; height:24px; }
.g-card-button:focus-visible,.g-open-card:focus-visible,.g-close:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
@media(min-width:520px) { .g-card-grid { grid-template-columns:repeat(3,minmax(0,1fr)); padding:22px 18px; gap:18px 12px; } .g-search { margin-inline:18px; } .g-no-match { padding-inline:18px; } }
@media(max-width:350px) { .g-card-grid { padding:16px 12px; gap:14px 10px; } .g-search { margin-inline:12px; } .g-no-match { padding-inline:12px; } .g-card-description-wrap { padding:4px; } .g-card-description { font-size:10px; } .g-dialog-shell { padding-left:12px; padding-right:12px; } .g-dialog-card .g-card-description { font-size:15px; } }
@media(prefers-reduced-motion:reduce) { .g-card-button { transition:none; } }

/* Inherited Garden tools remain on this site. */
.g-tool-back{display:inline-block;font:11px var(--mono);margin-bottom:18px;color:var(--muted)}
.g-tool-title{margin:0 0 22px;font:700 28px/1.4 var(--serif);border-bottom:2px solid var(--red);padding-bottom:13px}
.g-tool-frame{display:block;width:100%;height:650px;border:0;background:#303030;color-scheme:dark}