:root { color-scheme: light; font-family: "Noto Sans TC", system-ui, sans-serif; color: #33271f; background: #fff8f1; }
* { box-sizing: border-box; }
body { margin: 0; }
.publisher-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px max(24px, calc((100vw - 1180px) / 2)); border-bottom: 1px solid #f0dccb; background: #fff; }
.publisher-brand { font-size: 25px; font-weight: 800; color: #e85c13; text-decoration: none; }
.publisher-brand span { font-size: 13px; color: #746456; margin-left: 8px; }
.publisher-topbar nav { display: flex; gap: 18px; align-items: center; }
.publisher-topbar a:not(.publisher-brand) { color: #9d3b0b; }
.publisher-shell { max-width: 1180px; padding: 28px 24px 64px; margin: auto; }
.publisher-intro { padding: 20px 0 26px; }
.publisher-intro h1 { font-size: clamp(28px, 4vw, 44px); letter-spacing: -0.04em; margin: 12px 0; }
.publisher-eyebrow { color: #a34313; font-size: 13px; font-weight: 700; letter-spacing: 0.12em; }
.publisher-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px; align-items: start; }
.publisher-panel { background: #fff; border: 1px solid #efd9c6; border-radius: 16px; padding: 24px; margin-bottom: 24px; box-shadow: 0 8px 28px #6f381008; }
.publisher-panel h2 { margin-top: 0; font-size: 20px; }
.publisher-login { max-width: 480px; }
.publisher-shell form { display: grid; gap: 14px; }
.publisher-shell label { display: grid; gap: 7px; font-size: 14px; font-weight: 600; }
.publisher-shell input, .publisher-shell select, .publisher-shell textarea { width: 100%; padding: 11px 12px; border: 1px solid #b7a393; border-radius: 8px; background: #fff; color: inherit; font: inherit; }
.publisher-shell textarea { resize: vertical; }
#publisher-app button { border: 1px solid #a6410c; border-radius: 8px; background: #c64b0c; color: #fff; padding: 10px 16px; cursor: pointer; font: inherit; font-weight: 600; }
#publisher-app .publisher-secondary { color: #963906; background: #fff8f1; border-color: #d4a789; }
#publisher-app button:disabled { cursor: default; opacity: 0.5; }
#publisher-app :focus-visible { outline: 3px solid #285bb5; outline-offset: 3px; }
.publisher-muted { color: #736050; font-size: 13px; line-height: 1.65; }
.publisher-notice:not(:empty), .publisher-error:not([hidden]) { border-radius: 10px; padding: 14px; margin-bottom: 20px; overflow-wrap: anywhere; }
.publisher-notice:not(:empty) { color: #355525; background: #edf6e7; }
.publisher-error { color: #8f1616; background: #ffebeb; border: 1px solid #e6abab; }
.publisher-actions, .publisher-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.publisher-heading { justify-content: space-between; }
.publisher-heading h2, .publisher-heading h3 { margin: 0; }
.publisher-listing { border-top: 1px solid #eedfd3; margin-top: 20px; padding-top: 20px; }
.publisher-listing form { margin-top: 18px; }
.publisher-state { background: #fff0df; color: #8c3a08; padding: 5px 10px; border-radius: 20px; font-size: 12px; overflow-wrap: anywhere; }
.publisher-photos { display: flex; gap: 10px; overflow-x: auto; margin: 14px 0; }
.publisher-photos img { width: 132px; height: 96px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.publisher-subscriptions { padding-left: 18px; line-height: 2; }
.publisher-empty { padding: 36px 0; color: #736050; }
@media (max-width: 760px) { .publisher-layout { grid-template-columns: 1fr; } .publisher-topbar { padding: 16px; } .publisher-brand span { display: none; } .publisher-shell { padding: 20px 16px 40px; } .publisher-panel { padding: 18px; } }