.tool-double-sided-keychain-generator > .keychain-tool-container{
    width:min(1540px,calc(100% - 32px));
    max-width:none;
}
.tool-double-sided-keychain-generator .keychain-generator{
    --kc-accent:#5b7cff;
    --kc-accent-hover:#4869ed;
    --kc-navy:#14213a;
    --kc-muted:#65748b;
    --kc-line:#dce4ef;
    display:grid;
    gap:22px;
}
.tool-double-sided-keychain-generator .keychain-toolbar-card,
.tool-double-sided-keychain-generator .keychain-editor,
.tool-double-sided-keychain-generator .keychain-production{
    border:1px solid var(--kc-line);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 30px rgba(9,28,56,.05);
}
.tool-double-sided-keychain-generator .keychain-toolbar-card{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:24px;
    padding:20px;
}
.tool-double-sided-keychain-generator .keychain-label{
    display:block;
    margin-bottom:8px;
    color:var(--kc-navy);
    font-weight:800;
}
.tool-double-sided-keychain-generator .keychain-segmented{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.tool-double-sided-keychain-generator button{
    min-height:42px;
    padding:9px 14px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    background:#fff;
    color:var(--kc-navy);
    font:inherit;
    font-weight:750;
    cursor:pointer;
}
.tool-double-sided-keychain-generator button:hover{border-color:var(--kc-accent);}
.tool-double-sided-keychain-generator button:disabled{opacity:.45;cursor:not-allowed;}
.tool-double-sided-keychain-generator .keychain-orientation.is-active,
.tool-double-sided-keychain-generator .keychain-upload,
.tool-double-sided-keychain-generator .keychain-downloads button:not(.is-secondary){
    border-color:var(--kc-accent);
    background:var(--kc-accent);
    color:#fff;
}
.tool-double-sided-keychain-generator .keychain-orientation.is-active:hover,
.tool-double-sided-keychain-generator .keychain-upload:hover,
.tool-double-sided-keychain-generator .keychain-downloads button:not(.is-secondary):hover{
    border-color:var(--kc-accent-hover);
    background:var(--kc-accent-hover);
}
.tool-double-sided-keychain-generator .keychain-copy-front{
    display:flex;
    align-items:center;
    gap:9px;
    font-weight:750;
}
.tool-double-sided-keychain-generator .keychain-copy-front input{width:auto;}
.tool-double-sided-keychain-generator .keychain-editor-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px;
}
.tool-double-sided-keychain-generator .keychain-editor{padding:18px;min-width:0;}
.tool-double-sided-keychain-generator .keychain-editor-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}
.tool-double-sided-keychain-generator .keychain-editor-head h2{margin:0 0 3px;font-size:23px;}
.tool-double-sided-keychain-generator .keychain-editor-head span{color:var(--kc-muted);font-size:13px;font-weight:700;}
.tool-double-sided-keychain-generator .keychain-canvas-wrap{
    position:relative;
    width:100%;
    aspect-ratio:50/35;
    overflow:hidden;
    border:1px solid #d5deea;
    border-radius:13px;
    background:#e9edf2;
    cursor:grab;
    touch-action:none;
}
.tool-double-sided-keychain-generator .keychain-editor.is-vertical .keychain-canvas-wrap{
    width:min(420px,100%);
    margin-inline:auto;
    aspect-ratio:35/50;
}
.tool-double-sided-keychain-generator .keychain-editor-canvas{display:block;width:100%;height:100%;}
.tool-double-sided-keychain-generator .keychain-empty{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    padding:20px;
    color:#718096;
    text-align:center;
    font-weight:750;
    pointer-events:none;
}
.tool-double-sided-keychain-generator .keychain-editor.has-image .keychain-empty{display:none;}
.tool-double-sided-keychain-generator .keychain-controls{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    margin-top:12px;
}
.tool-double-sided-keychain-generator .keychain-control.is-active{
    border-color:var(--kc-navy);
    background:var(--kc-navy);
    color:#fff;
}
.tool-double-sided-keychain-generator .keychain-range-row{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:14px;
    margin-top:14px;
    color:var(--kc-navy);
    font-weight:800;
}
.tool-double-sided-keychain-generator .keychain-range-row input{width:100%;}
.tool-double-sided-keychain-generator .keychain-production{padding:22px;}
.tool-double-sided-keychain-generator .keychain-production-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:28px;
    margin-bottom:18px;
}
.tool-double-sided-keychain-generator .keychain-production-head h2{margin-bottom:7px;}
.tool-double-sided-keychain-generator .keychain-production-head p{max-width:760px;margin:0;color:var(--kc-muted);}
.tool-double-sided-keychain-generator .keychain-specs{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px;}
.tool-double-sided-keychain-generator .keychain-specs span{
    padding:6px 9px;
    border-radius:999px;
    background:#edf1ff;
    color:#4361d8;
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
}
.tool-double-sided-keychain-generator .keychain-preview-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.tool-double-sided-keychain-generator .keychain-preview-card{
    padding:14px;
    border:1px solid var(--kc-line);
    border-radius:14px;
    background:#f7f9fc;
    min-width:0;
}
.tool-double-sided-keychain-generator .keychain-preview-card strong{display:block;margin-bottom:9px;}
.tool-double-sided-keychain-generator .keychain-preview{display:block;width:100%;height:auto;border-radius:9px;background:#e9edf2;}
.tool-double-sided-keychain-generator .keychain-preview-card.is-vertical{max-width:430px;}
.tool-double-sided-keychain-generator .keychain-output-lock{
    margin-top:18px;
    padding:14px;
    border:1px solid #f3c7cd;
    border-radius:12px;
    background:#fff5f6;
    color:#8f1d2c;
    font-size:13px;
}
.tool-double-sided-keychain-generator .keychain-downloads{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px;}
.tool-double-sided-keychain-generator .keychain-downloads button{min-width:220px;}
.tool-double-sided-keychain-generator .keychain-downloads .is-secondary{min-width:auto;}
.tool-double-sided-keychain-generator .keychain-status{margin:12px 0 0;color:var(--kc-muted);font-weight:700;}
.tool-double-sided-keychain-generator .keychain-status.is-ok{color:#177752;}
.tool-double-sided-keychain-generator .keychain-status.is-error{color:#a12638;}
@media(max-width:900px){
    .tool-double-sided-keychain-generator .keychain-toolbar-card,
    .tool-double-sided-keychain-generator .keychain-production-head{align-items:flex-start;flex-direction:column;}
    .tool-double-sided-keychain-generator .keychain-editor-grid,
    .tool-double-sided-keychain-generator .keychain-preview-grid{grid-template-columns:1fr;}
    .tool-double-sided-keychain-generator .keychain-specs{justify-content:flex-start;}
}
@media(max-width:620px){
    .tool-double-sided-keychain-generator > .keychain-tool-container{width:min(100% - 20px,1540px);}
    .tool-double-sided-keychain-generator .keychain-controls{grid-template-columns:repeat(2,minmax(0,1fr));}
    .tool-double-sided-keychain-generator .keychain-downloads button{width:100%;min-width:0;}
}
