.community-page{--ink:#111c35;--muted:#67748b;--blue:#086aff;--orange:#ff8a24}
.community-story{position:relative;max-width:1600px;margin:auto;isolation:isolate}
.community-wrap{width:min(1160px,calc(100% - 112px));margin-inline:auto}
.community-chapter{position:relative;isolation:isolate;display:flex;align-items:center;min-height:660px;scroll-margin-top:105px}
.community-photo{position:absolute;inset:0;z-index:-1;margin:0;pointer-events:none;mask-image:linear-gradient(transparent,#000 7%,#000 87%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 7%,#000 87%,transparent)}
.community-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.community-photo .pencil-edge{opacity:.86;mask-image:linear-gradient(125deg,transparent 72%,#000 94%);-webkit-mask-image:linear-gradient(125deg,transparent 72%,#000 94%)}
.community-photo .pencil-layer{z-index:2}
.community-photo .replay-photo{pointer-events:auto;right:30px;bottom:55px}
.chapter-copy{position:relative;z-index:2;width:44%;margin-left:max(56px,calc((100% - 1160px)/2));padding:55px 0;pointer-events:none}
.chapter-copy a,.chapter-copy button{pointer-events:auto}
.community-page h1{font-size:clamp(46px,4.1vw,66px);font-weight:500;letter-spacing:-.055em;line-height:1.07}
.community-page h2{font-size:clamp(34px,3.4vw,51px);font-weight:500;letter-spacing:-.045em;line-height:1.12}
.community-page .eyebrow{font-size:10px;letter-spacing:.23em;color:#086aff;margin-bottom:24px}
.community-page .lead{font-size:clamp(17px,1.5vw,21px);line-height:1.55;max-width:410px;margin-top:24px}
.chapter-jumps{display:flex;gap:24px;flex-wrap:wrap;margin-top:35px}
.chapter-jumps a,.follow-links a{color:var(--blue);font-size:14px;line-height:1.5;border-bottom:1px solid #8dbdff;padding:6px 0;transition:color 160ms ease,border-color 160ms ease}
.community-welcome{min-height:630px;margin-top:-12px}
.community-welcome .chapter-copy{width:47%;padding-bottom:90px}
.community-guides{position:relative;z-index:2;padding:10px 0 64px}
.community-guides h2{font-size:clamp(29px,2.8vw,40px);margin-bottom:32px}
.guide-list{max-width:940px}
.guide-list>a{display:grid;grid-template-columns:240px 1fr 140px;gap:25px;align-items:center;min-height:85px;border-bottom:1px solid #dce5ef;padding:18px 0;transition:color 180ms ease}
.guide-list strong{font-weight:500;font-size:18px;letter-spacing:-.02em}
.guide-list span{font-size:14px;color:var(--muted);line-height:1.5}
.guide-list .guide-action{font-size:13px;color:var(--blue);text-align:right;text-decoration:underline;text-decoration-color:#a4caff;text-underline-offset:7px}
.community-report{min-height:860px}
.community-report .chapter-copy{margin-left:62%;width:32%;padding:65px 0}
.community-report .community-photo{mask-image:linear-gradient(transparent,#000 10%,#000 83%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 83%,transparent)}
.community-report .pencil-edge{mask-image:linear-gradient(150deg,transparent 57%,#000 88%);-webkit-mask-image:linear-gradient(150deg,transparent 57%,#000 88%)}
.community-report .replay-photo{right:auto;left:30px}
.report-checklist{list-style:none;padding:0;margin:28px 0 29px;max-width:380px}
.report-checklist li{padding:15px 0;border-bottom:1px solid #dce5ef;font-size:15px}
.community-page .button{border-radius:28px;padding:17px 27px;min-height:50px;min-width:180px;background:#086aff;box-shadow:0 4px 12px #086aff12}
.community-page .action-note{font-size:12px;color:#67748b;margin-top:14px;max-width:300px;line-height:1.55}
.detail-note{font-size:12px;color:#7b8493;margin-top:18px;line-height:1.7}
.community-ideas{min-height:735px;margin-top:10px}
.community-ideas .chapter-copy{width:35%;padding-bottom:140px}
.community-ideas .community-photo{left:4%;mask-image:linear-gradient(transparent,#000 10%,#000 82%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 82%,transparent)}
.community-ideas .pencil-edge{mask-image:linear-gradient(30deg,#000,transparent 45%);-webkit-mask-image:linear-gradient(30deg,#000,transparent 45%)}
.community-ideas .button{margin-top:28px}
.follow-links{display:flex;align-items:flex-start;flex-direction:column;gap:10px;margin-top:25px}
.community-thread{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:.65}
.community-page .site-footer{position:relative;background:linear-gradient(#fff,#f4f8fc);padding-top:45px}
.feedback-dialog{width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:36px;border:1px solid #e1e7ee;border-radius:24px;color:var(--ink);background:#fff;box-shadow:0 24px 100px #10203930;overscroll-behavior:contain}
.feedback-dialog::backdrop{background:#14283c65;backdrop-filter:blur(4px)}
.feedback-dialog h2{font-size:33px}
.feedback-dialog .eyebrow{margin:0 0 12px}
.feedback-dialog #feedback-description{font-size:14px;color:var(--muted);margin:18px 0 24px;max-width:470px}
.dialog-close{position:absolute;right:14px;top:12px;width:40px;height:40px;background:transparent;border:0;border-radius:50%;font-size:27px;color:#68768a}
.feedback-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.feedback-fields label{display:flex;flex-direction:column;gap:8px;font-size:13px;line-height:1.5}
.feedback-fields label.wide{grid-column:1/-1}
.feedback-fields input,.feedback-fields textarea{border:1px solid #cbd6e3;border-radius:9px;width:100%;font:14px/1.5 Arial,sans-serif;color:var(--ink);background:#fcfdff;padding:12px;resize:vertical}
.feedback-fields textarea:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.feedback-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:25px}
.quiet-button{padding:10px 0;background:none;border:0;color:#617087;font-size:13px}
.draft-status{font-size:13px;margin-top:15px;min-height:20px;color:#246249}
.local-note{font-size:12px;color:#788397;margin-top:5px}
@media(hover:hover) and (pointer:fine){.chapter-jumps a:hover,.follow-links a:hover{color:#16489e;border-color:#ff8a24}.guide-list>a:hover strong{color:#086aff}.guide-list>a:hover .guide-action{text-decoration-color:#086aff}.community-page .button:hover{background:#005be0}.dialog-close:hover{background:#f2f6fa}.quiet-button:hover{color:#086aff}}
@media(min-width:1600px){.community-welcome{min-height:720px}.community-ideas{min-height:850px}}
@media(max-width:1050px){.community-welcome{min-height:570px}.community-page h1{font-size:48px}.chapter-copy{margin-left:40px}.community-wrap{width:calc(100% - 80px)}.community-report{min-height:800px}.community-report .chapter-copy{margin-left:60%;width:36%}.community-ideas .chapter-copy{width:40%}.guide-list>a{grid-template-columns:210px 1fr 120px;gap:20px}.community-thread{opacity:.35}.community-page h2{font-size:37px}}
@media(max-width:760px){.community-story{overflow:hidden}.community-thread{display:none}.community-wrap{width:calc(100% - 44px)}.community-chapter{display:flex;flex-direction:column;align-items:stretch;min-height:0!important;margin:0}.chapter-copy,.community-welcome .chapter-copy,.community-report .chapter-copy,.community-ideas .chapter-copy{order:0;width:auto;margin:0;padding:46px 24px 10px;pointer-events:auto}.community-page h1{font-size:clamp(38px,8.7vw,56px);max-width:530px}.community-page h2{font-size:clamp(33px,7.8vw,46px)}.community-page .eyebrow{margin-bottom:18px}.community-page .lead{font-size:17px;max-width:440px;margin-top:20px}.desktop-break{display:none}.chapter-jumps{gap:20px;margin-top:24px}.chapter-jumps a{font-size:13px;min-height:40px}.community-photo,.community-ideas .community-photo{position:relative;order:1;inset:auto;z-index:0;width:100%;height:380px;mask-image:linear-gradient(transparent,#000 10%,#000 84%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 84%,transparent)}.community-photo>img{object-position:85% 50%}.community-welcome .community-photo{height:330px}.community-report .community-photo>img{object-position:12% 50%}.community-report .community-photo{height:430px}.community-ideas .community-photo{height:390px}.community-ideas .community-photo>img{object-position:83% 50%}.community-photo .replay-photo{bottom:35px;right:20px;left:auto}.community-guides{padding:20px 0 25px}.community-guides h2{font-size:30px;margin-bottom:20px}.guide-list>a{grid-template-columns:1fr auto;gap:8px 16px;padding:23px 0;min-height:100px}.guide-list strong{font-size:17px}.guide-list span:not(.guide-action){grid-column:1/-1;grid-row:2;font-size:13px;max-width:280px}.guide-list .guide-action{font-size:12px}.report-checklist{max-width:none}.report-checklist li{padding:12px 0}.community-ideas .chapter-copy{padding-top:32px}.community-ideas .button{margin-top:23px}.community-page .site-footer{padding-top:28px}.feedback-dialog{padding:30px 22px;border-radius:18px}.feedback-fields{grid-template-columns:1fr;gap:15px}.feedback-fields label.wide{grid-column:auto}.feedback-dialog h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.community-page *{scroll-behavior:auto!important;transition:none!important}}

.copy-fallback{display:block;width:100%;min-height:180px;margin-top:20px;padding:12px;border:1px solid #cbd6e3;border-radius:9px;font:14px/1.5 Arial,sans-serif;resize:vertical}

@media(max-width:760px){
 .community-ideas .community-photo{height:clamp(260px,76vw,390px)}
 .community-ideas .community-photo .scene-art img{object-fit:cover;object-position:100% 50%}
}

/* The bridge has a smaller left white field than the previous illustration. */
@media(min-width:1051px){
 .community-ideas .chapter-copy{width:28%;max-width:390px;margin-left:5%;padding:45px 0 190px}
 .community-ideas .lead{font-size:clamp(17px,1.35vw,20px)}
 .community-ideas .desktop-break{display:none}
}
@media(min-width:761px) and (max-width:1050px){
 .community-ideas{display:flex;flex-direction:column;align-items:stretch;min-height:0}
 .community-ideas .chapter-copy{order:0;width:auto;max-width:540px;margin:0;padding:40px 40px 0}
 .community-ideas .community-photo{position:relative;order:1;inset:auto;z-index:0;width:100%;height:490px;margin-top:-35px}
 .community-ideas .community-photo .scene-art img{object-position:100% 50%}
}

/* Original notebook composition: preserve the white desk and the clear object silhouettes. */
.community-report .notebook-scene{inset:0;mask-image:linear-gradient(transparent,#000 13%,#000 82%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 13%,#000 82%,transparent)}
.community-report .notebook-scene .scene-art{mask-image:none;-webkit-mask-image:none}
.community-report .notebook-scene .scene-art img{object-position:0% 50%}
.community-photo .scene-art .community-pencil-residue{z-index:1;pointer-events:none;opacity:1}
.notebook-scene .community-pencil-residue{mask-image:linear-gradient(25deg,#000 18%,#000e 30%,#0008 43%,transparent 57%);-webkit-mask-image:linear-gradient(25deg,#000 18%,#000e 30%,#0008 43%,transparent 57%)}
.community-ideas .community-pencil-residue{mask-image:radial-gradient(ellipse 58% 65% at 27% 90%,#000 25%,#000e 43%,#0006 62%,transparent 82%);-webkit-mask-image:radial-gradient(ellipse 58% 65% at 27% 90%,#000 25%,#000e 43%,#0006 62%,transparent 82%)}
.community-photo .scene-art [data-sketch]{z-index:2}
@media(max-width:760px){
 .community-report .notebook-scene{position:relative;inset:auto;height:clamp(320px,88vw,480px)}
 .community-report .notebook-scene .scene-art{mask-image:none;-webkit-mask-image:none}
}
