/* Example-specific presentation. Core brand principles stay independent of it. */
.reveal-pill button { border:0; border-radius:999px; background:transparent; padding:4px 2px; height:100%; line-height:1; font-size:inherit; font-weight:inherit; }
.reveal-pill button:focus-visible { outline-offset:3px; }
.reveal-pill button:disabled { cursor:default; }
.reveal-pill button:hover:not(:disabled) { color:#325135; }
.scratchpad-example { margin-top:42px; border:1px solid #d9ddd2; border-radius:12px; background:#fffefa; box-shadow:0 12px 44px #263e3506; overflow:hidden; }
.scratchpad-sample-bar { display:flex; justify-content:space-between; align-items:center; min-height:44px; padding:0 28px; border-bottom:1px solid #e4e6dc; color:#6c7766; font-size:12px; }
.scratchpad-sample-bar>span:first-child { display:flex; gap:8px; align-items:center; }
.scratchpad-sample-bar .icon { width:15px; height:15px; }
.example-label { font-size:11px; }
.scratchpad-sample-heading { padding:25px 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid #e4e6dc; }
.scratchpad-sample-heading h3 { font-size:22px; line-height:1.3; font-weight:550; letter-spacing:-.5px; }
.scratchpad-modes { display:flex; padding:4px; gap:2px; border-radius:8px; background:#eeefe8; flex-shrink:0; }
.scratchpad-modes button { border:0; background:transparent; padding:9px 16px; border-radius:5px; font-size:13px; line-height:1.2; color:#646f60; }
.scratchpad-modes button[aria-selected="true"] { background:#fffefa; color:#2c4835; box-shadow:0 1px 4px #2c483510; }
.scratchpad-modes button:disabled { cursor:default; }
.scratchpad-example-panels { display:grid; }
.scratchpad-example-panels>section { grid-area:1/1; min-width:0; height:450px; outline-offset:-3px; }
.scratchpad-writing { padding:32px; overflow:auto; }
.scratchpad-writing-page { max-width:650px; margin:0 auto; font-size:16px; line-height:1.65; }
.thought-intro { color:#5b6556; }
.linked-note-example { margin:22px 0; padding:15px 20px; border:1px solid #cddcc5; background:#edf2e8; border-radius:5px; color:#416b4c; }
.linked-note-example>span { font-size:11px; color:#5d795b; }
.linked-note-example p { margin-top:5px; }
.linked-note-example.note-warm { color:#78623e; background:#f6f0e2; border-color:#e2d8bf; }
.note-warm>span { color:#816e4d; }
.thought-followup { color:#5c6856; }
.scratchpad-canvas { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:54px 24px 36px; background-color:#f7f7f0; background-image:radial-gradient(#b6c3aa70 .8px,transparent .8px); background-size:18px 18px; }
.canvas-example-tools { position:absolute; top:16px; display:flex; align-items:center; gap:22px; padding:10px 17px; border:1px solid #dce2d4; border-radius:9px; background:#fffefa; color:#56684d; }
.canvas-example-tools .icon { width:17px; height:17px; }
.canvas-example-tools span { font-family:Georgia,serif; font-size:19px; }
.canvas-example-art { width:min(100%,760px); height:auto; max-height:340px; }
.canvas-mobile-art { display:none; }
.canvas-example-credit { position:absolute; bottom:17px; font-size:11px; color:#64725a; }
.scratchpad-example-caption { min-height:51px; display:flex; align-items:center; justify-content:center; padding:14px 24px; border-top:1px solid #e1e5d9; background:#f5f5ee; font-size:13px; line-height:1.5; text-align:center; color:#596650; }
.demo-fallback { padding:20px; font-size:14px; }
.resources-more { display:inline-flex; align-items:center; gap:12px; margin-top:28px; padding-block:8px; font-size:15px; color:#3d6141; border-bottom:1px solid #adbea1; }
.resources-more .icon { width:17px; height:17px; }
.resources-more:hover { border-color:currentColor; }
.resource-index-intro { padding:72px 0 52px; max-width:820px; }
.resource-index-intro h1 { font-family:var(--serif); font-size:clamp(38px,4.5vw,62px); line-height:1.1; letter-spacing:-1.5px; margin:16px 0 25px; }
.resource-index-intro>p:not(.eyebrow) { max-width:58ch; line-height:1.7; color:var(--muted); font-size:17px; }
.resource-index-intro .resource-independence { font-size:13px!important; margin-top:17px; }
.resource-topics { display:flex; flex-wrap:wrap; gap:10px 25px; padding:22px 0; border-block:1px solid var(--rule); margin-bottom:28px; font-size:14px; color:#486141; }
.resource-topics a { padding-block:7px; }
.resource-topics a:hover { text-decoration:underline; text-underline-offset:5px; }
.resource-category { display:grid; grid-template-columns:1fr 2fr; gap:70px; padding:38px 0; border-bottom:1px solid var(--rule); }
.resource-category h2 { font-family:var(--serif); font-size:29px; line-height:1.3; max-width:12ch; }
.resource-category .resource-list>li:first-child { padding-top:0; border:0; }
.resource-index-footnote { padding:30px 0 65px; font-size:13px; line-height:1.7; color:var(--muted); }
@media(max-width:900px) {
 .scratchpad-sample-heading { padding:24px; }
 .scratchpad-sample-heading h3 { font-size:20px; }
 .resource-category { gap:32px; grid-template-columns:1fr 2fr; }
}
@media(max-width:600px) {
 .scratchpad-example { margin-top:30px; }
 .scratchpad-sample-bar { padding-inline:20px; }
 .scratchpad-sample-heading { flex-direction:column; align-items:flex-start; gap:18px; padding:20px; }
 .scratchpad-modes { align-self:stretch; }
 .scratchpad-modes button { flex:1; }
 .scratchpad-writing { padding:24px 20px; }
 .scratchpad-writing-page { font-size:14px; }
 .linked-note-example { margin-block:20px; padding:12px 15px; }
 .scratchpad-example-panels>section { height:560px; }
 .scratchpad-canvas { padding:74px 4px 40px; }
 .canvas-example-art { display:none; }
 .canvas-mobile-art { display:flex; flex-direction:column; align-items:center; width:100%; padding:10px 16px; gap:9px; }
 .canvas-mobile-note { width:min(100%,268px); padding:13px 15px; border:1px solid #c9d6c4; background:#edf2e8; color:#43674d; font-size:14px; line-height:1.45; }
 .canvas-mobile-note>span { display:block; margin-bottom:6px; font-size:10px; }
 .canvas-mobile-note.note-warm { background:#f6efdf; color:#776341; border-color:#ddd1b5; }
 .canvas-mobile-connector { width:25px; height:20px; flex:none; fill:none; stroke:#788875; stroke-width:1.3; }
 .canvas-mobile-equation { display:flex; align-items:center; justify-content:center; gap:7px; font-family:Georgia,serif; text-align:center; font-size:22px; line-height:1; }
 .canvas-mobile-plot { width:205px; height:160px; flex:none; margin-block:2px; }
 .canvas-mobile-equation b { display:inline-flex; align-items:center; justify-content:center; flex:none; width:1.6em; height:1.6em; font-weight:400; line-height:1; border:1px solid #788875; border-radius:50%; }
 .scratchpad-canvas { overflow:hidden; }
 .scratchpad-example-caption { min-height:68px; font-size:12px; padding:13px 20px; }
 .resource-index-intro { padding:45px 0 35px; }
 .resource-index-intro>p:not(.eyebrow) { font-size:16px; }
 .resource-category { grid-template-columns:1fr; gap:25px; padding-block:30px; }
 .resource-category h2 { max-width:none; font-size:27px; }
}

@media print { .scratchpad-modes { display:none; } .scratchpad-example-panels { display:block; } .scratchpad-example-panels>section { display:block!important; height:auto; min-height:350px; } .canvas-example-art { width:100%; transform:none; } }
