.google-ai-mode-flow-embed .mode-board[data-ai-mode-board]{container-type:inline-size;container-name:mode-board;margin:2rem 0;padding:clamp(1rem,3vw,1.8rem);border:1px solid #34536a;border-radius:1.3rem;background:#081c30;color:#f6fbff;font:inherit;line-height:1.55;position:relative}
.google-ai-mode-flow-embed .mode-board *, .google-ai-mode-flow-embed .mode-publisher *{box-sizing:border-box}.mode-board [hidden]{display:none!important}
.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] h2{max-width:none;margin:.25rem 0 .65rem;color:#f6fbff;font-size:clamp(1.5rem,3vw,2rem);line-height:1.15;letter-spacing:-.02em}
.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] h3{max-width:none;margin:.9rem 0 .35rem;color:inherit;font-size:.85rem;line-height:1.3}
.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] p{max-width:none;margin:.6rem 0;color:inherit;font-size:inherit;line-height:inherit}
.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] .mode-board__notice{font-size:.76rem;color:#c6d9e8}.mode-board__controls,.mode-board__concepts{border:0;padding:0;margin:1rem 0;display:flex;gap:.65rem;flex-wrap:wrap}.mode-board__controls legend,.mode-board__concepts legend{width:100%;margin-bottom:.65rem;font-size:.8rem;font-weight:750}.mode-board__controls label,.mode-board__concepts label{display:flex;align-items:center;gap:.55rem;min-height:2.75rem;padding:.5rem .75rem;border:1px solid #54758a;border-radius:.5rem;background:#102b43;font-size:.8rem;cursor:pointer}.mode-board input{margin:0;min-width:1rem;min-height:1rem;accent-color:#9ce6ce}.mode-board :focus-visible,.mode-publisher :focus-visible{outline:3px solid #a8edff;outline-offset:4px}
.mode-board__graph{position:relative;display:grid;gap:1rem;align-items:start;padding:.7rem}.mode-board__arrows{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.mode-board__hub{position:relative;z-index:1;border:1px solid #9ce6ce;border-radius:.7rem;background:#163d46;padding:1rem;font-size:.9rem}.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] .mode-board__eyebrow{color:#9ce6ce;font-size:.66rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] .mode-board__requirements{font-size:.7rem;color:#c6d9e8}.mode-board__requirements>span{display:block;margin-top:.2rem}.mode-board__branch{position:relative;z-index:1;border:1px solid #54758a;border-radius:.7rem;background:#102b43}.mode-board__branch summary{display:grid;gap:.6rem;min-height:6.5rem;padding:1rem;cursor:pointer;list-style:none}.mode-board__branch summary::-webkit-details-marker{display:none}.mode-board__branch-name{font-size:.95rem;font-weight:750;line-height:1.3}.mode-board__tag{justify-self:start;padding:.2rem .45rem;border-radius:.3rem;background:#183f36;color:#b0eed7;font-size:.65rem;font-weight:750}.mode-board__branch[data-active="false"] .mode-board__tag{background:#253b61;color:#cadfff}.mode-board__branch-content{padding:.4rem 1rem 1rem;border-top:1px solid #44637a;font-size:.84rem}.mode-board[data-enhanced] .mode-board__branch[aria-current="step"]{outline:2px solid #9ce6ce;outline-offset:3px}.mode-board__inspector{margin-top:1rem;padding:1.1rem;border:1px solid #63859a;border-radius:.7rem;background:#102b43;font-size:.85rem}.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] .mode-board__inspector>h3{margin:.3rem 0 .65rem;font-size:1.2rem;line-height:1.25}.google-ai-mode-flow-embed .mode-board[data-ai-mode-board] .mode-board__concept-status{font-size:.73rem;color:#c6d9e8}.mode-board__actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}.mode-board button{min-height:2.75rem;padding:.55rem .8rem;border:1px solid #54758a;border-radius:.5rem;background:#16384b;color:#f6fbff;font:inherit;font-size:.8rem;cursor:pointer}.mode-board button:disabled{opacity:.5;cursor:default}.mode-board footer{margin-top:1rem;padding-top:.6rem;border-top:1px solid #44637a;font-size:.8rem}.mode-board__scope{margin-top:.9rem;font-size:.77rem}.mode-board__scope summary,.mode-publisher summary{cursor:pointer;font-weight:750}.mode-board__scope a{color:#a8edff;text-decoration:underline;text-underline-offset:.16em}.mode-publisher{padding:1rem 1.2rem;margin:1rem 0 2rem;border:1px solid #9bb9cb;border-radius:.7rem;background:#f0f7fc;color:#143b55;font-size:.86rem}.google-ai-mode-flow-embed .mode-publisher p{max-width:none;margin:.75rem 0;color:inherit;font-size:inherit;line-height:1.55}.mode-publisher a{color:#143b55;text-decoration:underline}
@container mode-board (min-width:34rem){.mode-board[data-enhanced] .mode-board__graph{grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 1.5rem}.mode-board__hub{grid-column:1/-1}.mode-board[data-enhanced] .mode-board__arrows{display:block}.mode-board[data-enhanced] .mode-board__branch-content{display:none}}
@container mode-board (max-width:33.99rem){.mode-board[data-enhanced] .mode-board__inspector{display:none}.mode-board[data-enhanced] .mode-board__branch:not([aria-current="step"]) .mode-board__branch-content{display:none}.mode-board__graph{padding:.3rem}.mode-board__controls label{flex:1 1 10rem}}
.post-shell .prose figure img[src="/assets/images/posts/how-google-ai-mode-works/how-google-ai-mode-works-vertical-infographic.webp"]{aspect-ratio:auto;height:auto;object-fit:contain}
@media(prefers-reduced-motion:no-preference){.mode-board__branch{transition:background-color .15s}}