:root {
  --ink: #17191c;
  --muted: #6f737a;
  --blue: #087bea;
  --blue-deep: #006fd9;
  --line: #e1e5e8;
  --surface: rgba(255, 255, 255, 0.91);
}

* { box-sizing: border-box; }

html { min-width: 320px; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  background:
    radial-gradient(circle at 14% 4%, rgba(209, 229, 246, .72), transparent 38%),
    radial-gradient(circle at 89% 7%, rgba(241, 229, 243, .62), transparent 36%),
    linear-gradient(110deg, #edf5fb 0%, #f8f9fa 47%, #faf7fb 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}

button, input, textarea { font: inherit; }

.site-header {
  height: 70px;
  padding: 23px 44px 0;
}

.site-nav-wrap { display:flex; max-width:1360px; margin:0 auto; align-items:center; justify-content:space-between; }
.site-nav { display:flex; align-items:center; gap:7px; }
.site-nav a { padding:9px 13px; border-radius:10px; color:#59616a; font-size:14px; font-weight:700; text-decoration:none; }
.site-nav a:hover,.site-nav a.active { color:var(--blue); background:rgba(255,255,255,.62); }
.site-nav .nav-publish { margin-left:7px; padding:10px 17px; color:#fff; background:var(--blue); }
.site-nav .nav-publish:hover { color:#fff; background:var(--blue-deep); }
.nav-toggle { display:none; width:40px; height:40px; border:0; border-radius:10px; color:#26323d; background:rgba(255,255,255,.72); font-size:20px; }

.brand {
  color: #1b1d20;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -.5px;
  text-decoration: none;
}

.hero {
  width: min(1080px, calc(100% - 32px));
  margin: 30px auto 0;
  text-align: center;
}

.eyebrow {
  margin: 0 0 21px;
  color: #676b70;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .25px;
}

.hero h1 {
  margin: 0;
  color: #17191c;
  font-size: clamp(52px, 5vw, 72px);
  font-weight: 900;
  letter-spacing: -4.3px;
  line-height: 1.08;
}

.hero-copy {
  margin: 36px auto 0;
  color: #74777d;
  font-size: 21px;
  line-height: 1.6;
}

.metrics {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 25px;
}

.metric {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 55px;
  padding: 0 21px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 30px;
  background: rgba(255,255,255,.77);
  box-shadow: 0 10px 26px rgba(61, 78, 94, .06);
  color: #777b80;
  font-size: 17px;
}

.metric strong {
  color: #176bd5;
  font-size: 22px;
  font-weight: 800;
}

.publish-card {
  width: min(1062px, calc(100% - 32px));
  margin: 48px auto 33px;
  padding: 28px 27px 29px;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 21px;
  background: var(--surface);
  box-shadow: 0 15px 46px rgba(45, 60, 73, .08);
  backdrop-filter: blur(14px);
}

.publish-card h2 {
  margin: 0 0 16px;
  font-size: 23px;
  font-weight: 800;
  letter-spacing: -.65px;
}

.notice {
  margin: 0 0 19px;
  padding: 15px 16px;
  border: 1px solid #cbdff0;
  border-radius: 13px;
  background: #edf7ff;
  color: #71808d;
  font-size: 16px;
  line-height: 1.65;
}

.field-block { margin-top: 18px; }
.compact-block { margin-top: 18px; }

.field-label {
  display: block;
  margin: 0 0 13px;
  color: #565b61;
  font-size: 17px;
  font-weight: 700;
}

.dropzone {
  display: flex;
  min-height: 150px;
  padding: 22px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px dashed #b7d3e7;
  border-radius: 16px;
  background: #eef8ff;
  outline: none;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.dropzone:hover, .dropzone:focus-visible, .dropzone.dragover {
  border-color: #4b9ee9;
  background: #e7f4ff;
}

.dropzone.dragover { transform: scale(.997); }

.drop-title {
  font-size: 19px;
  font-weight: 800;
}

.drop-help {
  margin-top: 10px;
  color: #737d85;
  font-size: 14px;
}

.file-status {
  margin-top: 7px;
  color: #087bea;
  font-size: 17px;
  font-weight: 800;
}

.field-heading {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
}

.field-heading .field-label { margin: 0; }

.segmented {
  display: flex;
  padding: 3px;
  border-radius: 25px;
  background: #f2f3f3;
}

.segment {
  min-width: 63px;
  height: 37px;
  padding: 0 14px;
  border: 0;
  border-radius: 21px;
  color: #73777c;
  background: transparent;
  cursor: pointer;
  font-weight: 600;
}

.segment.active {
  color: #222529;
  background: #fff;
  box-shadow: 0 2px 8px rgba(35, 47, 58, .12);
}

#html-code, #preview-frame {
  display: block;
  width: 100%;
  height: 355px;
  margin-top: 9px;
  padding: 16px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 15px;
  outline: none;
  background: rgba(255,255,255,.65);
  color: #33383d;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 14px;
  line-height: 1.6;
  transition: border-color .18s ease, box-shadow .18s ease;
}

#html-code:focus { border-color: #9fc9ef; box-shadow: 0 0 0 3px rgba(8,123,234,.08); }
#preview-frame { padding: 0; background: white; }
#preview-frame[hidden], #html-code[hidden] { display: none; }

.text-input {
  width: 100%;
  height: 54px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  outline: none;
  background: rgba(255,255,255,.58);
  color: #30343a;
  font-size: 16px;
  font-weight: 600;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.text-input::placeholder { color: #73777c; opacity: 1; }
.text-input:focus { border-color: #92c5ef; box-shadow: 0 0 0 3px rgba(8,123,234,.08); }

.key-row { display: grid; grid-template-columns: minmax(0, 1fr) 202px; gap: 12px; }

.buy-button {
  display: flex;
  height: 54px;
  align-items: center;
  justify-content: center;
  border: 1px solid #c9dce9;
  border-radius: 14px;
  color: #0876d6;
  background: rgba(255,255,255,.48);
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  transition: background .18s ease;
}

.buy-button:hover { background: #edf7ff; }

.pricing {
  margin: 11px 0 0;
  color: #797d82;
  font-size: 15px;
}

.pricing strong { color: #0074dc; }

.agreement {
  display: flex;
  gap: 12px;
  margin-top: 18px;
  padding: 15px 17px;
  align-items: flex-start;
  border: 1px solid #f0d7ae;
  border-radius: 14px;
  background: #fff4e2;
  color: #3c3f43;
  font-size: 15px;
  line-height: 1.45;
  cursor: pointer;
}

.agreement input { width: 16px; height: 16px; margin: 3px 0 0; flex: 0 0 auto; accent-color: var(--blue); }

.public-option { display:flex; gap:12px; margin-top:18px; padding:15px 17px; align-items:flex-start; border:1px solid #cfe3f3; border-radius:14px; background:#eff8ff; cursor:pointer; }
.public-option input { width:18px; height:18px; margin:3px 0 0; flex:0 0 auto; accent-color:var(--blue); }
.public-option span { display:grid; gap:4px; color:#333b43; }
.public-option strong { font-size:15px; }
.public-option small { color:#74808b; font-size:13px; line-height:1.5; }

.submit-button {
  width: 100%;
  height: 58px;
  margin-top: 18px;
  border: 0;
  border-radius: 12px;
  color: white;
  background: #087be8;
  box-shadow: 0 8px 18px rgba(8, 123, 232, .18);
  cursor: pointer;
  font-size: 18px;
  font-weight: 800;
  transition: transform .18s ease, background .18s ease;
}

.submit-button:hover { background: #006fd7; transform: translateY(-1px); }
.submit-button:disabled { cursor: wait; opacity: .72; transform: none; }

.input-message, .form-message { min-height: 0; margin: 6px 2px 0; color: #d74444; font-size: 13px; }
.input-message:empty, .form-message:empty { display: none; }
.input-message.success, .form-message.success { color: #15945d; }

body.modal-open { overflow: hidden; }

.success-modal {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  transition: opacity .18s ease;
}

.success-modal[hidden] { display: none; }
.success-modal.visible { opacity: 1; }

.success-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 25, 38, .48);
  backdrop-filter: blur(5px);
}

.success-dialog {
  position: relative;
  width: min(600px, 100%);
  padding: 38px 38px 32px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(23, 38, 55, .25);
  text-align: center;
  transform: translateY(14px) scale(.98);
  transition: transform .18s ease;
}

.success-modal.visible .success-dialog { transform: translateY(0) scale(1); }

.success-dialog__close {
  position: absolute;
  top: 15px;
  right: 17px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #7b838c;
  background: #f3f5f7;
  cursor: pointer;
  font-size: 26px;
  line-height: 34px;
}

.success-dialog__icon {
  display: grid;
  width: 66px;
  height: 66px;
  margin: 0 auto 16px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg, #20c77a, #0ca861);
  box-shadow: 0 10px 25px rgba(15, 178, 103, .26);
}

.success-dialog__icon svg { width: 37px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.4; }
.success-dialog h2 { margin: 0; font-size: 29px; letter-spacing: -.6px; }
.success-dialog__copy { margin: 9px 0 24px; color: #737a82; font-size: 15px; }

.success-dialog__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 146px;
  gap: 18px;
  align-items: stretch;
  text-align: left;
}

.success-url-panel, .success-qr-panel { padding: 17px; border: 1px solid #e2e8ee; border-radius: 16px; background: #f8fafc; }
.success-url-panel > span { display: block; margin-bottom: 10px; color: #555d66; font-size: 14px; font-weight: 700; }
.success-url-row { display: flex; gap: 8px; }
.success-url-row input { min-width: 0; height: 46px; flex: 1; padding: 0 12px; border: 1px solid #dbe3ea; border-radius: 10px; outline: none; background: #fff; color: #27313a; font-size: 14px; }
.success-url-row button { height: 46px; padding: 0 15px; flex: 0 0 auto; border: 0; border-radius: 10px; color: #fff; background: var(--blue); cursor: pointer; font-weight: 700; }
#copy-feedback { min-height: 18px; margin: 7px 0 0; color: #15945d; font-size: 12px; }
.success-qr-panel { display: flex; padding: 12px; flex-direction: column; align-items: center; justify-content: center; }
.success-qr-frame { width: 108px; height: 108px; padding: 5px; border-radius: 9px; background: #fff; }
.success-qr-frame img { display: block; width: 100%; height: 100%; }
.success-qr-panel > span { margin-top: 7px; color: #67717a; font-size: 12px; }
.success-open-button { display: flex; width: 100%; height: 52px; margin-top: 20px; align-items: center; justify-content: center; border-radius: 12px; color: #fff; background: var(--blue); box-shadow: 0 8px 18px rgba(8,123,232,.18); font-size: 16px; font-weight: 800; text-decoration: none; }
.success-open-button:hover { background: var(--blue-deep); }

.front-main { width:min(1152px,calc(100% - 32px)); margin:30px auto 60px; }
.gallery-hero { position:relative; display:flex; min-height:220px; padding:30px; overflow:hidden; align-items:flex-start; justify-content:space-between; border:1px solid #c7dfee; border-radius:20px; background:linear-gradient(120deg,#e7f4ff 0%,#effaf5 100%); }
.gallery-hero::after { content:""; position:absolute; width:260px; height:260px; top:-125px; right:-65px; border-radius:50%; background:rgba(189,226,232,.35); }
.gallery-hero>div,.gallery-submit { position:relative; z-index:1; }
.gallery-kicker,.page-heading>p { margin:0 0 16px; color:#0874db; font-size:12px; font-weight:900; letter-spacing:.3px; }
.gallery-hero h1 { margin:0; font-size:39px; letter-spacing:-1.5px; }
.gallery-hero div>p:not(.gallery-kicker) { margin:12px 0 18px; color:#4f5963; }
.gallery-count { display:inline-flex; padding:7px 13px; border:1px solid #d7e3eb; border-radius:20px; background:rgba(255,255,255,.72); font-size:14px; }
.gallery-submit { padding:10px 18px; border:1px solid var(--blue); border-radius:22px; color:var(--blue); text-decoration:none; font-weight:800; }
.gallery-filter { display:flex; min-height:66px; margin:24px 0; padding:14px; align-items:center; gap:10px; border:1px solid #e0e4e8; border-radius:18px; background:#fff; }
.gallery-search { display:flex; width:300px; height:40px; padding:0 13px; align-items:center; gap:8px; border:1px solid #dce2e7; border-radius:22px; }
.gallery-search span { color:#7d8790; font-size:20px; }.gallery-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; }
.sort-tabs { display:flex; padding:3px; border-radius:22px; background:#f1f3f5; }.sort-tabs a { padding:8px 16px; border-radius:19px; color:#68717a; text-decoration:none; font-size:14px; }.sort-tabs a.active { color:#fff; background:var(--blue); }
.gallery-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.work-card { min-width:0; overflow:hidden; border:1px solid #dfe3e7; border-radius:15px; background:#fff; box-shadow:0 4px 18px rgba(44,62,80,.04); transition:transform .18s ease,box-shadow .18s ease; }
.work-card:hover { transform:translateY(-3px); box-shadow:0 12px 28px rgba(44,62,80,.11); }
.work-cover { display:block; aspect-ratio:16/9; overflow:hidden; background:#eef5fa; }.work-cover img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }.work-card:hover .work-cover img { transform:scale(1.025); }
.work-body { display:flex; min-height:118px; padding:15px; flex-direction:column; }.work-body h2 { min-height:44px; margin:0; font-size:16px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }.work-body h2 a { color:#20262c; text-decoration:none; }
.work-meta { display:flex; margin-top:auto; padding-top:15px; align-items:center; justify-content:space-between; color:#818991; font-size:13px; }.work-meta a { padding:7px 10px; border-radius:8px; color:var(--blue); text-decoration:none; font-weight:700; }.work-meta a:hover { background:#edf7ff; }
.gallery-empty { grid-column:1/-1; padding:60px 20px; border:1px dashed #cad8e3; border-radius:18px; background:rgba(255,255,255,.58); text-align:center; color:#78818a; }.gallery-empty strong { display:block; color:#313941; font-size:19px; }.gallery-empty a { display:inline-block; margin-top:12px; color:var(--blue); }
.pagination { display:flex; margin-top:25px; align-items:center; justify-content:space-between; gap:15px; color:#747d86; font-size:13px; }.pagination>div { display:flex; gap:5px; align-items:center; }.pagination a,.pagination strong,.pagination .disabled { display:inline-flex; min-width:34px; height:34px; padding:0 10px; align-items:center; justify-content:center; border:1px solid #dce2e7; border-radius:9px; background:#fff; text-decoration:none; }.pagination strong { color:#fff; border-color:var(--blue); background:var(--blue); }.pagination .disabled { opacity:.45; }
.home-gallery { width:min(1062px,calc(100% - 32px)); margin:62px auto 55px; }.home-gallery-heading { margin-bottom:28px; text-align:center; }.home-gallery-heading h2 { margin:0; font-size:32px; letter-spacing:-1.2px; }.home-gallery-heading p { margin:9px 0 0; color:var(--muted); }.browse-gallery { display:table; margin:25px auto 0; padding:10px 15px; border-radius:10px; color:var(--blue); text-decoration:none; font-weight:700; }.browse-gallery:hover { background:#eaf5ff; }
.query-shell,.my-sites-shell,.edit-site-shell { max-width:1062px; margin:25px auto 70px; }.page-heading { margin:30px auto; text-align:center; }.page-heading.left { text-align:left; }.page-heading h1 { margin:0; font-size:38px; letter-spacing:-1.5px; }.page-heading span,.page-heading>a { display:block; margin-top:10px; color:#747d85; text-decoration:none; }
.query-form,.edit-panel { max-width:720px; margin:0 auto; padding:28px; border:1px solid rgba(255,255,255,.8); border-radius:21px; background:var(--surface); box-shadow:0 15px 46px rgba(45,60,73,.08); }.query-form label,.change-note { display:grid; gap:8px; color:#525b64; font-weight:700; }.query-form input,.change-note input { width:100%; height:54px; padding:0 15px; border:1px solid var(--line); border-radius:13px; outline:0; }.query-form button,.primary-link,.update-actions button { display:flex; width:100%; height:52px; margin-top:18px; align-items:center; justify-content:center; border:0; border-radius:12px; color:#fff; background:var(--blue); text-decoration:none; font-weight:800; cursor:pointer; }.query-form p,#update-message { color:#d74444; font-size:14px; }
.query-form [hidden] { display:none !important; }.captcha-heading { display:flex; margin-top:14px; align-items:center; justify-content:space-between; }.query-form .captcha-heading button { width:auto; height:auto; margin:0; padding:5px 9px; color:var(--blue); background:#eef7ff; font-size:12px; }.captcha-row { display:grid; grid-template-columns:160px 1fr; gap:10px; align-items:center; }.captcha-row img { display:block; width:160px; height:52px; border:1px solid #d6e4ee; border-radius:10px; background:#f1f7fb; }.captcha-row input { min-width:0; text-transform:uppercase; letter-spacing:2px; }
.card-summary { margin-top:20px; padding:25px; border:1px solid #dfe5ea; border-radius:18px; background:#fff; }.card-summary h2 { margin-top:0; }.card-summary dl,.managed-card dl { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }.card-summary dl div,.managed-card dl div { padding:10px; border-radius:10px; background:#f6f8fa; }.card-summary dt,.managed-card dt { color:#7b848d; font-size:12px; }.card-summary dd,.managed-card dd { margin:5px 0 0; font-weight:800; }
.management-actions { display:flex; margin:-20px 0 18px; justify-content:flex-end; gap:8px; }.management-actions a,.management-actions button { padding:9px 13px; border:1px solid #d8e1e8; border-radius:9px; color:#4f5c67; background:#fff; text-decoration:none; cursor:pointer; }
.managed-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }.managed-card { display:grid; grid-template-columns:220px 1fr; overflow:hidden; border:1px solid #dfe4e8; border-radius:17px; background:#fff; }.managed-card>img { width:100%; height:100%; min-height:240px; object-fit:cover; }.managed-card>div { padding:19px; min-width:0; }.managed-card h2 { margin:0 0 7px; }.managed-card p { overflow:hidden; color:#78818a; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.managed-card dl { grid-template-columns:repeat(2,1fr); }.managed-buttons { display:flex; flex-wrap:wrap; gap:7px; }.managed-buttons a,.managed-buttons button { padding:8px 10px; border:1px solid #d7e2ea; border-radius:8px; color:var(--blue); background:#fff; text-decoration:none; cursor:pointer; }
.edit-panel { max-width:none; }.edit-panel>#update-file { width:100%; margin-bottom:20px; }.edit-panel #update-html,.edit-panel #update-preview-frame { width:100%; height:430px; padding:15px; border:1px solid var(--line); border-radius:14px; font-family:ui-monospace,monospace; }.edit-panel #update-preview-frame { padding:0; background:#fff; }.change-note { margin-top:18px; }.agreement.compact { padding:12px 14px; }.update-actions { display:flex; gap:10px; }.update-actions button:disabled { opacity:.45; cursor:not-allowed; }

@media (max-width: 760px) {
  .site-header { height: 60px; padding: 20px 18px 0; }
  .brand { font-size: 17px; }
  .hero { margin-top: 19px; }
  .eyebrow { margin-bottom: 16px; font-size: 14px; }
  .hero h1 { font-size: clamp(37px, 10.7vw, 50px); letter-spacing: -2.5px; }
  .hero-copy { max-width: 560px; margin-top: 19px; font-size: 16px; line-height: 1.65; }
  .metrics { gap: 8px; margin-top: 20px; }
  .metric { min-height: 46px; padding: 0 15px; font-size: 14px; }
  .metric strong { font-size: 18px; }
  .publish-card { width: calc(100% - 24px); margin-top: 29px; padding: 22px 16px 20px; border-radius: 18px; }
  .publish-card h2 { font-size: 21px; }
  .notice { padding: 13px; font-size: 14px; }
  .field-label { font-size: 15px; }
  .dropzone { min-height: 130px; padding: 18px 10px; text-align: center; }
  .drop-title { font-size: 17px; }
  .drop-help { max-width: 280px; line-height: 1.5; }
  .field-heading { align-items: flex-end; }
  .segment { min-width: 55px; height: 34px; padding: 0 11px; }
  #html-code, #preview-frame { height: 300px; }
  .key-row { grid-template-columns: 1fr; gap: 10px; }
  .buy-button { width: 100%; }
  .agreement { padding: 13px; font-size: 14px; }
  .success-modal { padding: 14px; }
  .success-dialog { padding: 32px 18px 22px; border-radius: 20px; }
  .success-dialog__content { grid-template-columns: 1fr; }
  .success-qr-panel { padding: 14px; }
  .success-url-row { flex-direction: column; }
  .success-url-row button { width: 100%; }
  .site-header { position:relative; z-index:50; }.nav-toggle { display:block; }.site-nav { position:absolute; display:none; top:53px; left:12px; right:12px; padding:10px; flex-direction:column; align-items:stretch; border:1px solid #e2e7eb; border-radius:14px; background:rgba(255,255,255,.97); box-shadow:0 12px 30px rgba(42,55,66,.13); }.site-nav.open { display:flex; }.site-nav .nav-publish { margin-left:0; text-align:center; }
  .front-main { width:calc(100% - 24px); margin-top:20px; }.gallery-hero { min-height:250px; padding:23px; }.gallery-submit { position:absolute; right:20px; top:20px; }.gallery-filter { align-items:stretch; flex-direction:column; }.gallery-search { width:100%; }.gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.home-gallery { width:calc(100% - 24px); }.home-gallery-heading h2 { font-size:27px; }.pagination { align-items:flex-start; flex-direction:column; }.managed-grid { grid-template-columns:1fr; }.managed-card { grid-template-columns:1fr; }.managed-card>img { aspect-ratio:16/9; min-height:0; }.card-summary dl { grid-template-columns:repeat(2,1fr); }.query-form,.edit-panel { padding:20px 16px; }.update-actions { flex-direction:column; }.captcha-row { grid-template-columns:1fr; }.captcha-row img { width:100%; height:auto; max-height:72px; }
}

@media (max-width: 430px) {
  .hero h1 { font-size: 38px; }
  .hero-copy br { display: none; }
  .metrics { gap: 7px; }
  .metric { padding: 0 12px; }
  .publish-card { margin-bottom: 12px; }
  .notice { line-height: 1.55; }
  .gallery-grid { grid-template-columns:1fr; }.gallery-hero h1,.page-heading h1 { font-size:32px; }.work-body { min-height:105px; }.card-summary dl { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}