/* Layout follows text flow; no words or labels are burned into a bitmap. */
.guide-illustration{min-inline-size:0;container-type:inline-size;width:100%;--gui-blue:#315fc7;--gui-coral:#ff8c87;--gui-ink:#181a22;--gui-muted:#626573;--gui-line:#dce0ea}
.gui-screen{border:1px solid var(--gui-line);border-radius:18px;background:#f7f8fc;box-shadow:0 8px 25px -22px #181a2255}
.gui-surface{padding:clamp(16px,6cqw,26px);display:flex;flex-direction:column;gap:clamp(12px,4cqw,20px);font-family:var(--text,Arial),"Noto Sans",sans-serif;font-size:clamp(12px,4.3cqw,18px);line-height:1.5;color:var(--gui-ink);text-align:start;overflow-wrap:anywhere}
.gui-surface *{box-sizing:border-box;min-inline-size:0}.gui-surface p,.gui-surface h4{margin:0}.gui-surface p+p{margin-top:.65em}.gui-surface h4{font:800 1.22em/1.3 var(--display,inherit)}.gui-surface small{font-size:.88em;color:var(--gui-muted);display:block}.gui-surface strong{font-weight:750}.gui-surface bdi{overflow-wrap:anywhere}
.gui-header{display:flex;align-items:center;gap:.7em;padding-bottom:.8em;border-bottom:1px solid var(--gui-line);font-size:1.14em}.gui-header .gui-logo{inline-size:2.3em;block-size:1.5em;object-fit:contain}.gui-logo{display:block;max-inline-size:100%}
.gui-card{background:#fff;border:1px solid var(--gui-line);border-radius:1em;padding:1em;display:flex;flex-direction:column;gap:.8em}
.gui-row{display:flex;align-items:center;flex-wrap:wrap;gap:.65em}.gui-row>.gui-control{flex:1 1 70px}.gui-row>.gui-icon{flex:none}.gui-row>strong{flex:1}
.gui-control{padding:.7em .75em;border:1px solid #b8becd;border-radius:.75em;display:flex;gap:.4em;align-items:center;justify-content:center;text-align:center;font-size:.93em;font-weight:700;line-height:1.35;background:#fff;color:var(--gui-ink);overflow-wrap:anywhere}
.gui-primary{background:var(--gui-blue);color:#fff;border-color:var(--gui-blue)}.gui-coral{background:var(--gui-coral);border-color:var(--gui-coral)}.gui-soft{background:#eef3ff}.gui-good{background:#e8f7f4;border-color:#87bfae}.gui-warn{background:#fff6db;border-color:#e4cd8a}.gui-danger{color:#b61f3c;border-color:#b61f3c}.gui-muted{color:var(--gui-muted)}.gui-success{color:#177d62}.gui-outgoing{background:#ffe2df;margin-inline-start:1.5em}
.gui-icon{inline-size:1.25em;block-size:1.25em;flex-shrink:0;vertical-align:middle}.gui-field{display:grid;gap:.35em}.gui-input{border:1px solid var(--gui-line);background:#fff;border-radius:.7em;padding:.85em;display:flex;gap:.6em;align-items:center;flex-wrap:wrap}.gui-input>.gui-icon:last-child{margin-inline-start:auto}.gui-textarea{min-block-size:5em;align-items:start;color:var(--gui-muted)}
.gui-badge{display:flex;align-items:center;gap:.55em;font-size:.9em;font-weight:700}.gui-badge i{width:.65em;height:.65em;border-radius:50%;background:#737785;flex:none}.gui-live i{background:#b9273b}.gui-toggle{inline-size:2.5em;block-size:1.5em;border-radius:2em;background:#177d62;margin-inline-start:auto;flex:none;display:flex;justify-content:flex-end;align-items:center;padding:.18em}.gui-toggle:after{content:'';display:block;inline-size:1.12em;block-size:1.12em;border-radius:50%;background:white}
.gui-meter{display:flex;gap:3px;flex:1}.gui-meter i{flex:1;block-size:.8em;background:var(--level);border-radius:2px}.gui-viewer-head{display:flex;align-items:center;gap:.5em;justify-content:space-between}.gui-round{border:1px solid var(--gui-line);border-radius:50%;padding:.5em;color:var(--gui-blue);display:flex}
.gui-reading{font-size:1.12em;line-height:1.5}.gui-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5em;border-top:1px solid var(--gui-line);padding-top:.8em;margin-top:.4em}.gui-toolbar .gui-control{display:flex;flex-direction:column;height:100%;padding:.6em .25em;font-size:.84em}.gui-toolbar .gui-icon{inline-size:1.45em;block-size:1.45em}.gui-question{font-size:1.1em;font-weight:700}
.gui-focus.hl{position:relative;inset:auto;z-index:auto;border:2px solid #315fc7;border-radius:.85em;box-shadow:0 0 0 2px white;padding:.35em;pointer-events:auto;display:flex;flex-direction:column;gap:.65em;margin:4px 0}.gui-focus .gui-focus{margin:0}.gui-focus.hl.is-hot{border-width:3px;background:#eef3ff}.gui-pin.mk{position:absolute;display:grid;place-items:center;border-radius:50%;box-shadow:0 0 0 2.5px #fff,0 2px 7px #181a2244;inset-inline-start:-13px;inset-block-start:50%;transform:translateY(-50%);width:25px;height:25px;min-width:25px;padding:0;font-size:11px;background:#315fc7;color:#fff}.gui-focus[data-ref='']{border:0;box-shadow:none;padding:0}.gui-focus[data-ref='']>.gui-pin{display:none}
.gui-share-qr{display:flex;gap:1em;align-items:center;flex-wrap:wrap}.gui-share-qr>bdi{font-weight:700;font-size:.9em}.gui-qr{inline-size:8em;position:relative;background:white;color:#181a22;flex:none;padding:.35em}.gui-qr>svg{display:block;inline-size:100%}.gui-qr>span{position:absolute;inset:38% 0 auto;background:white;border-block:2px solid white;font-size:.68em;line-height:1.4;font-weight:800;text-align:center}
.gui-group{align-items:center;display:flex;flex-direction:column;text-align:center;gap:1em;padding:1em 0}.gui-group>.gui-focus,.gui-group>.gui-control{width:100%}.gui-avatar{inline-size:7em;block-size:7em;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--gui-line)}.gui-avatar .gui-logo{width:5.4em;height:3.6em}.gui-group h4{font-size:1.55em}.gui-group small{font-size:1em}.gui-modal{box-shadow:0 14px 28px #181a2222;margin-block:1.5em}
.gui-dark{background:#181a22;color:#fff;border-color:#353945}.gui-dark small,.gui-dark .gui-muted{color:#bac0d1}.gui-dark .gui-card{background:#252936;color:#fff}.gui-dark .gui-control{background:#252936;color:#fff;border-color:#555d70}.gui-dark .gui-focus{box-shadow:none}
.guide-step-image:has(.guide-illustration){max-width:360px;width:100%}.guide-step-image .guide-illustration{--gui-font:12px}.guide-step-image .gui-surface{text-align:start}.guide-step-image .gui-logo{width:2.3em;height:1.5em}.guide-step-image .gui-avatar .gui-logo{width:5.4em;height:3.6em}
@media print{.gui-screen{box-shadow:none}.guide-illustration{break-inside:avoid}.gui-surface{font-size:10px;padding:12px}.gui-card{padding:.8em}}
