/* gu-trip "now showing" — calendar, month timeline, detail sheet (engine/shows.js). Shared by guides and /trips/exhibitions/. */
.shmode { display: flex; gap: 6px; margin: 0 0 14px; }
.shmode button { border: 1px solid var(--line); background: var(--card); color: var(--ink); border-radius: 99px; padding: 7px 14px; font-weight: 700; font-size: 13px; cursor: pointer; }
.shmode button.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.cal { margin: 0 0 18px; }
.calh { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; flex-wrap: wrap; }
.calh b { font: 700 18px var(--serif); min-width: 7.5em; text-align: center; }
.calh button { border: 1px solid var(--line); background: var(--card); color: var(--ink); border-radius: 10px; min-width: 34px; height: 34px; cursor: pointer; font-size: 16px; }
.calh .calsp { flex: 1; } .calh .calt { font-size: 12.5px; font-weight: 700; padding: 0 12px; border-radius: 99px; } .calh .calt.on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.calg { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cald { font-size: 11.5px; color: var(--mute); text-align: center; padding-bottom: 2px; }
.calc { position: relative; aspect-ratio: 1 / .92; border: 1px solid var(--line); background: var(--card); color: var(--ink); border-radius: 10px; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 0; font-variant-numeric: tabular-nums; }
.calc i { font-style: normal; font-size: 13px; font-weight: 600; } .calc small { font-size: 10.5px; font-weight: 700; color: #fff; background: #3F6E8C; border-radius: 99px; padding: 0 6px; }
.calc.none { opacity: .55; } .calc.today { border-color: #C8382E; } .calc.today i { color: #C8382E; }
.calc.sel { background: var(--ink); color: var(--paper); border-color: var(--ink); } .calc.sel small { background: var(--paper); color: var(--ink); }
.calc .mk { position: absolute; top: 4px; right: 4px; display: flex; gap: 2px; }
.calc em, .calk em { width: 6px; height: 6px; border-radius: 50%; display: inline-block; } .op { background: #2F7D4F; } .cl { background: #C8382E; }
.calk { font-size: 11.5px; color: var(--mute); margin: 6px 0 0; } .calk em { margin: 0 3px 0 8px; } .calk em:first-child { margin-left: 0; }
.calsel { font: 700 15px var(--serif); margin: 18px 0 8px; }
.calday { display: grid; gap: 6px; }
.mn { display: flex; gap: 10px; align-items: center; text-align: left; border: 1px solid var(--line); background: var(--card); color: var(--ink); border-radius: 14px; padding: 8px; cursor: pointer; width: 100%; }
.mn img, .mnph { width: 54px; height: 66px; border-radius: 8px; object-fit: cover; flex: none; background: var(--line); }
.mn b { display: block; font-size: 14px; line-height: 1.3; } .mn small { color: var(--mute); font-size: 12px; }
.gantt { display: grid; gap: 4px; }
.gr { display: grid; grid-template-columns: minmax(0, 38%) minmax(0, 1fr); gap: 8px; align-items: center; border: 0; background: none; color: var(--ink); text-align: left; padding: 3px 0; cursor: pointer; }
.gl { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .gl small { display: block; font-weight: 400; color: var(--mute); font-size: 11px; overflow: hidden; text-overflow: ellipsis; }
.gt { position: relative; height: 14px; background: var(--line); border-radius: 7px; } .gt i { position: absolute; top: 0; bottom: 0; background: #3F6E8C; border-radius: 7px; }
.gt b { position: absolute; top: -3px; bottom: -3px; width: 2px; background: #C8382E; }
.shdet { position: fixed; inset: 0; z-index: 120; background: rgba(20,16,12,.55); display: grid; place-items: end center; padding: 0 0 env(safe-area-inset-bottom, 0px); }
.shdet[hidden] { display: none; }
.dsh { position: relative; width: min(560px, 100%); max-height: 92vh; overflow: auto; background: var(--card); color: var(--ink); border-radius: 22px 22px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,.25); }
@media (min-width: 720px) { .shdet { place-items: center; } .dsh { border-radius: 22px; } }
.dx { position: sticky; top: 10px; float: right; margin: 10px 10px 0 0; z-index: 2; width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; font-size: 20px; cursor: pointer; }
.dki { margin: 0; } .dki img { width: 100%; max-height: 380px; object-fit: cover; display: block; } .dki figcaption { font-size: 11px; color: var(--mute); padding: 4px 14px 0; }
.dbd { padding: 12px 18px 22px; } .dtag { font-size: 12px; font-weight: 700; color: #3F6E8C; margin: 0; }
.dbd h2 { font: 700 21px/1.3 var(--serif); margin: 4px 0 2px; } .dalt { color: var(--mute); margin: 0 0 6px; font-size: 13.5px; }
.dven { margin: 4px 0 0; font-weight: 600; } .ddate { margin: 2px 0 10px; color: var(--mute); font-variant-numeric: tabular-nums; } .ddate b { color: #C8382E; margin-left: 6px; }
.dbtn { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 12px; }
.dbtn a { font-size: 13px; font-weight: 700; border: 1px solid var(--line); border-radius: 11px; padding: 8px 12px; text-decoration: none; color: var(--ink); background: var(--paper); }
.dbtn a.bk { background: var(--ink); color: var(--paper); border-color: var(--ink); } .dbtn a.wk { background: #3F6E8C; color: #fff; border-color: #3F6E8C; }
.dmap { height: 200px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); margin: 0 0 12px; }
.dr { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); gap: 8px; padding: 7px 0; border-top: 1px solid var(--line); font-size: 13.5px; }
.dr span { color: var(--mute); font-weight: 600; font-size: 12.5px; } .dr p { margin: 0; white-space: pre-wrap; }
.dgal { display: flex; gap: 6px; overflow-x: auto; margin: 10px 0 4px; scrollbar-width: none; } .dgal img { height: 130px; border-radius: 10px; object-fit: cover; }
.dcred { font-size: 11.5px; color: var(--faint, #9A8F80); margin: 6px 0 0; }
html.shlock, html.shlock body { overflow: hidden; }
/* image credits (CK 11/9: every collected image shows its credit and links to the source page) */
.shi a.src { position: absolute; right: 6px; bottom: 6px; font-size: 10px; color: #fff; background: rgba(0,0,0,.6); border-radius: 6px; padding: 1px 6px; text-decoration: none; }
.dgal figure, .vgal figure { margin: 0; flex: none; } .dgal figcaption, .vgal figcaption { font-size: 10.5px; margin-top: 2px; }
.dgal figcaption a, .vgal figcaption a, .exh em a, .dki figcaption a { color: inherit; }
/* thumbnail mode — collected images without a usage grant stay small, credited and linked */
.shi.sm { margin: 0 0 4px; display: flex; gap: 6px; align-items: flex-end; } .shi.sm img { width: 56px; height: 70px; border-radius: 8px; object-fit: cover; }
.shi.sm a.src, .shi.sm em { position: static; background: none; color: var(--mute); padding: 0; font-size: 10.5px; }
.dki.sm { display: flex; gap: 10px; align-items: flex-end; padding: 14px 56px 0 18px; } .dki.sm img { width: 96px; height: 128px; max-height: none; border-radius: 10px; }
.dki.sm figcaption { padding: 0; }
.dgal figure.sm img, .vgal figure.sm img { height: 72px; }