:root {   --lg-bg:        #faf9f5;
--lg-surface:   #ffffff;
--lg-surface-2: #f4f2ec;
--lg-line:      #e8e4da;
--lg-line-2:    #cdc6b8;
--lg-text:      #221e1a;
--lg-text-2:    #5f584f;
--lg-text-3:    #918a7e;  --lg-violet:      #d9704f;
--lg-violet-ink:  #b85736;
--lg-violet-soft: #fbeee8; --lg-p2p:      #0f7a52;
--lg-p2p-ink:  #0b6142;
--lg-p2p-soft: #e2f3ea;
--lg-ok:        #17794a;
--lg-ok-soft:   #e3f3ea;
--lg-warn:      #96550a;
--lg-warn-soft: #faeedd;
--lg-hot:       #ab332a;
--lg-hot-soft:  #fbeae7; --lg-display: "Playfair Display", Georgia, "Times New Roman", serif;
--lg-ui: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
--lg-num: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
--lg-r: 8px;
--lg-r-lg: 14px;
--lg-nav: 58px;
--lg-max: 1140px;
}
html[data-theme="dark"] {
--lg-bg:        #15120f;
--lg-surface:   #1d1916;
--lg-surface-2: #251f1b;
--lg-line:      #322b25;
--lg-line-2:    #463d34;
--lg-text:      #f0ece5;
--lg-text-2:    #b0a698;
--lg-text-3:    #837a6e;
--lg-violet:      #e08a68;
--lg-violet-ink:  #eda183;
--lg-violet-soft: #33211a;
--lg-p2p:      #4cbe89;
--lg-p2p-ink:  #6ed3a1;
--lg-p2p-soft: #12301f;
--lg-ok:        #5cc487;
--lg-ok-soft:   #14301f;
--lg-warn:      #d8a34a;
--lg-warn-soft: #2c2413;
--lg-hot:       #ef8a7c;
--lg-hot-soft:  #331b17;
} body {
background: var(--lg-bg);
color: var(--lg-text);
font-family: var(--lg-ui);
font-size: 15px;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
body.ledger #masthead,
body.ledger .site-info,
body.ledger .main-navigation:not(.lg-cats) { display: none; }
body.ledger #page { max-width: var(--lg-max); padding: 0 20px; }
body.ledger .site-content { padding-top: 0; }
a, a:hover, a:focus { color: var(--lg-violet-ink); text-decoration: none; }
body.ledger a, body.ledger a:hover { text-decoration: none; }
.lg-i { width: 18px; height: 18px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.lg-hide { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.num { font-family: var(--lg-num); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; } .lg-nav {
position: sticky; top: 0; z-index: 90;
background: var(--lg-surface);
border-bottom: 1px solid var(--lg-line);
}
.lg-nav-in {
max-width: var(--lg-max); margin: 0 auto;
height: var(--lg-nav); padding: 0 20px;
display: flex; align-items: center; gap: 14px;
}
.lg-mark {
display: flex; align-items: center; gap: 9px;
font-family: var(--lg-display);
font-size: 19px; font-weight: 600; letter-spacing: -0.01em;
color: var(--lg-text); flex-shrink: 0;
}
.lg-mark:hover { text-decoration: none; color: var(--lg-text); }
.lg-mark span {
width: 28px; height: 28px; border-radius: 5px;
background: var(--lg-violet); color: #fff;
display: flex; align-items: center; justify-content: center;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.lg-mark span .lg-i { width: 15px; height: 15px; stroke-width: 2.1; }
.lg-mark img { max-height: 30px; width: auto; }
.lg-pills {
flex: 1; min-width: 0;
display: flex; gap: 3px;
overflow-x: auto; scrollbar-width: none;
padding: 0 4px;
}
.lg-pills::-webkit-scrollbar { display: none; }
.lg-pills ul, .lg-pills li { list-style: none; margin: 0; padding: 0; display: contents; }
.lg-pill-item { display: inline-flex; }
.lg-pills .current-menu-item > .lg-pill,
.lg-pills .current_page_item > .lg-pill { background: var(--lg-violet-soft); color: var(--lg-violet-ink); font-weight: 550; }
.lg-pill {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 13px; border-radius: 6px;
font-size: 13.5px; color: var(--lg-text-2);
white-space: nowrap;
}
.lg-pill:hover { background: var(--lg-surface-2); color: var(--lg-text); text-decoration: none; }
.lg-pill.on { background: var(--lg-violet-soft); color: var(--lg-violet-ink); font-weight: 550; }
.lg-pill u { text-decoration: none; font-family: var(--lg-num); font-size: 11px; opacity: .6; }
.lg-tools { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.lg-icon-btn {
display: flex; padding: 7px; border: 0; background: none;
color: var(--lg-text-2); cursor: pointer; border-radius: 6px;
}
.lg-icon-btn:hover { background: var(--lg-surface-2); color: var(--lg-text); }
html[data-theme="dark"] .lg-moon { display: none; }
html:not([data-theme="dark"]) .lg-sun { display: none; }
.lg-searchbar { border-top: 1px solid var(--lg-line); background: var(--lg-surface); display: none; }
.lg-searchbar.open { display: block; }
.lg-searchbar form {
max-width: var(--lg-max); margin: 0 auto; padding: 10px 20px;
display: flex; align-items: center; gap: 9px;
}
.lg-searchbar input {
flex: 1; height: 36px; padding: 0 12px;
background: var(--lg-surface-2); border: 1px solid var(--lg-line);
border-radius: var(--lg-r); font: inherit; font-size: 14px;
color: var(--lg-text); outline: none;
}
.lg-searchbar input:focus { border-color: var(--lg-violet); } .lg-head {
display: flex; align-items: flex-end; justify-content: space-between;
gap: 14px; flex-wrap: wrap;
padding: 30px 0 16px;
margin-bottom: 22px;
border-bottom: 1px solid var(--lg-line-2);
}
.lg-head h1 {
margin: 0;
font-family: var(--lg-display);
font-size: 30px; font-weight: 600;
letter-spacing: -0.015em; line-height: 1.18;
}
.lg-head p { margin: 5px 0 0; font-size: 14px; color: var(--lg-text-2); }
.lg-sort { display: flex; gap: 2px; font-size: 13px; }
.lg-sort a, .lg-sort strong {
padding: 6px 12px; border-radius: 6px;
color: var(--lg-text-2); font-weight: 400;
}
.lg-sort a:hover { background: var(--lg-surface); text-decoration: none; color: var(--lg-text); }
.lg-sort strong { background: var(--lg-violet-soft); color: var(--lg-violet-ink); font-weight: 550; } .lg-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(258px, 1fr));
gap: 16px;
}
.lg-card-item {
display: flex; flex-direction: column;
background: var(--lg-surface);
border: 1px solid var(--lg-line);
border-radius: 14px;
overflow: hidden;
transition: border-color .16s ease, box-shadow .16s ease;
} .lg-card-item:hover {
text-decoration: none;
border-color: var(--lg-line-2);
box-shadow: 0 2px 4px rgba(20, 22, 30, .04), 0 8px 24px rgba(20, 22, 30, .07);
}
.lg-preview {
position: relative;
display: block;
aspect-ratio: 4 / 3;
background: var(--lg-surface);
border-bottom: 1px solid var(--lg-line);
overflow: hidden;
}
.lg-preview img {
width: 100%; height: 100%;
object-fit: contain;
display: block;
padding: 10px;
transition: transform .3s ease;
}
.lg-card-item:hover .lg-preview img { transform: scale(1.025); } html[data-theme="dark"] .lg-preview,
html[data-theme="dark"] .lg-shot-lead,
html[data-theme="dark"] .lg-shots a { background: #ffffff; }
.lg-preview-empty {
display: flex; align-items: center; justify-content: center;
width: 100%; height: 100%;
color: var(--lg-text-3);
}
.lg-preview-empty .lg-i { width: 34px; height: 34px; }  .lg-format {
position: absolute; top: 10px; left: 10px;
padding: 3px 9px;
border-radius: 5px;
background: var(--lg-text);
color: var(--lg-surface);
font-family: var(--lg-num); font-size: 10px; font-weight: 600;
letter-spacing: .09em; text-transform: uppercase;
}
.lg-card-tag { position: absolute; top: 8px; right: 8px; } .lg-tag {
display: inline-block;
font-size: 10px; font-weight: 650;
letter-spacing: .05em; text-transform: uppercase;
padding: 3px 7px; border-radius: 4px;
white-space: nowrap;
background: var(--lg-ok-soft); color: var(--lg-ok);
}
.lg-tag-u { background: var(--lg-violet-soft); color: var(--lg-violet-ink); }
.lg-tag-h { background: var(--lg-hot-soft);    color: var(--lg-hot); }
.lg-tag-t { background: var(--lg-warn-soft);   color: var(--lg-warn); } .lg-card-tag .lg-tag,
.lg-shot-lead .lg-tag {
box-shadow: 0 0 0 1px rgba(255, 255, 255, .7);
}
html[data-theme="dark"] .lg-card-tag .lg-tag,
html[data-theme="dark"] .lg-shot-lead .lg-tag {
box-shadow: 0 0 0 1px rgba(0, 0, 0, .45);
}
.lg-card-body { padding: 12px 13px 13px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.lg-card-name {
margin: 0;
font-family: var(--lg-display);
font-size: 16px; font-weight: 600; letter-spacing: -0.005em;
line-height: 1.32; color: var(--lg-text);
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
overflow: hidden;
}
.lg-card-item:hover .lg-card-name { color: var(--lg-violet-ink); }
.lg-card-meta {
margin: 0; margin-top: auto;
padding-top: 9px;
border-top: 1px solid var(--lg-line);
display: flex; align-items: center; justify-content: space-between;
gap: 10px;
font-family: var(--lg-num); font-size: 11.5px; color: var(--lg-text-3);
font-variant-numeric: tabular-nums;
}
.lg-card-meta span { display: flex; align-items: center; gap: 4px; }
.lg-card-meta .lg-i { width: 13px; height: 13px; }
.lg-card-soft {
font-size: 12px; color: var(--lg-text-2);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
} .lg-licence {
display: inline-flex; align-items: center; gap: 5px;
align-self: flex-start;
padding: 0; border-radius: 0;
font-size: 11.5px; font-weight: 500;
letter-spacing: 0;
background: none; color: var(--lg-text-2);
} .lg-licence::before {
content: ""; width: 6px; height: 6px; border-radius: 50%;
background: var(--lg-text-3); flex-shrink: 0;
}
.lg-licence-free { color: var(--lg-p2p-ink); }
.lg-licence-free::before { background: var(--lg-p2p); }
.lg-licence-paid { color: var(--lg-warn); }
.lg-licence-paid::before { background: var(--lg-warn); }
.lg-licence-free { background: var(--lg-p2p-soft); color: var(--lg-p2p-ink); }
.lg-licence-paid { background: var(--lg-warn-soft); color: var(--lg-warn); } .lg-pages { display: flex; justify-content: center; gap: 5px; margin: 24px 0 44px; flex-wrap: wrap; }
.lg-pages .page-numbers {
min-width: 34px; height: 34px; padding: 0 11px;
display: inline-flex; align-items: center; justify-content: center;
background: var(--lg-surface); border: 1px solid var(--lg-line);
border-radius: var(--lg-r); font-family: var(--lg-num); font-size: 13px;
color: var(--lg-text-2);
}
.lg-pages .page-numbers:hover { border-color: var(--lg-line-2); text-decoration: none; }
.lg-pages .page-numbers.current { background: var(--lg-violet); border-color: var(--lg-violet); color: #fff; } .lg-crumbs { font-size: 12.5px; color: var(--lg-text-3); padding: 20px 0 0; }
.lg-crumbs a { color: var(--lg-text-2); }
.lg-crumbs i { font-style: normal; padding: 0 7px; opacity: .5; }
.lg-split { display: grid; grid-template-columns: minmax(0, 1fr) 322px; gap: 30px; align-items: start; padding-bottom: 44px; } .lg-shot-lead {
position: relative;
margin: 18px 0 24px;
border: 1px solid var(--lg-line);
border-radius: 14px;
overflow: hidden;
box-shadow: 0 1px 2px rgba(20, 22, 30, .04);
background: #ffffff;
}
.lg-shot-lead img {
display: block; width: 100%;
max-height: 480px; object-fit: contain;
padding: 24px;
}
.lg-shot-lead .lg-format { top: 12px; left: 12px; font-size: 11px; padding: 4px 10px; }
.lg-hero { display: flex; gap: 18px; align-items: flex-start; padding: 0 0 22px; } .lg-hero h1 {
display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
margin: 0 0 6px; font-size: 27px; font-weight: 650;
letter-spacing: -0.028em; line-height: 1.18;
}
.lg-hero h1 .v { font-family: var(--lg-num); font-size: 16px; font-weight: 500; color: var(--lg-text-3); letter-spacing: -0.02em; }
.lg-hero p { margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--lg-text-2); max-width: 70ch; }
.lg-sec { margin-bottom: 30px; }
.lg-sec > h2 {
display: flex; align-items: center; gap: 12px;
margin: 0 0 14px;
font-family: var(--lg-num);
font-size: 11.5px; font-weight: 650;
letter-spacing: 0.1em; text-transform: uppercase; color: var(--lg-text-2);
}
.lg-sec > h2::after {
content: ""; flex: 1; height: 1px; background: var(--lg-line);
}
.lg-prose { font-size: 16px; line-height: 1.72; }
.lg-prose p { margin: 0 0 16px; }
.lg-prose ul, .lg-prose ol { margin: 0 0 16px; padding-left: 21px; }
.lg-prose li { margin-bottom: 7px; }
.lg-prose > *:last-child { margin-bottom: 0; }
.lg-prose h2 {
margin: 34px 0 12px;
font-family: var(--lg-display);
font-size: 25px; font-weight: 600;
letter-spacing: -0.012em; line-height: 1.25;
}
.lg-prose h3 {
margin: 28px 0 10px;
font-family: var(--lg-display);
font-size: 20px; font-weight: 600;
letter-spacing: -0.008em; line-height: 1.3;
}
.lg-prose h2:first-child, .lg-prose h3:first-child { margin-top: 0; }
.lg-prose code { font-family: var(--lg-num); font-size: .88em; background: var(--lg-surface-2); padding: 1px 5px; border-radius: 4px; }
.lg-shots { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.lg-shots a {
display: block; border-radius: var(--lg-r); overflow: hidden;
border: 1px solid var(--lg-line);
background: #ffffff;
}
.lg-shots img {
width: 100%; height: 100%; display: block;
object-fit: contain; aspect-ratio: 4 / 3; padding: 8px;
}
.lg-shots a:hover { border-color: var(--lg-violet); } .lg-rail { position: sticky; top: calc(var(--lg-nav) + 18px); display: flex; flex-direction: column; gap: 12px; }
.lg-card {
background: var(--lg-surface);
border: 1px solid var(--lg-line);
border-radius: 14px;
padding: 16px;
} .lg-form { margin: 0; display: contents; }
button.lg-dl, button.lg-go, button.lg-gate-btn { border: 0; font: inherit; cursor: pointer; width: 100%; }
.lg-dl {
display: flex; align-items: center; justify-content: center; gap: 9px;
width: 100%; height: 50px;
background: var(--lg-violet); color: #fff;
border-radius: 8px; font-size: 15.5px; font-weight: 600;
letter-spacing: -0.01em;
box-shadow: 0 1px 2px rgba(27, 79, 143, .2);
}
.lg-dl:hover { text-decoration: none; color: #fff; background: var(--lg-violet-ink); }
.lg-dl small { font-family: var(--lg-num); font-size: 12.5px; font-weight: 400; opacity: .82; }
.lg-alt { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.lg-alt a, .lg-alt button {
display: flex; align-items: center; justify-content: center; gap: 8px;
width: 100%; height: 46px;
border: 1px solid transparent; border-radius: var(--lg-r);
font-size: 14.5px; font-weight: 550;
color: var(--lg-text-2); background: var(--lg-surface-2);
} .lg-alt .lg-magnet, .lg-alt .lg-torrent {
background: var(--lg-p2p-soft);
color: var(--lg-p2p-ink);
}
.lg-alt .lg-magnet:hover, .lg-alt .lg-torrent:hover {
background: var(--lg-p2p); color: #fff; border-color: var(--lg-p2p);
}
.lg-alt .lg-official {
background: var(--lg-surface);
border-color: var(--lg-line);
color: var(--lg-text-2);
}
.lg-alt a:hover, .lg-alt button:hover { text-decoration: none; }
.lg-alt .lg-official:hover { color: var(--lg-text); border-color: var(--lg-line-2); }
.lg-alt button { font: inherit; font-size: 14.5px; font-weight: 500; cursor: pointer; }
.lg-alt .lg-i { width: 17px; height: 17px; }
.lg-spec { display: flex; flex-direction: column; }
.lg-spec div {
display: flex; align-items: baseline; gap: 12px;
padding: 9px 0; border-bottom: 1px solid var(--lg-line); font-size: 13.5px;
}
.lg-spec div:last-child { border-bottom: 0; padding-bottom: 0; }
.lg-spec div:first-child { padding-top: 0; }
.lg-spec dt {
flex-shrink: 0; width: 104px; margin: 0;
font-family: var(--lg-num); font-size: 11px;
letter-spacing: .05em; text-transform: uppercase;
color: var(--lg-text-3);
}
.lg-spec dd {
margin: 0; flex: 1; min-width: 0;
color: var(--lg-text); font-weight: 500;
word-break: break-word; text-align: right;
line-height: 1.5;
}
.lg-spec dd.num { font-size: 13px; }
.lg-card-title {
margin: 0 0 8px; font-size: 11.5px; font-weight: 650;
letter-spacing: .08em; text-transform: uppercase; color: var(--lg-text-3);
} .lg-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lg-more a {
display: flex; flex-direction: column;
border: 1px solid var(--lg-line);
border-radius: 10px;
overflow: hidden;
background: var(--lg-surface);
transition: border-color .14s ease;
}
.lg-more a:hover { border-color: var(--lg-line-2); text-decoration: none; }
.lg-more-thumb {
display: block; width: 100%;
aspect-ratio: 4 / 3;
background: var(--lg-surface);
border-bottom: 1px solid var(--lg-line);
overflow: hidden;
}
.lg-more-thumb img { width: 100%; height: 100%; object-fit: contain; padding: 5px; display: block; }
.lg-more span:not(.lg-more-thumb) { display: block; padding: 8px 10px 10px; }
.lg-more b {
display: block;
font-family: var(--lg-display);
font-size: 13.5px; font-weight: 600; color: var(--lg-text);
line-height: 1.32;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
overflow: hidden;
}
.lg-more-meta {
display: block; margin-top: 3px;
font-family: var(--lg-num); font-size: 10.5px;
color: var(--lg-text-3); font-variant-numeric: tabular-nums;
}
.lg-empty {
background: var(--lg-surface); border: 1px solid var(--lg-line);
border-radius: var(--lg-r-lg); padding: 48px 20px;
text-align: center; color: var(--lg-text-2);
} .lg-vtable {
border: 1px solid var(--lg-line);
border-radius: var(--lg-r-lg);
overflow: hidden;
background: var(--lg-surface);
}
.lg-vhead, .lg-vrow {
display: grid;
grid-template-columns: 92px minmax(0, 1fr) 168px;
gap: 18px; align-items: start;
padding: 15px 18px;
}
.lg-vhead {
padding: 10px 18px;
background: var(--lg-surface-2);
border-bottom: 1px solid var(--lg-line);
font-size: 11px; font-weight: 650;
letter-spacing: .07em; text-transform: uppercase;
color: var(--lg-text-3);
}
.lg-vhead span:last-child { text-align: center; }
.lg-vrow { border-bottom: 1px solid var(--lg-line); transition: background .12s ease; }
.lg-vrow:last-of-type { border-bottom: 0; }
.lg-vrow:hover { background: var(--lg-surface-2); } .lg-vdate { line-height: 1.35; }
.lg-vdate b {
display: block;
font-size: 13.5px; font-weight: 600; color: var(--lg-text);
letter-spacing: -0.01em;
}
.lg-vdate span {
display: block;
font-family: var(--lg-num); font-size: 12px; color: var(--lg-text-3);
font-variant-numeric: tabular-nums;
}
.lg-vinfo { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.lg-vinfo > div { display: flex; gap: 10px; align-items: baseline; }
.lg-vinfo dt {
flex-shrink: 0; width: 74px; margin: 0;
font-size: 12px; font-weight: 500; color: var(--lg-text-3);
}
.lg-vinfo dd {
margin: 0; min-width: 0;
font-size: 13px; color: var(--lg-text); word-break: break-word;
}
.lg-vinfo dd.num { font-family: var(--lg-num); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.lg-vdl { display: flex; gap: 10px; align-items: flex-start; justify-content: flex-end; } .lg-vcell { display: flex; flex-direction: column; align-items: center; }
.lg-vbtn {
display: flex; align-items: center; justify-content: center;
width: 42px; height: 36px; padding: 0;
background: var(--lg-violet); color: #fff;
border: 1px solid var(--lg-violet); border-radius: 8px;
cursor: pointer;
transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.lg-vbtn:hover { background: var(--lg-violet-ink); border-color: var(--lg-violet-ink); }
.lg-vbtn .lg-i { width: 17px; height: 17px; } .lg-vbtn-alt {
background: var(--lg-p2p-soft);
border-color: var(--lg-p2p-soft);
color: var(--lg-p2p-ink);
}
.lg-vbtn-alt:hover {
background: var(--lg-p2p); border-color: var(--lg-p2p); color: #fff;
}
.lg-vsize {
display: block; margin-top: 6px;
font-family: var(--lg-num); font-size: 11px;
color: var(--lg-text-3); text-align: center;
font-variant-numeric: tabular-nums; letter-spacing: -0.01em;
}
.lg-vmore {
display: block; margin: 14px auto 0;
padding: 9px 20px; border: 1px solid var(--lg-line); border-radius: 7px;
background: var(--lg-surface); color: var(--lg-text-2);
font: inherit; font-size: 13.5px; font-weight: 550; cursor: pointer;
transition: border-color .12s ease, color .12s ease;
}
.lg-vmore:hover { color: var(--lg-text); border-color: var(--lg-line-2); }
.lg-vmore::after { content: " \2304"; }
.lg-vmore.is-open::after { content: " \2303"; } .lg-comments { max-width: 760px; padding: 4px 0 48px; }
.lg-comments-title {
display: flex; align-items: center; gap: 8px;
margin: 0 0 16px;
font-family: var(--lg-display);
font-size: 19px; font-weight: 600; letter-spacing: -0.008em;
}
.lg-comments-title .lg-i { color: var(--lg-text-3); }
.lg-comment-list { list-style: none; margin: 0 0 24px; padding: 0; }
.lg-comment-list .children { list-style: none; margin: 10px 0 0 22px; padding: 0 0 0 16px; border-left: 2px solid var(--lg-line); }
.lg-comment { margin-bottom: 10px; }
.lg-comment > article {
background: var(--lg-surface); border: 1px solid var(--lg-line);
border-radius: var(--lg-r-lg); padding: 14px 16px;
}
.lg-comment-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.lg-avatar { border-radius: 50%; display: block; }
.lg-comment-head b { display: block; font-size: 14px; font-weight: 600; }
.lg-comment-head span { display: block; font-size: 11.5px; color: var(--lg-text-3); }
.lg-comment-body { font-size: 14.5px; }
.lg-comment-body p { margin: 0 0 10px; }
.lg-comment-body p:last-child { margin-bottom: 0; }
.lg-comment-foot { margin-top: 10px; }
.lg-comment-foot a { font-size: 12.5px; color: var(--lg-text-2); }
.lg-comment-foot a:hover { color: var(--lg-violet-ink); }
.lg-comments-closed { font-size: 13.5px; color: var(--lg-text-3); }
.lg-comment-form, .comment-respond {
background: var(--lg-surface); border: 1px solid var(--lg-line);
border-radius: var(--lg-r-lg); padding: 18px;
}
.comment-reply-title { margin: 0 0 12px; font-size: 15px; font-weight: 650; letter-spacing: -0.015em; }
.comment-reply-title small { font-weight: 400; font-size: 12.5px; margin-left: 8px; }
.comment-form p { margin: 0 0 12px; }
.comment-form label { display: block; font-size: 12.5px; color: var(--lg-text-2); margin-bottom: 4px; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
width: 100%; padding: 9px 12px;
background: var(--lg-surface-2); color: var(--lg-text);
border: 1px solid var(--lg-line); border-radius: var(--lg-r);
font: inherit; font-size: 14px; outline: none;
}
.comment-form input:focus, .comment-form textarea:focus { border-color: var(--lg-violet); }
.comment-form textarea { resize: vertical; min-height: 92px; }
.comment-form .comment-form-cookies-consent { display: flex; align-items: center; gap: 8px; }
.comment-form .comment-form-cookies-consent label { margin: 0; font-size: 12.5px; }
.comment-form .comment-form-cookies-consent input { width: auto; }
.lg-comment-submit, .comment-form .submit {
height: 42px; padding: 0 22px; border: 0; border-radius: var(--lg-r);
background: var(--lg-violet); color: #fff;
font: inherit; font-size: 14.5px; font-weight: 600; cursor: pointer;
}
.lg-comment-submit:hover, .comment-form .submit:hover { background: var(--lg-violet-ink); }
.comment-form-author, .comment-form-email, .comment-form-url { max-width: 420px; } .lg-gate { max-width: 480px; margin: 0 auto; padding: 44px 0 64px; text-align: center; }
.lg-gate-card {
background: var(--lg-surface);
border: 1px solid var(--lg-line);
border-radius: 16px;
padding: 32px 26px;
}
.lg-gate-thumb {
width: 72px; height: 72px; margin: 0 auto 16px;
border-radius: 17px; overflow: hidden;
background: var(--lg-surface-2);
display: flex; align-items: center; justify-content: center; color: var(--lg-text-3);
}
.lg-gate-thumb img { width: 100%; height: 100%; object-fit: contain; }
.lg-gate h1 {
margin: 0 0 6px;
font-family: var(--lg-display);
font-size: 24px; font-weight: 600; letter-spacing: -0.012em;
}
.lg-gate-meta { margin: 0 0 26px; font-family: var(--lg-num); font-size: 12.5px; color: var(--lg-text-3); } .lg-ring { position: relative; width: 108px; height: 108px; margin: 0 auto 20px; }
.lg-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.lg-ring circle { fill: none; stroke-width: 5; stroke-linecap: round; }
.lg-ring .track { stroke: var(--lg-line); }
.lg-ring .bar { stroke: var(--lg-violet); transition: stroke-dashoffset 1s linear; }
.lg-ring b {
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
font-family: var(--lg-num); font-size: 30px; font-weight: 500;
color: var(--lg-text); letter-spacing: -0.03em;
}
.lg-gate-note { margin: 0 0 20px; font-size: 13.5px; color: var(--lg-text-2); }
a.lg-gate-btn,
a.lg-gate-btn:link,
a.lg-gate-btn:visited,
a.lg-gate-btn:hover,
a.lg-gate-btn:focus,
a.lg-gate-btn:active { color: #fff; text-decoration: none; }
a.lg-gate-btn small { color: inherit; }
button.lg-gate-btn { text-decoration: none; }
.lg-gate-btn {
display: flex; align-items: center; justify-content: center; gap: 9px;
width: 100%; height: 50px; border: 0;
border-radius: var(--lg-r); font: inherit;
font-size: 15.5px; font-weight: 600;
background: var(--lg-violet); color: #fff; cursor: pointer;
}
.lg-gate-btn:hover, a.lg-gate-btn:hover { background: var(--lg-violet-ink); text-decoration: none; color: #fff; }
.lg-gate-btn[hidden] { display: none; }
.lg-gate-btn:disabled, .lg-gate-btn.wait {
background: var(--lg-surface-2); color: var(--lg-text-3); cursor: default;
}
.lg-gate-back { display: inline-block; margin-top: 18px; font-size: 13px; color: var(--lg-text-2); } .lg-gr { margin-top: 34px; }
.lg-gr-title {
display: flex; align-items: center; gap: 14px;
margin: 0 0 14px;
font-size: 11.5px; font-weight: 650;
letter-spacing: .08em; text-transform: uppercase;
color: var(--lg-text-3);
}
.lg-gr-title::before, .lg-gr-title::after {
content: ""; flex: 1; height: 1px; background: var(--lg-line);
}
.lg-gr-title span { white-space: nowrap; }
.lg-gr-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
}
.lg-gr-item {
display: flex; align-items: center; gap: 11px;
padding: 11px 12px;
background: var(--lg-surface);
border: 1px solid var(--lg-line);
border-radius: var(--lg-r-lg);
text-align: left;
transition: border-color .14s ease, transform .14s ease;
}
.lg-gr-item:hover {
text-decoration: none;
border-color: var(--lg-line-2);
transform: translateY(-1px);
}
.lg-gr-thumb {
width: 40px; height: 40px; flex-shrink: 0;
border-radius: 10px; overflow: hidden;
background: var(--lg-surface-2);
display: flex; align-items: center; justify-content: center;
color: var(--lg-text-3);
}
.lg-gr-thumb img { width: 100%; height: 100%; object-fit: contain; }
.lg-gr-text { min-width: 0; }
.lg-gr-text b {
display: block;
font-family: var(--lg-display);
font-size: 14.5px; font-weight: 600; color: var(--lg-text);
letter-spacing: -0.004em; line-height: 1.3;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lg-gr-text span {
display: block; margin-top: 2px;
font-family: var(--lg-num); font-size: 11px;
color: var(--lg-text-3); font-variant-numeric: tabular-nums;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 520px) {
.lg-gr-grid { grid-template-columns: minmax(0, 1fr); }
} .lg-foot { border-top: 1px solid var(--lg-line); background: var(--lg-surface); margin-top: 8px; }
.lg-foot-in {
max-width: var(--lg-max); margin: 0 auto; padding: 16px 20px;
display: flex; align-items: center; justify-content: space-between;
gap: 14px 22px; flex-wrap: wrap;
}
.lg-foot-name { font-size: 13.5px; font-weight: 600; color: var(--lg-text); }
.lg-foot-links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.lg-foot-links ul, .lg-foot-links li { list-style: none; margin: 0; padding: 0; display: contents; }
.lg-foot-links a { font-size: 13px; color: var(--lg-text-2); }
.lg-foot-links a:hover { color: var(--lg-violet-ink); }
.lg-foot-note { font-size: 12px; color: var(--lg-text-3); } @media (max-width: 1000px) { .lg-split { display: flex; flex-direction: column; gap: 0; }
.lg-main-col { order: 1; }
.lg-rail { position: static; order: 2; margin-bottom: 28px; }
.lg-comments { padding-bottom: 32px; }
.lg-vhead { display: none; }
.lg-vrow {
grid-template-columns: minmax(0, 1fr) auto;
gap: 12px 16px;
align-items: center;
padding: 14px;
}
.lg-vdate { grid-column: 1 / -1; display: flex; gap: 5px; align-items: baseline; }
.lg-vdate b { font-size: 12.5px; color: var(--lg-text-3); font-weight: 500; }
.lg-vdate span { font-size: 12.5px; }
.lg-vinfo { grid-column: 1; }
.lg-vdl { grid-column: 2; }
.lg-vinfo dt { width: 66px; }
}
@media (max-width: 780px) {
.lg-facts { display: none; }
}
@media (max-width: 600px) {
.lg-item { flex-wrap: wrap; padding: 14px; gap: 12px; }
.lg-body { flex: 1 1 calc(100% - 62px); }
.lg-facts {
display: flex; flex: 1 0 100%; flex-direction: row;
justify-content: space-between; align-items: center; text-align: left;
width: auto; padding-top: 11px; border-top: 1px solid var(--lg-line);
}
.lg-go { flex: 0 0 auto; }
.lg-item .lg-go { position: static; }
.lg-head { padding-top: 20px; }
.lg-head h1 { font-size: 21px; }
.lg-hero { gap: 14px; }
.lg-hero-thumb { width: 62px; height: 62px; border-radius: 15px; }
.lg-hero h1 { font-size: 22px; }
.lg-gate-card { padding: 26px 18px; }
}
@media (prefers-reduced-motion: reduce) {
.lg-item, .lg-ring .bar { transition: none; }
}
:focus-visible { outline: 2px solid var(--lg-violet); outline-offset: 2px; }  html { -webkit-text-size-adjust: 100%; } body.ledger { overflow-x: hidden; }
body.ledger img,
body.ledger table,
body.ledger pre,
body.ledger iframe { max-width: 100%; } @media (max-width: 782px) {
.lg-searchbar input,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea { font-size: 16px; }
}  .lg-burger { display: none; }
.lg-drawer, .lg-backdrop { display: none; }
@media (max-width: 782px) {
.lg-nav-in {
height: 54px;
gap: 10px;
padding: 0 12px;
}
.lg-pills { display: none; }
.lg-burger {
display: flex; flex-direction: column; justify-content: center;
gap: 4px;
width: 38px; height: 38px; padding: 0 9px;
border: 0; background: none; cursor: pointer;
flex-shrink: 0;
}
.lg-burger span {
display: block; height: 2px; width: 100%;
background: var(--lg-text); border-radius: 2px;
transition: transform .2s ease, opacity .15s ease;
} body.lg-open .lg-burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.lg-open .lg-burger span:nth-child(2) { opacity: 0; }
body.lg-open .lg-burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.lg-mark { flex: 1 1 auto; min-width: 0; font-size: 16px; }
.lg-mark:not(.lg-drawer-head .lg-mark) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lg-tools { flex: 0 0 auto; }
.lg-icon-btn { padding: 9px; }
.lg-searchbar form { padding: 9px 12px; }
.lg-searchbar input { height: 40px; }  .lg-backdrop {
display: block;
position: fixed; inset: 0; z-index: 120;
background: rgba(10, 12, 16, .45);
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .2s ease, visibility .2s ease;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
.lg-backdrop[hidden] { display: none; }
body.lg-open .lg-backdrop {
opacity: 1;
visibility: visible;
pointer-events: auto;
} .lg-drawer { visibility: hidden; }
body.lg-open .lg-drawer { visibility: visible; } .lg-drawer {
display: flex; flex-direction: column;
position: fixed; top: 0; left: 0; z-index: 130;
width: min(84vw, 320px); height: 100%;
background: var(--lg-surface);
border-right: 1px solid var(--lg-line);
transform: translateX(-100%);
transition: transform .24s cubic-bezier(.4, 0, .2, 1), visibility .24s;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
padding-bottom: env(safe-area-inset-bottom);
}
body.lg-open .lg-drawer { transform: translateX(0); }
.lg-drawer-head {
display: flex; align-items: center; justify-content: space-between;
gap: 10px;
padding: 14px 16px;
border-bottom: 1px solid var(--lg-line);
}
.lg-drawer-head .lg-mark { font-size: 16px; }
.lg-drawer-x {
display: flex; align-items: center; justify-content: center;
width: 34px; height: 34px; flex-shrink: 0;
border: 0; border-radius: 8px;
background: var(--lg-surface-2); color: var(--lg-text-2);
cursor: pointer;
}
.lg-drawer-x:hover { color: var(--lg-text); }
.lg-drawer-search {
display: flex; align-items: center; gap: 9px;
margin: 14px 16px 6px;
padding: 0 12px; height: 42px;
background: var(--lg-surface-2);
border: 1px solid transparent; border-radius: var(--lg-r);
color: var(--lg-text-3);
}
.lg-drawer-search:focus-within { border-color: var(--lg-violet); background: var(--lg-surface); }
.lg-drawer-search input {
flex: 1; min-width: 0; padding: 0;
border: 0; background: none; outline: none;
font: inherit; font-size: 16px; color: var(--lg-text);
}
.lg-drawer-nav { padding: 8px 8px 14px; }
.lg-drawer-nav ul, .lg-drawer-nav li { list-style: none; margin: 0; padding: 0; }
.lg-drawer-link {
display: flex; align-items: center;
padding: 12px 12px;
border-radius: var(--lg-r);
font-size: 15.5px; font-weight: 500;
color: var(--lg-text);
}
.lg-drawer-link:hover { background: var(--lg-surface-2); text-decoration: none; }
.lg-drawer-nav .current-menu-item > .lg-drawer-link,
.lg-drawer-nav .current_page_item > .lg-drawer-link {
background: var(--lg-violet-soft); color: var(--lg-violet-ink); font-weight: 600;
}
.lg-drawer-foot {
margin-top: auto;
padding: 14px 16px calc(18px + env(safe-area-inset-bottom));
border-top: 1px solid var(--lg-line);
}
.lg-drawer-foot ul, .lg-drawer-foot li { list-style: none; margin: 0; padding: 0; }
.lg-drawer-flink {
display: block; padding: 7px 0;
font-size: 13.5px; color: var(--lg-text-2);
}
.lg-drawer-flink:hover { color: var(--lg-violet-ink); text-decoration: none; }
}
@media (max-width: 380px) {
.lg-mark { font-size: 15px; }
.lg-mark span { width: 24px; height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
.lg-drawer, .lg-backdrop, .lg-burger span { transition: none; }
} @media (max-width: 782px) {
body.ledger #page { padding-left: 14px; padding-right: 14px; }
.lg-head { padding: 18px 0 12px; }
.lg-head h1 { font-size: 21px; letter-spacing: -0.02em; }
.lg-head p { font-size: 13.5px; } .lg-sort {
flex: 1 0 100%;
overflow-x: auto;
scrollbar-width: none;
padding-bottom: 2px;
}
.lg-sort::-webkit-scrollbar { display: none; }
.lg-sort a, .lg-sort strong { white-space: nowrap; padding: 6px 12px; }
} @media (max-width: 640px) { .lg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lg-card-body { padding: 10px 11px 11px; gap: 5px; }
.lg-card-name { font-size: 13.5px; -webkit-line-clamp: 2; }
.lg-card-soft { font-size: 11.5px; }
.lg-card-meta { font-size: 10.5px; }
.lg-format { font-size: 9.5px; padding: 2px 6px; top: 7px; left: 7px; }
.lg-shot-lead img { max-height: 280px; padding: 12px; }
.lg-shots { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}
@media (max-width: 400px) {
.lg-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
.lg-item { padding: 13px 14px; gap: 12px; }
.lg-thumb { width: 46px; height: 46px; border-radius: 11px; }
.lg-title { font-size: 15.5px; }
.lg-sub { font-size: 13px; -webkit-line-clamp: 2; } .lg-facts {
flex-direction: row;
align-items: center;
gap: 12px;
width: auto;
text-align: left;
}
.lg-go { height: 36px; padding: 0 18px; }
} @media (max-width: 782px) {
.lg-crumbs {
padding-top: 16px; font-size: 12px;
white-space: nowrap; overflow-x: auto; scrollbar-width: none;
}
.lg-crumbs::-webkit-scrollbar { display: none; }
.lg-hero { gap: 14px; padding: 16px 0 18px; }
.lg-hero-thumb { width: 60px; height: 60px; border-radius: 14px; }
.lg-hero h1 { font-size: 21px; }
.lg-hero p { font-size: 14.5px; }
.lg-sec { margin-bottom: 24px; }
.lg-prose { font-size: 15px; }
.lg-prose h2, .lg-prose h3 { font-size: 17px; } .lg-card { padding: 14px; }
.lg-dl { height: 50px; font-size: 16px; }
.lg-alt a, .lg-alt button { height: 48px; font-size: 15px; }
.lg-spec div { padding: 9px 0; }
.lg-spec dt { width: 96px; font-size: 12px; }
.lg-spec dd { font-size: 13.5px; }
} @media (max-width: 600px) {
.lg-vhead { display: none; }
.lg-vrow {
grid-template-columns: minmax(0, 1fr) auto;
gap: 10px 14px;
padding: 14px;
align-items: center;
}
.lg-vdate {
grid-column: 1 / -1;
display: flex; gap: 5px; align-items: baseline;
}
.lg-vdate b { font-size: 12px; font-weight: 500; color: var(--lg-text-3); }
.lg-vdate span { font-size: 12px; }
.lg-vinfo { grid-column: 1; gap: 3px; }
.lg-vinfo > div { flex-direction: column; gap: 1px; }
.lg-vinfo dt { width: auto; font-size: 11px; }
.lg-vinfo dd { font-size: 12.5px; }
.lg-vdl { grid-column: 2; gap: 8px; }
.lg-vbtn { width: 44px; height: 40px; }
.lg-vsize { font-size: 10.5px; }
.lg-vmore { width: 100%; padding: 11px 18px; }
} @media (max-width: 600px) {
.lg-gate { padding: 26px 0 40px; }
.lg-gate-card { padding: 24px 16px; border-radius: 14px; }
.lg-gate-thumb { width: 62px; height: 62px; }
.lg-gate h1 { font-size: 19px; }
.lg-ring { width: 92px; height: 92px; }
.lg-ring b { font-size: 26px; }
.lg-gate-btn { height: 52px; font-size: 16px; }
.lg-gr { margin-top: 26px; }
.lg-gr-item { padding: 12px; }
} @media (max-width: 600px) {
.lg-comments { padding-bottom: 28px; }
.lg-comment > article { padding: 13px 14px; }
.lg-comment-list .children { margin-left: 10px; padding-left: 12px; }
.lg-comment-body { font-size: 14px; }
.lg-comment-form, .comment-respond { padding: 15px 14px; }
.comment-form-author, .comment-form-email, .comment-form-url { max-width: none; }
.lg-comment-submit, .comment-form .submit { width: 100%; height: 46px; }
} @media (max-width: 600px) {
.lg-foot-in {
flex-direction: column;
align-items: flex-start;
gap: 12px;
padding: 18px 14px;
}
.lg-foot-links { gap: 6px 16px; }
.lg-foot-links a { padding: 3px 0; }
}  body.ledger { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body.ledger [id] { scroll-margin-top: calc(var(--lg-nav) + 12px); } .lg-spec dd,
.lg-vinfo dd,
.lg-gate-meta,
.lg-prose a,
.lg-comment-body { overflow-wrap: anywhere; word-break: break-word; }
@media (max-width: 782px) { .lg-prose { font-size: 15.5px; line-height: 1.68; }
.lg-prose h2 { font-size: 21px; margin-top: 28px; }
.lg-prose h3 { font-size: 18px; margin-top: 24px; }
.lg-prose p, .lg-prose li { max-width: none; } .lg-prose table { display: block; width: 100%; overflow-x: auto; }
.lg-prose pre { overflow-x: auto; }  .lg-drawer { height: 100dvh; } body.ledger #page {
padding-left: max(14px, env(safe-area-inset-left));
padding-right: max(14px, env(safe-area-inset-right));
}
.lg-nav-in {
padding-left: max(12px, env(safe-area-inset-left));
padding-right: max(12px, env(safe-area-inset-right));
}
.lg-foot-in { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }  .lg-rail { top: auto; }  .lg-go, .lg-vmore, .lg-pages .page-numbers,
.lg-sort a, .lg-sort strong { min-height: 40px; }
.lg-pages .page-numbers { min-width: 40px; height: 40px; }  .lg-comment-list .children .children { margin-left: 0; padding-left: 10px; } .lg-shots a { aspect-ratio: 16 / 10; } .lg-gr-grid { gap: 7px; }
} @media (max-width: 900px) and (orientation: landscape) and (max-height: 520px) {
.lg-gate { padding: 18px 0 30px; }
.lg-ring { width: 72px; height: 72px; margin-bottom: 14px; }
.lg-ring b { font-size: 22px; }
.lg-gate-thumb { width: 50px; height: 50px; margin-bottom: 10px; }
.lg-gate-card { padding: 18px 16px; }
} .lg-shot-lead { cursor: zoom-in; }
.lg-zoom {
position: absolute; right: 12px; bottom: 12px;
display: flex; align-items: center; justify-content: center;
width: 38px; height: 38px;
border-radius: 9px;
background: rgba(22, 24, 31, .82);
color: #fff;
opacity: 0;
transform: translateY(4px);
transition: opacity .16s ease, transform .16s ease;
pointer-events: none;
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
}
.lg-shot-lead:hover .lg-zoom,
.lg-shot-lead:focus-within .lg-zoom { opacity: 1; transform: translateY(0); }
.lg-zoom .lg-i { width: 19px; height: 19px; } @media (hover: none) {
.lg-zoom { opacity: 1; transform: none; }
} .lg-viewer {
position: fixed; inset: 0; z-index: 200;
display: flex; align-items: center; justify-content: center;
background: rgba(16, 18, 24, .92);
opacity: 0; visibility: hidden;
transition: opacity .18s ease, visibility .18s ease;
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
body.lg-viewing .lg-viewer { opacity: 1; visibility: visible; } .lg-viewer-stage {
position: relative;
width: 100%; height: 100%;
overflow: hidden;
display: flex; align-items: center; justify-content: center;
cursor: zoom-in;
}
.lg-viewer-stage.is-zoomed { cursor: grab; }
.lg-viewer-stage.is-dragging { cursor: grabbing; }
.lg-viewer img {
max-width: 94vw; max-height: 92vh;
background: #fff;
border-radius: 6px;
transform-origin: center center;
transition: transform .2s ease;
will-change: transform;
user-select: none; -webkit-user-drag: none;
}
.lg-viewer-stage.is-dragging img { transition: none; }
.lg-viewer-bar {
position: absolute; top: 0; left: 0; right: 0;
display: flex; align-items: center; justify-content: space-between;
gap: 14px;
padding: 14px 16px;
color: rgba(255, 255, 255, .92);
pointer-events: none;
}
.lg-viewer-title {
font-size: 13.5px; font-weight: 500;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}
.lg-viewer-tools { display: flex; gap: 6px; pointer-events: auto; }
.lg-viewer-btn {
display: flex; align-items: center; justify-content: center;
width: 36px; height: 36px; padding: 0;
border: 0; border-radius: 8px;
background: rgba(255, 255, 255, .12);
color: #fff; cursor: pointer;
transition: background .14s ease;
}
.lg-viewer-btn:hover { background: rgba(255, 255, 255, .22); }
.lg-viewer-btn:disabled { opacity: .35; cursor: default; }
.lg-viewer-btn .lg-i { width: 18px; height: 18px; }
.lg-viewer-level {
display: flex; align-items: center; justify-content: center;
min-width: 52px; height: 36px; padding: 0 10px;
border-radius: 8px;
background: rgba(255, 255, 255, .12);
font-family: var(--lg-num); font-size: 12.5px;
font-variant-numeric: tabular-nums;
}
.lg-viewer-hint {
position: absolute; bottom: 14px; left: 0; right: 0;
text-align: center;
font-size: 12px; color: rgba(255, 255, 255, .55);
pointer-events: none;
transition: opacity .2s ease;
}
.lg-viewer-hint.is-gone { opacity: 0; }
@media (max-width: 600px) {
.lg-viewer-title { display: none; }
.lg-viewer-bar { justify-content: flex-end; }
.lg-viewer-hint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
.lg-viewer, .lg-viewer img, .lg-zoom { transition: none; }
}