.hanko-app .hidden{display:none!important}.hanko-app .hanko-lead h2{margin:0 0 8px;font-size:clamp(1.25rem,2.4vw,1.6rem);line-height:1.4}.hanko-app .hanko-lead p{color:var(--color-muted);margin:0 0 20px}.hanko-app .mode-switch{border:1px solid var(--color-line);background:var(--color-white);border-radius:10px;grid-template-columns:1fr 1fr;max-width:420px;margin:0 0 20px;display:grid;overflow:hidden}.hanko-app .mode-switch button{background:var(--color-white);min-height:44px;color:var(--color-ink);cursor:pointer;border:0;font-weight:700}.hanko-app .mode-switch button.is-active{background:var(--color-primary);color:var(--color-white)}.hanko-app .maker{background:var(--color-white);border:1px solid var(--color-line);border-radius:var(--radius);box-shadow:var(--shadow);grid-template-columns:1.05fr .95fr;display:grid;overflow:hidden}.hanko-app .controls{border-right:1px solid var(--color-line);flex-direction:column;gap:22px;padding:28px 32px;display:flex}.hanko-app .field{border:0;margin:0;padding:0;display:block}.hanko-app .field>span,.hanko-app .field legend{align-items:center;gap:10px;width:100%;margin-bottom:10px;font-size:.94rem;font-weight:700;display:flex}.hanko-app .field b{background:var(--color-surface-alt);width:24px;height:24px;color:var(--color-primary-dark);border-radius:50%;place-items:center;font-size:.78rem;display:grid}.hanko-app .field input:not(.range){border:1px solid var(--color-line);background:var(--color-white);width:100%;height:52px;color:var(--color-ink);border-radius:8px;outline:none;padding:0 16px;font-size:1.1rem}.hanko-app .field input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #7ab82e38}.hanko-app .field small{color:var(--color-muted);margin-top:7px;font-size:.78rem;display:block}.hanko-app .layout-options{flex-direction:column;gap:8px;margin-bottom:14px;display:flex}.hanko-app .choice-switch{border:1px solid var(--color-line);background:var(--color-white);border-radius:8px;grid-template-columns:1fr 1fr;display:grid;overflow:hidden}.hanko-app .choice-switch button{background:var(--color-white);min-height:38px;color:var(--color-ink);cursor:pointer;border:0;font-weight:700}.hanko-app .choice-switch button.is-active{background:var(--color-ink);color:var(--color-white)}.hanko-app .subfield{margin-top:12px;display:block}.hanko-app .subfield>span{color:var(--color-muted);margin-bottom:6px;font-size:.8rem;font-weight:700;display:block}.hanko-app .font-picker{flex-direction:column;gap:10px;display:flex}.hanko-app .font-row{grid-template-columns:64px 1fr;align-items:center;gap:10px;display:grid}.hanko-app .font-row>span{color:var(--color-muted);font-size:.78rem;font-weight:700}.hanko-app .font-options{border:1px solid var(--color-line);border-radius:8px;grid-template-columns:repeat(3,1fr);display:grid;overflow:hidden}.hanko-app .font-options.single{grid-template-columns:1fr}.hanko-app .font-options button{border:0;border-right:1px solid var(--color-line);background:var(--color-white);min-height:46px;color:var(--color-ink);cursor:pointer;padding:4px 6px;font-size:.86rem}.hanko-app .font-options button:last-child{border-right:0}.hanko-app .font-options button.is-active{background:var(--color-ink);color:var(--color-white)}.hanko-app .colors{flex-wrap:wrap;gap:12px;display:flex}.hanko-app .colors button{border:3px solid var(--color-white);width:34px;height:34px;box-shadow:0 0 0 1px var(--color-line);cursor:pointer;border-radius:50%}.hanko-app .colors button.is-selected{box-shadow:0 0 0 3px var(--color-primary)}.hanko-app output{color:var(--color-muted);margin-left:auto;font-size:.82rem;font-weight:400}.hanko-app .range{width:100%;accent-color:var(--color-primary)}.hanko-preview{background:var(--color-surface);flex-direction:column;justify-content:center;align-items:center;min-height:520px;padding:40px 28px;display:flex;position:relative}.hanko-preview__label{color:var(--color-muted);letter-spacing:.08em;font-size:.72rem;font-weight:700;position:absolute;top:18px;left:22px}.hanko-preview .paper{aspect-ratio:1;border:1px solid var(--color-line);background-color:#fff;background-image:linear-gradient(45deg,#eef2e9 25%,#0000 25%),linear-gradient(-45deg,#eef2e9 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#eef2e9 75%),linear-gradient(-45deg,#0000 75%,#eef2e9 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;border-radius:8px;place-items:center;width:min(300px,78vw);display:grid}.hanko-preview .paper canvas{width:84%;height:84%}.hanko-preview .paper.is-signature{aspect-ratio:3;width:min(480px,82vw)}.hanko-preview .paper.is-signature canvas{width:92%;height:88%}.hanko-preview .btn{margin-top:24px}.hanko-preview p{color:var(--color-muted);margin:12px 0 0;font-size:.78rem}@media (width<=760px){.hanko-app .maker{grid-template-columns:1fr}.hanko-app .controls{border-right:0;border-bottom:1px solid var(--color-line);padding:24px 20px}.hanko-preview{min-height:440px;padding:48px 16px 28px}.hanko-app .font-row{grid-template-columns:1fr}.hanko-app .font-options button{font-size:.78rem}.hanko-preview .btn{width:100%}}
