.button,.char-preview,.close-toggle,.copy-btn,.dropdown-btn,.hamburger,.styled-button{cursor:pointer}.dropdown-content a,.keyword-grid a,.nav a,.social-share a,.table-of-contents a,.toc-sidebar a{text-decoration:none}.head,.header{margin-bottom:0}html{scroll-behavior:smooth}body{font-family:Arial,sans-serif!important;margin:0}.blank-space,.char-preview,.main-head,.main-pera,.nav a,.unicode-container,.unicode-example{text-align:center}.header,.nav{display:flex}.hamburger div,body{background-color:#fff}.button,.nav a,.styled-button{transition:background-color .3s}.header{justify-content:space-between;align-items:center;background-color:#564190;padding:5px;color:#fff}.method,.method-footer{background-color:#f6f3fc}.main-head{line-height:60px!important}@media (max-width:600px){.logo img{width:200px!important;height:40px!important}.main-head{font-size:50px!important;line-height:60px!important}}.logo img{width:300px;height:60px}.nav{gap:15px}.nav a{color:#fff;border-radius:4px;padding:10px}.head{background-color:#fff;margin-top:10px}.button:hover,.footer,.nav a:hover,.nav.active,.styled-button,.styled-button:hover{background-color:#564190}.hamburger{display:none;flex-direction:column}.hamburger div{width:25px;height:3px;margin:4px;transition:.3s}.nav.active{display:flex;flex-direction:column;position:absolute;top:55px;right:0;width:100%;border-radius:0}.container{max-width:900px;margin:20px auto}.footer-container{max-width:100%;background-color:#f6f3fc}.head-content{background-color:#ffff}.method{border:1px solid #ced4da;padding:20px;margin-bottom:20px}.method-footer{border-radius:8px;max-width:1108px;padding:60px 20px 11px;margin:0 auto}.head-content,.main{max-width:1300px;width:100%}.method h2,.method-footer h2,.unicode-container h2{font-size:26px;line-height:30px;margin:0;font-weight:500;color:#000}.method p,.method-footer p,.unicode-container p{margin-bottom:15px;color:#000;font-family:sans-serif;font-weight:100;font-size:15px;line-height:22px}.head-content h1,.method-footer li{margin-bottom:10px;font-size:15px;line-height:22px}.content-wrapper{display:flex;justify-content:space-between;align-items:flex-start}.left-content{width:68%;margin-right:10px}.right-content{width:30%;display:flex;justify-content:center;align-items:center}.right-content img{max-width:85%;height:auto}.side-image{width:100%;height:100%;object-fit:cover;border-radius:8px}.button{padding:15px 35px;background-color:#564190;color:#fff;border:none;border-radius:4px;font-size:16px}.input-group{display:flex;margin-top:0;align-items:center}.input-group input[type=number],.input-group input[type=text]{padding:15px 30px;width:20%;border:1px solid #ced4da;border-radius:4px;margin-right:10px;font-size:16px}.result-box{border:1px solid #ced4da;padding:10px;margin-top:10px;font-size:18px;height:30px;display:flex;align-items:center;overflow-x:auto;white-space:nowrap;background-color:#fff}.result-box .highlight{background-color:#a020f0;padding:2px 4px;border-radius:4px}.copy-box{margin-top:15px}kbd{color:#000}table.unicode-table{width:100%;border-collapse:collapse;margin-top:30px}table.unicode-table td,table.unicode-table th{border:1px solid #ddd;padding:8px;text-align:center}table.unicode-table th{background-color:#f2f2f2;color:#333}.unicode-example{background-color:#f4f4f4;padding:5px;border-radius:4px;width:30px}.blank-space{display:inline-block;padding:15px 60px;font-size:18px;color:#fff;background-color:#fff;border:1px solid #ddd;border-radius:4px;margin-right:10px}.char-counter-container{display:flex;justify-content:flex-end;margin-top:5px;color:#495057;font-size:.9em}#charCounter{padding:5px 10px;border-radius:4px}.char-preview{display:inline-block;min-width:10px;min-height:20px;background:0 0;text-decoration:underline dashed #38a3fa54;text-decoration-thickness:20px;margin-bottom:20px;font-size:16px;line-height:1;white-space:nowrap;user-select:all}hr{margin:40px 0}.main-head{font-size:50px!important}.method-footer img{width:100%}div#socialShareCopy p,div#socialShareGenerate p{display:inline}.styled-button{display:flex;align-items:center;padding:15px 30px;width:20%;color:#fff;border:none;border-radius:4px;font-size:16px}.styled-button i{margin-right:8px}.main{margin:20px auto 50px}.head-content{padding:20px 0;color:#31473a;margin:0 auto}.head-content h1{font-size:50px;color:#000;line-height:55px}.head-content p{font-size:18px;color:#000;line-height:25px;margin-bottom:0}.footer{color:#fff;padding:10px 20px;font-size:.9em}.table-of-contents{background:#f9f9f9;padding:15px;border-radius:8px;margin-bottom:25px}.table-of-contents ul{list-style:none;padding-left:0}.table-of-contents li{margin:8px 0}.table-of-contents a{color:#007acc}.table-of-contents a:hover,.toc-sidebar a:hover{text-decoration:underline}.method-footer ul{margin-bottom:15px;padding-left:18px}.social-share{margin-top:0;display:none;gap:10px;align-items:center}.social-share a{display:inline-block;padding:11px;border-radius:50%;color:#f6f3fc}.social-share a:nth-child(2),.social-share a:nth-child(3),.social-share a:nth-child(4),.social-share a:nth-child(5){background:#e7e5eb;margin:0 5px}.unicode-container{padding:20px;max-width:1300px;margin:50px auto}.copy-btn,.unicode-card{padding:15px;display:flex}.unicode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;justify-content:center;align-items:stretch;margin-top:50px}.unicode-card{background:#977be317;border:1px solid #ced4da;text-align:left;flex-direction:column;justify-content:space-between;min-height:200px}.copy-btn,.copy-btn:hover{background:#564190}.unicode-card p{display:flex;justify-content:space-between;align-items:center;text-align:right;margin:5px 0;font-size:14px}.unicode-card p strong{text-align:left;width:50%;display:inline-block;font-weight:700}.unicode-card p span{text-align:right;width:50%;display:inline-block}.copy-btn{align-items:center;justify-content:center;width:100%;color:#fff;border:none;font-size:14px;margin-top:10px;gap:8px}.copy-btn i{font-size:16px}@media (max-width:1024px){.unicode-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.unicode-grid{grid-template-columns:repeat(1,1fr)}}.container-footer{display:flex;gap:10px;max-width:1100px;margin:50px auto;flex-wrap:nowrap;flex-direction:row}.main-content{flex:0 0 70%;background:#fff;max-width:65%;padding:20px;border:1px solid #ddd}.toc-sidebar{max-width:30%;position:sticky;top:5px;height:fit-content}.toc-sidebar h2{font-size:18px;line-height:25px;margin:10px 0;border-bottom:1px solid #ccc;padding-bottom:6px}.toc-sidebar ul{list-style:none;padding:0;margin:0}.toc-sidebar li{margin-bottom:2px}.toc-sidebar a{color:#564190;font-size:15px;font-weight:500}@media (max-width:768px){.nav{display:none}.hamburger{display:flex}.content-wrapper{flex-direction:column}.left-content,.right-content{width:100%;margin-right:0;margin-bottom:20px}.right-content img{width:100%}.header{align-items:center}.logo{width:200px;height:auto}.method,.method-footer{padding:20px}.nav a{text-align:left;padding:10px}.main{width:95%;margin:0 auto}.table-container{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-container table{width:100%;border-collapse:collapse}table.unicode-table td,table.unicode-table th{padding:6px;font-size:14px}.unicode-example{width:auto;padding:3px}.blank-space,.styled-button{padding:15px 40px;width:90%;font-size:18px}input#blankInput{width:10%!important}.char-counter-container{font-size:.8em}.method p,.method-footer p{font-size:14px;line-height:20px}.head-content p{font-size:1em;text-align:center;padding:0 10px}.button,.input-group input[type=number],.input-group input[type=text]{padding:15px 30px;width:100%}.head-content h1{color:#31473a;text-align:center}.method h2,.method-footer h2,.unicode-container h2{font-size:20px;margin-bottom:0;font-weight:600;font-family:sans-serif;color:#495057}.head-content h1,.method-footer li{margin-bottom:10px;font-size:35px;line-height:35px}div#socialShareCopy p,div#socialShareGenerate p{display:block}h3{font-size:15px}.main-head{text-align:center;font-size:25px!important;line-height:30px!important}.method-footer li{margin-bottom:10px;font-size:14px;line-height:20px}hr{margin:20px 0}.container-footer{flex-direction:column;padding:0}.toc-sidebar{order:-1;max-width:100%;flex:100%;position:relative;top:auto}.main-content{order:0;max-width:100%;flex:100%}}.method h3,.method-footer h3,.unicode-container h3{font-size:18px;line-height:25px;margin:15px 0;font-weight:400;color:#000}.method p{margin:0 0 15px}.method h2{line-height:50px}.bottom-toggle-container{position:fixed;bottom:0;left:0;width:100%;background-color:#f5f9fc;border-top:1px solid #ccc;box-shadow:0 -4px 10px rgba(0,0,0,.2);z-index:9999;font-family:Arial,sans-serif}.close-toggle{font-size:20px;line-height:1;color:#444;position:fixed;top:calc(100vh - 110px);right:10px;z-index:10001;background:#fff;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.15)}.bottom-toggle-content{padding:14px 20px;text-align:center}.dummy-ad{height:50px;max-width:728px;margin:0 auto;background:#dfe8ef;border:2px dashed #aaa;display:flex;align-items:center;justify-content:center;color:#666;font-size:16px}.keyword-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;max-width:700px}.keyword-grid a{display:block;padding:10px 12px;background:#f5f5f5;border-radius:6px;color:#333;font-size:14px;border:1px solid #ddd;transition:.2s}.keyword-grid a:hover{background:#eaeaea;border-color:#bbb}.table{flex:0 0 30%;top:5px;background-color:#fff;padding:20px;margin:0 0 20px;border:1px solid #ddd;border-radius:6px;height:fit-content}.dropdown-btn,.header{display:flex;align-items:center}.header{justify-content:space-between;gap:20px}.dropdown{position:relative}.dropdown-btn{background:#564190;border:1px solid #ccc;padding:8px 12px;border-radius:6px;gap:8px;font-size:14px}.dropdown-content{display:none;position:absolute;right:0;top:110%;background:#fff;border:1px solid #ddd;border-radius:6px;min-width:220px;max-height:300px;overflow-y:auto;box-shadow:0 10px 25px rgba(0,0,0,.15);z-index:999}.dropdown-content a{display:flex;align-items:center;gap:10px;padding:10px;color:#000}.dropdown-content a:hover{background:#f3f3f3}.flag{width:22px;height:16px}.header-right{display:flex;gap:20px}