.oc-guide-guide{--lime:#bef264;--ink:#25332c;--paper:#fbfaf7}.oc-guide-intro{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.oc-guide-intro h2{letter-spacing:-.045em;max-width:720px;margin-top:14px;font-size:clamp(30px,4vw,48px);font-weight:650;line-height:1.12}.oc-guide-intro p:not(:first-child){color:#a1a1aa;max-width:620px;margin-top:18px;line-height:1.8}.oc-guide-intro button{color:#e4e4e7;background:#ffffff06;border:1px solid #ffffff24;border-radius:999px;flex-shrink:0;padding:11px 18px;font-size:12px}.oc-guide-intro button:hover{background:#ffffff10}.oc-guide-jumpLinks{flex-wrap:wrap;gap:7px;margin-top:30px;display:flex}.oc-guide-jumpLinks a{color:#b5b5bd;border:1px solid #ffffff17;border-radius:999px;align-items:center;gap:7px;padding:9px 13px;font-size:12px;transition:color .2s,background .2s;display:flex}.oc-guide-jumpLinks a:hover{color:#d9f99d;background:#bef2640c}.oc-guide-note{color:#85858e;margin:18px 0 30px;font-size:11px}.oc-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;display:grid}.oc-guide-card{background:#141416;border:1px solid #ffffff15;border-radius:24px;min-width:0;scroll-margin-top:100px;overflow:hidden}.oc-guide-illustration{background:radial-gradient(at 35% 0,#a4bca222,#0000 70%),#1c201e;padding:25px 22px 0;overflow:hidden}.oc-guide-illustration>div{border:1px solid #ffffff20;border-radius:12px 12px 0 0;overflow:hidden;box-shadow:0 18px 60px #0004}.oc-guide-windowBar{color:#616660;background:#fdfdfb;border-bottom:1px solid #e7e7e3;justify-content:space-between;align-items:center;gap:10px;height:39px;padding:0 13px;font-size:9px;display:flex}.oc-guide-windowBar>span:nth-child(2){align-items:center;gap:6px;display:flex}.oc-guide-windowBar svg{color:#28392d;width:12px;height:12px}.oc-guide-windowDivider{color:#c6cbc5;margin:0 3px}.oc-guide-windowDots{gap:4px;display:flex}.oc-guide-windowDots i{background:#dadcd7;border-radius:50%;width:6px;height:6px}.oc-guide-windowDots i:first-child{background:#efaaa0}.oc-guide-windowDots i:nth-child(2){background:#ecd495}.oc-guide-windowDots i:last-child{background:#a7c6a0}.oc-guide-liveDot{background:#6d9976;border-radius:50%;width:5px;height:5px}.oc-guide-stage{height:280px;color:var(--ink);background:#eeefeb;padding:18px;font-size:11px;position:relative;overflow:hidden}.oc-guide-full{position:absolute;inset:18px}.oc-guide-page{background:var(--paper);border:1px solid #dce0d8;border-radius:5px;overflow:hidden;box-shadow:0 5px 20px #25332c08}.oc-guide-nav{border-bottom:1px solid #293c2c0c;justify-content:space-between;align-items:center;gap:8px;padding:13px 15px;font-size:8px;display:flex}.oc-guide-nav>b{letter-spacing:.16em;font-family:Georgia,serif;font-size:15px;font-weight:400}.oc-guide-nav>b>span{letter-spacing:.2em;margin-top:3px;font-family:Arial,sans-serif;font-size:4px;display:block}.oc-guide-nav>span{color:#70796f;font-size:7px}.oc-guide-editorial{grid-template-columns:1.05fr 1fr;display:grid}.oc-guide-hero{color:#283e32;background:#f4f1e9;min-height:145px;padding:22px 18px;position:relative}.oc-guide-hero>small{letter-spacing:.14em;color:#7d8778;margin-bottom:12px;font-size:5px;display:block}.oc-guide-hero>span{letter-spacing:-.04em;max-width:240px;font-family:Georgia,Shurjo,serif;font-size:25px;font-weight:400;line-height:1.15;display:block}.oc-guide-editorial>.oc-guide-photo{border-radius:0;height:100%}.oc-guide-line{opacity:.15;background:currentColor;border-radius:4px;width:65%;height:3px;margin:12px 0}.oc-guide-smallButton{color:#f7f6ef;background:#334c3e;border-radius:2px;align-items:center;margin-top:6px;padding:7px 12px;font-size:8px;display:inline-flex}.oc-guide-columns{gap:8px;padding:12px;display:flex}.oc-guide-columns>*{flex:1;min-width:0}.oc-guide-tile{text-align:center;background:#fffefa;border:1px solid #e0e3db;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:7px;min-height:42px;padding:9px 6px;font-size:8px;display:flex}.oc-guide-accent{color:#334c3e;background:#edf1e9;border-color:#afc29d}.oc-guide-template{background:#fffefa;border:1px solid #e0e3db;border-radius:5px;position:relative;overflow:hidden}.oc-guide-template b{text-align:center;padding:12px 5px;font-size:9px;font-weight:500;display:block}.oc-guide-templateCover{height:105px;position:relative;overflow:hidden}.oc-guide-templateCover>.oc-guide-photo{border-radius:0;height:100%}.oc-guide-templateBadge{letter-spacing:.12em;color:#fff;text-shadow:0 2px 12px #000;background:#0002;justify-content:center;align-items:center;font-family:Georgia,serif;font-size:14px;display:flex;position:absolute;inset:0}.oc-guide-selected{outline-offset:3px;outline:2px solid #7f9b72}.oc-guide-pill{color:#f8f8f2;background:#334c3e;border-radius:5px;align-items:center;gap:4px;padding:8px 12px;font-size:9px;font-weight:500;display:inline-flex}.oc-guide-label{color:#6c776b;align-items:center;gap:7px;margin-bottom:14px;font-size:10px;font-weight:500;display:flex}.oc-guide-success{color:#36553c;background:#fffffff5;border:1px solid #d6e3d0;border-radius:7px;justify-content:center;align-items:center;gap:7px;padding:11px;font-size:10px;font-weight:500;display:flex;position:absolute;bottom:14px;left:30px;right:30px;box-shadow:0 8px 25px #21382c18}.oc-guide-editable{outline-offset:-7px;outline:1px solid #789c69;min-height:159px}.oc-guide-editable:before,.oc-guide-editable:after{content:"";background:#fff;border:1px solid #789c69;width:4px;height:4px;position:absolute;top:5px}.oc-guide-editable:before{left:5px}.oc-guide-editable:after{right:5px}.oc-guide-editable>span{max-width:85%;position:absolute;top:25px;left:20px;right:20px}.oc-guide-editable .oc-guide-line{margin-top:70px}.oc-guide-editedText{width:85%}.oc-guide-toolbar{color:#687166;background:#fff;border:1px solid #e1e3db;border-radius:5px;justify-content:center;align-items:center;gap:16px;width:fit-content;margin:9px auto;padding:8px 16px;font-size:10px;display:flex;box-shadow:0 3px 10px #00000008}.oc-guide-sidebar{background:#fffefa;border:1px solid #dde0d7;border-radius:5px;flex-direction:column;flex-shrink:0;gap:10px;width:87px;padding:10px;font-size:9px;display:flex}.oc-guide-imageStage,.oc-guide-pageStage{gap:12px;display:flex}.oc-guide-imageStage>.oc-guide-page,.oc-guide-pageStage>.oc-guide-page{flex:1;min-width:0}.oc-guide-photo{border-radius:4px;width:100%;min-height:65px;position:relative;overflow:hidden}.oc-guide-sourcePhoto{height:62px;min-height:0}.oc-guide-dropTarget{text-align:center;color:#8b9c81;background:#f4f6ee;border:1px dashed #9caf92;border-radius:4px;justify-content:center;align-items:center;height:145px;margin:10px;font-size:9px;display:flex;position:relative}.oc-guide-dropTarget>.oc-guide-photo{height:100%;position:absolute;inset:0}.oc-guide-dragPhoto{z-index:3;opacity:0;border:3px solid #fff;border-radius:6px;width:64px;position:absolute;top:85px;left:29px;box-shadow:0 16px 24px #122c2430}.oc-guide-shortHero{min-height:82px;padding:16px}.oc-guide-shortHero>span{font-size:24px}.oc-guide-addLine{color:#688159;background:#f0f5eb;border:1px dashed #a3b795;border-radius:3px;justify-content:center;align-items:center;min-height:26px;margin:8px;padding:6px;font-size:9px;display:flex}.oc-guide-floatingPanel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff7;border:1px solid #dadfd3;border-radius:8px;padding:14px;position:absolute;bottom:23px;left:48px;right:48px;box-shadow:0 12px 32px #263a2920}.oc-guide-floatingPanel>b{margin-left:8px;font-size:10px;font-weight:500;display:inline-block}.oc-guide-floatingPanel>svg{vertical-align:middle;display:inline-block}.oc-guide-pageItem{align-items:center;gap:6px;padding:6px 3px;display:flex}.oc-guide-pageItem svg{color:#87947d;flex-shrink:0;width:11px;height:11px}.oc-guide-highlight{color:#4d6944;background:#e8eedf;border-radius:4px}.oc-guide-pageStage .oc-guide-hero{min-height:90px}.oc-guide-pageStage .oc-guide-hero>span{font-size:21px}.oc-guide-pageStage .oc-guide-hero>span:last-child{position:absolute;top:22px;left:18px}.oc-guide-form{flex-direction:column;gap:7px;padding:12px;display:flex}.oc-guide-form>div{color:#939c8c;background:#fff;border:1px solid #e1e4db;border-radius:3px;padding:7px;font-size:8px}.oc-guide-styleBar{color:#788472;align-items:center;gap:11px;margin-bottom:12px;padding:7px 0;font-size:9px;display:flex}.oc-guide-swatch{border:2px solid #fff;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 1px #b9c3b1}.oc-guide-restyle{position:absolute;top:58px;left:18px;right:18px}.oc-guide-restyle .oc-guide-hero{color:#51415d;background:#ece8f0}.oc-guide-restyle .oc-guide-hero>span{letter-spacing:-.06em;font-family:Arial,sans-serif;font-size:23px;font-weight:700}.oc-guide-restyle .oc-guide-smallButton{background:#675375}.oc-guide-url{color:#4b6441;background:#f8faf5;border:1px solid #b6c8a9;border-radius:4px;justify-content:space-between;align-items:center;min-height:34px;padding:8px 10px;font-size:11px;display:flex;position:relative}.oc-guide-url>span:first-child{color:#a1ab98;position:absolute}.oc-guide-check{margin-left:auto}.oc-guide-linkButton{outline-offset:4px;outline:1px solid #a3b795;margin-top:16px}.oc-guide-sitesHeader{justify-content:space-between;align-items:center;margin-bottom:22px;display:flex}.oc-guide-sitesHeader>b{font-size:14px;font-weight:500}.oc-guide-siteGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;display:grid}.oc-guide-siteCard{background:#fffefa;border:1px solid #dce2d4;border-radius:5px;overflow:hidden}.oc-guide-siteCard>div{height:105px}.oc-guide-siteCard .oc-guide-photo{border-radius:0;height:100%}.oc-guide-siteCard>b,.oc-guide-siteCard>span{margin:10px;font-size:9px;font-weight:500;display:block}.oc-guide-siteCard>span{color:#8b9583;font-size:8px}.oc-guide-device{border:3px solid #344239;border-radius:8px;width:100%;margin:auto;overflow:hidden;box-shadow:0 8px 20px #263a2920}.oc-guide-device .oc-guide-nav{padding:9px}.oc-guide-device .oc-guide-hero{min-height:115px;padding:14px}.oc-guide-device .oc-guide-hero>span{font-size:20px}.oc-guide-device .oc-guide-hero>small{font-size:4px}.oc-guide-device .oc-guide-columns{display:none}.oc-guide-deviceTools{background:#fdfdf8;border:1px solid #dce2d4;border-radius:6px;justify-content:center;align-items:center;gap:18px;padding:8px;display:flex;position:absolute;bottom:12px;left:16px;right:16px}.oc-guide-stage:has(.oc-guide-device) .oc-guide-success{z-index:1;font-size:9px;bottom:67px}.oc-guide-cursor{--target-x:60%;--target-y:53%;top:var(--target-y);left:var(--target-x);z-index:4;pointer-events:none;opacity:0;filter:drop-shadow(0 2px 1px #0003);transform-origin:7px 7px;position:absolute}.oc-guide-cursor>span{color:#fff;white-space:nowrap;background:#334c3e;border-radius:0 5px 5px;padding:4px 8px;font-size:8px;position:absolute;top:30px;left:16px}.oc-guide-cursor>i{opacity:0;border:2px solid #5b8165;border-radius:50%;width:26px;height:26px;position:absolute;top:-7px;left:-7px}[data-kind=create] .oc-guide-cursor{--target-x:47%;--target-y:47%}[data-kind=edit] .oc-guide-cursor{--target-x:36%;--target-y:38%}[data-kind=sections] .oc-guide-cursor{--target-x:37%;--target-y:72%}[data-kind=pages] .oc-guide-cursor{--target-x:15%;--target-y:73%}[data-kind=style] .oc-guide-cursor{--target-x:27%;--target-y:13%}[data-kind=links] .oc-guide-cursor{--target-x:59%;--target-y:79%}[data-kind=sites] .oc-guide-cursor{--target-x:80%;--target-y:13%}[data-kind=publish] .oc-guide-cursor{--target-x:49%;--target-y:89%}.oc-guide-before{opacity:0}.oc-guide-after{opacity:1}.oc-guide-copy{padding:28px 28px 30px}.oc-guide-chapter{letter-spacing:.12em;color:#9aab8c;align-items:center;gap:8px;font-size:10px;display:flex}.oc-guide-chapter svg{width:13px;height:13px}.oc-guide-action{color:#9cad8e;letter-spacing:.015em;margin-top:16px;font-size:10px;line-height:1.8}.oc-guide-copy h3{letter-spacing:-.035em;color:#f1f1ed;margin-top:8px;font-size:26px;font-weight:550;line-height:1.18}.oc-guide-copy>p:not(.oc-guide-action){color:#999d97;max-width:440px;margin-top:14px;font-size:13px;line-height:1.9}.oc-guide-result{color:#bac3b2;align-items:center;gap:8px;margin-top:20px;font-size:11px;display:flex}.oc-guide-result svg{color:#a3be8c;flex-shrink:0;width:12px;height:12px}.oc-guide-sceneFooter{color:#8b9485;background:#fdfdfb;border-top:1px solid #e0e3dc;justify-content:space-between;align-items:center;height:30px;padding:0 12px;font-size:7px;display:flex}.oc-guide-sceneFooter>span{align-items:center;gap:6px;display:flex}.oc-guide-sceneFooter>span>i{background:#7eaa74;border-radius:50%;width:4px;height:4px}.oc-guide-timeline{background:#e2e7dd;border-radius:2px;width:55px;height:2px;overflow:hidden}.oc-guide-timeline>i{transform-origin:0;background:#93ab7d;width:100%;height:100%;display:block}.oc-guide-bottom{background:linear-gradient(120deg,#a5bd8809,#ffffff02);border:1px solid #ffffff15;border-radius:20px;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin-top:32px;padding:32px;display:flex}.oc-guide-bottom p{text-align:center;letter-spacing:-.025em;flex-basis:100%;margin-bottom:5px;font-size:19px;font-weight:500}.oc-guide-bottom a{border-radius:999px;padding:12px 22px;font-size:12px;font-weight:600}.oc-guide-bottom a:first-of-type{color:#263a16;background:#bef264}.oc-guide-bottom a:last-of-type{border:1px solid #ffffff30}@keyframes oc-guide-showBefore{0%,38%{opacity:1;transform:translateY(0)}48%,94%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}@keyframes oc-guide-showAfter{0%,39%{opacity:0;transform:translateY(7px)}53%,90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(0)}}@keyframes oc-guide-moveCursor{0%,6%{opacity:0;transform:translate(45px,38px)rotate(-8deg)}13%{opacity:1;transform:translate(30px,29px)rotate(-3deg)}25%{opacity:1;transform:translate(-3px,3px)rotate(1deg)}31%,37%{opacity:1;transform:translate(0)rotate(0)}40%{opacity:1;transform:scale(.9)}44%,63%{opacity:1;transform:translate(0)}78%,to{opacity:0;transform:translate(28px,20px)}}@keyframes oc-guide-click{0%,36%,55%,to{opacity:0;transform:scale(.5)}39%{opacity:.6;transform:scale(.5)}49%{opacity:0;transform:scale(1.7)}}@keyframes oc-guide-dragImage{0%,16%{opacity:0;transform:translate(0)scale(1)}22%{opacity:1;transform:translate(3px,-4px)scale(1.08)rotate(-3deg)}30%{opacity:1;transform:translate(27px,-7px)scale(1.08)rotate(-2deg)}43%{opacity:1;transform:translate(122px,19px)scale(1.13)rotate(1deg)}49%{opacity:1;transform:translate(145px,27px)scale(1)rotate(0)}55%,to{opacity:0;transform:translate(145px,27px)scale(.98)}}@keyframes oc-guide-phonePreview{0%,33%,to{width:100%}49%,90%{width:62%}}@keyframes oc-guide-typing{0%,42%{clip-path:inset(0 100% 0 0)}65%,to{clip-path:inset(0)}}@keyframes oc-guide-progress{0%{transform:scaleX(0)}92%,to{transform:scaleX(1)}}@media (prefers-reduced-motion:no-preference){.oc-guide-before{animation:6s infinite oc-guide-showBefore}.oc-guide-after{animation:6s infinite oc-guide-showAfter}.oc-guide-cursor{animation:6s infinite oc-guide-moveCursor}.oc-guide-cursor>i{animation:6s ease-out infinite oc-guide-click}.oc-guide-dragPhoto{animation:6s infinite oc-guide-dragImage}.oc-guide-device{animation:6s cubic-bezier(.22,1,.36,1) infinite oc-guide-phonePreview}.oc-guide-editedText,.oc-guide-url>.oc-guide-after:not(.oc-guide-check){animation:6s infinite oc-guide-showAfter,6s steps(22,end) infinite oc-guide-typing}.oc-guide-timeline>i{animation:6s linear infinite oc-guide-progress}.oc-guide-card[data-visible=false] *,.oc-guide-guide[data-paused=true] *,.oc-guide-guide[data-hidden=true] *{animation-play-state:paused!important}}@media (min-width:1000px){.oc-guide-card:first-child{background:linear-gradient(125deg,#161a16,#1d251d);grid-column:1/-1;grid-template-columns:.8fr 1.2fr;align-items:center;display:grid}.oc-guide-card:first-child .oc-guide-copy{grid-area:1/1;padding:44px}.oc-guide-card:first-child .oc-guide-copy h3{font-size:39px}.oc-guide-card:first-child .oc-guide-copy>p:not(.oc-guide-action){font-size:14px}.oc-guide-card:first-child .oc-guide-illustration{background:0 0;grid-area:1/2;padding:34px 26px 0 0}.oc-guide-card:first-child .oc-guide-stage{height:310px}.oc-guide-card:first-child .oc-guide-templateCover{height:155px}.oc-guide-card:first-child .oc-guide-hero{min-height:180px}}@media (max-width:680px){.oc-guide-grid{grid-template-columns:minmax(0,1fr);gap:24px}.oc-guide-intro{flex-direction:column;align-items:flex-start}.oc-guide-illustration{padding:18px 14px 0}.oc-guide-stage{height:260px;padding:13px}.oc-guide-full{inset:13px}.oc-guide-copy{padding:24px}.oc-guide-copy h3{font-size:25px}.oc-guide-hero>span{font-size:22px}.oc-guide-editorial .oc-guide-hero{padding:18px 12px}.oc-guide-nav{padding:11px 9px}.oc-guide-nav>span{font-size:6px}.oc-guide-restyle{top:53px;left:13px;right:13px}.oc-guide-sidebar{width:72px;padding:8px}.oc-guide-floatingPanel{left:28px;right:28px}.oc-guide-templateCover{height:90px}.oc-guide-templateBadge{font-size:10px}.oc-guide-template b{font-size:8px}.oc-guide-imageStage{gap:7px}.oc-guide-dropTarget{height:130px;margin:7px}.oc-guide-cursor>span{white-space:normal;max-width:95px}.oc-guide-dragPhoto{width:54px;top:80px;left:22px}}
