/* QTriangle V3 interfaces. Load after existing widget styles. All selectors
   are bounded by v3x classes. Motion is gated by v3-new-widgets.js. */
.v3x-widget{--v3x-ink:#152140;--v3x-blue:#2449ff;--v3x-teal:#008b74;--v3x-coral:#f76741;--v3x-muted:#58647a;--v3x-line:#dce2ed;--v3x-soft:#eef1ff;--v3x-accent:#2449ff;box-sizing:border-box;container-type:inline-size;isolation:isolate;position:relative;display:flex;flex-direction:column;width:100%;min-width:0;max-width:100%;margin:0;padding:0;overflow:hidden;border:1px solid #d8deeb;border-radius:22px;background:#fff;color:var(--v3x-ink);box-shadow:0 20px 45px #18264a0d,0 3px 9px #18264a05;text-align:left;font:400 13.5px/1.5 var(--body,Arial,sans-serif)}
.v3x-widget *,.v3x-widget *:before,.v3x-widget *:after{box-sizing:border-box;min-width:0}
.v3x-widget [hidden]{display:none!important}
.v3x-widget h3,.v3x-widget h4,.v3x-widget p{width:auto;margin:0;padding:0;letter-spacing:normal;color:inherit;overflow-wrap:anywhere}
.v3x-widget h3,.v3x-widget h4{font-family:var(--heading,"Space Grotesk",Arial,sans-serif);font-weight:650;line-height:1.23}
.v3x-widget h3{font-size:18px;letter-spacing:-.55px}
.v3x-widget h4{font-size:21px;letter-spacing:-.65px}
.v3x-widget b,.v3x-widget strong{font-weight:650}
.v3x-widget .v3x-icon{display:block;flex:none;width:20px;height:20px;max-width:100%;color:inherit}
.v3x-widget .v3x-head{position:relative;display:flex;align-items:center;gap:11px;min-width:0;padding:20px 20px 16px;border:0;background:transparent}
.v3x-head>div{flex:1;min-width:0}
.v3x-widget .v3x-eyebrow{display:block;margin-bottom:3px;color:var(--v3x-muted);font-size:10px;font-weight:650;letter-spacing:1.05px;line-height:1.4;text-transform:uppercase}
.v3x-emblem{display:grid;flex:none;place-items:center;width:41px;height:41px;border-radius:12px;background:var(--v3x-soft);color:var(--v3x-accent);box-shadow:inset 0 0 0 1px #2449ff08}
.v3x-head-dot{width:7px;height:7px;flex:none;margin-left:3px;border-radius:50%;background:var(--v3x-accent);box-shadow:0 0 0 5px var(--v3x-soft)}
.v3x-widget .v3x-body{display:flex;flex:1;flex-direction:column;gap:14px;width:100%;min-width:0;padding:0 20px 20px}
.v3x-widget .v3x-foot{margin-top:auto;padding:12px 20px 15px;border-top:1px solid var(--v3x-line);color:var(--v3x-muted);background:#ffffff75;font-size:11px;line-height:1.5}
.v3x-widget .v3x-control{appearance:none;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;max-width:100%;min-width:0;min-height:44px;margin:0;padding:9px 12px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--v3x-ink);font:600 12px/1.35 var(--body,Arial,sans-serif);text-align:center;white-space:normal;overflow-wrap:anywhere;cursor:pointer;box-shadow:none;transform:none;transition:transform .18s ease,opacity .18s ease}
.v3x-widget .v3x-control .v3x-icon{width:16px;height:16px}
.v3x-widget .v3x-control:hover{transform:translateY(-1px)}
.v3x-widget .v3x-control:active{transform:translateY(0)}
.v3x-widget .v3x-control:focus-visible{outline:3px solid #2449ff;outline-offset:3px;z-index:5}
.v3x-widget .v3x-control:disabled{cursor:default;opacity:.65;transform:none}
.v3x-widget .v3x-controls{display:flex;flex-wrap:wrap;gap:4px;width:100%;min-width:0;padding:4px;border:1px solid #dee3ee;border-radius:13px;background:#f1f3f8}
.v3x-controls>.v3x-control{flex:1 1 70px}
.v3x-widget .v3x-controls .v3x-control[aria-pressed="true"]{background:#fff;color:var(--v3x-accent);box-shadow:0 3px 10px #192c5612}
.v3x-widget .v3x-primary{background:var(--v3x-accent);color:#fff;box-shadow:0 4px 8px #18264a0d}
.v3x-widget .v3x-primary:hover{background:var(--v3x-accent);color:#fff;opacity:.92}
.v3x-widget .v3x-outline{border-color:var(--v3x-line);background:#fff;color:var(--v3x-ink)}
.v3x-widget .v3x-outline[aria-pressed="true"]{border-color:var(--v3x-accent);background:var(--v3x-soft);color:var(--v3x-accent)}
.v3x-widget .v3x-wide{width:100%}
.v3x-widget .v3x-small-label{display:block;color:var(--v3x-muted);font-size:10px;line-height:1.4;font-weight:650;letter-spacing:.65px;text-transform:uppercase}
.v3x-widget .v3x-label-line{display:flex;align-items:center;justify-content:space-between;gap:10px}
.v3x-widget .v3x-inline-note,.v3x-widget .v3x-intro{color:var(--v3x-muted);font-size:12px;line-height:1.55}
.v3x-widget .v3x-inline-note{font-size:11px;text-align:center}
.v3x-widget .v3x-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Search: a cited answer sheet above a restrained source-readiness signal. */
.v3x-ai-search{background:linear-gradient(160deg,#f1f4ff,#fff 74%)}
.v3x-search-query{display:flex;align-items:center;gap:9px;padding:13px 14px;border:1px solid #cdd6f5;border-radius:12px;background:#fff;box-shadow:0 5px 15px #2449ff08;font-weight:550}
.v3x-search-query>.v3x-icon{color:var(--v3x-blue);width:18px;height:18px}
.v3x-answer-sheet{position:relative;display:flex;flex-direction:column;gap:12px;padding:18px;border:1px solid #dbe1f4;border-radius:15px;background:#fff;box-shadow:6px 7px 0 #e2e8ff}
.v3x-answer-sheet>p{font-size:15px;line-height:1.6;font-weight:500}
.v3x-number-tag{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:#e9edff;color:var(--v3x-blue);font-size:12px;font-weight:700}
.v3x-citation-row,.v3x-rule-chips,.v3x-lesson-tags{display:flex;flex-wrap:wrap;gap:6px}
.v3x-citation-row>span,.v3x-rule-chips>span,.v3x-lesson-tags>span{padding:5px 8px;border:1px solid #dce2f1;border-radius:6px;color:#435271;background:#f5f7fc;font-size:10px;line-height:1.4}
.v3x-source-list{display:flex;flex-direction:column;gap:8px;padding:4px 0}
.v3x-source-list>div{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid #dbe2f3;border-radius:10px;background:#fff}
.v3x-source-list>div>.v3x-icon{color:var(--v3x-blue)}
.v3x-source-list>div>span:not(.v3x-check){flex:1}
.v3x-source-list b,.v3x-source-list small{display:block}
.v3x-source-list b{font-size:12px}
.v3x-source-list small{margin-top:2px;color:var(--v3x-muted);font-size:10px}
.v3x-check{color:var(--v3x-teal)}
.v3x-readiness{position:relative;overflow:hidden;border-radius:6px;background:#e4eaff;min-height:25px;padding:5px 8px;text-align:center}
.v3x-readiness>i{position:absolute;inset:0;z-index:0;background:#cdd8ff;transform-origin:left;animation:v3x-readiness 5s ease-in-out infinite}
.v3x-readiness>span{position:relative;color:#314685;font-size:10px;line-height:1.3}

/* Voice: dark teal sound sculpture and three explicitly selectable steps. */
.v3x-voice{--v3x-accent:#007c6a;--v3x-soft:#e1f6f0;background:linear-gradient(155deg,#ebfaf6,#fff 75%)}
.v3x-voice .v3x-body{gap:12px}
.v3x-call-orbit{position:relative;align-self:center;display:grid;place-items:center;width:100px;height:100px;margin:0 auto -8px;border:1px solid #a9d8ca;border-radius:50%;background:linear-gradient(140deg,#c5eddf,#f4fffb)}
.v3x-call-core{display:grid;place-items:center;width:67px;height:67px;border-radius:23px;background:linear-gradient(145deg,#065b51,#008b74);color:#b5ffdf;box-shadow:0 11px 20px #008b742a;transform:rotate(-8deg)}
.v3x-call-core>.v3x-icon{width:33px;height:33px;transform:rotate(8deg)}
.v3x-call-orbit>span{position:absolute;inset:3px;border:1px solid #008b7440;border-radius:50%;animation:v3x-ring 3.5s ease-out infinite}
.v3x-wave{display:flex;align-items:center;justify-content:center;gap:4px;height:42px;margin:0 5px;color:var(--v3x-teal)}
.v3x-wave>i{width:5px;max-width:3%;height:38px;flex:0 1 5px;border-radius:8px;background:currentColor;transform:scaleY(var(--v3x-bar));animation:v3x-wave 1.25s ease-in-out infinite alternate;animation-delay:var(--v3x-delay)}
.v3x-wave>i:nth-child(3n){color:#f76741}
.v3x-call-script{min-height:100px;padding:14px 16px;border-left:3px solid #008b74;border-radius:0 12px 12px 0;background:#fff;box-shadow:0 4px 16px #008b740a}
.v3x-call-script>p{margin-top:8px;color:#16483e;font-size:16px;line-height:1.5}
.v3x-voice[data-v3x-step="2"] .v3x-call-core{background:linear-gradient(145deg,#b64027,#f76741);color:#fff}

/* Assistant: browser chrome, a geometric mark, and source-bound chat. */
.v3x-assistant{--v3x-soft:#fff0dc;--v3x-accent:#2449ff;background:#fffaf2}
.v3x-browser-line{display:flex;align-items:center;gap:4px;width:100%;padding:9px 0;border-bottom:1px solid #eadfce;color:#6d6255;font-size:10px}
.v3x-browser-line>i{width:5px;height:5px;border-radius:50%;background:#d8cfc0}
.v3x-browser-line>span{margin-left:7px}
.v3x-assistant-mark{position:relative;display:flex;align-items:center;justify-content:center;height:63px}
.v3x-assistant-mark>span{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:#2449ff;color:#fff;box-shadow:0 7px 18px #2449ff26;transform:rotate(-6deg)}
.v3x-assistant-mark>i{position:absolute;inset:4px calc(50% - 39px);border:1px solid #c1cbff;border-radius:25%;animation:v3x-turn 18s linear infinite}
.v3x-assistant-mark>b{position:absolute;left:calc(50% + 20px);bottom:3px;display:grid;place-items:center;width:25px;height:25px;border:3px solid #fffaf2;border-radius:50%;background:#f76741;color:#fff;font-size:11px}
.v3x-chat-thread{display:flex;flex-direction:column;gap:9px}
.v3x-widget .v3x-bubble{padding:12px 14px;font-size:12px;line-height:1.55}
.v3x-outgoing{align-self:flex-end;max-width:90%;border-radius:13px 13px 3px 13px;background:#e6ebff;color:#1a358f}
.v3x-incoming{align-self:flex-start;max-width:95%;border:1px solid #eadfce;border-radius:13px 13px 13px 3px;background:#fff;color:#35415b}
.v3x-grounded{display:flex;align-items:center;gap:7px;color:#5a6654;font-size:10px}
.v3x-grounded>.v3x-icon{width:14px;height:14px;color:#008b74}

/* Messaging: permission precedes the message, with a visible SMS/RCS mode. */
.v3x-messaging{--v3x-accent:#007d69;--v3x-soft:#e7f5f0;background:linear-gradient(135deg,#f3fbf8,#fff)}
.v3x-message-journey{display:flex;align-items:center;gap:5px;width:100%;font-size:9px;line-height:1.35;text-align:center;color:#425f55}
.v3x-message-journey>span{flex:1;padding:7px 4px;border:1px solid #d3e7dd;border-radius:7px;background:#fff}
.v3x-message-journey>i{width:12px;height:1px;flex:none;background:#abcbbd}
.v3x-message-journey>span.is-ready{background:#d4eee2;border-color:#7cbaa3;color:#185743}
.v3x-message-phone{position:relative;width:100%;max-width:260px;align-self:center;padding:10px;border:5px solid #203b35;border-bottom-width:9px;border-radius:22px;background:#f5f8f6;box-shadow:8px 9px 0 #dbece3}
.v3x-phone-status{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 5px 10px;font-size:10px;font-weight:650;color:#496159}
.v3x-phone-status>i{width:6px;height:6px;border-radius:50%;background:#008b74}
.v3x-message-card{padding:14px;border:1px solid #dbe4de;border-radius:12px 12px 12px 3px;background:#fff}
.v3x-message-card>p{margin-top:7px;color:#284e42;font-size:12px;line-height:1.55}
.v3x-widget .v3x-phone-note{padding:10px 4px 3px;color:#5a7065;text-align:center;font-size:10px}
.v3x-rich-reply{display:block;margin-top:12px;padding-top:10px;border-top:1px solid #deebe3;color:#007c69;font-size:11px;font-weight:650;text-align:center}
.v3x-messaging[data-v3x-channel="rcs"] .v3x-message-card{border-top:5px solid #008b74;background:linear-gradient(#f0fbf5,#fff 65%)}

/* Customer data: coloured audience cards, readable rules, useful next action. */
.v3x-customer-data{--v3x-soft:#eeeaff;--v3x-accent:#6341b8;background:linear-gradient(160deg,#f3efff,#fff 80%)}
.v3x-audience-stack{position:relative;display:flex;justify-content:center;align-items:flex-end;height:90px;margin-top:3px}
.v3x-audience-stack>span{display:grid;place-items:center;width:65px;height:69px;border:4px solid #fff;border-radius:18px;background:#cdd8ff;color:#2449ff;box-shadow:0 8px 18px #30216b12;transform:rotate(-12deg)}
.v3x-audience-stack>span:nth-child(2){z-index:2;height:80px;margin:0 -5px;background:#bfebda;color:#006952;transform:translateY(-4px)}
.v3x-audience-stack>span:nth-child(3){background:#ffd7c8;color:#a93e22;transform:rotate(12deg)}
.v3x-audience-stack .v3x-icon{width:32px;height:32px}
.v3x-audience-stack>i{position:absolute;top:7px;left:calc(50% + 66px);width:9px;height:9px;border-radius:50%;background:#6341b8;box-shadow:0 0 0 5px #e2d9ff;animation:v3x-float 5s ease-in-out infinite}
.v3x-segment-card{display:flex;flex-direction:column;gap:12px;padding:17px;border:1px solid #e1d9f3;border-radius:15px;background:#fff;box-shadow:0 8px 16px #56368008}
.v3x-segment-card h4{color:#3d2c68}
.v3x-segment-next{display:flex;gap:9px;padding-top:12px;border-top:1px solid #eae3f4;color:#5c5071;font-size:11px;line-height:1.55}
.v3x-segment-next .v3x-icon{width:17px;height:17px;color:#6341b8}

/* Consent: an intentional, calm preference sheet with real toggle state. */
.v3x-consent{--v3x-accent:#007f69;--v3x-soft:#e7f5ee;background:#f6fbf8}
.v3x-consent-seal{position:relative;display:grid;place-items:center;align-self:center;width:74px;height:74px;border:1px solid #c1dfd0;border-radius:50%;background:#e4f3e9;color:#007259}
.v3x-consent-seal>.v3x-icon{width:35px;height:35px}
.v3x-consent-seal>span{position:absolute;right:-5px;bottom:5px;width:20px;height:20px;border:4px solid #f6fbf8;border-radius:50%;background:#f76741}
.v3x-preference-list{border:1px solid #dae6df;border-radius:13px;background:#fff;overflow:hidden}
.v3x-preference-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:66px;padding:12px 14px}
.v3x-preference-list>div+div{border-top:1px solid #e6eee8}
.v3x-preference-list b,.v3x-preference-list small{display:block}
.v3x-preference-list b{font-size:12px}
.v3x-preference-list small{margin-top:2px;color:#61766a;font-size:10px;line-height:1.45}
.v3x-always-on{flex:none;color:#456754;font-size:10px;font-weight:600}
.v3x-widget .v3x-switch{display:flex;flex:none;width:52px;min-height:44px;height:44px;padding:12px 6px;border:0;border-radius:12px;background:transparent}
.v3x-switch:before{content:"";position:absolute;inset:9px 3px;border:1px solid #c3d0c9;border-radius:20px;background:#e5ebe7}
.v3x-switch>i{position:relative;display:block;width:19px;height:19px;flex:none;margin-right:auto;border-radius:50%;background:#fff;box-shadow:0 1px 3px #123b2a25;transform:translateX(0);transition:transform .18s ease}
.v3x-widget .v3x-switch[aria-pressed="true"]:before{border-color:#008b74;background:#008b74}
.v3x-switch[aria-pressed="true"]>i{transform:translateX(17px)}

/* UX: a miniature prototype with actual content and screen transitions. */
.v3x-ux{--v3x-accent:#2449ff;--v3x-soft:#e9edff;background:linear-gradient(155deg,#f0f3ff,#fff 80%)}
.v3x-prototype{width:100%;padding:12px;border:1px solid #cdd6f3;border-radius:16px;background:#fff;box-shadow:7px 8px 0 #dfe6ff}
.v3x-prototype-top{display:flex;align-items:center;gap:7px;padding:3px 2px 12px;border-bottom:1px solid #e7ebf4;color:#536584;font-size:10px;font-weight:600}
.v3x-prototype-top>i{width:13px;height:9px;margin-left:auto;border-top:2px solid #7688a6;border-bottom:2px solid #7688a6}
.v3x-prototype-logo{width:17px;height:17px;border:5px solid #2449ff;border-radius:5px;transform:rotate(-10deg)}
.v3x-prototype-screen{display:flex;flex-direction:column;gap:11px;min-height:205px;padding:16px 5px}
.v3x-prototype-screen h4{max-width:15ch;font-size:23px}
.v3x-prototype-screen p{color:#5b6880;font-size:12px;line-height:1.55}
.v3x-wire-art{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;height:67px;border-radius:9px;background:#eff2ff;overflow:hidden}
.v3x-wire-art>i{width:40px;height:40px;border-radius:11px;background:#2449ff;box-shadow:0 8px 12px #2449ff20;transform:rotate(-13deg)}
.v3x-wire-art>i:nth-child(2){width:50px;height:50px;border-radius:50%;background:#008b74;transform:translateY(-5px)}
.v3x-wire-art>i:nth-child(3){width:34px;height:34px;border-radius:9px;background:#f76741;transform:rotate(14deg)}
.v3x-prototype-options{display:flex;flex-wrap:wrap;gap:6px}
.v3x-prototype-options>span{flex:1 1 75px;padding:8px;border:1px solid #d7dff1;border-radius:7px;color:#536589;font-size:10px}
.v3x-prototype-checklist{display:flex;flex-direction:column;gap:6px;color:#455f70;font-size:11px}
.v3x-prototype-checklist>span{display:flex;align-items:center;gap:6px}
.v3x-prototype-checklist .v3x-icon{width:14px;height:14px;color:#008b74}
.v3x-prototype-field{display:flex;flex-direction:column;gap:4px;padding:8px 10px;border:1px solid #d6dfef;border-radius:7px;color:#51617c;font-size:10px}
.v3x-prototype-field>b{color:#294564;font-size:11px}
.v3x-ux[data-v3x-view="enquire"] .v3x-prototype{border-color:#afd8ca;box-shadow:7px 8px 0 #def1e9}

/* Accessibility: a safe comparison, with a consistently visible focus path. */
.v3x-accessibility{--v3x-accent:#2449ff;--v3x-soft:#edf0ff;background:#f8f9fd}
.v3x-a11y-preview{display:flex;flex-direction:column;gap:13px;padding:20px;border:2px solid #2449ff;border-radius:15px;background:#fff;box-shadow:5px 6px 0 #dfe5ff}
.v3x-a11y-preview p{color:#3a4961;font-size:14px;line-height:1.65}
.v3x-a11y-top{display:flex;align-items:center;justify-content:space-between;gap:9px}
.v3x-contrast-chips{display:flex;flex:none;gap:3px}
.v3x-contrast-chips>i{width:16px;height:16px;border:1px solid #c8cfdd;border-radius:50%;background:#152140}
.v3x-contrast-chips>i+ i{background:#fff}
.v3x-a11y-checks{display:flex;flex-wrap:wrap;gap:10px;color:#275e50;font-size:11px}
.v3x-a11y-checks>span{display:flex;align-items:center;gap:4px}
.v3x-a11y-checks .v3x-icon{width:14px;height:14px}
.v3x-accessibility[data-v3x-view="before"] .v3x-a11y-preview{gap:11px;border-color:#ceccd7;border-radius:7px;background:#f1eff6;box-shadow:none}
.v3x-accessibility[data-v3x-view="before"] .v3x-a11y-preview h4{color:#565065;font-size:17px}
.v3x-accessibility[data-v3x-view="before"] .v3x-a11y-preview p{color:#60596d;font-size:12px;line-height:1.5}
.v3x-accessibility[data-v3x-view="before"] .v3x-a11y-preview .v3x-primary{background:#645774}
.v3x-accessibility [data-v3x-focus-target]:focus{outline:3px solid #2449ff;outline-offset:4px}

/* Localisation: a typographic language sculpture above a real content swap. */
.v3x-localisation{--v3x-accent:#a13d23;--v3x-soft:#fff0e5;background:#fff8ee}
.v3x-language-art{position:relative;display:flex;align-items:center;justify-content:center;height:81px;gap:5px}
.v3x-language-art>span{display:grid;place-items:center;width:53px;height:58px;border:1px solid #eadfca;border-radius:13px;background:#fff;color:#2449ff;font:600 31px/1 Arial,sans-serif;box-shadow:0 6px 13px #7250250d;transform:rotate(-10deg)}
.v3x-language-art>span:nth-child(2){z-index:2;background:#008b74;color:#fff;transform:translateY(-7px)}
.v3x-language-art>span:nth-child(3){background:#f76741;color:#fff;transform:rotate(10deg)}
.v3x-language-art>i{position:absolute;inset:3px 17%;z-index:-1;border:1px dashed #d3bb9c;border-radius:50%;animation:v3x-tilt 8s ease-in-out infinite}
.v3x-local-card{display:flex;flex-direction:column;gap:12px;padding:18px;border:1px solid #eadcc7;border-radius:15px;background:#fff;min-height:199px}
.v3x-local-card h4{font-size:25px;line-height:1.3}
.v3x-local-card p{color:#6d5e50;font-size:12px;line-height:1.6}
.v3x-language-cta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px;border-top:1px solid #f0e5d7;color:#8f3a24;font-size:12px;font-weight:650}
.v3x-language-cta>.v3x-icon{width:16px;height:16px}
.v3x-locale-note{display:flex;gap:7px;align-items:center;color:#746554;font-size:10px}
.v3x-locale-note>.v3x-icon{width:15px;height:15px;color:#9c5835}

/* B2B: the buying team and the account's next useful conversation. */
.v3x-b2b{--v3x-accent:#2746c4;--v3x-soft:#e8edff;background:#eef2fb}
.v3x-account-top{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #d6dfef;border-radius:13px;background:#fff}
.v3x-account-building{display:grid;flex:none;place-items:center;width:48px;height:48px;border-radius:13px;background:#2449ff;color:#fff;box-shadow:3px 4px 0 #becaf5}
.v3x-account-building>.v3x-icon{width:27px;height:27px}
.v3x-account-top b,.v3x-account-top div>span{display:block}
.v3x-account-top b{font-size:14px}
.v3x-account-top div>span{margin-top:3px;color:#63718b;font-size:10px}
.v3x-account-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.v3x-widget .v3x-account-flow>.v3x-control{flex-direction:column;gap:8px;padding:10px 4px;border:1px solid #d3dcef;border-radius:10px;background:#fff;font-size:10px}
.v3x-account-flow>.v3x-control>span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#edf0f8;color:#53698a;font-size:10px;letter-spacing:.7px}
.v3x-widget .v3x-account-flow>.v3x-control[aria-pressed="true"]{border-color:#2449ff;background:#2449ff;color:#fff;box-shadow:0 5px 12px #2449ff20}
.v3x-account-flow>.v3x-control[aria-pressed="true"]>span{background:#ffffff26;color:#fff}
.v3x-account-detail{display:flex;flex-direction:column;gap:11px;padding:18px;border:1px solid #d4dff0;border-radius:14px;background:#fff}
.v3x-account-detail p{color:#596a87;font-size:12px;line-height:1.6}
.v3x-account-people{display:flex;flex-wrap:wrap;gap:6px;padding-top:5px}
.v3x-account-people>span{padding:5px 8px;border-radius:20px;background:#e7f5ef;color:#285b4d;font-size:9px;font-weight:600}
.v3x-account-people>span:nth-child(2){background:#fff0df;color:#845124}
.v3x-account-people>span:nth-child(3){background:#edf0ff;color:#3c4f92}

/* PR: a paper editorial brief with clear draft and review states. */
.v3x-pr{--v3x-accent:#9e3922;--v3x-soft:#ffecdf;background:#f8efe2}
.v3x-pitch-categories{display:flex;flex-wrap:wrap;gap:5px}
.v3x-widget .v3x-pitch-categories>.v3x-control{flex:1 1 70px;border:1px solid #e6d4bc;background:#fff9f0;font-size:10px}
.v3x-widget .v3x-pitch-categories>.v3x-control[aria-pressed="true"]{background:#a44128;border-color:#a44128;color:#fff}
.v3x-pitch-paper{position:relative;display:flex;flex-direction:column;gap:13px;min-height:253px;padding:18px 20px 40px;border:1px solid #ddcfb9;background:#fffdfa;box-shadow:6px 7px 0 #e6d8c4;transform:rotate(-1.2deg)}
.v3x-paper-masthead{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-bottom:9px;border-bottom:2px solid #35402f;color:#35402f;font-size:9px;font-weight:700;letter-spacing:1.5px}
.v3x-paper-masthead>.v3x-icon{width:17px;height:17px}
.v3x-pitch-paper h4{font-family:Georgia,serif;color:#323b2f;font-size:26px;font-weight:500;line-height:1.16}
.v3x-pitch-paper>p{color:#6c695d;font-size:11px;line-height:1.65}
.v3x-pitch-lines{display:flex;flex-direction:column;gap:5px}
.v3x-pitch-lines>i{height:2px;background:#e4e0d5;border-radius:2px}
.v3x-pitch-lines>i:nth-child(2){width:85%}
.v3x-pitch-lines>i:nth-child(3){width:61%}
.v3x-pitch-stamp{position:absolute;right:15px;bottom:12px;padding:4px 7px;border:1px solid #bc9c76;border-radius:4px;color:#8a5b31;font-size:9px;font-weight:650;transform:rotate(-4deg)}
.v3x-pitch-stamp.is-ready{border-color:#008b74;color:#006953;background:#eaf8f1}

/* Studio: small purposeful product reference inside a code-native artboard. */
.v3x-studio{--v3x-accent:#2449ff;--v3x-soft:#e9edff;background:#fff}
.v3x-studio-canvas{position:relative;display:grid;place-items:center;isolation:isolate;min-height:228px;border:1px solid #e3dbce;border-radius:15px;overflow:hidden;background:#f7f0e4}
.v3x-studio-grid{position:absolute;inset:10px;border:1px solid #8e7c5a20;background:linear-gradient(90deg,transparent 49.8%,#8e7c5a18 49.8% 50.2%,transparent 50.2%),linear-gradient(transparent 49.8%,#8e7c5a18 49.8% 50.2%,transparent 50.2%)}
.v3x-studio-arc{position:absolute;width:210px;max-width:80%;aspect-ratio:1;border:1px solid #baaa8a80;border-radius:50%;transform:rotate(10deg);animation:v3x-tilt 9s ease-in-out infinite}
.v3x-studio-arc:after{content:"";position:absolute;left:10%;top:10%;width:9px;height:9px;border-radius:50%;background:#f76741}
.v3x-studio-disk{position:absolute;top:48%;left:27%;width:46%;height:34%;border:1px solid #83b8a7;border-radius:50%;background:#c5e3d5;box-shadow:0 13px 17px #38503b15;transform:rotate(-10deg)}
.v3x-widget .v3x-studio-product{position:relative;z-index:1;display:block;width:165px;max-width:63%;height:140px;margin-top:-14px;border:4px solid #ffffffe8;border-radius:15px;object-fit:cover;box-shadow:0 14px 24px #14254c26;transform:translate(0,-2px) rotate(-5deg);transition:transform .35s ease}
.v3x-studio-caption{position:absolute;left:13px;bottom:12px;max-width:75%;color:#6c614e;font-size:9px;font-weight:650;letter-spacing:.8px;text-transform:uppercase}
.v3x-studio-corner{position:absolute;top:12px;right:15px;color:#9e6c43;font-size:24px;line-height:1}
.v3x-studio-controls{display:flex;flex-direction:column;gap:7px}
.v3x-studio-controls>.v3x-controls{margin-bottom:4px}
.v3x-studio[data-v3x-backdrop="cobalt"] .v3x-studio-canvas{background:#2449ff;border-color:#2449ff}
.v3x-studio[data-v3x-backdrop="cobalt"] .v3x-studio-grid{border-color:#ffffff30}
.v3x-studio[data-v3x-backdrop="cobalt"] .v3x-studio-caption,.v3x-studio[data-v3x-backdrop="cobalt"] .v3x-studio-corner{color:#fff}
.v3x-studio[data-v3x-backdrop="cobalt"] .v3x-studio-arc{border-color:#a7b9ff}
.v3x-studio[data-v3x-backdrop="coral"] .v3x-studio-canvas{background:#f76741;border-color:#f76741}
.v3x-studio[data-v3x-backdrop="coral"] .v3x-studio-caption,.v3x-studio[data-v3x-backdrop="coral"] .v3x-studio-corner{color:#462015}
.v3x-studio[data-v3x-layout="offset"] .v3x-studio-product{transform:translate(17%,-3px) rotate(9deg)}
.v3x-studio[data-v3x-layout="offset"] .v3x-studio-disk{transform:translateX(-15%) rotate(13deg)}

/* Helpdesk: a shared inbox and a selected request with a local resolution. */
.v3x-helpdesk{--v3x-accent:#007e6b;--v3x-soft:#e5f5f0;background:#f1faf6}
.v3x-inbox-shell{display:flex;flex-direction:column;gap:12px}
.v3x-inbox-list{display:flex;flex-direction:column;gap:6px}
.v3x-widget .v3x-inbox-list>.v3x-control{justify-content:flex-start;gap:10px;width:100%;padding:10px 12px;border:1px solid #d4e6dd;border-radius:11px;background:#fff;text-align:left}
.v3x-widget .v3x-inbox-list>.v3x-control[aria-pressed="true"]{border-color:#008b74;background:#e3f4ec;box-shadow:inset 3px 0 #008b74}
.v3x-ticket-dot{flex:none;width:7px;height:7px;border-radius:50%;background:#f76741}
.v3x-ticket-dot.is-resolved{background:#008b74;box-shadow:0 0 0 3px #d3eee2}
.v3x-inbox-list b,.v3x-inbox-list small{display:block;font-size:11px;line-height:1.4}
.v3x-inbox-list small{margin-top:2px;color:#63786c;font-weight:400;font-size:10px}
.v3x-inbox-detail{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid #cbded2;border-radius:13px;background:#fff;box-shadow:4px 5px 0 #dfefe5}
.v3x-inbox-detail h4{font-size:19px}
.v3x-inbox-detail>p{color:#5c7467;font-size:12px;line-height:1.6}
.v3x-status-tag{padding:4px 7px;border-radius:5px;background:#fff0dc;color:#835421;font-size:9px;font-weight:650}
.v3x-status-tag.is-resolved{background:#dcf1e6;color:#20614a}
.v3x-assignee{display:flex;align-items:center;gap:6px;color:#456857;font-size:10px}
.v3x-assignee>.v3x-icon{width:15px;height:15px}

/* Portal: a branded workspace, shared files, and a review decision. */
.v3x-portal{--v3x-accent:#2449ff;--v3x-soft:#e7ecff;background:#f2f5ff}
.v3x-portal-banner{display:flex;align-items:center;gap:12px;padding:16px;border-radius:13px;background:linear-gradient(125deg,#1d35a5,#2449ff);color:#fff;box-shadow:0 8px 17px #2449ff16}
.v3x-portal-banner>span:last-child{font-size:10px;color:#d2dcff}
.v3x-portal-banner b{display:block;margin-top:4px;font:600 16px/1.25 var(--heading,Arial,sans-serif);color:#fff;letter-spacing:-.4px}
.v3x-portal-logo{position:relative;display:block;flex:none;width:38px;height:35px}
.v3x-portal-logo>i{position:absolute;width:14px;height:14px;border:3px solid #c1d2ff;border-radius:50%;left:12px;top:0}
.v3x-portal-logo>i:nth-child(2){left:1px;top:21px;border-color:#b3e6d6}
.v3x-portal-logo>i:nth-child(3){left:24px;top:21px;border-color:#ffb398}
.v3x-portal-content{display:flex;flex-direction:column;gap:12px;min-height:214px}
.v3x-portal-task{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:17px;border:1px solid #d4dff3;border-radius:13px;background:#fff}
.v3x-portal-task h4{font-size:21px}
.v3x-portal-task>p{color:#596d90;font-size:12px;line-height:1.6}
.v3x-portal-bottom{display:flex;flex-wrap:wrap;gap:10px;padding:0 3px;color:#596e8f;font-size:10px}
.v3x-portal-bottom>span{display:flex;align-items:center;gap:5px}
.v3x-portal-bottom .v3x-icon{width:15px;height:15px;color:#2449ff}
.v3x-file-list{display:flex;flex-direction:column;gap:8px}
.v3x-widget .v3x-file-list>.v3x-control{display:flex;justify-content:flex-start;gap:10px;width:100%;padding:13px;border:1px solid #d6dff0;background:#fff;text-align:left}
.v3x-file-list>.v3x-control>.v3x-icon{width:25px;height:25px;color:#2449ff}
.v3x-file-list b,.v3x-file-list small{display:block}
.v3x-file-list b{font-size:12px}
.v3x-file-list small{margin-top:3px;color:#667a99;font-size:10px;font-weight:400}
.v3x-portal-file-note{padding:12px 14px;border:1px solid #c4d1f0;border-radius:10px;background:#e9efff;color:#405c94;font-size:11px}
.v3x-approval-board{display:flex;flex-direction:column;gap:12px;padding:17px;border:1px solid #d0dbef;border-radius:13px;background:#fff}
.v3x-approval-art{display:flex;align-items:center;justify-content:center;gap:6px;height:70px;border-radius:8px;background:#f0f3ff}
.v3x-approval-art>i{width:38px;height:38px;border-radius:9px;background:#2449ff;transform:rotate(-10deg)}
.v3x-approval-art>i:nth-child(2){border-radius:50%;background:#008b74;transform:translateY(-6px)}
.v3x-approval-art>i:nth-child(3){background:#f76741;transform:rotate(10deg)}
.v3x-approval-board h4{font-size:20px}
.v3x-approval-board p{color:#596e90;font-size:12px}

/* Hosting: request stages and a terminal, without numerical speed claims. */
.v3x-hosting{--v3x-accent:#2449ff;--v3x-soft:#e9eeff;background:linear-gradient(145deg,#edf4fc,#f7faff)}
.v3x-request-flow{display:flex;align-items:center;gap:7px;padding:13px 0}
.v3x-request-flow>div{display:flex;flex:1;flex-direction:column;align-items:center;gap:9px}
.v3x-request-flow>div>.v3x-icon{width:42px;height:42px;padding:9px;border:1px solid #c5d4ec;border-radius:12px;background:#fff;color:#2449ff;box-shadow:0 6px 11px #2945710a}
.v3x-request-flow b{font-size:10px;color:#4c6382}
.v3x-request-flow>i{position:relative;flex:0 1 34px;height:2px;margin-top:-20px;background:#cad7ea;overflow:visible}
.v3x-request-flow>i>span{position:absolute;left:0;top:-2px;display:block;width:7px;height:6px;border-radius:3px;background:#2449ff;animation:v3x-packet 2.5s ease-in-out infinite}
.v3x-request-flow>i:nth-of-type(2)>span{background:#008b74;animation-delay:1.2s}
.v3x-hosting-terminal{padding:13px 15px 17px;border:1px solid #263b60;border-radius:13px;background:#14243f;box-shadow:0 7px 18px #15214016;color:#d2e0f7}
.v3x-hosting-terminal>div{display:flex;align-items:center;gap:4px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid #ffffff17;font-size:9px;color:#adbfde}
.v3x-hosting-terminal>div>i{width:5px;height:5px;border-radius:50%;background:#5b7399}
.v3x-hosting-terminal>div>span{margin-left:5px}
.v3x-hosting-terminal>p{display:flex;gap:8px;margin-top:10px;font:400 11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.v3x-hosting-terminal>p>span{color:#7ce4bc}
.v3x-hosting-terminal>p>b{font-weight:400}
.v3x-hosting-result{display:flex;align-items:center;gap:8px;color:#476582;font-size:11px}
.v3x-hosting-result>.v3x-icon{width:18px;height:18px;color:#008b74}
.v3x-hosting[data-v3x-path="repeat"] .v3x-request-flow>div:last-child{opacity:.4}
.v3x-hosting[data-v3x-path="repeat"] .v3x-request-flow>i:nth-of-type(2)>span{opacity:0;animation:none}
.v3x-hosting[data-v3x-path="repeat"] .v3x-request-flow>i:first-of-type>span{animation-direction:alternate}

/* Training: a compact playbook, useful lesson, and user-controlled progress. */
.v3x-training{--v3x-accent:#007d69;--v3x-soft:#e6f4ec;background:#f5f8f0}
.v3x-training-top{display:flex;align-items:center;gap:18px;padding:6px 3px}
.v3x-playbook-cover{position:relative;display:flex;flex:none;flex-direction:column;gap:9px;width:85px;height:105px;padding:15px 12px;border-left:5px solid #076750;border-radius:4px 11px 11px 4px;background:#008b74;box-shadow:5px 5px 0 #b6d9c5;transform:rotate(-7deg);color:#fff}
.v3x-playbook-cover>span{font-size:10px;font-weight:700;letter-spacing:1px;line-height:1.3}
.v3x-playbook-cover>i{position:absolute;width:17px;height:17px;left:13px;bottom:15px;border:3px solid #d6f2b7;border-radius:50%}
.v3x-playbook-cover>i:nth-of-type(2){left:34px;bottom:15px;border-color:#ffbb95}
.v3x-playbook-cover>i:nth-of-type(3){left:24px;bottom:34px;border-color:#cbd7ff}
.v3x-training-top>div:last-child{flex:1}
.v3x-training-top strong{display:block;margin:8px 0 12px;color:#225740;font:600 18px/1.3 var(--heading,Arial,sans-serif);letter-spacing:-.5px}
.v3x-progress-track{height:7px;overflow:hidden;border-radius:5px;background:#d6e5d9}
.v3x-progress-track>i{display:block;width:100%;height:100%;border-radius:5px;background:#008b74;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.v3x-lesson{display:flex;flex-direction:column;gap:12px;padding:17px;border:1px solid #d7e1d2;border-radius:13px;background:#fff}
.v3x-lesson h4{color:#2b4d37;font-size:22px}
.v3x-lesson p{color:#617161;font-size:12px;line-height:1.6}
.v3x-lesson-tags>span{border-color:#d5e3d4;background:#f0f7ec;color:#4d6e42}
.v3x-training-actions{display:flex;flex-wrap:wrap;gap:7px}
.v3x-training-actions>.v3x-control{flex:1 1 100px}

/* No layout properties animate. The repeated root class intentionally wins
   the older demo-wrap animation-play-state rules when nested inside one. */
.v3x-widget.v3x-widget.v3x-widget [data-v3x-motion]{animation-play-state:paused!important}
.v3x-widget.v3x-widget.v3x-widget.v3x-motion [data-v3x-motion]{animation-play-state:running!important}
html.motion-paused .v3x-widget.v3x-widget.v3x-widget [data-v3x-motion]{animation-play-state:paused!important}
@keyframes v3x-readiness{0%,100%{transform:scaleX(.65);opacity:.7}50%{transform:scaleX(1);opacity:1}}
@keyframes v3x-ring{0%{transform:scale(.85);opacity:.75}90%,100%{transform:scale(1.2);opacity:0}}
@keyframes v3x-wave{from{transform:scaleY(calc(var(--v3x-bar)*.45));opacity:.65}to{transform:scaleY(var(--v3x-bar));opacity:1}}
@keyframes v3x-turn{to{transform:rotate(360deg)}}
@keyframes v3x-float{0%,100%{transform:translate(0,0)}50%{transform:translate(-6px,9px)}}
@keyframes v3x-tilt{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(15deg)}}
@keyframes v3x-packet{0%{transform:translateX(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateX(25px);opacity:0}}
@container (max-width:330px){
  .v3x-widget .v3x-head{padding:16px 14px 13px;gap:9px}
  .v3x-widget .v3x-body{padding:0 14px 16px;gap:12px}
  .v3x-widget .v3x-foot{padding:11px 14px 13px}
  .v3x-widget h3{font-size:17px}
  .v3x-widget .v3x-control{min-height:44px;padding:8px 9px;font-size:11px}
  .v3x-widget .v3x-switch{min-height:44px;padding:12px 6px}
  .v3x-answer-sheet,.v3x-segment-card,.v3x-local-card,.v3x-a11y-preview,.v3x-account-detail,.v3x-lesson{padding:14px}
  .v3x-local-card h4{font-size:22px}
  .v3x-widget .v3x-account-flow>.v3x-control{padding:10px 3px;font-size:9px}
  .v3x-message-journey{gap:3px;font-size:8.5px}
  .v3x-message-journey>i{width:6px}
  .v3x-widget .v3x-preference-list .v3x-switch{width:52px;min-width:52px}
  .v3x-training-top{gap:13px}
  .v3x-training-top strong{font-size:16px}
  .v3x-pitch-paper{padding:16px 16px 39px}
  .v3x-pitch-paper h4{font-size:24px}
}
@media (prefers-reduced-motion:reduce){
  .v3x-widget.v3x-widget.v3x-widget [data-v3x-motion]{animation:none!important}
  .v3x-widget .v3x-control,.v3x-widget .v3x-switch>i,.v3x-widget .v3x-studio-product,.v3x-widget .v3x-progress-track>i{transition:none!important}
}