.screenshot-page{color:#17202b;font-family:var(--font-sans)}.screenshot-page :where(h1,h2,h3,p,ul,ol){margin:0}.screenshot-page :where(ul,ol){padding:0;list-style:none}.screenshot-page :where(button,input,kbd){font-family:inherit}.screenshot-page button{cursor:pointer}.screenshot-page :where(button,input,a){-webkit-tap-highlight-color:transparent}.screenshot-page a{text-decoration:none;color:inherit}.screenshot-page button{transition:background .2s,color .2s,opacity .2s,box-shadow .2s}.screenshot-page button:hover{filter:brightness(.98)}.sc-container{width:min(1200px,calc(100% - 64px));margin-inline:auto}.screenshot-page h2{font-size:40px;line-height:56px;font-weight:900;white-space:pre-line}.sc-seam{position:relative;height:48px}.sc-seam:before{content:"";position:absolute;left:8px;right:8px;top:23px;border-top:2px dashed #19c3a5;opacity:.7}.sc-seam:after{content:"";position:absolute;top:18px;left:-8px;width:12px;height:12px;border-radius:50%;background:#19c3a5;box-shadow:1204px 0 #19c3a5}.sc-seam{--seam-width:min(1200px, calc(100vw - 64px) )}.sc-seam:after{box-shadow:calc(var(--seam-width) + 4px) 0 #19c3a5}.sc-hero{min-height:800px;overflow:clip}.sc-hero-layout{position:relative;min-height:800px}.sc-hero-copy{position:relative;width:600px;max-width:50%;padding-top:170px;z-index:1}.sc-hero-layout{padding-bottom:70px;box-sizing:border-box}.sc-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:#8a94a6;font-size:13px;line-height:20px}.sc-breadcrumb a:hover{color:#2f7bff}.sc-hero h1{margin-top:16px;margin-left:-4px;font-weight:900}.sc-hero h1>span{display:block;font-size:72px;line-height:88px}.sc-hero h1>span:last-child{font-size:64px;line-height:80px}.sc-title-seam{position:relative;display:block;height:16px;width:560px;max-width:94%;margin:6px 0 6px 4px}.sc-title-seam:before{content:"";position:absolute;inset:8px 8px auto;border-top:2px dashed #19c3a5}.sc-title-seam:after{content:"";position:absolute;height:10px;left:0;right:0;top:3px;background:radial-gradient(circle at 5px 5px,#19c3a5 5px,transparent 5px) left center / 10px 10px no-repeat,radial-gradient(circle at 5px 5px,#19c3a5 5px,transparent 5px) right center / 10px 10px no-repeat}.sc-intro{margin-top:28px!important;color:#4a5568;font-size:18px;line-height:32px}.sc-hero .download-control{margin-top:36px;align-items:flex-start}.sc-hero .download-button{min-height:62px;border-radius:14px;padding:18px 40px;font-size:18px;line-height:24px;box-shadow:0 16px 36px #2f7bff47,0 8px 20px #2f7bff52,0 1px 2px #1a4fb840,inset 0 1px #ffffff47}.sc-hero .download-button img,.sc-hero .download-button-icon{width:22px;height:22px}.sc-free{display:flex;align-items:flex-start;gap:12px;margin-top:26px!important;color:#8a94a6;font-size:14px;line-height:22px}.sc-free b{flex:none;padding:0 8px;border-radius:11px;color:#0e9f86;background:#e2f8f3;font-size:11px;line-height:22px}.sc-hero-art{position:absolute!important;width:640px;max-width:53.3333%;top:100px;left:51.6667%}.sc-howto{min-height:340px;padding-top:40px;box-sizing:border-box}.sc-howto ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:30px}.sc-howto li{min-width:0}.sc-step-keys{display:flex;align-items:center;gap:10px;height:61px;font-size:24px;line-height:32px;font-weight:700}.sc-step-number{display:grid;place-items:center;flex:none;width:32px;height:32px;margin-right:6px;border-radius:50%;background:#17202b;color:#fff;font-size:15px;line-height:18px}.sc-step-keys kbd{display:grid;place-items:center;min-width:60px;height:56px;border:1px solid #e3e8ef;border-radius:12px;background:#fff;box-shadow:0 5px #dfe5ed;padding-inline:18px;box-sizing:border-box}.sc-howto li:nth-child(2) kbd{background:#9368ff;color:#fff;border-color:#ab8bff;box-shadow:0 5px #7344df}.sc-output-keys{display:flex;flex-wrap:wrap;gap:8px}.sc-output-keys kbd{min-width:0;height:36px;padding:0 14px;border:0;border-radius:18px;background:#17202b;box-shadow:none;font-size:13px;line-height:1;color:#fff}.sc-output-keys kbd:nth-child(2){background:#2f7bff}.sc-output-keys kbd:nth-child(3){background:#19c3a5}.sc-howto h3{margin-top:30px;font-size:22px;line-height:32px;font-weight:700}.sc-howto li>p{max-width:330px;margin-top:10px;color:#4a5568;font-size:15px;line-height:26px}.sc-section-copy{min-width:0}.sc-explanation{display:flex;align-items:flex-start;gap:12px;color:#4a5568;font-size:16px;line-height:28px}.sc-explanation>span:first-child{flex:none;padding:4px 8px;border-radius:11px;margin-top:2px;background:#ffece8;color:#ff6b57;font-size:11px;font-weight:700;line-height:14px}.sc-explanation>span:last-child{min-width:0}.sc-problem{margin-top:16px!important}.sc-solution{margin-top:10px!important;color:#17202b;font-weight:500}.sc-solution>span:first-child{background:#e2f8f3;color:#0e9f86;margin-right:4px}.sc-precision{padding-block:40px;box-sizing:border-box;min-height:654px}.sc-precision-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:24px;margin-top:28px;border-radius:32px;background:#e8f0ff}.sc-precision-panel{min-width:0;min-height:360px;padding:12px;border-radius:20px;background:#fff;box-sizing:border-box}.sc-precision-panel h3{margin:18px 12px 0;font-size:19px;font-weight:700;line-height:26px}.sc-precision-panel>p{margin:10px 12px 20px;font-size:14px;line-height:24px;color:#4a5568}.sc-modes{padding-block:40px;min-height:606px;box-sizing:border-box}.sc-mode-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:28px}.sc-mode-card{min-width:0;min-height:360px;padding:12px;border:1px solid #e3e8ef;border-radius:22px;background:#fff;box-sizing:border-box;transition:box-shadow .24s,border-color .24s}.sc-mode-card:hover,.sc-mode-card:focus-visible{border-color:#b3ccff;box-shadow:0 8px 24px #17202b0a}.sc-mode-card h3{font-size:19px;line-height:26px;font-weight:700;margin:18px 9px 0}.sc-mode-card>p{margin:10px 9px 20px;color:#4a5568;font-size:14px;line-height:24px}.sc-split{display:grid;grid-template-columns:640px minmax(0,1fr);gap:40px;align-items:center;padding-block:40px;min-height:640px;box-sizing:border-box}.sc-split h2{font-size:36px;line-height:50px}.sc-bullets{margin-top:22px!important}.sc-bullets li{position:relative;padding-left:22px;color:#4a5568;font-size:14px;line-height:26px}.sc-bullets li+li{margin-top:12px}.sc-bullets li:before{content:"";position:absolute;top:8px;left:1px;width:9px;height:5px;border-left:2px solid #19c3a5;border-bottom:2px solid #19c3a5;transform:rotate(-45deg)}.sc-detail-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;min-height:680px;padding-block:40px;box-sizing:border-box}.sc-detail-pair article{min-width:0}.sc-detail-pair .sc-section-copy{margin-top:26px}.sc-detail-pair h2{font-size:30px;line-height:42px}.sc-detail-pair--effects{min-height:652px}.sc-loupe-section{grid-template-columns:minmax(0,1fr) 640px;gap:60px}.sc-next{padding-block:40px 72px;min-height:600px;box-sizing:border-box}.sc-next>p{margin-top:16px;color:#4a5568;font-size:17px;line-height:30px}.sc-next-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 15px;margin-top:38px}.sc-next-card{position:relative;min-width:0;min-height:164px;border:1px solid #e3e8ef;border-radius:16px;background:#fff;padding:20px;box-sizing:border-box;transition:box-shadow .2s,border-color .2s,transform .2s}.sc-next-card:hover{border-color:#b7cdff;box-shadow:0 6px 20px #17202b0a;transform:translateY(-2px)}.sc-action-icon{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px}.sc-action-icon img{display:block;width:22px;height:22px}.sc-next-card kbd{position:absolute;top:28px;right:20px;padding:4px 10px;border-radius:13px;background:#f5f8fc;color:#4a5568;font-size:12px;line-height:18px}.sc-next-card h3{margin-top:16px;font-size:18px;line-height:26px;font-weight:700}.sc-next-card>p{margin-top:6px;color:#4a5568;font-size:13px;line-height:22px}.sc-tips{padding-top:40px;padding-bottom:54px;min-height:420px;box-sizing:border-box}.sc-tips>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 40px;margin-top:44px}.sc-tips article{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto;gap:6px 20px;min-height:104px;padding:22px 0 20px;border-top:1.5px solid #e3e8ef;box-sizing:border-box}.sc-tips .sc-action-icon{width:40px;height:40px;grid-row:1/3;border-radius:50%;margin-top:2px}.sc-tips h3{font-size:18px;font-weight:700;line-height:28px}.sc-tips article>p{font-size:15px;line-height:26px;color:#4a5568}.sc-faq{display:grid;grid-template-columns:340px minmax(0,1fr);gap:80px;padding-block:40px 50px;min-height:610px;box-sizing:border-box}.sc-faq header>p{margin-top:16px;color:#4a5568;font-size:16px;line-height:28px}.sc-faq header a:hover{color:#2f7bff;text-decoration:underline}.sc-faq-list{display:grid;align-content:start;gap:12px}.sc-faq details{border:1px solid #e3e8ef;border-radius:14px;background:#fff;overflow:clip}.sc-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:62px;padding:16px 28px;font-size:17px;font-weight:700;line-height:28px;box-sizing:border-box}.sc-faq summary::-webkit-details-marker{display:none}.sc-faq summary i{position:relative;flex:none;width:20px;height:20px}.sc-faq summary i:before,.sc-faq summary i:after{content:"";position:absolute;top:9px;left:3px;width:14px;height:2px;border-radius:1px;background:#8a94a6;transition:transform .2s,background .2s}.sc-faq summary i:after{transform:rotate(90deg)}.sc-faq [open] summary i:after{transform:rotate(0)}.sc-faq [open] summary i:before,.sc-faq [open] summary i:after{background:#2f7bff}.sc-faq-answer{overflow:hidden}.sc-faq-answer p{padding:0 28px 24px;font-size:15px;line-height:26px;color:#4a5568}.sc-explore{min-height:220px;padding-top:30px;padding-bottom:66px;box-sizing:border-box}.sc-explore h2{font-size:28px;line-height:40px}.sc-explore>div{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}.sc-explore a{display:flex;align-items:center;gap:10px;padding:6.5px 22.5px 6.5px 6.5px;border:1.5px solid #e3e8ef;border-radius:28px;background:#fff;font-size:16px;font-weight:700;line-height:26px;transition:border-color .2s}.sc-explore a:hover{border-color:#8cb2ff}.sc-explore .sc-action-icon{width:40px;height:40px;border-radius:50%}.sc-canvas{position:relative;min-width:0;container-type:inline-size}.sc-scene{position:relative;width:100%;color:#17202b}.sc-pos{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u));height:calc(var(--h)*var(--u));box-sizing:border-box}.sc-caption{display:flex;align-items:center;font-size:calc(12 * var(--u));line-height:1.3;color:#4a5568;overflow-wrap:normal}.sc-caption-bold{font-size:calc(13 * var(--u));font-weight:700;color:#17202b}.sc-pos.sc-pill{justify-content:center;text-align:center;border:1px solid #e3e8ef;border-radius:calc(16 * var(--u));padding:calc(2 * var(--u)) calc(7 * var(--u));background:#fff;font-size:calc(11 * var(--u));font-weight:500}.sc-pos.sc-pill-blue{background:#2f7bff;color:#fff;border:0}.sc-pos.sc-pill-blue-light{background:#e8f0ff;color:#2f7bff;border:0}.sc-pos.sc-pill-dark{background:#17202b;color:#fff;border:0}.sc-pos.sc-pill-coral{background:#ff6b57;color:#fff;border:0}.sc-pos.sc-pill-mint{background:#e2f8f3;color:#0e9f86;border:0}.sc-pos.sc-pill-green{background:#19c3a5;color:#fff;border:0}.sc-pos.sc-pill-purple{background:#7c4dff;color:#fff;border:0}.sc-pos.sc-pill-gold{background:#e0a800;color:#fff;border:0}.sc-key{display:grid;place-items:center;border:1px solid #e3e8ef;border-radius:calc(8 * var(--u));background:#fff;color:#17202b;font-size:calc(15 * var(--u));line-height:1;font-weight:900;padding:0;box-shadow:0 calc(3 * var(--u)) #17202b2e}.sc-key:active{transform:translateY(1px);box-shadow:none}.sc-skeleton{display:block;border-radius:calc(7 * var(--u))}.sc-window-bar{background:#f7f9fc}.sc-hero-orbit{background:#e8f0ff;border-radius:50%}.sc-orbit-mint{background:#e2f8f3}.sc-orbit-sun{background:#fff6d6}.sc-hero-screen{border-radius:calc(18 * var(--u));background:#eef2f7;box-shadow:0 calc(16 * var(--u)) calc(40 * var(--u)) #17212b1f;overflow:clip}.sc-hero-window{background:#fff;border:1px solid #e3e8ef;border-radius:calc(12 * var(--u));overflow:clip}.sc-hero-card{border:0;border-radius:calc(12 * var(--u));padding:0}.sc-hero-card-blue{background:#e8f0ff}.sc-hero-card-orange{background:#fff0e0}.sc-hero-selection{pointer-events:none;transition:left .4s ease,top .4s ease,width .4s ease,height .4s ease}.sc-hero-shape-mask,.sc-hero-multi-mask{position:absolute;inset:0;background:#17202b73;pointer-events:none}.sc-hero-shape-mask,.sc-hero-shape-outline,.sc-hero-multi-mask,.sc-hero-second-selection{display:none}.sc-hero-shape-outline{position:absolute;inset:0;width:100%;height:100%}.sc-hero-second-selection{pointer-events:none}.sc-hero-art[data-mode="1"] [data-sc-hero-shape="1"],.sc-hero-art[data-mode="2"] [data-sc-hero-shape="2"]{display:block}.sc-hero-art:not([data-mode="0"]) .sc-selection-outline{border:0;box-shadow:none}.sc-hero-art:is([data-mode="1"],[data-mode="2"]) .sc-hero-selection>.sc-handle{display:none}.sc-hero-art[data-mode="3"] .sc-hero-multi-mask,.sc-hero-art[data-mode="3"] .sc-hero-second-selection{display:block}.sc-hero-art[data-mode="3"] .sc-selection-outline,.sc-hero-second-selection{border:calc(2 * var(--u)) solid #2f7bff}.sc-hero-multi-mask{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,10% 43%,49.666667% 43%,49.666667% 75%,10% 75%,10% 43%,0 0,51.333333% 43%,90% 43%,90% 75%,51.333333% 75%,51.333333% 43%,0 0)}.sc-hero-art:not([data-mode="0"]) .sc-snap-badge{display:none}.sc-selection-outline{position:absolute;inset:0;border:calc(2 * var(--u)) solid #2f7bff;box-shadow:0 0 0 calc(700 * var(--u)) #17202b73}.sc-handle{position:absolute;width:calc(8 * var(--u));height:calc(8 * var(--u));border:calc(1.5 * var(--u)) solid #2f7bff;border-radius:calc(2 * var(--u));background:#fff;transform:translate(-50%,-50%)}.sc-selection-size,.sc-snap-badge{position:absolute;top:calc(-32 * var(--u));display:flex;align-items:center;justify-content:center;height:calc(24 * var(--u));padding:0 calc(10 * var(--u));border-radius:calc(12 * var(--u));background:#17202b;color:#fff;white-space:nowrap;font-size:calc(12 * var(--u));font-weight:700;line-height:1}.sc-snap-badge{left:calc(110 * var(--u));background:#2f7bff;font-size:calc(11 * var(--u))}.sc-selection-toolbar{position:absolute;top:calc(100% + 12 * var(--u));left:0;display:flex;align-items:center;gap:calc(8 * var(--u));padding-left:calc(9 * var(--u));width:calc(238 * var(--u));height:calc(36 * var(--u));border:1px solid #e3e8ef;border-radius:calc(10 * var(--u));background:#fff;box-shadow:0 calc(6 * var(--u)) calc(8 * var(--u)) #17212b24}.sc-selection-tool{display:grid;place-items:center;flex:none;width:calc(36 * var(--u));height:calc(28 * var(--u));border-radius:calc(6 * var(--u))}.sc-selection-tool:nth-child(2){background:#e8f0ff}.sc-selection-tool>i{display:block;width:calc(16 * var(--u));height:calc(16 * var(--u));border:calc(2 * var(--u)) solid #17202b;border-radius:calc(6 * var(--u))}.sc-selection-toolbar .sc-tool-shadow{border-color:#2f7bff;border-radius:calc(3 * var(--u));box-shadow:calc(4 * var(--u)) calc(4 * var(--u)) #8a94a680}.sc-selection-toolbar .sc-tool-ratio{width:calc(18 * var(--u));height:calc(12 * var(--u));border-style:dashed;border-radius:calc(2 * var(--u))}.sc-selection-tool:nth-child(4){font-size:calc(18 * var(--u));font-weight:700}.sc-selection-toolbar small{color:#8a94a6;font-size:calc(12 * var(--u));font-weight:700}.sc-hero-loupe{z-index:2;border:1px solid #e3e8ef;border-radius:calc(14 * var(--u));background:#fff;box-shadow:0 calc(12 * var(--u)) calc(15 * var(--u)) #17212b2e;transition:transform .18s ease-out;pointer-events:none}.sc-coordinate{color:#8a94a6;font-size:calc(11 * var(--u));font-weight:700;font-family:var(--font-sans)}.sc-hero-hex{color:#17202b;font-size:calc(13 * var(--u));font-weight:900}.sc-pixel-grid{--sc-cell:calc(var(--pixel-size) * var(--u));--sc-half-cell:calc(var(--sc-cell) / 2);position:relative;width:100%;height:100%;overflow:clip}.sc-pixel-cells{position:absolute;display:grid;grid-template-columns:repeat(calc(var(--columns) + 1),minmax(0,1fr));grid-template-rows:repeat(calc(var(--rows) + 1),minmax(0,1fr));width:calc((var(--columns) + 1) * var(--sc-cell));height:calc((var(--rows) + 1) * var(--sc-cell));left:50%;top:50%;transform:translate(-50%,-50%)}.sc-grid-crosshair{position:absolute;inset:0;pointer-events:none}.sc-grid-crosshair:before,.sc-grid-crosshair:after{content:"";position:absolute}.sc-grid-crosshair:before{top:calc(50% - var(--sc-half-cell));left:0;width:100%;height:var(--sc-cell);background:linear-gradient(to right,#3388ff80 0 calc(50% - var(--sc-half-cell)),transparent calc(50% - var(--sc-half-cell)) calc(50% + var(--sc-half-cell)),#3388ff80 calc(50% + var(--sc-half-cell)))}.sc-grid-crosshair:after{left:calc(50% - var(--sc-half-cell));top:0;height:100%;width:var(--sc-cell);background:linear-gradient(to bottom,#3388ff80 0 calc(50% - var(--sc-half-cell)),transparent calc(50% - var(--sc-half-cell)) calc(50% + var(--sc-half-cell)),#3388ff80 calc(50% + var(--sc-half-cell)))}.sc-grid-lines{position:absolute;inset:0;background-image:linear-gradient(to right,#80808080 0 calc(.5 * var(--u)),transparent calc(.5 * var(--u)) calc(100% - .5 * var(--u)),#80808080 calc(100% - .5 * var(--u))),linear-gradient(to bottom,#80808080 0 calc(.5 * var(--u)),transparent calc(.5 * var(--u)) calc(100% - .5 * var(--u)),#80808080 calc(100% - .5 * var(--u)));background-size:var(--sc-cell) var(--sc-cell);background-position:center;pointer-events:none}.sc-grid-center{position:absolute;left:50%;top:50%;width:var(--sc-cell);height:var(--sc-cell);box-shadow:inset 0 0 0 var(--u) #fff,0 0 0 var(--u) #000;transform:translate(-50%,-50%);pointer-events:none}.sc-mode-switch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:calc(4 * var(--u));background:#fff;border:1px solid #e3e8ef;border-radius:calc(22 * var(--u));box-shadow:0 calc(8 * var(--u)) calc(10 * var(--u)) #17212b14}.sc-mode-switch>button{display:flex;align-items:center;justify-content:center;min-width:0;border:0;border-radius:calc(18 * var(--u));color:#4a5568;background:transparent;font-size:calc(13 * var(--u));line-height:1.2;padding:calc(3 * var(--u))}.sc-mode-switch>button:hover{background:#eef2f7}.sc-mode-switch>button[aria-pressed=true]{color:#fff;background:#17202b;font-weight:700}.sc-mode-switch>button:focus-visible{outline:2px solid #2f7bff;outline-offset:2px}.sc-pos.sc-mode-shortcut{left:50%;transform:translate(-50%);width:max-content;max-width:85%;height:auto;min-height:calc(28 * var(--u));padding:calc(2 * var(--u)) calc(14 * var(--u));color:#17202b;font-size:calc(12 * var(--u))}.sc-hero-art:not([data-mode="0"]) .sc-hero-loupe{display:none}.sc-precision-scene{border-radius:14px;overflow:clip;background:#f5f8fc}.sc-detection-window{border:1px solid #e3e8ef;border-radius:calc(8 * var(--u));background:#fff;overflow:visible}.sc-detection-window>.sc-window-bar{border-radius:calc(8 * var(--u)) calc(8 * var(--u)) 0 0}.sc-detection-input{background:#e8f0ff;border:1px solid #9db9f5;border-radius:calc(5 * var(--u))}.sc-detection-button{background:#2f7bff;border:0;border-radius:calc(6 * var(--u))}.sc-detection-block{background:#fff0e0;border-radius:calc(6 * var(--u))}.sc-detection-selection{pointer-events:none;border:calc(2 * var(--u)) solid #2f7bff;border-radius:calc(6 * var(--u));transition:left .4s,top .4s,width .4s,height .4s}.sc-adjust-grid{background-color:#fff;background-image:linear-gradient(#e3e8ef 1px,transparent 1px),linear-gradient(90deg,#e3e8ef 1px,transparent 1px);background-size:calc(20 * var(--u)) calc(20 * var(--u))}.sc-adjust-selection{border:calc(2 * var(--u)) solid #2f7bff;background:#dcebffcc;transition:left .16s,top .16s,width .16s,height .16s}.sc-adjust-selection:before{content:"";position:absolute;top:calc(-4 * var(--u));left:calc(-4 * var(--u));width:calc(8 * var(--u));height:calc(8 * var(--u));border:1px solid #2f7bff;border-radius:calc(2 * var(--u));background:#fff}.sc-arrow-keys{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:calc(4 * var(--u))}.sc-arrow-keys button{padding:0;border:1px solid #e3e8ef;border-radius:calc(7 * var(--u));background:#fff;font-size:calc(14 * var(--u));font-weight:900;box-shadow:0 calc(2 * var(--u)) #17202b18}.sc-arrow-keys button:first-child{grid-column:2}.sc-arrow-keys button:nth-child(2){grid-column:1;grid-row:2}.sc-arrow-keys button:nth-child(3),.sc-arrow-keys button:nth-child(4){grid-row:2}.sc-guide-image{border:calc(2 * var(--u)) solid #2f7bff;border-radius:calc(8 * var(--u));transition:transform .2s}.sc-size-input{display:flex;align-items:center;gap:calc(10 * var(--u));padding:calc(6 * var(--u)) calc(10 * var(--u));border:1px solid #e3e8ef;border-radius:calc(8 * var(--u));background:#fff;font-family:var(--font-sans);font-size:calc(12 * var(--u));font-weight:700;color:#8a94a6}.sc-size-input input{min-width:0;width:100%;border:0;padding:0;background:transparent;color:#17202b;font:900 calc(13 * var(--u))/1.2 var(--font-sans);appearance:textfield;-moz-appearance:textfield}.sc-size-input input::-webkit-inner-spin-button{appearance:none}.sc-mode-scene{border-radius:14px;overflow:clip;background:#e8f0ff}.sc-mode-content{background:#fff;border-radius:calc(10 * var(--u))}.sc-mode-rectangle{border:calc(2 * var(--u)) solid #2f7bff;border-radius:calc(2 * var(--u))}.sc-mode-vector{display:block;width:100%;height:100%}.sc-mode-outline{position:absolute;inset:0}[data-sc-ratio][aria-pressed=false]{color:#4a5568;background:#f5f8fc}.sc-mode-card[data-sc-mode-card="3"] .sc-mode-scene{background:#fff6d6}.sc-mode-dimmer{position:absolute;inset:0;background:#17202b59}.sc-polygon-dimmer{clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,15.037594% 83.157895%,31.578947% 25.263158%,78.947368% 14.736842%,89.473684% 65.263158%,57.894737% 93.684211%,15.037594% 83.157895%)}.sc-multi-window{border:calc(2.5 * var(--u)) solid #e0a800;border-radius:calc(8 * var(--u));background:#fff}.sc-mode-card[data-playing] .sc-mode-drawing{animation:sc-draw 1.2s ease both}@keyframes sc-draw{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.sc-history-art .sc-scene{background:#f1edff;border-radius:32px;overflow:clip}.sc-purple-text{color:#7c4dff;font-size:calc(13 * var(--u))}.sc-history-image{background:#fff;border:1px solid #e3e8ef;border-radius:calc(12 * var(--u));opacity:calc(1 - var(--history-index)*.275);box-shadow:0 calc(8 * var(--u)) calc(10 * var(--u)) #17212b1a;transition:transform .4s,opacity .4s}.sc-history-number{background:#ff6b57;color:#fff;justify-content:center;border-radius:50%;font-size:calc(14 * var(--u));font-weight:900}.sc-history-image .sc-pill{font-size:calc(10 * var(--u))}.sc-history-divider{background:#d9ccff}.sc-history-screen{background:#fff;border:1px solid #e3e8ef;border-radius:calc(12 * var(--u));overflow:clip}.sc-history-region{border:calc(2 * var(--u)) dashed #7c4dff;border-radius:calc(6 * var(--u));transition:transform .4s}.sc-detail-art .sc-scene{border-radius:32px;overflow:clip}.sc-detail-art-pointer .sc-scene{background:#e8f0ff}.sc-detail-art-refresh .sc-scene{background:#fff6d6}.sc-detail-art-radius .sc-scene{background:#e2f8f3}.sc-detail-art-shadow .sc-scene{background:#ffece8}.sc-tutorial-window{border:1px solid #e3e8ef;border-radius:calc(14 * var(--u));background:#fff;overflow:clip}.sc-tutorial-menu{border:1px solid #e3e8ef;border-radius:calc(8 * var(--u));background:#fff;box-shadow:0 calc(8 * var(--u)) calc(10 * var(--u)) #17212b1f}.sc-tutorial-menu .sc-caption{color:#17202b;font-size:calc(13 * var(--u));padding-inline:calc(10 * var(--u))}.sc-tutorial-menu .sc-menu-selected{color:#2f7bff;font-weight:700;border-radius:calc(6 * var(--u));background:#e8f0ff}.sc-pointer-ring{border:calc(2 * var(--u)) solid #2f7bff66;border-radius:50%}.sc-tutorial-pointer,.sc-pointer-ring{transition:opacity .24s;pointer-events:none}.sc-detail-art-pointer[data-pointer-hidden] [data-sc-pointer]{opacity:0}.sc-refresh-before{overflow:clip;background:#fff;border:1px solid #e3e8ef;border-radius:calc(12 * var(--u))}.sc-refresh-placeholder{background:#eef1f5;border-radius:calc(8 * var(--u))}.sc-refresh-spinner{border:calc(2 * var(--u)) dotted #aeb9c8;border-radius:50%}.sc-refresh-selection{border:calc(2 * var(--u)) solid #2f7bff;border-radius:calc(4 * var(--u))}.sc-refresh-result{transition:opacity .6s}.sc-detail-art-refresh[data-refreshing] .sc-refresh-spinner{animation:sc-refresh-spin .8s linear infinite}.sc-detail-art-refresh[data-refreshing] .sc-refresh-result{opacity:.15}@keyframes sc-refresh-spin{to{transform:rotate(360deg)}}.sc-square-before{border:calc(1.5 * var(--u)) dashed #8a94a6}.sc-rounded-sample{overflow:clip;background:#fff;border-radius:calc(28 * var(--u));box-shadow:0 calc(14 * var(--u)) calc(30 * var(--u)) #17202b1f;transition:border-radius .16s}.sc-sample-bar{position:absolute;inset:0 0 auto;height:22%;background:#f7f9fc}.sc-sample-line{position:absolute;left:8%;top:34%;width:50%;height:7%;background:#cbd3de;border-radius:calc(4 * var(--u))}.sc-sample-block{position:absolute;left:8%;top:48%;width:84%;height:32%;border-radius:calc(8 * var(--u));background:#e8f0ff}.sc-sample-sun{position:absolute;left:66%;top:52%;width:14.4375%;height:22%;border-radius:50%;background:#ffd23f}.sc-radius-slider{display:flex;align-items:center;justify-content:space-between;gap:calc(12 * var(--u));padding:calc(6 * var(--u)) calc(16 * var(--u));background:#fff;border:1px solid #e3e8ef;border-radius:calc(20 * var(--u));color:#4a5568;font-size:calc(12 * var(--u))}.sc-radius-slider span{max-width:26%}.sc-radius-slider input{width:0;flex:1;min-width:0;height:calc(16 * var(--u));accent-color:#19c3a5}.sc-radius-slider output{min-width:calc(24 * var(--u));font-weight:700;color:#17202b}.sc-shadow-document{border-radius:calc(16 * var(--u));background:#fff}.sc-shadow-sample{border-radius:calc(4 * var(--u));background:#fff}.sc-shadow-sample .sc-sample-bar{border-radius:calc(4 * var(--u)) calc(4 * var(--u)) 0 0}.sc-shadow-sample .sc-sample-sun{width:auto;aspect-ratio:1}.sc-shadow-sample-1{box-shadow:0 calc(6 * var(--u)) calc(16 * var(--u)) #17202b29}.sc-shadow-sample-2{outline:var(--sc-border-width,calc(6 * var(--u))) solid var(--sc-border-color,#17202b)}.sc-shadow-original{color:#8a94a6;font-weight:700;font-size:calc(13 * var(--u))}.sc-shadow-warning{font-size:calc(11 * var(--u));color:#ff6b57}html:not(:lang(zh)) .sc-shadow-warning{left:calc(24 * var(--u));top:calc(196 * var(--u));width:calc(146 * var(--u));height:calc(24 * var(--u))}.sc-shadow-controls{border:1px solid #e3e8ef;border-radius:calc(16 * var(--u));background:#fff}.sc-shadow-toggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:calc(3 * var(--u));border-radius:calc(16 * var(--u));background:#f5f8fc}.sc-shadow-toggle button{min-width:0;border:0;background:transparent;border-radius:calc(13 * var(--u));color:#4a5568;font-size:calc(12 * var(--u));padding:0}.sc-shadow-toggle button[aria-pressed=true]{background:#17202b;color:#fff}.sc-shadow-strength{display:flex;align-items:center;gap:calc(8 * var(--u));font-size:calc(12 * var(--u));color:#4a5568}.sc-shadow-strength span{flex:none;max-width:40%}.sc-shadow-strength input{min-width:0;width:0;flex:1;accent-color:#ff6b57}.sc-shadow-color{padding:0;border:0;background:transparent;cursor:pointer}.sc-shadow-color::-webkit-color-swatch-wrapper{padding:0}.sc-shadow-color::-webkit-color-swatch{border:0;border-radius:calc(6 * var(--u))}.sc-shadow-always{display:flex;align-items:flex-start;gap:calc(10 * var(--u));color:#17202b;font-size:calc(12 * var(--u));font-weight:700}.sc-shadow-always input{width:calc(22 * var(--u));height:calc(22 * var(--u));margin:0;flex:none;accent-color:#19c3a5}.sc-color-art .sc-scene{background:#e8f0ff;border-radius:32px;overflow:clip}.sc-color-source{border-radius:calc(14 * var(--u));background:#fff;overflow:clip}.sc-color-source-fallback{position:absolute;inset:0;pointer-events:none}.sc-color-blue,.sc-color-red{border-radius:calc(10 * var(--u))}.sc-color-pointer{pointer-events:none}.sc-color-connector{border-right:calc(1.5 * var(--u)) dashed #8a94a6;border-top:calc(1.5 * var(--u)) dashed #8a94a6;transform:skewY(26deg);transform-origin:left top}.sc-color-magnifier{border:1px solid #e3e8ef;border-radius:calc(18 * var(--u));background:#fff;box-shadow:0 calc(14 * var(--u)) calc(18 * var(--u)) #17212b29}.sc-color-pixels{overflow:clip;border-radius:calc(8 * var(--u))}.sc-color-value{color:#17202b;font-size:calc(18 * var(--u));font-weight:900;overflow-wrap:anywhere}.sc-color-value[data-long]{font-size:calc(11 * var(--u))}.sc-color-rgb{font-family:var(--font-sans);font-size:calc(12 * var(--u))}.sc-color-swatch{border-radius:calc(5 * var(--u));background:#2f7bff}.sc-color-formats{display:flex;flex-wrap:wrap;align-content:flex-start;gap:calc(8 * var(--u)) calc(6 * var(--u))}.sc-color-formats>button{padding:calc(5 * var(--u)) calc(10 * var(--u));border:1px solid #e3e8ef;border-radius:calc(13 * var(--u));background:#fff;font:inherit;font-size:calc(11 * var(--u));line-height:calc(14 * var(--u));color:#17202b;cursor:pointer}.sc-color-formats>button:hover,.sc-zoom-control:hover{border-color:#8cb2ff}.sc-color-formats>button[aria-pressed=true]{background:#17202b;color:#fff;border-color:#17202b}.sc-color-formats>button:focus-visible,.sc-zoom-control:focus-visible{outline:2px solid #2f7bff;outline-offset:2px}.sc-pos.sc-zoom-control{width:max-content;max-width:calc(212 * var(--u));min-height:calc(28 * var(--u));height:auto;padding-inline:calc(14 * var(--u))}.sc-zoom-control{cursor:pointer;font-family:inherit}.sc-zoom-panel{display:flex;align-items:center;gap:calc(10 * var(--u));padding:calc(10 * var(--u));border:1px solid #e3e8ef;border-radius:calc(10 * var(--u));background:#fff;box-shadow:0 calc(4 * var(--u)) calc(12 * var(--u)) #17202b14;opacity:1;transform:translateY(0);transition:opacity .16s,transform .16s,display .16s allow-discrete}.sc-zoom-panel[hidden]{display:none;opacity:0;transform:translateY(4px)}.sc-zoom-panel input{flex:1;width:0;min-width:0;margin:0;accent-color:#2f7bff}.sc-zoom-panel output{flex:none;min-width:calc(28 * var(--u));font:700 calc(12 * var(--u))/1.2 var(--font-sans)}@starting-style{.sc-zoom-panel{opacity:0;transform:translateY(4px)}}@media(prefers-reduced-motion:reduce){.sc-zoom-panel{transition:none}}@media(min-width:1280px){html:lang(ja) .sc-hero h1>span{font-size:60px;line-height:76px}html:lang(ja) .sc-hero h1>span:last-child{font-size:50px;line-height:66px}}@media(max-width:1279px){.sc-hero h1>span{font-size:60px;line-height:76px}.sc-hero h1>span:last-child{font-size:50px;line-height:66px}.sc-hero-copy{max-width:49%}.sc-intro{font-size:17px;line-height:30px}.sc-split{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px}.sc-loupe-section{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}.sc-precision-grid{gap:16px;padding:20px}.sc-faq{grid-template-columns:30% minmax(0,1fr);gap:50px}.screenshot-page h2{font-size:34px;line-height:48px}.sc-detail-pair h2{font-size:26px;line-height:38px}.sc-howto ol{gap:24px}.sc-howto h3{font-size:20px}.sc-step-keys kbd{min-width:52px;padding-inline:12px}.sc-output-keys kbd{min-width:0;padding-inline:8px}.sc-next-card{padding:16px}.sc-next-card kbd{top:24px;right:12px}}@media(max-width:1023px){.sc-hero,.sc-hero-layout{min-height:750px}.sc-hero-copy{padding-top:140px}.sc-hero-art{top:165px;left:49%;max-width:56%}.sc-hero h1>span{font-size:48px;line-height:66px}.sc-hero h1>span:last-child{font-size:40px;line-height:56px}.sc-intro{font-size:16px;line-height:28px}.sc-free{font-size:12px}.sc-howto{padding-bottom:40px}.sc-step-keys{gap:6px}.sc-step-number{margin-right:0;width:26px;height:26px;font-size:13px}.sc-step-keys kbd{min-width:40px;font-size:19px;padding-inline:8px;height:46px}.sc-output-keys{gap:4px}.sc-output-keys kbd{min-width:0;height:30px;font-size:11px;padding-inline:5px}.sc-precision-grid{gap:12px;padding:16px}.sc-precision-panel{padding:8px}.sc-precision-panel h3,.sc-mode-card h3{font-size:17px;margin-inline:4px}.sc-precision-panel>p,.sc-mode-card>p{margin-inline:4px;font-size:13px}.sc-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.sc-mode-card{min-height:0}.sc-detail-pair{gap:24px}.sc-explanation{gap:8px;font-size:14px;line-height:26px}.sc-next-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-next{min-height:0}.sc-split h2{font-size:28px;line-height:40px}.sc-bullets li{font-size:13px;line-height:24px}.sc-split,.sc-detail-pair{min-height:0}.sc-tips>div{gap:12px 24px}.sc-tips article{gap:6px 12px}.sc-tips h3{font-size:17px}.sc-faq{grid-template-columns:1fr;gap:28px;padding-bottom:64px}.sc-faq header>p{max-width:600px}.sc-faq-list{width:100%}}@media(max-width:767px){.sc-container{width:calc(100% - 40px)}.sc-seam{--seam-width: calc(100vw - 40px) }.sc-hero,.sc-hero-layout{min-height:0}.sc-hero-copy{max-width:none;width:100%;padding-top:124px}.sc-hero h1>span{font-size:48px;line-height:64px}.sc-hero h1>span:last-child{font-size:36px;line-height:50px}html:lang(ja) .sc-hero h1>span:first-child{font-size:30px;line-height:44px}.sc-title-seam{max-width:100%;width:100%}.sc-intro{margin-top:20px!important}.sc-hero .download-control{margin-top:28px;width:100%}.sc-hero .download-button{font-size:16px}.sc-free{margin-top:22px!important}.sc-hero-art{position:relative!important;left:auto;top:auto;max-width:none;width:100%;margin-top:30px}.screenshot-page h2{font-size:28px;line-height:40px}.sc-howto{padding-top:24px}.sc-howto ol{grid-template-columns:1fr;gap:32px;margin-top:28px}.sc-step-keys kbd{height:46px;min-width:50px;font-size:21px}.sc-output-keys kbd{height:32px;min-width:0;font-size:12px;padding-inline:12px}.sc-howto h3{margin-top:14px;font-size:20px;line-height:30px}.sc-howto li>p{max-width:none}.sc-precision,.sc-modes{min-height:0;padding-block:24px 32px}.sc-precision-grid{grid-template-columns:1fr;gap:16px;padding:16px;margin-top:24px;border-radius:24px}.sc-precision-panel{min-height:0;padding:12px}.sc-precision-panel h3{margin-inline:12px;font-size:19px}.sc-precision-panel>p{margin-inline:12px;font-size:14px}.sc-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}.sc-mode-card{padding:8px;border-radius:16px}.sc-mode-card h3{font-size:17px;line-height:25px;margin:14px 4px 0}.sc-mode-card>p{margin:8px 4px 12px;font-size:13px;line-height:22px}.sc-explanation{font-size:15px;line-height:26px;gap:10px}.sc-problem{margin-top:18px!important}.sc-split,.sc-loupe-section{grid-template-columns:1fr;gap:28px;padding-block:24px 32px}.sc-split h2{font-size:28px;line-height:40px}.sc-loupe-section .sc-section-copy{order:1}.sc-loupe-section .sc-color-art{order:0}.sc-history-art .sc-scene,.sc-color-art .sc-scene{border-radius:24px}.sc-bullets li{font-size:14px;line-height:26px}.sc-detail-pair{grid-template-columns:1fr;gap:40px;padding-block:24px 32px}.sc-detail-pair h2{font-size:26px;line-height:38px}.sc-detail-pair .sc-section-copy{margin-top:24px}.sc-detail-art .sc-scene{border-radius:24px}.sc-next{padding-block:24px 32px}.sc-next>p{font-size:15px;line-height:26px}.sc-next-grid{gap:12px;margin-top:24px}.sc-next-card{padding:14px;border-radius:12px}.sc-next-card .sc-action-icon{width:36px;height:36px;border-radius:10px}.sc-next-card h3{font-size:16px;line-height:24px;margin-top:14px}.sc-next-card kbd{font-size:10px;padding:3px 6px;right:10px;top:20px}.sc-next-card>p{font-size:12px;line-height:22px}.sc-tips{min-height:0;padding-block:24px 32px}.sc-tips>div{grid-template-columns:1fr;margin-top:24px;gap:0}.sc-faq{min-height:0;padding-block:24px 40px;gap:24px}.sc-faq summary{padding:16px 18px;font-size:16px;line-height:26px;gap:12px}.sc-faq-answer p{padding:0 18px 22px;font-size:14px;line-height:25px}.sc-explore{min-height:0;padding-block:24px 32px}.sc-explore h2{font-size:24px;line-height:36px}.sc-explore>div{gap:10px;margin-top:22px}.sc-explore a{font-size:13px;gap:7px;padding:6px 12px 6px 6px}.sc-explore .sc-action-icon{width:32px;height:32px}}@media(prefers-reduced-motion:reduce){.sc-mode-card[data-playing] .sc-mode-drawing,.sc-detail-art-refresh[data-refreshing] .sc-refresh-spinner{animation:none}}