/* Invoice reconciliation walkthrough (blog field notes, video of 4 Nov 2026).
   Scoped to .os-wt .cir. Landscape stage 1280 x 720, phone stage (.stage.p)
   540 x 900, like the theme's other walkthroughs. Positions, sizes and
   colours were measured from the video frame by frame. */
.os-wt .cir .pbox{background:linear-gradient(180deg,#191916,#23211D)}
.os-wt .cir .stage{font-size:16px;line-height:1.3;font-weight:400;letter-spacing:0;text-align:left}
.os-wt .cir .scene{padding:0}
.os-wt .cir .scene>*{position:absolute;margin:0}
/* low weight on purpose, so the margins set below win */
.os-wt .cir :where(.scene p,.scene div,.scene ol,.scene li){margin:0;list-style:none}
.os-wt .cir .scene ol{padding:0}
.os-wt .cir a{text-decoration:none}
.os-wt .cir .ir-br{display:block;height:0}
.os-wt .cir .ir-lab{font-family:var(--mono);font-size:14px;line-height:1;letter-spacing:.2em;text-transform:uppercase;color:#A6A39F}
.os-wt .cir .ir-h1{font-size:64px;line-height:70px;font-weight:300;letter-spacing:.012em;color:#FBF7F1}
.os-wt .cir .ir-h2{font-size:48px;line-height:58px;font-weight:300;letter-spacing:-.017em;color:#FBF7F1;white-space:nowrap}
.os-wt .cir .ir-sub,.os-wt .cir .ir-deck,.os-wt .cir .ir-p{font-size:22px;line-height:32px;letter-spacing:.013em;color:#B7B2AE}
.os-wt .cir .ir-w{color:#FBF7F1}
.os-wt .cir .ir-card{background:#2F2F2A;border:1px solid #43433E;border-radius:4px;box-sizing:border-box;box-shadow:0 18px 40px -26px rgb(0 0 0 / .8)}
.os-wt .cir em{font-family:var(--serif);font-style:italic;font-weight:600;color:var(--gold);letter-spacing:-.01em}
.os-wt .cir .ir-rule{display:block;height:1px;background:rgb(251 247 241 / .38);transform-origin:0 50%}
.os-wt .cir .ir-grid{position:absolute;inset:0;pointer-events:none;visibility:hidden;opacity:0}
.os-wt .cir .ir-grid i{position:absolute;width:9.4px;height:9.4px;margin:-4.7px 0 0 -4.7px;border-radius:50%;background:#878178;opacity:0}
.os-wt .cir .ir-go{display:block;width:0;height:0;overflow:hidden}
.os-wt .cir .ir-nx,.os-wt .cir .ir-pass3 span,.os-wt .cir .ir-held span{font-family:var(--mono)}

/* 1. field notes */
.os-wt .ir-open .ir-rule{left:133px;top:200px;width:1014px}
.os-wt .ir-open .ir-lab{left:133px;top:228px}
.os-wt .ir-open .ir-h1{left:133px;top:271px;width:880px}
.os-wt .ir-open .ir-deck{left:133px;top:442px;width:760px}
.os-wt .ir-open .ir-by{left:133px;top:616px}

/* 2 and 3: words on the left, the grid on the right */
.os-wt .ir-l>*{left:107px}
.os-wt .ir-job .ir-lab{top:149px}
.os-wt .ir-job .ir-h2{top:186px;width:560px;line-height:53px;white-space:normal}
.os-wt .ir-job .ir-sub{top:367px;width:555px}
.os-wt .ir-job .ir-note{top:505px}
.os-wt .cir .ir-chips{left:721px;top:561px;width:464px;display:flex;flex-wrap:wrap;justify-content:center;gap:11px}
.os-wt .ir-chips span{height:38px;line-height:36px;padding:0 13px;box-sizing:border-box;border:1px solid #4A4844;border-radius:3px;background:#1D1C19;font-family:var(--mono);font-size:16px;color:#D9D8D2;white-space:nowrap}
.os-wt .ir-500 .ir-lab{top:122.5px}
.os-wt .ir-500 .ir-k{top:160px}
.os-wt .ir-500 .k1{width:310px}
.os-wt .cir .ir-500 .k2{left:470px;width:150px}
.os-wt .ir-k b{display:block;font-size:100px;line-height:100px;font-weight:300;letter-spacing:-.02em;color:#FBF7F1;white-space:nowrap}
.os-wt .ir-k.k2 b{color:var(--gold)}
.os-wt .ir-k span{display:block;margin-top:21px;font-size:20px;line-height:26px;letter-spacing:.012em;color:#B7B2AE}
.os-wt .ir-500 .ir-kl{top:375px}
.os-wt .ir-500 .ir-kinds{top:399px;width:506px}
.os-wt .ir-kinds p{display:flex;justify-content:space-between;height:45.3px;line-height:45px;border-top:1px solid rgb(251 247 241 / .1);font-size:21px;color:#FBF7F1}
.os-wt .ir-kinds b{font-family:var(--mono);font-weight:400;font-size:20px;color:#D9D6CE}

/* 4 to 9: heading at the top, the content below */
.os-wt .ir-t>.ir-lab{left:107px;top:93.5px}
.os-wt .ir-t>.ir-h2{left:107px;top:123px}
.os-wt .ir-t>.ir-sub{left:107px;top:194.5px;width:1100px;white-space:nowrap}
.os-wt .cir .ir-cards{left:107px;top:267px;width:1066px;display:grid;grid-template-columns:repeat(3,1fr);gap:33px}
.os-wt .ir-cards .ir-card{position:relative;min-height:312px;padding:27px 20px 24px 28px}
.os-wt .ir-ct{display:flex;align-items:baseline;gap:24px}
.os-wt .ir-ct b{font-size:76px;line-height:76px;font-weight:300;letter-spacing:-.02em;color:#FBF7F1}
.os-wt .ir-ct span{font-size:22px;line-height:27px;color:#FBF7F1;max-width:150px}
.os-wt .ir-amt{margin-top:8px;font-family:var(--mono);font-size:30px;line-height:36px;color:#FBF7F1;white-space:nowrap}
.os-wt .ir-amt.g{color:var(--gold)}
.os-wt .ir-cards .ir-cp{margin-top:12px;font-size:17px;line-height:24.3px;color:#B7B2AE}
.os-wt .ir-nx{margin-top:17px;font-size:14px;line-height:20px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:#FBF7F1}
.os-wt .cir .ir-tbl{left:107px;top:253.5px;width:1066px}
.os-wt .ir-th,.os-wt .ir-tr{display:grid;grid-template-columns:200px 55px 1fr 280px;align-items:center}
.os-wt .ir-th{height:48px;font-family:var(--mono);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:#A6A39F}
.os-wt .ir-tr{height:59.3px;border-top:1px solid rgb(251 247 241 / .1);font-size:22px;color:#FBF7F1}
.os-wt .ir-th span:nth-child(2),.os-wt .ir-tr span:nth-child(2){text-align:right}
.os-wt .ir-th span:nth-child(3),.os-wt .ir-tr span:nth-child(3){padding-left:17px}
.os-wt .ir-tr span:nth-child(1){font-family:var(--mono);font-size:20px;color:#D9D6CE}
.os-wt .ir-tr span:nth-child(2){font-family:var(--mono)}
.os-wt .ir-tr span:nth-child(4){font-size:20px;color:#E5E0D6}
.os-wt .ir-wait .ir-held{left:107px;top:573px;width:1066px;color:#B7B2AE}
.os-wt .ir-held span,.os-wt .ir-pass3 span{color:var(--gold)}
.os-wt .ir-mind>.ir-lab{top:81px}
.os-wt .cir .ir-mind>.ir-h2{top:111px;line-height:54px}
.os-wt .cir .ir-dec{left:107px;top:253px;width:466px}
.os-wt .ir-dec li{position:relative;height:80px;box-sizing:border-box;padding:11px 0 0 25px;border-top:1px solid rgb(251 247 241 / .1);font-size:21px;line-height:28px;color:#FBF7F1}
.os-wt .ir-dec li i{position:absolute;left:0;top:13px;font-style:normal;font-family:var(--mono);font-size:14px;line-height:28px;color:#A6A39F}
.os-wt .cir .ir-mv{left:640px;top:255px;width:620px;height:270px}
.os-wt .ir-mb{position:absolute;left:0;right:0;height:64px}
.os-wt .ir-mb.b1{top:0}
.os-wt .ir-mb.b2{top:100px}
.os-wt .ir-mb.b3{top:200px}
.os-wt .ir-ml{font-family:var(--mono);font-size:14px;line-height:14px;letter-spacing:.2em;text-transform:uppercase;color:#A6A39F}
.os-wt .ir-mb i{position:absolute;left:0;top:31px;height:31px;width:4px;background:#A39E92;transform-origin:0 50%;transition:background .4s}
.os-wt .ir-mb b{position:absolute;left:0;top:31px;line-height:31px;font-family:var(--mono);font-weight:400;font-size:26px;color:#FBF7F1;white-space:nowrap}
.os-wt .ir-mb .t::before{content:" → "}
.os-wt .ir-mb.on i{background:var(--gold)}
.os-wt .ir-mb.on b{color:var(--gold)}
.os-wt .ir-mind .ir-over{left:107px;top:572px;width:1066px}
.os-wt .ir-rules .ir-rl,.os-wt .ir-rules .ir-cl{top:255px}
.os-wt .ir-rules .ir-cl{left:667px}
.os-wt .ir-rules .ir-rl{left:107px}
.os-wt .cir .ir-boxes{left:107px;top:286px;width:440px;display:grid;grid-template-columns:repeat(5,80px);gap:10px 9.3px}
.os-wt .ir-boxes span{height:42px;line-height:40px;box-sizing:border-box;text-align:center;background:#2F2F2A;border:1px solid #4A4844;border-radius:3px;font-family:var(--mono);font-size:17px;color:#D9D6CE}
.os-wt .cir .ir-conds{left:667px;top:285.5px;width:420px;display:grid;grid-template-columns:repeat(9,35.5px);gap:9.5px 9.8px}
.os-wt .ir-conds span{position:relative;width:35.5px;height:35.5px;box-sizing:border-box;border:1.5px solid #5A5853;border-radius:50%}
.os-wt .ir-conds span i{position:absolute;inset:-1.5px;border-radius:50%;background:#D7D1C8;opacity:0}
.os-wt .ir-rules .ir-pass3{left:667px;top:431px;width:500px;font-size:28px;line-height:33px;color:#FBF7F1}
.os-wt .ir-rules .ir-nm{left:107px;top:560px;width:1066px}
.os-wt .ir-rules .ir-so{left:107px;top:601px}
.os-wt .ir-trust .ir-cards{top:260px}
.os-wt .ir-tc .ir-card{min-height:253px;padding:25px 20px 22px 28px}
.os-wt .ir-big{line-height:72px;white-space:nowrap}
.os-wt .ir-big b{font-family:var(--mono);font-weight:400;font-size:72px;color:#FBF7F1}
.os-wt .ir-big small{font-family:var(--mono);font-size:30px;color:#A9A398}
.os-wt .ir-c2{margin-top:-8px;font-size:22px;line-height:28px;color:#FBF7F1}
.os-wt .ir-tc .ir-cp{margin-top:10px}
.os-wt .ir-trust .ir-nw{left:107px;top:565px;font-size:36px;line-height:44px;font-weight:300;color:#FBF7F1;transition:color .5s}
.os-wt .ir-trust .ir-nw.on{color:var(--gold)}
.os-wt .ir-cost .ir-bar{left:107px;width:1120px;height:42px}
.os-wt .ir-cost .b1{top:315px}
.os-wt .ir-cost .b2{top:408px}
.os-wt .ir-cost .b3{top:501px}
.os-wt .ir-bar>*{position:absolute}
.os-wt .ir-bar p{left:0;top:-4px;width:290px}
.os-wt .ir-bar p b{display:block;font-size:24px;line-height:30px;font-weight:400;color:#FBF7F1;white-space:nowrap}
.os-wt .ir-bar p small{display:block;margin-top:3px;font-family:var(--mono);font-size:12px;line-height:14px;letter-spacing:.2em;text-transform:uppercase;color:#A7A39C;white-space:nowrap}
.os-wt .ir-bar i{left:306px;top:0;height:42px;background:#A39E92;transform-origin:0 50%}
.os-wt .ir-bar.b3 i{background:var(--gold);transform-origin:50% 50%}
.os-wt .ir-bar em{top:0;line-height:42px;font-family:var(--mono);font-style:normal;font-weight:400;font-size:30px;color:#FBF7F1;letter-spacing:0;white-space:nowrap}
.os-wt .ir-bar.b3 em{font-family:var(--sans);font-size:32px;font-weight:400;color:var(--gold)}
.os-wt .ir-cost .ir-fn{left:107px;top:597px;width:1000px;font-size:17px;line-height:25px;letter-spacing:.012em;color:#B3B2AC}

/* 10. next month */
.os-wt .ir-next .ir-lab{left:134px;top:194.5px}
.os-wt .cir .ir-next .ir-big2{left:134px;top:240px;font-size:56px;line-height:62px;white-space:normal;width:1000px}
.os-wt .ir-next .ir-np{left:134px;top:394.5px;width:930px;font-size:26px;line-height:38px}
.os-wt .ir-np em{font-size:1.15em}

/* 11. in short */
.os-wt .ir-sum .ir-sl{left:133px;width:1000px;font-size:47px;line-height:56px;font-weight:300;letter-spacing:-.004em;color:#FBF7F1;white-space:nowrap}
.os-wt .ir-sum .ir-sl:nth-child(1){top:137px}
.os-wt .ir-sum .ir-sl:nth-child(2){top:202px}
.os-wt .ir-sum .ir-sl:nth-child(3){top:269px}
.os-wt .cir .ir-sum .ir-sl:nth-child(4){top:334px;width:640px;line-height:64px;white-space:normal}
.os-wt .ir-sum .ir-sl em{font-size:1.2em;line-height:0;letter-spacing:-.02em}
.os-wt .ir-sum .ir-rule{left:133px;top:534px;width:1014px}
.os-wt .ir-sum .ir-facts{left:133px;top:560px;white-space:nowrap}

/* 12. the end card: laid out as in the video (the theme adds the two buttons) */
.os-wt .cir .endc{justify-content:flex-start;padding-top:75px}
.os-wt .cir .endc .lm{width:100px;height:120px}
.os-wt .cir .endc .on1{margin-top:17px}
.os-wt .cir .endc .ln{width:134px;margin:28px auto 34px}
.os-wt .cir .endc .ts{margin-top:19px;letter-spacing:.26em}
.os-wt .cir .endc .etl{font-size:26px;font-weight:300;letter-spacing:.014em;margin-top:28px}
.os-wt .cir .endc .bt{margin-top:24px}
.os-wt .cir .endc .url{font-size:14px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#FBF7F1;margin-top:55px}
.os-wt .cir .endc .fine{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#8C877E;margin-top:20px}

/* ---------- phones: the tall stage (540 x 900) ---------- */
.os-wt .cir .stage.p .ir-lab{font-size:13px;letter-spacing:.16em;line-height:1.35}
.os-wt .cir .stage.p .ir-grid i{width:8.4px;height:8.4px;margin:-4.2px 0 0 -4.2px}
.os-wt .cir .stage.p .ir-sub,.os-wt .cir .stage.p .ir-deck,.os-wt .cir .stage.p .ir-p{font-size:19px;line-height:27px;white-space:normal}
.os-wt .cir .stage.p .ir-h2{font-size:36px;line-height:42px;white-space:normal;width:480px}
.os-wt .stage.p .ir-open .ir-rule{left:30px;top:150px;width:480px}
.os-wt .stage.p .ir-open .ir-lab{left:30px;top:174px}
.os-wt .stage.p .ir-open .ir-h1{left:30px;top:214px;width:480px;font-size:46px;line-height:52px}
.os-wt .stage.p .ir-open .ir-deck{left:30px;top:396px;width:480px;font-size:21px;line-height:30px}
.os-wt .stage.p .ir-open .ir-by{left:30px;top:620px;width:480px}
.os-wt .stage.p .ir-l>*{left:30px}
.os-wt .stage.p .ir-job .ir-lab,.os-wt .stage.p .ir-500 .ir-lab{top:58px}
.os-wt .cir .stage.p .ir-job .ir-h2{top:88px;font-size:40px;line-height:45px}
.os-wt .stage.p .ir-job .ir-sub{top:244px;width:480px}
.os-wt .stage.p .ir-job .ir-note{top:345px;width:480px}
.os-wt .cir .stage.p .ir-chips{left:30px;top:380px;width:480px;justify-content:flex-start;gap:8px}
.os-wt .stage.p .ir-chips span{height:32px;line-height:30px;padding:0 12px;font-size:14px}
.os-wt .stage.p .ir-500 .ir-k{top:86px}
.os-wt .cir .stage.p .ir-500 .k1{width:240px}
.os-wt .cir .stage.p .ir-500 .k2{left:290px;width:200px}
.os-wt .stage.p .ir-k b{font-size:72px;line-height:72px}
.os-wt .stage.p .ir-k span{margin-top:10px;font-size:17px;line-height:23px}
.os-wt .stage.p .ir-500 .ir-kl{top:232px}
.os-wt .stage.p .ir-500 .ir-kinds{top:254px;width:480px}
.os-wt .stage.p .ir-kinds p{height:40px;line-height:40px;font-size:18px}
.os-wt .stage.p .ir-kinds b{font-size:17px}
.os-wt .stage.p .ir-t>.ir-lab{left:30px;top:56px;width:480px}
.os-wt .stage.p .ir-t>.ir-h2{left:30px;top:84px}
.os-wt .stage.p .ir-t>.ir-sub{left:30px;top:184px;width:480px;font-size:17px;line-height:24px;white-space:normal}
.os-wt .cir .stage.p .ir-cards{left:30px;top:186px;width:480px;grid-template-columns:1fr;gap:12px}
.os-wt .stage.p .ir-cards .ir-card{min-height:0;padding:16px 20px}
.os-wt .stage.p .ir-ct b{font-size:52px;line-height:52px}
.os-wt .stage.p .ir-ct span{font-size:19px;line-height:23px;max-width:none}
.os-wt .stage.p .ir-amt{margin-top:6px;font-size:24px;line-height:30px}
.os-wt .stage.p .ir-cards .ir-cp{margin-top:6px;font-size:15px;line-height:20px}
.os-wt .stage.p .ir-nx{margin-top:8px;font-size:12px;line-height:17px}
.os-wt .cir .stage.p .ir-tbl{left:30px;top:186px;width:480px}
.os-wt .stage.p .ir-th{display:none}
.os-wt .stage.p .ir-tr{height:auto;padding:12px 0;grid-template-columns:90px 50px 1fr;row-gap:2px;font-size:18px}
.os-wt .stage.p .ir-tr span:nth-child(1){font-size:16px}
.os-wt .stage.p .ir-tr span:nth-child(4){grid-column:3;padding-left:17px;font-size:15px;color:#A6A39F}
.os-wt .stage.p .ir-wait .ir-held{left:30px;top:700px;width:480px}
.os-wt .stage.p .ir-mind>.ir-lab{top:56px}
.os-wt .cir .stage.p .ir-mind>.ir-h2{top:84px;line-height:42px}
.os-wt .cir .stage.p .ir-dec{left:30px;top:186px;width:480px}
.os-wt .stage.p .ir-dec li{height:auto;min-height:58px;padding:8px 0 8px 25px;font-size:18px;line-height:24px}
.os-wt .stage.p .ir-dec li i{top:8px;line-height:24px}
.os-wt .cir .stage.p .ir-mv{left:30px;top:440px;width:480px;height:240px}
.os-wt .stage.p .ir-mb.b2{top:84px}
.os-wt .stage.p .ir-mb.b3{top:168px}
.os-wt .stage.p .ir-ml{font-size:12px;letter-spacing:.14em}
.os-wt .stage.p .ir-mb i{top:24px;height:26px}
.os-wt .stage.p .ir-mb b{top:52px;line-height:26px;font-size:20px}
.os-wt .stage.p .ir-mind .ir-over{left:30px;top:720px;width:480px}
.os-wt .stage.p .ir-rules .ir-rl{left:30px;top:186px}
.os-wt .cir .stage.p .ir-boxes{left:30px;top:212px}
.os-wt .stage.p .ir-rules .ir-cl{left:30px;top:388px}
.os-wt .cir .stage.p .ir-conds{left:30px;top:414px}
.os-wt .stage.p .ir-rules .ir-pass3{left:30px;top:560px;width:480px;font-size:24px;line-height:30px}
.os-wt .stage.p .ir-rules .ir-nm{left:30px;top:650px;width:480px}
.os-wt .stage.p .ir-rules .ir-so{left:30px;top:740px;width:480px}
.os-wt .stage.p .ir-tc .ir-card{padding:14px 20px}
.os-wt .stage.p .ir-big{line-height:52px}
.os-wt .stage.p .ir-big b{font-size:52px}
.os-wt .stage.p .ir-big small{font-size:22px}
.os-wt .stage.p .ir-c2{margin-top:4px;font-size:19px;line-height:24px}
.os-wt .stage.p .ir-tc .ir-cp{margin-top:4px}
.os-wt .stage.p .ir-trust .ir-nw{left:30px;top:790px;font-size:30px}
.os-wt .stage.p .ir-cost .ir-bar{left:30px;width:480px;height:100px}
.os-wt .stage.p .ir-cost .b1{top:262px}
.os-wt .stage.p .ir-cost .b2{top:382px}
.os-wt .stage.p .ir-cost .b3{top:502px}
.os-wt .stage.p .ir-bar p{top:0;width:480px}
.os-wt .stage.p .ir-bar p b{font-size:21px;line-height:26px}
.os-wt .stage.p .ir-bar p small{font-size:11px}
.os-wt .stage.p .ir-bar i{left:0;top:58px;height:34px}
.os-wt .stage.p .ir-bar em{top:58px;line-height:34px;font-size:24px}
.os-wt .stage.p .ir-bar.b3 em{font-size:26px}
.os-wt .stage.p .ir-cost .ir-fn{left:30px;top:640px;width:480px;font-size:15px;line-height:22px}
.os-wt .stage.p .ir-next .ir-lab{left:30px;top:170px;width:480px}
.os-wt .cir .stage.p .ir-next .ir-big2{left:30px;top:210px;width:480px;font-size:42px;line-height:48px}
.os-wt .stage.p .ir-next .ir-np{left:30px;top:340px;width:480px;font-size:20px;line-height:30px}
.os-wt .cir .stage.p .ir-sum{display:flex;flex-direction:column;align-items:flex-start;padding:150px 30px 0}
.os-wt .cir .stage.p .ir-sum>*{position:relative;left:auto;top:auto}
.os-wt .cir .stage.p .ir-sum .ir-sl{width:480px;font-size:32px;line-height:40px;white-space:normal;margin-bottom:12px;top:auto}
.os-wt .stage.p .ir-sum .ir-rule{width:480px;margin-top:36px}
.os-wt .stage.p .ir-sum .ir-facts{width:480px;margin-top:22px;white-space:normal;line-height:1.7}
.os-wt .cir .stage.p .endc{padding-top:160px}
.os-wt .cir .stage.p .endc .ts,.os-wt .cir .stage.p .endc .fine{white-space:normal;max-width:460px;line-height:1.6}