:root{--mason-navy:#0d2947;--mason-blue:#174a78;--mason-charcoal:#242b35;--mason-charcoal-deep:#151a21;--mason-tan:#c7ae78;--mason-green:#35d08a;--mason-text:#f7f9fc;--mason-muted:#b8c4d2}
.mason-guide-launcher{position:fixed;right:22px;bottom:22px;z-index:8500;display:flex;align-items:center;gap:9px;min-height:48px;padding:0 18px;border:1px solid rgba(111,184,255,.55);border-radius:999px;background:linear-gradient(145deg,#174a78,#0d2947);box-shadow:0 16px 38px rgba(0,0,0,.38);color:#fff;font:800 12px/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.mason-guide-launcher:hover,.mason-guide-launcher:focus-visible{transform:translateY(-2px);box-shadow:0 20px 44px rgba(0,0,0,.46)}.mason-guide-launcher-mark{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#fff;color:#0d2947;font-size:16px}.mason-guide-launcher-progress{color:#bfe9d4;font-size:10px}
.mason-guide-drawer[hidden]{display:none}.mason-guide-drawer{position:fixed;inset:0 0 0 auto;z-index:8600;width:min(440px,100vw);display:flex;flex-direction:column;border-left:1px solid rgba(111,184,255,.34);background:linear-gradient(155deg,#303844 0%,#202731 48%,#121820 100%);box-shadow:-24px 0 70px rgba(0,0,0,.48);color:var(--mason-text);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}.mason-guide-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:24px 24px 18px;border-bottom:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,#174a78,#0d2947)}.mason-guide-kicker{display:block;margin-bottom:7px;color:#bfe9d4;font-size:10px;font-weight:900;letter-spacing:.18em}.mason-guide-header h2{margin:0;color:#fff;font-size:25px;line-height:1.05}.mason-guide-close{flex:0 0 auto;width:38px;height:38px;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font-size:23px;cursor:pointer}.mason-guide-close:hover{background:rgba(255,255,255,.16)}
.mason-guide-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.1)}.mason-guide-mode{min-width:0;padding:10px 7px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:#151d27;color:#dce4ee;font-size:10px;font-weight:800;line-height:1.2;cursor:pointer}.mason-guide-mode.active{border-color:#5ea5e8;background:#174a78;color:#fff;box-shadow:0 8px 18px rgba(13,41,71,.42)}
.mason-guide-body{flex:1;min-height:0;overflow-y:auto;padding:20px 22px 26px;scrollbar-color:#2b6da7 #141b24}.mason-guide-summary h3{margin:0 0 8px;color:#fff;font-size:21px;line-height:1.15}.mason-guide-summary p{margin:0;color:var(--mason-muted);font-size:13px;line-height:1.55}.mason-guide-meta{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:12px;color:#dce5ef;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.mason-guide-follow-status{padding:3px 7px;border:1px solid rgba(53,208,138,.42);border-radius:999px;background:rgba(53,208,138,.1);color:#8ce8bd}.mason-guide-progress-track{height:7px;margin:17px 0 7px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}.mason-guide-progress-bar{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#2b7db9,#35d08a);transition:width .25s ease}.mason-guide-progress-copy{display:flex;justify-content:space-between;color:#aebccc;font-size:10px}
.mason-guide-step-list{display:grid;gap:7px;margin:18px 0}.mason-guide-step-tab{display:grid;grid-template-columns:27px minmax(0,1fr) auto;align-items:center;gap:9px;width:100%;padding:10px 11px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(8,14,21,.48);color:#dfe7f1;text-align:left;cursor:pointer}.mason-guide-step-tab:hover{border-color:rgba(94,165,232,.6)}.mason-guide-step-tab.active{border-color:#5ea5e8;background:rgba(23,74,120,.46)}.mason-guide-step-tab.complete{border-color:rgba(53,208,138,.4)}.mason-guide-step-number{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#25303c;color:#fff;font-size:11px;font-weight:900}.mason-guide-step-tab.complete .mason-guide-step-number{background:#176d4c;color:#fff}.mason-guide-step-name{min-width:0;color:#fff;font-size:12px;font-weight:800;line-height:1.25}.mason-guide-step-state{color:#91a3b6;font-size:9px;font-weight:800}.mason-guide-step-tab.complete .mason-guide-step-state{color:#80e2b4}
.mason-guide-card{padding:18px;border:1px solid rgba(199,174,120,.4);border-radius:15px;background:linear-gradient(145deg,#2f3742,#171d25);box-shadow:0 18px 36px rgba(0,0,0,.28)}.mason-guide-card-label{margin:0 0 7px;color:#d6bd82;font-size:9px;font-weight:900;letter-spacing:.16em}.mason-guide-card h4{margin:0;color:#fff;font-size:19px}.mason-guide-card-summary{margin:11px 0;color:#dce4ed;font-size:13px;line-height:1.58}.mason-guide-success{margin-top:14px;padding:12px;border-left:3px solid #35d08a;border-radius:0 8px 8px 0;background:rgba(53,208,138,.08)}.mason-guide-success strong{display:block;margin-bottom:4px;color:#7be4b5;font-size:9px;letter-spacing:.11em}.mason-guide-success span{color:#dfe9e5;font-size:12px;line-height:1.45}.mason-guide-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px}.mason-guide-actions button,.mason-guide-actions a{display:flex;align-items:center;justify-content:center;min-height:42px;padding:9px 11px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:#18222e;color:#fff;font-size:10px;font-weight:900;text-align:center;text-decoration:none;cursor:pointer}.mason-guide-actions .primary{border-color:#3c83c3;background:linear-gradient(145deg,#256ba5,#174a78)}.mason-guide-actions .complete{border-color:#2c9b6b;background:#176d4c}.mason-guide-actions button:disabled{opacity:.42;cursor:not-allowed}.mason-guide-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 20px;border-top:1px solid rgba(255,255,255,.1);background:#111821}.mason-guide-footer button{border:0;background:transparent;color:#aebccc;font-size:9px;font-weight:800;cursor:pointer}.mason-guide-footer button:hover{color:#fff}.mason-guide-complete-note{padding:14px;border:1px solid rgba(53,208,138,.45);border-radius:10px;background:rgba(53,208,138,.1);color:#c7f5df;font-size:12px;line-height:1.5}
@media(max-width:600px){.mason-guide-launcher{right:12px;bottom:12px}.mason-guide-drawer{width:100vw}.mason-guide-header{padding:19px 18px 15px}.mason-guide-body{padding:17px}.mason-guide-modes{padding:11px}.mason-guide-actions{grid-template-columns:1fr}.mason-guide-launcher-progress{display:none}}
@media(prefers-reduced-motion:reduce){.mason-guide-launcher,.mason-guide-progress-bar{transition:none!important}}
.mason-guide-teaching{display:grid;gap:10px;margin:14px 0;padding:12px;border:1px solid rgba(94,165,232,.38);border-radius:12px;background:rgba(9,23,38,.65)}.mason-guide-teaching-label{margin:0;color:#80bff5;font-size:9px;font-weight:900;letter-spacing:.14em}.mason-guide-instruction-list{display:flex;gap:6px;overflow-x:auto;padding-bottom:3px}.mason-guide-instruction{display:flex;align-items:center;gap:6px;flex:0 0 auto;max-width:170px;padding:7px 9px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#151d27;color:#dce5ef;font-size:9px;cursor:pointer}.mason-guide-instruction span{display:grid;place-items:center;flex:0 0 19px;height:19px;border-radius:50%;background:#293746;color:#fff;font-weight:900}.mason-guide-instruction strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mason-guide-instruction.active{border-color:#67b6ff;background:#174a78;color:#fff;box-shadow:0 0 0 2px rgba(74,163,255,.13)}.mason-guide-explanation{padding:12px;border-left:4px solid #4297e8;border-radius:7px;background:rgba(66,151,232,.12)}.mason-guide-explanation strong{display:block;margin-bottom:5px;color:#fff;font-size:13px}.mason-guide-explanation p{margin:0;color:#d7e1ec;font-size:12px;line-height:1.55}
.mason-guide-pointer{position:fixed;z-index:8550;max-width:220px;padding:10px 14px;border:2px solid #a9dcff;border-radius:999px;background:linear-gradient(145deg,#2d8ce0,#12528b);box-shadow:0 10px 30px rgba(0,0,0,.5),0 0 0 5px rgba(52,155,245,.18);color:#fff;font:900 10px/1.1 Arial,sans-serif;letter-spacing:.09em;text-align:center;pointer-events:none}.mason-guide-pointer::after{content:"";position:absolute;left:50%;bottom:-13px;width:18px;height:18px;border-right:3px solid #a9dcff;border-bottom:3px solid #a9dcff;background:#1968aa;transform:translateX(-50%) rotate(45deg)}.mason-guide-pointer.below::after{top:-13px;bottom:auto;transform:translateX(-50%) rotate(225deg)}.mason-guide-target{position:relative!important;z-index:8400!important;border-radius:10px!important;outline:4px solid #45a8ff!important;outline-offset:5px!important;box-shadow:0 0 0 10px rgba(69,168,255,.18),0 0 34px rgba(69,168,255,.65)!important;animation:mason-target-pulse 1.35s ease-in-out infinite alternate}.mason-guide-menu-target{color:#fff!important;background:linear-gradient(135deg,#276aa7,#174a78)!important;box-shadow:inset 4px 0 0 #6fc1ff,0 0 22px rgba(66,151,232,.34)!important;outline:2px solid rgba(111,193,255,.75)!important}.app-shell>.sidebar.mason-guide-menu-open,.app-layout>.sidebar.mason-guide-menu-open{width:min(230px,82vw)!important;min-width:min(230px,82vw)!important;max-width:min(230px,82vw)!important;overflow:visible!important}.mason-guide-menu-open .nav-label,.mason-guide-menu-open .sidebar-label,.mason-guide-menu-open .nav-text,.mason-guide-menu-open .platform-name{display:inline!important;opacity:1!important;visibility:visible!important;width:auto!important}.mason-guide-menu-open .sidebar-nav a,.mason-guide-menu-open .sidebar-nav button{justify-content:flex-start!important}@keyframes mason-target-pulse{from{outline-color:#45a8ff;box-shadow:0 0 0 8px rgba(69,168,255,.12),0 0 26px rgba(69,168,255,.45)}to{outline-color:#9bd6ff;box-shadow:0 0 0 13px rgba(69,168,255,.2),0 0 42px rgba(69,168,255,.78)}}
.mason-guide-menu-open .nav-label,.mason-guide-menu-open .sidebar-label,.mason-guide-menu-open .nav-text,.mason-guide-menu-open .platform-name{display:inline-block!important;max-width:220px!important;opacity:1!important;visibility:visible!important;width:auto!important;transform:none!important}.mason-guide-menu-open .nav-item,.mason-guide-menu-open .sidebar-toggle,.mason-guide-menu-open .brand{width:calc(100% - 20px)!important;justify-content:flex-start!important}.mason-guide-menu-open .nav-section,.mason-guide-menu-open .nav-divider{height:auto!important;overflow:visible!important;opacity:1!important}
@media(max-width:720px){.mason-guide-pointer{max-width:160px;font-size:8px}.app-shell>.sidebar.mason-guide-menu-open,.app-layout>.sidebar.mason-guide-menu-open{max-width:min(280px,74vw)!important}}
@media(prefers-reduced-motion:reduce){.mason-guide-target{animation:none!important}}

/* Mason detailed feature focus and screen zoom */
.mason-guide-explanation{display:grid;gap:10px;padding:13px}
.mason-guide-explanation h5{margin:0;color:#fff;font-size:15px;line-height:1.25}
.mason-guide-detail-block{padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:rgba(4,13,22,.36)}
.mason-guide-detail-block strong,.mason-guide-screen-anatomy>strong{display:block;margin-bottom:5px;color:#8dc9fb;font-size:9px;font-weight:900;letter-spacing:.11em}
.mason-guide-detail-block p{margin:0;color:#d7e1ec;font-size:12px;line-height:1.62}
.mason-guide-detail-verify{border-color:rgba(53,208,138,.28);background:rgba(53,208,138,.08)}
.mason-guide-detail-verify strong{color:#7be4b5}
.mason-guide-screen-anatomy{padding:10px;border:1px solid rgba(199,174,120,.28);border-radius:8px;background:rgba(199,174,120,.07)}
.mason-guide-control-labels{display:flex;flex-wrap:wrap;gap:6px}
.mason-guide-control-labels span{padding:5px 7px;border:1px solid rgba(199,174,120,.32);border-radius:999px;background:rgba(10,16,23,.6);color:#f0dfb6;font-size:9px;font-weight:800;line-height:1.2}
.mason-guide-focus-shade{display:none!important;position:fixed;inset:0;z-index:8300;background:transparent;backdrop-filter:none;pointer-events:none}
.mason-guide-focus-shade[hidden]{display:none}
.mason-guide-zoom-target{scale:var(--mason-guide-scale,1.05)!important;transform-origin:center center!important;transition:scale .32s cubic-bezier(.2,.8,.2,1)!important}
.mason-guide-ask-panel{display:grid;gap:9px;margin-top:14px;padding:14px;border:1px solid rgba(94,165,232,.34);border-radius:13px;background:rgba(8,19,31,.72)}
.mason-guide-ask-label{margin:0;color:#8dc9fb;font-size:10px;font-weight:900;letter-spacing:.12em}
.mason-guide-ask-help{margin:0;color:#bdcad8;font-size:11px;line-height:1.5}
.mason-guide-ask-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
.mason-guide-ask-form textarea{min-height:54px;resize:vertical;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:#101923;color:#fff;font:12px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif}
.mason-guide-ask-form textarea:focus{outline:2px solid #5ea5e8;outline-offset:1px}
.mason-guide-ask-form button,.mason-guide-hear-answer{padding:9px 12px;border:1px solid #3c83c3;border-radius:9px;background:#174a78;color:#fff;font-size:10px;font-weight:900;cursor:pointer}
.mason-guide-ask-form button:disabled{opacity:.58;cursor:wait}
.mason-guide-tour-answer{padding:12px;border-left:4px solid #35d08a;border-radius:8px;background:rgba(53,208,138,.08)}
.mason-guide-tour-answer>strong{display:block;margin-bottom:6px;color:#7be4b5;font-size:9px;letter-spacing:.11em}
.mason-guide-tour-answer p{margin:0 0 9px;color:#e8f2ed;font-size:12px;line-height:1.62;white-space:pre-wrap}
.mason-guide-hear-answer{background:#176d4c;border-color:#2c9b6b}
.mason-guide-ask-error{margin:0;padding:9px;border-radius:7px;background:rgba(214,80,80,.13);color:#ffc2c2;font-size:11px;line-height:1.45}
@keyframes mason-focus-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.mason-guide-focus-shade{animation:none!important}.mason-guide-zoom-target{transition:none!important}}
@media(max-width:600px){.mason-guide-footer{flex-wrap:wrap}.mason-guide-ask-form{grid-template-columns:1fr}.mason-guide-ask-form button{min-height:40px}}

/* Keep the screen Mason is teaching fully visible between the tour rail and guide. */
@media(min-width:721px){
  body.mason-guide-active :is(.app-shell,.app-layout)>main{
    margin-left:230px!important;
    margin-right:440px!important;
    width:auto!important;
    transition:margin .28s ease!important;
  }
}
