.gm{--ink:#082c40;--blue:#0088b4;--rule:#c5dde7;--muted:#496070;--wash:#f2f8fa;--pad:max(5%,calc((100% - 1480px)/2));background:white;color:var(--ink);line-height:1.45}.gm *{box-sizing:border-box;min-width:0}.gm [hidden]{display:none!important}.gm :is(h1,h2,h3,p,dl,dd,figure,ul){margin:0}.gm :is(h1,h2,h3){line-height:1.06;letter-spacing:-.04em;color:var(--ink)}.gm h1{font-size:clamp(64px,8vw,128px)}.gm h2{font-size:clamp(34px,4.4vw,69px)}.gm h3{font-size:clamp(23px,2.9vw,46px)}.gm p,.gm dd,.gm-help{color:var(--muted);line-height:1.5;font-size:clamp(14px,1.3vw,20px)}.gm em{font-style:normal;color:var(--blue)}.gm h2:before,.gm-intro>p:before{content:"";display:block;width:35px;height:2px;background:var(--blue);margin:0 0 14px}.gm-intro>p:before{margin-top:24px}.gm img{display:block;max-width:100%}.gm a{color:#00729a;text-decoration:none}.gm :is(button,textarea,select){font:inherit;color:inherit}.gm :is(button,summary){cursor:pointer}.gm :is(a,button,select,textarea,input,summary):focus-visible{outline:3px solid #007baa;outline-offset:3px}.gm-pad{padding-inline:var(--pad)}.gm small{font-size:clamp(11px,.94vw,14px)}.gm .gm-go{display:inline-flex;gap:18px;align-items:center;min-height:44px;border-bottom:2px solid #0c98be;font-weight:600}.gm .gm-go:hover{color:#004964}
.gm-hero{position:relative;isolation:isolate;background:linear-gradient(120deg,#f5f5f2,white);min-height:clamp(390px,49.4vw,780px);display:flex;flex-direction:column;justify-content:center}.gm-hero-img{position:absolute;z-index:-1;right:0;top:0;width:58%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 15%)}.gm-hero nav{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:clamp(11px,1vw,15px);padding-block:10px;position:relative}.gm-hero nav a{color:var(--muted)}.gm-hero nav span{background:#d2eef8;border-radius:4px;padding:3px 8px}.gm-hero-copy{max-width:45%;padding:clamp(18px,3vw,50px) 0}.gm-hero-copy small{letter-spacing:.09em;color:#026588;font-weight:650}.gm-hero h1{margin:2.2vw 0 1.4vw}.gm-hero h3{font-weight:530}.gm-hero p{max-width:40ch;margin:2vw 0 1.5vw}.gm-hero p:before{content:"";display:block;background:var(--blue);height:2px;width:40px;margin-bottom:1.7vw}
.gm-studio{display:grid;grid-template-columns:20% 1fr;gap:2%;padding-block:clamp(18px,2.4vw,40px);background:linear-gradient(#fff,#fafbfa)}.gm-work{display:grid;grid-template-columns:1fr 23%;grid-template-rows:auto 1fr auto;column-gap:2.2%;align-items:center}.gm-tabs{grid-column:1;display:flex;justify-content:center;margin:0 auto 8px}.gm-tabs button{min-height:44px;padding-inline:clamp(12px,2vw,28px);background:none;border:0;border-bottom:1px solid var(--rule)}.gm-tabs [aria-pressed=true]{color:#007ca9;border-bottom:3px solid var(--blue);font-weight:650}.gm-display{grid-column:1;grid-row:2}.gm-display>small{font-style:italic;color:var(--muted)}.gm-board{position:relative}.gm-board img{width:100%;height:auto}.gm-cells{position:absolute;inset:0}.gm-cell{position:absolute;transform:translate(-50%,-50%);border:0;padding:0;background:transparent;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.gm-cell:after{content:"";position:absolute;inset:6%;clip-path:inherit;background-size:100% 100%}.gm-cell[data-painted][data-fill=g]:after,.gm-chip.fill-g{background-image:url('/images/grass-mosaic/grass.webp')}.gm-cell[data-painted][data-fill=m]:after,.gm-chip.fill-m{background-image:url('/images/grass-mosaic/stone.webp')}.gm-cell[data-painted][data-fill=e]:after,.gm-chip.fill-e,.gm-work[data-mode=doku] .gm-cell:after{background-image:url('/images/grass-mosaic/empty.webp')}.gm-cell:enabled:is(:hover,:focus-visible,.chosen){background:#009dcc}.gm-cell:enabled:is(:hover,:focus-visible,.chosen):not([data-painted]):after{background:#6ee0ff70}.gm-cell:disabled{cursor:default}.gm-edge{position:relative}.gm-edge img{width:100%;aspect-ratio:2;object-fit:cover}.gm-edge figcaption{position:absolute;bottom:9%;left:9%;background:#fff;padding:4px 12px;border-left:3px solid var(--blue)}.gm-tools{grid-column:2;grid-row:1/4;align-self:center;border-left:1px solid var(--rule);padding-left:10%}.gm-tools strong{font-size:clamp(14px,1.35vw,20px);display:block;margin-bottom:10px}.gm-fills button{background:none;border:0;display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:5px 0;color:var(--muted)}.gm-fills button:after{content:"";border:1px solid #8ba3b0;border-radius:50%;height:10px;width:10px;margin-left:auto}.gm-fills button[aria-pressed=true]:after{background:#009ccb;box-shadow:inset 0 0 0 2px white}.gm-chip{width:clamp(26px,3vw,42px);aspect-ratio:1;clip-path:polygon(50% 1%,99% 50%,50% 99%,1% 50%);background-size:100% 100%;display:block}.gm-reset,.gm-precision button{background:none;color:#026b90;border:none;min-height:44px;text-decoration:underline}.gm-status{font-size:.85em;grid-column:1}.gm-precision{display:none}
.gm-anatomy{display:grid;grid-template-columns:24% 76%;align-items:center;background:#f7f8f6}.gm-anatomy>.gm-intro{padding:2vw 0 2vw max(20px,21%)}.gm-intro [data-part-desc]{margin-top:20px}.gm-intro [data-part-desc] strong{font-size:.85em;color:#086588}.gm-macro{position:relative}.gm-macro>img{width:100%}.gm-spot{position:absolute;background:transparent;border:0;border-radius:30px;padding:0 5px;min-height:44px;display:flex;align-items:center;gap:5px;isolation:isolate;font-size:clamp(12px,1.1vw,18px)!important;font-weight:650!important;transform:translate(-50%,-50%)}.gm-spot:before{content:"";position:absolute;inset:12% -6%;border-radius:22px;background:white;box-shadow:0 2px 10px #0d293333;z-index:-1}.gm-spot span{color:#008ab8}.gm-spot[aria-pressed=true]:before{box-shadow:0 0 0 2px #0094c7}.gm-spot.spot-0{top:17%;left:19%}.gm-spot.spot-1{top:58%;left:80%}.gm-spot.spot-2{top:83.5%;left:9%}.gm-marker{position:absolute;width:18px;height:18px;border-radius:50%;border:3px solid white;background:#008eb8;box-shadow:0 0 0 5px #26a2ce55;left:27%;top:45%;transform:translate(-50%,-50%)}.gm-macro[data-part="1"] .gm-marker{left:64%;top:74%}.gm-macro[data-part="2"] .gm-marker{left:25%;top:93%}
.gm-layers{display:grid;grid-template-columns:24% 40% 1fr;gap:1%;align-items:center;padding-block:2vw}.gm-layers img{width:100%}.gm-layers figcaption{color:var(--muted);font-size:.8em;text-align:center}.gm-layers dl>div{padding:clamp(8px,.9vw,16px) 0;border-bottom:1px solid var(--rule)}.gm-layers dt{font-weight:650;font-size:clamp(16px,1.7vw,25px)}.gm-layers dt span{font-size:.68em;color:var(--blue);margin-right:10px}.gm-layers dd{font-size:clamp(13px,1.08vw,17px)}.gm-label{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:8%;padding-block:1.4vw;background:linear-gradient(100deg,#fafbfa,#fff)}.gm-label h2{font-size:clamp(54px,6.4vw,100px);margin:5px 0}.gm-label h2:before{display:none}.gm-label img{height:clamp(125px,17vw,260px);margin:auto;object-fit:contain}.gm-label>a{border-left:1px solid var(--rule)}.gm-label div>a{display:inline-flex;align-items:center;min-height:44px}
.gm-plan{position:relative;display:grid;grid-template-columns:72% 28%;align-items:stretch;background:#f6faf7}.gm-plan>img{width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,black 80%,transparent);min-height:220px}.gm-plan>div{padding:2vw 10% 2vw 1%}.gm-plan h2,.gm-links h2{font-size:clamp(21px,2.2vw,36px)}.gm-plan li{list-style:none;padding:4px 0}.gm-plan li:before{content:"✓";color:var(--blue);margin-right:10px}.gm-plan summary,.gm-links summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:9px;list-style:none;cursor:pointer}.gm summary:after{content:"+";color:var(--blue)}.gm details[open]>summary:after{content:"−"}.gm details{border-bottom:1px solid var(--rule)}.gm-checks label{display:flex;align-items:center;gap:8px;min-height:44px}.gm-checks input{accent-color:var(--blue)}.gm-plan button{min-height:44px;border:0;background:#057d9f;color:white;padding:8px 12px;border-radius:4px}.gm-plan details small,.gm-plan output,.gm-plan textarea{display:block;width:100%;margin:8px 0}.gm-plan textarea{background:white;padding:8px}.gm-plan:has(details[open]){align-items:start}.gm-plan:has(details[open])>img{height:auto;position:sticky;top:100px}
.gm-links{display:grid;grid-template-columns:40% 1fr;gap:4%;padding-block:2.6vw}.gm-links nav{border-left:1px solid var(--rule);padding-left:5%}.gm-links nav>div{display:grid;grid-template-columns:repeat(5,1fr);gap:2%}.gm-links h2{margin-bottom:15px}.gm-links nav img{width:100%;height:clamp(45px,6vw,90px);object-fit:cover}.gm-links nav strong,.gm-links nav span{display:block;font-size:clamp(12px,1vw,16px);line-height:1.3;margin-top:5px}.gm-links nav span{font-size:clamp(11px,.87vw,14px);color:var(--muted)}.gm-links details p{padding-bottom:12px}.gm-close{display:grid;grid-template-columns:1.6fr 1fr;align-items:center;gap:5%;background:#ecf6fa url('/images/grass-mosaic/foliage.webp') no-repeat right bottom;background-size:auto 85%;padding-block:2.5vw}.gm-close h2{font-size:clamp(30px,3.3vw,52px)}.gm-close p{margin-top:8px}.gm-close>div:last-child{display:grid;justify-items:start}.gm-close a{min-height:44px;display:inline-flex;align-items:center}.gm-close .gm-go{border:1px solid var(--blue);padding:6px 14px;background:white}
@media(min-width:701px) and (max-width:980px){.gm-tools{font-size:13px}.gm-hero-copy{max-width:46%}.gm-layers dd{font-size:12px}.gm-intro p,.gm-hero-copy p{font-size:13px}.gm-plan{grid-template-columns:68% 32%}}
@media(max-width:700px){.gm-hero{padding-top:6px;padding-bottom:0;min-height:0;display:flex}.gm-hero-img{position:static;order:3;width:calc(100% + 11.12%);max-width:none;margin-inline:-5.56%;height:auto;aspect-ratio:1.8;object-position:center 58%;mask-image:linear-gradient(180deg,transparent,#000 15%)}.gm-hero-copy{max-width:none;padding-block:16px 5px}.gm-hero nav{gap:5px}.gm-hero h1{font-size:60px;margin:14px 0 8px}.gm-hero p{margin:15px 0 7px}.gm-hero p:before{margin-bottom:10px}.gm-studio{display:block;padding-block:24px}.gm h2{font-size:32px}.gm-studio h2 br{display:none}.gm-studio .gm-intro>p:before{display:none}.gm-studio .gm-intro p{margin-top:8px}.gm-work{display:flex;flex-direction:column;align-items:stretch}.gm-display{order:2}.gm-tools{order:1;padding:0;border:0;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.gm-tools>strong{display:none}.gm-fills{display:flex;justify-content:space-between;flex:1}.gm-fills button{gap:5px;min-height:44px;width:auto}.gm-fills button:after{display:none}.gm-fills button[aria-pressed=true]{box-shadow:inset 0 -2px var(--blue)}.gm-chip{width:24px}.gm-reset{font-size:12px!important}.gm-tabs{margin:10px auto 3px}.gm-precision{display:flex;align-items:center;justify-content:center;gap:8px;order:3}.gm-precision select{min-height:44px}.gm-status{order:4}.gm-anatomy{grid-template-columns:1fr}.gm-anatomy>.gm-intro{padding:20px 5% 12px}.gm-anatomy h2 br{display:none}.gm-intro [data-part-desc]{margin-top:8px}.gm-macro{width:100%}.gm-macro img{width:100%}.gm-spot{font-size:11px!important}.gm-spot:before{inset:18% -2%}.gm-spot.spot-2{left:12%}.gm-layers{grid-template-columns:1fr;gap:12px;padding-block:22px}.gm-layers figure{width:min(80%,340px);margin:auto}.gm-intro>p:before{margin:12px 0}.gm-label{gap:6%;grid-template-columns:1.4fr 1fr;padding-block:20px}.gm-label h2{font-size:44px}.gm-label img{height:auto;max-height:155px}.gm-plan{grid-template-columns:1fr}.gm-plan>img,.gm-plan:has(details[open])>img{position:static;min-height:0;height:auto;mask-image:none}.gm-plan>div{padding:20px 5%}.gm-plan ul{display:grid;grid-template-columns:1fr 1fr;padding:10px 0}.gm-checks{display:grid;grid-template-columns:1fr 1fr}.gm-links{grid-template-columns:1fr;gap:20px;padding-block:24px}.gm-links nav{padding:0;border:0}.gm-links nav>div{grid-template-columns:repeat(3,1fr);gap:13px}.gm-close{grid-template-columns:1fr;padding-block:22px;gap:12px;background-size:auto 45%}.gm-close h2{font-size:29px}}
@media(prefers-reduced-motion:no-preference){.gm-marker{transition:top .2s,left .2s}.gm-edge:not([hidden]),.gm-intro [data-part-desc]:not([hidden]){animation:gm-reveal .18s ease-out}@keyframes gm-reveal{from{opacity:.55}to{opacity:1}}}
.gm-layers .gm-intro h2{font-size:clamp(27px,3.6vw,58px)}
.gm-precision select{background:white;color:var(--ink);border:1px solid var(--rule);border-radius:4px;padding-inline:8px}
@media(max-width:700px){.gm-hero-img{align-self:center;width:100vw;max-width:none;margin:0;aspect-ratio:auto;object-fit:contain;height:auto}.gm-layers .gm-intro h2{font-size:32px}.gm-fills button[aria-pressed=true]{color:#00698d;font-weight:700}}

/* Semantic heading levels retain the approved typography. */
.gm .gm-hero .gm-hero-subtitle{font-size:clamp(23px,2.9vw,46px);font-weight:530;line-height:1.06;letter-spacing:-.04em;margin:0}
.gm .gm-hero-subtitle::before,.gm .gm-hero-subtitle::after{content:none!important}