.cf-demo{min-height:100vh;background:#23262b;display:flex;flex-direction:column}.cf-demo-bar{display:flex;align-items:center;gap:14px;padding:10px 18px;background:#17191d;color:#cfd4dc;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:13px;position:-webkit-sticky;position:sticky;top:0;z-index:40}.cf-demo-back{color:#9aa3b0;text-decoration:none;white-space:nowrap}.cf-demo-back:hover{color:#fff}.cf-demo-case{font-weight:700;color:#fff;white-space:nowrap}.cf-demo-steps{display:flex;gap:6px;margin-left:6px}.cf-demo-step{width:24px;height:24px;border-radius:50%;border:1px solid #3a3f47;background:transparent;color:#9aa3b0;font-size:11px;cursor:pointer}.cf-demo-step.is-active{background:#fff;border-color:#fff;color:#17191d;font-weight:700}.cf-demo-label{margin-left:auto;color:#9aa3b0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cf-demo-arrows{display:flex;gap:6px}.cf-demo-arrows button{width:28px;height:28px;border-radius:6px;border:1px solid #3a3f47;background:transparent;color:#cfd4dc;cursor:pointer;font-size:14px}.cf-demo-arrows button:disabled{opacity:.35;cursor:default}.cf-demo-stage{flex:1 1;padding:26px clamp(12px,3vw,40px) 60px;display:flex;justify-content:center;align-items:flex-start}.cf-demo-stage>*{width:100%;max-width:1240px}.cf-demo-disclosure{text-align:center;color:#9aa3b0;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12px;margin:-34px auto 26px;padding:0 16px;max-width:720px}.cf-demo-return-wrap{display:flex;justify-content:center;margin-top:24px;padding:24px 10px 8px;border-top:1px solid rgba(15,56,82,.16)}.cf-demo-return{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:11px 18px;border-radius:999px;background:#0f3852;color:#fff;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:13px;font-weight:800;line-height:1;text-decoration:none;box-shadow:0 10px 24px rgba(15,56,82,.22)}.cf-demo-return:hover{background:#164d6e}.cf-demo-return:focus-visible{outline:3px solid #ff6f61;outline-offset:4px}.cf-guided-next{position:relative;overflow:visible;isolation:isolate;outline:2px solid rgba(255,111,97,.54);outline-offset:2px;animation:cf-guided-target 1.7s ease-in-out infinite}.cf-guided-next:before{z-index:8;width:20px;height:20px;border:3px solid rgba(255,255,255,.96);border-radius:50%;background:#ff6f61;box-shadow:0 4px 12px rgba(17,25,31,.28)}.cf-guided-next:after,.cf-guided-next:before{content:"";position:absolute;top:0;right:14px;pointer-events:none;transform:translate(50%,-50%)}.cf-guided-next:after{z-index:7;width:46px;height:46px;border:2px solid rgba(255,111,97,.82);border-radius:50%;animation:cf-guided-pulse 1.7s ease-out infinite}@keyframes cf-guided-pulse{0%{opacity:.95;scale:.52}72%,to{opacity:0;scale:1.22}}@keyframes cf-guided-target{0%,to{outline-color:rgba(255,111,97,.44);outline-offset:2px}50%{outline-color:rgba(255,111,97,.92);outline-offset:7px}}@media (prefers-reduced-motion:reduce){.cf-guided-next{animation:none}.cf-guided-next:after{animation:none;opacity:.72;scale:.82}}.cf-browser{border-radius:12px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.45);background:#fff}.cf-browser-top{display:flex;align-items:flex-end;gap:14px;padding:8px 14px 0;background:#dee1e6}.cf-browser-dark .cf-browser-top{background:#202124}.cf-dots{display:flex;gap:7px;padding-bottom:12px}.cf-dots i{width:12px;height:12px;border-radius:50%}.cf-dots i:first-child{background:#f5655b}.cf-dots i:nth-child(2){background:#f6bd3b}.cf-dots i:nth-child(3){background:#43c645}.cf-tab{display:flex;align-items:center;gap:8px;background:#fff;border-radius:9px 9px 0 0;padding:7px 12px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12px;color:#3c4043;min-width:220px;max-width:320px}.cf-browser-dark .cf-tab{background:#35363a;color:#e8eaed}.cf-tab-favicon{width:12px;height:12px;border-radius:3px;background:currentColor;opacity:.55;flex:none}.cf-tab-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cf-tab-x{margin-left:auto;opacity:.55}.cf-browser-urlrow{display:flex;align-items:center;gap:12px;padding:7px 14px;background:#fff;border-bottom:1px solid #e6e8eb}.cf-browser-dark .cf-browser-urlrow{background:#35363a;border-bottom-color:#202124}.cf-nav-arrows{display:flex;gap:10px;color:#5f6368;font-size:14px}.cf-browser-dark .cf-nav-arrows{color:#bdc1c6}.cf-urlbar{flex:1 1;display:flex;align-items:center;gap:8px;background:#f1f3f4;border-radius:99px;padding:6px 14px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12.5px;color:#3c4043}.cf-browser-dark .cf-urlbar{background:#202124;color:#e8eaed}.cf-browser-body{background:#fff}.cf-pdf{border-radius:12px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.45)}.cf-pdf-bar{display:flex;align-items:center;gap:18px;background:#262a2e;color:#e8eaed;padding:10px 16px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12.5px}.cf-pdf-menu{display:flex;flex-direction:column;gap:3px}.cf-pdf-menu i{width:14px;height:2px;background:#e8eaed;display:block}.cf-pdf-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cf-pdf-page{margin-left:auto;color:#bdc1c6}.cf-pdf-page b{background:#17191d;padding:2px 8px;border-radius:3px;color:#fff;margin-right:4px}.cf-pdf-zoom{display:flex;align-items:center;gap:10px;color:#bdc1c6}.cf-pdf-zoom b{background:#17191d;padding:2px 8px;border-radius:3px;color:#fff;font-weight:500}.cf-pdf-actions{display:flex;gap:14px;color:#bdc1c6}.cf-pdf-body{background:#494e54;padding:28px clamp(12px,4vw,70px);display:flex;justify-content:center}.cf-pdf-body>*{width:100%;max-width:980px;background:#fff;box-shadow:0 8px 30px rgba(0,0,0,.35)}.cf-inbox{display:grid;grid-template-columns:200px 290px 1fr;min-height:640px;background:#f6f8fc;border-radius:12px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.45);font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}.cf-inbox-side{padding:16px 12px;gap:4px}.cf-inbox-account,.cf-inbox-side{display:flex;flex-direction:column}.cf-inbox-account{padding:2px 8px 12px}.cf-inbox-account strong{font-size:13.5px;color:#1f1f1f}.cf-inbox-account span{font-size:11.5px;color:#5e5e5e;overflow:hidden;text-overflow:ellipsis}.cf-compose{display:flex;align-items:center;gap:8px;background:#fff;border:none;box-shadow:0 1px 4px rgba(0,0,0,.18);border-radius:14px;padding:10px 16px;font-size:13px;font-weight:600;color:#3c4043;margin-bottom:10px;width:-moz-fit-content;width:fit-content}.cf-compose span{color:#c5221f;font-size:16px;font-weight:700}.cf-folders{display:flex;flex-direction:column}.cf-folder{display:flex;justify-content:space-between;align-items:center;padding:6px 12px;border-radius:0 99px 99px 0;font-size:12.5px;color:#444746}.cf-folder.is-active{background:#d3e3fd;color:#041e49;font-weight:700}.cf-folder b{font-size:11px;font-weight:600}.cf-labels{margin-top:14px}.cf-labels-head{font-size:12px;font-weight:600;color:#444746;padding:0 12px 6px}.cf-label{display:flex;align-items:center;gap:10px;padding:5px 12px;font-size:12.5px;color:#444746}.cf-label i{width:10px;height:10px;border-radius:3px;flex:none}.cf-inbox-list{background:#fff;border-radius:14px 0 0 14px;margin:10px 0;overflow:hidden;border-right:1px solid #eceef1}.cf-inbox-search{display:flex;align-items:center;gap:10px;margin:10px;background:#eaf1fb;border-radius:99px;padding:8px 16px;font-size:12.5px;color:#5f6368}.cf-msg{padding:9px 14px;border-bottom:1px solid #f0f2f5;cursor:default}.cf-msg.is-selected{background:#d3e3fd}.cf-msg-top{display:flex;justify-content:space-between;gap:8px}.cf-msg-from{font-size:12.5px;font-weight:600;color:#1f1f1f}.cf-msg.is-unread .cf-msg-from,.cf-msg.is-unread .cf-msg-subject{font-weight:700}.cf-msg-time{font-size:11px;color:#5e5e5e;white-space:nowrap}.cf-msg-subject{font-size:12.5px;color:#1f1f1f;margin-top:1px}.cf-msg-snippet{font-size:11.5px;color:#5e5e5e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;justify-content:space-between;gap:8px}.cf-msg-star{color:#c8ccd2;flex:none}.cf-msg-star.is-on{color:#f4b400}.cf-inbox-read{background:#fff;margin:10px 10px 10px 0;border-radius:0 14px 14px 0;padding:0 26px 30px;overflow:hidden}.cf-read-toolbar{display:flex;align-items:center;gap:18px;padding:12px 0;color:#5f6368;font-size:14px;border-bottom:1px solid #f0f2f5;margin-bottom:18px}.cf-read-pager{margin-left:auto;font-size:12px}.cf-index{min-height:100vh;background:#23262b;color:#eef1f5;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;padding:70px clamp(20px,6vw,90px)}.cf-index h1{font-size:clamp(28px,4vw,44px);margin:0 0 10px}.cf-index-lede{color:#9aa3b0;max-width:560px;margin:0 0 40px;line-height:1.55}.cf-index-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,420px));grid-gap:24px;gap:24px}.cf-index-card{display:block;border-radius:14px;padding:26px;text-decoration:none;border:1px solid #3a3f47;transition:transform .15s ease}.cf-index-card:hover{transform:translateY(-3px)}.cf-index-card strong{display:block;font-size:21px;margin-bottom:6px}.cf-index-card span{display:block;font-size:14px;line-height:1.5;opacity:.85}.cf-index-card em{display:inline-block;font-style:normal;font-size:12px;margin-top:16px;opacity:.7}@media (max-width:900px){.cf-inbox{grid-template-columns:1fr}.cf-inbox-list,.cf-inbox-side{display:none}.cf-inbox-read{margin:10px;border-radius:14px}.cf-demo-label{display:none}}@media (max-width:700px){.cf-demo-bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-gap:8px 10px;gap:8px 10px;padding:8px 10px}.cf-demo-back{grid-column:1;font-size:12px}.cf-demo-case{grid-column:2;min-width:0;overflow:hidden;text-overflow:ellipsis}.cf-demo-arrows{grid-column:3}.cf-demo-steps{grid-column:1/-1;grid-row:2;width:100%;margin:0;gap:5px;justify-content:center;overflow-x:auto;scrollbar-width:none}.cf-demo-steps::-webkit-scrollbar{display:none}.cf-demo-step{width:28px;height:28px;flex:0 0 28px}.cf-demo-arrows button{width:30px;height:30px}.cf-demo-stage{padding:12px 12px 44px}.cf-demo-stage>*{min-width:0}.cf-demo-disclosure{margin:-28px auto 18px;padding:0 18px;font-size:10.5px;line-height:1.45}.cf-browser,.cf-inbox,.cf-pdf{border-radius:9px;box-shadow:0 16px 44px rgba(0,0,0,.38)}.cf-browser-top{gap:6px;padding:6px 8px 0}.cf-dots,.cf-nav-arrows{display:none}.cf-tab{flex:1 1;min-width:0;max-width:none;padding:6px 8px;font-size:10.5px}.cf-browser-urlrow{gap:6px;padding:6px 8px}.cf-urlbar{min-width:0;padding:6px 10px;font-size:10.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.cf-pdf-bar{gap:8px;padding:8px 10px}.cf-pdf-actions,.cf-pdf-menu,.cf-pdf-zoom{display:none}.cf-pdf-name{min-width:0;flex:1 1}.cf-pdf-page{margin-left:0;white-space:nowrap;font-size:10px}.cf-pdf-body{padding:10px}.cf-inbox{min-height:0}.cf-inbox-read{margin:0;padding:0 12px 22px;border-radius:0}.cf-read-toolbar{gap:12px;padding:10px 0;margin-bottom:12px}}