.creators-shell { max-width: 1220px; }
.creators-intro { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding: 7px 0 34px; }
.creators-intro h1 { font-size: 34px; font-weight: 650; letter-spacing: -1px; margin: 10px 0 12px; }
.creators-intro p { font-size: 13px; line-height: 1.9; color: var(--muted); }
.creators-intro .creator-count { font-size: 10px; white-space: nowrap; padding-bottom: 5px; }
.directory-toolbar { display: flex; gap: 30px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.directory-views { display: flex; gap: 32px; }
.directory-views button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 14px 0 17px; font-size: 14px; color: #88907f; }
.directory-views button.active { border-bottom-color: var(--ink); color: var(--ink); font-weight: 650; }
.directory-search { display: flex; gap: 9px; align-items: center; }
.directory-search svg { width: 16px; height: 16px; color: #838d79; }
.directory-search input { font-size: 12px; border: 0; outline-offset: 4px; background: transparent; width: 180px; padding: 7px 0; }
.directory-filters { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 24px 0 28px; }
.directory-filters>div { display: flex; gap: 9px; flex-wrap: wrap; }
.directory-filters button { border: 1px solid transparent; background: none; color: #7e8975; font-size: 11px; padding: 7px 12px; border-radius: 4px; }
.directory-filters button.active { background: #edf2e4; color: #3d562d; }
.prompt-filter { font-size: 11px; color: #7b886e; display: flex; gap: 5px; align-items: center; white-space: nowrap; }
.prompt-filter input { accent-color: #526a3d; }
.creator-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px 26px; }
.creator-work-card { min-width: 0; }
.work-preview { position: relative; aspect-ratio: 16 / 10; display: block; background: #e9ede4; border-radius: 6px; overflow: hidden; }
.work-preview img { width: 100%; height: 100%; object-fit: contain; }
.work-medium { position: absolute; top: 13px; left: 13px; color: #f8faf5; background: #15281bba; backdrop-filter: blur(4px); border-radius: 3px; padding: 5px 8px; font-size: 9px; }
.work-open { position: absolute; bottom: 12px; right: 12px; display: grid; place-items: center; background: #f8f9f3ec; color: #304024; width: 30px; height: 30px; border-radius: 50%; font-size: 20px; }
.work-copy { padding: 18px 0 0; }
.work-author { display: flex; gap: 8px; align-items: center; font-size: 11px; border: 0; background: none; padding: 0; color: #6e7a60; }
.work-author>span:last-child { color: #9ca68f; font-size: 13px; }
.creator-initial { display: inline-grid; place-items: center; width: 23px; height: 23px; flex-shrink: 0; border: 1px solid #e0e5d8; border-radius: 50%; background: #f2f5eb; font-size: 10px; font-weight: 650; color: #51643d; }
.work-copy h2 { font-size: 18px; line-height: 1.65; font-weight: 600; letter-spacing: -.35px; margin: 12px 0 9px; }
.work-copy>p { color: #68735f; font-size: 12px; line-height: 1.9; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.work-availability { display: flex; gap: 10px; flex-wrap: wrap; color: #737e69; font-size: 10px; padding-top: 15px; }
.work-availability>span+span { border-left: 1px solid #dce3d3; padding-left: 10px; }
.work-availability .available { color: #607c3b; }
.work-card-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.work-card-bottom>a { font-size: 11px; color: #536d3b; display: flex; align-items: center; gap: 13px; }
.work-card-bottom .save-button { width: 32px; height: 32px; justify-content: center; }
.creator-credit-note { margin: 42px 0; border-top: 1px solid var(--line); padding-top: 20px; color: #939c87; font-size: 10px; line-height: 1.9; }
.creator-selection { display: flex; justify-content: space-between; align-items: center; gap: 18px; background: #f2f5eb; padding: 13px 16px; margin-bottom: 25px; border-radius: 5px; font-size: 12px; color: #60734c; }
.creator-selection button { border: 0; background: none; font-size: 11px; color: #7e8d6e; }
.creator-profile-card { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.creator-profile-images { display: flex; height: 205px; gap: 3px; background: #eef2e6; }
.creator-profile-images>a { min-width: 0; flex: 1; }
.creator-profile-images img { width: 100%; height: 100%; object-fit: contain; }
.creator-profile-copy { padding: 22px; }
.creator-profile-copy>div:first-child { display: flex; align-items: center; gap: 10px; }
.creator-profile-copy h2 { font-size: 17px; font-weight: 600; }
.creator-profile-copy>p { margin: 13px 0 20px; font-size: 10px; color: #859175; }
.creator-profile-copy>p>span { display: block; margin-top: 6px; color: #a0aa93; }
.creator-profile-actions { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.creator-profile-actions button { border: 0; padding: 0; background: none; font-size: 11px; color: #546e3c; }
.creator-profile-actions a { font-size: 10px; color: #8b987b; }
.creator-entry { display: flex; gap: 20px; align-items: center; padding: 19px 21px; margin-bottom: 28px; border: 1px solid #e0e6d6; border-radius: 6px; background: #f5f8ef; }
.creator-entry-symbol { width: 38px; height: 42px; display: grid; place-items: center; background: var(--lime); color: #30471e; font-size: 25px; border-radius: 4px; flex-shrink: 0; }
.creator-entry strong { font-size: 14px; font-weight: 600; }
.creator-entry p { color: #89957d; font-size: 10px; line-height: 1.8; margin-top: 5px; }
.creator-entry-arrow { margin-left: auto; font-size: 20px; }
.creator-article-header { max-width: none; }
.creator-detail-byline { display: flex; justify-content: space-between; align-items: center; padding-top: 19px; border-top: 1px solid var(--line); }
.creator-detail-byline>a { display: flex; gap: 10px; align-items: center; font-size: 12px; color: #5c7050; }
.creator-detail-byline>a>span:last-child { font-size: 10px; color: #949e87; }
.creator-figure { margin: 0; }
.creator-main-image { display: block; position: relative; background: #ecf0e6; border-radius: 7px; overflow: hidden; }
.creator-main-image img { width: 100%; max-height: 610px; object-fit: contain; }
.creator-main-image>span { position: absolute; right: 18px; bottom: 18px; padding: 10px 15px; border-radius: 4px; background: #162719e6; color: #fff; font-size: 12px; }
.creator-figure figcaption { font-size: 10px; color: #96a086; margin-top: 11px; line-height: 1.8; }
.creator-detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 250px; gap: 80px; padding: 40px 0 55px; }
.creator-notes section { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid var(--line); }
.notes-heading { display: flex; justify-content: space-between; gap: 18px; align-items: baseline; margin-bottom: 16px; }
.notes-heading h2 { font-size: 21px; font-weight: 600; }
.notes-heading>span { font-size: 10px; color: #8c9980; }
.creator-notes p { font-size: 13px; line-height: 2; color: #6a7a5b; margin: 12px 0; }
.source-action { font-size: 11px; color: #5d7943; display: inline-block; }
.creator-notes .quiet-copy { color: #929e84; font-size: 12px; }
.creator-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 20px; font-size: 10px; }
.creator-tools>span:first-child { color: #909f7f; margin-right: 4px; }
.tool-name { border: 1px solid #dfe6d6; border-radius: 3px; padding: 4px 7px; color: #6b7e58; }
.prompt-box { background: #f5f7ef; padding: 21px; border: 1px solid #e2e8d8; border-radius: 6px; margin-bottom: 17px; }
.prompt-box pre { font: 12px/1.9 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; margin: 0 0 15px; color: #5a6e46; }
.prompt-box button { background: none; border: 1px solid #ced8c3; padding: 6px 12px; border-radius: 4px; color: #60764a; font-size: 10px; }
.creator-side-heading { display: flex; align-items: center; gap: 12px; padding: 6px 0 20px; }
.creator-side-heading .creator-initial { width: 39px; height: 39px; font-size: 15px; }
.creator-side-heading>div>span { font-size: 9px; color: #9ba58e; }
.creator-side-heading h2 { font-size: 16px; font-weight: 600; margin-top: 4px; }
.creator-detail-aside { align-self: start; position: sticky; top: 110px; }
.creator-detail-aside .button { width: 100%; margin-bottom: 10px; }
.creator-archive-link { display: block; font-size: 11px; color: #6d8359; margin: 13px 0 23px; }
.creator-detail-aside>p { font-size: 10px; color: #98a18d; line-height: 1.9; }
.more-creator { padding: 18px 0; border-top: 1px solid var(--line); }
.more-creator h3 { font-size: 12px; font-weight: 600; margin-bottom: 12px; }
.more-creator a { display: block; font-size: 11px; line-height: 1.9; margin-bottom: 9px; color: #748469; }
.media-unavailable { display: grid; place-items: center; min-height: 180px; width: 100%; color: #859276; background: #edf1e6; font-size: 12px; }
@media (max-width:1100px) { .creator-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); } .creator-detail-layout { gap: 35px; grid-template-columns: minmax(0,1fr) 220px; } }
@media (max-width:760px) { .creators-intro { display: block; padding-bottom: 25px; } .creators-intro .creator-count { margin-top: 17px; } .creators-intro h1 { font-size: 29px; } .creator-detail-layout { display: flex; flex-direction: column; gap: 0; } .creator-detail-aside { position: static; width: 100%; border: 1px solid var(--line); padding: 20px; border-radius: 6px; } .notes-heading { flex-wrap: wrap; gap: 8px; } }
@media (max-width:600px) { .creators-page .shell { width: calc(100% - 36px); } .creators-intro .eyebrow { font-size: 8px; } .creators-intro p { font-size: 12px; } .directory-toolbar { gap: 15px; flex-wrap: wrap; } .directory-views { gap: 28px; } .directory-search { width: 100%; padding: 11px 13px; background: #f5f7ef; margin-bottom: 14px; border-radius: 4px; } .directory-search input { width: 100%; } .directory-filters { flex-wrap: wrap; gap: 15px; margin: 19px 0 24px; } .directory-filters>div { gap: 4px; } .directory-filters button { font-size: 10px; padding: 7px 10px; } .prompt-filter { font-size: 10px; } .creator-gallery { grid-template-columns: 1fr; gap: 33px; } .work-preview { aspect-ratio: 16 / 10; } .work-copy h2 { font-size: 20px; } .work-copy>p { font-size: 12px; } .work-author { font-size: 12px; } .creator-entry { padding: 17px; gap: 12px; } .creator-entry p { font-size: 10px; } .creator-entry strong { font-size: 13px; } .creator-detail-byline { gap: 12px; } .creator-detail-byline>a { flex-wrap: wrap; gap: 7px; } .creator-detail-byline>a>span:last-child { font-size: 9px; } .creator-main-image>span { right: 10px; bottom: 10px; font-size: 10px; padding: 8px 11px; } .creator-detail-layout { padding-top: 30px; } .creator-notes p { font-size: 13px; } }
