.gp-patch-key{display:flex;gap:26px;justify-content:space-between;margin:24px 0 14px;font-size:12px;color:var(--mg-ui-muted)}
.gp-color-checker{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;margin-bottom:24px}.gp-patch{display:flex;aspect-ratio:1;overflow:hidden}.gp-patch i{display:block;flex:1}.gp-color-checker figcaption{font-size:13px;color:var(--mg-ui-muted);margin-top:9px}.gp-patch i:first-child{border-right:1px solid #ffffff33}
.gp-white-pair,.gp-night-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px}.gp-white-pair figcaption,.gp-night-pair figcaption{font-size:14px}.gp-night-pair figcaption{flex-wrap:wrap;gap:4px 14px}
.gp-still-life{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(145deg,#d1d1cd,#969694);isolation:isolate}.gp-still-life::after{content:'';position:absolute;inset:0;background:var(--gp-tint,transparent);mix-blend-mode:color;z-index:3;pointer-events:none}.gp-still-life::before{content:'';position:absolute;width:100%;height:35%;bottom:0;background:linear-gradient(170deg,#8b8c87,#c5c6bd)}
.gp-paper{position:absolute;width:24%;height:65%;top:11%;left:16%;background:linear-gradient(110deg,#eeeeea,#d0d1cb);transform:rotate(-11deg);box-shadow:16px 14px 15px #1519151a}.gp-sphere{position:absolute;width:30%;aspect-ratio:1;bottom:17%;left:37%;border-radius:50%;background:radial-gradient(circle at 33% 26%,#fff,#b4b6ac 60%,#6e7268);box-shadow:20px 17px 13px #171b171c;z-index:2}.gp-column{position:absolute;right:13%;top:29%;width:16%;height:51%;border-radius:50% 50% 10% 10%/7% 7% 4% 4%;background:linear-gradient(90deg,#6b7069,#b1b3ac 60%,#a1a59a);box-shadow:16px 14px 13px #171b1719;z-index:1}
.gp-still-result[data-white-state=warm]{--gp-tint:#be9233;filter:sepia(.22)}.gp-still-result[data-white-state=cool]{--gp-tint:#789bbd}.gp-still-result[data-white-state=neutral]{--gp-tint:transparent}
.gp-night-scene{display:block;width:100%;height:auto;border:1px solid var(--mg-ui-line);border-radius:3px;background:#05090f}
.gp-ambient-controls{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:25px}.gp-ambient-controls .gv-range{max-width:240px}
.gp-chroma-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:center}.gp-pixel-diagram{background:var(--mg-ui-soft);padding:26px}.gp-luma-grid,.gp-chroma-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.gp-luma-grid{margin-bottom:17px}.gp-luma-grid i{display:grid;place-items:center;aspect-ratio:1;background:#d4d8d5;color:#414943;font-size:13px;font-style:normal}.gp-chroma-grid i{display:block;aspect-ratio:1;background:#b37889}.gp-chroma-grid i:nth-child(3n){background:#689eae}.gp-chroma-grid i:nth-child(3n+1){background:#b7a268}.gp-pixel-diagram[data-chroma="422"] .gp-chroma-grid{grid-template-columns:repeat(2,1fr)}.gp-pixel-diagram[data-chroma="422"] .gp-chroma-grid i{aspect-ratio:2}.gp-pixel-diagram[data-chroma="422"] .gp-chroma-grid i:nth-child(n+5){display:none}.gp-pixel-diagram[data-chroma="420"] .gp-chroma-grid{grid-template-columns:repeat(2,1fr)}.gp-pixel-diagram[data-chroma="420"] .gp-chroma-grid i{aspect-ratio:1}.gp-pixel-diagram[data-chroma="420"] .gp-chroma-grid i:nth-child(n+3){display:none}.gp-chroma-count{display:block;font-size:19px;margin-bottom:14px}
.mg-guide-content .wp-block-details .gv{border:0;margin:24px 0 8px;padding:0}.mg-guide-content .wp-block-details .gv .gv-note{margin-top:18px}
@media(prefers-reduced-motion:no-preference){.gp-patch i,.gp-still-life::after,.gp-still-life{transition:background .5s ease,filter .5s ease}.gp-chroma-grid i{animation:gp-pixel-in .35s ease}@keyframes gp-pixel-in{from{opacity:.4}to{opacity:1}}}
@media(max-width:760px){.gp-color-checker{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 14px}.gp-white-pair,.gp-night-pair{gap:22px}.gp-night-pair{grid-template-columns:1fr}.gp-night-pair figcaption{margin-top:9px}.gp-ambient-controls{display:block}.gp-ambient-controls .gv-range{max-width:none;margin-top:22px}.gp-chroma-layout{grid-template-columns:1fr;gap:24px}.gp-pixel-diagram{max-width:430px;width:100%;margin:auto}.gp-patch-key{font-size:11px;gap:20px}}
@media(max-width:440px){.gp-white-pair{grid-template-columns:1fr}.gp-white-pair .gp-still-life{aspect-ratio:16/8}.gp-white-pair figcaption{margin-top:8px}}