.raskroy-wrap { max-width: 1200px; margin: 0 auto; }
.raskroy-layout { display: grid; grid-template-columns: 380px 1fr; gap: 24px; }

@media (max-width: 768px) {
    .raskroy-layout { grid-template-columns: 1fr; }
}

.raskroy-input-panel, .raskroy-result-panel {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px;
}

.raskroy-field { margin-bottom: 12px; }
.raskroy-field label { display: block; font-size: 13px; color: #666; margin-bottom: 4px; }
.raskroy-field input, .raskroy-field select, .raskroy-field textarea {
    width: 100%; padding: 8px 10px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px;
    box-sizing: border-box;
}
.raskroy-field-row { display: flex; gap: 10px; }
.raskroy-field-row .raskroy-field { flex: 1; }

.raskroy-checkbox { margin-bottom: 16px; }
.raskroy-checkbox label { display: inline; font-size: 13px; }

.raskroy-part-row { display: flex; gap: 6px; margin-bottom: 8px; align-items: center; }
.raskroy-part-row input { width: 80px; padding: 6px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
.raskroy-p-del { background: #d00; color: #fff; border: none; border-radius: 4px; width: 28px; height: 28px; cursor: pointer; font-size: 16px; line-height: 1; flex-shrink: 0; }

.raskroy-btn-primary { width: 100%; padding: 12px; background: #008eb6; color: #fff; border: none; border-radius: 6px; font-size: 15px; cursor: pointer; margin-top: 12px; }
.raskroy-btn-primary:hover { background: #008eb6; }
.raskroy-btn-primary:disabled { background: #999; cursor: default; }
.raskroy-btn-secondary { padding: 8px 16px; background: #f0f0f0; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; margin-bottom: 16px; }

.raskroy-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
@media (max-width: 480px) {
    .raskroy-stats { grid-template-columns: repeat(2, 1fr); }
}
.raskroy-stat { text-align: center; padding: 10px; background: #f8f8f8; border-radius: 6px; }
.raskroy-stat-label { display: block; font-size: 12px; color: #888; margin-bottom: 4px; }
.raskroy-stat-value { font-size: 20px; font-weight: 600; color: #2563eb; }

.raskroy-hint { color: #999; text-align: center; padding: 60px 20px; font-size: 15px; }

.raskroy-order-form { margin-top: 24px; padding-top: 20px; border-top: 1px solid #eee; }
.raskroy-order-form h3 { margin-bottom: 12px; }

#raskroy-canvas-container canvas { margin-bottom: 16px; max-width: 100%; }
#raskroy-canvas-container h4 { margin: 12px 0 8px; font-size: 15px; color: #555; }