:root {
  --mgc-sky: #73c9ee;
  --mgc-sky-soft: #eef9ff;
  --mgc-violet: #9383e4;
  --mgc-violet-soft: #f3f0ff;
  --mgc-ink: #17233b;
  --mgc-muted: #66758b;
  --mgc-line: #dce7f2;
}

.mgc-manage-hero,
.mgc-editor-hero {
  display: grid;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
  padding: clamp(1.4rem, 4vw, 2.6rem);
  overflow: hidden;
  border: 1px solid #dbe9f6;
  border-radius: 1.5rem;
  background: radial-gradient(circle at 92% 0, rgba(147, 131, 228, .24), transparent 32%), radial-gradient(circle at 0 100%, rgba(115, 201, 238, .22), transparent 34%), linear-gradient(135deg, #fff, #f4faff 52%, #f6f3ff);
  box-shadow: 0 24px 60px rgba(65, 85, 126, .1);
}

.mgc-manage-hero h1,
.mgc-editor-hero h1 {
  margin: .65rem 0;
  color: var(--mgc-ink);
  font-size: clamp(2rem, 6vw, 4rem);
  font-weight: 950;
  line-height: 1.08;
  letter-spacing: -.045em !important;
}

.mgc-manage-hero h1 em { color: #7060c6; font-style: normal; }
.mgc-manage-hero p,
.mgc-editor-hero p { max-width: 47rem; margin: 0; color: var(--mgc-muted); font-size: .9rem; font-weight: 650; line-height: 1.8; }
.mgc-guild-context { display: grid; align-self: end; gap: .25rem; min-width: min(100%, 19rem); padding: 1rem; border: 1px solid rgba(130, 119, 205, .18); border-radius: 1rem; background: rgba(255, 255, 255, .78); }
.mgc-guild-context small,
.mgc-guild-context span { color: var(--mgc-muted); font-size: .7rem; font-weight: 750; }
.mgc-guild-context strong { color: #5747ac; font-size: 1rem; font-weight: 950; }
.mgc-editor-actions { display: flex; flex-wrap: wrap; align-self: end; gap: .5rem; }

.mgc-manage-section { margin-top: 1.25rem; padding: 1rem; border: 1px solid var(--mgc-line); border-radius: 1.25rem; background: rgba(255, 255, 255, .97); box-shadow: 0 16px 42px rgba(42, 65, 99, .07); }
.mgc-manage-section > header { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.mgc-manage-section > header span { color: #6f5fc4; font-size: .68rem; font-weight: 950; letter-spacing: .12em; }
.mgc-manage-section h2 { margin: .25rem 0 0; color: var(--mgc-ink); font-size: 1.35rem; font-weight: 950; }
.mgc-content-list { display: grid; gap: .65rem; margin-top: 1rem; }
.mgc-content-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .75rem; align-items: center; padding: .85rem; border: 1px solid #e0e9f2; border-radius: 1rem; background: #fff; }
.mgc-content-icon { display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border-radius: .85rem; color: #6554bc; background: linear-gradient(135deg, var(--mgc-sky-soft), var(--mgc-violet-soft)); }
.mgc-content-row h3 { margin: .15rem 0; overflow: hidden; color: var(--mgc-ink); font-size: .9rem; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.mgc-content-row small,
.mgc-content-row p { margin: 0; color: var(--mgc-muted); font-size: .65rem; font-weight: 700; }
.mgc-status-stack,
.mgc-row-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .4rem; }
.mgc-row-actions .maple-btn { flex: 1; }
.mgc-review-note { grid-column: 1 / -1; display: grid; gap: .25rem; margin: 0 !important; padding: .75rem; border-radius: .8rem; color: #8f3d4d !important; background: #fff1f3; font-size: .7rem !important; line-height: 1.55; }
.mgc-review-note strong { font-weight: 950; }
.mgc-status { display: inline-flex; align-items: center; width: max-content; border-radius: 999px; padding: .35rem .55rem; color: #526176; background: #f1f5f9; font-size: .62rem; font-weight: 900; }
.mgc-status.is-published,
.mgc-status.is-approved { color: #13704d; background: #e8f8ef; }
.mgc-status.is-pending { color: #72570b; background: #fff5d6; }
.mgc-status.is-rejected,
.mgc-status.is-hidden { color: #9f3d4e; background: #ffedf0; }
.mgc-empty { padding: 2.5rem 1rem; border: 1px dashed #d4e0eb; border-radius: 1rem; color: var(--mgc-muted); background: #fbfdff; text-align: center; font-size: .8rem; font-weight: 750; }

.mgc-editor-hero { align-items: end; }
.mgc-editor-layout { display: grid; gap: 1rem; margin-top: 1rem; }
.mgc-editor-fields { display: grid; align-content: start; gap: 1rem; }
.mgc-editor-panel,
.mgc-preview-panel { padding: 1rem; border: 1px solid var(--mgc-line); border-radius: 1.2rem; background: #fff; box-shadow: 0 14px 36px rgba(38, 60, 92, .07); }
.mgc-editor-panel > header,
.mgc-preview-panel header { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem; }
.mgc-editor-panel > header > span { display: grid; width: 2.7rem; height: 2.7rem; place-items: center; border-radius: .8rem; color: #fff; background: linear-gradient(135deg, var(--mgc-sky), var(--mgc-violet)); }
.mgc-editor-panel header small,
.mgc-preview-panel header span { color: #6e5dc1; font-size: .65rem; font-weight: 950; letter-spacing: .12em; }
.mgc-editor-panel h2,
.mgc-preview-panel h2 { margin: .15rem 0 0; color: var(--mgc-ink); font-size: 1.2rem; font-weight: 950; }
.mgc-field { display: grid; gap: .45rem; margin-top: 1rem; }
.mgc-field > span { display: flex; justify-content: space-between; gap: .5rem; color: #34435a; font-size: .78rem; font-weight: 900; }
.mgc-field b { color: #6e5bc2; }
.mgc-field em { margin-left: auto; color: #8794a7; font-style: normal; font-size: .68rem; }
.mgc-field input,
.mgc-field textarea { width: 100%; border: 1px solid #cfdeeb; border-radius: .85rem; padding: .85rem 1rem; outline: none; color: var(--mgc-ink); background: #fff; font-size: .85rem; }
.mgc-field textarea { min-height: 19rem; resize: vertical; line-height: 1.8; }
.mgc-field input:focus,
.mgc-field textarea:focus { border-color: #8d82df; box-shadow: 0 0 0 4px rgba(141, 130, 223, .14); }
.mgc-help { margin: 0 0 .8rem; color: var(--mgc-muted); font-size: .72rem; font-weight: 650; line-height: 1.65; }
.mgc-upload { position: relative; display: flex; align-items: center; gap: .8rem; min-height: 4.4rem; padding: .9rem; border: 1px dashed #a9bad0; border-radius: 1rem; background: #f8fbff; cursor: pointer; }
.mgc-upload:focus-within { border-color: #8d82df; box-shadow: 0 0 0 4px rgba(141, 130, 223, .14); }
.mgc-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.mgc-upload > span { display: grid; flex: 0 0 auto; width: 2.8rem; height: 2.8rem; place-items: center; border-radius: .8rem; color: #6655bc; background: var(--mgc-violet-soft); }
.mgc-upload strong,
.mgc-upload small { display: block; }
.mgc-upload strong { color: var(--mgc-ink); font-size: .78rem; font-weight: 950; }
.mgc-upload small { margin-top: .2rem; color: var(--mgc-muted); font-size: .65rem; }
.mgc-image-feedback { min-height: 1.25rem; margin: .5rem 0 0; color: #53647c; font-size: .68rem; font-weight: 750; }
.mgc-image-feedback.is-warning { color: #a05d16; }
.mgc-image-feedback.is-error { color: #ae3c51; }
.mgc-remove-image,
.mgc-consent { display: flex; align-items: flex-start; gap: .6rem; margin-top: .75rem; padding: .85rem; border-radius: .85rem; color: #4c5c73; background: #f7f5ff; font-size: .72rem; font-weight: 750; line-height: 1.55; }
.mgc-remove-image input,
.mgc-consent input { width: 1rem; height: 1rem; margin-top: .15rem; accent-color: #7564ce; }
.mgc-consent { margin: 0; border: 1px solid #e1dcf7; background: #faf9ff; }
.mgc-preview-sticky { display: grid; gap: .85rem; }
.mgc-poster-frame,
.mgc-public-poster,
.mg-card-image,
.mp-image { position: relative; display: grid; place-items: center; overflow: hidden; aspect-ratio: 3 / 4; border: 1px solid #dce7f2; border-radius: 1rem; background: radial-gradient(circle at 20% 10%, rgba(255, 255, 255, .94), transparent 28%), linear-gradient(145deg, #e8f7ff, #f0ecff); }
.mgc-poster-frame img,
.mgc-public-poster img,
.mg-card-image img,
.mp-image img { display: block; width: 100%; height: 100%; object-fit: contain !important; }
.mgc-poster-frame > [data-image-placeholder] { display: grid; justify-items: center; gap: .5rem; color: #7d70c7; }
.mgc-poster-frame > [data-image-placeholder] small { color: var(--mgc-muted); font-size: .7rem; font-weight: 800; }
.mgc-copy-preview { padding: .9rem; border-radius: .9rem; background: #f8fbff; }
.mgc-copy-preview small { color: #6f5fc3; font-size: .65rem; font-weight: 900; }
.mgc-copy-preview h3 { margin: .35rem 0; color: var(--mgc-ink); font-size: 1.05rem; font-weight: 950; }
.mgc-copy-preview p { display: -webkit-box; overflow: hidden; margin: 0; color: var(--mgc-muted); font-size: .72rem; line-height: 1.65; -webkit-line-clamp: 5; -webkit-box-orient: vertical; }
.mgc-change-summary { padding: .85rem; border: 1px solid #e1dcf7; border-radius: .85rem; background: #faf9ff; }
.mgc-change-summary strong { color: #5f4fb1; font-size: .72rem; font-weight: 950; }
.mgc-change-summary p { margin: .3rem 0 0; color: var(--mgc-muted); font-size: .68rem; line-height: 1.55; }
.mgc-save-bar { position: sticky; z-index: 20; right: 0; bottom: calc(4.5rem + env(safe-area-inset-bottom)); left: 0; display: grid; grid-template-columns: .7fr 1.3fr; gap: .55rem; padding: .7rem; border: 1px solid rgba(207, 220, 235, .92); border-radius: 1rem; background: rgba(255, 255, 255, .94); box-shadow: 0 18px 48px rgba(28, 43, 70, .18); backdrop-filter: blur(16px); }
.mgc-save-bar .maple-btn { width: 100%; }

.mgc-public-shell { display: grid; gap: 1rem; }
.mgc-public-hero { display: grid; gap: 1rem; padding: 1rem; border: 1px solid var(--mgc-line); border-radius: 1.4rem; background: radial-gradient(circle at 100% 0, rgba(147, 131, 228, .19), transparent 34%), linear-gradient(145deg, #fff, #f5fbff 58%, #f7f4ff); box-shadow: 0 22px 60px rgba(49, 73, 108, .1); }
.mgc-public-poster { width: min(100%, 30rem); margin: 0 auto; box-shadow: 0 22px 50px rgba(60, 75, 117, .15); }
.mgc-public-poster > span { display: grid; justify-items: center; gap: .55rem; color: #7465c5; }
.mgc-public-poster > span small { color: var(--mgc-muted); font-size: .7rem; font-weight: 800; }
.mgc-public-copy { display: grid; align-content: center; gap: .9rem; min-width: 0; padding: .4rem; }
.mgc-public-badges { display: flex; flex-wrap: wrap; gap: .4rem; }
.mgc-public-badges a,
.mgc-public-badges span { display: inline-flex; align-items: center; gap: .3rem; width: max-content; border-radius: 999px; padding: .4rem .65rem; color: #5f4fb1; background: var(--mgc-violet-soft); font-size: .65rem; font-weight: 900; text-decoration: none; }
.mgc-public-badges a:first-child { color: #2479a8; background: var(--mgc-sky-soft); }
.mgc-public-copy h1 { margin: 0; overflow-wrap: anywhere; color: var(--mgc-ink); font-size: clamp(2.2rem, 7vw, 4.8rem); font-weight: 950; line-height: 1.02; letter-spacing: -.05em !important; }
.mgc-public-copy > p { margin: 0; color: #53647a; font-size: clamp(.9rem, 2vw, 1.08rem); font-weight: 700; line-height: 1.75; }
.mgc-meta { display: flex; flex-wrap: wrap; gap: .55rem; color: #7b899c; font-size: .68rem; font-weight: 750; }
.mgc-public-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.mgc-public-body-grid { display: grid; gap: 1rem; }
.mgc-story-card,
.mgc-side-card { padding: clamp(1.1rem, 3vw, 1.7rem); border: 1px solid var(--mgc-line); border-radius: 1.15rem; background: #fff; box-shadow: 0 12px 34px rgba(48, 67, 96, .06); }
.mgc-story-card > span,
.mgc-side-card > span { color: #705fc3; font-size: .66rem; font-weight: 950; letter-spacing: .12em; }
.mgc-story-card h2,
.mgc-side-card h2 { margin: .35rem 0 1rem; color: var(--mgc-ink); font-size: 1.35rem; font-weight: 950; }
.mgc-story-card .prose { color: #3f5068; font-size: .9rem; line-height: 1.95; overflow-wrap: anywhere; }
.mgc-side-card { align-self: start; background: linear-gradient(145deg, #f4fbff, #f7f4ff); }
.mgc-side-card p { color: var(--mgc-muted); font-size: .75rem; line-height: 1.7; }
.mgc-side-card .maple-btn { width: 100%; margin-top: .5rem; }

@media (min-width: 720px) {
  .mgc-manage-hero,
  .mgc-editor-hero { grid-template-columns: minmax(0, 1fr) auto; }
  .mgc-content-row { grid-template-columns: auto minmax(0, 1fr) auto auto; }
  .mgc-status-stack,
  .mgc-row-actions { grid-column: auto; }
  .mgc-row-actions .maple-btn { flex: 0 0 auto; }
  .mgc-public-hero { grid-template-columns: minmax(17rem, 25rem) minmax(0, 1fr); padding: 1.4rem; }
}

@media (min-width: 980px) {
  .mgc-editor-layout { grid-template-columns: minmax(0, 1.2fr) minmax(19rem, .72fr); align-items: start; }
  .mgc-preview-sticky { position: sticky; top: 1rem; }
  .mgc-save-bar { grid-column: 1 / -1; bottom: 1rem; justify-self: end; width: min(100%, 31rem); }
  .mgc-public-hero { grid-template-columns: minmax(20rem, 28rem) minmax(0, 1fr); padding: 1.7rem; }
  .mgc-public-body-grid { grid-template-columns: minmax(0, 1fr) 19rem; }
}

@media (max-width: 719px) {
  .maple-main { padding-bottom: 6.5rem; }
  .mgc-public-shell { margin-inline: -.1rem; }
  .mgc-public-actions .maple-btn { flex: 1 1 9rem; }
  .mgc-manage-section > header { align-items: start; }
}

@media (prefers-reduced-motion: reduce) {
  .mgc-poster-frame img,
  .mgc-content-row,
  .mgc-save-bar { transition: none !important; scroll-behavior: auto !important; }
}