.guide-invitation{position:relative;align-self:stretch;background:#f5f6ef;border-radius:22px;padding:30px 22px!important;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;overflow:hidden}
.guide-invitation h2{font-size:clamp(28px,3vw,44px);line-height:1.05;margin:22px 0 15px;letter-spacing:-1.5px}
.guide-invitation h2 em{font-family:'DM Serif Display',Georgia,serif;color:#2349df;font-weight:400}
.guide-invitation>p:not(.eyebrow){font-size:15px!important;line-height:1.5;max-width:230px}
.guide-invitation .text-button{margin-top:20px;font-size:14px;text-align:left}
.guide-tile-mark{display:flex;gap:8px;margin-top:15px}
.guide-tile-mark span{display:grid;place-items:center;border-radius:15px 15px 15px 3px;background:white;width:43px;height:39px;font-size:24px;color:#2349df;transform:rotate(-7deg)}
.guide-tile-mark span+span{background:#e7f6a2;color:#29412b;transform:translateY(9px) rotate(7deg)}
#guide-dialog{position:fixed;inset:0;margin:auto;width:min(1000px,94vw);height:min(880px,94dvh);max-width:none;max-height:none;padding:0;border:1px solid #ffffffab;border-radius:26px;background:#f8f9f5f5;color:#20271d;box-shadow:0 24px 100px #14201826;overflow:hidden}
#guide-dialog[open]{display:flex;flex-direction:column;animation:g-arrive .3s ease both}
#guide-dialog::backdrop{background:#24302129;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#guide-dialog button,#guide-dialog input{font-family:inherit}
#guide-dialog button{cursor:pointer}
#guide-dialog button:focus-visible,#guide-dialog summary:focus-visible{outline:2px solid #2349df;outline-offset:3px}
.g-header{display:flex;align-items:center;gap:14px;padding:22px 24px 12px;flex:none}
.g-icon-button{border:0;border-radius:50%;background:white;width:40px;height:40px;flex:none;color:#273323;font-size:23px}
.g-header h2{font-size:26px;line-height:1.1;letter-spacing:-.8px;font-weight:500;margin:0}
.g-eyebrow{font-size:9px;letter-spacing:1.3px;color:#727b6d;margin:0 0 6px}
.g-total{font-size:12px;color:#717a6c;margin-left:auto;white-space:nowrap}
.g-search-wrap{padding:10px 24px 16px;flex:none}
.g-search{display:flex;align-items:center;gap:10px;background:#ebeee6;border-radius:18px;padding:3px 12px;min-height:48px;border:1px solid transparent}
.g-search:focus-within{border-color:#a4b193;background:#fff}
.g-search svg{width:21px;height:21px;flex:none;color:#737d6c}
.g-search input{width:100%;min-width:0;border:0;outline:0;background:none;font-size:15px;color:#20271d;padding:10px 0}
.g-search input::-webkit-search-cancel-button{display:none}
.g-search input::placeholder{color:#778170}
.g-search button{width:30px;height:30px;background:transparent}
.g-search-wrap>p{font-size:12px;color:#778170;margin:9px 0 0 3px}
.g-layout{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:0;flex:1;border-top:1px solid #e5e8df}
#guide-categories{overflow-y:auto;overscroll-behavior:contain;padding:20px 12px 24px;border-right:1px solid #e5e8df}
.g-nav-label{font-size:9px;letter-spacing:1.3px;color:#7a8372;margin:0 12px 12px}
.g-category{display:flex;align-items:center;gap:11px;border:0;background:transparent;border-radius:16px;padding:14px 10px;width:100%;color:inherit;text-align:left}
.g-category[aria-pressed=true]{background:#eaf0df}
.g-category-mark{width:39px;height:39px;display:grid;place-items:center;border-radius:14px;background:#e5eafb;color:#2349df;flex:none;font-family:'DM Serif Display',Georgia,serif;font-size:20px}
.g-colour-1,.g-colour-4{background:#f6e6d7;color:#a95631}.g-colour-2,.g-colour-5{background:#efe5ec;color:#915c7d}.g-colour-3,.g-colour-6,.g-colour-7{background:#e7eddc;color:#45633b}
.g-category-copy{min-width:0;flex:1}
.g-category strong{display:block;font-size:13px;font-weight:550;line-height:1.3}
.g-category small{display:block;font-size:11px;line-height:1.45;color:#7b8374;margin-top:4px}
.g-category-count{font-size:10px;color:#92998d;flex:none}
.g-category-count span{font-size:18px;margin-left:4px}
.g-results-panel{overflow-y:auto;overscroll-behavior:contain;padding:18px 24px 30px;min-width:0}
.g-results-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;min-height:20px}
#guide-result-count{font-size:11px;color:#7b8374;margin:0}
.g-back{display:none;border:0;background:none;padding:6px 0;color:#42553b;font-size:13px}
.g-section-title{font-size:25px;letter-spacing:-.7px;font-weight:500;line-height:1.15;margin:0 0 15px}
.g-intro{font-size:14px;line-height:1.5;color:#747e6b;margin:0 0 22px}
.g-idea{background:white;border:1px solid #e5e8df;border-radius:19px;margin:0 0 12px;overflow:hidden}
.g-idea summary{padding:19px;cursor:pointer;list-style:none}
.g-idea summary::-webkit-details-marker{display:none}
.g-agent{font-size:10px;color:#53664b;line-height:1.5}
.g-agent>span{color:#8c9485}
.g-idea h3{font-size:18px;line-height:1.3;font-weight:500;letter-spacing:-.35px;margin:8px 0}
.g-idea summary>p{font-size:13px;line-height:1.5;color:#7a8373;margin:0}
.g-expand{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#3f5334;margin-top:14px}
.g-expand span{font-size:20px;transition:transform .2s}
.g-idea[open] .g-expand span{transform:rotate(45deg)}
.g-steps{padding:0 19px 20px}
.g-step{display:flex;gap:10px;margin-top:10px}
.g-step-number{display:grid;place-items:center;width:24px;height:24px;background:#f0f3ea;border-radius:50%;flex:none;font-size:11px;color:#627454}
.g-steps h4{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#708163;font-weight:550;margin:3px 0 8px}
.g-steps p{font-size:14px;line-height:1.55;margin:0;color:#34432b}
.g-instruction{background:#edf6d8;border-radius:16px 16px 4px 16px;padding:16px;margin:17px 0 18px 20px}
.g-instruction button{display:flex;gap:20px;align-items:center;background:#fff;border:1px solid #dce8c6;border-radius:20px;color:#35492a;font-size:12px;padding:9px 13px;margin-top:14px}
.g-follow{border-left:2px solid #dce4d2;padding:1px 0 1px 12px;margin:17px 0 0 34px}
.g-steps .g-note{font-size:11px;line-height:1.5;color:#87917b;margin:17px 0 0}
.g-copy-status{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;background:#273722;color:white;border-radius:14px;padding:12px 17px;font-size:12px;line-height:1.5;box-shadow:0 5px 20px #0002;pointer-events:none;margin:0}
.g-copy-status:empty{display:none}
.g-empty{padding:25px 0}.g-empty h3{font-size:18px;font-weight:500}.g-empty p{font-size:14px;color:#737e69;line-height:1.5}.g-empty button{background:#e7f6a2;border:0;border-radius:20px;padding:11px 16px;color:#2f4224}
@keyframes g-arrive{from{opacity:0;translate:0 9px}to{opacity:1;translate:0 0}}
@media(hover:hover){.g-category:hover{background:#edf1e8}.g-idea summary:hover{background:#fafbf7}.guide-invitation .text-button:hover{color:#2349df}.g-instruction button:hover{background:#f7fbee}}
@media(max-width:760px){
 .guide-invitation{padding:22px 16px!important}.guide-invitation h2{font-size:31px}.guide-invitation>p:not(.eyebrow){font-size:13px!important}.guide-invitation .text-button{font-size:12px;line-height:1.5}.guide-invitation .eyebrow{font-size:9px;letter-spacing:1px}
 #guide-dialog{width:100%;height:100dvh;border:0;border-radius:0;background:#f8f9f6}
 .g-header{padding:calc(15px + env(safe-area-inset-top)) 16px 10px;gap:10px}.g-header h2{font-size:23px}.g-header .g-total{display:none}
 .g-search-wrap{padding:8px 16px 16px}.g-search input{font-size:16px}.g-search{border-radius:16px}.g-eyebrow{font-size:8px}
 .g-layout{display:block;overflow:hidden;position:relative}
 #guide-categories{height:100%;border:0;padding:18px 12px max(24px,env(safe-area-inset-bottom))}
 .g-category{padding:17px 7px;border-radius:0;border-bottom:1px solid #e6e9e0;gap:13px}
 .g-category-mark{width:48px;height:48px;border-radius:17px;font-size:24px}.g-category strong{font-size:16px}.g-category small{font-size:12px}.g-category-count{font-size:11px}
 .g-results-panel{display:none;height:100%;padding:12px 16px max(25px,env(safe-area-inset-bottom))}
 .g-browsing #guide-categories{display:none}.g-browsing .g-results-panel{display:block}.g-back{display:block}
 .g-section-title{font-size:25px}.g-idea h3{font-size:18px}.g-instruction{margin-left:12px}
}
@media(prefers-reduced-motion:reduce){#guide-dialog[open],.g-expand span{animation:none;transition:none}}

/* Guide cover follows the gallery image-and-caption layout. */
.guide-card{min-width:0}
.guide-card .story-image{background:#183b29}
.guide-card .story-image img{object-fit:contain}
.guide-card:focus-within .story-caption h2{text-decoration:underline;text-underline-offset:4px}
