/* Product changes are restricted to paint properties. Original geometry is inherited unchanged. */
html[data-colour-07]:not([data-colour-07="original"]) .header,
html[data-colour-07]:not([data-colour-07="original"]) .hero{background:var(--c07-hero);color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .hero h1{color:var(--c07-hello)}
html[data-colour-07]:not([data-colour-07="original"]) .orbit-star{color:var(--c07-star)}
html[data-colour-07]:not([data-colour-07="original"]) .mood-controls{background:var(--c07-hero)}
html[data-colour-07]:not([data-colour-07="original"]) .mood-controls button.active,
html[data-colour-07]:not([data-colour-07="original"]) .mood-controls button:hover{background:var(--ink);color:var(--yellow)}
html[data-colour-07]:not([data-colour-07="original"]) .story{background:var(--c07-story)}
html[data-colour-07]:not([data-colour-07="original"]) .story h2 em{color:var(--c07-storyEm)}
html[data-colour-07]:not([data-colour-07="original"]) .outline-question,
html[data-colour-07]:not([data-colour-07="original"]) .pocket h2 em,
html[data-colour-07]:not([data-colour-07="original"]) .future-heading h2 em{color:var(--c07-accent)}
html[data-colour-07]:not([data-colour-07="original"]) .game-portal{background:var(--c07-game)}
html[data-colour-07]:not([data-colour-07="original"]) .tool-portal{background:var(--c07-tool);color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .clock-art{color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .wallpaper-display{background:var(--c07-wall)}
html[data-colour-07]:not([data-colour-07="original"]) .wallpaper-sticker{background:var(--c07-sticker);color:var(--c07-stickerInk)}
html[data-colour-07]:not([data-colour-07="original"]) .future{background:var(--c07-future)}
html[data-colour-07]:not([data-colour-07="original"]) .chat-one{background:var(--c07-chat1)}
html[data-colour-07]:not([data-colour-07="original"]) .chat-two{background:var(--c07-chat2)}
html[data-colour-07]:not([data-colour-07="original"]) .chat-three{background:var(--c07-chat3)}
html[data-colour-07]:not([data-colour-07="original"]) .stage-image{background:var(--c07-stage)}
html[data-colour-07]:not([data-colour-07="original"]) .stage-type{color:var(--yellow)}
html[data-colour-07]:not([data-colour-07="original"]) .together{background:var(--c07-together);color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .together .section-index{color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .collab-heading h2 em{color:var(--c07-collabEm)}
html[data-colour-07]:not([data-colour-07="original"]) .collab-tabs button{color:var(--ink);border-color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .collab-tabs button.active,
html[data-colour-07]:not([data-colour-07="original"]) .collab-tabs button:hover{background:var(--yellow);border-color:var(--ink);color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .light-button{background:var(--ink);color:var(--paper)}
html[data-colour-07]:not([data-colour-07="original"]) .light-button:hover{background:var(--yellow);color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .together .fineprint{opacity:1}
html[data-colour-07]:not([data-colour-07="original"]) .footer{background:var(--c07-footer)}

/* Review navigation is separate from the product layout and omitted in comparison frames. */
.colour07-review{position:fixed;z-index:30;bottom:12px;left:50%;transform:translateX(-50%);max-width:calc(100% - 24px);display:flex;align-items:center;gap:3px;padding:6px;background:#fff;color:var(--ink);border:1px solid var(--ink);border-radius:30px;box-shadow:0 2px 15px #0002;font-family:var(--font-body);font-size:10px;white-space:nowrap}
.colour07-review a{padding:9px 12px;border-radius:22px}.colour07-review a[aria-current]{background:var(--ink);color:#fff}
@media(max-width:540px){.colour07-review{font-size:9px;gap:0}.colour07-review a{padding:9px 7px}}

html[data-colour-07]:not([data-colour-07="original"]) .together{border-color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .language span{opacity:1}
html[data-colour-07]:not([data-colour-07="original"]) .story h2{color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .chat-image,
html[data-colour-07]:not([data-colour-07="original"]) .object-image{background:var(--paper)}
html[data-colour-07]:not([data-colour-07="original"]) .chat-bubble{color:var(--ink)}
html[data-colour-07]:not([data-colour-07="original"]) .collab-tabs button.active,
html[data-colour-07]:not([data-colour-07="original"]) .collab-tabs button:hover{background:var(--ink);color:var(--yellow)}

/* RED: local black gives 5.00:1 on the red field; large display type may be white. */
html[data-colour-07="red"] .header,
html[data-colour-07="red"] .hero,
html[data-colour-07="red"] .together{--ink:#000000}
html[data-colour-07="red"] .wordmark{color:#FFFFFF}

/* 07 changes colour only. The original peeker position and clipping are deliberate. */
html[data-colour-07] .story{--ink:var(--c07-storyInk);color:var(--ink)}
html[data-colour-07="green"] .game-portal{--ink:#000000;color:var(--ink)}