/* 18 October 2026, her words: "they are too colorful and i think having muted color here will help with one thing per area". The connect pages per AI keep one colored thing per area: the title at the top, the address box in step 1, the highlighted line in each sketch. The numbers, the STEP labels and the Copy button go quiet. Linked last, so it reads after every other sheet. */
.three-steps a span,.three-steps li:nth-child(n) a span,.part h2 .n,#add h2 .n,#allow h2 .n,#first h2 .n,.mo h2 .n{background:#FFFFFF!important;background-image:none!important;color:#2B1F3A!important;border:1.5px solid #E2E0DC!important;box-shadow:none!important}
.step .say .k,.say .k,span.k,.deskbox > .say .k{background:#F6F6F8!important;background-image:none!important;color:#5E5852!important;border:none!important}
.copy{background:#FFFFFF!important;background-image:none!important;color:#2B1F3A!important;border:1.5px solid #E2E0DC!important}
.copy:hover{border-color:#C9C5BF!important}
/* the Gemini page draws its numbers inline, in the same gradient; they go quiet the same way */
span[style*="linear-gradient(135deg,#4F6BF5"]{background:#FFFFFF!important;background-image:none!important;color:#2B1F3A!important;border:1.5px solid #E2E0DC!important;box-sizing:border-box}

/* 18 October 2026, second pass, her words: "this is going the face / the living projects - keeping it one thing in gradient / the rest - all these in all three pages / like add - its already seen - removing border / the rest of borders very very mild soft color". */
.top svg.hi{display:none!important}
/* the address box: no gradient ring, a mild border */
.addr{background:#FFFFFF!important;border:1.5px solid #EAE3F0!important;box-shadow:none!important}
#add .addr{box-shadow:none!important}
/* dark buttons in the sketches are seen already: no ring */
.sk .b.add,.sk .b.go{box-shadow:none!important}
/* the line to click in each sketch: a very mild border, no glow */
.sk .glow,.sk .row2.glow,.sk .pl.glow,.sk .mcprow .auth,.icrow img{box-shadow:0 0 0 1.5px #EAE3F0!important}
/* her words: "done - back to your AI - a bit of color, soft background because its a different button to remember when they are done connecting storage": the same soft lavender as the Gemini page's Done */
.sk div.row2[style*="box-shadow"]{box-shadow:none!important;border-color:#EAE3F0!important;background:#F4F0FA!important}
/* the other lavender borders, softer */
.aigo{background:#FFFFFF!important;border-color:#EAE3F0!important}
.golink.guide,.scrl{border-color:#EAE3F0!important}
/* Gemini draws its highlights inline */
[style*="#CDB8E8"]{border-color:#EAE3F0!important}
/* the title keeps the one gradient: soft gradient panels go plain */
[style*="background:linear-gradient(135deg,#EEF0FE"],[style*="background:linear-gradient(135deg,#EEF1FE"]{background:#F8F7FA!important}
span[style*="background:#EEF0FE"]{background:#F6F6F8!important}
/* her words: "this is our logo ? the website shows different": the sketches show logo C, LP in white on the gradient (living-projects-logo.png), with no ring */
.icrow img{box-shadow:none!important}
/* her words: "the color on living projects in grey - barely seen - can be bold black lower case", and no border */
.scrl{text-transform:lowercase!important;color:#2B1F3A!important;background:none!important;border:0!important;padding:0!important;letter-spacing:0!important;font-weight:800!important;font-size:15px!important}
/* the lower sections, the same way: one gradient, the title */
.cxn{background:#FFFFFF!important;background-image:none!important;color:#2B1F3A!important;border:1.5px solid #E2E0DC!important}
.plus{color:#8A837C!important}
.hl{background:#EAE3F0!important;background-image:none!important}
.golink:not(.guide){background:#F6F6F8!important;background-image:none!important}
.seat2.lit2,.seat2.lit2:hover{background:#FFFFFF!important;background-image:none!important;border-color:#EAE3F0!important;box-shadow:none!important}
/* Gemini draws these inline */
span[style*="color:#8E3FA8"]{color:#8A837C!important}
span[style*="font-weight:700;background:linear-gradient(100deg"]{background:none!important;-webkit-text-fill-color:#2B1F3A!important;color:#2B1F3A!important}

/* 18 October 2026, readability, her yes ("ok lets go with your recommendation"): the pale lines that carry information go to the site's normal grey. The dimmed lines inside the sketches stay pale on purpose. */
.top .crumb,.top .crumb a{color:#5E5852!important}
span[style*="font-size:15px;color:#8A837C"],span[style*="font-size:15px;color:#8A837C"] a{color:#5E5852!important}
p[style*="font-size:13px;line-height:1.5;color:#8A837C"],span[style*="font-size:13px;color:#8A837C"]{color:#5E5852!important;font-size:14px!important}
.stamp{color:#5E5852!important}
.k2{color:#5E5852!important}
.check,.check span{color:#5E5852!important}
.cxk{color:#5E5852!important}
.seat2 small{color:#5E5852!important;font-size:13.5px!important}

/* 18 October 2026, her words: "you see how you made it on questions page for the headings - thats how i would want to see those two". Where it works and Good to know get the Questions page's 22px of space under the heading; the font, size and sweep were the same already. */
main h2:has(> .ht:first-child){margin-bottom:22px!important}

/* 18 October 2026, her words: "how to use it - add a slight color?": the box that leads on to How to use it (Claude, ChatGPT) and Gemini's "You're set" box take the soft lavender of the Done button, the color for "this is your next step" */
.golink.guide,[data-next]{background:#F4F0FA!important;background-image:none!important;border-color:#EAE3F0!important}

/* 18 October 2026, her words: "happier color - screen 1" (Done and the tick), "how to use it is purple - purple and grey and white make it look sad". The next-step color is the soft yellow she chose for the 1 2 3 line, in place of the lavender. */
.sk div.row2[style*="box-shadow"],span[data-done]{background:#FFF4C7!important;border-color:#F0D88A!important}
.golink.guide,[data-next]{background:#FFF4C7!important;border-color:#F0D88A!important}
.golink.guide .aigo{border-color:#F0D88A!important}
.check .tick circle{fill:#FFF4C7;stroke:#E6C65E}
.check .tick path{stroke:#B8901F}

/* her words: "screen 2 - running gradient on settings connectors etc": the line to click in each picture keeps its soft border, and the site's running gradient passes along it once when it comes into view (glow.js adds .hlrun, then .go) */
.hlrun{position:relative;box-shadow:none!important}
.hlrun::after{content:"";position:absolute;inset:-1.5px;border-radius:inherit;padding:1.5px;pointer-events:none;
  background:linear-gradient(100deg,#EAE3F0 0%,#EAE3F0 34%,#3B6CF6 42%,#C43CD8 50%,#F2811D 58%,#EAE3F0 66%,#EAE3F0 100%);background-size:300% 100%;background-position:100% 0;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.hlrun.go::after{animation:hlsweep 1.6s ease-in-out .15s both}
@keyframes hlsweep{from{background-position:100% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.hlrun.go::after{animation:none}}
[style*="#CDB8E8"].hlrun{border-color:transparent!important}

/* 19 October 2026, her words: "one thing that feels out of place now is the yellow", then "your pick": yellow stays small (the tick, the 1 2 3 line, the marked lines); Done and the next-step box take a pale cream with a thin yellow border */
.sk div.row2[style*="box-shadow"],span[data-done]{background:#FFFBEA!important;border-color:#F3E3A8!important}
.golink.guide,[data-next]{background:#FFFBEA!important;border:1px solid #F3E3A8!important}
.golink.guide .aigo{border-color:#F3E3A8!important}
/* her words: "check mark bright yellow" */
.check .tick circle{fill:#FFD84A!important;stroke:#F2C230!important}
.check .tick path{stroke:#2B1F3A!important}
/* 30 October 2026, her words: "having color would help for the working ones and click here small?" The cards that open something take the soft lavender of the buttons on How to use it and Questions; the title keeps the one gradient. Chat and Cowork, ChatGPT and GPT Work stay white. */
.seat2.lit2{background:#F6EEFB!important;border-color:#D9C2EA!important}
.seat2.lit2:hover{background:#F6EEFB!important;border-color:#C9A8DF!important}
.seat2.lit2 small{color:#8E3FA8!important}