:root{color:#111827;background:#f5f7fb;font-family:Inter,Segoe UI,Microsoft YaHei,Arial,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}.shell{background:rgba(255,255,255,.84);border:1px solid #e5e9f0;border-radius:18px;box-shadow:0 18px 50px #1f293714;margin:22px auto;max-width:1880px;min-height:calc(100vh - 44px);padding:34px 28px}.hero{align-items:center;display:flex;gap:24px}.mark{align-items:center;background:#eef2f7;border-radius:10px;color:#5476a6;display:flex;font-size:26px;height:68px;justify-content:center;width:68px}h1,p{margin:0}h1{font-size:30px;font-weight:700;letter-spacing:0;line-height:1.15}.product-tabs{align-items:baseline;display:flex;gap:18px}.product-tabs button{appearance:none;background:transparent;border:0;color:#8a95a3;font-size:30px;font-weight:700;letter-spacing:0;line-height:1.15;padding:0 0 5px;position:relative}.product-tabs button.active{color:#111827}.product-tabs button.active:after{background:#5476a6;border-radius:999px;bottom:0;content:"";height:2px;left:1px;position:absolute;width:calc(100% - 2px)}p{color:#7a8594;margin-top:10px}.info-note{border-top:1px solid #e4e9f1;color:#7a8594;font-size:14px;line-height:1.72;margin-top:26px;padding-top:20px}.info-note p{color:inherit;margin:0 0 10px}.info-note p:last-child{margin-bottom:0}.workspace{display:grid;gap:28px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:46px}.panel{background:rgba(255,255,255,.94);border:1px solid #e2e7ef;border-radius:16px;box-shadow:0 12px 30px #1f29370f;min-width:0;padding:28px}.key-panel{position:relative}.panel-title,.tabs{align-items:center;border-bottom:1px solid #e4e9f1;display:flex;gap:42px;padding-bottom:22px}.panel-title{justify-content:space-between}.title-action,.tabs button,.field-head button,.action-row button{appearance:none;background:transparent;border:0;color:#6b7584;min-height:32px;padding:0}.title-action.primary,.title-action.active,.tabs button.active{color:#111827;font-weight:700;position:relative}.title-action.primary:after,.title-action.active:after,.tabs button.active:after{background:#5476a6;bottom:-23px;content:"";height:2px;left:0;position:absolute;width:100%}.field-grid{display:grid;gap:22px;grid-template-columns:repeat(2,minmax(190px,1fr))}label,.block-field{color:#6b7584;display:grid;font-size:15px;font-weight:500;gap:10px}.block-field{margin-top:28px;position:relative}.compact-field{align-items:center;column-gap:18px;grid-template-columns:52px minmax(0,1fr)}.field-head{align-items:center;display:contents}.field-head>select,.field-head>button,.field-head>.inline-check,.field-head>.field-hint{grid-column:2;justify-self:end}.field-label{grid-column:1;white-space:nowrap}.field-head>button,.field-head>.inline-check,.field-head>.field-hint{display:flex;justify-self:end}.field-head button{color:#7f8a99}input,select,textarea{background:#fbfcfe;border:1px solid #d8dee8;border-radius:8px;color:#111827;outline:none}input,select{font-size:15px;min-height:46px;padding:0 14px;width:100%}textarea{font-size:15px;line-height:1.65;min-height:130px;padding:18px;resize:vertical;width:100%;word-break:break-all}.compact-field textarea{grid-column:1 / -1}textarea:focus,input:focus,select:focus{border-color:#5476a6;box-shadow:0 0 0 3px #5476a621}.key-panel textarea{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:14px}textarea::placeholder{color:#8a95a3;font-family:inherit;opacity:1}.copy-float{align-items:center;background:rgba(255,255,255,.96);border:1px solid #d8dee8;border-radius:999px;box-shadow:0 8px 18px #1f293724;color:#5476a6;display:none;height:34px;justify-content:center;min-height:34px;padding:0;position:absolute;width:34px;z-index:6}.copy-float.visible{display:flex}.copy-float.copied{background:#5476a6;border-color:#5476a6;color:#fff}.copy-float svg{fill:none;height:17px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:17px}.key-panel textarea{min-height:154px}.inline-check,.flag-row label{align-items:center;display:flex;gap:10px}.inline-check{color:#6b7584;white-space:nowrap}.field-hint{align-items:center;color:#8a95a3;font-size:14px;min-height:38px;white-space:nowrap}input[type=checkbox]{appearance:none;background:#ffffff;border:1px solid #cfd6df;border-radius:5px;height:20px;min-height:20px;padding:0;width:20px}input[type=checkbox]:checked{background:#5476a6;border-color:#5476a6;box-shadow:inset 0 0 0 4px #5476a6}input[type=checkbox]:disabled{background:#eef1f5;border-color:#d9dee6}.settings{border-bottom:1px solid #e4e9f1;display:grid;gap:18px;margin-top:28px;padding-bottom:22px}.settings label{min-width:0}.flag-row{align-items:center;display:flex;flex-wrap:wrap;gap:14px}.flag-row label{border:1px solid #e0e5ed;border-radius:8px;color:#4f5c6b;font-size:15px;min-height:44px;padding:0 12px}.field-head select{min-height:38px;min-width:92px;width:112px}.output-field textarea{min-height:124px}.action-row{align-items:center;display:flex;gap:18px;justify-content:flex-end;margin-top:22px}.run-button{background:#5476a6;border:1px solid #5476a6;border-radius:7px;box-shadow:0 3px 8px #5476a629;color:#fff;min-height:52px;min-width:150px;padding:0 24px}#status,#sm4Status,#sm3Status{color:#7f8a99;margin-right:auto}body[data-operation=sign] .verify-field,body[data-operation=encrypt] .verify-field,body[data-operation=decrypt] .verify-field,body[data-operation=verify] #sm2OutputField,body[data-sm3-source=text] .sm3-file-field,body[data-sm3-source=file] .sm3-text-field,body[data-sm3-hmac=off] .sm3-hmac-field{display:none}body[data-sm4-mode=ecb] .sm4-key-panel #sm4Iv,body[data-sm4-mode=ecb] .sm4-key-panel label:has(#sm4Iv),body[data-sm4-mode=cbc] .sm4-gcm-field,body[data-sm4-mode=ecb] .sm4-gcm-field{display:none}body[data-sm4-mode=gcm] #sm4Padding{opacity:.58}@media (max-width: 1260px){.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.field-grid{grid-template-columns:1fr}}@media (max-width: 1020px){.shell{border-radius:0;margin:0;min-height:100vh;padding:24px 16px}.workspace,.field-grid{grid-template-columns:1fr}.workspace{margin-top:28px}.panel{padding:20px}.panel-title,.tabs{gap:24px}}