/* Claralix platform screens — illustrative rebuilds of the application and review flows.
   Tokens map the source portal system onto the Claralix palette. 1440px design width. */
.cx{--accent:#117f80;--accent-deep:#117f80;--accent-soft:#e3f2f1;--accent-tint:#eef7f6;--green:#00b67d;--green-text:#027a48;--red:#d92d20;--amber:#b54708;
  --ink:#17191c;--ink-2:rgba(23,25,28,.72);--ink-3:rgba(23,25,28,.5);--line:rgba(23,25,28,.12);--input:rgba(23,25,28,.22);--card-line:#d0d1d4;--body:#f3f4f5;--paper:#fff;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,sans-serif;
  width:1440px;height:1024px;background:var(--body);color:var(--ink);font:15px/22px var(--sans);display:flex;position:relative;overflow:hidden;box-sizing:border-box;-webkit-font-smoothing:antialiased}
.cx *,.cx *::before,.cx *::after{box-sizing:border-box}
.cx p,.cx h1,.cx h2,.cx h3{margin:0}
.cx .i{width:24px;height:24px;display:block;flex-shrink:0}
/* Side bar */
.cx .side{width:68px;background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;flex-shrink:0}
.cx .side .logo{height:109px;display:grid;place-items:center;border-bottom:1px solid var(--line)}
.cx .side .logo svg{width:34px;height:34px;color:var(--accent)}
.cx .side .sep{width:34px;height:1px;background:var(--line);margin:22px auto 14px}
.cx .side .nav{display:flex;flex-direction:column;gap:6px;align-items:center}
.cx .side .nav span{width:50px;height:38px;display:grid;place-items:center;border-radius:6px;color:var(--ink-2)}
.cx .side .nav span.on{background:var(--accent-soft);color:var(--accent)}
/* Top bar */
.cx .main{flex:1;min-width:0;display:flex;flex-direction:column}
.cx .top{height:64px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px 0 14px;color:var(--ink-2)}
.cx .top .grow{flex:1}
.cx .top .acts{display:flex;align-items:center;gap:14px;color:var(--ink)}
/* Buttons */
.cx .btn{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:6px;font:500 15px/22px var(--sans);text-transform:capitalize;border:1px solid transparent;white-space:nowrap}
.cx .btn .i{width:16px;height:16px}
.cx .btn-primary{background:var(--accent-deep);color:#fff;box-shadow:0 2px 4px rgba(23,25,28,.16)}
.cx .btn-outline{background:#fff;border-color:#d2d2d2;color:var(--ink)}
.cx .btn-text{color:var(--accent);padding:4px 8px;font-size:13px;line-height:18px}
.cx .btn-text .i{width:14px;height:14px}
/* Radios */
.cx .radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--ink-2);flex-shrink:0;display:block}
.cx .radio.on{border:5px solid var(--accent);background:#fff;box-shadow:0 2px 4px rgba(23,25,28,.16)}
/* ===== Screen 1: create application ===== */
.cx.s-create .body{flex:1;padding:48px;display:flex}
.cx.s-create .card{flex:1;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;display:flex;flex-direction:column;box-shadow:-4px -20px 50px rgba(16,24,40,.06)}
.cx.s-create .head{padding:64px 64px 20px;display:flex;flex-direction:column;gap:20px}
.cx.s-create .title{display:flex;gap:20px;align-items:center}
.cx.s-create .title .ic{width:60px;height:60px;border-radius:6px;background:var(--accent);display:grid;place-items:center;color:#fff}
.cx.s-create .title .ic .i{width:35px;height:35px}
.cx.s-create .title h1{font:700 24px/38px var(--sans);color:var(--accent)}
.cx.s-create .title p{color:var(--ink-2)}
.cx.s-create .types{display:flex;gap:20px;padding-top:20px}
.cx.s-create .type{flex:1;display:flex;align-items:center;gap:10px;padding:16px;border:2px solid var(--input);border-radius:6px;font:500 17px/26px var(--sans);text-transform:capitalize;color:var(--ink)}
.cx.s-create .type .i{width:25px;height:25px;color:var(--ink)}
.cx.s-create .type span{flex:1}
.cx.s-create .type.on{border-color:var(--accent);background:var(--accent-tint)}
.cx.s-create .type.on .i{color:var(--accent)}
.cx.s-create .sub{padding:32px 64px;display:flex;flex-direction:column;gap:16px}
.cx.s-create .sub h2{font:500 18px/28px var(--sans)}
.cx.s-create .row{display:flex;align-items:center;gap:16px}
.cx.s-create .row .ic{width:46px;height:46px;border-radius:6px;background:var(--accent-soft);display:grid;place-items:center;color:var(--accent)}
.cx.s-create .row .ic .i{width:30px;height:30px}
.cx.s-create .row span{flex:1;font-weight:500}
.cx.s-create .row .radio{margin-right:9px}
.cx.s-create .actions{flex:1;display:flex;align-items:flex-end;justify-content:space-between;padding:0 64px 64px}
/* ===== Screen 2: section form with progress ===== */
.cx.s-form{height:1200px}
.cx.s-form .body{flex:1;display:flex;gap:24px;padding:24px;min-height:0}
.cx.s-form .panel{width:361px;flex-shrink:0;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:6px}
.cx.s-form .panel h2{font:400 18px/28px var(--sans);padding:0 2px}
.cx.s-form .prog{display:flex;align-items:center;gap:8px;margin:2px 2px 8px}
.cx.s-form .bar{flex:1;height:4px;border-radius:2px;background:var(--accent-soft);overflow:hidden}
.cx.s-form .bar i{display:block;height:100%;background:var(--accent);border-radius:2px}
.cx.s-form .bar i.done{background:var(--green)}
.cx.s-form .bar i.flag{background:var(--red)}
.cx.s-form .prog small{font-size:13px;line-height:20px;color:var(--ink-2);min-width:36px;text-align:right}
.cx.s-form .sec{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 10px;border:1px solid var(--card-line);border-radius:6px;background:#fff}
.cx.s-form .sec.on{background:var(--accent-tint);border-color:var(--accent)}
.cx.s-form .sec .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.cx.s-form .sec .t b{font-weight:400;font-size:15px;line-height:22px}
.cx.s-form .sec .t .prog{margin:0;width:196px}
.cx.s-form .sec .t .prog small{color:var(--green-text)}
.cx.s-form .sec .t .prog.mid small{color:var(--ink-2)}
.cx.s-form .sec .t .prog.flag small{color:var(--red)}
.cx.s-form .sec .i{width:16px;height:16px;color:var(--ink)}
.cx.s-form .sec.plain{padding:18px 10px}
.cx.s-form .content{flex:1;min-width:0;display:flex;flex-direction:column}
.cx.s-form .form{background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:20px}
.cx.s-form .form h1{font:500 24px/32px var(--sans)}
.cx.s-form .sub-card{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--card-line);border-radius:6px;padding:16px 20px}
.cx.s-form .sub-card b{display:block;font-weight:400;font-size:16px;line-height:24px}
.cx.s-form .sub-card small{display:block;color:var(--ink-3);font-size:13px;line-height:20px}
.cx.s-form .q{display:flex;flex-direction:column;gap:12px}
.cx.s-form .q label{font-size:15px;line-height:22px}
.cx.s-form .editor{border:1px solid var(--input);border-radius:6px;min-height:150px;padding:12px 16px;display:flex;flex-direction:column;justify-content:space-between}
.cx.s-form .editor p{color:var(--ink-3)}
.cx.s-form .tools{display:flex;justify-content:flex-end;gap:8px;color:#8a8d93}
.cx.s-form .tools .i{width:18px;height:18px}
.cx.s-form .opts{display:flex;gap:30px;padding:2px 8px}
.cx.s-form .opt{display:flex;align-items:center;gap:10px;color:var(--ink)}
.cx.s-form .foot{margin-top:auto;height:64px;background:var(--paper);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px}
/* ===== Screen 3: review with reviewer questions ===== */
.cx.s-review{height:1080px}
.cx.s-review .body{flex:1;display:flex;flex-direction:column;padding:24px;min-height:0}
.cx.s-review .back{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:500;padding:8px 10px;margin:8px 0 18px}
.cx.s-review .back .i{width:16px;height:16px}
.cx.s-review .cols{display:flex;gap:24px;align-items:flex-start}
.cx.s-review .form{flex:1;min-width:0;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:22px}
.cx.s-review .part{display:flex;align-items:center;justify-content:space-between;font:500 14px/22px var(--sans);color:var(--accent)}
.cx.s-review .part span b{font-weight:600}
.cx.s-review .part .i{display:inline-block;width:20px;height:20px;vertical-align:-5px;margin-left:8px}
.cx.s-review .q{display:flex;flex-direction:column;gap:12px}
.cx.s-review .q label{font-size:15px;line-height:22px}
.cx.s-review .editor{border:1px solid var(--input);border-radius:6px;min-height:150px;padding:12px 16px;display:flex;flex-direction:column;justify-content:space-between}
.cx.s-review .editor p{color:var(--ink-3)}
.cx.s-review .tools{display:flex;justify-content:flex-end;gap:8px;color:#8a8d93}
.cx.s-review .tools .i{width:18px;height:18px}
.cx.s-review .rq{width:400px;flex-shrink:0;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:10px}
.cx.s-review .rq h2{font:400 18px/28px var(--sans);padding:0 2px 2px}
.cx.s-review .rqi{border:1px solid var(--card-line);border-radius:6px;padding:12px 10px 12px 12px}
.cx.s-review .rqi .h{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:22px}
.cx.s-review .rqi .h span{flex:1}
.cx.s-review .rqi .h .i{width:28px;height:28px;color:var(--ink);margin-top:-3px}
.cx.s-review .rqi.open{background:#fbfbfb}
.cx.s-review .rqi .hint{color:var(--ink-3);font-size:13px;line-height:20px;margin:10px 0 14px}
.cx.s-review .rqi .acts{display:flex;gap:8px}
.cx.s-review .vote{width:44px;height:38px;border-radius:6px;border:1px solid;display:grid;place-items:center;background:#fff}
.cx.s-review .vote .i{width:24px;height:24px}
.cx.s-review .vote.yes{color:var(--green-text);border-color:var(--green-text)}
.cx.s-review .vote.no{color:var(--red);border-color:var(--red)}
.cx.s-review .comment{flex:1;height:38px;border:1px solid var(--accent-deep);border-radius:6px;display:grid;place-items:center;font:500 14px/22px var(--sans);color:var(--ink)}
.cx.s-review .foot{margin-top:auto;height:64px;background:var(--paper);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px}
/* ===== Screen 4: long section form, viewport crop of a 5008px frame ===== */
.cx.s-long{height:1300px}
.cx.s-long .body{flex:1;display:flex;gap:24px;padding:24px;min-height:0;align-items:flex-start}
.cx.s-long .panel{width:361px;flex-shrink:0;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:12px 10px;display:flex;flex-direction:column;gap:10px}
.cx.s-long .panel h2{font:400 18px/28px var(--sans);padding:0 2px}
.cx.s-long .sec{display:flex;align-items:center;gap:12px;padding:19px 10px;border:1px solid var(--card-line);border-radius:6px;background:#fff;font-size:15px;line-height:22px}
.cx.s-long .sec span{flex:1}
.cx.s-long .sec .i{width:16px;height:16px;color:var(--ink)}
.cx.s-long .sec.on{background:var(--accent-tint);border-color:var(--accent)}
.cx.s-long .form{flex:1;min-width:0;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:24px}
.cx.s-long .form h1{font:500 24px/32px var(--sans)}
.cx.s-long .sub-card{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--card-line);border-radius:6px;padding:16px 20px}
.cx.s-long .sub-card b{display:block;font-weight:400;font-size:16px;line-height:24px}
.cx.s-long .sub-card small{display:block;color:var(--ink-3);font-size:13px;line-height:20px}
.cx.s-long .ips{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.cx.s-long .ip{height:76px;border:1px solid var(--card-line);border-radius:6px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-size:15px}
.cx.s-long .ip b{font-weight:400;color:var(--ink)}
.cx.s-long .ip b i{font-style:normal;color:var(--green)}
.cx.s-long .ip a{color:var(--accent);font-weight:500}
.cx.s-long .q{display:flex;flex-direction:column;gap:12px}
.cx.s-long .q label{font-size:15px;line-height:22px}
.cx.s-long .q .sub{font-size:13px;line-height:20px;color:var(--ink-2)}
.cx.s-long .select,.cx.s-long .input{height:48px;border:1px solid var(--input);border-radius:6px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:var(--ink-3);font-size:15px}
.cx.s-long .select .i{width:20px;height:20px;color:var(--ink)}
.cx.s-long .grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.cx.s-long .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.cx.s-long .f{display:flex;flex-direction:column;gap:8px}
.cx.s-long .editor{border:1px solid var(--input);border-radius:6px;min-height:150px;padding:12px 16px;display:flex;flex-direction:column;justify-content:space-between}
.cx.s-long .editor p{color:var(--ink-3)}
.cx.s-long .tools{display:flex;justify-content:flex-end;gap:8px;color:#8a8d93}
.cx.s-long .tools .i{width:18px;height:18px}
/* ===== Screen 5: final decision ===== */
.cx.s-decide{height:2063px}
.cx.s-decide .body{flex:1;display:flex;flex-direction:column;padding:24px;gap:16px}
.cx.s-decide .back{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:500;padding:8px 10px;margin:4px 0 6px}
.cx.s-decide .back .i{width:16px;height:16px}
.cx.s-decide .card{background:var(--paper);border:1px solid var(--card-line);border-radius:8px}
.cx.s-decide .apphead{display:flex;align-items:center;gap:20px;padding:16px 20px}
.cx.s-decide .apphead .ic{width:44px;height:44px;border-radius:6px;background:var(--accent);display:grid;place-items:center;color:#fff}
.cx.s-decide .apphead .ic .i{width:26px;height:26px}
.cx.s-decide .apphead b{display:block;font:500 18px/28px var(--sans)}
.cx.s-decide .apphead small{display:block;color:var(--ink-2);font-size:15px;line-height:22px}
.cx.s-decide .apphead .chip{margin-left:auto}
.cx.s-decide .chip{display:inline-block;padding:4px 14px;border-radius:30px;font:500 13px/20px var(--sans)}
.cx.s-decide .chip.ok{background:#ecfdf3;color:#027a48}
.cx.s-decide .chip.no{background:#fef3f2;color:#b42318}
.cx.s-decide .cols{display:grid;grid-template-columns:1fr 484px;gap:24px;align-items:start}
.cx.s-decide .stack{display:flex;flex-direction:column;gap:24px}
.cx.s-decide .pad{padding:24px 20px}
.cx.s-decide h2{font:500 24px/32px var(--sans)}
.cx.s-decide .lead{color:var(--ink-2);margin:6px 0 0;font-size:15px}
.cx.s-decide .lbl{font-size:13px;line-height:20px;margin:28px 0 8px}
.cx.s-decide .doc{display:flex;align-items:center;gap:14px;background:#f8f9fa;border:1px solid var(--card-line);border-radius:6px;padding:16px}
.cx.s-decide .doc .ic{width:28px;height:28px;border-radius:4px;background:var(--accent);display:grid;place-items:center;color:#fff}
.cx.s-decide .doc .ic .i{width:15px;height:15px}
.cx.s-decide .doc b{display:block;font-weight:500;font-size:14px;line-height:20px}
.cx.s-decide .doc small{display:block;color:var(--ink-3);font-size:11px;line-height:16px}
.cx.s-decide .doc .eye{margin-left:auto;width:36px;height:36px;border:1px solid var(--card-line);border-radius:6px;background:#fff;display:grid;place-items:center;color:var(--ink)}
.cx.s-decide .doc .eye .i{width:20px;height:20px}
.cx.s-decide .editor{border:1px solid var(--input);border-radius:6px;min-height:270px;padding:14px 16px;display:flex;flex-direction:column;justify-content:space-between}
.cx.s-decide .editor p{color:var(--ink);font-size:15px;line-height:1.55;max-width:none}
.cx.s-decide .tools{display:flex;justify-content:flex-end;gap:8px;color:#8a8d93}
.cx.s-decide .tools .i{width:18px;height:18px}
.cx.s-decide .addhead{display:flex;align-items:flex-start;justify-content:space-between}
.cx.s-decide .x{width:36px;height:36px;border:1px solid var(--card-line);border-radius:6px;display:grid;place-items:center;color:var(--ink)}
.cx.s-decide .x .i{width:20px;height:20px}
.cx.s-decide h3{font:500 18px/28px var(--sans);margin:26px 0 14px}
.cx.s-decide .rev{display:flex;align-items:center;gap:16px;border:1px solid var(--card-line);border-radius:6px;padding:14px 16px;margin-bottom:12px}
.cx.s-decide .rev .ic{width:32px;height:32px;border-radius:4px;background:#b54708;display:grid;place-items:center;color:#fff}
.cx.s-decide .rev .ic .i{width:20px;height:20px}
.cx.s-decide .rev b{display:block;font-weight:400;font-size:15px;line-height:22px}
.cx.s-decide .rev small{display:block;color:var(--ink-2);font-size:13px;line-height:20px}
.cx.s-decide .rev .chip{margin-left:auto}
.cx.s-decide .rev .x{width:32px;height:32px}
.cx.s-decide .tl{position:relative;margin-top:10px}
.cx.s-decide .ev{position:relative;padding:0 0 26px 26px}
.cx.s-decide .ev::before{content:'';position:absolute;left:5px;top:22px;bottom:0;width:1px;background:var(--line)}
.cx.s-decide .ev:last-child::before{display:none}
.cx.s-decide .ev .dot{position:absolute;left:0;top:5px;width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 3px #fff inset}
.cx.s-decide .ev .dot.red{background:#d92d20}.cx.s-decide .ev .dot.green{background:#027a48}
.cx.s-decide .ev .row{display:flex;justify-content:space-between;align-items:baseline}
.cx.s-decide .ev .row b{font-weight:400;font-size:15px}
.cx.s-decide .ev .row small{color:var(--ink-3);font-size:13px}
.cx.s-decide .ev .who{display:flex;align-items:center;gap:12px;margin:10px 0 8px;color:var(--ink-2);font-size:13px}
.cx.s-decide .ev .who i{width:30px;height:30px;border-radius:50%;background:#eceef0;display:grid;place-items:center;font:500 13px/1 var(--sans);font-style:normal;color:var(--ink)}
.cx.s-decide .ev p{font-size:15px;color:var(--ink-2)}
.cx.s-decide .tag{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:6px 10px;border-radius:4px;background:#eceef0;font-size:15px}
.cx.s-decide .tag.link{background:var(--accent-soft);color:#0d6b6c;font-weight:500}
.cx.s-decide .tag .i{width:15px;height:20px}
.cx.s-decide .decision{border:1px solid #027a48;border-radius:6px;padding:14px 12px;margin-top:28px}
.cx.s-decide .decision b{display:block;font:500 15px/22px var(--sans);margin-bottom:8px}
.cx.s-decide .decision .kv{display:flex;justify-content:space-between;align-items:center;font-size:13px;line-height:20px;color:var(--ink-2);padding:4px 0}
.cx.s-decide .decision .kv span:last-child{color:var(--ink);font-weight:500}
.cx.s-decide .foot{margin-top:auto;height:64px;background:var(--paper);border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 24px}
.cx.s-decide .foot .sp{flex:1}
/* ===== Screen 6: committee meeting (expanded sidebar) ===== */
.cx.s-meeting{height:1024px}
.cx.s-meeting .side-wide{width:260px;flex-shrink:0;background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:0 14px 24px}
.cx.s-meeting .side-wide .brand{display:flex;align-items:center;gap:12px;height:124px;padding:0 6px;font:400 30px/1 var(--serif);letter-spacing:-1.6px;color:var(--ink)}
.cx.s-meeting .side-wide .brand svg{width:26px;height:26px;color:var(--accent)}
.cx.s-meeting .side-wide .role{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-3);margin:2px 0 14px}
.cx.s-meeting .side-wide .role::before,.cx.s-meeting .side-wide .role::after{content:'';flex:1;height:1px;background:var(--line)}
.cx.s-meeting .side-wide .role::after{flex:5}
.cx.s-meeting .side-wide a{display:flex;align-items:center;gap:16px;padding:12px 16px;border-radius:8px;font-size:15px;color:var(--ink);margin-bottom:6px}
.cx.s-meeting .side-wide a .i{width:22px;height:22px;color:var(--ink-2)}
.cx.s-meeting .side-wide a.on{background:var(--accent-soft);color:#0d6b6c;font-weight:500}
.cx.s-meeting .side-wide a.on .i{color:var(--accent)}
.cx.s-meeting .side-wide .logout{margin-top:auto}
.cx.s-meeting .body{flex:1;display:flex;flex-direction:column;padding:24px;min-height:0}
.cx.s-meeting .back{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:500;padding:8px 10px;margin:4px 0 18px}
.cx.s-meeting .back .i{width:16px;height:16px}
.cx.s-meeting .card{flex:1;background:var(--paper);border:1px solid var(--card-line);border-radius:8px;padding:18px 18px 20px;display:flex;flex-direction:column;min-height:0}
.cx.s-meeting .mhead{display:flex;align-items:center;gap:14px;padding:0 2px 16px}
.cx.s-meeting .mhead b{display:block;font:500 18px/28px var(--sans)}
.cx.s-meeting .mhead small{display:block;color:var(--ink-2);font-size:15px}
.cx.s-meeting .mhead .sp{flex:1}
.cx.s-meeting .mhead .ico{width:36px;height:36px;display:grid;place-items:center;color:var(--ink)}
.cx.s-meeting .mhead .ico .i{width:22px;height:22px}
.cx.s-meeting .inner{flex:1;border:1px solid var(--card-line);border-radius:6px;padding:20px;position:relative;overflow:hidden;min-height:0}
.cx.s-meeting .inner::after{content:'';position:absolute;right:12px;top:260px;width:6px;height:440px;border-radius:3px;background:#d7dadc}
.cx.s-meeting .sect{display:flex;align-items:center;justify-content:space-between}
.cx.s-meeting .sect h3{font:500 18px/28px var(--sans)}
.cx.s-meeting .sect small{display:block;color:var(--ink-2);font-size:13px;margin-top:2px}
.cx.s-meeting .sect .btn-text{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.cx.s-meeting .sect .btn-text .i{width:14px;height:14px}
.cx.s-meeting .people{display:grid;grid-template-columns:repeat(5,1fr);gap:14px 18px;margin:18px 0 28px}
.cx.s-meeting .person{display:flex;align-items:center;gap:14px}
.cx.s-meeting .person i{width:38px;height:38px;border-radius:50%;background:#eceef0;display:grid;place-items:center;font:500 13px/1 var(--sans);font-style:normal;color:var(--ink)}
.cx.s-meeting .person b{display:block;font-weight:400;font-size:15px;line-height:22px}
.cx.s-meeting .person small{display:block;color:var(--ink-3);font-size:13px;line-height:16px}
.cx.s-meeting .group{margin-top:18px}
.cx.s-meeting .group>span{display:block;font-size:14px;color:var(--ink-2);margin-bottom:12px}
.cx.s-meeting .apps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-right:12px}
.cx.s-meeting .app{border:1px solid var(--card-line);border-radius:6px;padding:16px 20px 18px}
.cx.s-meeting .app b{display:block;font-weight:400;font-size:15px}
.cx.s-meeting .app small{display:block;color:var(--ink-2);font-size:13px;margin:2px 0 14px}
.cx.s-meeting .app .row{display:flex;align-items:center;justify-content:space-between}
.cx.s-meeting .app .cm{background:#fffaeb;color:#b54708;border-radius:4px;padding:4px 8px;font-size:12px}
.cx.s-meeting .app .view{border:1px solid var(--accent);color:var(--accent);border-radius:6px;padding:6px 14px;font:500 13px/20px var(--sans)}
.cx.s-meeting .toast{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:inline-flex;align-items:center;gap:10px;padding:12px 18px;background:#fff;border:1px solid var(--green-text);border-radius:6px;font-size:15px}
.cx.s-meeting .toast .i{width:20px;height:20px;color:var(--green-text)}

/* ===== Record stage section (index.html survivor: <section class="record-stage">) ===== */
.record-stage{background:#17191c;color:#fff;padding:0 0 100px;margin-top:-40px;overflow:hidden}
html:not(.has-stage) .record-stage{display:none}
.record-stage .stage-head{margin:0 7%;max-width:720px;padding-top:40px;border-top:1px solid #2c3033}
.record-stage .stage-head .eyebrow{color:#94dfc0}
.record-stage .stage-head h3{font:400 clamp(30px,2.9vw,44px)/1.1 var(--serif);letter-spacing:-.035em;margin:18px 0 14px}
.record-stage .stage-head h3 em{color:#afb7b7}
.record-stage .stage-head .body-copy{color:#9aa3a3;font-size:15px;max-width:60ch}
.stage{position:relative;height:clamp(360px,44vw,640px);margin-top:44px;perspective:1600px;outline:none}
.stage:focus-visible{outline:2px solid #94dfc0;outline-offset:-2px}
.stage-track{position:absolute;inset:0;display:grid;place-items:center}
.stage-item{position:absolute;width:min(62vw,900px);aspect-ratio:1440/1024;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .55s;cursor:pointer;will-change:transform}
.stage-frame{position:relative;width:100%;height:100%;overflow:hidden;border-radius:10px;border:1px solid #3a3f43;background:#f3f4f5;box-shadow:0 40px 100px #000000a6,0 2px 4px #0000003d}
.stage-frame .cx{position:absolute;left:0;top:0;transform-origin:0 0}
.stage-item.is-active .stage-frame{overflow-y:auto;scrollbar-width:none;cursor:default}
.stage-item.is-active .stage-frame::-webkit-scrollbar{display:none}
.stage-item:not(.is-active) .stage-frame::after{content:'';position:absolute;inset:0;background:#17191c;opacity:.35;pointer-events:none}
.stage-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:20;width:48px;height:48px;border-radius:50%;border:1px solid #ffffff40;background:#17191ccc;color:#fff;font:18px/1 var(--sans);cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px)}
.stage-arrow:hover,.stage-arrow:focus-visible{border-color:#94dfc0;color:#94dfc0;outline:none}
.stage-arrow.prev{left:5%}.stage-arrow.next{right:5%}
.stage-caption{margin:40px auto 0;max-width:560px;padding:0 24px;text-align:center;display:flex;flex-direction:column;align-items:center}
.stage-caption .stage-step{display:inline-block;font:600 10px/1 var(--sans);letter-spacing:.14em;color:#17191c;background:#94dfc0;border-radius:3px;padding:6px 8px}
.stage-caption .stage-side{font:600 11px/1.5 var(--sans);letter-spacing:.15em;color:#94dfc0;margin:16px 0 8px}
.stage-caption h4{font:400 clamp(24px,2.4vw,36px)/1.12 var(--serif);letter-spacing:-.03em;margin:0 0 12px;max-width:none}
.stage-caption p.stage-cap{font-size:15px;line-height:1.65;color:#9aa3a3;margin:0;max-width:52ch}
.stage-dots{display:flex;justify-content:center;gap:10px;margin-top:26px}
.stage-dots button{width:10px;height:10px;border-radius:50%;border:1px solid #94dfc0;background:transparent;padding:0;cursor:pointer}
.stage-dots button[aria-current="true"]{background:#94dfc0}
.stage-dots button:focus-visible{outline:2px solid #94dfc0;outline-offset:3px}
@media(max-width:760px){.record-stage{padding-bottom:70px}.record-stage .stage-head{margin:0 6%}.stage{height:62vw;min-height:260px}.stage-item{width:84vw}.stage-arrow{width:40px;height:40px}.stage-arrow.prev{left:8px}.stage-arrow.next{right:8px}.stage-caption{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.stage-item{transition:none}}