/* A lighter header; sharing is the clearest action on the page. */
.site-header{height:68px;gap:24px}
.brand-image{width:140px;height:34px}
.site-header>nav{gap:24px;height:40px}
.site-header>nav a{font-size:14px;min-height:40px}
.header-actions{gap:18px;height:40px}
.header-share{display:flex;height:40px;padding:0 14px;gap:12px;background:#b64d32;color:#fffdf5;border:1px solid #733a2c;box-shadow:3px 3px 0 #733a2c24;font-size:14px;font-weight:650;transition:transform .18s,box-shadow .18s,background .18s}
.header-share span{display:grid;place-items:center;width:23px;height:23px;background:#f0ce68;color:#4d3323;border-radius:50%;font-size:21px;font-weight:500}
.header-share:hover{background:#a74029;transform:translateY(-1px);box-shadow:3px 4px 0 #733a2c40;color:#fffdf5}
.header-share:active{transform:translateY(1px);box-shadow:1px 1px 0 #733a2c24}
.login-trigger{font-size:14px}
.compact-nav{display:none}
html{scroll-padding-top:84px}

/* Four accents stay outside the title and the people's head space. */
.hero-stage>.float{z-index:1;pointer-events:none}
.float-art{width:clamp(128px,14vw,190px);left:-7%;top:22%}
.float-code{width:clamp(96px,9vw,122px);right:1%;top:19%}
.float-orbit{width:clamp(180px,19vw,250px);right:-11%;top:84%}
.float-plane-new{width:84px;left:7%;top:85%}
.float span{animation:idea-breath 12s ease-in-out infinite}
.float-code span{animation-delay:-3s}.float-orbit span{animation-delay:-7s}.float-plane-new span{animation-delay:-5s}
@keyframes idea-breath{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-4px) rotate(.8deg)}}

/* Creator identity and aggregate appreciation remain legible as the directory grows. */
.maker-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:25px;min-height:40px;flex-wrap:wrap}
.maker-ranking{display:flex;gap:4px;border-bottom:1px solid #c9c8bb}
.maker-ranking button{padding:10px 17px;font-size:14px;color:#737869;border-bottom:2px solid transparent;margin-bottom:-1px}
.maker-ranking button[aria-pressed=true]{border-color:#b64d32;color:#a5422e;font-weight:650}
.maker-ranking button:hover{background:#ece9df}
.stars-status{font-size:12px;line-height:1.8;color:#747b6b;min-height:22px}
.stars-status button{margin-left:5px;text-decoration:underline;text-underline-offset:3px;color:#a5422e}
.creator-track{margin-top:16px;gap:18px}
.creator-card{flex-basis:calc((100% - 72px)/5);min-width:187px;padding:22px 12px;gap:15px}
.creator-card .creator-info{width:100%;display:flex;flex-direction:column;gap:7px}
.creator-info strong{display:block;font-size:15px;line-height:1.6;overflow-wrap:anywhere}
.creator-card .creator-info strong{min-height:48px;display:flex;align-items:center;justify-content:center}
.creator-info>.maker-department{font-size:13px;line-height:1.6;max-width:100%;white-space:normal;overflow-wrap:anywhere;color:#747a6d}
.creator-info>.sample-badge{align-self:center;font-size:10px!important;line-height:1.3}
.creator-info>.maker-metrics,.maker-profile div>.maker-metrics{display:flex;flex-wrap:wrap;align-items:center;gap:7px 14px;margin-top:7px;font-size:12px;font-weight:400;overflow:visible;white-space:normal;color:#65715e}
.maker-metrics>span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.maker-metrics b{color:#354b3d;font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}
.maker-metrics svg{width:14px;height:14px;fill:none;stroke:#7d856b;stroke-width:1.6;stroke-linejoin:round}
.creator-card .maker-metrics{justify-content:center}
.maker-tile .creator-info>.sample-badge{align-self:flex-start}
.maker-tile .person-avatar{width:60px;height:60px}
.maker-profile h1{flex-wrap:wrap;overflow-wrap:anywhere}
.maker-profile .maker-metrics{margin-top:16px}
.maker-profile .maker-metrics b{font-size:18px}

/* The star is its own action, separate from opening a work or its author. */
.card-bottom{gap:10px}
.card-bottom .byline{min-width:0;flex:1}
.card-bottom .byline>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.star-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;min-width:61px;min-height:38px;padding:6px 10px;border:1px solid #c9c9b9;background:#f8f6ee;color:#5c6857;border-radius:4px;font-size:13px;line-height:1;font-variant-numeric:tabular-nums;transition:background .18s,border-color .18s}
.star-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;transition:transform .18s}
.star-button:hover{background:#f5e7bc;border-color:#ac945e;color:#735320}
.star-button:hover svg{transform:rotate(-9deg)}
.star-button[aria-pressed=true]{background:#f6e4af;color:#775522;border-color:#c5a75f}
.star-button[aria-pressed=true] svg{fill:#e3b540;stroke:#906a2a}
.star-button:disabled{opacity:.55;cursor:progress}
.detail-appreciation{display:flex;gap:18px;align-items:center;justify-content:space-between;margin:24px 0 8px;padding:16px 0;border-block:1px solid #dcdccf;font-size:14px;color:#64705e}
.detail-appreciation .star-button{min-height:42px;padding:8px 15px}

@media(min-width:1700px){.float-art{left:-3%}.float-code{right:5%}.float-orbit{right:-7%}}
@media(max-width:1100px){.site-header{gap:18px}.brand-image{width:132px;height:32px}.site-header>nav{gap:18px}.creator-card{flex-basis:calc((100% - 54px)/4)}.makers-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:760px) and (min-width:761px){.float-art{width:140px;left:-5%;top:19%}.float-code{width:94px;right:0;top:20%}.float-orbit{width:170px;right:-10%;top:86%}.float-plane-new{width:68px;left:8%;top:85%}}
@media(max-width:760px){
 .site-header{height:62px;padding:0 18px;gap:12px}.brand-image{width:114px;height:28px}.site-header>nav{display:none}.header-actions{gap:10px;margin-left:0}.header-share{display:flex;height:38px;padding:0 10px;font-size:13px;gap:8px}.header-share span{width:20px;height:20px;font-size:18px}.login-trigger{font-size:13px;min-width:30px}
 .compact-nav{display:block;position:relative;margin-left:auto}.compact-nav summary{display:grid;place-items:center;list-style:none;cursor:pointer;width:34px;height:42px;font-size:20px}.compact-nav summary::-webkit-details-marker{display:none}.compact-nav nav{position:absolute;right:0;top:47px;display:flex;flex-direction:column;align-items:stretch;height:auto;gap:0;min-width:145px;padding:7px;background:#fffdf6;border:1px solid #cccbbd;box-shadow:0 5px 18px #20221f12}.compact-nav nav a{display:block;padding:12px 16px;font-size:14px}
 .site-header .compact-nav nav a{display:block}.compact-nav:not([open]) nav{display:none}
 .float-code{display:none}.float-art{width:120px;left:-18%;top:28%}.float-orbit{width:170px;right:-24%;top:84%}.float-plane-new{width:70px;left:5%;top:84%}
 .creator-card{flex-basis:184px;min-width:184px;padding:18px 10px}.creator-heading{align-items:center}.creator-heading .section-link{font-size:12px}.maker-toolbar{margin-top:18px;gap:8px}.maker-ranking button{padding:9px 13px;font-size:13px}.creator-info>.maker-department{font-size:12px}.maker-metrics{gap:8px 11px}.star-button{min-height:40px}.makers-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){.site-header{padding:0 12px;gap:7px}.brand-image{width:106px;height:26px}.header-actions{gap:7px}.header-share{font-size:12px;padding:0 9px;gap:6px}.compact-nav summary{width:30px}.float-art{width:103px;left:-18%}.float-orbit{width:146px;right:-27%}.float-plane-new{width:66px}.makers-grid{grid-template-columns:1fr}.maker-tile .person-avatar{width:64px;height:64px}.maker-tile .creator-info strong{font-size:16px}.creator-heading h2{max-width:240px}.creator-heading .section-link{gap:7px;font-size:11px}.detail-appreciation{font-size:13px}}
@media(max-width:350px){.brand-image{width:90px;height:23px}.header-share{padding:0 7px;font-size:11px}.header-actions{gap:4px}.login-trigger{min-width:26px;font-size:12px}}

.intake-form{min-width:0}.intake-form details{border-top:1px solid var(--line,#c6c5b5);padding-top:18px;margin:20px 0}.intake-form summary{cursor:pointer;margin-bottom:20px}.intake-actions,.creation-links{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.intake-actions{margin-top:24px}.creation-links{margin-top:24px}.creation-links .ink-button,.creation-links .outline-button{box-sizing:border-box;flex:0 0 148px;height:50px;min-height:50px;padding:0 18px;gap:8px;font-size:14px}.intake-form label{display:block}.intake-form input,.intake-form textarea{width:100%;box-sizing:border-box}