.gf{margin:var(--space-lg) 0;padding:var(--space-lg);background:var(--color-card);border-radius:var(--radius-card);outline:1px solid var(--color-rule);display:grid;gap:var(--space-md);max-width:70ch}.gf-title{font-weight:500}.gf figcaption{color:var(--color-muted);font-size:var(--text-sm)}.gf-row{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.gf-btn{font:500 var(--text-sm)/1 var(--font-body);min-height:44px;padding:0 var(--space-md);border-radius:var(--radius-pill);border:0;background:var(--color-paper-2);color:var(--color-ink);box-shadow:inset 0 0 0 1px var(--color-rule-2);cursor:pointer}.gf-btn:hover{background:var(--color-paper-3)}.gf-btn[aria-pressed=true]{background:var(--color-ink);color:var(--color-accent-ink);box-shadow:none}.gf-btn:focus-visible,.gf input:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.gf-label{font:500 var(--text-sm)/1 var(--font-body);color:var(--color-muted)}.gf-group{display:grid;gap:var(--space-xs)}.gf-group+.gf-group{margin-top:var(--space-xs)}.gf-detail,.gf-out,.gf-sample{background:var(--color-accent-soft);border-radius:16px;padding:var(--space-sm) var(--space-md);max-width:none}.gf-out{white-space:pre-line;background:var(--color-paper-2)}.gf-sample mark{background:transparent;color:var(--color-ink-2);border-radius:4px;padding:0 2px}.gf-sample mark.on{background:var(--color-yellow);color:var(--color-ink)}.gf-phone-row,.gf-controls{display:flex;flex-wrap:wrap;gap:var(--space-lg);align-items:center}.gf-phone-row>.gf-controls{flex:1 1 15rem;min-width:0;flex-direction:column;align-items:stretch;gap:var(--space-xs)}.gf-right i{writing-mode:vertical-rl;font-style:normal}.gf-controls fieldset{border:0;padding:0;margin:0 0 var(--space-sm);display:grid;gap:var(--space-xs)}.gf-controls legend{font-weight:500;margin-bottom:var(--space-xs)}.gf-controls label,.gf-fields label{display:flex;gap:var(--space-xs);align-items:center}.gf-controls input[type=radio],.gf-controls input[type=checkbox]{width:1.1rem;height:1.1rem;accent-color:var(--color-accent)}.gf-phone{position:relative;width:190px;aspect-ratio:9 / 16;background:#111;border-radius:22px;padding:6px;overflow:hidden;flex:none}.gf-phone .gf-vid{position:absolute;inset:6px;border-radius:16px;background:linear-gradient(160deg,#3b4a8f,#8f3b5a);display:grid;place-items:center;color:#fff;font-size:var(--text-xs);overflow:hidden}.gf-phone .gf-vid[data-ratio="1:1"]{inset:50% 6px auto;transform:translateY(-50%);aspect-ratio:1}.gf-phone .gf-vid[data-ratio="16:9"]{inset:50% 6px auto;transform:translateY(-50%);aspect-ratio:16 / 9}.gf-zone{position:absolute;background:#ffffff38;border:1px dashed rgba(255,255,255,.7);color:#fff;font-size:10px;display:grid;place-items:center;text-align:center}.gf-zone[hidden]{display:none}.gf-top{inset:6px 6px auto;height:11%;border-radius:16px 16px 0 0}.gf-right{right:6px;top:46%;width:15%;height:28%}.gf-bottom{inset:auto 6px 6px;height:24%;border-radius:0 0 16px 16px}.gf-cap{position:absolute;left:17%;width:66%;text-align:center;background:var(--color-yellow);color:var(--color-ink);font:600 11px/1.2 var(--font-body);padding:4px 6px;border-radius:6px;transform:translateY(-50%)}.gf-wide{width:100%;max-width:480px;border-radius:12px;display:block}.gf-narrow{width:110px;height:auto;border-radius:12px;border:4px solid #111;flex:none}.gf-slider{display:grid;gap:var(--space-xs);max-width:480px;font-weight:500}.gf-slider input{width:100%;accent-color:var(--color-accent)}.gf-fields{display:grid;gap:var(--space-sm);grid-template-columns:1fr 1fr}.gf-fields label{flex-direction:column;align-items:stretch;font-weight:500;font-size:var(--text-sm)}.gf-fields label:first-child{grid-column:1 / -1}.gf-fields input,.gf-result input{min-height:44px;padding:0 var(--space-sm);border-radius:var(--radius-btn);border:0;background:var(--color-paper-2);box-shadow:inset 0 0 0 1px var(--color-rule-2);font:400 var(--text-sm)/1 var(--font-body);width:100%}.gf-result{display:flex;gap:var(--space-xs);align-items:end;margin-top:var(--space-sm)}.gf-result label{flex:1;display:grid;gap:var(--space-2xs);font-size:var(--text-sm);font-weight:500}@media(max-width:480px){.gf{padding:var(--space-md)}.gf-fields{grid-template-columns:1fr}}@media(prefers-reduced-motion:no-preference){.gf-btn{transition:background-color .15s}}.guide-toc{background:var(--color-paper-2);border-radius:var(--radius-card);padding:var(--space-md) var(--space-lg);max-width:70ch}.guide-toc p{font:500 var(--text-sm)/1 var(--font-body);color:var(--color-muted);margin-bottom:var(--space-sm)}.guide-toc ol{margin:0;padding-left:var(--space-lg);columns:2 14rem;column-gap:var(--space-xl)}.guide-toc a{text-decoration:none;color:var(--color-ink-2)}.guide-toc a:hover{color:var(--color-accent);text-decoration:underline}.prose h2[id]{scroll-margin-top:var(--space-xl)}