*{box-sizing:border-box}[v-cloak]{display:none}html{scroll-behavior:smooth}body{margin:0;background:#f7f5ef;color:#222a24;font:16px/1.6 "Microsoft YaHei","PingFang SC",sans-serif}button,input,select{font:inherit}button,.cta{cursor:pointer}button{background:transparent;color:inherit;border:1px solid #c8cdc3;border-radius:7px;padding:8px 13px}button:hover{background:#e9ede4}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c27c30;outline-offset:2px}a{color:inherit;text-decoration:none}.wrap{width:min(1170px,calc(100% - 48px));margin-inline:auto}header{background:#fffdf8;border-bottom:1px solid #e5e4da}.header{display:flex;align-items:center;gap:36px;min-height:76px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;white-space:nowrap;line-height:1.2}.brand img{width:46px;height:46px}.brand small{display:block;font:700 9px/1.5 system-ui;letter-spacing:.12em;color:#647269}nav,.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}nav button,.actions button{border-color:transparent}.actions{margin-left:auto;justify-content:flex-end}.primary,.actions .primary{background:#24483a;color:white;border:1px solid #24483a}.primary:hover,.actions .primary:hover{background:#34604e}.active{color:#24483a;background:#e9ede4}.badge{display:inline-block;background:#a64f28;color:#fff;border-radius:99px;min-width:21px;text-align:center;font-size:12px}.hero{margin-top:28px;background:#233b31;color:#fff9ed;border-radius:17px;overflow:hidden;display:grid;grid-template-columns:1fr 1.08fr;min-height:384px}.hero-copy{padding:42px 44px 43px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.16em;color:#5d6f60;margin:0 0 8px}.hero .eyebrow{color:#f2c997}.hero h1{font-family:"Songti SC","SimSun",serif;font-size:clamp(42px,6vw,78px);line-height:1.04;margin:15px 0 18px}.hero h1 span{color:#e5a14b}.hero-copy>p:not(.eyebrow){color:#dce1d6}.cta{display:inline-flex;gap:25px;border-radius:7px;padding:9px 15px;margin-top:10px}.hero .cta{background:#f3d5a7;color:#202d23}.hero-art,.cover{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(155deg,#dcb47e,#e7ba88 46%,#a67e58 78%)}.hero-art i,.cover i{position:absolute;width:33%;aspect-ratio:1;border-radius:50%;background:#ffd586;left:49%;top:11%}.hero-art b,.cover b{position:absolute;inset:27% -3% 0;background:#314a3e;clip-path:polygon(0 80%,18% 60%,35% 74%,53% 40%,63% 47%,79% 15%,100% 52%,100% 100%,0 100%)}.hero-art:after,.cover:after{content:"";position:absolute;inset:52% -3% 0;background:#152e27;clip-path:polygon(0 35%,16% 45%,33% 26%,52% 66%,73% 42%,86% 52%,100% 26%,100% 100%,0 100%)}.hero-art em{position:absolute;right:19px;bottom:15px;z-index:2;font:700 10px system-ui;letter-spacing:.16em;color:#e5ece2}#catalog{margin:36px 0 55px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:15px}.section-head h2,.panel h1{margin:0;font-size:33px;line-height:1.15}.muted,small{color:#65716a}.filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 19px}.filters input{margin-left:auto}.selected{background:#24483a;color:white}.selected:hover{background:#34604e}input,select{padding:8px 10px;border:1px solid #bdc5bd;border-radius:6px;color:#222a24;background:#fff}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.grid article,.panel{border:1px solid #e3e3d9;background:#fffdf8;border-radius:13px;overflow:hidden}.cover{display:block;width:100%;border:0;border-radius:0;aspect-ratio:1.7;padding:0}.cover:hover{filter:brightness(1.08)}.cover span{position:absolute;left:11px;top:11px;background:#fff8e7;color:#29362b;padding:2px 8px;border-radius:4px;font-size:12px;z-index:2}.city{background:linear-gradient(160deg,#39435a,#95676e)}.city i{background:#f6b989;width:20%;top:20%}.city b,.walk b{background:#273348;clip-path:polygon(0 20%,13% 20%,13% 53%,27% 53%,27% 10%,39% 10%,39% 75%,47% 75%,47% 33%,65% 33%,65% 70%,76% 70%,76% 4%,91% 4%,91% 63%,100% 63%,100% 100%,0 100%)}.city:after{background:#20283b}.mist{background:linear-gradient(160deg,#d4dfcd,#a6bdb3)}.mist i{background:#eef1d6}.mist b{background:#658379}.mist:after{background:#45665c}.sea{background:linear-gradient(166deg,#b4cdd7,#dddbc2)}.sea i{background:#fff0b7}.sea b{background:#668e9b}.sea:after{background:#487480}.light{background:linear-gradient(155deg,#b17c65,#eac3a2)}.light i{background:#f4d6ae;left:32%;width:26%;border-radius:18% 18% 45% 45%}.light b{background:#77584a}.light:after{background:#503b36}.walk{background:linear-gradient(145deg,#c5bf8e,#c28766)}.walk b{background:#665844}.walk:after{background:#4e5140}.card-body{padding:14px}.card-body h3{margin:0;font-size:20px}.card-body p{margin:5px 0 13px;color:#58675e;min-height:2.8em;font-size:14px}.card-body div{display:flex;justify-content:space-between;align-items:center;gap:8px}.card-body button{border:0;color:#24483a;padding:4px 6px}.panel{margin:28px 0 48px;padding:clamp(18px,4vw,36px);min-height:300px}.row{border-top:1px solid #e6e9df;padding:14px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.row>div:first-child{margin-right:auto;overflow-wrap:anywhere}.row small{display:block}.pill{padding:2px 9px;border-radius:99px;background:#e9eee4;white-space:nowrap}.row code{white-space:pre-wrap;overflow-wrap:anywhere;width:100%;background:#edf1e8;padding:9px}.inline{display:flex;gap:6px;flex-wrap:wrap}.notice,.empty{padding:11px 13px;border-radius:7px;background:#e9eee4;color:#30483a}.notice button{border:0;padding:2px 6px}footer{border-top:1px solid #dedfd4;padding:16px 0 25px;color:#59675c;display:flex;justify-content:space-between;font-size:13px}.overlay{position:fixed;inset:0;z-index:3;display:grid;place-items:center;background:#17231db0;padding:15px}.dialog{background:#fffdf8;padding:23px;border-radius:13px;width:min(100%,480px);max-height:92vh;overflow:auto;position:relative}.dialog h2{margin:0 30px 14px 0}.close{position:absolute;right:10px;top:10px;border:0}.dialog form{display:grid;gap:10px}.dialog label{display:grid;gap:4px}.modal-cover{border-radius:7px}.error{color:#972b21}.username{font-size:14px;overflow-wrap:anywhere}@media(max-width:820px){.header{gap:12px;flex-wrap:wrap;padding:9px 0}nav{order:3;width:100%}.grid{grid-template-columns:repeat(2,1fr)}.hero-copy{padding:30px 25px}}@media(max-width:530px){.wrap{width:calc(100% - 28px)}.hero{grid-template-columns:1fr}.hero-art{height:175px}.grid{grid-template-columns:1fr}.filters input{margin:0;width:100%}.section-head{align-items:start;gap:8px}.section-head h2{font-size:26px}nav button{padding:6px 8px}.muted{font-size:12px}}
.wrap{width:min(1240px,calc(100% - 32px))}.header{gap:12px;min-height:76px}.header nav{flex:1;gap:2px}.header nav button{white-space:nowrap;padding:7px 8px}.header .actions{margin-left:0}.top-search{display:flex;align-items:center;gap:4px}.top-search input{width:125px}.top-search button{white-space:nowrap}.catalog-section{margin-bottom:27px}.catalog-section .section-head{border-bottom:1px solid #dedfd4;padding-bottom:10px}.catalog-section .section-head h2{font-size:24px}.catalog-section .section-head button,.card-body h3 button{border:0}.catalog-intro{min-height:0;margin-bottom:24px}.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.grid .cover{aspect-ratio:295 / 400}.card-body h3 button{font-size:17px;font-weight:700;padding:0;text-align:left}.card-body div{margin-top:5px}.card-body strong{font-size:14px}@media(max-width:1140px){.header{flex-wrap:wrap}.header nav{order:3;flex-basis:100%;padding-bottom:7px}.header .actions{margin-left:auto}}@media(max-width:850px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:620px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.header nav{width:100%}.top-search input{width:90px}.top-search button{padding:7px}.card-body{padding:8px}.card-body h3 button{font-size:15px}}

/* Gallery theme */
:root {
  --canvas: #f7f6f3;
  --surface: #fffefa;
  --ink: #242321;
  --muted: #67615a;
  --rule: #ded9cf;
  --accent: #795a32;
  --gold: #dfc194;
  --dark: #171719;
}
body { background: var(--canvas); color: var(--ink); }
header { background: var(--dark); color: #f7f3eb; border-bottom: 1px solid #36312c; }
.brand { letter-spacing: .07em; }
.brand small { color: #d3b68c; }
.header nav button, .header .actions button { color: #e9e3d9; }
.header nav button:hover, .header .actions button:hover, .top-search button:hover {
  background: #302c28;
  color: #fff4dd;
}
.header nav button.active {
  color: #f4d6a8;
  background: #2b2723;
  box-shadow: inset 0 -2px var(--gold);
}
.top-search input, .top-search button {
  background: #222224;
  border-color: #514a42;
  color: #f7f3eb;
}
.top-search input::placeholder { color: #b9b1a6; }
.actions .primary { background: var(--gold); border-color: var(--gold); color: #221c16; }
.actions .primary:hover { background: #edd3ad; color: #221c16; }
button, input, select { border-color: var(--rule); }
input, select { color: var(--ink); }
button:hover { background: #eee8df; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline-color: #a77940; }
.primary, .selected { background: #292624; border-color: #292624; color: #fff7e9; }
.primary:hover, .selected:hover { background: #4a392d; }
.grid article, .panel, .dialog { background: var(--surface); border-color: var(--rule); }
.grid article, .panel { border-radius: 8px; }
.grid article { box-shadow: 0 2px 8px #21160708; }
.grid article:hover { border-color: #b79e7a; box-shadow: 0 6px 18px #21160713; }
.catalog-section .section-head { border-bottom-color: var(--rule); }
.catalog-section .section-head h2 { font-family: "Songti SC", "SimSun", serif; letter-spacing: .07em; }
.catalog-section .section-head button, .card-body strong { color: var(--accent); }
.card-body h3 button { color: var(--ink); }
.card-body h3 button:hover { color: var(--accent); }
small, .muted, .eyebrow, footer { color: var(--muted); }
.row, footer { border-color: var(--rule); }
.pill, .notice, .empty, .row code { background: #eee7db; color: #544335; }
.badge { background: #85582d; }
.overlay { background: #111014b8; }
.cover { background: linear-gradient(155deg, #b18567, #dfbb92 48%, #a87962 78%); }
.cover i { background: #f1d3a7; }
.cover b { background: #57464a; }
.cover::after { background: #29262f; }
.cover.city { background: linear-gradient(155deg, #3b4054, #86677a); }
.cover.city b { background: #333448; }
.cover.city::after { background: #242333; }
.cover.mist { background: linear-gradient(155deg, #d6d6d4, #a8adb0); }
.cover.mist i { background: #f0ece0; }
.cover.mist b { background: #727d82; }
.cover.mist::after { background: #4c565e; }
.cover.sea { background: linear-gradient(155deg, #a0b6c6, #ded2c2); }
.cover.sea b { background: #687f91; }
.cover.sea::after { background: #45576b; }
.cover.light { background: linear-gradient(155deg, #a37d77, #e4c2aa); }
.cover.light b { background: #806566; }
.cover.light::after { background: #503e46; }
.cover.walk { background: linear-gradient(155deg, #b9ae99, #b08275); }
.cover.walk b { background: #69585a; }
.cover.walk::after { background: #493f49; }

.admin-console{display:grid;grid-template-columns:170px minmax(0,1fr);gap:24px}.admin-console aside{display:flex;flex-direction:column;gap:8px;align-items:stretch}.admin-console aside h1{font-size:23px;margin-bottom:8px}.admin-console h2{margin-top:0}.admin-heading{display:flex;justify-content:space-between;align-items:start;gap:12px}.admin-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px;margin:14px 0}.admin-metrics div{padding:12px;border:1px solid var(--rule);border-radius:6px}.admin-metrics strong{display:block;font-size:22px}.admin-table{overflow:auto}.admin-table table{width:100%;border-collapse:collapse;text-align:left}.admin-table th,.admin-table td{padding:10px;border-bottom:1px solid var(--rule);vertical-align:top}.admin-table th{white-space:nowrap}.admin-table small{display:block}.admin-table input{max-width:150px}.admin-form{padding:16px;margin-bottom:20px;border:1px solid var(--rule);border-radius:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-form label{display:grid;gap:4px}.admin-form h3,.admin-form .span-all{grid-column:1/-1}.admin-form .check{display:flex;align-items:center}.admin-form textarea{font:inherit;padding:8px;min-height:72px;border:1px solid var(--rule);border-radius:6px}.member-content{white-space:pre-wrap}.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}@media(max-width:750px){.admin-console{grid-template-columns:1fr}.admin-console aside{flex-direction:row;flex-wrap:wrap}.admin-console aside h1{width:100%}.admin-console aside .eyebrow{display:none}}

/* Studio interface */
:root {
  --canvas: #f2f3f5;
  --surface: #ffffff;
  --ink: #171b23;
  --muted: #5e6675;
  --rule: #dde1e8;
  --accent: #344d80;
  --dark: #111620;
  --gold: #c5d6ff;
}
body { font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif; }
header { color: #f5f7fb; border-bottom-color: #262e3e; }
.brand small { color: #a9b9d3; letter-spacing: .16em; }
.header nav button, .header .actions button { color: #dce3ef; }
.header nav button.active { color: #eff4ff; background: #232e43; box-shadow: inset 0 -2px #8faff6; }
.header nav button:hover, .header .actions button:hover, .top-search button:hover { background: #26324a; color: #fff; }
.top-search input, .top-search button { background: #1a2230; border-color: #38435a; color: #f2f5fb; }
.top-search input::placeholder { color: #abb7cb; }
.actions .primary, .actions .primary:hover { background: #d5e2ff; color: #142442; border-color: #d5e2ff; }
.primary, .selected { background: #243d70; border-color: #243d70; color: #fff; }
.primary:hover, .selected:hover { background: #344f83; }
button:hover { background: #edf1f8; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline-color: #496fc3; }
.catalog-section .section-head h2 { font-family: inherit; font-weight: 700; letter-spacing: .04em; }
.catalog-section .section-head button { color: #3b5280; }
.grid article { box-shadow: 0 2px 10px #171b2310; }
.grid article:hover { border-color: #a5b4cc; box-shadow: 0 8px 24px #1729491a; }
.pill, .notice, .empty, .row code { background: #edf1f8; color: #34456a; }
.badge { background: #45619a; }
.admin-console { padding: 0; gap: 0; overflow: hidden; }
.admin-console aside { padding: 24px 16px; background: #141c2b; color: #e8effa; }
.admin-console aside .eyebrow { color: #a6b8d5; }
.admin-console aside h1 { margin: 0 0 8px; font-size: 22px; }
.admin-console aside a, .admin-console aside button {
  text-align: left; padding: 9px 11px; border: 1px solid transparent; border-radius: 7px;
}
.admin-console aside button:hover, .admin-console aside a:hover { background: #22314b; }
.admin-console aside .selected { background: #2c4167; border-color: #526d9a; }
.admin-main { padding: clamp(16px, 3vw, 32px); min-width: 0; }
.admin-main h2 { margin-bottom: 14px; font-size: 26px; }
.admin-metrics div { background: #f5f7fb; color: #47546a; }
.admin-metrics strong { color: #182d53; }
.admin-table { border: 1px solid var(--rule); border-radius: 8px; }
.admin-table th { background: #f1f4fa; color: #3b4b65; }
.admin-table tr:last-child td { border-bottom: 0; }
.admin-table tbody tr:hover { background: #f8faff; }
.admin-form { background: #f8faff; }
.upload-card { border: 1px dashed #9aaecb; border-radius: 8px; padding: 12px; min-width: 0; }
.upload-card legend { font-weight: 700; }
.upload-card label { margin-bottom: 9px; }
.upload-preview img, .image-list img { display: block; width: 96px; height: 90px; object-fit: cover; border-radius: 6px; }
.image-list { display: flex; flex-wrap: wrap; gap: 10px; }
.image-list figure { margin: 0; display: grid; gap: 4px; }
.member-gallery { display: grid; gap: 10px; }
.member-gallery img { display: block; width: 100%; border-radius: 8px; }
@media (max-width:750px) { .admin-console aside { padding: 14px; } .admin-form { grid-template-columns: 1fr; } }

/* Light gallery and navigation */
:root {
  --canvas: #f5f8fa;
  --surface: #fff;
  --ink: #10243b;
  --muted: #556777;
  --rule: #dce6ed;
  --accent: #006b96;
}
header { background: #fff; color: var(--ink); border-bottom-color: var(--rule); }
.header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  grid-template-areas: "brand navigation search account";
  gap: 10px 18px;
}
.header .brand { grid-area: brand; min-width: 0; }
.header .brand small { color: #526c84; }
.header nav {
  grid-area: navigation; order: initial; width: auto; min-width: 0; padding: 0;
  justify-content: center;
}
.header nav button, .header .actions button { color: var(--ink); }
.header nav button { border-radius: 0; }
.header nav button.active { color: var(--accent); background: #fff; box-shadow: inset 0 -2px #007da8; }
.header nav button:hover, .header .actions button:hover, .top-search button:hover { color: var(--accent); background: #edf7fb; }
.header .top-search { grid-area: search; min-width: 0; }
.top-search input, .top-search button { background: #fff; border-color: var(--rule); color: var(--ink); }
.top-search input::placeholder { color: #5c6f81; }
.header .actions { grid-area: account; margin: 0; gap: 4px; justify-self: end; flex-wrap: nowrap; }
.header .actions button { white-space: nowrap; }
.header .actions .register-button {
  border: 1px solid #007da8; border-radius: 999px; background: #fff; color: #006589;
  padding-inline: 14px;
}
.header .actions .register-button:hover { background: #eaf7fc; }
.primary, .selected { color: #fff; background: #006b96; border-color: #006b96; }
.primary:hover, .selected:hover { color: #fff; background: #005476; }
.catalog-section .section-head h2 { color: var(--ink); font-weight: 650; }
.catalog-section .section-head button { color: var(--accent); }
.grid article { border-color: #e1e8ed; box-shadow: 0 4px 16px #10243b08; }
.grid article:hover { border-color: #8cbacf; box-shadow: 0 8px 22px #10243b15; }
.admin-console { grid-template-columns: 196px minmax(0,1fr); }
.admin-console aside { background: #f7fafc; color: var(--ink); border-right: 1px solid var(--rule); }
.admin-console aside .eyebrow { color: var(--accent); }
.admin-console aside button:hover, .admin-console aside a:hover { background: #e9f4fa; }
.admin-console aside .selected { color: #005476; background: #e0f1f9; border-color: #b7d9e9; }
.admin-category-menu { display: grid; gap: 4px; margin-top: 6px; border-top: 1px solid var(--rule); padding-top: 10px; }
.admin-category-menu p { margin: 0 0 4px; padding-inline: 11px; color: var(--muted); font-size: 13px; }
.admin-category-menu button { display: flex; align-items: center; justify-content: space-between; gap: 6px; overflow-wrap: anywhere; }
.admin-main h2 { color: var(--ink); }
@media (max-width: 1120px) {
  .header {
    grid-template-columns: minmax(0,1fr) auto auto;
    grid-template-areas: "brand search account" "navigation navigation navigation";
    padding-block: 10px;
  }
  .header nav { justify-content: flex-start; }
}
@media (max-width: 620px) {
  .header {
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "brand account" "navigation navigation" "search search";
    gap: 8px 10px;
  }
  .header .brand { gap: 5px; font-size: 17px; }
  .header .brand img { width: 35px; height: 35px; }
  .header .brand span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .header .brand small { overflow: hidden; text-overflow: ellipsis; font-size: 7px; }
  .header nav button { padding-inline: 6px; font-size: 14px; }
  .header .top-search input { flex: 1; width: auto; min-width: 0; }
}
@media (max-width:750px) {
  .admin-console { grid-template-columns: 1fr; }
  .admin-console aside { border-right: 0; border-bottom: 1px solid var(--rule); }
  .admin-category-menu { flex-basis: 100%; display: flex; flex-wrap: wrap; }
  .admin-category-menu p { flex-basis: 100%; }
}


/* Administrator sign-in */
.admin-signin-main { width: 100%; }
.admin-login {
  position: relative;
  display: grid;
  min-height: 100vh;
  min-height: 100dvh;
  place-items: center;
  padding: 70px 20px;
  background: radial-gradient(ellipse at 20% 10%, #16456d, #061d38 70%);
}
.admin-login-back, .admin-login-foot { position: absolute; color: #b9dcf5; }
.admin-login-back { top: 24px; left: clamp(20px, 4vw, 48px); }
.admin-login-back:hover { text-decoration: underline; }
.admin-login-foot { bottom: 20px; font-size: 12px; }
.admin-login-card {
  width: min(100%, 440px);
  padding: clamp(28px, 7vw, 52px);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 25px 100px #00102555;
}
.admin-login-card h1 { margin: 0; font-size: clamp(26px, 5vw, 30px); }
.admin-login-card .eyebrow { color: #006b96; }
.admin-login-card p { margin: 10px 0 24px; color: var(--muted); }
.admin-login-card label { display: block; margin-bottom: 8px; font-size: 14px; }
.admin-login-card input { width: 100%; min-height: 44px; }
.admin-login-card .primary { width: 100%; min-height: 44px; margin-top: 18px; }
.admin-login-card .error { margin: 8px 0 0; color: #9b252b; }

.user-avatar { width:32px;height:32px;object-fit:cover;border-radius:50%;vertical-align:middle;flex-shrink:0; }
.profile-avatar { width:76px;height:76px;object-fit:cover;border-radius:50%; }
.account-button,.account-summary,.avatar-setting,.author-profile { display:flex;align-items:center;gap:12px; }
.account-button { padding:4px 7px; }
.account-summary,.avatar-setting { margin-bottom:20px; }
.avatar-setting { padding:16px;border:1px solid var(--rule);border-radius:8px; }
.avatar-setting h3,.account-summary h1 { margin:0; }
.category-grid { margin-bottom:40px; }
.category-grid h2 { font-size:21px;margin:0 0 6px; }
.category-grid .card-body button { float:right; }
.card-body .work-meta { font-size:12px;margin:8px 0;color:var(--muted);min-height:0; }
.card-body h3 a { display:block;line-height:1.5;font-size:16px; }
.breadcrumbs { display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--muted); }
.breadcrumbs a { color:var(--accent); }
.detail-heading { padding:30px 0 20px; }
.detail-heading h1 { font-size:clamp(25px,4vw,34px);margin:14px 0 6px; }
.detail-heading p { color:var(--muted);margin:0; }
.detail-columns { display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:22px;margin-bottom:40px;align-items:start; }
.purchase-panel,.work-description,.resource-summary,.author-profile { padding:22px;background:#fff;border:1px solid var(--rule);border-radius:10px; }
.purchase-panel h2,.work-description h2,.resource-summary h2 { margin:0 0 12px;font-size:21px; }
.purchase-panel>p { font-size:14px; }
.purchase-tier { display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--rule);padding:16px;margin:12px 0;border-radius:8px; }
.purchase-tier h3 { margin:0;font-size:18px; }
.purchase-tier p { margin:4px 0 0;font-size:14px;color:var(--muted); }
.purchase-tier strong { color:var(--accent); }
.purchase-tier button { white-space:nowrap; }
.work-description { margin-top:18px; }
.work-description>p,.member-content { white-space:pre-wrap;overflow-wrap:anywhere; }
.detail-cover img { display:block;width:100%;height:auto;border-radius:6px; }
.detail-sidebar { display:grid;gap:16px; }
.resource-summary .wide { display:block;width:100%; }
.resource-summary dl { display:grid;grid-template-columns:80px minmax(0,1fr);gap:12px 8px;border-top:1px solid var(--rule);padding-top:18px;font-size:13px; }
.resource-summary dt { color:var(--muted); }
.resource-summary dd { margin:0;overflow-wrap:anywhere; }
.author-profile img { width:42px;height:42px;border-radius:50%;object-fit:cover; }
.author-profile small { display:block; }
@media(max-width:800px) { .detail-columns { grid-template-columns:1fr; } .detail-sidebar { grid-template-columns:1fr; } }
@media(max-width:500px) { .purchase-tier { flex-wrap:wrap; } .purchase-panel,.work-description,.resource-summary { padding:15px; } .avatar-setting { flex-wrap:wrap; } }

.package-field { border:0;padding:0;margin:24px 0; }
.package-field legend { font-weight:700;margin-bottom:12px; }
.package-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px; }
.package-option { position:relative;display:flex;flex-direction:column;gap:7px;padding:18px;border:1px solid var(--rule);border-radius:10px;cursor:pointer;background:#fff; }
.package-option input { position:absolute;right:12px;top:12px; }
.package-option strong { font-size:25px;color:var(--ink); }
.package-option strong small { font-size:13px; }
.package-name { padding-right:22px;color:var(--muted);font-size:13px; }
.package-option.chosen,.payment-options .chosen { border-color:var(--accent);background:#edf7fc;box-shadow:0 0 0 1px var(--accent); }
.payment-options { display:flex;gap:12px;flex-wrap:wrap; }
.payment-options label { padding:12px 20px;border:1px solid var(--rule);border-radius:8px;cursor:pointer; }
.recharge-total { margin:24px 0;font-size:18px; }
.wechat-checkout { margin:24px 0; padding:20px; border:1px solid #d6e2e9; border-radius:8px; text-align:center; }
.wechat-checkout img { display:block; width:min(100%,256px); height:auto; margin:12px auto; }

.vip-badge { display:inline-flex;align-items:center;padding:3px 9px;border:1px solid #d9bc7b;border-radius:5px;background:#fff6de;color:#79551b;font-size:12px;font-weight:700;line-height:1.4;white-space:nowrap; }
.vip-link { border:0;padding:4px 0;color:#7d581e;background:transparent;font-size:13px; }
.vip-link:hover { color:#59370a;background:transparent;text-decoration:underline; }
.card-body .work-vip { border-top:1px solid var(--rule);padding-top:9px;margin-top:12px; }
.card-body .work-vip .vip-link { color:#7d581e; }
.membership-page { background:linear-gradient(130deg,#fffdf8,#fff); }
.admin-console { border-color:#e2e8ef;box-shadow:0 10px 40px #19364c0a; }
.admin-console aside { padding:28px 14px;background:#fafcfe;gap:4px; }
.admin-console aside h1 { margin-bottom:22px; }
.admin-console aside>button,.admin-category-menu button { padding:12px 14px;font-size:14px; }
.admin-console aside .selected { font-weight:700;border-color:#d8e9f4;background:#eaf4fb;box-shadow:inset 3px 0 #007da8; }
.admin-main { padding:30px; }
.admin-heading { margin-bottom:18px; }
.admin-heading h2 { margin-bottom:8px; }
.admin-heading p { margin:0; }
.admin-main .filters { background:#f8fafc;border:1px solid #e4ebf1;border-radius:10px;padding:16px;gap:12px; }
.admin-main .filters label { display:flex;align-items:center;gap:7px;font-size:13px;color:#4f6578; }
.admin-metrics { gap:14px; }
.admin-metrics div { background:#fff;border-color:#e2e8ef;padding:18px;border-radius:10px; }
.admin-metrics strong { margin-top:8px;font-size:26px; }
.admin-table th { padding:13px;background:#f6f9fc;font-size:13px; }
.admin-table td { padding:14px;font-size:14px; }
.settings-form { display:grid;gap:20px; }
.settings-card { margin:0;padding:22px;border:1px solid #e2e8ef;border-radius:12px;background:#fff;min-width:0; }
.settings-card legend { font-size:16px;font-weight:700;padding:0 8px; }
.settings-fields { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px; }
.settings-fields .span-all { grid-column:1/-1; }
.settings-fields label,.config-row>label:not(:has(input[type=checkbox])) { display:grid;gap:8px;font-size:13px;color:#51697b; }
.settings-fields input,.settings-fields textarea { width:100%;border-color:#dbe5ee;background:#fcfdff; }
.settings-fields textarea { font:inherit;padding:11px;border-radius:7px;color:var(--ink);resize:vertical; }
.settings-actions { display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px; }
.avatar-setting { margin:20px 0 0; }
.avatar-setting h3 { margin:0;font-size:17px; }
.avatar-setting input[type=file] { max-width:100%; }
.config-row { display:grid;grid-template-columns:minmax(130px,1fr) 110px auto auto;gap:16px;align-items:center;padding:17px;border:1px solid #e2e8ef;border-radius:10px;margin:12px 0;background:#fff; }
.config-row input:not([type=checkbox]) { width:100%; }
.password-settings { max-width:540px;grid-template-columns:1fr;background:#fff;border-color:#e2e8ef;padding:24px; }
.password-settings input { min-height:44px; }
@media(max-width:750px) {
.admin-console aside { padding:18px; }
.admin-console aside h1 { margin-bottom:10px; }
.admin-main { padding:18px; }
.settings-fields { grid-template-columns:1fr; }
.config-row { grid-template-columns:minmax(0,1fr) 90px;gap:12px; }
.settings-actions { align-items:start;flex-direction:column; }
}
/* Full-width gallery and resource details */
.wrap { width:calc(100% - 2 * clamp(12px,1.5vw,28px)); }
.purchase-panel { padding:16px 22px; }
.purchase-tier:first-child { margin-top:0; }
.purchase-tier:last-child { margin-bottom:0; }
.tier-description { min-width:0; }
.tier-vip { margin-inline-start:12px; white-space:nowrap; }
.tier-share { display:grid;gap:2px;min-width:0;max-width:55%;color:var(--accent); }
.tier-share span { overflow-wrap:anywhere;font-size:13px; }
.tier-config { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin-top:14px; }
@media(max-width:600px) {
  .purchase-panel { padding:12px; }
  .tier-share { max-width:100%; }
  .tier-config { grid-template-columns:1fr; }
}