*{box-sizing:border-box}body{margin:0;color:#06134a;font-family:Arial,Helvetica,sans-serif;font-size:13px;background:#fff}button,select{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}.top{height:59px;border-bottom:1px solid #e9ecf7}.top-inner{max-width:1430px;margin:auto;height:100%;padding:0 20px;display:flex;align-items:center;gap:23px}.top img{height:44px;max-width:210px;object-fit:contain}.vline{height:30px;border-left:1px solid #c7d4ee}.top strong{font-size:21px}.top nav{margin-left:auto;display:flex;gap:29px}.hero{background:radial-gradient(ellipse 350px 130px at -4% 120%,#c7b3fa 0 80%,transparent 81%),radial-gradient(ellipse 420px 160px at 104% -25%,#d8e7ff 0 80%,transparent 81%),linear-gradient(110deg,#ebe6ff,#f5f7ff 60%,#e4ecff)}.hero-inner{max-width:1430px;margin:auto;display:flex;align-items:center;gap:32px;min-height:146px;padding:14px 22px}.hero-art{width:220px;flex:0 0 220px;height:120px;position:relative;background:radial-gradient(ellipse,#dcd4ff,transparent 70%);display:flex;align-items:center;justify-content:center}.paper{width:75px;height:98px;background:#fff;border:2px solid #d4d7ff;box-shadow:0 4px 10px #7c75b64d;border-radius:7px;font-size:45px;text-align:center;color:#a5b0e1;padding-top:5px}.paper span{display:block;background:#fa164d;color:#fff;font-size:19px;padding:6px;margin-top:2px;font-weight:bold}.pencil{font-size:47px;position:absolute;right:35px;top:18px;transform:rotate(-20deg)}.chip{color:#7d31f8;background:#e9d6ff;border-radius:6px;padding:3px 9px;font-weight:bold}.hero h1{font-size:36px;margin:7px 0 4px}.hero h1 em{color:#fb2153;font-style:normal}.hero p{font-size:15px;color:#415a96;margin:0 0 14px}.ticks{display:flex;flex-wrap:wrap;gap:38px}.ticks span:first-letter{color:#05bb53}.wrap{max-width:1470px;margin:auto;padding:8px 18px}.toolbar{min-height:60px;border:1px solid #e3eaf7;border-radius:6px;display:flex;align-items:center;gap:10px;padding:7px 14px;margin-bottom:10px;overflow-x:auto}.toolbar button{border:0;background:#fff;color:#06134a}.toolbar .open{background:#0875ff;color:white;border-radius:5px;padding:12px 18px;white-space:nowrap;font-size:14px}.tool-group{display:flex;align-items:center;border-left:1px solid #e1e7f3;padding-left:10px;gap:3px}.tool-group button{min-width:57px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:3px 5px;border-radius:4px;white-space:nowrap;font-size:11px}.tool-group button b{font-size:22px;color:#0875f8;height:24px}.tool-group button.active{background:#e5f0ff;outline:1px solid #9ac9ff}.tool-group button:hover{background:#f0f5ff}.tool-group button b.red{color:#ff1747}.tool-group button b.green{color:#06b758}.zoom{display:flex;align-items:center;gap:10px;margin-left:auto;white-space:nowrap}.zoom button,.zoom span{border:1px solid #dbe3f1;border-radius:4px;padding:9px 12px}.editor-grid{display:grid;grid-template-columns:180px minmax(0,1fr) 290px;gap:12px;height:450px}.pages,.stage,.panel{border:1px solid #e0e9f7;border-radius:6px}.pages{overflow:hidden}.pages-title{padding:10px 12px;border-bottom:1px solid #e6ecf5;font-weight:bold}.thumbs{height:calc(100% - 38px);overflow:auto;padding:8px}.thumb{width:100%;border:1px solid transparent;background:white;padding:7px 5px;margin-bottom:10px;color:#091b5b;border-radius:5px}.thumb.active{border-color:#0b7afa;background:#eaf3ff}.thumb canvas{max-width:100%;height:92px;display:block;margin:auto;box-shadow:0 2px 5px #8d9ab477}.thumb span{display:block;margin-top:5px}.stage{overflow:hidden;background:#dce3ea}.stage-scroll{height:100%;overflow:auto;display:flex;align-items:flex-start;justify-content:center;padding:30px 15px}.paper-holder{position:relative;min-width:300px;min-height:350px;background:white;box-shadow:0 3px 15px #8999a677}.paper-holder>canvas{display:block}.overlay{position:absolute;inset:0;touch-action:none}.annotation{position:absolute;cursor:move;user-select:none;white-space:pre-wrap}.annotation.selected{outline:1px dashed #0780ff;outline-offset:3px}.annotation.text,.annotation.comment,.annotation.signature{font-family:Arial;font-size:17px;color:#121a43}.annotation.comment{background:#fff5b4;padding:5px}.annotation.highlight{background:#ffed00;opacity:.45}.annotation.shape{border:3px solid #8b37ff;border-radius:4px}.annotation.draw{border-top:3px solid #0878ff;transform-origin:left center}.annotation.image img{display:block;width:100%;height:100%;object-fit:contain}.right{overflow-y:auto}.panel{padding:12px 16px;margin-bottom:10px}.panel h3{font-size:14px;margin:0 0 14px}.save{background:#f4edff}.save button{width:100%;padding:10px;border:1px solid #dddced;background:#fff;border-radius:5px;margin:0 0 7px;font-weight:bold;color:#0b1d5b}.save button.pink{background:#ff1350;border-color:#ff1350;color:white}.more a{display:flex;justify-content:space-between;padding:7px 5px 7px 20px}.more a:hover{color:#007bff}.info p{display:flex;gap:8px;margin:12px 0;color:#516ba4}.info p b{color:#07194f}.notice{padding:8px 12px;color:#4c659d;font-size:12px;min-height:29px}.how{background:#f7f9ff;border-radius:6px;text-align:center;padding:10px 15px 16px}.how h2,.faq h2{font-size:23px;margin:0}.how>p,.faq>p{margin:3px 0 10px;color:#657db4}.steps{display:flex;align-items:center;justify-content:space-around}.step{display:flex;align-items:center;text-align:left;gap:14px}.step p{color:#5975b1;line-height:1.4;max-width:190px;margin:5px 0}.bubble{position:relative;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;font-size:31px}.pinkish{background:#ffe5ef;color:#fb1450}.purplish{background:#ede4ff;color:#8230fa}.greenish{background:#e0f8eb;color:#06b852}.bubble i{position:absolute;top:0;right:-5px;border-radius:50%;font-style:normal;font-size:13px;background:#0879ff;color:white;width:25px;height:25px;display:grid;place-items:center}.arrow{font-size:33px;color:#0875ff}.faq{text-align:center;padding:10px 0}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}.faq details{text-align:left;border:1px solid #e0e8f6;border-radius:4px}.faq summary{padding:7px 12px;cursor:pointer}.faq details p{padding:0 12px 10px;color:#536b9c}footer{text-align:center;color:#6c7eaa;padding:20px}.empty{text-align:center;width:430px;max-width:80vw;padding:55px 25px}.empty>div{font-size:50px;color:#8c69e6}.empty h2{font-size:21px}.empty p{color:#536ba3;line-height:1.5}.empty button{background:#0875ff;color:#fff;border:0;padding:12px 22px;border-radius:5px}.muted{color:#637ba9;text-align:center}@media(max-width:1200px){.editor-grid{grid-template-columns:145px minmax(0,1fr) 235px}.tool-group button{min-width:49px}}@media(max-width:850px){.hero-art{display:none}.editor-grid{grid-template-columns:115px minmax(0,1fr);height:540px}.right{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;overflow:visible}.editor-grid{height:auto}.pages,.stage{height:430px}.panel{margin:0}.steps{gap:8px}.step{gap:6px}.bubble{width:50px;height:50px;font-size:24px}}@media(max-width:600px){.top-inner{gap:8px;padding:0 10px}.top img{height:30px;max-width:135px}.top strong{font-size:16px}.top nav{gap:9px;font-size:11px}.hero h1{font-size:29px}.ticks{gap:10px;font-size:11px}.wrap{padding:8px}.editor-grid{grid-template-columns:85px minmax(0,1fr);gap:5px}.pages,.stage{height:380px}.stage-scroll{padding:15px 8px}.right{grid-template-columns:1fr}.steps{flex-direction:column;align-items:flex-start}.arrow{display:none}.faq-grid{grid-template-columns:1fr}}
