/* Four small scenes share the approved chat's warm, flat interface style. */
#ablauf [data-hcard]>.aw-step-scene{width:272px;height:166px;right:28px;top:25%;color:#38273f;scale:.86;transform-origin:100% 0}
.aw-step-scene *{box-sizing:border-box}
.aw-step-scene svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.aw-process-panel{width:252px;max-width:100%;height:166px;margin-left:auto;padding:10px;background:#f8f2f0;border:1px solid #fff9;border-radius:14px;box-shadow:0 14px 30px #0b061b33;font:500 10px/1.35 'Hanken Grotesk',sans-serif;rotate:-2deg}
.aw-p-chat-head{display:flex;gap:7px;align-items:center;height:32px;padding-bottom:5px;border-bottom:1px solid #3b244612;margin-bottom:8px}
.aw-p-chat-head>b{display:grid;place-content:center;width:26px;height:26px;flex:none;background:#281a38;color:#fff3ec;border-radius:8px;font:800 17px/1 'Archivo',sans-serif;position:relative}
.aw-p-chat-head>b span{color:#ff995a;position:absolute;right:4px;bottom:4px}
.aw-p-chat-head strong{display:block;font-size:10px}
.aw-p-chat-head small{display:flex;align-items:center;gap:4px;font-size:8px;color:#83718c;margin-top:2px}
.aw-p-chat-head small i{width:4px;height:4px;border-radius:50%;background:#4b966d}
.aw-p-chat-head em{margin-left:auto;font-size:7px;letter-spacing:.03em;color:#8a7b92;font-style:normal}
.aw-process-chat{display:grid;grid-template-rows:32px 44px 29px 22px;gap:5px}
.aw-process-chat .aw-p-chat-head{margin-bottom:0}
.aw-p-message{padding:5px 9px;width:84%;border-radius:9px;margin:0;font-size:10px;line-height:1.35}
.aw-p-message-out{margin-left:auto;background:#7950b7;color:#fff7ff;border-bottom-right-radius:2px}
.aw-p-message small{font-size:6px;display:block;text-align:right;opacity:.65;margin-top:3px}
.aw-p-message-in{background:#e8dfed;border-bottom-left-radius:2px;align-self:start}
.aw-p-composer{border:1px solid #c8b9d3;border-radius:16px;padding:5px 8px;display:flex;align-items:center;justify-content:space-between;color:#98879d;font-size:8px}
.aw-p-composer svg{color:#8054b3;width:12px;height:12px}
/* A website sketch, an inline correction and a finished page, without device chrome or photographs. */
.aw-p-draft-page{border:1px solid #d7c9df;border-radius:8px;overflow:hidden;background:#fffaf8}
.aw-p-mini-nav{display:flex;justify-content:space-between;gap:5px;align-items:center;padding:6px 8px;font-size:5px;color:#8d7994;border-bottom:1px solid #e8dfed}
.aw-p-mini-nav strong{font-size:7px;color:#3c2945}
.aw-p-draft-layout{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;background:#e8dfed;color:#65418d}
.aw-p-draft-layout>span{font-size:12px;line-height:1.15}.aw-p-draft-layout strong{font:800 19px/1.1 'Archivo',sans-serif;letter-spacing:-.04em}
.aw-p-draft-layout>div{width:55px;display:grid;grid-template-columns:1fr 1fr;gap:4px}.aw-p-draft-layout i{display:block;height:15px;border-radius:3px;background:#ad8acc}.aw-p-draft-layout i:first-child{grid-column:1/-1;background:#7950b7}
.aw-p-draft-columns{display:flex;justify-content:space-around;gap:5px;padding:7px 4px;font-size:6px;color:#796183}
.aw-p-editor{padding:3px 1px}.aw-p-editor>small{display:block;font-size:8px;color:#83718c;margin:0 0 6px}
.aw-p-text-edit{padding:9px;border:1px solid #b693d1;border-radius:8px;background:#fffaf8;font:700 14px/1.2 'Hanken Grotesk',sans-serif;white-space:nowrap;color:#392441}
.aw-p-text-edit>i{display:inline-block;width:1px;height:13px;background:#7950b7;vertical-align:-2px;margin-left:3px}
.aw-p-feedback{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#e8dfed;border-radius:8px;padding:7px 9px;margin-top:8px;color:#684181;font-size:9px}.aw-p-feedback svg{width:12px;height:12px}
.aw-p-live-preview{padding:8px 10px;border-radius:8px;background:#e8dfed;color:#65418d}
.aw-p-live-preview>span{display:block;font-size:6px;letter-spacing:.06em;color:#83718c}.aw-p-live-preview>strong{display:block;margin:3px 0 6px;font:800 20px/1.1 'Archivo',sans-serif;letter-spacing:-.04em}
.aw-p-live-preview>div{display:flex;gap:5px}.aw-p-live-preview i{display:block;width:30%;height:8px;border-radius:3px;background:#c7b1da}.aw-p-live-preview i:first-child{background:#a77dca}
.aw-p-online{display:flex;align-items:center;gap:6px;margin-top:7px;font-size:9px;color:#4b785e}.aw-p-online svg{width:13px;height:13px}
@media(min-width:1101px) and (max-height:850px) and (prefers-reduced-motion:no-preference){#ablauf [data-hcard]>.aw-step-scene{scale:.69}}
@media(min-width:1101px) and (min-height:701px) and (max-height:760px) and (prefers-reduced-motion:no-preference){#ablauf [data-hcard]>.aw-step-scene{scale:.6}}
/* Flat layouts keep a dedicated row and the same smaller visual size. */
@media(max-width:1100px),(max-height:700px),(prefers-reduced-motion:reduce){
 #ablauf [data-hcard]{display:grid!important;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 180px auto;gap:24px!important;min-width:0;min-height:0!important;height:auto!important;align-content:start}
 #ablauf [data-hcard]>.aw-step-scene{position:relative;right:auto;top:auto;width:min(272px,100%);min-width:0;max-width:100%;height:166px;justify-self:center;align-self:center;scale:.86;transform-origin:50% 50%}
 #ablauf [data-hcard]>div:first-child{flex-direction:row!important;align-items:flex-start!important}
 #ablauf [data-hcard]>div:last-child{padding-top:0!important}
}